:root{--bg:#0e0e0e;--surface:#181818;--raised:#222;--line:#2a2a2a;--dim:#3a3a3a;--fg:#fafafa;--muted:#8a8a8a;--accent:#ff5a1f;--good:#2bd576;--bad:#ff4d4d;--radius:10px;--font:"Space Grotesk", system-ui, sans-serif;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{background:var(--bg);color:var(--fg);font:16px/1.4 var(--font);-webkit-font-smoothing:antialiased;margin:0}body{overscroll-behavior:none}h1,h2,p{margin:0}ul,ol{margin:0;padding:0;list-style:none}button,input{font:inherit;color:inherit}button{cursor:pointer}button:disabled{cursor:default}a{color:var(--accent)}.screen{max-width:480px;min-height:100dvh;padding:calc(24px + env(safe-area-inset-top)) 20px calc(32px + env(safe-area-inset-bottom));flex-direction:column;gap:20px;margin:0 auto;animation:.18s ease-out fade;display:flex}.screen.center{text-align:center}.screen.fit{height:100dvh;min-height:0;overflow-y:auto}@media (height<=700px){.screen.fit{padding-top:calc(16px + env(safe-area-inset-top));padding-bottom:calc(12px + env(safe-area-inset-bottom));gap:14px}}@keyframes fade{0%{opacity:0;transform:translateY(4px)}}.logo{letter-spacing:-.04em;margin:0;font-size:24px;font-weight:700;line-height:1}.logo.big{font-size:48px}@media (height<=700px){.logo.big{font-size:40px}.tagline-lg{font-size:18px!important}}.logo:after{content:".";color:var(--accent)}.topbar{justify-content:space-between;align-items:center;gap:8px;min-height:44px;display:flex}.topbar .who{color:var(--muted);font-size:14px}.back-row{align-items:center;gap:8px;display:flex}.icon-btn{width:44px;height:44px;color:var(--fg);background:0 0;border:none;justify-content:center;align-items:center;padding:0;display:flex}.label{color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-size:13px}.muted{color:var(--muted)}.small{font-size:14px}.title{letter-spacing:-.02em;font-size:36px;font-weight:700;line-height:1.1}.num{font-variant-numeric:tabular-nums}.accent{color:var(--accent)}.error{color:var(--bad);font-size:15px}.grow{flex:1}.stack{flex-direction:column;gap:8px;display:flex}.middle{flex-direction:column;flex:1;justify-content:center;gap:24px;display:flex}.bottom{flex-direction:column;gap:8px;margin-top:auto;display:flex}.field{flex-direction:column;gap:8px;display:flex;position:relative}.input{border-radius:var(--radius);border:1px solid var(--line);background:var(--surface);width:100%;min-height:56px;color:var(--fg);padding:12px 16px;font-size:20px;font-weight:500}.input:focus{border:2px solid var(--accent);outline:none;padding:11px 15px}.input.big{font-size:22px}.btn{border-radius:var(--radius);border:1px solid var(--line);background:var(--surface);min-height:60px;color:var(--fg);justify-content:center;align-items:center;gap:10px;padding:0 16px;font-size:18px;font-weight:500;text-decoration:none;transition:transform .15s,opacity .15s;display:flex}.btn:active:not(:disabled){transform:scale(.98)}.btn:disabled{opacity:.4}.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--bg);font-size:20px;font-weight:700}.btn.outline{border-color:var(--accent);color:var(--accent);min-height:56px;font-weight:700}.link-btn{min-height:44px;color:var(--muted);background:0 0;border:none;align-self:center;padding:4px 16px;font-size:16px;text-decoration:underline}.divider{align-items:center;gap:12px;display:flex}.divider:before,.divider:after{content:"";background:var(--line);flex:1;height:1px}.wheel{touch-action:none;-webkit-user-select:none;user-select:none;flex-direction:column;flex:1 1 0;justify-content:center;align-items:center;gap:4px;min-height:140px;display:flex;container-type:size}.wheel-inner{flex-direction:column;justify-content:center;align-items:center;gap:4px;width:100%;height:100%;display:flex}.wheel .far{color:var(--dim);min-height:34px;font-size:28px;font-weight:700}.wheel .near{color:var(--muted);min-height:48px;font-size:40px;font-weight:700}.wheel .far,.wheel .near{font-variant-numeric:tabular-nums;background:0 0;border:none;padding:0}.wheel .current{border-top:1px solid var(--line);border-bottom:1px solid var(--line);justify-content:center;align-items:baseline;gap:12px;width:100%;padding:4px 0;display:flex}.wheel .current b{color:var(--accent);font-variant-numeric:tabular-nums;font-size:96px;line-height:1.05}.wheel .arrow{width:64px;min-height:44px;color:var(--muted);background:0 0;border:none;justify-content:center;align-items:center;display:flex}@container (height<=380px){.wheel .far{display:none}}@container (height<=300px){.wheel .near{display:none}}@container (height<=220px){.wheel .current b{font-size:72px}.wheel .arrow{min-height:40px}}@container (height<=180px){.wheel .current b{font-size:56px}.wheel .arrow{min-height:30px}}.suggest{border-radius:var(--radius);border:1px solid var(--line);background:var(--surface);z-index:5;margin-top:4px;padding:4px;position:absolute;top:100%;left:0;right:0}.suggest button{text-align:left;background:0 0;border:none;border-radius:8px;flex-direction:column;justify-content:center;width:100%;min-height:48px;padding:4px 12px;display:flex}.suggest button:hover,.suggest button:focus{background:var(--raised);outline:none}.suggest .name{font-size:17px;font-weight:500}.suggest .where{color:var(--muted);font-size:13px}.game-card{border:1px solid var(--line);background:var(--surface);touch-action:pan-y;-webkit-user-select:none;user-select:none;border-radius:16px;flex-direction:column;flex:1;justify-content:space-between;min-height:420px;padding:32px 24px;display:flex;position:relative;overflow:hidden}.game-card .art{flex:1;justify-content:center;align-items:center;display:flex}.game-card h1{letter-spacing:-.03em;font-size:48px;font-weight:700;line-height:1}.game-card .side{position:absolute;top:50%;transform:translateY(-50%)}.game-card .side.left{left:4px}.game-card .side.right{right:4px}.math-art{color:var(--accent);letter-spacing:-.03em;font-variant-numeric:tabular-nums;font-size:120px;font-weight:700;line-height:1}.abc-art{gap:8px;display:flex}.abc-art span{border-radius:var(--radius);border:1px solid var(--dim);justify-content:center;align-items:center;width:72px;height:88px;font-size:48px;font-weight:700;display:flex}.abc-art span:first-child{border:2px solid var(--accent);color:var(--accent)}.dots{justify-content:center;gap:8px;display:flex}.dots button{background:0 0;border:none;justify-content:center;align-items:center;width:44px;height:24px;padding:0;display:flex}.dots span{background:var(--dim);border-radius:4px;width:8px;height:8px;transition:width .2s}.dots .on span{background:var(--accent);width:24px}.ticker{color:var(--accent);font-variant-numeric:tabular-nums;font-size:160px;font-weight:700;line-height:1}.bar{background:var(--line);height:4px}.bar div{background:var(--accent);height:100%}.bar.live div{transition:width .1s linear}.versus{justify-content:space-between;align-items:center;gap:12px;margin-top:16px;display:flex}.versus>div{flex-direction:column;flex:1;align-items:center;gap:8px;display:flex}.avatar{background:var(--surface);border:2px solid var(--accent);border-radius:50%;justify-content:center;align-items:center;width:72px;height:72px;font-size:28px;font-weight:700;display:flex}.avatar.empty{border:2px dashed var(--line);color:var(--muted);background:0 0}.avatar.lg{width:112px;height:112px;font-size:44px}.avatar.them{border-color:var(--fg)}.vs-big{color:var(--accent);letter-spacing:-.02em;font-size:48px;font-weight:700}.person{flex-direction:column;align-items:center;gap:12px;display:flex}.person .n{font-size:24px;font-weight:700}.scoreboard{border-radius:var(--radius);background:var(--surface);border:1px solid var(--line);justify-content:space-between;align-items:center;gap:8px;padding:12px 16px;display:flex}.scoreboard .side{flex-direction:column;gap:2px;min-width:0;display:flex}.scoreboard .side.r{align-items:flex-end}.scoreboard .who{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);white-space:nowrap;text-overflow:ellipsis;max-width:120px;font-size:13px;overflow:hidden}.scoreboard .me .who,.scoreboard .me .pts{color:var(--accent)}.scoreboard .pts{font-variant-numeric:tabular-nums;font-size:32px;font-weight:700;line-height:1.1}.scoreboard .done{color:var(--good)}.tools{justify-content:space-between;align-items:center;gap:8px;min-height:44px;display:flex}.pill{background:var(--surface);border:1px solid var(--muted);min-height:44px;color:var(--muted);border-radius:999px;align-items:center;gap:8px;padding:4px 16px;font-size:14px;font-weight:500;display:flex}.pill.on{border-color:var(--accent);color:var(--accent)}.pill.solid{background:var(--accent);border-color:var(--accent);color:var(--bg);font-weight:700}.question{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:16px;min-height:160px;display:flex}.prompt{letter-spacing:-.02em;font-variant-numeric:tabular-nums;text-align:center;font-size:clamp(48px,18vw,96px);font-weight:700;line-height:1.05}.hint{text-align:center;color:var(--muted);min-height:20px;font-size:14px}.hint.good{color:var(--good);font-weight:700}.hint.bad{color:var(--bad);font-weight:700}.answers{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.answers.col{grid-template-columns:1fr}.answer{border-radius:var(--radius);border:1px solid var(--line);background:var(--surface);min-height:88px;color:var(--fg);font-variant-numeric:tabular-nums;font-size:36px;font-weight:700;transition:border-color .15s,color .15s}.answers.col .answer{letter-spacing:.04em;min-height:80px}.answer.picked{border:2px solid var(--accent);color:var(--accent)}.answer.right{border:2px solid var(--good);color:var(--good)}.answer.wrong{border:2px solid var(--bad);color:var(--bad)}.hear{background:var(--accent);width:144px;height:144px;color:var(--bg);border:none;border-radius:50%;justify-content:center;align-items:center;display:flex}.slots{flex-wrap:wrap;justify-content:center;gap:6px;display:flex}.slots span{border-bottom:3px solid var(--line);flex:0 46px;justify-content:center;align-items:center;min-width:18px;height:60px;font-size:clamp(20px,7vw,36px);font-weight:700;display:flex}.slots span.filled{border-color:var(--accent)}.slots.right span{border-color:var(--good);color:var(--good)}.slots.wrong span{border-color:var(--bad);color:var(--bad)}.tiles{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;display:grid}.tile{border-radius:var(--radius);border:1px solid var(--line);background:var(--surface);min-height:68px;color:var(--fg);font-size:32px;font-weight:700}.tile:disabled{background:var(--bg);color:var(--dim);border-style:dashed}.tile-actions{gap:8px;display:flex}.tile-actions .del{flex:none;width:72px;min-height:60px}.tile-actions .btn.primary{flex:1}.reveal{text-align:center;font-size:20px;font-weight:700}.result-title{letter-spacing:-.03em;font-size:64px;font-weight:700;line-height:1}.final{justify-content:center;align-items:flex-end;gap:16px;margin-top:8px;display:flex}.final>div{flex-direction:column;align-items:center;gap:8px;min-width:0;display:flex}.final .big{font-variant-numeric:tabular-nums;font-size:clamp(48px,18vw,96px);font-weight:700;line-height:1}.final .me .big{color:var(--accent)}.final .dash{color:var(--muted);padding-bottom:40px;font-size:48px;font-weight:700}.final .who{font-size:16px;font-weight:500}.final .sub{color:var(--muted);font-size:13px}.card-preview{aspect-ratio:1;border:1px solid var(--line);background:var(--bg);border-radius:16px;flex-direction:column;justify-content:space-between;width:100%;padding:24px;display:flex;container-type:inline-size}.card-preview .row{justify-content:space-between;align-items:baseline;display:flex}.card-preview .score{white-space:nowrap;color:var(--accent);letter-spacing:-.04em;font-variant-numeric:tabular-nums;font-size:18cqw;font-weight:700;line-height:.95}.card-preview .beat{letter-spacing:-.02em;font-size:24px;font-weight:700}.copy-row{white-space:nowrap;justify-content:space-between;min-height:56px;font-size:16px}.copy-row>span:first-child{text-overflow:ellipsis;min-width:0;overflow:hidden}.check{cursor:pointer;align-items:flex-start;gap:12px;font-size:15px;line-height:1.4;display:flex}.check input{width:24px;height:24px;accent-color:var(--accent);flex:none;margin:0}.phone-row{gap:8px;display:flex}.phone-row .cc{text-align:center;flex:none;width:88px}.otp{grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;display:grid}.otp input{text-align:center;border-radius:var(--radius);border:1px solid var(--line);background:var(--surface);min-width:0;min-height:64px;color:var(--fg);padding:0;font-size:28px;font-weight:700}.otp input:focus{border:2px solid var(--accent);outline:none}.seg{border-radius:var(--radius);background:var(--surface);border:1px solid var(--line);gap:4px;padding:4px;display:grid}.seg button{background:0 0;border:1px solid #0000;border-radius:8px;min-height:44px;font-size:15px;font-weight:500}.seg button.on{background:var(--accent);border-color:var(--accent);color:var(--bg);font-weight:700}.chips{gap:8px;display:flex}.chip{background:var(--surface);border:1px solid var(--line);border-radius:999px;min-height:44px;padding:4px 16px;font-size:14px;font-weight:500}.chip.on{border-color:var(--accent);color:var(--accent)}.rank-card{border-radius:var(--radius);border:1px solid var(--line);background:var(--surface);color:var(--fg);text-align:left;flex-direction:column;gap:16px;width:100%;padding:20px;display:flex}.rank-card .head{justify-content:space-between;align-items:center;display:flex}.rank-card .head b{font-size:22px}.rank-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;display:grid}.rank-grid>span{flex-direction:column;gap:4px;display:flex}.rank-grid b{font-variant-numeric:tabular-nums;font-size:clamp(22px,7vw,32px)}.rank-grid>span:first-child b{color:var(--accent)}.mine{border-radius:var(--radius);border:2px solid var(--accent);background:var(--surface);justify-content:space-between;align-items:baseline;padding:16px 20px;display:flex}.mine .r{color:var(--accent);font-variant-numeric:tabular-nums;font-size:48px;font-weight:700;line-height:1}.board li{border-bottom:1px solid var(--line);align-items:center;gap:12px;padding:12px 0;display:flex}.board .pos{font-variant-numeric:tabular-nums;width:36px;font-size:20px;font-weight:700}.board li:first-child .pos{color:var(--accent)}.board .ini{background:var(--surface);border:1px solid var(--line);border-radius:50%;flex:none;justify-content:center;align-items:center;width:40px;height:40px;font-weight:700;display:flex}.board .nm{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.board .nm b{font-size:17px;font-weight:500}.away li{border-radius:var(--radius);border:1px solid var(--line);background:var(--surface);justify-content:space-between;align-items:center;gap:12px;padding:16px;display:flex}.away .score{font-variant-numeric:tabular-nums;font-size:28px;font-weight:700}.away li+li{margin-top:8px}.toast{left:50%;bottom:calc(24px + env(safe-area-inset-bottom));background:var(--surface);border:1px solid var(--accent);border-radius:var(--radius);z-index:20;padding:10px 16px;font-size:15px;position:fixed;transform:translate(-50%)}@media (prefers-reduced-motion:reduce){.screen{animation:none}.bar.live div{transition:none}}
