:root{--bg:#0b1d3a;--fg:#fff;--accent:#ffd23f;--good:#3ddc84;--bad:#ff5a5f;--wa:#25d366;--blue:#3d8cff;--panel:#ffffff14;--line:#ffffff29}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{background:var(--bg);height:100%;color:var(--fg);touch-action:none;overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;overflow:hidden}canvas{width:100%;height:100%;display:block;position:fixed;inset:0}.hidden{display:none!important}#hud{pointer-events:none;position:fixed;inset:0}#top{top:max(8px, env(safe-area-inset-top));left:max(12px, env(safe-area-inset-left));right:max(12px, env(safe-area-inset-right));text-shadow:0 2px 6px #0000008c;grid-template-columns:1fr 1fr 1fr;align-items:start;gap:4px;display:grid;position:absolute}.stat{flex-direction:column;line-height:1.05;display:flex}.stat.mid{text-align:center;align-items:center}.stat.right{text-align:right;align-items:flex-end}.stat .lab{letter-spacing:1.5px;text-transform:uppercase;opacity:.85;font-size:11px;font-weight:800}.stat .val{font-variant-numeric:tabular-nums;font-size:32px;font-weight:900}.stat .val small{opacity:.85;font-size:13px;font-weight:800}#place{color:var(--accent)}#kmh{min-width:1.6ch;display:inline-block}#minimap{top:max(74px, calc(env(safe-area-inset-top) + 66px));left:max(12px, env(safe-area-inset-left));right:max(12px, env(safe-area-inset-right));background:#ffffff47;border-radius:4px;height:8px;position:absolute}#minimap .dot{border:2px solid #fff;border-radius:50%;width:14px;height:14px;margin-left:-7px;position:absolute;top:-3px;box-shadow:0 1px 3px #00000080}#minimap .dot.me{border-color:var(--accent);z-index:2;width:20px;height:20px;margin-left:-10px;top:-6px}#recline{left:max(12px, env(safe-area-inset-left));right:56px;top:max(90px, calc(env(safe-area-inset-top) + 82px));color:var(--accent);text-shadow:0 1px 4px #000000b3;white-space:nowrap;text-overflow:ellipsis;font-size:13px;font-weight:800;position:absolute;overflow:hidden}#tags{position:absolute;inset:0;overflow:hidden}.tag{white-space:nowrap;color:#fff;text-overflow:ellipsis;max-width:78px;text-shadow:none;will-change:transform;background:#0812289e;border:1.5px solid #ffffff8c;border-radius:10px;padding:2px 8px;font-size:12px;font-weight:800;position:absolute;top:0;left:0;overflow:hidden}.tag.me{background:var(--accent);color:#1c1c1c;z-index:2;border-color:#fff;max-width:150px;margin-top:-26px;font-size:14px}.tag.ghost{border-color:var(--accent);color:var(--accent);background:#ffd23f2e}#msg{text-align:center;text-shadow:0 4px 14px #0009;opacity:0;font-size:min(22vw,26vh,140px);font-weight:900;transition:transform .15s,opacity .3s;position:absolute;top:24%;left:0;right:0}#msg.show{opacity:1}#msg.small{font-size:min(11vw,14vh,64px)}#msg.bad{color:var(--bad);font-size:min(11vw,14vh,64px)}#msg.go{color:var(--good)}#speedwrap{left:50%;bottom:max(14px, env(safe-area-inset-bottom));text-align:center;z-index:3;width:min(60vw,420px);position:absolute;transform:translate(-50%)}#speedtrack{background:#00000073;border-radius:7px;height:14px;overflow:hidden}#speedbar{background:linear-gradient(90deg, var(--good), var(--accent), var(--bad));width:0;height:100%}#tps{text-shadow:0 1px 4px #000;margin-top:4px;font-size:14px;font-weight:700}.tapzone{pointer-events:auto;touch-action:none;letter-spacing:2px;color:#ffffff8c;justify-content:center;align-items:flex-end;width:50%;height:62%;padding-bottom:64px;font-size:22px;font-weight:900;display:flex;position:absolute;bottom:0}#btnL{background:linear-gradient(#3d8cff00 20%,#3d8cff4d);left:0}#btnR{background:linear-gradient(#ff8c3d00 20%,#ff8c3d4d);right:0}.tapzone.hint{color:#fff}.tapzone.hint span{animation:.5s ease-in-out infinite alternate pulse}.tapzone.press{filter:brightness(1.8)}@keyframes pulse{0%{transform:scale(1)}to{transform:scale(1.25)}}#submsg{text-align:center;color:#fff;text-shadow:0 2px 8px #000c;opacity:0;font-size:18px;font-weight:800;transition:opacity .2s;position:absolute;top:calc(24% + min(24vw,28vh,150px));left:12px;right:12px}#submsg.show{opacity:1}#submsg.bad{color:#ffb3b5}#hud.st-wait .tapzone{filter:grayscale(.85)brightness(.75)}#hud.st-wait .tapzone span{color:#ffffffb3;letter-spacing:3px;font-size:18px}#hud.st-set .tapzone{background:linear-gradient(#ff3c3c00 15%,#ff3c3c73);box-shadow:inset 0 0 0 3px #ff5a5fe6}#hud.st-set .tapzone span{color:#fff;font-size:24px;animation:.35s ease-in-out infinite alternate pulse}#hud.st-locked .tapzone{background:linear-gradient(#ff3c3c26 10%,#ff3c3c99)}#hud.st-locked .tapzone span{color:#fff;font-size:26px}@media (orientation:portrait){.tapzone{height:45%}}@media (orientation:landscape) and (max-height:520px){.stat .lab{font-size:10px}.stat .val{font-size:24px}.stat .val small{font-size:11px}#minimap{top:max(50px, calc(env(safe-area-inset-top) + 44px))}#recline{top:max(64px, calc(env(safe-area-inset-top) + 58px));font-size:12px}.tapzone{height:70%;padding-bottom:46px;font-size:18px}#speedwrap{width:min(36vw,320px);bottom:max(8px, env(safe-area-inset-bottom))}#speedtrack{height:10px}#tps{margin-top:2px;font-size:12px}#submsg{font-size:15px}}.round{border:1px solid var(--line);width:40px;height:40px;font:inherit;color:#fff;cursor:pointer;touch-action:manipulation;background:#00000059;border-radius:20px;place-items:center;padding:0;font-size:18px;line-height:1;display:inline-grid}.round.sm{border-radius:17px;width:34px;height:34px;font-size:20px;font-weight:900}.round:disabled{opacity:.35;cursor:default}#muteBtn{top:max(86px, calc(env(safe-area-inset-top) + 78px));right:max(10px, env(safe-area-inset-right));z-index:20;border:0;width:36px;height:36px;position:fixed}@media (orientation:landscape) and (max-height:520px){#muteBtn{top:max(86px, calc(env(safe-area-inset-top) + 80px))}}#fpsBox{z-index:30;pointer-events:none;color:#7dff9b;white-space:pre;background:#0009;border-radius:8px;padding:3px 8px;font:700 12px/1.3 ui-monospace,Menlo,monospace;position:fixed;bottom:8px;left:8px}#netBanner{z-index:40;color:#fff;pointer-events:none;background:#ff5a5f;border-radius:999px;padding:6px 14px;font-size:14px;font-weight:800;position:fixed;top:8px;left:50%;transform:translate(-50%)}.screen{z-index:10;padding:max(10px, env(safe-area-inset-top)) max(18px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(18px, env(safe-area-inset-left));-webkit-backdrop-filter:blur(4px);touch-action:pan-y;overscroll-behavior:contain;background:#060e20d1;flex-direction:column;gap:10px;display:flex;position:fixed;inset:0;overflow:hidden auto}.screen.top{z-index:15;background:#07122a}#settings{z-index:14;background:#07122a}.bar{flex:none;justify-content:space-between;align-items:center;gap:10px;min-height:42px;display:flex}.bar-right{align-items:center;gap:8px;min-width:0;display:flex}.brand{white-space:nowrap;flex-wrap:nowrap;align-items:baseline;gap:8px;min-width:0;font-size:20px;display:flex}.brand .logo{font-size:22px}.brand small{font-size:13px}.title{font-size:20px}.code{color:var(--accent);letter-spacing:4px}.grid{flex:none;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-content:start;gap:18px;width:min(100%,880px);margin:auto;display:grid}.duo{gap:8px;display:flex}.duo .btn{flex:1;min-width:0;padding:0 10px;font-size:15px}.col{flex-direction:column;gap:10px;min-width:0;display:flex}.one{flex-direction:column;gap:8px;width:min(100%,520px);margin:0 auto;display:flex}@media (orientation:portrait),(max-width:640px){.grid{grid-template-columns:minmax(0,1fr);align-content:start}.screen{padding-left:16px;padding-right:16px}}h2{margin:0;font-size:30px;line-height:1.1}h3{letter-spacing:1.2px;text-transform:uppercase;opacity:.8;margin:4px 0 0;font-size:13px;font-weight:800}h3 small{text-transform:none;letter-spacing:0;opacity:.8;font-weight:700}.sub{opacity:.88;min-height:1.3em;margin:0;font-size:15px;line-height:1.35}.rotate-hint{opacity:.8;margin:2px 0 0;font-size:13px;display:none}@media (orientation:portrait){.rotate-hint{display:block}}.record{color:var(--accent);min-height:1.2em;margin:0;font-size:15px;font-weight:800}.neterr{color:#ffb3b5;min-height:1.2em;margin:0;font-size:14px;font-weight:700}.how{margin:0;font-size:14px;line-height:1.45}.how.dim{opacity:.6;font-size:12px}.field{text-align:left;letter-spacing:1px;text-transform:uppercase;opacity:.95;flex-direction:column;gap:4px;font-size:12px;font-weight:800;display:flex}.field input,.field select,.joinrow input{font:inherit;letter-spacing:0;text-transform:none;color:#fff;border:2px solid var(--line);-webkit-user-select:text;user-select:text;touch-action:manipulation;background:#ffffff1a;border-radius:12px;outline:none;width:100%;min-height:46px;padding:8px 14px;font-size:17px;font-weight:800}.field input:focus,.joinrow input:focus{border-color:var(--accent)}.field select option{color:#111}.joinrow{gap:8px;display:flex}.joinrow input{letter-spacing:4px;text-align:center;text-transform:uppercase;flex:1;min-width:0;font-size:18px}#myRoomLink{letter-spacing:0;text-transform:none;text-align:left;font-size:14px;font-weight:700}#myRoomNote{text-transform:none;letter-spacing:0;min-height:1em;color:var(--good);opacity:1}.joinrow .btn{width:auto;padding:0 20px}.switch{align-items:center;gap:10px;min-height:40px;font-size:15px;font-weight:700;display:flex}.switch input{width:20px;height:20px;accent-color:var(--accent)}.btn{font:inherit;cursor:pointer;touch-action:manipulation;color:#222;background:var(--accent);border:0;border-radius:14px;justify-content:center;align-items:center;gap:8px;width:100%;min-height:50px;padding:0 18px;font-size:17px;font-weight:900;display:flex}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.5;cursor:default;transform:none}.btn.wa{background:var(--wa);color:#05290f}.btn.alt{background:var(--blue);color:#fff}.btn.ghost{color:#fff;border:2px solid var(--line);background:0 0;font-weight:800}.btn .ico{font-size:20px}.chip{font:inherit;color:#fff;border:1px solid var(--line);cursor:pointer;touch-action:manipulation;text-overflow:ellipsis;white-space:nowrap;background:#ffffff1f;border-radius:999px;max-width:52vw;min-height:38px;padding:0 14px;font-size:14px;font-weight:800;overflow:hidden}button.link{color:#fff;opacity:.85;font:inherit;cursor:pointer;touch-action:manipulation;background:0 0;border:0;padding:8px 10px;font-size:14px;font-weight:700;text-decoration:underline}.rowlinks{flex-wrap:wrap;gap:6px;display:flex}.invite{background:#3d8cff38;border:2px solid #3d8cffb3;border-radius:14px;padding:12px}.invite p{margin:0 0 8px;font-size:16px;font-weight:700}.invite b{color:var(--accent);letter-spacing:3px}.events{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;display:grid}.event{text-align:center;background:var(--panel);border:2px solid var(--line);opacity:.55;border-radius:12px;flex-direction:column;align-items:center;gap:2px;min-width:0;padding:8px 4px;display:flex}.event.on{opacity:1;border-color:var(--accent);background:#ffd23f24}.event .ico{font-size:24px;line-height:1.1}.event b{font-size:13px;line-height:1.15}.event small{opacity:.85;font-size:11px;font-weight:700}.friends,.players{flex-direction:column;gap:6px;margin:0;padding:0;list-style:none;display:flex}.friends{touch-action:pan-y;max-height:30vh;overflow-y:auto}.friends li,.players li{background:var(--panel);border-radius:12px;align-items:center;gap:10px;min-height:42px;padding:7px 12px;font-weight:800;display:flex}.friends li.off{opacity:.55}.friends li.empty{opacity:.8;font-size:13px;font-weight:600;line-height:1.4;display:block}.friends .dot{background:#6b7a90;border-radius:50%;flex:none;width:10px;height:10px}.friends li.on .dot{background:var(--good);box-shadow:0 0 0 3px #3ddc8440}.friends .nm,.players .nm{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.friends .st{opacity:.8;font-size:12px;font-weight:700}.friends .go{flex:none;width:auto;min-height:32px;padding:0 12px;font-size:13px}.players li.me{background:#ffd23f38}.players .ln{color:#111;border-radius:50%;flex:none;place-items:center;width:24px;height:24px;font-size:13px;display:grid}.players .crown{font-size:14px}.players .st{opacity:.9;font-size:12px;font-weight:800}.players .st.ok{color:var(--good)}.players .st.off{color:#ff9a9d}.botsrow{align-items:center;gap:10px;font-size:14px;font-weight:800;display:flex}.botsrow span{flex:1}.botsrow b{text-align:center;min-width:1.4ch;font-size:18px}.linkrow{align-items:center;gap:6px;display:flex}.linkrow input{min-width:0;font:inherit;color:#fff;border:1px solid var(--line);-webkit-user-select:text;user-select:text;background:#ffffff1a;border-radius:10px;outline:none;flex:1;min-height:38px;padding:8px 10px;font-size:14px;font-weight:700}#resList{counter-reset:pos;flex-direction:column;gap:5px;margin:0;padding:0;list-style:none;display:flex}#resList li{counter-increment:pos;background:var(--panel);border-radius:10px;align-items:center;gap:10px;min-height:40px;padding:7px 12px;font-weight:700;display:flex}#resList li:before{content:counter(pos) "º";width:28px;color:var(--accent);font-weight:900}#resList li.me{background:#ffd23f42}#resList li.bot{opacity:.75}#resList .sw{border:2px solid #fff;border-radius:50%;flex:none;width:14px;height:14px}#resList .nm{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}#resList .tm{font-variant-numeric:tabular-nums;font-size:14px}.badge{color:#1c1c1c;background:linear-gradient(90deg,#ffd23f,#ffb347);border-radius:999px;align-self:flex-start;padding:5px 14px;font-size:16px;font-weight:900;animation:.6s ease-out pop}@keyframes pop{0%{opacity:0;transform:scale(.4)}70%{transform:scale(1.15)}to{opacity:1;transform:scale(1)}}#histList{text-align:left;flex-direction:column;gap:5px;margin:0;padding:0;list-style:none;display:flex}#histList li{background:var(--panel);font-variant-numeric:tabular-nums;border-radius:10px;grid-template-columns:1fr auto auto;align-items:baseline;gap:10px;padding:7px 12px;font-weight:700;display:grid}#histList li.best{background:#ffd23f42}#histList li small{opacity:.75;font-weight:600}#histList li.empty{text-align:center;opacity:.8;display:block}@media (max-height:520px){.screen{padding-top:max(6px, env(safe-area-inset-top));padding-bottom:max(6px, env(safe-area-inset-bottom));gap:6px}.bar{min-height:38px}.grid{gap:14px}.col{gap:8px}h2{font-size:24px}.btn{min-height:44px;font-size:16px}.field input,.field select,.joinrow input{min-height:42px}.friends{max-height:24vh}.friends li,.players li{min-height:36px;padding:5px 10px}.event{padding:6px 4px}.event .ico{font-size:20px}#resList li{min-height:34px;padding:4px 10px}}.seg{flex-wrap:wrap;gap:6px;display:flex}.seg .chip{text-transform:none;letter-spacing:0}.seg .chip.on{background:var(--accent);color:#1c1c1c;border-color:var(--accent)}.seg .chip:disabled{opacity:.45;cursor:default}#matchRow .seg{flex:none}#resList .tot{text-align:right;font-variant-numeric:tabular-nums;min-width:4.2ch;color:var(--accent)}#resList.final li:first-child:before{content:"🥇"}#resList.final li:nth-child(2):before{content:"🥈"}#resList.final li:nth-child(3):before{content:"🥉"}#resHeading{margin:0 0 2px}.joinrow #copyMyRoomBtn,.joinrow #rotateBtn{width:auto;padding:0 14px;font-size:15px}.tabs{gap:6px;margin-top:4px;display:flex}.tabs .chip{text-transform:none;letter-spacing:0}.tabs .chip.on{background:#ffffff38;border-color:#ffffff73}.tabs small{opacity:.8;font-weight:700}.friends li .when{opacity:.7;font-size:12px;font-weight:700}.picker li{cursor:pointer}.picker li input{width:22px;height:22px;accent-color:var(--accent);flex:none}.picker{max-height:52vh}.note{min-height:1.2em;color:var(--good);margin:0;font-size:14px;font-weight:700}.toast{z-index:40;top:max(10px, env(safe-area-inset-top));border:2px solid var(--accent);background:#13306b;border-radius:16px;align-items:center;gap:10px;width:min(94vw,560px);padding:10px 12px;font-weight:800;display:flex;position:fixed;left:50%;transform:translate(-50%);box-shadow:0 8px 30px #00000073}.toast span{flex:1;min-width:0;line-height:1.25}.toast .btn{width:auto;min-height:40px;padding:0 16px}.world{counter-reset:w;flex-direction:column;gap:5px;margin:0;padding:0;list-style:none;display:flex}.world li{counter-increment:w;background:var(--panel);font-variant-numeric:tabular-nums;border-radius:10px;grid-template-columns:30px 1fr auto auto;align-items:baseline;gap:10px;padding:7px 12px;font-weight:700;display:grid}.world li:before{content:counter(w) "º";color:var(--accent);font-weight:900}.world li.me{background:#ffd23f42}.world li small{opacity:.7;font-weight:600}.world li.empty{text-align:center;opacity:.8;display:block}.world li.empty:before{content:none}