:root{--ink:#0a0b16;--ink-2:#12142a;--card:#14162e;--line:#f0ece21a;--line-soft:#f0ece20f;--cream:#f2ede2;--muted:#8e93b5;--dim:#5f648a;--coral:#ff5470;--cyan:#2ee0c0;--gold:#ffd166;--display:"SF Pro Display", "Helvetica Neue", "PingFang TC", "Noto Sans TC", system-ui, sans-serif;--mono:ui-monospace, "SF Mono", "JetBrains Mono", Menlo, monospace}*{box-sizing:border-box}body{background:var(--ink);color:var(--cream);font-family:var(--display);-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;-webkit-font-smoothing:antialiased;margin:0;overflow:hidden}#stage{background:radial-gradient(120% 80% at 70% 0,#4a3b7a 0%,#0000 62%),linear-gradient(#34468f 0%,#263070 50%,#161b3c 100%);position:fixed;inset:0}#stage canvas{touch-action:none;display:block}#stage:after{content:"";pointer-events:none;background:radial-gradient(75% 60% at 50% 45%,#0000 40%,#080a1847 100%);position:absolute;inset:0}.micro{font-family:var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--muted);font-size:10px;font-weight:600}.micro.dim{color:var(--dim)}.micro.accent{color:var(--coral)}.micro.gold,.gold{color:var(--gold)}.micro.ok{color:var(--cyan)}.hud{pointer-events:none;padding:max(16px, env(safe-area-inset-top)) 16px 16px;grid-template-rows:auto 1fr auto;display:grid;position:fixed;inset:0}.hud-top{justify-content:space-between;align-items:flex-start;gap:16px;display:flex}.metric{flex-direction:column;gap:3px;display:flex}.metric-val{letter-spacing:-.045em;font-variant-numeric:tabular-nums;text-shadow:0 2px 24px #0a0b16e6;font-size:clamp(46px,12vw,82px);font-weight:800;line-height:.86}.metric-val i{letter-spacing:0;color:var(--muted);margin-left:4px;font-size:.28em;font-style:normal;font-weight:600}.hud-right{flex-direction:column;align-items:flex-end;gap:7px;display:flex}.pill{border:1px solid var(--line);-webkit-backdrop-filter:blur(10px);background:#0a0b168c;border-radius:3px;flex-direction:column;align-items:flex-end;gap:2px;padding:8px 12px;display:flex}.pill b{letter-spacing:-.01em;font-size:12px;font-weight:700}.pill-row{gap:6px;display:flex}.tag{font-family:var(--mono);color:var(--muted);border:1px solid var(--line);background:#0a0b168c;border-radius:3px;align-items:center;gap:5px;padding:4px 8px;font-size:10px;font-weight:600;display:inline-flex}.tag.gold{color:var(--gold)}.dot{background:var(--cyan);border-radius:50%;width:4px;height:4px;display:block}.combo{text-align:center;place-self:center;animation:.22s ease-out pop}.combo b{letter-spacing:-.04em;color:var(--coral);text-shadow:0 0 30px #ff54708c;font-size:40px;font-weight:800;display:block}@keyframes pop{0%{opacity:0;transform:scale(.82)}to{opacity:1;transform:scale(1)}}.hud-bottom{padding-bottom:env(safe-area-inset-bottom);justify-content:center;display:flex}.hint{font-family:var(--mono);color:var(--dim);letter-spacing:.08em;margin:0;font-size:10px}.hint kbd{font-family:var(--mono);border:1px solid var(--line);color:var(--muted);border-radius:3px;margin-right:2px;padding:1px 4px}.panel{-webkit-backdrop-filter:blur(14px);pointer-events:auto;z-index:20;background:#060710bd;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.panel.scroll{align-items:start;padding-block:24px;overflow-y:auto}.card{background:linear-gradient(180deg, var(--card) 0%, var(--ink-2) 100%);border:1px solid var(--line);border-radius:4px;flex-direction:column;gap:18px;width:min(440px,100%);padding:28px 24px 22px;display:flex}.brand{align-items:center;gap:10px;display:flex}.rule{background:var(--coral);width:28px;height:2px;display:block}.card h1{letter-spacing:-.05em;text-wrap:balance;margin:0;font-size:54px;font-weight:800;line-height:.92}.card.intro p{color:var(--muted);margin:0;font-size:14px;line-height:1.7}.campaign-note{border:1px solid var(--line);border-left:2px solid var(--coral);background:#ff54700d;border-radius:3px;flex-direction:column;gap:4px;padding:12px 14px;display:flex}.campaign-note b{font-size:14px;font-weight:700}button.play{appearance:none;background:var(--coral);color:#14060c;letter-spacing:.02em;cursor:pointer;border:0;border-radius:3px;width:100%;padding:15px;font-family:inherit;font-size:15px;font-weight:800;transition:filter .15s,transform .1s}button.play:hover{filter:brightness(1.08)}button.play:active{transform:translateY(1px)}button.play:focus-visible{outline:2px solid var(--gold);outline-offset:3px}.foot{font-family:var(--mono);color:var(--dim);text-align:center;letter-spacing:.04em;margin:0;font-size:10px}.result{justify-content:space-between;align-items:flex-end;gap:16px;display:flex}.big{letter-spacing:-.05em;font-variant-numeric:tabular-nums;margin:6px 0 4px;font-size:68px;font-weight:800;line-height:.86}.big i{color:var(--muted);margin-left:3px;font-size:.26em;font-style:normal;font-weight:600}.stats{text-align:right;gap:20px;margin:0;display:flex}.stats div{flex-direction:column;gap:3px;display:flex}.stats dt{margin:0}.stats dd{font-family:var(--mono);font-variant-numeric:tabular-nums;margin:0;font-size:22px;font-weight:700}.block{border-top:1px solid var(--line-soft);flex-direction:column;gap:10px;padding-top:16px;display:flex}.block-head{justify-content:space-between;align-items:baseline;gap:12px;display:flex}.block-head h2{color:var(--cream);margin:0;font-size:10px}.block-head.as-btn{appearance:none;cursor:pointer;text-align:left;background:0 0;border:0;width:100%;padding:0;font-family:inherit}.missions{flex-direction:column;gap:11px;margin:0;padding:0;list-style:none;display:flex}.missions li{align-items:center;gap:14px;display:flex}.m-main{flex-direction:column;flex:1;gap:7px;min-width:0;display:flex}.m-label{color:var(--cream);font-size:13px;font-weight:600}.missions li.done .m-label{color:var(--cyan)}.bar{background:#f0ece217;border-radius:2px;height:2px;overflow:hidden}.bar i{background:var(--coral);height:100%;transition:width .35s;display:block}.missions li.done .bar i{background:var(--cyan)}.m-side{white-space:nowrap;flex-direction:column;align-items:flex-end;gap:5px;display:flex}.chip-btn{appearance:none;border:1px solid var(--cyan);color:var(--cyan);font-family:var(--mono);cursor:pointer;background:#2ee0c01a;border-radius:3px;padding:4px 8px;font-size:10px;font-weight:700}.chip-btn:disabled{border-color:var(--line);color:var(--dim);cursor:default;background:0 0}.events{flex-direction:column;gap:4px;margin:0;padding:0;list-style:none;display:flex}.events li{font-family:var(--mono);background:#f0ece209;border-radius:3px;align-items:baseline;gap:8px;padding:5px 8px;font-size:10.5px;display:flex;overflow:hidden}.events b{color:var(--cyan);flex-shrink:0;font-weight:700}.events span{color:var(--dim);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.board{flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.board li{border-bottom:1px solid var(--line-soft);grid-template-columns:26px 1fr auto;align-items:center;gap:12px;padding:8px 0;font-size:13px;display:grid}.board li:last-child{border-bottom:0}.board li.me .nm{color:var(--coral);font-weight:700}.board .rk{font-family:var(--mono);color:var(--dim);font-size:10px}.board .nm{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.board .sc{font-family:var(--mono);font-variant-numeric:tabular-nums;font-weight:700}.board .sc i{color:var(--dim);margin-left:2px;font-size:10px;font-style:normal}.share{border-top:1px solid var(--line-soft);flex-direction:column;gap:10px;padding-top:16px;display:flex}.share-canvas{border:1px solid var(--line);border-radius:3px;width:100%;height:auto;display:block}button.ghost{appearance:none;border:1px solid var(--line);color:var(--cream);font-family:var(--mono);letter-spacing:.06em;cursor:pointer;background:0 0;border-radius:3px;padding:11px;font-size:11px;font-weight:600}button.ghost:hover{border-color:var(--coral);color:var(--coral)}@media (prefers-reduced-motion:reduce){.combo{animation:none}.bar i,button.play{transition:none}}.how{border:1px solid var(--line);background:#f0ece208;border-radius:3px;flex-direction:column;gap:9px;padding:14px;display:flex}.how ul{flex-direction:column;gap:7px;margin:0;padding:0;list-style:none;display:flex}.how li{color:var(--cream);align-items:center;gap:9px;font-size:13px;display:flex}.key{font-family:var(--mono);letter-spacing:.06em;color:var(--cyan);white-space:nowrap;border:1px solid #2ee0c059;border-radius:3px;flex-shrink:0;padding:3px 7px;font-size:10.5px;font-weight:700}.how-note{color:var(--dim);margin:2px 0 0;font-size:12px;line-height:1.6}.coach{pointer-events:none;z-index:15;flex-direction:column;align-items:center;gap:14px;animation:.4s ease-out coach-in;display:flex;position:fixed;bottom:16%;left:50%;transform:translate(-50%)}@keyframes coach-in{0%{opacity:0;transform:translate(-50%,10px)}to{opacity:1;transform:translate(-50%)}}.coach-swipe{flex-direction:column;align-items:center;gap:4px;display:flex}.coach-mid{align-items:center;gap:10px;display:flex}.coach .arrow{color:var(--cream);opacity:.5;font-size:17px;line-height:1;animation:1.6s ease-in-out infinite nudge}.coach .arrow.up{animation-delay:0s}.coach .arrow.right{animation-delay:.4s}.coach .arrow.down{animation-delay:.8s}.coach .arrow.left{animation-delay:1.2s}@keyframes nudge{0%,70%,to{opacity:.3}15%{opacity:1}}.coach .finger{border:2px solid var(--cream);opacity:.85;border-radius:50%;width:34px;height:34px;animation:1.6s ease-in-out infinite tap}@keyframes tap{0%,to{transform:scale(1);box-shadow:0 0 #f2ede266}50%{transform:scale(.86);box-shadow:0 0 0 12px #f2ede200}}.coach-text{text-align:center;color:var(--cream);text-shadow:0 2px 12px #080a18e6;margin:0;font-size:13px;line-height:1.7}.coach-text b{color:var(--cyan);font-weight:700}.coach-text kbd{font-family:var(--mono);border:1px solid var(--line);color:var(--muted);border-radius:3px;margin:0 1px;padding:2px 5px;font-size:11px}@media (prefers-reduced-motion:reduce){.coach,.coach .arrow,.coach .finger{animation:none}}
