:root {
  --rounded-font-family:
    -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu",
    "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
  --base-font-family: sans-serif;

  --substrate-background: #eee;
  --substrate-color: #000d;
  --overlay-background: #fff;
  --overlay-color: #000d;
  --link-color: #1643c8;
  --mark-color: #d5fbb0;

  --line-color: #0000000a;
  --shadow-color: #0003;
  --emphatic-color: #000d;

  --shadow: 0.05rem 0.05rem 0 0.02rem var(--shadow-color);
  --border-radius: 0.75rem;
}
@media (prefers-color-scheme: dark) {
  :root {
    --substrate-background: #1a1a1a;
    --substrate-color: #fffa;
    --overlay-background: #1a1a1a;
    --overlay-color: #fffa;
    --link-color: deepskyblue;
    --mark-color: #d5fbb0;

    --line-color: #fff1;
    --shadow-color: #fff3;
    --emphatic-color: #fffc;

    --shadow: 0.05rem 0.05rem 0 0.02rem var(--shadow-color);
  }
}
@media (max-width: 600px) {
  :root {
    font-size: 100%;
  }
}
html {
  --font-family: var(--base-font-family);
  --color: var(--substrate-color);
  --background: var(--substrate-background);

  font: normal 90% / 1.4 var(--font-family);
  color: var(--color);
  background: var(--background);
}
body {
  padding: 0;
  margin: 0;
}
a,
a:hover,
a:active,
a:visited {
  --color: var(--link-color);
  color: var(--link-color);
  text-decoration-thickness: 0.02rem;
  text-underline-offset: 0.18em;
}
/* a:visited {
  color: hsl(from var(--link-color) calc(h + 50) s l / alpha);
} */
p,
table {
  margin: 1em 0;
}
input,
button,
table {
  font: inherit;
  color: inherit;
}
.signature .t {
  font-size: 0.75em;
  letter-spacing: 0.1em;
  margin-left: 0.35em;
}
