/* A stationary title slab and tactile chapter dial around one scrolling story. */
.case-page{height:100dvh;display:flex;flex-direction:column;overflow:hidden;letter-spacing:.015em}.case-page header{width:100%;max-width:1440px;padding:18px 30px;flex:0 0 auto}.case-page .identity{font-size:17px;letter-spacing:.02em}.case-page .identity span{font-size:12px}.case-page .quiet-link{font-size:14px;letter-spacing:.05em}.case-page main{width:100%;max-width:1440px;min-height:0;flex:1;display:flex;flex-direction:column;padding:0 30px 24px;gap:24px}.case-page .case-hero{flex-shrink:0;display:grid;grid-template-columns:1fr 1.15fr;gap:35px;padding:26px 32px;background:linear-gradient(130deg,#8de0bd08,transparent 55%),var(--surface);border-radius:25px;border:1px solid var(--line);box-shadow:var(--shadow),var(--inset)}.case-hero .eyebrow{font-size:12px;letter-spacing:.1em;line-height:1.5;display:block;max-width:500px}.case-name{margin:12px 0 6px;font-size:16px;letter-spacing:.16em}.case-hero h1{font-size:clamp(30px,3.1vw,45px);line-height:1.02;letter-spacing:-.01em;margin:0;max-width:600px}.case-summary{align-self:center}.case-lead{font-size:16px;line-height:1.65;max-width:none}.case-facts{grid-template-columns:repeat(2,1fr);gap:13px 24px;margin:18px 0 0;padding-top:15px}.case-facts dt{font-size:12px;letter-spacing:.09em}.case-facts dd{font-size:14px;margin-top:3px;line-height:1.5}.story-layout{min-height:0;flex:1;display:grid;grid-template-columns:240px minmax(0,1fr);gap:24px}.story-layout aside{position:relative;top:auto;min-height:0;align-self:stretch;display:flex;flex-direction:column;gap:0;padding:20px 15px;border:1px solid var(--line);border-radius:24px;background:var(--surface);box-shadow:var(--shadow),var(--inset);overflow:hidden}.dial-heading{display:flex;justify-content:space-between;gap:8px;font-size:12px;letter-spacing:.1em;padding:0 6px 14px;color:var(--muted)}.chapter-position{font-variant-numeric:tabular-nums}.story-layout aside a{position:relative;display:flex;align-items:center;gap:12px;flex:1 1 0;min-height:0;max-height:84px;padding:6px 12px;border:0;border-radius:12px;font-size:14px;line-height:1.35;letter-spacing:.015em;color:var(--muted);opacity:.6;transition:opacity .5s,color .5s}.story-layout aside a span{font-size:12px;letter-spacing:.05em;margin:0;color:var(--muted);font-variant-numeric:tabular-nums}.story-layout aside a b{font-weight:400}.story-layout aside a[aria-current]{color:var(--text);opacity:1}.story-layout aside a[aria-current] span{color:var(--case-accent)}.story-layout aside a:focus-visible{outline-offset:-4px}.dial-foot{padding:15px 6px 0;display:grid;gap:10px;color:var(--muted);font-size:12px;letter-spacing:.08em}.dial-meter{height:3px;border-radius:3px;background:linear-gradient(to right,var(--case-accent) var(--read,0%),#aab8b023 var(--read,0%))}.story-chapters{overflow-y:auto;overscroll-behavior-y:contain;scroll-behavior:smooth;scrollbar-width:thin;scrollbar-color:var(--case-accent) transparent;min-height:0;padding:28px;border-radius:24px;border:1px solid var(--line);background:linear-gradient(150deg,#8de0bd04,transparent),var(--bg);box-shadow:inset 2px 3px 12px #0003,inset 0 1px 0 #ffffff08;scroll-padding:28px;outline-offset:-5px}.case-cover{margin:0 0 24px;padding:20px;border-radius:20px}.case-cover img{max-height:380px}.case-cover figcaption,.oneli8-cover p{font-size:13px;letter-spacing:.025em}.oneli8-cover{margin-bottom:24px;padding:40px 25px}.oneli8-cover>span{font-size:12px}.oneli8-cover strong{font-size:75px}.story-chapter{border:1px solid var(--line);border-radius:20px;padding:28px;margin:0 0 22px;background:var(--surface);scroll-margin-top:0}.story-chapter .eyebrow{font-size:12px;letter-spacing:.15em}.story-chapter h2{font-size:clamp(29px,3vw,40px);letter-spacing:-.01em;line-height:1.15;margin:18px 0}.story-chapter p{font-size:16px;line-height:1.9;letter-spacing:.012em;max-width:760px}.story-chapter figure{margin:28px -10px;background:var(--raised);border:0}.story-chapter figcaption{font-size:13px;line-height:1.8;padding:18px}.story-chapter figcaption span{font-size:12px}.decision{background:var(--raised);padding:22px}.decision h3{font-size:24px;letter-spacing:0;line-height:1.3}.decision p{font-size:16px}.iteration-table{gap:16px}.iteration-table strong,.iteration-table p{font-size:15px;line-height:1.8}.source-note{font-size:13px;padding:24px 10px}.case-next{margin-top:24px;padding:30px}.case-next .eyebrow{font-size:12px}.case-next h2{margin-top:12px;font-size:38px;letter-spacing:.01em}.case-page footer{padding:30px 6px 10px;max-width:none;font-size:14px;letter-spacing:.03em}.case-actions{flex-wrap:wrap}.case-actions a{font-size:15px}.reading-progress{height:2px}
[data-scheme=light] .story-chapters{box-shadow:inset 2px 3px 14px #88988120,inset 0 1px 0 #fff}
@media(max-height:800px) and (min-width:901px){.case-page header{padding:12px 30px}.case-page main{gap:18px;padding-bottom:18px}.case-page .case-hero{padding:20px 28px;gap:30px}.case-hero h1{font-size:36px}.case-facts{margin-top:12px;padding-top:10px;gap:8px 20px}.case-name{margin-top:9px}.story-layout{gap:18px}.story-layout aside{padding:15px}.dial-heading{padding-bottom:10px}.dial-foot{padding-top:10px}}
@media(max-width:900px){.case-page{height:auto;min-height:100dvh;overflow:visible;display:block}.case-page header{padding:20px}.case-page main{display:block;padding:0 18px 20px}.case-page .case-hero{grid-template-columns:1fr;padding:26px;gap:23px;margin-bottom:22px}.case-hero h1{font-size:44px}.case-lead{font-size:16px}.case-hero .eyebrow{font-size:12px}.case-facts{gap:20px}.story-layout{display:block}.story-layout aside{position:sticky;top:76px;z-index:12;height:auto;padding:12px 15px;display:grid;grid-template-columns:minmax(0,1fr);gap:8px;margin-bottom:20px;background:var(--glass);backdrop-filter:blur(20px)}.dial-heading{grid-column:1/-1;padding:0}.story-layout aside a{height:44px;max-height:none;justify-content:center;padding:0;font-size:13px}.dial-foot{display:none}.story-chapters{overflow:visible;padding:0;border:0;background:none;box-shadow:none;border-radius:0}.story-chapter{padding:25px 22px;scroll-margin-top:208px}.story-chapter h2{font-size:33px}.story-chapter p{font-size:16px}.story-chapter figure{margin:25px -10px}.iteration-table{grid-template-columns:1fr}.case-cover{padding:14px}.case-page .settings{grid-column:auto}.case-page header>.quiet-link{font-size:13px}.case-page .identity span{max-width:170px}.case-page .identity{font-size:15px}.case-page header{gap:14px}.case-page .case-name{font-size:16px}.case-cover>img{max-height:none}.oneli8-cover strong{font-size:60px}}
@media(prefers-reduced-motion:reduce){.chapter-list:before,.story-layout aside a{transition:none}.story-chapters{scroll-behavior:auto}}
@media(min-width:1100px){.story-chapter:has(>.decision){display:grid;grid-template-columns:1fr 1fr;gap:20px}.story-chapter:has(>.decision)>*{grid-column:1/-1}.story-chapter:has(>.decision)>p:first-of-type:has(+.decision){grid-column:1;margin:0}.story-chapter>p:first-of-type+.decision{grid-column:2;margin:0}.story-chapter:has(>.decision)>h2{margin:0 0 5px}.story-chapter:has(>.decision)>figure{margin:5px -10px 15px}}
/* Chapters: every chapter visible at once. Desktop lists them all in the panel; small screens show all as numbered targets plus the current title. */
.chapter-list{position:relative;flex:1;min-height:0;display:flex;flex-direction:column;gap:4px;margin:4px -5px 8px}
.chapter-list:before{content:'';position:absolute;left:0;top:0;width:var(--active-w,0px);height:var(--active-h,0px);transform:translate(var(--active-x,0px),var(--active-y,0px));border-radius:12px;background:linear-gradient(110deg,#8de0bd17,#8de0bd03);border:1px solid #8de0bd35;box-shadow:inset 0 1px 0 #ffffff15,0 7px 18px #0002;transition:transform .55s cubic-bezier(.2,.8,.2,1),width .55s,height .55s;pointer-events:none}
.story-layout aside a b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.story-layout aside a:hover{opacity:.9}
.chapter-current{display:none}
[data-scheme=light] .chapter-list:before{background:linear-gradient(115deg,#fff9,#8de0bd25);border-color:#16a36a35;box-shadow:0 6px 15px #073f3510}
@media(max-height:800px) and (min-width:901px){.chapter-list{gap:2px;margin:2px -5px 6px}.story-layout aside a{font-size:13px;line-height:1.3;padding:3px 12px;gap:10px}}
@media(max-width:900px){.chapter-list{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:2px;margin:0}.story-layout aside a span{display:inline;font-size:13px}.story-layout aside a b{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.chapter-current{display:block;margin:0;padding:0 4px;font-size:14px;line-height:1.4;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}
