/* Reader accessibility without changing the book's layout or illustrations. */
:root {
  color-scheme: light;
  --accent: #a43e2c;
  --accent-2: #0b7469;
  --reader-focus: #2152df;
  --reader-control-border: #778698;
  --reader-error: #a52732;
}
html[data-theme="dark"] {
  color-scheme: dark;
  --bg: #17191e;
  --paper: #20262e;
  --paper-2: #29323e;
  --ink: #e8edf4;
  --muted: #bac6d5;
  --line: #566477;
  --accent: #f6b3a5;
  --accent-2: #88ddcc;
  --accent-3: #b5cff8;
  --reader-focus: #b5cff8;
  --reader-control-border: #8290a3;
  --reader-error: #ffb2b8;
  --shadow: 0 14px 38px #0004;
}
.book-page :is(a, button, input, textarea, select, summary, [tabindex]):focus-visible { outline: 3px solid var(--reader-focus); outline-offset: 4px; }
.book-page :is(p, li) a { text-decoration: underline; text-underline-offset: .2em; }
.book-page button { min-height: 44px; }
.book-page button:disabled { cursor: not-allowed; opacity: .6; transform: none; }
.book-page :is(input, textarea, select) { border-color: var(--reader-control-border); font-size: 16px; }
.book-page :is(input, textarea)::placeholder { color: var(--muted); opacity: 1; }
.book-page [aria-invalid="true"] { border: 2px solid var(--reader-error); }
.book-page .book-status { font-size: 15px; color: var(--accent-2); min-height: 1.5em; }
.book-page .book-status:empty { display: none; }
.book-page #cycleStatus { color: var(--ink); }
.book-page .visual { overflow-x: auto; }
.book-page .visual table { min-width: 560px; }
.book-page .template-box, .book-page .copy-output { overflow-wrap: anywhere; }
.book-page .hero h1 { font-size: 72px; }
.book-page .section h2 { font-size: 44px; }
.book-page .book-tools { display: flex; justify-content: flex-end; gap: 8px; margin-bottom: 12px; }
.book-page .book-tool { display: inline-grid; place-items: center; width: 44px; height: 44px; padding: 0; background: var(--paper); color: var(--ink); border: 1px solid var(--reader-control-border); border-radius: 6px; }
.book-page .book-tool img { width: 20px; height: 20px; }
.book-page .book-return img { transform: rotate(-90deg); }
.book-skip { position: fixed; z-index: 100; top: 8px; left: 8px; padding: 10px 16px; background: var(--paper); color: var(--ink); transform: translateY(-180%); }
.book-skip:focus { transform: none; }
html[data-theme="dark"] .book-page :is(.sidebar, .panel, .photo-frame) { background: var(--paper); border-color: var(--line); }
html[data-theme="dark"] .book-page :is(.card, .story-box, .test-item, .principle, .manifesto div, .hero-badges span, .chapter-mark, .copy-output, .sidebar-link, .toc a, .button-tertiary, .visual) { background: var(--paper-2); border-color: var(--line); color: var(--ink); }
html[data-theme="dark"] .book-page :is(.hero-quote, .quote-panel, .result-box) { background: #183351; color: #ecf2fa; }
html[data-theme="dark"] .book-page :is(.hero-quote span, .quote-panel small) { color: #c0d0e3; }
html[data-theme="dark"] .book-page .hero-visual { background: #29323e; }
html[data-theme="dark"] .book-page .problem-box { background: #352725; border-color: #82605b; }
html[data-theme="dark"] .book-page .template-box { background: #1b222c; color: var(--ink); border-color: var(--line); }
html[data-theme="dark"] .book-page :is(input, textarea, select, .answer-btn) { background: #161d26; color: var(--ink); border-color: var(--reader-control-border); }
html[data-theme="dark"] .book-page .answer-btn.selected { background: #29443f; border: 2px solid #88ddcc; color: #dcfff4; }
html[data-theme="dark"] .book-page .answer-btn.selected[data-value="0"] { background: #47312b; border-color: #f6b3a5; color: #ffe5df; }
html[data-theme="dark"] .book-page .button-primary { background: #3265dc; color: #fff; }
html[data-theme="dark"] .book-page .button-secondary { background: #146c5d; color: #fff; }
html[data-theme="dark"] .book-page .principle-num { background: #a43e2c; color: #fff; }
html[data-theme="dark"] .book-page .book-tool img { filter: invert(1); }
@media (max-width: 1040px) {
  html { scroll-padding-top: 180px; }
  .book-page .sidebar { position: sticky; top: 0; z-index: 30; background: var(--paper); }
  .book-page .book-tools { position: absolute; right: 12px; top: 12px; }
  .book-page .brand { padding-right: 100px; min-height: 48px; }
  .book-page .toc a { min-height: 44px; }
}
@media (max-width: 600px) {
  .book-page .hero h1 { font-size: 46px; }
  .book-page .section h2 { font-size: 32px; overflow-wrap: anywhere; }
  .book-page .card h3 { font-size: 25px; }
  .book-page .book-tools { gap: 6px; }
}
@media (max-height: 500px) { .book-page .sidebar { position: static; } html { scroll-padding-top: 12px; } }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .book-page *, .book-page *::before, .book-page *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}
html:not(.ed-js):not(.ed-boot) .book-page button { display: none; }
@media print {
  .book-page { background: #fff !important; color: #111 !important; }
  .book-page .book-tools, .book-page .book-status, .book-page .book-skip { display: none !important; }
  .book-page .panel, .book-page .card, .book-page .template-box { background: #fff !important; color: #111 !important; }
}
