:root {
  color-scheme: light;
  --landing-bg: #dfe7e3;
  --landing-ink: #14201c;
  --landing-muted: #64716b;
  --landing-line: #aab7b1;
}

html[data-theme="night"] {
  color-scheme: dark;
  --paper: #0b100e;
  --paper-deep: #111815;
  --ink: #edf4f0;
  --muted: #97a69f;
  --line: #2b3631;
  --blue: #6f8fff;
  --blue-dark: #91a7ff;
  --signal: #d9ff4f;
  --white: #131b18;
  --landing-bg: #020605;
  --landing-ink: #e9f4ef;
  --landing-muted: #7f938a;
  --landing-line: #23302a;
}

body { transition: color .25s ease, background-color .25s ease; }
.topic[open], .theme-toggle, .landing {
  transition: color .25s ease, background-color .25s ease, border-color .25s ease;
}

html[data-theme="night"] .topic summary:hover { background: rgba(255, 255, 255, .025); }
html[data-theme="night"] pre { color: #d7eee4; background: #050908; }
html[data-theme="night"] .lesson-aside { border-color: #34423b; }
html[data-theme="night"] .read-button.is-read {
  color: var(--paper);
  background: var(--ink);
}