/* Both reading surfaces follow device appearance; book artwork is untouched. */
:root { color-scheme: light dark; }
@media (prefers-color-scheme: dark) {
  :root {
    --paper: #181a19;
    --ink: #e5dfd7;
    --muted: #b2aaa2;
    --accent: #dfafbf;
    --note: #d6a9b7;
    --rule: #59534f;
    color: var(--ink);
    background: var(--paper);
  }
  :root body, #stage, #page-host .sheet {
    color: var(--ink);
    background: var(--paper);
  }
  ::selection { color: #fff5f8; background: #684555; }
  input { border-color: var(--rule); accent-color: var(--accent); }
  input::placeholder, h2, footer, #empty, .reader-header, .reader-footer,
  .brand, #progress, .edition, .contents span, .contents label, legend,
  .help, details, #page-host[role=status] { color: var(--muted); }
  footer, .contents, details { border-color: var(--rule); }
  a, button:hover, .book:hover { color: var(--accent); }
  .book { color: var(--ink); }
  input:focus { border-color: var(--accent); }
  .book:focus-visible, button:focus-visible, select:focus-visible,
  summary:focus-visible, a:focus-visible { outline-color: var(--accent); }
  dialog, select, option { background: #222522; color: var(--ink); border-color: var(--rule); }
  dialog::backdrop { background: #0008; }
  #page-host .book-cover { background: #222522; color: var(--ink); }
  #page-host .cover-rule { background: var(--accent); }
  #page-host .cover-edition, #page-host .chapter-number,
  #page-host .folio { color: var(--muted); }
  #page-host .imprint, #page-host .title-note, #page-host .legend-credit,
  #page-host .note-source, #page-host .inline-note, #page-host .reference,
  #page-host .annotation-panel, #page-host .beside-note,
  #page-host .commentary-heading { color: var(--note); }
}