:root {
  --story-ink: #10261f;
  --story-paper: #f5f2e9;
  --story-acid: #d8ff34;
  --story-muted: #66736d;
  --story-line: #d8dcd3;
}

body { background:var(--story-paper); }
.visually-hidden { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
.story-nav { height:78px; }
.story-nav .nav-links { gap:22px; }
.story-hero { padding:82px 0 76px; border-bottom:1px solid var(--story-line); }
.story-hero-grid { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(270px,.65fr); gap:72px; align-items:end; }
.story-kicker { display:flex; align-items:center; gap:10px; margin:0 0 25px; color:#53655c; font-size:11px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.story-kicker::before { content:""; width:8px; height:8px; border-radius:50%; background:#70c87d; box-shadow:0 0 0 5px #dfeedd; }
.story-hero h1 { max-width:900px; font-size:clamp(52px,6.2vw,88px); line-height:.96; }
.story-byline { display:flex; flex-wrap:wrap; align-items:center; gap:8px 0; margin:22px 0 0; color:#64736c; font-size:13px; font-weight:650; }
.story-byline > * { display:inline-flex; align-items:center; }
.story-byline > span:first-child { gap:4px; }
.story-byline > * + *::before { content:""; width:4px; height:4px; margin:0 12px; border-radius:50%; background:#9cab9f; }
.story-byline a { color:#3f5f1c; font-weight:800; text-decoration:underline; text-decoration-color:#8da34f; text-underline-offset:4px; }
.story-byline a:hover { color:#263d10; }
.story-byline a:focus-visible { outline:3px solid #a7c51f; outline-offset:4px; border-radius:2px; }
.story-deck { max-width:720px; margin:28px 0 0; color:var(--story-muted); font-size:clamp(19px,2vw,24px); line-height:1.5; }
.story-hero-note { margin:0; padding:28px; border-radius:14px; background:var(--story-ink); color:#dce5df; font-size:16px; line-height:1.65; }
.story-hero-note strong { display:block; margin-bottom:8px; color:var(--story-acid); font-size:12px; letter-spacing:.12em; text-transform:uppercase; }

.story-intro { display:grid; grid-template-columns:1fr 2.2fr; gap:72px; padding-block:72px; }
.story-intro .section-label { margin:8px 0 0; }
.story-intro-copy { max-width:820px; }
.story-intro-copy p { margin:0 0 20px; color:#35483f; font-size:20px; line-height:1.68; }
.story-thesis { padding:26px 28px; border-left:5px solid var(--story-acid); border-radius:0 10px 10px 0; background:white; color:var(--story-ink)!important; font-size:24px!important; font-weight:750; line-height:1.35!important; }

.story-stage { padding:52px 0 105px; background:#ece9df; }
.story-layout { display:grid; grid-template-columns:minmax(420px,48%) minmax(0,1fr); gap:clamp(32px,3.25vw,48px); align-items:start; }
.story-atlas { position:sticky; top:18px; }
.story-reader { overflow:hidden; padding:10px; border-radius:18px; background:#0b1c16; box-shadow:0 24px 60px #142f2524; }
.story-reader-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:5px 7px 13px 9px; color:#c8d3cc; }
.story-reader-title { min-width:0; }
.story-reader-title strong { display:block; color:white; font-size:14px; }
.story-reader-title span { display:block; overflow:hidden; margin-top:3px; color:#8fa097; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.story-reset { flex:0 0 auto; min-height:36px; padding:0 12px; border:1px solid #52665c; border-radius:8px; background:#152b22; color:var(--story-acid); font-size:11px; font-weight:750; cursor:pointer; }
.story-reset:hover { background:#203b30; }
.story-reset:focus-visible { outline:3px solid var(--story-acid); outline-offset:2px; }
.story-frame { display:block; width:100%; height:min(78vh,820px); min-height:620px; border:0; border-radius:11px; background:#10271f; }
.story-reader-note { display:flex; justify-content:space-between; gap:12px; margin:10px 4px 2px; color:#87998f; font-size:10px; line-height:1.4; }
.story-reader-note span:last-child { text-align:right; }
.story-noscript { display:block; margin:12px 4px 3px; color:white; font-size:12px; }

.story-article { min-width:0; }
.story-step { position:relative; min-height:68vh; padding:36px 0 76px 24px; border-left:2px solid #cfd4ca; scroll-margin-top:20vh; transition:border-color .25s ease; }
.story-step::before { content:""; position:absolute; top:45px; left:-7px; width:12px; height:12px; border:2px solid #ece9df; border-radius:50%; background:#aeb8b0; transition:background .25s ease,box-shadow .25s ease; }
.story-step.is-active { border-left-color:#7a941e; }
.story-step.is-active::before { background:var(--story-acid); box-shadow:0 0 0 5px #d8ff3440; }
.story-step-number { margin:0 0 18px; color:#7d8a83; font-size:11px; font-weight:800; letter-spacing:.14em; }
.story-step h2 { max-width:720px; margin:0 0 25px; font-size:clamp(34px,3.6vw,54px); line-height:1.03; }
.story-step h3 { margin:32px 0 12px; font-size:22px; }
.story-step p { max-width:750px; margin:0 0 20px; color:#40534a; font-size:18px; line-height:1.72; }
.story-step strong { color:var(--story-ink); }
.story-step a { color:#4f6815; text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:4px; }
.story-step blockquote { max-width:720px; margin:30px 0; padding:22px 25px; border-left:4px solid var(--story-acid); background:white; color:var(--story-ink); font-size:22px; font-weight:750; line-height:1.45; }
.evidence-note,.hypothesis-note { max-width:730px; margin:28px 0; padding:20px 22px; border-radius:10px; font-size:15px; line-height:1.6; }
.evidence-note { border:1px solid #c9d6c4; background:#f7faf4; color:#455747; }
.hypothesis-note { border:1px solid #d7c995; background:#fff9dc; color:#5d5129; }
.evidence-note strong,.hypothesis-note strong { display:block; margin-bottom:5px; font-size:11px; letter-spacing:.11em; text-transform:uppercase; }
.story-questions { display:grid; gap:9px; max-width:720px; margin:26px 0; padding:0; list-style:none; }
.story-questions li { padding:14px 16px 14px 42px; border-radius:8px; background:#ffffffb8; color:#35473f; line-height:1.45; }
.story-questions li::before { content:"?"; float:left; margin-left:-27px; color:#70871e; font-size:18px; font-weight:850; }

.story-references { padding:92px 0; background:var(--story-ink); color:#edf2ee; }
.story-references-grid { display:grid; grid-template-columns:.7fr 1.3fr; gap:70px; }
.story-references h2 { margin-top:22px; font-size:clamp(42px,4.8vw,66px); }
.story-references .section-label { color:#9daba3; }
.references-list { display:grid; gap:15px; margin:0; padding:0; list-style:none; counter-reset:reference; }
.references-list li { position:relative; padding:0 0 15px 44px; border-bottom:1px solid #ffffff1c; color:#bac6bf; font-size:14px; line-height:1.55; counter-increment:reference; }
.references-list li::before { content:counter(reference,decimal-leading-zero); position:absolute; left:0; color:var(--story-acid); font-size:11px; font-weight:800; }
.references-list a { color:white; text-decoration:underline; text-underline-offset:4px; }
.story-disclaimer { max-width:760px; margin:38px 0 0; padding:20px; border-left:4px solid var(--story-acid); background:#ffffff0b; color:#bfcac4; font-size:14px; line-height:1.6; }
.story-footer { color:var(--story-muted); }

@media (max-width:1000px) {
  .story-hero-grid,.story-intro,.story-references-grid { grid-template-columns:1fr; gap:36px; }
  .story-layout { grid-template-columns:1fr; gap:36px; }
  .story-atlas { z-index:8; top:0; margin-inline:-24px; padding:10px 24px; background:#ece9dff2; backdrop-filter:blur(10px); }
  .story-frame { height:43vh; min-height:370px; }
  .story-reader-note { display:none; }
  .story-step { min-height:auto; padding-bottom:90px; scroll-margin-top:48vh; }
  .story-nav .nav-links a:not(.button) { display:none; }
}

@media (max-width:600px) {
  .story-nav { height:70px; }
  .story-hero { padding:54px 0 48px; }
  .story-hero h1 { font-size:clamp(45px,13vw,62px); }
  .story-byline { font-size:12px; }
  .story-byline > * + *::before { margin-inline:9px; }
  .story-hero-note { padding:22px; }
  .story-intro { padding-block:50px; }
  .story-intro-copy p { font-size:18px; }
  .story-thesis { font-size:21px!important; }
  .story-stage { padding-top:0; }
  .story-atlas { position:relative; top:auto; z-index:auto; margin-inline:-15px; padding:8px 10px; background:transparent; backdrop-filter:none; }
  .story-reader { padding:7px; border-radius:12px; }
  .story-reader-head { padding-bottom:8px; }
  .story-reader-title strong { font-size:12px; }
  .story-reader-title span { max-width:180px; }
  .story-reset { min-height:32px; padding-inline:9px; font-size:10px; }
  .story-frame { height:min(58vh,480px); min-height:360px; border-radius:8px; }
  .story-step { padding:45px 0 74px 20px; scroll-margin-top:24px; }
  .story-step::before { top:54px; }
  .story-step h2 { font-size:36px; }
  .story-step p { font-size:17px; }
  .story-step blockquote { padding:19px; font-size:20px; }
  .story-references { padding-block:72px; }
}

@media (prefers-reduced-motion:reduce) {
  .story-step,.story-step::before { transition:none; }
}