*{box-sizing:border-box}html,body{margin:0;height:100%;background:#e9e4d6;overflow:hidden;touch-action:manipulation;-webkit-text-size-adjust:100%;overscroll-behavior:none;font-family:PingFang SC,Microsoft YaHei,sans-serif;color:#37414f}.hidden{display:none!important}button{font-family:inherit;cursor:pointer}:root{--p: #2f6fe4;--q: #e5483b;--eq: #16a34a;--meet: #d81b8c;--ao: #7cb342;--ob: #f4a100;--bc: #1aa59a;--ink: #37414f}#viewport{position:fixed;top:0;right:0;bottom:0;left:0}#stage{position:absolute;left:50%;top:50%;width:1280px;height:720px;transform-origin:center;overflow:hidden;box-shadow:0 10px 40px #00000026}#gl,#labels,#popups,#hud{position:absolute;top:0;right:0;bottom:0;left:0}#labels,#popups,#hud{pointer-events:none}#hud>*{pointer-events:auto}.wlabel{position:absolute;left:0;top:0;will-change:transform;white-space:nowrap}.num{translate:-50% -50%;font-size:13px;color:#6b7480}.num.key{font-size:15px;font-weight:700;color:var(--ink)}.letter{translate:-50% -50%;font-size:20px;font-weight:800;font-style:italic;color:var(--ink)}.seglen{translate:-50% -50%;font-size:12px;color:#8a6d3b;background:#fff6dd;border:1px dashed #e0c27a;padding:1px 7px;border-radius:8px}.ballname{translate:-50% -50%;font-size:13px;font-weight:900;color:#fff}.zone{translate:-50% -50%;font-size:13px;line-height:1.5;text-align:center;padding:3px 9px;border-radius:10px;background:#ffffffd9;border:2px solid}.zone:empty{display:none}.zAO{border-color:var(--ao)}.zOB{border-color:var(--ob)}.zBC{border-color:var(--bc)}.zp{color:var(--p);font-weight:700}.zq{color:var(--q);font-weight:700}.dist{translate:-50% -50%;font-size:14px;padding:2px 9px;border-radius:10px;background:#fff;border:2px solid;transition:background .2s,color .2s}.distP{color:var(--p);border-color:var(--p)}.distQ{color:var(--q);border-color:var(--q)}.dist.equal{background:var(--eq);border-color:var(--eq);color:#fff;box-shadow:0 0 0 4px #16a34a40}.mlabel{translate:-50% -50%;color:#fff;background:var(--meet);font-size:15px;padding:3px 10px;border-radius:12px;box-shadow:0 3px 10px #d81b8c59}.floattext{translate:-50% -100%;font-size:15px;font-weight:800;padding:4px 10px;border-radius:12px;color:#fff;box-shadow:0 4px 12px #0003}.tipP{background:var(--p)}.tipQ{background:var(--q);translate:-50% 0}@keyframes fadeout{0%{opacity:0;transform-origin:center}10%{opacity:1}75%{opacity:1}to{opacity:0}}.gtitle,.ctitle{translate:0 -50%;font-size:14px;font-weight:700;color:#5c6470}.grow{translate:-50% -50%;width:30px;height:30px;line-height:30px;text-align:center;border-radius:50%;color:#fff;font-weight:900}.gbar{translate:-50% -50%;font-size:13px;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.35)}.gbar.dim{opacity:.35}.gtick{translate:-50% -50%;font-size:11px;color:#8a929c}.gtick.key{font-size:13px;font-weight:800;color:var(--ink)}.gunit,.cunit{translate:-50% -50%;font-size:12px;color:#6b7480}.gmeet{translate:-50% -50%;font-size:13px;font-weight:700;color:#fff;background:var(--meet);padding:1px 8px;border-radius:8px}.gtotal{translate:-50% -50%;font-size:17px;color:var(--ink);background:#fff3c4;border:2px solid #f4c430;padding:3px 14px;border-radius:12px;animation:pop .4s}.gtotal b{color:#d84315;font-size:20px}@keyframes pop{0%{transform:scale(1.6);opacity:0}to{transform:scale(1);opacity:1}}.cpiece{translate:-50% -50%;font-size:13px;font-weight:800;color:#7a8290}.ctick{translate:-50% -50%;font-size:11px;color:#8a929c}.ctick.key{font-size:12px;font-weight:800;color:var(--ink)}.clegend{translate:-50% -50%;font-size:12px;background:#ffffffd9;padding:1px 8px;border-radius:8px}.clegend .lp{color:var(--p);font-weight:700}.clegend .lq{color:var(--q);font-weight:700}.clegend .le{color:var(--eq);font-weight:700}.cans{translate:-50% -50%;font-size:13px;font-weight:800;color:#fff;background:var(--eq);padding:1px 7px;border-radius:8px;animation:pop .4s}#topbar{position:absolute;left:0;top:0;width:1280px;height:60px;display:flex;align-items:center;gap:24px;padding:0 20px;background:#34495e;color:#fff}.brand{font-size:20px;font-weight:800;letter-spacing:1px}#tabs{display:flex;gap:8px}.tab{border:0;background:#ffffff1f;color:#e9eef5;font-size:15px;padding:8px 16px;border-radius:18px}.tab:hover{background:#ffffff38}.tab.on{background:#ffd54a;color:#4a3500;font-weight:800}.tab.ghost{background:transparent;border:1px solid rgba(255,255,255,.4)}#clock{position:absolute;left:18px;top:74px;width:290px;padding:10px 14px;border-radius:14px;background:#ffffffeb;box-shadow:0 3px 12px #00000014;font-size:13px;line-height:1.7;pointer-events:none}.ct{font-size:18px}.ct b{font-size:26px;color:#d84315;font-variant-numeric:tabular-nums}.crow b{font-variant-numeric:tabular-nums}.crow .dot{display:inline-block;width:20px;height:20px;line-height:20px;text-align:center;border-radius:50%;color:#fff;font-weight:900;font-size:12px;margin-right:4px}.crow.cp .dot{background:var(--p)}.crow.cq .dot{background:var(--q)}.crow .z{display:inline-block;font-size:11px;color:#6b7480;background:#f1f3f6;border-radius:6px;padding:0 5px;margin:0 6px}.ccmp{margin-top:4px;font-size:15px;font-weight:700;padding:2px 8px;border-radius:8px;background:#f1f3f6;display:inline-block}.ccmp.eq{background:var(--eq);color:#fff}.ccmp.eq span{color:#fff}.cp{color:var(--p)}.cq{color:var(--q)}#panel{position:absolute;left:880px;top:60px;width:400px;height:580px;padding:16px;background:#fff;border-left:1px solid #e3ddcc;overflow-y:auto}.q{font-size:16px;font-weight:700;line-height:1.6;margin-bottom:12px}.qtag{display:inline-block;background:#34495e;color:#fff;font-size:13px;padding:1px 10px;border-radius:10px;margin-right:8px}#steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}.step{border:2px solid #e6e8ec;border-radius:12px;padding:10px 12px;opacity:.45;cursor:pointer;transition:opacity .3s,border-color .3s,background .3s}.step.done{opacity:.85}.step.cur{opacity:1;border-color:#ffb300;background:#fffaf0;box-shadow:0 4px 14px #ffb3002e}.step.flash{animation:flash .8s}@keyframes flash{0%,to{transform:none}30%{transform:scale(1.03)}}.st{font-weight:800;font-size:15px;margin-bottom:4px}.tt{display:inline-block;font-size:12px;background:#eef1f5;border-radius:8px;padding:0 7px;margin-right:8px;color:#5c6470;font-weight:700}.step.cur .tt{background:#ffb300;color:#fff}.sb{font-size:14px;line-height:1.75}.step:not(.done) .sb{filter:blur(3px)}.f{display:inline-block;background:#eef4ff;color:#1d4fb8;padding:0 6px;border-radius:6px;font-weight:700}.ans{display:inline-block;background:#fff0c2;color:#c43e00;padding:0 8px;border-radius:6px;font-weight:900;font-size:16px}#timeline{position:absolute;left:0;top:640px;width:1280px;height:80px;display:flex;align-items:center;gap:14px;padding:0 20px;background:#fff;border-top:1px solid #e3ddcc}.round{width:48px;height:48px;border-radius:50%;border:0;background:#ff8f00;color:#fff;font-size:20px;box-shadow:0 3px 8px #ff8f0059;flex:none}.round.small{width:38px;height:38px;font-size:18px;background:#90a4ae;box-shadow:none}.track{position:relative;flex:1;height:48px}#slider{position:absolute;left:0;right:0;bottom:4px;width:100%;margin:0;accent-color:#ff8f00}#marks{position:absolute;left:8px;right:8px;top:0;height:22px}.mark{position:absolute;translate:-50% 0;font-size:12px;font-weight:700;color:#fff;background:#607d8b;padding:0 6px;border-radius:8px;cursor:pointer}.mark:after{content:"";position:absolute;left:50%;bottom:-5px;margin-left:-4px;border:4px solid transparent;border-bottom:0;border-top-color:#607d8b}#tval{width:120px;font-size:16px}#tval b{color:#d84315;font-size:20px;font-variant-numeric:tabular-nums}.speeds{display:flex;gap:4px}.spd{border:1px solid #cfd8dc;background:#fff;border-radius:8px;padding:4px 9px;font-size:13px}.spd.on{background:#34495e;color:#fff;border-color:#34495e}.auto{font-size:13px;color:#5c6470;display:flex;align-items:center;gap:4px}.auto.off{opacity:.4}.voice{border:2px solid #cfd8dc;background:#fff;color:#5c6470;border-radius:18px;padding:6px 12px;font-size:14px;font-weight:700;flex:none}.voice.on{border-color:#16a34a;background:#e8f7ee;color:#15803d}#board{position:absolute;left:590px;top:70px;translate:-50% 0;min-width:300px;max-width:540px;padding:8px 22px;border-radius:10px;background:#24493b;border:4px solid #8d6e4a;color:#fdfcf3;font-size:21px;font-weight:700;text-align:center;white-space:nowrap;box-shadow:0 6px 18px #00000040;pointer-events:none;font-family:Kaiti SC,STKaiti,KaiTi,PingFang SC,serif}#board b{color:#ffe066;font-size:26px}#board.pop{animation:boardpop .35s ease-out}@keyframes boardpop{0%{transform:scale(.85);opacity:.2}}.gpoint{translate:-50% -100%;color:#fff;font-size:14px;font-weight:800;padding:3px 10px;border-radius:12px;box-shadow:0 3px 10px #0003}.grange{translate:-50% -50%;font-size:14px;font-weight:800;background:#fff;border:2px solid;padding:1px 9px;border-radius:10px}.garrow{translate:-50% -50%;color:#fff;font-size:14px;font-weight:800;padding:2px 9px;border-radius:10px}.cbound{translate:-50% -50%;color:#fff;background:#ff6d00;font-size:12px;font-weight:700;padding:0 6px;border-radius:6px}.zone.dim,.seglen.dim{opacity:.18;transition:opacity .3s}.zone,.seglen{transition:opacity .3s}.dist.emph{animation:emph .6s ease-in-out infinite}@keyframes emph{50%{transform:scale(1.25)}}.say{float:right;font-size:14px;opacity:.35;transition:opacity .2s}.step:hover .say{opacity:.8}.step.speaking{border-color:#16a34a;background:#f0fbf4;box-shadow:0 4px 14px #16a34a33}.step.speaking .say{opacity:1;animation:talk .8s ease-in-out infinite}@keyframes talk{50%{transform:scale(1.35)}}#modal{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#1e283773}#modal .card{width:780px;background:#fffdf6;border-radius:18px;padding:22px 30px;font-size:16px;line-height:1.8;box-shadow:0 20px 60px #0000004d}#modal h2{margin:0 0 6px}#modal p{margin:6px 0}#modal .tip{margin-top:10px;background:#fff3c4;border-radius:10px;padding:6px 12px;font-weight:700}#modal .go{margin-top:14px;border:0;background:#ff8f00;color:#fff;font-size:17px;font-weight:800;padding:10px 26px;border-radius:22px}