:root{color-scheme:dark;font-family:Arial,Helvetica,sans-serif;background:#000;color:#f4f1eb;font-synthesis:none}
*{box-sizing:border-box}
html,body{margin:0}
body{background:#000}
a{color:inherit;text-decoration:none}
a:focus-visible{outline:2px solid #ff872e;outline-offset:8px}
.reveal{position:relative;height:333.75svh;background:#000}
.stage{position:sticky;top:0;height:100vh;height:100svh;isolation:isolate;background:#000;overflow:hidden}
.frames{position:absolute;inset:0;background:#000}
.frames img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;opacity:0;pointer-events:none;user-select:none}
.frames img:first-child{opacity:1}
.early-lights{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;opacity:0}
.hero-header,.hero-footer{position:absolute;left:clamp(22px,4vw,70px);right:clamp(22px,4vw,70px);z-index:2;display:flex;align-items:center;justify-content:space-between;gap:20px;text-shadow:0 1px 12px #0008}
.hero-header{top:32px;align-items:flex-start}
.wordmark{font-size:14px;letter-spacing:.24em;font-weight:600}
.edition{display:block;font-size:9px;letter-spacing:.25em;color:#c0b7ae;margin-top:9px;font-weight:400}
.skip{font-size:11px;color:#d6cec4;min-height:44px;display:flex;align-items:flex-start;gap:14px;padding-top:2px}
.skip:hover{color:#fff}
.hero-footer{bottom:30px;font-size:11px;letter-spacing:.12em}
.cue{display:flex;align-items:center;gap:15px;color:#d8d0c8}
.cue-line{display:block;width:1px;height:34px;background:linear-gradient(#fff0,#f2e4d2)}
.meter{display:flex;align-items:center;font-variant-numeric:tabular-nums;white-space:nowrap}
#percentage{font-size:19px;letter-spacing:.06em}
.unit{color:#c0b7ae;font-size:10px;letter-spacing:.05em;margin-left:3px}
.rail{display:block;width:72px;height:2px;background:#eee4;margin-left:18px;overflow:hidden}
#fill{display:block;width:100%;height:100%;background:#f4f1eb;transform:scaleX(0);transform-origin:left}
.load-status{position:absolute;left:24px;right:24px;top:48%;text-align:center;font-size:14px;color:#ddd}
.load-status:empty{display:none}
.continuation{min-height:100svh;background:#eeeae3;color:#191817;padding:clamp(64px,8vw,130px) clamp(24px,6vw,100px) 35px;display:flex;flex-direction:column}
.section-label{display:flex;justify-content:space-between;align-items:center;font-size:10px;letter-spacing:.22em;border-top:1px solid #19181744;padding-top:20px}
.section-label>span:last-child{font-size:32px;letter-spacing:0}
h1{font-family:Georgia,'Times New Roman',serif;font-size:clamp(54px,10vw,156px);font-weight:400;line-height:1.05;letter-spacing:-.055em;margin:70px 0 36px}
.next-layout{display:flex;justify-content:space-between;gap:40px;align-items:flex-start}
.next-layout>p{font-size:clamp(16px,2vw,24px);margin:0;line-height:1.5}
.demo-note{font-size:12px;line-height:1.8;color:#6a6259;max-width:310px}
.end-line{margin-top:auto;padding-top:110px;display:flex;justify-content:space-between;gap:20px;font-size:10px;letter-spacing:.1em}
.end-line a{padding:12px 0;min-height:44px}
@media(max-width:600px){.frames img{object-fit:contain}.early-lights{display:none}.hero-header{top:24px}.wordmark{font-size:12px}.skip{font-size:10px;gap:6px}.hero-footer{bottom:28px;letter-spacing:.04em;font-size:10px}.rail{width:35px;margin-left:10px}.next-layout{flex-direction:column;gap:26px}h1{margin-top:64px}.end-line{font-size:9px;align-items:center}.edition{font-size:8px}}
@media(prefers-reduced-motion:reduce){.reveal{height:100svh}.frames img:first-child{opacity:0}.frames img:last-child{opacity:1}.early-lights{display:none}}