:root{--bg:#244a2e;--panel:#fbf6ea;--panel-2:#efe5cf;--ink:#1f2a1c;--ink-dim:#5f6b56;--accent:#e5392f;--accent-ink:#fff;--chip:#2f5d3a;--chip-ink:#f4f8ee;--hud:#182e1edb;--hud-ink:#f4f8ee;--line:#1f2a1c24;--good:#2c8a35;--f-display:"Bungee", "Arial Black", Impact, sans-serif;--f-ui:"Lexend", "Trebuchet MS", system-ui, sans-serif;--f-num:"Lexend", "Trebuchet MS", system-ui, sans-serif;--radius:18px;--safe-t:env(safe-area-inset-top,0px);--safe-b:env(safe-area-inset-bottom,0px)}:root[data-skin=retro]{--f-num:"Silkscreen", "Courier New", monospace;--radius:0px}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{background:var(--bg);overscroll-behavior:none;height:100%;margin:0;overflow:hidden}body{font-family:var(--f-ui);color:var(--ink);-webkit-user-select:none;user-select:none}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0;padding:0}button:focus-visible,input:focus-visible+span{outline:3px solid var(--accent);outline-offset:2px}[hidden]{display:none!important}svg{display:block}#app{position:fixed;inset:0}#board{touch-action:none;width:100%;height:100%;display:block;position:absolute;inset:0}#hud{left:10px;right:10px;top:calc(10px + var(--safe-t));border-radius:var(--radius);background:var(--hud);color:var(--hud-ink);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);grid-template-columns:48px 1fr auto;align-items:center;gap:10px;padding:8px 12px 8px 8px;display:grid;position:absolute;box-shadow:0 6px 20px #00000040}.icon-btn{border-radius:14px;place-items:center;width:44px;height:44px;display:grid}#hud .icon-btn{background:#ffffff1f}.hud-main{text-align:center;min-width:0;line-height:1.05}.hud-label{letter-spacing:.14em;text-transform:uppercase;opacity:.75;white-space:nowrap;text-overflow:ellipsis;font-size:11px;overflow:hidden}.hud-value{font-family:var(--f-num);font-variant-numeric:tabular-nums;font-size:28px;font-weight:800}.hud-side{font-variant-numeric:tabular-nums;justify-content:flex-end;align-items:center;gap:2px;min-width:44px;font-size:18px;font-weight:800;display:flex}.hud-side .heart{color:#ff5a5f;width:22px;height:22px}.hud-side .heart.off{opacity:.25}.hud-side .heart svg,.hud-side .mini svg{width:22px;height:22px}.hud-side .heart.hit{animation:.5s hit}@keyframes hit{30%{transform:scale(1.6)}}.hud-side .mini{align-items:center;gap:4px;display:flex}#zone-chip{left:50%;top:calc(84px + var(--safe-t));letter-spacing:.06em;background:var(--chip);color:var(--chip-ink);white-space:nowrap;pointer-events:none;border-radius:999px;padding:5px 12px;font-size:12px;font-weight:800;position:absolute;transform:translate(-50%);box-shadow:0 3px 10px #00000040}#zone-chip.up{animation:.6s pulse}@keyframes pulse{40%{transform:translate(-50%)scale(1.25)}}#bar{left:10px;right:10px;bottom:calc(10px + var(--safe-b));border-radius:calc(var(--radius) + 4px);background:var(--hud);color:var(--hud-ink);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);align-items:stretch;gap:8px;padding:8px;display:flex;position:absolute;box-shadow:0 -4px 20px #0003}.seg{background:#00000038;border-radius:14px;flex:1;grid-template-columns:1fr 1fr;gap:4px;padding:4px;display:grid}.seg-btn{opacity:.75;border-radius:11px;justify-content:center;align-items:center;gap:6px;height:48px;font-size:15px;font-weight:600;display:flex}.seg-btn[aria-pressed=true]{background:var(--panel);color:var(--ink);opacity:1;box-shadow:0 2px 6px #0003}#tool-flag[aria-pressed=true]{background:var(--accent);color:var(--accent-ink)}.tool-btn{background:#ffffff1f;border-radius:14px;place-items:center;width:56px;display:grid;position:relative}.tool-btn[disabled]{opacity:.35}.tool-btn.armed{background:var(--accent);color:var(--accent-ink);animation:1s ease-in-out infinite armed}@keyframes armed{50%{box-shadow:0 0 0 6px #ffffff2e}}.badge{background:var(--accent);min-width:22px;height:22px;color:var(--accent-ink);border:2px solid var(--hud-ink);border-radius:11px;place-items:center;padding:0 6px;font-size:12px;font-weight:800;display:grid;position:absolute;top:-6px;right:-6px}#ring{pointer-events:none;border:4px solid var(--accent);opacity:0;border-radius:50%;width:64px;height:64px;margin:-32px 0 0 -32px;position:absolute}#ring.go{animation:ring var(--ms,.33s) linear forwards}@keyframes ring{0%{opacity:0;transform:scale(1.6)}to{opacity:.9;transform:scale(.7)}}.screen{-webkit-overflow-scrolling:touch;position:absolute;inset:0;overflow-y:auto}#home{background:radial-gradient(120% 45% at 50% 18%, color-mix(in srgb, var(--bg) 82%, transparent) 0%, color-mix(in srgb, var(--bg) 40%, transparent) 70%, transparent 100%), linear-gradient(180deg, transparent 30%, color-mix(in srgb, var(--bg) 75%, transparent) 55%, var(--bg) 100%)}.home-inner{max-width:480px;min-height:100%;padding:calc(28px + var(--safe-t)) 16px calc(24px + var(--safe-b));flex-direction:column;gap:22px;margin:0 auto;display:flex}.brand{text-align:center;color:#fff;text-shadow:0 3px #0000004d,0 0 24px #00000059;padding-top:6vh}.wordmark{font-family:var(--f-display);letter-spacing:.02em;text-transform:uppercase;margin:0;font-size:clamp(54px,17vw,84px);font-weight:400;line-height:.95}.wordmark:after{content:"";background:repeating-linear-gradient(90deg, var(--accent) 0 16px, #fff 16px 32px);border-radius:4px;width:64px;height:8px;margin:12px auto 0;display:block}:root[data-skin=retro] .wordmark:after{border-radius:0}.tagline{opacity:.95;margin:12px 0 0;font-size:17px;font-weight:600}.modes{flex-direction:column;gap:10px;margin-top:auto;display:flex}.mode{text-align:left;border-radius:var(--radius);background:var(--panel);color:var(--ink);grid-template-columns:52px 1fr auto;align-items:center;gap:14px;padding:14px;transition:transform 80ms;display:grid;box-shadow:0 4px #0000002e,0 10px 24px #0000002e}.mode:active{transform:translateY(3px);box-shadow:0 1px #0000002e}.mode-icon{background:var(--chip);width:52px;height:52px;color:var(--chip-ink);border-radius:14px;place-items:center;display:grid}.mode-icon svg{width:28px;height:28px}.mode-hero .mode-icon{background:var(--accent);color:var(--accent-ink)}.mode-text{flex-direction:column;gap:3px;min-width:0;display:flex}.mode-title{font-size:19px;font-weight:800}.mode-desc{color:var(--ink-dim);font-size:13px;line-height:1.35}.mode-meta{text-align:right;color:var(--ink);font-variant-numeric:tabular-nums;max-width:92px;font-size:13px;font-weight:800;line-height:1.25}.mode-meta small{color:var(--ink-dim);text-transform:uppercase;letter-spacing:.08em;font-size:11px;font-weight:600;display:block}.mode-hero{padding:18px 14px}.mode-hero .mode-title{font-size:22px}.link-btn{color:#fff;text-underline-offset:3px;opacity:.9;align-self:center;margin-top:-2px;padding:6px 12px;font-size:14px;font-weight:600;text-decoration:underline}.home-nav{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.nav-btn{position:relative}.nav-badge{background:var(--accent);min-width:20px;height:20px;color:var(--accent-ink);border-radius:10px;place-items:center;padding:0 6px;font-size:12px;font-weight:800;display:grid;position:absolute;top:4px;right:8px}.nav-btn{color:#fff;background:#00000038;border-radius:14px;flex-direction:column;align-items:center;gap:4px;padding:10px 4px;font-size:13px;font-weight:600;display:flex}.sheet{background:var(--panel);color:var(--ink)}.sheet-head{z-index:2;padding:calc(10px + var(--safe-t)) 12px 10px;background:var(--panel);border-bottom:1px solid var(--line);align-items:center;gap:10px;display:flex;position:sticky;top:0}.sheet-head h2{font-family:var(--f-display);text-transform:uppercase;letter-spacing:.02em;margin:0;font-size:24px;font-weight:400}.sheet-head .icon-btn{background:var(--panel-2)}.sheet-body{max-width:560px;padding:18px 16px calc(28px + var(--safe-b));flex-direction:column;gap:12px;margin:0 auto;display:flex}.note{color:var(--ink-dim);margin:4px 0 0;font-size:13px;line-height:1.5}.label{letter-spacing:.14em;text-transform:uppercase;color:var(--ink-dim);margin:10px 0 0;font-size:12px}.levels{flex-direction:column;gap:10px;display:flex}.level{border-radius:var(--radius);background:var(--panel-2);text-align:left;border:2px solid #0000;grid-template-columns:1fr auto;gap:4px 12px;padding:16px;display:grid}.level:active{border-color:var(--accent)}.level b{font-size:18px}.level .dims{color:var(--ink-dim);font-variant-numeric:tabular-nums;font-size:13px}.level .best{text-align:right;font-variant-numeric:tabular-nums;grid-row:span 2;align-self:center;font-weight:800}.level .best small{color:var(--ink-dim);text-transform:uppercase;letter-spacing:.08em;font-size:11px;font-weight:600;display:block}.tabs{background:var(--panel-2);border-radius:14px;grid-template-columns:1fr 1fr;gap:4px;padding:4px;display:grid}.tab{height:42px;color:var(--ink-dim);border-radius:11px;font-weight:600}.tab[aria-selected=true]{background:var(--panel);color:var(--ink);box-shadow:0 1px 4px #0000001f}.rank-list{flex-direction:column;display:flex}.rank-row{border-bottom:1px solid var(--line);grid-template-columns:36px 32px 1fr auto;align-items:center;gap:10px;padding:10px 6px;display:grid}.rank-row .pos{font-variant-numeric:tabular-nums;text-align:center;color:var(--ink-dim);font-weight:800}.rank-row:first-child .pos{color:#c99400}.rank-row:nth-child(2) .pos{color:#8a8f98}.rank-row:nth-child(3) .pos{color:#b0662d}.rank-row img,.rank-row .av{background:var(--panel-2);object-fit:cover;border-radius:50%;width:32px;height:32px}.rank-row .who{text-overflow:ellipsis;white-space:nowrap;min-width:0;font-weight:600;overflow:hidden}.rank-row .val{font-variant-numeric:tabular-nums;font-weight:800}.rank-row.me{background:color-mix(in srgb, var(--accent) 14%, transparent);border-radius:12px}.rank-empty{text-align:center;color:var(--ink-dim);padding:26px 8px;line-height:1.5}.skins{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.skin{background:var(--panel-2);border:3px solid #0000;border-radius:16px;flex-direction:column;align-items:center;gap:8px;padding:10px;font-size:14px;font-weight:600;display:flex}.skin[aria-pressed=true]{border-color:var(--accent)}.skin canvas{aspect-ratio:1;border-radius:10px;width:100%;max-width:96px}.toggle{background:var(--panel-2);cursor:pointer;border-radius:16px;align-items:center;gap:12px;padding:14px;display:flex}.toggle input{width:22px;height:22px;accent-color:var(--accent);flex:none}.toggle span{flex-direction:column;gap:2px;display:flex}.toggle small{color:var(--ink-dim);font-size:13px}.prose h3{margin:10px 0 0;font-size:16px}.prose ul{flex-direction:column;gap:8px;max-width:62ch;margin:0;padding-left:20px;line-height:1.5;display:flex}.now{background:var(--chip);color:var(--chip-ink);border-radius:18px;grid-template-columns:44px 1fr 48px 48px;align-items:center;gap:10px;padding:12px;display:grid}.now-icon{background:#ffffff24;border-radius:12px;place-items:center;width:44px;height:44px;display:grid}.now.on .now-icon{animation:1s ease-in-out infinite beat}@keyframes beat{50%{transform:scale(1.08)}}.now-text{flex-direction:column;min-width:0;display:flex}.now-text small{letter-spacing:.12em;text-transform:uppercase;opacity:.75;font-size:11px}.now-text b{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.round{background:var(--accent);width:48px;height:48px;color:var(--accent-ink);border-radius:50%;place-items:center;display:grid}#now-next{color:inherit;background:#ffffff29}.slider{background:var(--panel-2);border-radius:16px;flex-direction:column;gap:10px;padding:14px;font-weight:600;display:flex}.slider input{width:100%;accent-color:var(--accent);height:28px}.pl-head{justify-content:space-between;align-items:baseline;gap:8px;margin-top:6px;display:flex}.pl-count{color:var(--ink-dim);font-variant-numeric:tabular-nums;font-size:13px}.add-btn{border:2px dashed color-mix(in srgb, var(--accent) 60%, transparent);min-height:52px;color:var(--accent);cursor:pointer;text-align:center;border-radius:16px;justify-content:center;align-items:center;gap:8px;padding:0 16px;font-weight:800;display:flex;position:relative;overflow:hidden}.add-btn:active,.add-btn.drag{background:color-mix(in srgb, var(--accent) 12%, transparent)}.add-btn:focus-within{outline:3px solid var(--accent);outline-offset:2px}.file-overlay{opacity:0;cursor:pointer;width:100%;height:100%;font-size:0;position:absolute;inset:0}.file-overlay::-webkit-file-upload-button{cursor:pointer}.pick-help{background:color-mix(in srgb, var(--accent) 12%, var(--panel-2));border-radius:14px;flex-direction:column;gap:4px;padding:12px 14px;font-size:14px;line-height:1.45;display:flex}.pl-bulk{justify-content:flex-end;gap:16px;display:flex}.link{color:var(--ink-dim);text-underline-offset:3px;padding:4px 0;font-size:14px;font-weight:600;text-decoration:underline}.pl-list{flex-direction:column;gap:6px;display:flex}.pl-empty{text-align:center;color:var(--ink-dim);background:var(--panel-2);border-radius:16px;padding:22px 12px;line-height:1.5}.pl-row{background:var(--panel-2);border:2px solid #0000;border-radius:14px;grid-template-columns:40px 1fr auto auto;align-items:center;gap:8px;padding:6px 6px 6px 4px;display:grid}.pl-row.playing{border-color:var(--accent)}.pl-check{cursor:pointer;place-items:center;width:40px;height:44px;display:grid;position:relative}.pl-check input{opacity:0;cursor:pointer;width:100%;height:100%;margin:0;position:absolute}.pl-check .box{border:2px solid var(--ink-dim);border-radius:7px;place-items:center;width:24px;height:24px;display:grid}.pl-check input:checked+.box{background:var(--accent);border-color:var(--accent)}.pl-check input:checked+.box:after{content:"";border:solid var(--accent-ink);border-width:0 3px 3px 0;width:6px;height:11px;transform:translateY(-1px)rotate(45deg)}.pl-check input:focus-visible+.box{outline:3px solid var(--accent);outline-offset:2px}.pl-main{text-align:left;min-width:0;padding:6px 0}.pl-main b{white-space:nowrap;text-overflow:ellipsis;font-size:15px;display:block;overflow:hidden}.pl-main small{color:var(--ink-dim);font-variant-numeric:tabular-nums;margin-top:2px;font-size:12px;display:block}.pl-row .eq{visibility:hidden;align-items:flex-end;gap:3px;width:18px;height:16px;display:flex}.pl-row.playing .eq{visibility:visible}.eq i{background:var(--accent);border-radius:2px;flex:1;height:30%;animation:1.1s ease-in-out infinite eq}.eq i:nth-child(2){animation-delay:-.4s}.eq i:nth-child(3){animation-delay:-.75s}@keyframes eq{0%,to{height:25%}50%{height:100%}}.pl-del{min-width:40px;height:40px;color:var(--ink-dim);border-radius:10px;place-items:center;padding:0 8px;font-size:13px;font-weight:800;display:grid}.pl-del.confirm{color:#fff;background:#d33a2c}:root[data-skin=retro] .now,:root[data-skin=retro] .pl-row,:root[data-skin=retro] .add-btn,:root[data-skin=retro] .round{border-radius:0}.scopes{gap:8px;display:flex}.scope{color:var(--ink-dim);border:2px solid var(--line);border-radius:999px;padding:6px 14px;font-size:14px;font-weight:600}.scope[aria-selected=true]{background:var(--chip);color:var(--chip-ink);border-color:var(--chip)}.rank-row .av{color:var(--ink-dim);place-items:center;font-size:14px;font-weight:800;display:grid}.me-card{background:var(--chip);color:var(--chip-ink);border-radius:18px;flex-direction:column;gap:10px;padding:14px;display:flex}.me-field{letter-spacing:.12em;text-transform:uppercase;opacity:.8;font-size:12px}.inline{align-items:center;gap:8px;display:flex}.inline input{border:2px solid var(--line);background:var(--panel);min-width:0;height:46px;color:var(--ink);font:inherit;border-radius:12px;flex:1;padding:0 14px;font-weight:600}.me-card .inline input{border-color:#0000}.inline input:focus{border-color:var(--accent);outline:none}.code-row{grid-template-columns:1fr auto;align-items:center;gap:4px 10px;display:grid}.code-row span{letter-spacing:.12em;text-transform:uppercase;opacity:.8;grid-column:1/-1;font-size:12px}.code-row b{font-family:var(--f-num);letter-spacing:.08em;white-space:nowrap;-webkit-user-select:text;user-select:text;font-size:24px}.btn.small{white-space:nowrap;border-radius:11px;height:40px;padding:0 14px;font-size:14px}.me-card .btn.small{color:inherit;background:#ffffff29}.btn.danger{color:#fff;background:#d33a2c}.danger-text{color:#c0392b}.fr-section{flex-direction:column;gap:6px;display:flex}.fr-row{background:var(--panel-2);border-radius:14px;grid-template-columns:36px 1fr auto;align-items:center;gap:10px;padding:8px;display:grid}.fr-row .av{background:var(--chip);width:36px;height:36px;color:var(--chip-ink);border-radius:50%;place-items:center;font-weight:800;display:grid}.fr-row .av.result.win{background:var(--good);color:#fff}.fr-row .av.result.lose{color:#fff;background:#c0392b}.fr-row .who{flex-direction:column;min-width:0;display:flex}.fr-row .who b,.fr-row b.who{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.fr-row .who small{color:var(--ink-dim);font-variant-numeric:tabular-nums;font-size:12px}.fr-row .acts{gap:6px;display:flex}.fr-row .tag{color:var(--ink-dim);font-size:12px;font-weight:800}.fr-pick{color:var(--ink-dim);flex-wrap:wrap;align-items:center;gap:6px;padding:4px 4px 8px 54px;font-size:13px;display:flex}.danger-zone{cursor:default;justify-content:space-between}.rules-link{align-self:flex-start;margin-top:8px}:root[data-skin=retro] .me-card,:root[data-skin=retro] .fr-row,:root[data-skin=retro] .inline input,:root[data-skin=retro] .btn.small,:root[data-skin=retro] .scope{border-radius:0}.setup-problem{text-align:left;background:color-mix(in srgb, var(--accent) 12%, var(--panel-2));color:var(--ink);border-radius:14px;padding:14px 16px;font-weight:600}#toast{white-space:normal}.modal{background:#00000073;place-items:center;padding:16px;animation:.25s fade;display:grid;position:absolute;inset:0}@keyframes fade{0%{opacity:0}}.card{border-radius:calc(var(--radius) + 6px);background:var(--panel);width:min(100%,380px);color:var(--ink);text-align:center;padding:24px 20px 20px;animation:.35s cubic-bezier(.2,1.4,.4,1) pop;box-shadow:0 20px 60px #0006}@keyframes pop{0%{opacity:0;transform:scale(.85)}}.end-kicker{letter-spacing:.16em;text-transform:uppercase;color:var(--ink-dim);margin:0;font-size:12px;font-weight:600}.end-title{font-family:var(--f-display);text-transform:uppercase;margin:6px 0 0;font-size:34px;font-weight:400}.end-big{font-family:var(--f-num);font-variant-numeric:tabular-nums;color:var(--accent);margin:10px 0 4px;font-size:48px;font-weight:800}.end-lines{flex-direction:column;gap:6px;margin:8px 0 18px;padding:0;font-size:15px;list-style:none;display:flex}.end-lines li{background:var(--panel-2);border-radius:12px;justify-content:space-between;gap:12px;padding:8px 12px;display:flex}.end-lines li b{font-variant-numeric:tabular-nums}.end-actions{grid-template-columns:1fr 1fr;gap:8px;display:grid}.btn{background:var(--panel-2);border-radius:14px;height:50px;font-weight:800}.btn.primary{background:var(--accent);color:var(--accent-ink);grid-column:1/-1;box-shadow:0 4px #0003}.btn.ghost{border:2px solid var(--line);background:0 0}#toast{left:50%;top:calc(132px + var(--safe-t));color:#fff;opacity:0;pointer-events:none;text-align:center;background:#000000d1;border-radius:14px;width:max-content;max-width:calc(100% - 32px);padding:10px 16px;font-size:15px;font-weight:600;line-height:1.35;transition:opacity .2s,transform .2s;position:absolute;transform:translate(-50%,-10px)}#toast.show{opacity:1;transform:translate(-50%)}:root[data-skin=retro] #hud,:root[data-skin=retro] #bar,:root[data-skin=retro] .mode,:root[data-skin=retro] .card,:root[data-skin=retro] .level,:root[data-skin=retro] .toggle,:root[data-skin=retro] .skin{box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;border:3px solid gray;border-color:#fff gray gray #fff;border-radius:0}:root[data-skin=retro] .hud-value{color:#ff2020;background:#000;border:2px solid #fff;border-color:gray #fff #fff gray;padding:2px 10px;font-size:24px;display:inline-block}:root[data-skin=retro] .icon-btn,:root[data-skin=retro] .tool-btn,:root[data-skin=retro] .seg,:root[data-skin=retro] .seg-btn,:root[data-skin=retro] .btn,:root[data-skin=retro] .nav-btn,:root[data-skin=retro] .mode-icon,:root[data-skin=retro] .tab,:root[data-skin=retro] .tabs{border-radius:0}:root[data-skin=retro] #hud .icon-btn,:root[data-skin=retro] .tool-btn{background:silver;border:2px solid gray;border-color:#fff gray gray #fff}:root[data-skin=retro] .seg-btn[aria-pressed=true]{box-shadow:none;border:2px solid #fff;border-color:gray #fff #fff gray}:root[data-skin=retro] .nav-btn{color:#000;background:silver;border:2px solid gray;border-color:#fff gray gray #fff}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important}}@media (width>=700px){.brand{padding-top:10vh}}