:root{--sat:env(safe-area-inset-top,0px);--sab:env(safe-area-inset-bottom,0px);--sal:env(safe-area-inset-left,0px);--sar:env(safe-area-inset-right,0px);--font:system-ui, -apple-system, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans CJK SC", "Noto Sans CJK TC", sans-serif;--ink:#5a3a2a;--ink-soft:#8a6a58;--panel:#fffaf4eb;--accent:#ff5f7e;--accent-dark:#c9284d;--green:#4caf50;--green-dark:#2e7d32;--glass:#ffffff8c;--glass-border:#ffffffd9;--shadow:0 8px 24px #5a32142e;--box-left:0px;--box-top:0px;--box-w:100vw;--box-h:100vh}*{box-sizing:border-box}html,body{height:100%;font-family:var(--font);color:var(--ink);overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;background:#ffd9bf;margin:0}#app{position:fixed;inset:0;overflow:hidden}#game{touch-action:none;cursor:crosshair;width:100%;height:100%;display:block;position:absolute;inset:0}.hidden{display:none!important}#hud{left:var(--box-left);top:var(--box-top);width:var(--box-w);pointer-events:none;padding:max(8px, var(--sat)) 8px 0;z-index:5;grid-template-columns:auto auto 1fr auto;align-items:start;gap:6px;display:grid;position:absolute}.pill{background:var(--glass);border:1.5px solid var(--glass-border);-webkit-backdrop-filter:blur(6px);white-space:nowrap;border-radius:999px;align-items:center;gap:6px;padding:6px 12px;font-size:14px;font-weight:700;display:inline-flex;box-shadow:0 2px 10px #5a32141f}.pill .label{color:var(--ink-soft);letter-spacing:.04em;text-transform:uppercase;font-size:12px}.pill .value{font-variant-numeric:tabular-nums;text-align:right;min-width:2ch;font-size:18px}#nextPill{grid-column:4;padding:4px 10px 4px 12px}#nextIcon{width:36px;height:36px}#scorePill .value{transition:transform .15s}#scorePill.bump .value{transform:scale(1.25)}#hud.danger .pill{border-color:#ff5a5ae6;box-shadow:0 0 14px #ff3c3c73}#ring{left:calc(var(--box-left) + var(--box-w) + 18px);top:calc(var(--box-top) + var(--box-h) * .32);background:var(--glass);border:1.5px solid var(--glass-border);-webkit-backdrop-filter:blur(6px);pointer-events:none;z-index:5;border-radius:20px;width:200px;padding:10px 12px 12px;position:absolute;box-shadow:0 2px 10px #5a32141f}.ring-title{text-align:center;color:var(--ink-soft);letter-spacing:.04em;margin-bottom:6px;font-size:13px;font-weight:800}.ring-items{height:176px;position:relative}.ring-items canvas{position:absolute;transform:translate(-50%,-50%)}.ring-items .arrow{color:var(--ink-soft);opacity:.6;font-size:26px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}#corner{right:calc(var(--sar) + 10px);bottom:calc(var(--sab) + 10px);z-index:11;gap:8px;display:flex;position:absolute}.icon-btn{border:1.5px solid var(--glass-border);background:var(--glass);-webkit-backdrop-filter:blur(6px);width:44px;height:44px;color:var(--ink);cursor:pointer;touch-action:manipulation;border-radius:50%;justify-content:center;align-items:center;padding:0;font-size:20px;display:inline-flex;box-shadow:0 2px 10px #5a321426}.icon-btn:active{transform:scale(.94)}.overlay{z-index:10;padding:calc(var(--sat) + 12px) calc(var(--sar) + 12px) calc(var(--sab) + 12px) calc(var(--sal) + 12px);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#5a321e59;justify-content:center;align-items:center;display:flex;position:absolute;inset:0;overflow-y:auto}.panel{background:var(--panel);width:min(440px,100%);max-height:100%;box-shadow:var(--shadow);text-align:center;border:2px solid #ffffffe6;border-radius:26px;padding:24px 26px;overflow-y:auto}.panel h1{letter-spacing:.02em;background:linear-gradient(90deg,#ff5f7e,#ff9f1c,#4caf50,#2f9e57);color:#0000;filter:drop-shadow(0 2px #fffc);-webkit-background-clip:text;background-clip:text;margin:0 0 4px;font-size:clamp(30px,7vw,44px)}.panel h2{color:var(--accent-dark);margin:0 0 10px;font-size:clamp(24px,5vw,32px)}.panel p{margin:6px 0;font-size:16px;line-height:1.45}.panel .muted{color:var(--ink-soft);font-size:14px}.panel .tagline{font-weight:600}.btn{color:#fff;font:700 18px var(--font);cursor:pointer;touch-action:manipulation;text-shadow:0 1px #00000026;background:linear-gradient(#ff8aa0,#ff5f7e);border:none;border-radius:999px;min-width:170px;margin:8px 6px 0;padding:13px 28px;display:inline-block;box-shadow:0 4px #c9284d,0 8px 16px #c9284d40}.btn:hover{filter:brightness(1.05)}.btn:active{transform:translateY(3px);box-shadow:0 1px #c9284d}.btn.primary{background:linear-gradient(#8fe08a,#3fae3a);box-shadow:0 4px #2e7d32,0 8px 16px #2e7d3240}.btn.primary:active{box-shadow:0 1px #2e7d32}.btn.secondary{color:var(--ink);min-width:0;text-shadow:none;background:#fff;padding:9px 16px;font-size:15px;box-shadow:0 3px #d9c2b3}.btn.secondary:active{box-shadow:0 1px #d9c2b3}.btn.secondary.active{background:linear-gradient(#ffe9a8,#ffd166);box-shadow:0 3px #c99a2e}.row{flex-wrap:wrap;justify-content:center;gap:6px;margin-top:10px;display:flex}.lang-row{margin-top:14px}.big-score{color:var(--green-dark);font-variant-numeric:tabular-nums;margin:6px 0;font-size:clamp(34px,8vw,48px);font-weight:800}.new-best{color:#8a5a00;background:linear-gradient(#ffe9a8,#ffd166);border-radius:999px;padding:4px 14px;font-size:15px;font-weight:800;animation:.5s ease-out pop;display:inline-block}@keyframes pop{0%{transform:scale(.4)}70%{transform:scale(1.15)}to{transform:scale(1)}}.evo{flex-wrap:wrap;justify-content:center;align-items:center;gap:2px;margin:12px 0 4px;display:flex}.evo canvas{display:block}.evo .sep{color:var(--ink-soft);opacity:.7;font-size:12px}@media (max-width:420px){.pill{gap:4px;padding:4px 9px}.pill .label{font-size:10px}.pill .value{font-size:16px}#nextIcon{width:30px;height:30px}.panel{padding:18px 16px}}.submit-box{background:#ffffffb3;border:1.5px solid #fffffff2;border-radius:18px;margin:14px 0 4px;padding:14px 14px 12px;box-shadow:inset 0 1px #fffc,0 2px 10px #5a321414}.submit-label{margin-bottom:8px;font-size:15px;font-weight:700;display:block}.submit-fields{align-items:stretch;gap:8px;display:flex}.name-input{min-width:0;font:600 17px var(--font);color:var(--ink);-webkit-user-select:text;user-select:text;appearance:none;background:#fff;border:2px solid #e6d3c4;border-radius:999px;outline:none;flex:1;padding:10px 16px}.name-input::placeholder{color:#b9a596;font-weight:500}.name-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px #ff5f7e33}.name-input:disabled{opacity:.6}.btn.submit-btn{white-space:nowrap;min-width:0;margin:0;padding:10px 18px;font-size:16px}.btn:disabled{opacity:.5;cursor:default;filter:none;transform:none}.panel .hint{color:var(--ink-soft);margin:8px 2px 0;font-size:12.5px;line-height:1.35}.panel .submit-status{min-height:0;margin:8px 0 0;font-size:14px;font-weight:600}.panel .submit-status:empty{display:none}.submit-status.ok{color:var(--green-dark);font-size:15px}.submit-status.bad,.lb-note.bad{color:var(--accent-dark)}.lb-tabs{margin-top:4px}.lb-body{min-height:120px;margin-top:12px}.panel .lb-note{margin:28px 0 12px;font-size:15px}.panel .lb-resets{margin:10px 0 0;font-size:13px}.lb-list{text-align:left;margin:0;padding:0;list-style:none}.lb-list.compact{margin-top:10px}.lb-row{border-radius:12px;grid-template-columns:2.4em minmax(0,1fr) auto;align-items:center;gap:8px;padding:7px 12px;font-size:15px;font-weight:600;display:grid}.lb-row:nth-child(odd){background:#fff9}.lb-row.me{background:linear-gradient(#ffe9a8,#ffd166);box-shadow:0 2px #c99a2e}.lb-rank{color:var(--ink-soft);font-variant-numeric:tabular-nums;text-align:right;padding-right:4px}.lb-row:first-child .lb-rank,.lb-row:nth-child(2) .lb-rank,.lb-row:nth-child(3) .lb-rank{color:#b8860b;font-weight:800}.lb-list.compact .lb-gap~.lb-row .lb-rank{color:var(--ink-soft);font-weight:600}.lb-name{align-items:center;gap:6px;min-width:0;display:flex}.lb-name-text{text-overflow:ellipsis;white-space:nowrap;unicode-bidi:isolate;overflow:hidden}.lb-you{color:#8a5a00;background:#ffffffbf;border-radius:999px;flex:none;padding:1px 7px;font-size:11px;font-weight:800}.lb-score{font-variant-numeric:tabular-nums;color:var(--green-dark);font-weight:800}.lb-gap{text-align:center;color:var(--ink-soft);padding:2px 0;line-height:1}@media (max-width:420px){.submit-box{padding:12px 10px 10px}.btn.submit-btn{padding:10px 14px}.lb-row{padding:6px 10px;font-size:14px}}
