:root{color-scheme:dark;--bg:#090b11;--panel:#11151e;--panel2:#151b26;--line:#27303d;--muted:#a0a9b8;--text:#f4f5f8;--red:#e62429;--gold:#f0bd65;--green:#55d6a0;--sans:'DM Sans',system-ui,sans-serif;--display:'Barlow Condensed','Arial Narrow',sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--sans);font-size:15px;line-height:1.55;overflow-x:hidden}body:before{content:"";position:absolute;z-index:-1;top:0;left:0;right:0;height:660px;background:radial-gradient(ellipse at 50% 0%,rgba(114,25,34,.19),transparent 66%),linear-gradient(180deg,rgba(255,255,255,.018),transparent)}a{color:inherit}.skip-link{position:absolute;top:-60px;left:12px;padding:12px 16px;background:#fff;color:#000;z-index:10}.skip-link:focus{top:12px}:focus-visible{outline:3px solid #f6bd60;outline-offset:3px}.topbar{height:70px;border-bottom:1px solid rgba(255,255,255,.07);display:flex;align-items:center;justify-content:space-between;padding:0 max(22px,calc((100vw - 1040px)/2));}.brand{display:flex;gap:10px;align-items:center;text-decoration:none}.brand-mark{width:34px;height:34px;color:var(--red)}.brand-mark svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round}.brand-copy{display:grid;line-height:1}.brand-copy strong{font:800 18px var(--display);letter-spacing:.11em}.brand-copy small{font-size:8px;letter-spacing:.22em;color:var(--muted);margin-top:4px}.shared-note{font-size:11px;letter-spacing:.06em;color:#bac1cb;text-transform:uppercase;display:flex;gap:8px;align-items:center}.live-dot{width:7px;height:7px;background:var(--green);border-radius:50%;box-shadow:0 0 12px rgba(85,214,160,.65);display:inline-block;flex:0 0 auto}main{max-width:1040px;width:calc(100% - 48px);margin:0 auto}.intro{text-align:center;padding:58px 0 36px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:.19em;color:#b0bac8;margin:0}.intro .eyebrow{display:flex;align-items:center;justify-content:center;gap:13px;color:#d5ad75}.eyebrow-line{height:1px;width:23px;background:linear-gradient(90deg,transparent,var(--gold))}.eyebrow-line:last-child{transform:rotate(180deg)}h1,h2,p{margin-top:0}.intro h1{font:900 clamp(52px,8vw,88px)/.86 var(--display);letter-spacing:.025em;margin:23px 0 17px;text-shadow:0 5px 30px rgba(0,0,0,.4)}.intro h1 span{color:var(--red)}.intro-copy{max-width:430px;color:#aeb6c3;font-size:14px;line-height:1.7;margin:0 auto}.progress-panel{background:linear-gradient(115deg,#151922,#10131a 66%);border:1px solid #2a303c;border-radius:5px;padding:20px 24px 15px;box-shadow:0 15px 38px rgba(0,0,0,.19);position:relative;overflow:hidden}.progress-panel:before{position:absolute;content:"";height:1px;left:0;right:0;top:0;background:linear-gradient(90deg,transparent,var(--red),transparent);opacity:.7}.progress-top{display:flex;justify-content:space-between;align-items:end}.progress-count{font:700 25px var(--display);margin:3px 0 9px}.progress-count span{font:500 13px var(--sans);color:var(--muted)}.progress-percent{font:700 27px var(--display);color:var(--gold)}.progress-track{height:5px;background:#2a303a;border-radius:9px;overflow:hidden}.progress-track span{display:block;width:0;height:100%;background:linear-gradient(90deg,#a41420,var(--red),#ff6762);transition:width .5s ease;border-radius:inherit}.progress-foot{display:flex;justify-content:space-between;gap:12px;margin-top:10px;color:#8f99a8;font-size:11px}.sync-status{display:flex;gap:7px;align-items:center;color:#a9d9c4}.sync-status .live-dot{width:6px;height:6px}.section-label{display:flex;gap:13px;align-items:center;margin-bottom:17px}.section-index{width:31px;height:31px;border:1px solid #704044;color:#ec7777;display:grid;place-items:center;font:700 13px var(--display);flex:0 0 auto}.section-label h2{font:700 28px/.95 var(--display);letter-spacing:.02em;margin:4px 0 0}.section-label .eyebrow{font-size:9px}.label-rule{height:1px;flex:1;background:linear-gradient(90deg,#333b48,transparent);margin-left:6px}.next-section{margin-top:46px}.next-card{position:relative;min-height:170px;border:1px solid #34303a;border-radius:5px;overflow:hidden;background:radial-gradient(ellipse at 82% 42%,rgba(157,28,36,.32),transparent 42%),linear-gradient(110deg,#171923,#12151d);padding:26px 29px;display:flex;align-items:center;gap:25px}.next-card:after{content:"";position:absolute;right:16%;top:-50%;width:200px;height:200px;border:1px solid rgba(255,255,255,.04);border-radius:50%;box-shadow:0 0 0 25px rgba(255,255,255,.018),0 0 0 50px rgba(255,255,255,.012);pointer-events:none}.hero-symbol{width:82px;height:82px;border:1px solid rgba(230,36,41,.55);border-radius:50%;display:grid;place-items:center;color:#f06a6e;flex:0 0 auto;box-shadow:0 0 35px rgba(230,36,41,.1),inset 0 0 20px rgba(230,36,41,.08)}.hero-symbol svg{width:39px;height:39px;fill:none;stroke:currentColor;stroke-width:1.4}.hero-content{position:relative;z-index:1;min-width:0;flex:1}.hero-kicker{font-size:9px;letter-spacing:.19em;color:#e58b8b;font-weight:700;text-transform:uppercase;margin:0 0 5px}.hero-content h3{font:700 clamp(25px,4vw,36px)/1 var(--display);margin:0 0 7px}.hero-meta{font-size:11px;color:#a6afbc;margin:0 0 13px}.hero-teaser{max-width:530px;color:#d0d4dc;font-size:13px;margin:0}.action-btn{min-height:45px;padding:0 17px;border:1px solid var(--red);background:var(--red);color:#fff;font:700 11px var(--sans);letter-spacing:.04em;border-radius:3px;cursor:pointer;transition:background .18s,border .18s,transform .18s;flex:0 0 auto;position:relative;z-index:2}.action-btn:hover{background:#ff363d;border-color:#ff363d;transform:translateY(-1px)}.action-btn.secondary{background:transparent;border-color:#687384;color:#e4e8ee}.action-btn.secondary:hover{background:#242a35;border-color:#9aa5b3}.action-btn:disabled{opacity:.55;cursor:wait;transform:none}.context-box{position:relative;z-index:2;border-top:1px solid rgba(255,255,255,.12);padding-top:12px;margin-top:16px;max-width:590px}.context-box .eyebrow{color:var(--gold);font-size:9px}.context-box p{font-size:12px;color:#c4cbd5;margin:5px 0 0}.state-loading{justify-content:flex-start;color:#bdc4cf}.loading-shimmer{width:62px;height:62px;border-radius:50%;background:linear-gradient(110deg,#1b202a 8%,#2c313c 18%,#1b202a 33%);background-size:200% 100%;animation:shimmer 1.2s linear infinite}.state-loading p{margin:0}@keyframes shimmer{to{background-position-x:-200%}}.state-empty,.state-error,.state-complete{min-height:160px;flex-direction:column;align-items:flex-start;justify-content:center;gap:8px}.state-empty h3,.state-error h3,.state-complete h3{font:700 28px var(--display);margin:0}.state-empty p,.state-error p,.state-complete p{color:#b5beca;font-size:13px;margin:0;max-width:540px}.state-error{border-color:#75353a;background:linear-gradient(110deg,#20171d,#15151d)}.retry-btn{margin-top:9px}.timeline-section{margin-top:53px}.timeline{position:relative;padding-left:28px}.timeline:before{content:"";position:absolute;left:8px;top:9px;bottom:14px;width:1px;background:linear-gradient(#913338,#383d47 90%,transparent)}.phase-group{margin-bottom:27px}.phase-title{display:flex;align-items:center;gap:11px;margin:0 0 12px;position:relative}.phase-title:before{content:"";position:absolute;left:-25px;width:9px;height:9px;background:var(--bg);border:2px solid #d04a4f;border-radius:50%;box-shadow:0 0 12px rgba(230,36,41,.32)}.phase-title span{font:700 15px var(--display);letter-spacing:.1em;text-transform:uppercase}.phase-title small{font-size:10px;color:#8f99a8;letter-spacing:.04em}.film-list{display:grid;gap:7px}.film-row{display:grid;grid-template-columns:36px minmax(0,1fr) auto;gap:13px;align-items:center;min-height:65px;padding:9px 13px;background:linear-gradient(105deg,rgba(22,27,37,.92),rgba(16,19,27,.86));border:1px solid #262d38;border-radius:3px;transition:border-color .18s,background .18s}.film-row:hover{border-color:#4a5361;background:#191f29}.film-number{font:700 16px var(--display);color:#727e8e;text-align:center}.film-info{min-width:0}.film-title{font-size:13px;font-weight:700;line-height:1.35;margin:0;overflow-wrap:anywhere}.film-meta{font-size:10px;color:#8d98a7;margin:3px 0 0}.film-row.is-watched .film-number{color:var(--green)}.film-row.is-watched .film-title{color:#bec6d0}.film-row.is-next{border-left:2px solid var(--red)}.film-row.is-upcoming{opacity:.68}.film-action{height:40px;min-width:72px;padding:0 10px;border:1px solid #485361;border-radius:3px;background:transparent;color:#d8dee6;font:600 10px var(--sans);cursor:pointer}.film-action:hover{border-color:var(--gold);color:#fff}.film-row.is-watched .film-action{border-color:#345e51;color:#8fe0bd}.film-action:disabled{opacity:.45;cursor:wait}.extras-section{margin-top:51px}.section-note{font-size:12px;color:#9fa9b7;max-width:550px;margin:-4px 0 17px}.extras-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.extra-card{display:grid;grid-template-columns:33px minmax(0,1fr) auto;align-items:center;gap:11px;padding:12px;background:#11151d;border:1px solid #252c37;border-radius:3px;min-height:70px}.extra-icon{width:32px;height:32px;border:1px solid #41414a;color:#d5b26d;display:grid;place-items:center;font:700 14px var(--display)}.extra-info{min-width:0}.extra-title{font-weight:700;font-size:12px;line-height:1.35;margin:0;overflow-wrap:anywhere}.extra-meta{font-size:10px;color:#939ead;margin:3px 0 0}.extra-card .film-action{min-width:63px;padding:0 8px}.empty-extras{font-size:12px;color:#929cab;padding:18px;border:1px dashed #303744}footer{display:flex;align-items:center;gap:11px;border-top:1px solid #242a34;margin-top:57px;padding:19px 0 30px;color:#929cab;font-size:10px}footer p{margin:0;flex:1}footer a{text-decoration:none;color:#c1c7d1;padding:8px 0}footer a:hover{color:#fff}.footer-mark{width:22px;height:22px;border:1px solid #777b83;border-radius:50%;display:grid;place-items:center;font:700 12px var(--display);color:#e62429}.toast{position:fixed;left:50%;bottom:max(20px,env(safe-area-inset-bottom));z-index:20;transform:translate(-50%,16px);opacity:0;pointer-events:none;background:#f4f2ed;color:#17191e;border-radius:4px;padding:11px 17px;font-size:12px;font-weight:700;box-shadow:0 9px 35px #0008;transition:opacity .2s,transform .2s;max-width:calc(100vw - 30px)}.toast.show{opacity:1;transform:translate(-50%,0)}.timeline-loading{display:flex;align-items:center;gap:10px;color:#9da6b3;font-size:12px;padding:8px 0 20px}.spinner{width:17px;height:17px;border:2px solid #3a414d;border-top-color:var(--red);border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:650px){.topbar{height:60px;padding:0 18px}.brand-mark{width:30px;height:30px}.brand-copy strong{font-size:16px}.shared-note{font-size:9px}main{width:calc(100% - 32px)}.intro{padding:45px 0 28px}.intro h1{font-size:59px;margin:19px 0 13px}.intro-copy{font-size:13px;max-width:350px}.progress-panel{padding:17px 16px 13px}.progress-count{font-size:22px}.progress-percent{font-size:24px}.progress-foot{font-size:10px}.section-label{gap:10px}.section-label h2{font-size:26px}.section-index{width:29px;height:29px}.next-section{margin-top:37px}.next-card{padding:20px 17px;gap:15px;align-items:flex-start;flex-wrap:wrap;min-height:0}.hero-symbol{width:54px;height:54px}.hero-symbol svg{width:28px;height:28px}.hero-content{width:calc(100% - 70px);flex:auto}.hero-content h3{font-size:28px}.hero-meta{font-size:10px;margin-bottom:9px}.hero-teaser{font-size:12px}.next-card .action-btn{margin-left:69px;min-height:43px}.state-loading{align-items:center;flex-wrap:nowrap}.state-loading .loading-shimmer{width:45px;height:45px;flex:0 0 auto}.state-loading p{font-size:12px}.state-empty,.state-error,.state-complete{align-items:flex-start}.state-empty .action-btn,.state-error .action-btn{margin-left:0}.timeline-section,.extras-section{margin-top:43px}.timeline{padding-left:23px}.timeline:before{left:7px}.phase-title:before{left:-21px}.phase-title span{font-size:14px}.phase-title small{font-size:9px}.film-row{grid-template-columns:27px minmax(0,1fr) 64px;gap:8px;padding:8px 9px;min-height:64px}.film-number{font-size:14px}.film-title{font-size:12px}.film-meta{font-size:9px}.film-action{min-width:62px;height:40px;padding:0 6px;font-size:9px}.extras-grid{grid-template-columns:1fr}.extra-card{grid-template-columns:31px minmax(0,1fr) 62px;padding:10px;gap:9px}.extra-title{font-size:12px}.extra-meta{font-size:9px}.section-note{font-size:11px}footer{margin-top:42px;gap:8px;font-size:9px}footer a{white-space:nowrap}}@media(max-width:360px){main{width:calc(100% - 26px)}.topbar{padding:0 13px}.shared-note{font-size:8px}.intro h1{font-size:53px}.film-row{grid-template-columns:23px minmax(0,1fr) 57px;gap:6px;padding:8px 7px}.film-action{min-width:55px;padding:0 4px;font-size:8px}.next-card{padding:16px 13px}.next-card .action-btn{margin-left:0}.hero-content{width:calc(100% - 68px)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
/* The recommended chapter gently shifts the hero palette by saga phase. */
.next-card{--hero-accent:#f06a6e;--hero-wash:rgba(157,28,36,.32)}
.next-card[data-phase="1"]{--hero-accent:#f0bd65;--hero-wash:rgba(146,101,31,.25)}
.next-card[data-phase="2"]{--hero-accent:#7cc9ed;--hero-wash:rgba(34,105,151,.26)}
.next-card[data-phase="3"]{--hero-accent:#c2a0f4;--hero-wash:rgba(102,63,151,.25)}
.next-card[data-phase="4"]{--hero-accent:#70d7c3;--hero-wash:rgba(30,119,108,.24)}
.next-card[data-phase="5"]{--hero-accent:#f3a36d;--hero-wash:rgba(157,78,34,.27)}
.next-card[data-phase="6"]{--hero-accent:#ef858c;--hero-wash:rgba(145,38,54,.30)}
.next-card:not(.state-complete):not(.state-empty):not(.state-error){background:radial-gradient(ellipse at 82% 42%,var(--hero-wash),transparent 46%),linear-gradient(110deg,#171923,#12151d)}
.next-card .hero-kicker,.next-card .hero-symbol{color:var(--hero-accent)}
.next-card .hero-symbol{border-color:color-mix(in srgb,var(--hero-accent) 58%,transparent);box-shadow:0 0 35px color-mix(in srgb,var(--hero-accent) 12%,transparent),inset 0 0 20px color-mix(in srgb,var(--hero-accent) 9%,transparent)}
.next-card .action-btn{border-color:var(--hero-accent);background:var(--hero-accent);color:#101116}
.next-card .action-btn:hover{filter:brightness(1.08)}
.upcoming-badge{display:inline-flex;min-height:32px;align-items:center;border:1px solid #596473;border-radius:3px;padding:0 9px;color:#d6dce5;font-size:9px;font-weight:700;letter-spacing:.04em;white-space:nowrap}
.extra-card.is-upcoming{border-style:dashed;background:#10141c}
.extra-card.is-upcoming .extra-title{color:#d9dee7}