:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--theme-bg:#e4e9ef;--theme-bg2:#d3dbe5;--theme-board:#c8d1dc;--theme-text:#2b3342;--theme-textMuted:#6b7588;--theme-warm:#f2dcc6;--theme-tile1:#e8847a;--theme-score:#2b3342;--surface:color-mix(in srgb, var(--theme-bg) 60%, white);--surface-strong:color-mix(in srgb, var(--theme-bg) 20%, white);--border:color-mix(in srgb, var(--theme-text) 12%, transparent);--border-strong:color-mix(in srgb, var(--theme-text) 22%, transparent);--focus-ring:color-mix(in srgb, var(--theme-tile1) 70%, white);--accent:color-mix(in srgb, var(--theme-tile1) 80%, var(--theme-text));--accent-soft:color-mix(in srgb, var(--theme-tile1) 22%, transparent);--danger:color-mix(in srgb, var(--theme-tile1) 70%, black);--changed:color-mix(in srgb, var(--theme-tile1) 75%, var(--theme-text));--glass:color-mix(in srgb, var(--theme-bg) 42%, white);--glass-hover:color-mix(in srgb, var(--theme-bg) 20%, white);--glass-edge:color-mix(in srgb, var(--theme-text) 10%, transparent);--glass-hi:#fff9;--sheet:color-mix(in srgb, var(--theme-bg) 30%, white);--hairline:color-mix(in srgb, var(--theme-text) 9%, transparent);--track:color-mix(in srgb, var(--theme-text) 12%, transparent);--scrim:color-mix(in srgb, var(--theme-bg) 45%, transparent);--dock-bg:color-mix(in srgb, var(--theme-bg) 70%, white);--badge-live-bg:color-mix(in srgb, var(--theme-warm) 60%, white);--badge-live-fg:var(--theme-text);--badge-new-bg:color-mix(in srgb, var(--theme-textMuted) 18%, white);--badge-new-fg:var(--theme-textMuted);--ctl-h:32px;--font-display:"Songti SC", "STSong", "Source Han Serif SC", "Noto Serif SC", "Times New Roman", Georgia, serif;--font-sans:"PingFang SC", "Hiragino Sans GB", "Noto Sans SC", "Microsoft YaHei", "Segoe UI", system-ui, -apple-system, sans-serif;--font-mono:ui-monospace, "SF Mono", Menlo, Consolas, monospace;--text-xs:11px;--text-sm:13px;--text-md:15px;--text-lg:22px;--text-xl:38px;--text-huge:46px;--weight-display:800;--weight-score:600;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--radius-sm:8px;--radius-md:12px;--radius-lg:20px;--radius-pill:999px;--shadow-sm:0 1px 2px #141e3214;--shadow-md:0 8px 24px #141e3224;--shadow-btn:0 1px 1px #141e320f, 0 4px 12px #141e321a, inset 0 1px 0 var(--glass-hi);--shadow-sheet:0 0 0 1px var(--hairline), 24px 0 60px #141e322e;--duration-fast:.12s;--duration-base:.2s;--duration-slow:.36s;--ease-out:cubic-bezier(.2, .8, .2, 1);--ease-sheet:cubic-bezier(.32, .72, 0, 1);--dock-width:360px;--dock-breakpoint:1100px;--hud-max-width:520px;--btn-size:48px;--btn-size-lg:58px;--z-hud:10;--z-overlay:20;--z-dock:30}:root[data-theme-dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--surface:color-mix(in srgb, var(--theme-bg) 78%, white);--surface-strong:color-mix(in srgb, var(--theme-bg) 68%, white);--border:color-mix(in srgb, var(--theme-text) 22%, transparent);--border-strong:color-mix(in srgb, var(--theme-text) 34%, transparent);--focus-ring:color-mix(in srgb, var(--theme-tile1) 70%, white);--accent:color-mix(in srgb, var(--theme-tile1) 85%, white);--accent-soft:color-mix(in srgb, var(--theme-tile1) 26%, transparent);--changed:color-mix(in srgb, var(--theme-tile1) 80%, white);--glass:color-mix(in srgb, var(--theme-bg) 82%, white);--glass-hover:color-mix(in srgb, var(--theme-bg) 72%, white);--glass-edge:color-mix(in srgb, var(--theme-text) 26%, transparent);--glass-hi:#ffffff14;--sheet:color-mix(in srgb, var(--theme-bg) 88%, white);--hairline:color-mix(in srgb, var(--theme-text) 18%, transparent);--track:color-mix(in srgb, var(--theme-text) 24%, transparent);--scrim:color-mix(in srgb, var(--theme-bg) 40%, transparent);--dock-bg:color-mix(in srgb, var(--theme-bg) 88%, black);--badge-live-bg:color-mix(in srgb, var(--theme-warm) 55%, var(--theme-bg));--badge-live-fg:var(--theme-text);--badge-new-bg:color-mix(in srgb, var(--theme-textMuted) 28%, var(--theme-bg));--badge-new-fg:var(--theme-text);--shadow-sm:0 1px 2px #00000059;--shadow-md:0 8px 24px #00000080;--shadow-btn:0 1px 1px #0000004d, 0 4px 12px #00000059, inset 0 1px 0 var(--glass-hi);--shadow-sheet:0 0 0 1px var(--hairline), 24px 0 60px #00000080}.ui-icon{fill:none;stroke:currentColor;stroke-width:1.75px;stroke-linecap:round;stroke-linejoin:round;flex:none;width:20px;height:20px}.ui-icon-btn{width:var(--btn-size);height:var(--btn-size);border:1px solid var(--glass-edge);border-radius:var(--radius-pill);background:var(--glass);color:var(--theme-text);cursor:pointer;box-shadow:var(--shadow-btn);transition:transform var(--duration-fast) var(--ease-out), background-color var(--duration-base), opacity var(--duration-base);justify-content:center;align-items:center;padding:0;display:inline-flex;position:relative}.ui-icon-btn:hover:not(:disabled){background:var(--glass-hover)}.ui-icon-btn:active:not(:disabled){transform:scale(.93)}.ui-icon-btn:disabled{opacity:.3;cursor:default;box-shadow:none}.ui-icon-btn:focus-visible{outline:2px solid var(--focus-ring);outline-offset:3px}.ui-icon-btn.primary{width:var(--btn-size-lg);height:var(--btn-size-lg)}.ui-icon-btn.primary .ui-icon{width:24px;height:24px}.ui-icon-btn.tiny{width:32px;height:32px}.ui-icon-btn.tiny .ui-icon{width:16px;height:16px}.ui-icon-btn.ghost{box-shadow:none;color:var(--theme-textMuted);background:0 0;border-color:#0000}.ui-icon-btn.ghost:hover:not(:disabled){background:var(--track)}.ui-icon-btn .count{border-radius:var(--radius-pill);background:var(--accent);min-width:20px;height:20px;color:var(--theme-bg);font-size:var(--text-xs);font-variant-numeric:tabular-nums;padding:0 5px;font-weight:700;line-height:20px;position:absolute;top:-1px;right:-1px}.ui-btn{justify-content:center;align-items:center;gap:var(--space-2);border:1px solid var(--glass-edge);border-radius:var(--radius-md);background:var(--glass);min-height:44px;color:var(--theme-text);font:inherit;font-size:var(--text-sm);cursor:pointer;box-shadow:var(--shadow-btn);transition:transform var(--duration-fast) var(--ease-out), background-color var(--duration-base);padding:10px 18px;font-weight:600;display:inline-flex}.ui-btn:active{transform:scale(.97)}.ui-btn:focus-visible{outline:2px solid var(--focus-ring);outline-offset:3px}.ui-btn.accent{background:var(--accent);color:var(--theme-bg);border-color:#0000}.ui-btn.wide{width:100%}.ui-btn.small{min-height:32px;padding:4px 14px}.ui-btn .ui-icon{width:18px;height:18px}.scrim{background:var(--scrim);-webkit-backdrop-filter:blur(5px);pointer-events:auto;z-index:var(--z-overlay);animation:fade-in var(--duration-base) var(--ease-out) both;position:absolute;inset:0}.scrim.center{padding:var(--space-4);z-index:calc(var(--z-overlay) + 1);justify-content:center;align-items:center;display:flex}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.drawer{background:var(--sheet);width:min(88vw,380px);box-shadow:var(--shadow-sheet);padding:calc(var(--space-4) + env(safe-area-inset-top,0px)) var(--space-5) calc(var(--space-4) + env(safe-area-inset-bottom,0px)) calc(var(--space-5) + env(safe-area-inset-left,0px));animation:drawer-in var(--duration-slow) var(--ease-sheet) both;flex-direction:column;display:flex;position:absolute;inset:0 auto 0 0}@keyframes drawer-in{0%{transform:translate(-100%)}to{transform:none}}.drawer-head{justify-content:space-between;align-items:flex-start;gap:var(--space-3);display:flex}.brand{font-family:var(--font-display);font-size:var(--text-lg);letter-spacing:.08em;margin:0;font-weight:600;line-height:1.2}.brand-alt{font-size:var(--text-xs);letter-spacing:.26em;color:var(--theme-textMuted);margin:4px 0 0}.drawer-body{min-height:0;margin-top:var(--space-4);padding-right:var(--space-2);scrollbar-width:thin;scrollbar-color:var(--track) transparent;flex:1;overflow-y:auto}.drawer-body::-webkit-scrollbar{width:6px}.drawer-body::-webkit-scrollbar-thumb{background:var(--track);border-radius:var(--radius-pill)}.dialog{width:min(100%,320px);padding:var(--space-5);border-radius:var(--radius-lg);background:var(--sheet);box-shadow:var(--shadow-md);text-align:center;gap:var(--space-3);animation:dialog-in var(--duration-base) var(--ease-out) both;flex-direction:column;align-items:center;display:flex}@keyframes dialog-in{0%{opacity:0;transform:scale(.94)}to{opacity:1;transform:none}}.dialog-title{font-size:var(--text-md);color:var(--theme-textMuted);margin:0;font-weight:600}.dialog-body{font-size:var(--text-sm);color:var(--theme-textMuted);font-variant-numeric:tabular-nums;margin:0;line-height:1.6}.dialog-actions{gap:var(--space-3);width:100%;display:flex}.dialog-actions .ui-btn{flex:1}.result-score{font-family:var(--font-display);font-size:var(--text-huge);font-variant-numeric:tabular-nums;font-weight:700;line-height:1}.sec+.sec{margin-top:var(--space-5);padding-top:var(--space-4);border-top:1px solid var(--hairline)}.sec-title{margin:0 0 var(--space-3);font-size:var(--text-xs);letter-spacing:.16em;text-transform:uppercase;color:var(--theme-textMuted);font-weight:700}.ui-row{justify-content:space-between;align-items:center;gap:var(--space-4);padding:var(--space-2) 0;display:flex}.ui-row.stacked{display:block}.ui-row.stacked .row-control{margin-top:var(--space-2)}.row-text{flex-direction:column;gap:2px;min-width:0;display:flex}.row-control{flex:none}.row-label{font-size:var(--text-sm);font-weight:600}.row-hint{font-size:var(--text-xs);color:var(--theme-textMuted);line-height:1.5}.ui-note{margin:var(--space-2) 0 0;font-size:var(--text-xs);color:var(--theme-textMuted);line-height:1.6}.ui-note.dim{opacity:.75;font-variant-numeric:tabular-nums}.segmented{border-radius:var(--radius-md);background:var(--track);gap:3px;padding:3px;display:flex}.ui-seg{min-height:36px;padding:0 var(--space-3);border-radius:calc(var(--radius-md) - 3px);color:var(--theme-textMuted);font:inherit;font-size:var(--text-sm);cursor:pointer;transition:background-color var(--duration-base) var(--ease-out), color var(--duration-base);background:0 0;border:0;flex:1;font-weight:600}.ui-seg.on{background:var(--sheet);color:var(--theme-text);box-shadow:var(--shadow-sm)}.ui-seg:focus-visible{outline:2px solid var(--focus-ring);outline-offset:1px}.ui-switch{border:1px solid var(--hairline);border-radius:var(--radius-pill);background:var(--track);cursor:pointer;width:46px;height:28px;transition:background-color var(--duration-base) var(--ease-out);flex:none;padding:0;position:relative}.ui-switch[aria-checked=true]{background:var(--accent);border-color:#0000}.ui-switch:disabled{opacity:.4;cursor:default}.ui-switch:focus-visible{outline:2px solid var(--focus-ring);outline-offset:3px}.switch-knob{width:22px;height:22px;box-shadow:var(--shadow-sm);transition:transform var(--duration-base) var(--ease-out);background:#fff;border-radius:50%;position:absolute;top:2px;left:2px}.ui-switch[aria-checked=true] .switch-knob{transform:translate(18px)}.slider{align-items:center;gap:var(--space-3);min-width:150px;display:flex}.slider input{appearance:none;cursor:pointer;background:0 0;flex:1;min-width:0;height:28px;margin:0}.slider input::-webkit-slider-runnable-track{border-radius:var(--radius-pill);background:var(--track);height:4px}.slider input::-moz-range-track{border-radius:var(--radius-pill);background:var(--track);height:4px}.slider input::-webkit-slider-thumb{appearance:none;background:var(--accent);width:18px;height:18px;box-shadow:var(--shadow-sm);border-radius:50%;margin-top:-7px}.slider input::-moz-range-thumb{background:var(--accent);width:18px;height:18px;box-shadow:var(--shadow-sm);border:0;border-radius:50%}.slider input:focus-visible{outline:2px solid var(--focus-ring);outline-offset:4px;border-radius:var(--radius-pill)}.slider-value{text-align:right;width:2.4em;font-size:var(--text-xs);font-variant-numeric:tabular-nums;color:var(--theme-textMuted)}.themes{gap:var(--space-2);grid-template-columns:repeat(3,minmax(0,1fr));display:grid}.theme-card{align-items:center;gap:var(--space-2);padding:var(--space-2);border:1px solid var(--hairline);border-radius:var(--radius-md);color:var(--theme-textMuted);font:inherit;font-size:var(--text-xs);cursor:pointer;transition:border-color var(--duration-base), color var(--duration-base);background:0 0;flex-direction:column;display:flex}.theme-card.on{border-color:var(--accent);color:var(--theme-text);box-shadow:0 0 0 1px var(--accent)}.theme-card:focus-visible{outline:2px solid var(--focus-ring);outline-offset:2px}.theme-swatch{aspect-ratio:1;border-radius:var(--radius-sm);grid-template-columns:1fr 1fr;gap:3px;width:100%;padding:5px;display:grid}.theme-swatch i{border-radius:3px}.theme-name{font-weight:600}.howto{gap:var(--space-2);font-size:var(--text-sm);color:var(--theme-textMuted);flex-direction:column;margin:0;padding-left:1.2em;line-height:1.65;display:flex}.howto li::marker{color:var(--accent);font-weight:700}.hint{align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);border-radius:var(--radius-pill);background:var(--glass);border:1px solid var(--glass-edge);box-shadow:var(--shadow-btn);color:var(--theme-textMuted);font-size:var(--text-sm);pointer-events:none;animation:2.6s ease-in-out infinite hint-breathe;display:flex}.hint-icon{fill:none;stroke:currentColor;stroke-width:1.5px;stroke-linecap:round;stroke-linejoin:round;width:18px;height:18px}@keyframes hint-breathe{0%,to{opacity:.72}50%{opacity:1}}.toast{left:50%;top:calc(var(--space-6) + 44px + env(safe-area-inset-top,0px));align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-2) var(--space-2) var(--space-4);border-radius:var(--radius-pill);background:var(--glass);border:1px solid var(--glass-edge);box-shadow:var(--shadow-btn);font-size:var(--text-sm);pointer-events:auto;z-index:var(--z-overlay);animation:toast-in var(--duration-slow) var(--ease-out) both;display:flex;position:absolute;transform:translate(-50%)}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,-10px)}to{opacity:1;transform:translate(-50%)}}@media (prefers-reduced-motion:reduce){.scrim,.drawer,.dialog,.toast,.hint,.mult,.ui-btn,.ui-icon-btn,.ui-seg,.switch-knob,.score-total,.score-delta{transition:none;animation:none}}*{box-sizing:border-box}html,body{background:var(--theme-bg);height:100%;color:var(--theme-text);font-family:var(--font-sans);overscroll-behavior:none;-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;margin:0}body{touch-action:manipulation;position:fixed;inset:0;overflow:hidden}#shell{grid-template-columns:minmax(0,1fr);width:100%;height:100dvh;display:grid}.dev-dock{width:var(--dock-width);border-color:var(--border);border-style:solid;border-width:0;display:none;overflow:auto}@media (width>=1100px){#shell{grid-template-columns:auto minmax(0,1fr) auto}.dev-dock{display:block}.dev-dock:empty{display:none}#dev-left{border-right-width:1px;grid-column:1}#game{grid-column:2}#dev-right{border-left-width:1px;grid-column:3}}#game{background:linear-gradient(180deg, var(--theme-bg) 0%, var(--theme-bg2) 100%);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;min-width:0;min-height:0;position:relative;overflow:hidden}#stage{touch-action:none;cursor:pointer;position:absolute;inset:0}#stage canvas{display:block;width:100%!important;height:100%!important}#hud{pointer-events:none;z-index:var(--z-hud);position:absolute;inset:0}.bar{align-items:center;gap:var(--space-3);max-width:calc(var(--hud-max-width) + var(--space-5) * 2);padding-left:var(--space-4);padding-right:var(--space-4);margin:0 auto;display:grid;position:absolute;left:0;right:0}.bar>*{pointer-events:auto}.top>.ui-icon-btn{justify-self:start}.top>.best{justify-self:end}.top{grid-template-columns:minmax(var(--btn-size), 1fr) auto minmax(var(--btn-size), 1fr);padding-top:calc(var(--space-3) + env(safe-area-inset-top,0px));padding-bottom:var(--space-2);align-items:start;top:0}.bottom{align-items:center;gap:var(--space-3);padding-top:var(--space-3);padding-bottom:calc(var(--space-4) + env(safe-area-inset-bottom,0px));flex-direction:column;display:flex;bottom:0}.btn-row{justify-content:center;align-items:center;gap:var(--space-5);display:flex}.score-block{pointer-events:none;flex-direction:column;align-items:center;gap:2px;min-width:0;display:flex}.score-total{height:var(--btn-size);font-family:var(--font-display);font-size:var(--text-xl);font-weight:var(--weight-score);font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1;letter-spacing:.01em;color:var(--theme-score);align-items:center;line-height:1;display:inline-flex}.score-total.pulse{animation:score-pop var(--duration-slow) var(--ease-out) both}.score-live{justify-content:center;align-items:baseline;gap:var(--space-2);min-height:1.4em;display:flex}.score-delta,.score-live .mult{opacity:0;transition:opacity var(--duration-fast)}.score-delta.on,.score-live .mult.on{opacity:1}.score-delta{font-size:var(--text-md);font-variant-numeric:tabular-nums;color:var(--accent);font-weight:700;line-height:1.2}.score-delta.on{animation:delta-pop var(--duration-base) var(--ease-out) both}.score-delta.on.out,.score-live .mult.on.out{animation:live-out .48s var(--ease-out) both}@keyframes delta-pop{0%{opacity:0;transform:translateY(4px)scale(.8)}to{opacity:1;transform:none}}@keyframes live-out{0%{opacity:1}to{opacity:0}}.best{justify-content:flex-end;align-items:baseline;gap:var(--space-1);height:var(--btn-size);line-height:var(--btn-size);opacity:.8;pointer-events:none;min-width:var(--btn-size);display:flex}.best small{font-size:var(--text-xs);color:var(--theme-textMuted);letter-spacing:.08em}.best b{font-family:var(--font-display);font-size:var(--text-md);font-weight:var(--weight-score);font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1;color:var(--theme-score)}.mult{border-radius:var(--radius-pill);background:var(--surface);color:var(--theme-textMuted);font-size:var(--text-sm);font-variant-numeric:tabular-nums;transition:background-color var(--duration-base), color var(--duration-base), opacity var(--duration-fast), transform var(--duration-fast) var(--ease-out);align-items:baseline;gap:2px;padding:2px 9px;font-weight:600;display:inline-flex}.mult.hot{background:var(--theme-warm);color:var(--theme-text);transform:scale(1.08)}.mult.hot.pulse{animation:mult-pop var(--duration-slow) var(--ease-out) both}@keyframes mult-pop{0%{transform:scale(1.08)}35%{transform:scale(1.3)}to{transform:scale(1.08)}}@keyframes score-pop{0%{transform:scale(1)}30%{color:var(--accent);transform:scale(1.16)}to{transform:scale(1)}}.error-banner{left:50%;bottom:calc(96px + env(safe-area-inset-bottom,0px));max-width:min(92%, var(--hud-max-width));padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);color:#fff;font-family:var(--font-mono);font-size:var(--text-xs);pointer-events:auto;white-space:pre-wrap;word-break:break-all;z-index:var(--z-overlay);background:#3a2222;position:absolute;transform:translate(-50%)}
