:root{color-scheme:dark;--ivory:#eee9d8;--muted:#9ba9a9;--gold:#c7ad76;--line:#d7cfb326}*{box-sizing:border-box}body{margin:0;background:#071219;color:var(--ivory);font-family:"PingFang SC","Microsoft Yahei",sans-serif;font-size:13px;overflow:hidden}button,select{font:inherit;color:inherit;cursor:pointer}button{border:0;background:none}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #ead19b;outline-offset:5px}#stage,.vignette,.grain{position:fixed;inset:0}#stage canvas{display:block;width:100%;height:100%;touch-action:none}.vignette{pointer-events:none;background:linear-gradient(180deg,#020c138a,transparent 20%,transparent 65%,#020b13e6),radial-gradient(ellipse,transparent 30%,#010b1244 100%)}.grain{pointer-events:none;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' d='M0 0h200v200H0z'/%3E%3C/svg%3E")}header{position:fixed;top:0;left:0;width:100%;height:106px;display:flex;align-items:center;padding:0 4%;gap:48px;z-index:3}.brand{display:flex;align-items:center;gap:13px;color:inherit;text-decoration:none;font-family:"Songti SC",SimSun,serif;font-size:19px;letter-spacing:3px}.brand small{display:block;font-family:Georgia,serif;font-size:8px;letter-spacing:2.1px;margin-top:6px;color:#aab7ba}.seal{border:1px solid #b6b8a4;width:36px;height:40px;text-align:center;line-height:36px;font-size:27px;color:#d4c3a1;transform:rotate(-3deg)}.edition{font-size:10px;letter-spacing:2px;color:#9dabab;display:flex;align-items:center;gap:16px}.edition i{display:block;height:15px;border-left:1px solid var(--line)}.head-actions{margin-left:auto;display:flex;gap:20px;align-items:center}.head-actions button{color:#c1cbc9;font-size:18px}.head-actions button span{font-size:10px;margin-left:6px;letter-spacing:1px}#help{border:1px solid #a1b2b352;border-radius:50%;font:13px Georgia;width:22px;height:22px}#opening{position:fixed;left:8%;top:27%;z-index:2;max-width:440px}.eyebrow{font-size:10px;color:var(--gold);letter-spacing:5px;display:flex;align-items:center;gap:13px}.eyebrow>span{width:29px;height:1px;background:var(--gold)}h1{font-family:"Songti SC","STSong",SimSun,serif;font-size:clamp(64px,7.7vw,112px);font-weight:400;letter-spacing:13px;line-height:1.1;margin:23px 0 22px;text-shadow:0 4px 40px #0006}h1 span{display:block;margin-top:10px;padding-left:68px}.duel-names{font-family:"Songti SC",serif;font-size:20px;letter-spacing:6px}.duel-names b{font-family:sans-serif;font-weight:300;font-size:10px;color:#91a5a7;letter-spacing:4px;margin:0 16px}#opening p{color:#a9b7b8;font-size:12px;line-height:2.15;letter-spacing:2px;margin:25px 0}.start-button{border:1px solid #c3b28e8a;background:#c3b28e0d;padding:17px 24px;letter-spacing:3px;font-size:13px;transition:.3s}.start-button:hover{background:#c3b28e26;border-color:#e8c985}.start-button small{font-size:9px;letter-spacing:1px;margin-left:32px;color:#a79c83}.play-triangle{font-size:10px;margin-right:18px;color:#dbc18a}.opening-note{margin-top:19px;font-size:9px;color:#8a9fa6;letter-spacing:3px}.hidden{display:none!important}#loading{position:fixed;bottom:40px;width:100%;text-align:center;font-size:11px;letter-spacing:4px;color:#d2c6ab}#chapters{position:fixed;right:0;top:0;bottom:0;width:330px;background:#09151dee;backdrop-filter:blur(20px);padding:35px 28px;z-index:10;border-left:1px solid var(--line);transform:translateX(100%);transition:transform .35s}#chapters.open{transform:translateX(0)}.chapter-head{display:flex;align-items:center;font-size:19px;font-family:serif;gap:12px;padding-bottom:24px;border-bottom:1px solid var(--line)}.chapter-head span{font:8px sans-serif;letter-spacing:2px;color:#799091}.chapter-head button{margin-left:auto;font-size:25px}#chapter-list{padding-top:12px}#chapter-list button{width:100%;text-align:left;padding:15px 10px;border-bottom:1px solid #ffffff0c;display:flex;gap:18px;align-items:center}#chapter-list button b{font:11px Georgia;color:#748a90}#chapter-list button span{font-size:12px;letter-spacing:2px}#chapter-list button small{margin-left:auto;font-size:9px;color:#7d9296}#chapter-list button.active{background:#d9c2930b;color:#e2c691}#chapters>p{font-size:10px;color:#637e85;line-height:2;letter-spacing:2px}#chapter-toggle{position:fixed;right:4%;top:138px;font-size:17px;z-index:2;color:#b6c2bd}#chapter-toggle span{font-size:11px;letter-spacing:3px;margin-left:6px}#character-labels span{position:fixed;pointer-events:none;white-space:nowrap;letter-spacing:4px;font-family:serif;font-size:16px;text-shadow:0 2px 10px #000}#character-labels small{display:block;font-family:sans-serif;font-size:8px;color:#a6bfbc;letter-spacing:1px;margin-top:6px}#character-labels i{display:inline-block;width:4px;height:4px;background:#77ded8;box-shadow:0 0 12px #77ded8;margin:0 9px 3px 0}#wen-label i{background:#e2bf6f;box-shadow:0 0 12px #e2bf6f}#story{position:fixed;left:4%;bottom:155px;max-width:480px;pointer-events:none;text-shadow:0 2px 15px #000}.story-top{display:flex;gap:23px;color:var(--gold);font-size:9px;letter-spacing:3px}#chapter-source{color:#90a7ad;letter-spacing:2px}h2{font-family:"Songti SC",SimSun,serif;font-weight:400}#story h2{font-size:34px;letter-spacing:5px;margin:13px 0 10px}#scene-desc{color:#bcc9c9;font-size:12px;line-height:1.9;letter-spacing:1px;margin:0;max-width:450px}#tactic{margin-top:16px;display:flex;align-items:center;gap:11px;font-size:10px;letter-spacing:1px}#tactic>span{border:1px solid #c1aa7950;padding:3px 7px;color:#c1aa79}#tactic>b{font-weight:400;color:#a8c8c9}#view-tools{position:fixed;right:4%;bottom:158px;text-align:right}.view-caption{font-size:9px;letter-spacing:3px;color:#7e979e}.segmented{display:flex;border:1px solid #afc0b528;margin:12px 0;background:#0b1c2488}.segmented button{padding:10px 17px;font-size:10px;color:#8fa6ac}.segmented button.active{background:#cbb98818;color:#dbcba8}.segmented button:hover{background:#d2be9828}#camera-tip{font-size:9px;color:#6c8994;letter-spacing:1px}#transport{position:fixed;bottom:28px;left:4%;right:4%;z-index:3}.timeline-wrap{position:relative;height:22px;display:flex;align-items:center}input[type=range]{accent-color:var(--gold);cursor:pointer}#timeline{width:100%;margin:0;height:2px;-webkit-appearance:none;appearance:none;background:linear-gradient(to right,#cfbd94 var(--progress,0%),#a6b6b434 var(--progress,0%));border-radius:0}#timeline::-webkit-slider-thumb{-webkit-appearance:none;width:8px;height:8px;background:#ded5b7;border-radius:50%;box-shadow:0 0 12px #d8c18b50}#timeline-marks{position:absolute;inset:9px 0;pointer-events:none}#timeline-marks span{position:absolute;width:2px;height:5px;background:#8e9992}.transport-row{display:flex;align-items:center;justify-content:space-between;height:43px}.transport-left{display:flex;align-items:center;gap:22px}#play{font-size:20px;width:23px}#restart{font-size:23px;color:#91a8aa}#time{font-size:10px;letter-spacing:1px;color:#c7d3d1;font-variant-numeric:tabular-nums}#time em{font-style:normal;color:#657f86;margin-left:8px}.divider{height:13px;border-left:1px solid #a4b5b32e}select{background:none;border:0;font-size:11px;color:#98adb0}.keyboard-tip{color:#5c7983;font-size:9px;letter-spacing:1px}.keyboard-tip i{font-style:normal;margin:0 12px}#clean{font-size:10px;color:#8fa6a8;letter-spacing:1px}#clean span{display:inline-block;border:1px solid #829a9d50;padding:1px 5px;margin-left:12px}dialog{background:#0c1c24ed;backdrop-filter:blur(24px);color:#d2ddd8;border:1px solid #c0b18c50;padding:44px;max-width:500px;box-shadow:0 30px 100px #000a}dialog::backdrop{background:#0008}dialog h2{font-size:25px;letter-spacing:2px}dialog p{font-size:12px;line-height:2;color:#9cb0b4}#close-help{position:absolute;right:15px;top:13px;font-size:25px}dialog label{display:flex;align-items:center;gap:20px;font-size:11px}.credits{margin-top:25px;border-top:1px solid var(--line);padding-top:20px;font-size:10px!important}#end{position:fixed;left:50%;top:43%;transform:translate(-50%,-50%);text-align:center;padding:45px;background:#06141db5;backdrop-filter:blur(10px);border-top:1px solid #b9a47350;width:min(600px,85%)}#end>span{color:var(--gold);font-size:10px;letter-spacing:4px}#end h2{font-size:32px;letter-spacing:4px}#end p{font-size:11px;color:#9bb1b5;line-height:2}#end button{margin-top:20px;border:1px solid #a78e5f80;padding:12px 25px;letter-spacing:3px}#restore{position:fixed;right:25px;bottom:25px;color:#aebdb7;font-size:10px;background:#07192388;padding:10px}.clean-ui header,.clean-ui #story,.clean-ui #view-tools,.clean-ui #transport,.clean-ui #chapter-toggle,.clean-ui #character-labels{display:none!important}.clean-ui #restore{display:block!important}body.playing #opening{display:none}body:not(.playing) #character-labels{opacity:.65}button:hover{color:#fff}
@media(max-width:800px){header{padding:0 6%;height:80px}.edition{display:none}.brand{font-size:15px}.brand small{font-size:6px}.head-actions{gap:15px}.head-actions button span{display:none}#opening{left:8%;top:24%}h1{font-size:76px}#story{left:6%;bottom:190px;right:6%;max-width:400px}#story h2{font-size:27px}#scene-desc{font-size:11px}#view-tools{right:6%;bottom:106px}.view-caption,#camera-tip{display:none}.segmented button{padding:8px 14px}.keyboard-tip{display:none}#transport{left:6%;right:6%;bottom:20px}.transport-left{gap:17px}#character-labels small{display:none}#character-labels span{font-size:12px}#chapter-toggle{top:102px;right:6%}dialog{width:90%;padding:30px}#tactic{font-size:9px}#chapters{width:300px}#end h2{font-size:24px}}@media(max-height:650px){#opening{top:23%}h1{font-size:62px;line-height:.95;margin:16px 0}h1 span{display:inline;padding-left:0}#opening p{margin:18px 0}#story{bottom:125px}#view-tools{bottom:130px}header{height:75px}#chapter-toggle{top:90px}}

@media(min-width:601px) and (max-width:820px){#opening{top:23%;}#opening h1{font-size:64px;letter-spacing:10px}#opening h1 span{padding-left:45px}#opening p{font-size:10px}#opening .duel-names{font-size:16px}#opening .start-button{margin-top:4px}}