:root{color-scheme:dark}*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{width:100%;height:100%;overflow:hidden;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:#0b1020;color:#fff}.menu{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px;text-align:center;background:radial-gradient(circle at 50% 20%,#1e3a5f,#070d1c);overflow:auto}.menu h1{font-size:clamp(30px,8vw,62px);font-weight:900;letter-spacing:1px;background:linear-gradient(90deg,#86efac,#38bdf8,#fcd34d);-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:6px}.menu p.sub{opacity:.8;margin-bottom:22px;max-width:460px;line-height:1.6;font-size:14px}.card{background:#0f172a99;border:1px solid rgba(255,255,255,.12);border-radius:18px;padding:22px;width:min(440px,92vw);backdrop-filter:blur(8px)}.field{display:flex;flex-direction:column;text-align:left;margin-bottom:14px}.field label{font-size:12px;opacity:.7;margin-bottom:5px;text-transform:uppercase;letter-spacing:.5px}.field input{padding:12px 14px;border-radius:12px;border:1px solid rgba(255,255,255,.15);background:#0000004d;color:#fff;font-size:16px}.btn{cursor:pointer;border:none;border-radius:14px;padding:14px 24px;font-size:17px;font-weight:800;color:#062a12;width:100%;background:linear-gradient(90deg,#86efac,#22d3ee);box-shadow:0 8px 22px #22d3ee59;transition:transform .1s}.btn:active{transform:scale(.97)}.btn.secondary{background:linear-gradient(90deg,#93c5fd,#6366f1);color:#fff;margin-top:10px}.btn.ghost{background:#ffffff14;color:#fff;box-shadow:none}.divider{margin:18px 0;opacity:.4;font-size:13px}.err{color:#fca5a5;font-size:13px;margin-top:8px;min-height:18px}.plist{list-style:none;text-align:left;margin:8px 0 16px}.prow{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:#00000040;margin-bottom:8px}.dot{width:18px;height:18px;border-radius:50%;flex-shrink:0;border:2px solid rgba(255,255,255,.4)}.prow .nm{flex:1;font-weight:700}.prow select{background:#0006;color:#fff;border:1px solid rgba(255,255,255,.2);border-radius:8px;padding:6px 8px}.link{display:flex;gap:8px;margin:6px 0 14px}.link input{flex:1;padding:10px;border-radius:10px;border:1px solid rgba(255,255,255,.15);background:#00000059;color:#9ae6ff;font-size:13px}.link button{padding:10px 14px;border-radius:10px;border:none;cursor:pointer;font-weight:800;background:#22d3ee;color:#04283a}#glcanvas{position:fixed;inset:0;display:block}.hud{position:fixed;top:0;left:0;right:0;padding:8px 10px;display:flex;gap:6px;flex-wrap:wrap;z-index:10;pointer-events:none;text-shadow:0 2px 6px rgba(0,0,0,.6)}.stat{background:#0f172a80;border:1px solid rgba(255,255,255,.15);border-radius:12px;padding:5px 10px;min-width:54px;text-align:center;backdrop-filter:blur(6px)}.stat .l{font-size:9px;opacity:.75;text-transform:uppercase}.stat .v{font-size:18px;font-weight:800}.g .v{color:#fcd34d}.a .v{color:#86efac}.k .v{color:#93c5fd}.bar{position:fixed;left:0;right:0;bottom:14px;z-index:15;display:flex;gap:8px;justify-content:center;flex-wrap:wrap;padding:0 10px;pointer-events:none}.abtn{pointer-events:auto;cursor:pointer;border:none;border-radius:14px;padding:11px 15px;font-size:14px;font-weight:800;color:#082;box-shadow:0 6px 16px #0000004d;background:linear-gradient(90deg,#86efac,#34d399)}.abtn.build{background:linear-gradient(90deg,#fcd34d,#f59e0b);color:#5a2b00}.abtn.up{background:linear-gradient(90deg,#93c5fd,#3b82f6);color:#04204a}.abtn.turret{background:linear-gradient(90deg,#f9a8d4,#ec4899);color:#4a0026}.abtn:active{transform:scale(.95)}.abtn:disabled{opacity:.4}.abtn.troop{display:flex;flex-direction:column;align-items:center;gap:1px;padding:6px 12px 8px;line-height:1.1;background:linear-gradient(180deg,#e2e8f0,#94a3b8);color:#0b1a2f}.abtn.troop b{font-size:13px}.abtn.troop i{font-style:normal;font-size:11px;opacity:.8}.abtn.troop .sold{display:block;filter:drop-shadow(0 1px 1px rgba(0,0,0,.3))}.abtn.troop .s1{font-size:16px}.abtn.troop .s2{font-size:22px}.abtn.troop .s3{font-size:28px}#joy{position:fixed;left:20px;bottom:76px;width:120px;height:120px;border-radius:50%;background:#ffffff14;border:2px solid rgba(255,255,255,.22);z-index:14;touch-action:none;display:none}#joynub{position:absolute;width:52px;height:52px;border-radius:50%;left:34px;top:34px;background:#86efacb3;border:2px solid rgba(255,255,255,.6)}@media (pointer: coarse){#joy{display:block}}.banner{position:fixed;top:26%;left:0;right:0;text-align:center;z-index:12;pointer-events:none;font-weight:900;font-size:clamp(20px,6vw,44px);text-shadow:0 3px 14px rgba(0,0,0,.6);opacity:0;transition:opacity .3s}.banner.show{opacity:1}.over{position:fixed;inset:0;z-index:30;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px;background:radial-gradient(circle at 50% 30%,#142846d9,#060c1af5)}.over h1{font-size:clamp(30px,8vw,60px);font-weight:900;margin-bottom:12px}.mute{pointer-events:auto;margin-left:auto;cursor:pointer;background:#0f172a80;border:1px solid rgba(255,255,255,.15);border-radius:12px;padding:5px 12px;font-size:18px;color:#fff}.tabs{display:flex;gap:8px;margin-bottom:14px}.tab{flex:1;padding:10px;border-radius:10px;border:1px solid rgba(255,255,255,.15);background:#00000040;color:#cbd5e1;font-weight:700;cursor:pointer}.tab.on{background:linear-gradient(90deg,#86efac,#22d3ee);color:#062a12;border:none}.row2{display:flex;gap:8px;margin-top:12px}.row2 .btn{margin-top:0}input[type=range]{width:100%;accent-color:#34d399}.rankbadge{display:inline-flex;align-items:center;gap:8px}.rankbadge .rmedal{filter:drop-shadow(0 2px 3px rgba(0,0,0,.4))}.rankbadge .rlabel{font-weight:800}.rankbadge .rbar{width:110px;height:6px;border-radius:3px;background:#ffffff26;overflow:hidden;margin-top:3px}.rankbadge .rbar span{display:block;height:100%;border-radius:3px}.rankbadge .rmax{font-size:11px;color:#fcd34d;margin-top:2px}.profilechip{display:flex;align-items:center;gap:10px;background:#0f172a99;border:1px solid rgba(255,255,255,.12);border-radius:16px;padding:10px 14px;margin-bottom:16px;cursor:pointer;width:min(440px,92vw)}.pc-name{flex:1;text-align:left;font-weight:800}.pc-name .pc-wl{display:block;font-size:11px;opacity:.7;font-weight:500}.pc-edit{opacity:.6}.minirank{display:block;font-size:11px;opacity:.8;font-weight:600;margin-top:1px}.statgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.statgrid>div{background:#00000040;border-radius:12px;padding:10px;text-align:center}.statgrid b{display:block;font-size:18px}.statgrid span{font-size:10px;opacity:.7}.board{list-style:none}.board li{display:flex;align-items:center;gap:10px;padding:8px 6px;border-bottom:1px solid rgba(255,255,255,.07)}.board .brank{width:22px;text-align:center;opacity:.7;font-weight:800}.board .bname{flex:1;font-weight:700}.board .brating{color:#fcd34d;font-weight:800}.respawn-hint{position:fixed;left:50%;bottom:92px;transform:translate(-50%);z-index:16;display:flex;align-items:center;gap:12px;background:#0f172ab3;border:1px solid rgba(252,211,77,.5);border-radius:16px;padding:10px 16px;color:#fcd34d;font-weight:800;box-shadow:0 6px 20px #0006}.over.victory{background:radial-gradient(circle at 50% 25%,#28375ae6,#060c1af7)}.over .vfx{font-size:clamp(40px,12vw,90px);animation:pop .6s ease}@keyframes pop{0%{transform:scale(0)}70%{transform:scale(1.25)}to{transform:scale(1)}}.pointscard{background:#0000004d;border:1px solid rgba(255,255,255,.12);border-radius:16px;padding:14px 26px;margin-top:10px;display:flex;flex-direction:column;align-items:center}.pointscard .pts{font-size:26px;font-weight:900}.intro{position:fixed;inset:0;z-index:40;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px;background:radial-gradient(circle at 50% 30%,#14233f,#050a16)}.introttl{font-size:clamp(34px,10vw,76px);font-weight:900;letter-spacing:2px;background:linear-gradient(90deg,#86efac,#38bdf8,#fcd34d);-webkit-background-clip:text;background-clip:text;color:transparent}.spinner{width:60px;height:60px;margin-top:22px;border-radius:50%;border:6px solid rgba(255,255,255,.15);border-top-color:#38bdf8;animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.loadbar{width:min(320px,80vw);height:8px;border-radius:4px;background:#ffffff1f;overflow:hidden;margin-top:18px}.loadbar span{display:block;height:100%;width:0;background:linear-gradient(90deg,#86efac,#38bdf8);animation:load 1.9s ease forwards}@keyframes load{to{width:100%}}.vs-label{margin:16px 0 10px;letter-spacing:3px;text-transform:uppercase;opacity:.7;font-size:13px}.vsgrid{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;max-width:640px}.vscard{background:#0f172ab3;border:2px solid #555;border-radius:16px;padding:14px 18px;min-width:120px;opacity:0;transform:translateY(16px) scale(.9);animation:vsin .45s ease forwards}@keyframes vsin{to{opacity:1;transform:translateY(0) scale(1)}}.vscard .vsdot{display:inline-block;width:14px;height:14px;border-radius:50%;margin-bottom:6px}.vscard .vsname{font-weight:800}.vscard .vsrank{font-size:11px;opacity:.8;margin-top:2px}.vsgo{margin-top:22px;font-size:clamp(26px,7vw,44px);font-weight:900;color:#fcd34d;animation:pop .5s .3s both}.setrow{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;font-weight:700}@media (max-width: 640px){.stat{min-width:46px;padding:4px 8px}.stat .v{font-size:15px}.stat .l{font-size:8px}.bar{bottom:8px;gap:5px}.abtn{padding:8px 10px;font-size:12px}.abtn.troop b{font-size:11px}.abtn.troop i{font-size:9px}.abtn.troop .s1{font-size:13px}.abtn.troop .s2{font-size:18px}.abtn.troop .s3{font-size:23px}#joy{width:100px;height:100px;left:14px;bottom:96px}#joynub{width:44px;height:44px;left:28px;top:28px}.respawn-hint{bottom:108px;flex-direction:column;gap:8px;font-size:13px;text-align:center}}@media (max-height: 480px) and (orientation: landscape){.bar{bottom:4px}#joy{bottom:60px}}.lobbylist{list-style:none}.lrow{display:flex;align-items:center;gap:10px;padding:10px;border-radius:12px;background:#00000040;margin-bottom:8px}.linfo{flex:1;text-align:left}.linfo b{font-weight:800}.lmeta{display:block;font-size:11px;opacity:.75}.lstatus.lobby{color:#86efac}.lstatus.playing{color:#fca5a5}.lstatus.starting{color:#fcd34d}.ljoin{border:none;border-radius:10px;padding:9px 14px;font-weight:800;cursor:pointer;background:linear-gradient(90deg,#86efac,#22d3ee);color:#062a12}.ljoin.watch{background:linear-gradient(90deg,#93c5fd,#6366f1);color:#fff}.countdown{position:fixed;inset:0;z-index:35;display:flex;align-items:center;justify-content:center;pointer-events:none;background:radial-gradient(circle at 50% 40%,#0a12248c,#060c1acc)}.cnum{font-size:clamp(80px,24vw,220px);font-weight:900;color:#fff;text-shadow:0 6px 30px rgba(0,0,0,.7);animation:cpop .6s ease}.cnum.go{font-size:clamp(40px,12vw,96px);color:#fcd34d}@keyframes cpop{0%{transform:scale(2.4);opacity:0}40%{transform:scale(1);opacity:1}to{transform:scale(1);opacity:1}}.spectbar{position:fixed;left:50%;bottom:16px;transform:translate(-50%);z-index:16;display:flex;align-items:center;gap:10px;background:#0f172ab8;border:1px solid rgba(255,255,255,.15);border-radius:16px;padding:8px 14px;font-weight:800}@media (max-width: 640px){.spectbar{flex-wrap:wrap;justify-content:center;text-align:center}}.micbtn{position:fixed;right:18px;bottom:90px;z-index:16;width:62px;height:62px;border-radius:50%;border:2px solid rgba(255,255,255,.3);cursor:pointer;font-size:26px;background:#0f172ab3;color:#fff;box-shadow:0 6px 16px #0006;touch-action:none;user-select:none}.micbtn.on{background:linear-gradient(180deg,#ef4444,#b91c1c);border-color:#fff;box-shadow:0 0 0 6px #ef44444d;animation:micpulse .8s infinite}@keyframes micpulse{0%,to{transform:scale(1)}50%{transform:scale(1.08)}}.talkind{position:fixed;top:60px;left:50%;transform:translate(-50%);z-index:16;background:#b91c1cd9;color:#fff;font-weight:800;padding:6px 16px;border-radius:20px;font-size:13px;box-shadow:0 4px 12px #0006}.kickbtn{border:none;background:#ef444433;color:#fca5a5;border-radius:8px;padding:6px 8px;cursor:pointer;font-size:12px}.kickbtn:active{transform:scale(.9)}@media (max-width: 640px){.micbtn{width:54px;height:54px;font-size:22px;bottom:96px;right:12px}}.topbar{display:flex;gap:10px;align-items:center;width:min(440px,92vw);margin-bottom:14px}.avatarbig{font-size:34px}.coins{background:#0f172a99;border:1px solid rgba(252,211,77,.4);border-radius:14px;padding:10px 14px;font-weight:800;color:#fcd34d;white-space:nowrap}.xpbar{width:100%;height:6px;border-radius:3px;background:#ffffff26;overflow:hidden;margin-top:4px}.xpbar span{display:block;height:100%;background:linear-gradient(90deg,#86efac,#38bdf8)}.matchlist{list-style:none}.mrow{display:flex;align-items:center;gap:10px;padding:9px 6px;border-bottom:1px solid rgba(255,255,255,.07)}.mrow .mres{font-size:20px}.mrow.win{background:#86efac0f}.mrow.loss{background:#f871710d}.minfo{flex:1;text-align:left}.minfo b{font-size:13px}.mmeta{display:block;font-size:11px;opacity:.7}.mwhen{font-size:11px;opacity:.5}.notice{background:#60a5fa26;border:1px solid rgba(96,165,250,.4);border-radius:12px;padding:10px;margin-bottom:10px;font-size:13px}.pavatar{font-size:20px}.teamsel,.teamtag{font-size:12px}.teamtag{opacity:.8;background:#ffffff1a;border-radius:8px;padding:3px 8px;font-weight:800}.chatcard .chatbox{height:150px;overflow-y:auto;background:#00000040;border-radius:12px;padding:10px;text-align:left}.cmsg{font-size:13px;margin-bottom:4px;word-break:break-word}.chatform,.gchatform{display:flex;gap:8px;margin-top:8px}.chatform input,.gchatform input{flex:1;padding:10px;border-radius:10px;border:1px solid rgba(255,255,255,.15);background:#00000059;color:#fff}.chatform button,.gchatform button{border:none;border-radius:10px;padding:0 16px;font-weight:800;cursor:pointer;background:#22d3ee;color:#04283a}.gamechat{position:fixed;left:10px;bottom:150px;z-index:13;max-width:44vw;pointer-events:none}.gcmsg{background:#060c1a8c;border-radius:8px;padding:3px 8px;margin-bottom:3px;font-size:12px;display:inline-block;max-width:100%;word-break:break-word}.chattoggle{position:fixed;left:10px;bottom:110px;z-index:16;width:44px;height:44px;border-radius:12px;border:1px solid rgba(255,255,255,.2);background:#0f172ab3;color:#fff;font-size:20px;cursor:pointer}.gchatform{position:fixed;left:10px;bottom:110px;z-index:16;width:min(320px,70vw)}.gchatform input{background:#060c1ae6}.mrewards{display:flex;gap:14px;justify-content:center;margin-bottom:8px;font-weight:800}.avatarpick{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-bottom:10px}.apick{width:40px;height:40px;border-radius:10px;border:1px solid rgba(255,255,255,.15);background:#0000004d;font-size:22px;cursor:pointer}.apick.on{border-color:#34d399;background:#34d39933}.adminlist{max-height:46vh;overflow-y:auto}.arow{display:flex;align-items:center;gap:10px;padding:8px 6px;border-bottom:1px solid rgba(255,255,255,.07)}.arow.banned{opacity:.55;background:#f8717114}.aav{font-size:24px}.ainfo{flex:1;text-align:left}.ainfo b{font-size:13px}.ameta{display:block;font-size:11px;opacity:.7}#rotate{display:none}@media (pointer: coarse) and (orientation: portrait){#rotate{display:flex;position:fixed;inset:0;z-index:9999;align-items:center;justify-content:center;flex-direction:column;gap:14px;background:#070d1c;color:#fff;text-align:center;padding:24px;font-size:20px;font-weight:800}#rotate .ricon{font-size:60px;animation:rot 1.6s ease-in-out infinite}}@keyframes rot{0%,to{transform:rotate(0)}50%{transform:rotate(90deg)}}
