:root{--paper:#efebe2;--ink:#16150f;--groove:#2c2620;--blue:#1d3fd6;--vermilion:#f0451e;--green:#059669;--ink-subtle:#16150fad;--ink-border:#16150f59;--ink-hairline:#16150f38;--card-hover:#e5e1d7;--muted:#16150f1f;--font-display:ui-rounded, "SF Pro Rounded", "Nunito", system-ui, sans-serif;--font-sans:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-mono:ui-monospace, "SF Mono", "JetBrains Mono", Menlo, monospace;--ease:cubic-bezier(.2, .8, .2, 1);--app-width:480px;--tabbar-h:64px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*{box-sizing:border-box}html,body{height:100%;margin:0;padding:0}body{background:var(--ink);color:var(--ink);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;overscroll-behavior:none}#root{min-height:100%}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0;padding:0}button:disabled{cursor:default}input{font:inherit;color:inherit}a{color:inherit}:focus-visible{outline:2px solid var(--blue);outline-offset:2px}.display{font-family:var(--font-display);letter-spacing:-.03em;font-weight:900}.display-bold{font-family:var(--font-display);font-weight:800}.mono{font-family:var(--font-mono);letter-spacing:.14em;text-transform:uppercase;font-weight:700}.mono-plain{font-family:var(--font-mono);font-weight:500}.subtle{color:var(--ink-subtle)}.blue{color:var(--blue)}.verm{color:var(--vermilion)}.truncate{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.shell{max-width:var(--app-width);background:var(--paper);isolation:isolate;min-height:100dvh;margin:0 auto;position:relative;overflow:hidden}@media (width>=520px){.shell{box-shadow:0 0 0 1.5px var(--ink), 0 30px 80px #00000073}}.screen{flex-direction:column;min-height:100dvh;display:flex}.screen.with-tabs{padding-bottom:calc(var(--tabbar-h) + env(safe-area-inset-bottom))}.scroll{flex:1;overflow-y:auto}.pad{padding-left:22px;padding-right:22px}.tabbar{width:100%;max-width:var(--app-width);height:calc(var(--tabbar-h) + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);-webkit-backdrop-filter:blur(12px);border-top:1.5px solid var(--ink);z-index:40;background:#efebe2f0;display:flex;position:fixed;bottom:0;left:50%;transform:translate(-50%)}.tabbar button{color:var(--ink-subtle);font-family:var(--font-mono);letter-spacing:.12em;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:5px;font-size:10px;font-weight:700;display:flex}.tabbar button[aria-current=page]{color:var(--vermilion)}.cue-btn{width:100%;height:52px;font-family:var(--font-display);letter-spacing:.02em;transition:transform .18s var(--ease), opacity .18s var(--ease);-webkit-user-select:none;user-select:none;justify-content:center;align-items:center;gap:8px;font-size:15px;font-weight:800;display:flex}.cue-btn:active:not(:disabled),.press:active:not(:disabled){opacity:.9;transform:translate(3px,3px)}.press{transition:transform .18s var(--ease), opacity .18s var(--ease)}.cue-btn.primary{background:var(--blue);color:var(--paper)}.cue-btn.dark{background:var(--ink);color:var(--paper)}.cue-btn.secondary{background:var(--paper);color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}.cue-btn.outline{color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}.cue-btn.ghost{color:var(--ink-subtle)}.cue-btn.destructive{background:var(--vermilion);color:var(--paper)}.cue-btn:disabled{opacity:.45}.icon-btn{background:var(--paper);width:36px;height:36px;box-shadow:inset 0 0 0 1.5px var(--ink);flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.chip{font-family:var(--font-mono);letter-spacing:.06em;white-space:nowrap;align-items:center;gap:4px;padding:4px 8px;font-size:11px;font-weight:700;display:inline-flex}.box{background:var(--paper);box-shadow:inset 0 0 0 1.5px var(--ink)}.box-soft{background:var(--paper);box-shadow:inset 0 0 0 1.5px var(--ink-border)}.hard-shadow{box-shadow:inset 0 0 0 2px var(--ink), 4px 4px 0 var(--ink)}.section-head{align-items:center;gap:9px;display:flex}.section-head .rule{background:var(--ink);flex:1;height:1.5px}.section-head .mono{font-size:9px}.grid2{grid-template-columns:1fr 1fr;gap:9px;display:grid}.backdrop{z-index:60;animation:fade-in .2s var(--ease);background:#00000080;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.sheet{width:100%;max-width:var(--app-width);background:var(--paper);border-top:2px solid var(--ink);max-height:92dvh;padding-bottom:calc(24px + env(safe-area-inset-bottom));animation:sheet-up .32s var(--ease);overflow-y:auto}.sheet.full{border-top:0;height:100dvh;max-height:100dvh}.grabber{background:#16150f4d;width:44px;height:4px;margin:12px auto 8px}.overlay{max-width:var(--app-width);background:var(--paper);z-index:50;animation:fade-in .25s var(--ease);margin:0 auto;position:fixed;inset:0;overflow-y:auto}.center-modal-wrap{z-index:80;animation:fade-in .2s var(--ease);background:#000000a6;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.center-modal{background:var(--paper);width:100%;max-width:380px;box-shadow:inset 0 0 0 2.5px var(--ink), 6px 6px 0 var(--ink);animation:pop-in .38s var(--ease);padding:20px}.toast{left:50%;bottom:calc(var(--tabbar-h) + 24px);background:var(--ink);color:var(--paper);box-shadow:inset 0 0 0 1.5px var(--blue);z-index:200;font-family:var(--font-mono);white-space:nowrap;animation:toast-in .3s var(--ease);align-items:center;gap:8px;padding:12px 18px;font-size:12px;font-weight:700;display:flex;position:fixed;transform:translate(-50%)}.field{background:var(--paper);box-shadow:inset 0 0 0 1.5px var(--ink);align-items:center;gap:10px;padding:12px 14px;display:flex}.field:focus-within{box-shadow:inset 0 0 0 2px var(--blue)}.field input{background:0 0;border:0;outline:0;flex:1;min-width:0;font-size:15px}.toggle{flex-shrink:0;width:50px;height:30px;position:relative}.toggle input{opacity:0;width:0;height:0;position:absolute}.toggle span{background:var(--ink-hairline);transition:background .2s var(--ease);box-shadow:inset 0 0 0 1.5px var(--ink);position:absolute;inset:0}.toggle span:after{content:"";background:var(--paper);width:22px;height:22px;box-shadow:inset 0 0 0 1.5px var(--ink);transition:transform .2s var(--ease);position:absolute;top:4px;left:4px}.toggle input:checked+span{background:var(--blue)}.toggle input:checked+span:after{transform:translate(20px)}.toggle input:focus-visible+span{outline:2px solid var(--blue);outline-offset:2px}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes sheet-up{0%{opacity:.6;transform:translateY(40px)}to{opacity:1;transform:none}}@keyframes pop-in{0%{opacity:0;transform:scale(.88)}to{opacity:1;transform:none}}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,20px)}to{opacity:1;transform:translate(-50%)}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse-ring{0%{opacity:.45;transform:scale(.85)}to{opacity:0;transform:scale(1.35)}}@keyframes pulse-soft{0%,to{transform:scale(1)}50%{transform:scale(1.02)}}@keyframes eq{0%,to{transform:scaleY(.25)}50%{transform:scaleY(1)}}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-9px)}40%{transform:translate(8px)}60%{transform:translate(-5px)}80%{transform:translate(3px)}}@keyframes vinyl-drop{0%{opacity:0;transform:translateY(-120px)rotate(-90deg)}70%{opacity:1;transform:translateY(6px)rotate(10deg)}to{transform:none}}@keyframes burst{0%{opacity:1;transform:translate(0)scale(1)}to{transform:var(--to) scale(.3);opacity:0}}@keyframes stamp{0%{opacity:0;transform:rotate(-7deg)scale(1.8)}to{opacity:1;transform:rotate(-7deg)scale(1)}}.shake{animation:shake .42s var(--ease)}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.tabbar-brand,.desktop-only{display:none}@media (width>=900px){:root{--app-width:640px;--sidebar-w:232px}body{background:var(--paper)}.shell{max-width:none;box-shadow:none!important}.shell.has-tabs{padding-left:var(--sidebar-w)}.shell:not(.has-tabs)>.screen{max-width:var(--app-width);margin:0 auto}.screen.with-tabs{padding-bottom:0}.pad{padding-left:max(32px,50% - 560px);padding-right:max(32px,50% - 560px)}.screen.narrow .pad{padding-left:max(32px,50% - 410px);padding-right:max(32px,50% - 410px)}.desktop-only{display:block}.tabbar{width:var(--sidebar-w);background:var(--paper);border-top:0;border-right:1.5px solid var(--ink);flex-direction:column;gap:4px;max-width:none;height:100dvh;padding:24px 14px;top:0;left:0;transform:none}.tabbar-brand{align-items:center;gap:10px;padding:0 6px 24px;display:flex}.tabbar button{transition:background .15s var(--ease), color .15s var(--ease);flex-direction:row;flex:none;justify-content:flex-start;gap:12px;padding:12px 14px;font-size:12px}.tabbar button:hover{background:var(--card-hover);color:var(--ink)}.tabbar button[aria-current=page]{background:var(--ink);color:var(--paper)}.arena-grid{grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px}.arena-grid>button:hover{transform:translateY(-3px)}.stats-grid{grid-template-columns:repeat(4,1fr)}.overlay{max-width:none;padding-left:calc((100% - var(--app-width)) / 2);padding-right:calc((100% - var(--app-width)) / 2)}[data-tutorial=vinyl],[data-tutorial=vinyl]>svg{width:250px!important;height:250px!important}.backdrop{align-items:center;padding:24px}.sheet,.sheet.full{border:2px solid var(--ink);max-width:560px;max-height:86dvh;box-shadow:8px 8px 0 var(--ink);animation:pop-in .28s var(--ease);padding-bottom:24px}.sheet.full{height:min(760px,86dvh)}.grabber{visibility:hidden}.toast{bottom:32px}}