:root{--ink:#fff8ea;--panel:#141c229e;--gold:#f4c95d;--green:#7bd36a}*{box-sizing:border-box}html,body{height:100%;color:var(--ink);-webkit-user-select:none;user-select:none;touch-action:none;background:#101418;margin:0;font-family:Fredoka,system-ui,sans-serif;overflow:hidden}#game canvas{display:block;position:fixed;inset:0}.hidden{display:none!important}button{font:inherit;cursor:pointer;color:var(--ink);background:#ffffff24;border:0;border-radius:14px;padding:12px 18px;font-weight:600;transition:transform .1s,background .2s}button:hover{background:#ffffff3d}button:active{transform:scale(.97)}button.primary{color:#3a2608;background:linear-gradient(#f6d77a,#e2a93b);box-shadow:0 4px #a8741d}input,select{font:inherit;color:var(--ink);background:#00000040;border:2px solid #fff3;border-radius:12px;padding:10px 12px}#lobby{z-index:10;background:radial-gradient(at 50% 30%,#ffdc9659,#0000 60%),linear-gradient(#5f9fc5,#2c5a3e 70%,#1b2a20);place-items:center;display:grid;position:fixed;inset:0}#lobby .card,#menu .card{background:var(--panel);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid #ffffff26;border-radius:24px;flex-direction:column;gap:12px;width:min(420px,100vw - 32px);padding:26px;display:flex;box-shadow:0 20px 60px #00000059}#lobby h1{text-align:center;text-shadow:0 3px #00000040;margin:0;font-size:44px}#lobby .sub{text-align:center;opacity:.8;margin:-6px 0 6px}#lobby .row{gap:8px;display:flex}#lobby .row>*{flex:1}#code{text-transform:uppercase;letter-spacing:4px;text-align:center}.online{text-align:center;opacity:.7;margin:0;font-size:14px}.err{text-align:center;color:#ffb4a8;min-height:1em;margin:0}.editor{color:var(--ink);opacity:.75;text-align:center;font-size:14px}#menu{z-index:20;background:#00000059;place-items:center;display:grid;position:fixed;inset:0}#menu h2{margin:0}#menu label{align-items:center;gap:10px;font-size:15px;display:flex}#menu label input[type=range]{flex:1}#menu .hostonly{background:#ffffff0f;border-radius:14px;flex-direction:column;gap:10px;padding:10px;display:flex}.menubtn{z-index:6;background:var(--panel);padding:8px 12px;position:fixed;top:10px;right:10px}.hud{pointer-events:none;z-index:5;position:fixed;inset:0}.cross{--s:26px;width:0;height:0;position:absolute;top:50%;left:50%}.cross i{background:#ffffffe6;width:2px;height:9px;transition:transform 50ms;position:absolute;box-shadow:0 0 2px #000c}.cross i:first-child{transform:translate(-1px, calc(-1 * var(--s) - 9px))}.cross i:nth-child(2){transform:translate(-1px, var(--s))}.cross i:nth-child(3){width:9px;height:2px;transform:translate(calc(-1 * var(--s) - 9px), -1px)}.cross i:nth-child(4){width:9px;height:2px;transform:translate(var(--s), -1px)}.cross b{background:#fff;border-radius:50%;width:4px;height:4px;position:absolute;transform:translate(-2px,-2px);box-shadow:0 0 3px #000}.cross.full i{background:var(--gold)}.hitmark{color:#fff;text-shadow:0 2px 4px #000;opacity:0;font-size:20px;font-weight:700;transition:opacity .2s;position:absolute;top:50%;left:50%;transform:translate(14px,-34px)}.hitmark.show{opacity:1;transition:none}.hitmark.head{color:var(--gold);font-size:26px}.dmgdir{opacity:0;filter:blur(1px);border-top:10px solid #ff3c28d9;border-radius:50%;width:220px;height:220px;position:absolute;top:50%;left:50%}.incs{pointer-events:none;width:0;height:0;position:absolute;top:50%;left:50%}.inc{width:0;height:0;position:absolute;top:0;left:0}.inb{color:#ff5a3c;text-shadow:0 2px 4px #000;flex-direction:column;align-items:center;font-weight:800;animation:.6s ease-in-out infinite alternate incp;display:flex;position:absolute;top:0;left:0}.inb .ina{font-size:30px;line-height:1}.inb .inn{color:#fff;font-size:18px}@keyframes incp{0%{opacity:1}to{opacity:.55}}.dmgdir.show{animation:1s ease-out dmg}@keyframes dmg{0%{opacity:1}to{opacity:0}}.hp{align-items:center;gap:10px;display:flex;position:absolute;bottom:22px;left:22px}.hpbar{background:#00000073;border:2px solid #ffffff59;border-radius:10px;width:230px;height:18px;overflow:hidden}.hpfill{background:var(--green);width:100%;height:100%;transition:width .2s,background .3s}.hpnum{text-shadow:0 2px 3px #000;font-size:22px;font-weight:700}.drawbar{background:#0006;border-radius:3px;width:70px;height:5px;transition:opacity .2s;position:absolute;top:calc(50% + 46px);left:50%;overflow:hidden;transform:translate(-50%)}.drawfill{background:var(--gold);height:100%}.top{background:var(--panel);border-radius:14px;align-items:center;gap:14px;padding:6px 16px;font-weight:600;display:flex;position:absolute;top:12px;left:50%;transform:translate(-50%)}.top .clock{font-size:22px}.top .code{opacity:.7;font-size:14px}.feed{flex-direction:column;align-items:flex-end;gap:4px;display:flex;position:absolute;top:58px;right:14px}.feed div{background:var(--panel);border-radius:10px;padding:4px 10px;font-size:15px;transition:opacity 1s}.feed div.gone{opacity:0}.toast{text-shadow:0 3px 6px #0009;opacity:0;white-space:nowrap;font-size:28px;font-weight:700;position:absolute;top:28%;left:50%;transform:translate(-50%)}.toast.pop{animation:2.2s ease-out toast}@keyframes toast{0%{opacity:0;transform:translate(-50%,10px)scale(.9)}10%{opacity:1;transform:translate(-50%)scale(1.05)}80%{opacity:1}to{opacity:0}}.board,.results{background:var(--panel);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:20px;min-width:340px;padding:18px 24px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.board table,.results table{border-collapse:collapse;width:100%}.board td,.board th,.results td{text-align:left;padding:5px 10px}tr.me{background:#f4c95d33}.results h1{text-align:center;margin:0 0 10px}.results p{text-align:center;opacity:.8}.dead{text-align:center;text-shadow:0 3px 8px #0009;position:absolute;top:13%;left:50%;transform:translate(-50%)}.dead .big{font-size:34px;font-weight:700}.dead .small{opacity:.85;font-size:20px}.help{background:var(--panel);text-align:center;border-radius:12px;max-width:70vw;padding:8px 14px;font-size:14px;transition:opacity 1s;position:absolute;bottom:18px;left:50%;transform:translate(-50%)}.labels{position:absolute;inset:0}.tag{text-align:center;text-shadow:0 1px 3px #000,0 0 2px #000;white-space:nowrap;font-size:14px;font-weight:600;position:absolute;top:0;left:0}.tbar{background:#00000080;border-radius:2px;width:50px;height:4px;margin:2px auto 0;overflow:hidden}.tbar div{background:var(--green);height:100%}.touch-ui{z-index:4;pointer-events:none;position:fixed;inset:0}.touch-ui .stick-base{opacity:0;background:#ffffff1f;border:2px solid #ffffff4d;border-radius:50%;width:120px;height:120px;position:absolute;bottom:60px;left:40px}.touch-ui .stick-base.on{opacity:1}.touch-ui .stick-knob{background:#ffffff73;border-radius:50%;width:50px;height:50px;position:absolute;top:35px;left:35px}.touch-ui .tb{pointer-events:auto;background:#141c2280;border:2px solid #ffffff59;border-radius:50%;width:64px;height:64px;padding:0;font-size:26px;position:absolute}.touch-ui .tb.on{background:#f4c95d8c}.touch-ui .draw{width:92px;height:92px;font-size:38px;bottom:110px;right:30px}.touch-ui .jump{bottom:40px;right:140px}.touch-ui .crouch{bottom:24px;right:30px}.touch-ui .sprint{bottom:120px;right:140px}.touch-ui .glide{bottom:200px;right:140px}@media (pointer:coarse){.hp{top:12px;bottom:auto;left:12px}.hpbar{width:120px}.top{top:48px}}.lockring{pointer-events:none;display:none;position:absolute;top:0;left:0}.lockring svg{width:100%;height:100%;overflow:visible;transform:rotate(-90deg)}.lockring circle{fill:none;stroke-width:3.5px}.lockring .bg{stroke:#ffffff40}.lockring .fg{stroke:#fff4c2;stroke-dasharray:150.8;stroke-linecap:round;filter:drop-shadow(0 0 3px #0009)}.lockring.locked .fg{stroke:#ff5a47;stroke-width:4.5px}.lockring.locked{animation:.7s ease-in-out infinite lockpulse}@keyframes lockpulse{50%{opacity:.55}}.power{color:#fff;text-shadow:0 1px 2px #0006;background:#ff8c1ed9;border-radius:14px;padding:5px 12px;font-size:16px;font-weight:700;position:absolute;bottom:58px;left:22px;box-shadow:0 0 14px #ff9628cc}.power.ending{animation:.5s infinite alternate powerblink}@keyframes powerblink{0%{opacity:1}to{opacity:.35}}.reconnect{z-index:50;color:#fff;background:#141e19d9;border-radius:16px;padding:8px 16px;font-weight:700;position:fixed;top:64px;left:50%;transform:translate(-50%);box-shadow:0 4px 14px #00000059}.credits{opacity:.55;text-align:center;margin-top:10px;font-size:11px}.credits a{color:inherit}.hint{color:#fff;white-space:nowrap;background:#141e19b8;border-radius:14px;padding:6px 14px;font-size:16px;position:absolute;bottom:96px;left:50%;transform:translate(-50%)}.hint b{color:#223;background:#fff;border-radius:6px;margin-right:4px;padding:0 7px;display:inline-block}.touch-ui .use{bottom:120px;right:220px}.power.eagle{background:#328cf0e0;box-shadow:0 0 14px #5aaaffd9}#lobby .skins{justify-content:center;align-items:center;gap:6px;margin:4px 0 8px;display:flex}#lobby .skins canvas{touch-action:none;cursor:grab;width:190px;height:250px}#lobby .skins button{border-radius:50%;padding:10px 14px;font-size:20px}#lobby .card.home{max-height:calc(100vh - 24px);overflow-y:auto}.gameshead{opacity:.8;text-transform:uppercase;letter-spacing:1px;margin:6px 0 0;font-size:15px}.games{flex-direction:column;gap:6px;display:flex}.games .nogames{opacity:.6;text-align:center;margin:0;font-size:14px}.game{background:#ffffff14;border-radius:14px;align-items:center;gap:10px;padding:8px 10px;display:flex}.game .gi{font-size:24px}.game .gt{flex-direction:column;flex:1;min-width:0;display:flex}.game .gt small{opacity:.7;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.game .gb{gap:6px;display:flex}.game button{padding:8px 12px;font-size:14px}.game button.t.r{background:#e05a4f99}.game button.t.b{background:#4fa3e099}.game .full{opacity:.6;font-size:14px}#lobby .card.room{gap:14px;width:min(720px,100vw - 24px);max-height:calc(100vh - 24px);overflow-y:auto}.rhead{justify-content:space-between;align-items:center;gap:10px;display:flex}.rhead h2{margin:0}.rhead h2 b{letter-spacing:3px;color:var(--gold)}.rhead .copy{padding:8px 12px;font-size:14px}.modes{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.modes button{border:2px solid #0000;flex-direction:column;align-items:center;gap:4px;padding:12px 6px;display:flex}.modes button span{font-size:30px}.modes button b{font-size:14px}.modes button.on{border-color:var(--gold);background:#f4c95d38}.about{opacity:.85;text-align:center;margin:0;font-size:14px;line-height:1.45}.cols{grid-template-columns:1fr 1.2fr;gap:12px;display:grid}.col{background:#0003;border-radius:16px;padding:12px}.col h3{text-transform:uppercase;letter-spacing:1px;opacity:.75;margin:0 0 8px;font-size:13px}.plist,.team ul{flex-direction:column;gap:6px;margin:0;padding:0;list-style:none;display:flex}.plist li,.team li{align-items:center;gap:8px;display:flex}.plist li i,.team li i{background:#888;border-radius:50%;flex:none;width:12px;height:12px}.plist li.bot,.team li.bot{opacity:.7}.plist em,.team em{opacity:.6;font-style:normal}.chip{background:#f4c95d4d;border-radius:8px;padding:2px 6px;font-size:11px}.chip.off{background:#ffffff26}.teams{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px;display:grid}.team li{flex-wrap:wrap}.team{border-radius:12px;flex-direction:column;gap:8px;padding:8px;display:flex}.team.r{background:#e05a4f40}.team.b{background:#4fa3e040}.team h4{margin:0}.switchteam{padding:6px 8px;font-size:13px}.note{opacity:.75;margin:8px 0 0;font-size:13px}.srow{border-bottom:1px solid #ffffff14;justify-content:space-between;align-items:center;gap:10px;padding:6px 0;display:flex}.srow>span{opacity:.85;font-size:14px}.srow>div{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:8px;display:flex}.srow small{opacity:.6;text-align:right;flex-basis:100%;font-size:12px}.srow select{max-width:190px;padding:6px 8px}.srow input[type=range]{width:140px}.seg{gap:4px;display:flex}.seg button{border-radius:10px;padding:6px 9px;font-size:13px}.seg button.on{background:var(--gold);color:#3a2608}.step{align-items:center;gap:8px;display:flex}.step button{border-radius:10px;padding:4px 12px}.step b{text-align:center;min-width:16px}.switch{width:46px;height:26px;position:relative}.switch input{opacity:0;width:0;height:0}.switch span{background:#fff3;border-radius:13px;transition:background .2s;position:absolute;inset:0}.switch span:after{content:"";background:#fff;border-radius:50%;width:20px;height:20px;transition:transform .2s;position:absolute;top:3px;left:3px}.switch input:checked+span{background:var(--green)}.switch input:checked+span:after{transform:translate(20px)}.readonly button:disabled,.readonly input:disabled,.readonly select:disabled,select:disabled,input:disabled{opacity:.75;cursor:default}.readonly button:not(.on):disabled{opacity:.45}.rfoot{justify-content:space-between;align-items:center;gap:10px;display:flex}.rfoot .start{flex:1;max-width:300px;font-size:20px}.rfoot .wait{opacity:.75}@media (width<=640px){.cols{grid-template-columns:1fr}.modes button b{font-size:12px}}.top .teamscore b.r{color:#ff8a7a}.top .teamscore b.b{color:#8ac8ff}.top .wave{font-size:16px}.results h1 .tr{color:#ff8a7a}.results h1 .tb{color:#8ac8ff}.results h1 small{opacity:.8;font-size:18px}.bows{gap:8px;display:flex;position:absolute;bottom:58px;left:22px}.bows>span{background:var(--panel);border:2px solid #0000;border-radius:14px;padding:5px 12px;font-size:16px;font-weight:700;position:relative;overflow:hidden}.bows small{opacity:.7;font-size:12px;font-weight:400}.bows .on{border-color:var(--gold)}.bows .xb i{background:#ff8c1e73;position:absolute;top:0;bottom:0;left:0}.bows .xb em{font-style:normal;position:relative}.bows .xb.ready{background:#ff8c1ed9;box-shadow:0 0 14px #ff9628cc}.touch-ui .alt{bottom:214px;right:30px}@media (pointer:coarse){.bows{top:44px;bottom:auto;left:12px}}
