:root {
  color-scheme: light;
  --hero-start: #e8ecdf;
  --hero-end: #f1efe4;
  --hero-line: #bec8b7;
  --empty-line: #b4bca9;
  --field: #fcfaf4;
  --field-border: #aaafa1;
  --code: #e9e8df;
  --link-hover: #875321;
  --tag: #7f582f;
  --error: #9d2929;
}
html[data-theme='dark'] {
  color-scheme: dark;
  --paper: #17221f;
  --ink: #eee8d8;
  --muted: #b6c0b5;
  --line: #39473e;
  --accent: #d3a16b;
  --hero-start: #22332b;
  --hero-end: #1b2823;
  --hero-line: #465344;
  --empty-line: #617160;
  --field: #202e27;
  --field-border: #657260;
  --code: #24352c;
  --link-hover: #e3b984;
  --tag: #d3a16b;
  --error: #ffa6a0;
}
/* The user's OS preference also works when JavaScript is unavailable. */
@media (prefers-color-scheme: dark) {
  html:not([data-theme]) {
    color-scheme: dark;
    --paper: #17221f; --ink: #eee8d8; --muted: #b6c0b5; --line: #39473e;
    --accent: #d3a16b; --hero-start: #22332b; --hero-end: #1b2823;
    --hero-line: #465344; --empty-line: #617160; --field: #202e27;
    --field-border: #657260; --code: #24352c; --link-hover: #e3b984;
    --tag: #d3a16b; --error: #ffa6a0;
  }
}
a:hover { color: var(--link-hover); }
.hero { background: linear-gradient(110deg, var(--hero-start), var(--hero-end) 70%); }
.hero-foot { border-color: var(--hero-line); }
.empty { border-left-color: var(--empty-line); }
input, select { background: var(--field); border-color: var(--field-border); }
.prose pre { background: var(--code); }
.record .eyebrow { color: var(--tag); }
.errorlist { color: var(--error) !important; }
.skip { background: var(--paper); }
.theme-toggle { font: 12px var(--sans); background: transparent; color: var(--ink); border: 1px solid var(--line); padding: 9px 11px; cursor: pointer; }
.theme-toggle:hover { background: var(--code); }
.theme-toggle[hidden] { display: none; }
@media (max-width: 560px) {
  .site-header { column-gap: 10px; }
  .theme-toggle { font-size: 11px; padding: 8px; }
  .account { gap: 10px; }
}