:root{color-scheme:dark;font-family:Georgia,'Noto Serif CJK SC','Songti SC',SimSun,serif;color:#d6d9d8;background:#10191e}*{box-sizing:border-box}body{margin:0}main{max-width:1600px;margin:auto;padding:0 38px}header{height:92px;display:flex;align-items:center;justify-content:space-between}a{color:inherit;text-decoration:none}.wordmark{font-size:19px;letter-spacing:4px}.wordmark span{font:9px Arial,sans-serif;letter-spacing:2px;margin-left:16px;color:#829397}nav{display:flex;align-items:center;gap:22px;font:10px Arial,sans-serif;letter-spacing:1.4px}nav a{color:#7c8c91}nav a.active{color:#e7d4af;border-bottom:1px solid #b2a082;padding-bottom:5px}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid #dbbd86;outline-offset:5px}#film{position:relative;aspect-ratio:1.6;overflow:hidden;background:#26343d;isolation:isolate}canvas{width:100%;height:100%;display:block}#cover{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;background:linear-gradient(90deg,#0c171c88,#1e2c3230);text-align:center}h1{font-size:clamp(40px,6vw,91px);font-weight:400;letter-spacing:.3em;margin:35px 0 24px;padding-left:.3em;color:#e4e3db}.eyebrow{font-size:11px;letter-spacing:4px;color:#b1bcb9}.act{font-size:13px;letter-spacing:8px;color:#c2c9c5}#start{border-bottom:1px solid #9aabac;padding:16px 0;font-size:13px;letter-spacing:3px;margin-top:40px}#start span{margin-left:50px}.note{font:10px sans-serif;color:#9aa9ac;letter-spacing:2px;margin-top:24px}#shotlabel{position:absolute;top:26px;left:28px;font:10px sans-serif;letter-spacing:3px;color:#bbc9ccaa}#subtitles{position:absolute;bottom:7%;left:8%;width:84%;text-align:center;white-space:pre-line;font-size:clamp(15px,1.55vw,23px);line-height:1.9;color:#f2eee3;text-shadow:0 2px 4px #000,0 0 18px #000;pointer-events:none;max-height:30%}#subtitles:empty{display:none}#interaction{position:absolute;left:51%;top:42%;width:35%;max-width:380px;padding:20px;background:#17252bc9;font-size:12px;letter-spacing:1px;border-left:1px solid #b8c6c6}#interaction[hidden],#ending[hidden]{display:none}#interaction input{width:100%;margin:15px 0}#interaction button{border-bottom:1px solid #9eacac;padding:6px;margin-right:15px}#ending{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;background:#101c2470}#ending p{font-size:12px;letter-spacing:4px}#ending h2{font-weight:400;font-size:clamp(24px,4vw,50px);letter-spacing:5px}#ending .endnote{color:#bcc7c5}#replay{padding:16px;border-bottom:1px solid #a7b3af;margin-top:22px}footer{padding:20px 0 30px}.transport{display:flex;gap:20px;align-items:center;font:10px Arial,sans-serif;color:#aebabc}.transport button{white-space:nowrap}#play{font-size:19px;min-width:26px}#seek{flex:1;min-width:30px}input[type=range]{accent-color:#b8c7c4;height:3px;cursor:pointer}#time{font-variant-numeric:tabular-nums;white-space:nowrap}.chapters{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin-top:25px}.chapters button{text-align:left;padding:12px 0;border-top:1px solid #39494d;font:11px sans-serif;color:#7d9299;line-height:1.7}.chapters button.current{color:#e0d2b3;border-color:#d2ba8e}.chapters small{display:block;font-size:9px;letter-spacing:1px}.footnote{font:9px sans-serif;letter-spacing:2px;color:#60777e;margin-top:24px}dialog{width:min(1200px,92vw);background:#17252c;color:#d4dcd9;border:1px solid #596c73;padding:35px}dialog::backdrop{background:#061017de}#closeRefs{float:right}.refgrid{display:grid;grid-template-columns:1fr 1fr;gap:20px}figure{margin:0}.refgrid figure:last-child{grid-column:1/-1}.refgrid img{width:100%}figcaption{font-size:12px;line-height:1.9;color:#a7b7bc;padding:12px 0}.plan{display:flex;align-items:center;justify-content:center;gap:30px;padding:30px;border:1px solid #657176}.plan span{padding:20px;border:1px solid #9c937c;font-size:13px}.plan b{color:#cab88e}@media(max-width:650px){main{padding:0 12px}header{height:70px}.wordmark{font-size:14px;letter-spacing:2px}.wordmark span{display:none}nav{gap:14px;font-size:9px}#film{aspect-ratio:.8}h1{font-size:49px}.eyebrow{font-size:9px;letter-spacing:2px}#subtitles{bottom:7%;font-size:16px;left:6%;width:88%;line-height:1.8;max-height:35%}#shotlabel{top:17px;left:15px;font-size:8px}.transport{gap:10px}#time{font-size:9px}.chapters{gap:8px;grid-template-columns:repeat(3,1fr);margin-top:20px}#interaction{left:15%;top:35%;width:70%}.refgrid{grid-template-columns:1fr}.refgrid figure:last-child{grid-column:auto}.plan{gap:8px;padding:10px}.plan span{padding:8px;font-size:11px}.footnote{line-height:1.9}#cover h1{margin-top:30px}}

.mixer{font:10px sans-serif;color:#99adb2;margin-top:18px}.mixer summary{cursor:pointer;width:max-content}.mixer label{display:inline-flex;gap:16px;align-items:center;margin:14px 24px 0 0}.mixer input{width:110px}.hold{display:block;font:10px sans-serif;letter-spacing:0;margin-top:12px}.hold input{width:auto!important;height:auto!important;vertical-align:middle;margin:0 8px 0 0!important}

.score-study{display:flex;align-items:center;gap:20px;margin-top:20px;font:10px sans-serif;color:#7f969e}.score-study button{padding:7px 12px;border:1px solid #465a62;border-radius:2px;color:#c0cdca}.score-study button[aria-pressed=true]{border-color:#baa77f;color:#e0d0b0}.score-study span{font-size:9px;letter-spacing:1px}@media(prefers-reduced-motion:reduce){button{scroll-behavior:auto}}

#interaction>div[hidden]{display:none}#characterDialog{width:min(1300px,96vw);padding:18px}#characterCanvas{width:100%;height:auto;display:block;margin-top:20px}nav{gap:16px}@media(max-width:650px){nav{gap:10px}header{gap:8px}.wordmark{white-space:nowrap}#characterDialog{padding:8px}}

/* Cover: the act name is the single playback entry. */
#cover .eyebrow{font-size:clamp(10px,.85vw,12px);letter-spacing:3px;padding:0 24px;line-height:1.9}
#cover h1{margin:36px 0 32px}
#cover #start{display:inline-flex;align-items:center;gap:22px;margin-top:14px;padding:13px 2px 12px;border-bottom:1px solid #9aabac88;font-size:clamp(13px,1.1vw,17px);letter-spacing:5px;transition:color .2s,border-color .2s}
#cover #start span{margin-left:0;font-size:14px;letter-spacing:0;color:#a8bab9}
#cover #start:hover{color:#f0e7d4;border-color:#d1c2a1}
#cover .note{margin-top:16px;font:9px sans-serif;letter-spacing:1.5px;color:#8fa1a5}
#shotlabel{display:none}
@media(max-width:650px){#cover .eyebrow{max-width:90%;font-size:10px;letter-spacing:1px}#cover #start{margin-top:4px;font-size:13px;letter-spacing:3px}#cover h1{margin:28px 0}#cover .note{font-size:8px}}