:root{--story-gold:#f4ba69;--story-ivory:#f3edde;--story-vh:100svh;--credit-height:70px}
.story-page #app{isolation:isolate}
.story-page body::before{content:none;display:none}
.story-page .site-page #app>main{position:relative;z-index:1;background:transparent;scroll-behavior:auto}
.story-backdrop{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;background:#10130f url('/assets/cinema/raven-poster.jpg') center/cover no-repeat}
.story-film{display:block;width:100%;height:100%;max-width:none;object-fit:cover;object-position:var(--film-x,50%) 50%;filter:none;opacity:1}
.story-backdrop-shade{position:absolute;inset:0;background:rgba(0,0,0,.18)}
[data-story-state=loading] .story-film,[data-story-state=static] .story-film{visibility:hidden}
.story-chapter{position:relative;display:flex;align-items:center;min-height:var(--story-vh);padding:120px 6.4% calc(var(--credit-height) + 65px);color:var(--story-ivory);scroll-margin-top:100px}
.story-panel{width:100%;position:relative}
.story-chapter h1,.story-chapter h2{font-family:Georgia,'Times New Roman',serif;font-weight:400;letter-spacing:-.065em;line-height:.95;text-transform:none;margin:0;text-shadow:0 2px 22px #0005}
.story-chapter a{color:inherit;text-decoration:none}
.story-chapter a:hover{color:var(--story-gold)}
.story-chapter a:focus-visible{outline:2px solid var(--story-gold);outline-offset:10px;border-radius:2px}
.story-intro h1{font-size:clamp(76px,13vw,212px);white-space:nowrap}
.story-intro h1 em{font-weight:400;color:var(--story-gold)}
.story-intro .cinema-kicker{font:500 10px/1.5 var(--body);letter-spacing:.23em;text-transform:uppercase;color:#f4eddf;margin:0 0 25px}
.story-scroll-cue{display:inline-flex;align-items:center;gap:20px;min-height:44px;font:400 11px/1.4 var(--body);letter-spacing:.09em;margin-top:30px}
.scroll-stroke{display:block;width:1px;height:32px;background:linear-gradient(var(--story-gold),transparent)}
.impact-line{font:400 13px/1.5 var(--body);letter-spacing:.02em;margin:26px 0 0 5px;color:var(--story-ivory);text-shadow:0 2px 8px #000}
.impact-final{font-size:clamp(80px,12vw,190px)}
.collaborations{position:fixed;z-index:20;inset:auto 0 0;display:flex;gap:28px;align-items:center;padding:0 6.4% env(safe-area-inset-bottom);height:calc(var(--credit-height) + env(safe-area-inset-bottom));color:#e7dfce;border-top:1px solid #fff2;background:#080b0a78;backdrop-filter:blur(12px)}
.collaborations-label{font:500 9px/1.5 var(--body);letter-spacing:.12em;text-transform:uppercase;flex:0 0 120px}
.collaborations-viewport{overflow-x:auto;overflow-y:hidden;scrollbar-width:none;min-width:0;flex:1;overscroll-behavior-x:contain;mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent);padding:4px 0}
.collaborations-viewport::-webkit-scrollbar{display:none}
.collaborations-viewport:focus-visible{outline:1px solid var(--story-gold);outline-offset:2px;mask-image:none}
.collaborations ul{display:flex;gap:30px;align-items:center;list-style:none;margin:0;padding:0 8px;width:max-content}
.collaboration{width:140px;height:48px;display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0}
.collaboration img{display:block;width:auto;height:auto;max-width:128px;max-height:31px;object-fit:contain;filter:brightness(0) invert(1);opacity:.78}
.collaboration.detail img{filter:grayscale(1);mix-blend-mode:screen;max-height:45px}
.collaboration.freedom img{filter:grayscale(1);mix-blend-mode:screen;max-height:none;width:132px;max-width:132px}
.story-progress{position:fixed;bottom:calc(var(--credit-height) + env(safe-area-inset-bottom));left:0;right:0;height:1px;z-index:21;pointer-events:none}
.story-progress i{display:block;width:100%;height:100%;background:var(--story-gold);transform-origin:left;transform:scaleX(0)}
@media(max-width:900px),(hover:none) and (pointer:coarse){:root{--story-vh:calc(100svh - 80px)}.story-backdrop{top:80px}.story-page .site-page #app{background:#10130f}.story-chapter{scroll-margin-top:0}.collaborations-label{flex-basis:95px;font-size:8px}}
@media(max-width:640px){:root{--story-vh:calc(100svh - 72px);--credit-height:62px}.story-backdrop{top:72px}.story-chapter{padding:80px 7% 110px}.story-intro h1{font-size:clamp(58px,17vw,108px);white-space:normal;max-width:100%}.story-intro .cinema-kicker{font-size:9px;letter-spacing:.15em;margin-bottom:20px}.story-scroll-cue{font-size:11px;margin-top:22px}.impact-line{font-size:12px;margin-top:22px}.impact-final{font-size:clamp(68px,19vw,110px)}.collaborations{padding-inline:5%;gap:0}.collaborations-label{display:none}.collaborations ul{gap:24px}.collaboration{width:110px;height:44px}.collaboration img{max-width:105px;max-height:28px}.collaboration.freedom img{width:120px;max-width:120px}}
@media print{.story-backdrop,.collaborations,.story-progress{display:none}.story-page .site-page #app{position:static;height:auto;overflow:visible}.story-chapter{min-height:0;padding:30px 0!important;break-inside:avoid;color:#111}.story-chapter h1,.story-chapter h2,.impact-line{color:#111!important;text-shadow:none}}

.story-page{scrollbar-color:#635d51 #10130f;scrollbar-width:thin}
@media(max-width:900px),(hover:none) and (pointer:coarse){.story-page .site-page #app>main{scrollbar-width:none}.story-page .site-page #app>main::-webkit-scrollbar{display:none}}

.story-page #main:focus{outline:none}

.film-status{display:none;position:fixed;right:6.4%;top:110px;z-index:10;font:400 11px/1.5 var(--body);color:#eee7d9;letter-spacing:.025em;text-shadow:0 1px 5px #000}
[data-story-state=loading] .film-status{display:block}
@media(max-width:640px){.film-status{top:90px;right:7%;font-size:10px}}