@import url('https://fonts.googleapis.com/css2?family=Baloo+2:wght@600;700;800&family=Nunito:wght@600;700;800;900&display=swap');
[hidden]{display:none!important}
*{box-sizing:border-box}body{margin:0;overflow:hidden;background:#101b3a;color:#fff;font-family:Nunito,system-ui,sans-serif}#app,#arena{width:100vw;height:100vh;display:block}#arena{background:#142b51}.panel,.modal{position:fixed;inset:0;display:grid;place-items:center;padding:20px;background:linear-gradient(130deg,rgba(8,13,34,.48),rgba(5,11,25,.84));z-index:4}.panel{background:radial-gradient(circle at 50% 25%,rgba(104,243,208,.16),transparent 36%),linear-gradient(130deg,rgba(8,13,34,.5),rgba(5,11,25,.87))}.panel>*,.card{max-width:430px}.logo{font-weight:900;letter-spacing:1px;font-size:18px;color:#dffdf5}.logo span{color:#f8dc60;font-size:24px}.eyebrow{font-weight:900;letter-spacing:2px;font-size:11px;color:#77e5cf;margin:22px 0 7px}.panel h1,.card h2{font-family:'Baloo 2',sans-serif;line-height:.83;margin:0;font-size:66px;letter-spacing:-2px}.panel h1 strong{color:#ffdc63}.sub{font-size:17px;line-height:1.45;color:#d3e3f5;margin:22px 0}.primary,.secondary{border:0;border-radius:15px;padding:16px 22px;font:900 16px Nunito;cursor:pointer}.primary{background:#f6dd5c;color:#16264b;box-shadow:0 5px 0 #b79424}.primary:active{transform:translateY(3px);box-shadow:0 2px 0 #b79424}.secondary{background:#284769;color:#fff}.back,.link{display:block;text-align:center;background:transparent;border:0;color:#9eeedb;font:800 14px Nunito;margin:20px auto;cursor:pointer;text-decoration:none}.card{width:min(430px,100%);background:#f6fbff;color:#193252;border-radius:26px;padding:28px;box-shadow:0 22px 70px #0007;position:relative}.card h2{font-size:39px;line-height:1;margin-bottom:20px}.close{position:absolute;right:16px;top:12px;border:0;background:#e3eef3;color:#17365b;border-radius:50%;font-size:26px;width:34px;height:34px;cursor:pointer}label{display:block;font-size:13px;font-weight:900;margin:13px 0;color:#294b69}input{display:block;width:100%;margin-top:6px;border:2px solid #c1d2dc;border-radius:12px;padding:13px;font:700 16px Nunito;color:#162a4b;background:#fff}.card .primary{width:100%;margin-top:12px}.error{color:#c33443;min-height:18px;font-size:13px;font-weight:800}.roomActions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}.hint{font-size:13px;line-height:1.42;color:#59738a}.top{position:fixed;z-index:2;top:max(14px,env(safe-area-inset-top));left:18px;right:18px;display:flex;align-items:center;justify-content:space-between;pointer-events:none}.brand{color:#fff;text-decoration:none;font-weight:900;letter-spacing:1px;font-size:14px;pointer-events:auto}.brand b{color:#ffdc63}.score,#timer{background:#102847df;border:2px solid #ffffff2c;border-radius:14px;padding:7px 13px;font-weight:900;backdrop-filter:blur(6px)}.score{font-size:20px}.score i{font-size:10px;color:#b5cfde;font-style:normal;margin:0 8px}.blue{color:#6ad6ff}.red{color:#ff7891}#timer{font-size:18px}.zones{position:fixed;left:50%;transform:translateX(-50%);top:76px;z-index:2;display:flex;gap:8px}.zones span{width:30px;height:30px;display:grid;place-items:center;border-radius:10px;background:#1b3555;border:2px solid #ffffff52;font-size:14px;font-weight:900}.zones .blue{background:#1887bd}.zones .red{background:#c95068}.zones .neutral{background:#64778b}#selfbar{position:fixed;left:20px;bottom:23px;z-index:2;background:#102847e5;border:2px solid #ffffff32;border-radius:16px;padding:10px 14px;min-width:205px;box-shadow:0 8px 20px #0003}#selfbar strong,#selfbar small{display:block}#selfbar small{font-size:10px;color:#9edecf;letter-spacing:1px}.health{height:9px;background:#18344f;border-radius:9px;overflow:hidden;margin:8px 0 5px}.health b{height:100%;display:block;background:linear-gradient(90deg,#ff727d,#ffd95b,#64e1bb);width:100%;transition:width .15s}#stormMeter{font-size:12px;font-weight:900;font-style:normal;color:#fce86f}#abilities{position:fixed;right:16px;bottom:20px;z-index:2;display:grid;grid-template-columns:repeat(2,104px);gap:8px}#abilities button{background:#f8fbffef;color:#19375a;border:2px solid #fff;border-radius:14px;padding:8px;text-align:left;font:900 13px Nunito;cursor:pointer;box-shadow:0 5px 0 #7692a5}#abilities b{font-size:20px;margin-right:4px}#abilities small{display:block;color:#5d7894;margin-left:28px}#abilities button.ready{background:#f7e260}#abilities button:disabled{opacity:.55}#roundMsg{position:fixed;left:50%;top:46%;transform:translate(-50%,-50%);z-index:3;font:900 40px 'Baloo 2';text-align:center;text-shadow:0 4px 0 #12284b;pointer-events:none}#toast{position:fixed;bottom:144px;left:50%;transform:translateX(-50%);z-index:5;padding:9px 15px;border-radius:12px;background:#132c4ae8;color:#fff;font-weight:800;font-size:13px;display:none}.lobby #roster{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:14px 0}.slot{padding:10px;border-radius:12px;font-weight:900;font-size:13px;background:#e2ecf2;border-left:6px solid #777}.slot.blue{border-color:#42baff}.slot.red{border-color:#ff6a80}.winner{text-align:center}.winner h2{font-size:48px}.winner p{font-weight:800;color:#50708d}@media(max-width:600px){.panel h1{font-size:58px}.top{left:10px;right:10px}.brand{font-size:11px}.score{font-size:16px}.zones{top:65px}#abilities{grid-template-columns:repeat(2,92px);right:10px;bottom:10px}#selfbar{left:10px;bottom:10px;min-width:150px;padding:8px 10px;font-size:12px}#roundMsg{font-size:30px}.card{padding:24px 20px}}