.site-header nav .story-active{color:var(--lime)}
.story-hero{position:relative;overflow:hidden;border-bottom:1px solid var(--line);background:radial-gradient(circle at 76% 30%,#24545055,transparent 34%),linear-gradient(130deg,#08151c,#102a31 80%)}
.story-hero:after{content:"";position:absolute;right:-90px;top:-120px;width:540px;height:540px;border:1px solid #b2dcaa24;border-radius:50%;box-shadow:0 0 0 90px #90c2b10a,0 0 0 180px #90c2b108;pointer-events:none}
.story-hero-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(300px,.78fr);gap:65px;align-items:center;min-height:670px;padding-top:110px;padding-bottom:100px;position:relative;z-index:1}
.story-hero .section-kicker{color:var(--lime);margin-bottom:23px}
.story-hero h1{font-size:clamp(54px,6.5vw,100px);line-height:1.02;letter-spacing:-.075em;margin:0 0 26px;max-width:950px}
.story-hero h1 em{font-weight:500;color:var(--lime)}
.story-lead{font-size:clamp(17px,1.6vw,21px);line-height:1.6;color:#d6e3dd;max-width:780px}
.story-actions{display:flex;gap:12px;flex-wrap:wrap;margin:31px 0}
.story-honesty{font:11px/1.6 var(--mono);color:#9fbab5;max-width:650px}
.story-hero-card{background:#0c2028dd;border:1px solid #57817c;border-radius:21px;padding:26px 26px 20px;box-shadow:0 30px 70px #010e1380}
.story-hero-card .mini-label{color:var(--lime);display:block;margin-bottom:14px}
.story-hero-card>div{padding:15px 0;border-top:1px solid #31515a;display:grid;gap:5px}
.story-hero-card strong{font:500 clamp(28px,2.7vw,38px) var(--mono);letter-spacing:-.09em;color:var(--lime);white-space:nowrap}
.story-hero-card span:not(.mini-label){color:#cfddd6;font-size:13px;line-height:1.35}
.story-hero-card p{font:10px/1.6 var(--mono);color:#9aafac;margin:14px 0 0}
.story-layout{display:grid;grid-template-columns:205px minmax(0,1fr);gap:65px;padding-top:80px;padding-bottom:110px}
.story-toc{position:sticky;top:112px;align-self:start;display:flex;flex-direction:column;border-left:1px solid #395a59;padding-left:19px;gap:12px}
.story-toc>span{font:10px/1.5 var(--mono);color:var(--lime);letter-spacing:.1em;margin-bottom:7px}
.story-toc a{font:12px/1.3 var(--mono);color:#a4bcb8;transition:color .2s}
.story-toc a:hover,.story-toc a:focus-visible{color:var(--lime)}
.story-content{min-width:0}
.story-section{scroll-margin-top:105px;padding:0 0 82px;margin:0 0 82px;border-bottom:1px solid #29444b}
.story-section:last-child{margin-bottom:0;border:0;padding-bottom:0}
.story-section .section-kicker{color:var(--lime);margin-bottom:18px}
.story-section h2{font-size:clamp(36px,4vw,62px);letter-spacing:-.055em;line-height:1.12;max-width:790px;margin-bottom:25px}
.story-section>p{font-size:16px;color:#c4d4d1;line-height:1.75;max-width:820px;margin-bottom:22px}
.story-section>p code{font-size:.8em}
.story-equation{margin:28px 0;background:#172f37;border:1px solid #4c6d66;border-radius:17px;padding:28px 30px;overflow-wrap:anywhere}
.story-equation-violet{background:#242b41;border-color:#665f88}
.story-equation .eq-label{display:block;font:10px var(--mono);letter-spacing:.12em;color:var(--lime);margin-bottom:18px}
.story-equation-violet .eq-label{color:#d1c5ff}
.story-equation>div{font:500 clamp(20px,2.5vw,31px)/1.55 var(--sans);letter-spacing:-.025em;color:#f6f8ed}
.story-equation>div small{font-size:.48em;color:#adc4bf;white-space:nowrap;letter-spacing:0}
.story-equation p{color:#a9c3bf;font-size:12px;line-height:1.65;margin:15px 0 0}
.story-equation code{font-size:11px}
.story-equation .eq-factors{display:grid;gap:5px;font-size:clamp(18px,2vw,25px)}
.eq-factors>span{display:block}
.eq-factors>span:not(:first-child){padding-left:22px}
.eq-frac{display:inline-flex;vertical-align:middle;flex-direction:column;align-items:center;font-size:.75em;line-height:1.2;margin:0 5px}
.eq-frac span:first-child{border-bottom:1px solid currentColor;padding:0 7px 3px}
.eq-frac span:last-child{padding:4px 7px 0}
.story-playground{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin:29px 0;padding:28px;background:#102a32;border:1px solid #416a68}
.story-playground .mini-label{color:var(--lime)}
.story-playground h3{font-size:27px;margin:12px 0 5px}
.story-playground p{color:#b7cfc9;font-size:13px;margin-bottom:23px}
.story-playground label{font:11px var(--mono);display:flex;justify-content:space-between;margin:14px 0 7px;color:#c7ddd5}
.story-playground label strong{color:var(--lime)}
.story-playground input[type=range]{width:100%;accent-color:var(--lime)}
.story-math-readout{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.story-math-readout>div{padding:14px;background:#081c24;border:1px solid #2c5153;border-radius:11px}
.story-math-readout span{display:block;color:#9eb8b3;font:9px/1.4 var(--mono);letter-spacing:.06em;min-height:26px}
.story-math-readout strong{display:block;color:#f3fae4;font:500 clamp(20px,2.1vw,29px) var(--mono);margin-top:6px}
.story-section .story-side-note{font:11px/1.7 var(--mono);color:#8eaba8;margin-top:19px}
.story-facts,.story-mini-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:28px 0}
.story-facts>div,.story-mini-grid>div{background:#152b34;border:1px solid #35535a;border-radius:14px;padding:20px}
.story-facts strong{color:var(--lime);font-size:17px}
.story-facts p{font-size:12px;line-height:1.6;color:#b6c9c5;margin:8px 0 0}
.story-steps{display:grid;gap:11px;margin:31px 0}
.story-steps>div{display:grid;grid-template-columns:55px 1fr;gap:17px;background:#132b33;border:1px solid #35545a;border-radius:13px;padding:19px 21px}
.story-steps b{color:var(--lime);font:19px var(--mono)}
.story-steps h3{font-size:19px;margin:0 0 6px}
.story-steps p{font-size:13px;line-height:1.65;color:#b7cbc7;margin:0}
.story-research-note{border-left:3px solid var(--coral);background:#2c302f;padding:19px 22px;margin:26px 0;border-radius:0 12px 12px 0}
.story-research-note .mini-label{color:#ffc0ae}
.story-research-note p{font-size:13px;line-height:1.7;color:#d2d7d0;margin:10px 0 0}
.story-mini-grid>div span{display:block;color:#a8beba;font:10px var(--mono);letter-spacing:.07em}
.story-mini-grid strong{display:block;color:var(--lime);font:500 clamp(24px,2.5vw,36px) var(--mono);margin:15px 0}
.story-mini-grid small{color:#b2c8c2;font:11px/1.5 var(--mono)}
.story-route-example{background:#122934;border:1px solid #435b68;border-radius:17px;padding:25px;margin:30px 0}
.story-route-example .mini-label{color:var(--lime);display:block;margin-bottom:14px}
.story-route-example>div{display:grid;grid-template-columns:130px 1fr 80px;align-items:center;gap:16px;padding:14px 0;border-top:1px solid #34515b}
.story-route-example>div strong{font:500 22px var(--mono);color:#ecf5e8}
.story-route-example>div span{color:#b7cbc5;font-size:13px}
.story-route-example>div b{text-align:right;font:500 19px var(--mono);color:var(--lime)}
.story-route-example p{font-size:12px;line-height:1.6;color:#bad0c9;margin:14px 0 0}
.story-route-example a,.story-sources a{color:var(--lime);text-decoration:underline;text-underline-offset:4px}
.story-validation{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:31px 0}
.story-validation>div{padding:22px;background:#132a33;border:1px solid #3d5961;border-radius:14px}
.story-validation span{font:10px var(--mono);color:var(--lime)}
.story-validation h3{font-size:18px;margin:15px 0 9px}
.story-validation p{font-size:12px;line-height:1.65;color:#b6c9c4;margin:0}
.story-sources ul{padding-left:20px;line-height:2;color:#bed0c9;font-size:13px}
.story-sources li{padding-left:4px}
.story-sources li::marker{color:var(--lime)}
.story-ending{background:#18353a;padding:85px 0 90px;border-top:1px solid #476965}
.story-ending h2{font-size:clamp(38px,4vw,57px);margin:8px 0 28px;letter-spacing:-.05em}
.story-ending .section-kicker{color:var(--lime)}
@media(max-width:1100px){.story-hero-grid{grid-template-columns:1fr;gap:30px;min-height:0}.story-hero-card{max-width:600px}.story-layout{grid-template-columns:170px minmax(0,1fr);gap:35px}.story-validation{grid-template-columns:1fr}}
@media(max-width:760px){.story-layout{display:block;padding-top:44px}.story-toc{position:static;display:flex;flex-direction:row;overflow-x:auto;border-left:0;border-bottom:1px solid #395a59;padding:0 0 14px;margin-bottom:48px;white-space:nowrap;gap:18px}.story-toc>span{display:none}.story-toc a{flex:0 0 auto}.story-section{margin-bottom:64px;padding-bottom:62px}.story-facts,.story-mini-grid{grid-template-columns:1fr}.story-playground{grid-template-columns:1fr}.story-hero-grid{padding-top:85px;padding-bottom:70px}.story-route-example>div{grid-template-columns:95px 1fr 60px}.story-route-example>div strong,.story-route-example>div b{font-size:16px}.story-route-example>div span{font-size:11px}}
@media(max-width:500px){.story-hero h1{font-size:52px}.story-hero-card{padding:19px}.story-hero-card strong{font-size:25px}.story-section h2{font-size:35px}.story-section>p{font-size:14px}.story-equation{padding:20px}.story-equation>div{font-size:18px}.story-steps>div{grid-template-columns:38px 1fr;padding:16px}.story-route-example{padding:18px}.story-route-example>div{grid-template-columns:1fr auto;gap:6px}.story-route-example>div span{grid-column:1/-1;grid-row:2}.story-route-example>div b{grid-column:2;grid-row:1}}
.story-inline-link,.story-section>p>a,.method-note a,.evidence-foot a,.validation-caveat a{color:var(--lime);text-decoration:underline;text-underline-offset:4px}
.story-code{margin:30px 0;background:#0d2630;border:1px solid #466667;border-radius:17px;padding:27px;overflow-x:auto}
.story-code .eq-label{display:block;color:var(--lime);font:10px var(--mono);letter-spacing:.1em;margin-bottom:17px}
.story-code pre{margin:0;white-space:pre-wrap;color:#e6f4e7;font:13px/1.85 var(--mono)}
.story-code code{color:inherit;font-size:inherit}
.story-hero-card strong{font-size:clamp(23px,2.2vw,32px)}
.story-hero-card span:not(.mini-label){font-size:14px}
.story-section strong{color:#e8f4e5}
.story-section .story-facts strong,.story-section .story-mini-grid strong{color:var(--lime)}
.story-section .story-validation span{line-height:1.45}
@media(max-width:500px){.story-code{padding:18px}.story-code pre{font-size:11px}}
/* Beginner pages: keep explanatory copy comfortable on phones. */
.story-facts p,.story-steps p,.story-validation p,.story-research-note p{font-size:14px;line-height:1.7}
.story-hero-card p{font-size:12px}
.story-section .story-side-note{font-size:12px}
@media(max-width:500px){.story-section>p{font-size:16px}.story-facts p,.story-steps p,.story-validation p{font-size:14px}}
