:root{--ui:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
/* Continuous lore adapted from the game's GDD; readable without scripts. */
.story{background:radial-gradient(ellipse at 10% 30%,#24313a35,transparent 55%)}
.story-frontispiece{position:relative;isolation:isolate;min-height:310px;aspect-ratio:3.1;overflow:hidden;border:1px solid var(--line);margin-bottom:64px;background:#111d25}
.story-frontispiece picture,.story-frontispiece img{position:absolute;inset:0;width:100%;height:100%;z-index:-2;object-fit:cover;object-position:50% 42%}
.story-frontispiece:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#080e15eb,#080e1560 65%),linear-gradient(0deg,#080e15a6,transparent)}
.story-frontispiece:after{content:'';position:absolute;inset:12px;border:1px solid #e8cc9d26;pointer-events:none}
.story-frontispiece figcaption{padding:48px;position:relative}
.story-frontispiece .eyebrow{font-size:9px;margin-bottom:22px}
.story-frontispiece figcaption>p{font:400 clamp(26px,3vw,38px)/1.45 var(--serif);letter-spacing:-.025em}
.story-frontispiece small{display:block;margin-top:26px;color:#aeb5b9;font:9px/1.6 var(--ui)}
.story-reading{display:grid;grid-template-columns:250px minmax(0,1fr);gap:70px;align-items:start}
.story-index{position:sticky;top:102px}
.story-index>.eyebrow{font-size:9px;margin-bottom:18px}
.story-index ol{list-style:none;padding:0;margin:0;border-left:1px solid var(--line)}
.story-index ol a{display:flex;gap:13px;align-items:baseline;padding:12px 16px;color:var(--muted);font:11px/1.7 var(--ui);border-left:1px solid transparent;margin-left:-1px;transition:color .2s,background .2s}
.story-index ol a>span{font:10px var(--serif);color:var(--gold-lo)}
.story-index ol a:hover,.story-index ol a[aria-current]{color:var(--gold-hi);border-left-color:var(--gold);background:linear-gradient(90deg,#c6a77710,transparent)}
.story-index>.text-link{margin-top:28px;font-size:10px}
.story-manuscript{min-width:0;max-width:720px}
.story-chapter{scroll-margin-top:110px;padding:0 0 44px;margin-bottom:44px;border-bottom:1px solid var(--line)}
.chapter-label{font:9px/1.8 var(--ui);letter-spacing:.18em;color:var(--gold);margin-bottom:14px}
.story-chapter h3{font-size:clamp(25px,2.5vw,32px);line-height:1.4;max-width:26ch;margin-bottom:24px;letter-spacing:-.02em;text-wrap:balance}
.story-chapter p:not(.chapter-label){font-size:19px;line-height:1.85;color:#bfc6ca;margin-top:18px}
.story-chapter strong{font-weight:500;color:var(--gold-hi)}
.story-opening:first-letter{float:left;font:400 65px/.9 var(--serif);color:var(--gold);margin:7px 12px 0 0}
.story-chapter:last-child{border-bottom:0;margin-bottom:0;padding-bottom:0}
.story-journey{list-style:none;margin:32px 0 0;padding:0 0 0 26px;border-left:1px solid var(--gold-lo)}
.story-journey li{position:relative;padding-bottom:30px}
.story-journey li:last-child{padding-bottom:0}
.story-journey li:before{content:'';position:absolute;top:5px;left:-30px;width:7px;height:7px;background:var(--gold);transform:rotate(45deg);box-shadow:0 0 0 5px var(--bg)}
.story-journey .chapter-label{font-size:8px;margin:0 0 9px}
.story-journey h4{font:400 22px/1.4 var(--serif);color:var(--gold-hi)}
.story-journey p:not(.chapter-label){font-size:18px;line-height:1.8;margin-top:12px}
.story-revelation{margin-top:32px;border:1px solid var(--line);background:#0e151b}
.story-revelation summary{display:flex;align-items:center;justify-content:space-between;gap:22px;padding:23px;cursor:pointer;font:400 17px/1.5 var(--serif);color:var(--gold-hi);list-style:none}
.story-revelation summary::-webkit-details-marker{display:none}
.story-revelation summary:hover{background:#c6a77708}
.story-revelation summary small{display:block;font:10px/1.6 var(--ui);color:var(--muted);margin-top:7px}
.revelation-sign{font:300 28px var(--ui);transition:transform .2s;flex-shrink:0}
.story-revelation[open] .revelation-sign{transform:rotate(45deg)}
.story-revelation>div{padding:0 23px 26px}
.story-revelation>div p:not(.chapter-label){font-size:18px;margin-top:12px}
.story-ending{margin-top:40px}
.story-ending>p:not(.chapter-label){font:400 21px/1.7 var(--body);color:var(--text)}
.story-ending .btn{margin-top:25px}
@media(max-width:1100px){.story-reading{grid-template-columns:210px minmax(0,1fr);gap:40px}.story-index ol a{font-size:10px;padding-inline:12px}}
@media(max-width:900px){.story-reading{grid-template-columns:1fr;gap:38px}.story-index{position:static}.story-index ol{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-left:0;border-top:1px solid var(--line);padding-top:12px;gap:2px 14px}.story-index ol a{font-size:11px;margin-left:0}.story-index>.text-link{display:none}.story-manuscript{max-width:680px;margin-inline:auto}.story-frontispiece{margin-bottom:35px}}
@media(max-width:640px){.story-frontispiece{min-height:300px;aspect-ratio:auto}.story-frontispiece figcaption{padding:40px 25px}.story-frontispiece img{object-position:65% center}.story-frontispiece:before{background:linear-gradient(90deg,#080e15e8,#080e1550),linear-gradient(0deg,#080e15b0,transparent)}.story-frontispiece figcaption>p{font-size:27px}.story-index ol{gap:3px 8px}.story-index ol a{font-size:10px;gap:8px;padding:10px 8px}.story-chapter{padding-bottom:32px;margin-bottom:32px;scroll-margin-top:90px}.story-chapter h3{font-size:27px}.story-chapter p:not(.chapter-label){font-size:18px;line-height:1.8}.story-journey{padding-left:20px}.story-journey li:before{left:-24px}.story-journey h4{font-size:21px}.story-revelation summary{font-size:16px;padding:20px}.story-revelation>div{padding:0 20px 22px}.story-revelation>div p:not(.chapter-label){font-size:17px}.story-ending>p:not(.chapter-label){font-size:20px}}
@media(max-width:360px){.story-index ol{grid-template-columns:1fr}}

.story{overflow:visible}.story h3{font-family:var(--serif);font-weight:400}.story em{font-style:normal;color:var(--gold)}