:root {
  --ink:#142f3c; --ocean:#23576b; --paper:#f7f8f5; --slate:#52636b;
  --gold:#d7ba7d; --border:#dce3e4; --white:#fff; --soft:#eaf0f1;
  --focus:#4c8297; --body:#263d47; --muted-on-ink:#d9e3e6;
  --control-border:#768f9b; --hero-bg:#142f3c; --hero-text:#f7f8f5;
  --hero-hover:#23576b; --on-hero:#fff; --selected-bg:#142f3c; --selected-text:#fff;
  --radius:16px; --header-height:88px;
  font-family:Arial,Helvetica,sans-serif; color:var(--ink); background:var(--paper);
  font-synthesis:none; color-scheme:light;
}
:root[data-theme="dark"] {
  --ink:#e3e8e8; --ocean:#91c4d3; --paper:#10212a; --slate:#afbec3;
  --border:#3b535e; --white:#192c35; --soft:#213944; --body:#ced8db;
  --control-border:#66828e; --focus:#d7ba7d;
  --selected-bg:#91c4d3; --selected-text:#10212a;
  color-scheme:dark;
}
* {box-sizing:border-box}
html {scroll-behavior:smooth;scroll-padding-top:calc(var(--header-height) + 20px)}
body {margin:0}
button,input,select {font:inherit;color:inherit}
a {color:inherit}
button,a,select {-webkit-tap-highlight-color:transparent;touch-action:manipulation}
button,select {cursor:pointer}
svg {width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none}
:focus-visible {outline:3px solid var(--focus);outline-offset:4px}
[hidden] {display:none!important}
.shell {width:min(1440px,calc(100% - 80px));margin-inline:auto}
.sr-only {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link {position:fixed;top:-100px;left:16px;z-index:50;padding:14px 20px;background:var(--white)}
.skip-link:focus {top:12px}
.site-header {position:sticky;top:0;z-index:20;background:var(--paper);border-bottom:1px solid var(--border)}
.header-inner {min-height:var(--header-height);display:flex;align-items:center;justify-content:space-between;gap:24px}
.wordmark {font-family:Georgia,'Times New Roman',serif;letter-spacing:-1.5px;font-size:34px;font-weight:bold;text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
.wordmark span:first-child {font-weight:normal}
.wordmark-dot {color:var(--ocean)}
.header-actions {display:flex;align-items:center;gap:28px}
.theme-toggle {display:grid;place-items:center;width:44px;height:44px;padding:10px;border:1px solid var(--border);border-radius:50%;background:transparent;flex:none}
.theme-toggle:hover {background:var(--soft);border-color:var(--control-border)}
.theme-toggle svg {grid-area:1/1;width:20px;height:20px}
.theme-sun,:root[data-theme="dark"] .theme-moon {display:none}
:root[data-theme="dark"] .theme-sun {display:block}
.text-button {border:0;background:none;padding:12px 4px;font-size:14px;min-height:44px;text-decoration:none;display:inline-flex;align-items:center}
.text-button[aria-current] {text-decoration:underline;text-underline-offset:6px}
.text-button:hover,.wordmark:hover {color:var(--ocean)}
.library-toggle {display:none;align-items:center;gap:8px}
.library-toggle svg {width:20px;height:20px}
.language-picker {display:flex;align-items:center;gap:7px}
.language-picker svg {width:19px;height:19px}
.language-picker select {border:0;background:transparent;min-height:44px;padding:10px 2px;max-width:124px;font-size:14px}
.reading-layout {display:grid;grid-template-columns:288px minmax(0,1fr);gap:48px;align-items:start;min-height:calc(100dvh - var(--header-height) - 90px);padding-block:40px 64px}
.library-panel {position:sticky;top:calc(var(--header-height) + 24px);max-height:calc(100dvh - var(--header-height) - 48px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:0 20px 16px 0;border-right:1px solid var(--border);scroll-padding-top:16px}
.library-heading h2 {font-size:22px;letter-spacing:-.5px;margin:0 0 28px;font-weight:600}
.library-search {margin:0 0 10px}
.library-search label {display:block;font-size:13px;font-weight:600;margin-bottom:9px;color:var(--slate)}
.search-field {position:relative}
.search-field svg {position:absolute;left:13px;top:14px;width:20px;height:20px;color:var(--slate);pointer-events:none}
.library-search input {min-width:0;width:100%;min-height:48px;border:1px solid var(--control-border);border-radius:8px;background:var(--white);padding:11px 12px 11px 42px;font-size:16px}
.library-filter {margin:0 0 24px}
.library-filter select {width:100%;min-height:44px;padding:10px 30px 10px 12px;border:1px solid var(--border);border-radius:8px;background:transparent;font-size:14px}
.question-list {display:flex;flex-direction:column;gap:12px}
.level-group {border-top:1px solid var(--border);padding-top:6px}
.level-group summary {display:flex;align-items:center;gap:10px;min-height:48px;padding:8px 4px;cursor:pointer;list-style:none;font-size:14px;font-weight:600;line-height:1.4;border-radius:4px;touch-action:manipulation}
.level-group summary::-webkit-details-marker {display:none}
.level-group summary::after {content:'';width:7px;height:7px;border-right:1.5px solid var(--slate);border-bottom:1.5px solid var(--slate);transform:rotate(-45deg);margin-left:auto;margin-right:5px;flex:none}
.level-group[open] summary::after {transform:rotate(45deg)}
.level-group summary:hover {color:var(--ocean)}
.level-number {display:grid;place-items:center;min-width:26px;height:26px;border:1px solid var(--border);border-radius:50%;font-size:12px;font-weight:normal;color:var(--slate)}
.level-articles {margin:4px 0 8px 16px;padding:0 0 0 12px;border-left:1px solid var(--border);list-style:none}
.question-link {display:block;padding:10px 12px;min-height:44px;border-radius:5px;text-decoration:none;font-family:Georgia,'Times New Roman',serif;font-size:16px;line-height:1.5;transition:background .18s,color .18s}
.question-link:hover {background:var(--soft)}
.question-link[aria-current] {background:var(--soft);color:var(--ocean);box-shadow:inset 3px 0 var(--ocean)}
.question-title {font-family:Georgia,'Times New Roman',serif;font-size:18px;line-height:1.45}
.question-link svg {width:17px;height:17px;color:var(--ocean)}
.question-link[aria-current] svg {display:none}
.search-empty {margin:24px 14px;font-size:16px;color:var(--slate)}
.reading-main {min-width:0}
.reading-main:focus {outline:none}
.hero {background:var(--hero-bg);border-radius:var(--radius);overflow:hidden}
.hero-copy {padding:40px 42px 32px}
.hero h1 {font-family:Georgia,'Times New Roman',serif;color:var(--hero-text);font-weight:normal;font-size:clamp(38px,3.6vw,54px);line-height:1.12;letter-spacing:-1.6px;margin:0 0 20px;max-width:19ch}
.hero-subtitle {color:var(--muted-on-ink);font-size:16px;line-height:1.6;margin:0}
.sherlock-scene {padding:0;border:0;position:relative;display:block;width:100%;background:var(--hero-bg);isolation:isolate}
.sherlock-scene img {display:block;width:100%;height:auto;aspect-ratio:1.5;object-fit:contain}
.sherlock-scene:focus-visible {outline:3px solid var(--gold);outline-offset:-6px}
.scene-label {position:absolute;bottom:24px;right:24px;display:flex;align-items:center;gap:24px;padding:14px 18px;min-height:48px;border:1px solid #ffffff66;border-radius:8px;background:var(--hero-bg);color:var(--on-hero);font-size:14px;transition:background .18s}
.scene-label svg {width:20px;height:20px}
.sherlock-scene:hover .scene-label {background:var(--hero-hover)}
.reader-view {padding:0 0 24px}
.reader-nav {max-width:760px;margin:0 auto 36px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding-bottom:24px;border-bottom:1px solid var(--border)}
.reading-preferences {display:flex;align-items:center;gap:12px;max-width:100%}
.guide-portrait {width:48px;height:48px;object-fit:cover;object-position:73% 28%;border-radius:50%;flex:none}
.depth-switch {margin:0;padding:4px;display:flex;gap:3px;border:1px solid var(--border);border-radius:30px;background:var(--soft);min-width:0}
.depth-switch label {position:relative;cursor:pointer}
.depth-switch input {position:absolute;opacity:0;width:1px;height:1px}
.depth-switch span {display:block;padding:12px 18px;min-height:44px;border-radius:24px;font-size:14px;line-height:20px;transition:background .18s,color .18s}
.depth-switch input:checked+span {background:var(--selected-bg);color:var(--selected-text)}
.depth-switch input:focus-visible+span {outline:3px solid var(--focus);outline-offset:3px}
.depth-switch label:hover span {box-shadow:inset 0 0 0 1px var(--control-border)}
.article {max-width:760px;margin:auto}
.article h1 {font-family:Georgia,'Times New Roman',serif;font-size:clamp(30px,3vw,36px);line-height:1.2;letter-spacing:-.7px;font-weight:normal;margin:0 0 20px;text-wrap:pretty}
.article h1:focus:not(:focus-visible) {outline:0}
.reading-tools {display:flex;align-items:center;gap:16px;margin-bottom:26px;font-size:13px;color:var(--slate)}
.listen-button {display:inline-flex;align-items:center;gap:9px;padding:9px 13px;border:1px solid var(--border);border-radius:7px;background:transparent;min-height:44px}
.listen-button:hover {background:var(--soft)}
.listen-button svg {width:18px;height:18px}
.article-body {font-family:Georgia,'Times New Roman',serif;font-size:18px;line-height:1.65;color:var(--body);overflow-wrap:break-word;text-align:start}
.article-body p {margin:0 0 18px;text-wrap:pretty}
.article-body strong {font-weight:700;color:var(--ink)}
.article-quotation {font-style:italic}
.article-citation {color:var(--ocean);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.article-citation:hover {text-decoration-thickness:2px}
.article-citation:focus-visible {outline:2px solid var(--focus);outline-offset:3px;border-radius:2px}
.article-body>section:first-child>p:first-of-type {font-size:19px;line-height:1.6;color:var(--ink)}
.article-body h2 {font-family:Arial,Helvetica,sans-serif;font-size:18px;line-height:1.45;margin:30px 0 12px;font-weight:600;color:var(--ink);text-wrap:pretty;hyphens:none}
.article-body>section:first-child h2 {margin-top:0}
.article-contents {margin:0 0 24px;padding:16px 0;border-block:1px solid var(--border)}
.article-contents h2 {margin:0 0 8px;font-size:13px;font-weight:600;color:var(--slate)}
.article-contents ul {margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:20px;align-items:start;max-height:min(38dvh,340px);overflow-y:auto;scrollbar-width:thin;scrollbar-gutter:stable}
.section-link {display:flex;align-items:center;min-height:44px;padding:9px 0;color:var(--slate);font-size:14px;line-height:1.5;text-decoration:none;overflow-wrap:anywhere}
.section-link:hover {color:var(--ocean);text-decoration:underline;text-underline-offset:3px}
.section-link[aria-current] {color:var(--ink);font-weight:600}
.article-body>section,.article-sources li,.attribution-source,.source-passage {scroll-margin-top:0}
.article-body>section:focus-visible,.article-sources li:focus-visible {outline:2px solid var(--focus);outline-offset:8px}
.source-passage {border-left:2px solid var(--border);padding-left:20px;margin:0 0 26px}
.source-passage blockquote {margin:0;font-size:18px;line-height:1.7;font-style:italic}
.source-passage>p:not(.source-reference) {font-size:17px;line-height:1.7;margin:0}
.article-body .source-reference {font-family:Arial,Helvetica,sans-serif;font-size:14px;line-height:1.6;margin:6px 0 24px}
.source-passage .source-reference {margin-bottom:0}
.source-reference a {display:inline-flex;align-items:center;min-height:44px;color:var(--ocean);text-underline-offset:3px;overflow-wrap:anywhere}
.translation-credit {display:block;font-size:12px;color:var(--slate)}
.source-passage:focus-visible {outline:2px solid var(--focus);outline-offset:8px}
.article-attribution {font-size:13px;line-height:1.7;color:var(--slate);margin:34px 0 0}
.article-attribution a,.article-sources a,.article-figure a {color:var(--ocean);text-underline-offset:3px}
.article-sources {border-top:1px solid var(--border);margin-top:40px;padding-top:24px;font-size:14px;line-height:1.7;color:var(--slate);overflow-wrap:anywhere}
.article-sources h2,.article-related h2 {font-size:14px;font-weight:600;margin:0 0 16px}
.article-sources p {margin:6px 0 18px}
.article-sources ol {margin:0;padding-left:24px}
.article-sources li {padding-left:5px;margin-bottom:20px}
.article-sources li:last-child {margin-bottom:0}
.article-related {border-top:1px solid var(--border);margin-top:36px;padding-top:24px}
.related-link {display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:48px;padding:12px 0;color:var(--ocean);text-decoration:none;font-family:Georgia,'Times New Roman',serif;font-size:18px;line-height:1.5}
.related-link:hover {text-decoration:underline;text-underline-offset:4px}
.related-link svg {width:18px;height:18px}
.article-figure {margin:30px 0 36px}
.article-figure img {display:block;width:auto;max-width:100%;height:auto;max-height:430px;object-fit:contain;margin-inline:auto;background:var(--soft);border-radius:8px}
.article-figure figcaption {font-family:Arial,Helvetica,sans-serif;font-size:12px;line-height:1.6;color:var(--slate);margin-top:12px}
.article-figure .image-credit {display:block;margin-top:5px}
.article-sketch {width:140px;max-width:100%;margin:12px 0 18px auto}
.article-sketch img {display:block;width:100%;height:auto;max-height:180px;object-fit:contain;background:transparent;border:0;border-radius:0}
:root[data-theme="dark"] .article-sketch img {background:#f7f8f5;border-radius:8px;padding:6px}
.site-footer {display:flex;justify-content:space-between;align-items:center;gap:24px;border-top:1px solid var(--border);padding-block:20px;font-size:12px;color:var(--slate)}
.site-footer p {margin:0;line-height:1.6}
.site-footer a {padding:10px 0;min-height:44px;display:inline-flex;align-items:center;text-decoration:none}
.site-footer a:hover {text-decoration:underline}
.scroll-top {display:grid;place-items:center;width:44px;height:44px;padding:10px;border:1px solid var(--border);border-radius:50%;background:transparent;color:var(--ink);flex:none}
.scroll-top:hover {background:var(--soft)}
.scroll-top svg {width:20px;height:20px}
.speech-note {border-top:1px solid var(--border);padding-top:18px;font-size:13px}
.noscript-message {padding:20px}
@media(min-width:1200px) {
  .hero {display:grid;grid-template-columns:.7fr 1fr;align-items:center;min-height:500px}
  .hero-copy {padding:40px 0 40px 40px}
  .hero h1 {font-size:46px}
  .hero-subtitle {max-width:24ch}
  .scene-label {bottom:16px;right:16px}
}
@media(max-width:1150px) {
  .shell {width:calc(100% - 48px)}
  .reading-layout {grid-template-columns:248px minmax(0,1fr);gap:32px}
  .library-panel {padding-right:16px}
  .hero-copy {padding:32px}
  .hero h1 {font-size:40px}
  .question-title {font-size:17px}
}
@media(max-width:900px) {
  :root {--header-height:80px}
  .reading-layout {display:block;padding-block:28px 40px;min-height:calc(100dvh - var(--header-height) - 90px)}
  .library-toggle {display:inline-flex}
  .header-actions {gap:20px}
  .library-panel {position:static;max-height:none;overflow:visible;border-right:0;border-bottom:1px solid var(--border);padding:0 0 24px;margin-bottom:28px}
  .library-heading {display:none}
  .library-search {max-width:580px}
  .question-list {display:flex}
  .hero {max-width:760px;margin:auto}
  .hero h1 {font-size:46px}
  .reader-nav {margin-bottom:28px}
  .article {max-width:700px}
}
@media(max-width:760px) {
  :root {--header-height:104px}
  .shell {width:calc(100% - 40px)}
  .header-inner {min-height:var(--header-height);flex-wrap:wrap;gap:0;padding-block:8px;position:relative}
  .theme-toggle {position:absolute;top:8px;right:0}
  .scroll-top {position:absolute;top:8px;right:52px}
  .wordmark {font-size:30px}
  .header-actions {width:100%;justify-content:space-between;gap:12px}
  .text-button,.language-picker select {font-size:14px}
  .language-picker svg {display:none}
  .language-picker select {max-width:100px}
}
@media(max-width:600px) {
  .article-sketch {width:120px}
  .reading-layout {padding-top:20px}
  .hero-copy {padding:28px 26px}
  .hero h1 {font-size:38px;letter-spacing:-1px;margin-bottom:18px}
  .hero-subtitle {font-size:15px;max-width:27ch}
  .scene-label {position:static;justify-content:space-between;border-radius:0;border-width:1px 0 0;min-height:56px;padding:14px 22px}
  .question-list {gap:12px}
  .question-title {font-size:18px}
  .question-link {font-size:17px;padding:10px 12px}
  .article-contents ul {grid-template-columns:1fr}
  .reading-preferences {gap:8px}
  .guide-portrait {width:40px;height:40px}
  .depth-switch span {font-size:13px;padding-inline:12px}
  .reader-nav {padding-bottom:16px;margin-bottom:20px}
  .article h1 {font-size:30px;letter-spacing:-.5px;margin-bottom:16px}
  .article-body {font-size:17px;line-height:1.65}
  .article-body>section:first-child>p:first-of-type {font-size:18px;line-height:1.6}
  .article-body h2 {font-size:17px}
  .reading-tools {flex-wrap:wrap;gap:8px}
  .site-footer {align-items:flex-start;gap:20px}
  .site-footer p {max-width:180px;padding-block:10px}
  .site-footer a {text-align:right;justify-content:flex-end;max-width:140px;line-height:1.6}
}
@media(max-width:360px) {
  .shell {width:calc(100% - 32px)}
  .depth-switch span {font-size:12px;padding-inline:8px}
  .header-actions {gap:8px}
  .library-toggle {gap:5px}
  .hero h1 {font-size:34px}
}
@media(min-width:901px) {
  .library-heading h2 {font-size:20px}
  .question-title,.related-link {font-size:16px}
  .hero-copy {padding-right:32px}
  .hero h1 {font-size:38px;letter-spacing:-1px}
  .article,.reader-nav {max-width:700px}
  .article h1 {font-size:34px;letter-spacing:-.7px}
  .article-body {font-size:17px;line-height:1.65}
  .article-body>section:first-child>p:first-of-type {font-size:18px;line-height:1.6}
  .article-body h2 {font-size:17px}
  .source-passage blockquote {font-size:17px}
  .source-passage>p:not(.source-reference) {font-size:16px}
}
@media(min-width:1400px) {
  .reading-layout {grid-template-columns:260px minmax(0,1fr);gap:40px}
  .reader-view.has-outline>.article {display:grid;grid-template-columns:minmax(0,700px) 180px;gap:0 32px;max-width:none;align-items:start}
  .reader-view.has-outline .article-heading,.reader-view.has-outline .article-body,.reader-view.has-outline .article-attribution,.reader-view.has-outline .article-sources,.reader-view.has-outline .article-related {grid-column:1}
  .reader-view.has-outline .article-contents {grid-column:2;grid-row:1 / span 5;position:sticky;top:calc(var(--header-height) + 28px);margin:0;padding:0 0 0 18px;border-block:0;border-left:1px solid var(--border);max-height:calc(100dvh - var(--header-height) - 56px);overflow-y:auto;scrollbar-width:thin}
  .reader-view.has-outline .article-contents ul {grid-template-columns:1fr;max-height:none;overflow:visible;scrollbar-gutter:auto}
  .reader-view.has-outline .reader-nav {max-width:min(700px,calc(100% - 212px));margin-left:0}
}
@media(prefers-reduced-motion:reduce) {
  html {scroll-behavior:auto}
  *,*::before,*::after {animation:none!important;transition:none!important}
}

/* Keep the pre-rendered reader stable while progressive enhancement starts. */
@media(max-width:900px){html[data-enhancing] .library-panel{display:none}}
