:root{--bg:#14160f;--panel:#181b13ed;--line:#dcd2a02e;--txt:#f1eedc;--muted:#b9b49a;--accent:#d9b44a;--accent2:#8ea24e;--friend:#5fe08a;--enemy:#ff5a4f;--bad:#ff6b5b;--sat:env(safe-area-inset-top,0px);--sab:env(safe-area-inset-bottom,0px);--sal:env(safe-area-inset-left,0px);--sar:env(safe-area-inset-right,0px);font-family:Segoe UI,system-ui,-apple-system,Roboto,Arial,sans-serif}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--txt);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:none;overscroll-behavior:none;margin:0;overflow:hidden}#c{touch-action:none;outline:none;width:100%;height:100%;display:block;position:fixed;inset:0}.hidden{display:none!important}.screen{padding:max(12px, var(--sat)) max(12px, var(--sar)) max(12px, var(--sab)) max(12px, var(--sal));z-index:20;touch-action:pan-y;background:radial-gradient(#0a0c060d,#0a0c06a6);justify-content:center;align-items:center;display:none;position:fixed;inset:0;overflow:auto}.screen.clear{background:linear-gradient(90deg,#0a0c06bf,#0a0c0600 55%);justify-content:flex-start}.screen.dim{z-index:30;background:#08090599}.screen.show{display:flex}#loading{z-index:50;background:radial-gradient(#262a1b,#0d0f09);flex-direction:column;gap:14px}#loading .bar{background:#ffffff1a;border-radius:3px;width:min(320px,70vw);height:6px;overflow:hidden}#loading .bar i{background:var(--accent);width:0;height:100%;transition:width .2s;display:block}.logo{letter-spacing:8px;color:var(--accent);text-shadow:0 3px #5c4a14,0 8px 24px #0009;font-size:44px;font-weight:900}.logo.big{text-align:center;font-size:clamp(44px,9vw,72px)}.panel{background:var(--panel);border:1px solid var(--line);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:14px;max-width:100%;margin:auto;padding:20px 22px;box-shadow:0 20px 60px #0000008c}.panel.menu{text-align:center;width:420px}.panel.small{width:420px}.panel.wide{width:820px}.panel h2{letter-spacing:2px;text-transform:uppercase;margin:0 0 10px}.tag{color:var(--muted);margin:2px 0 12px}.who{min-height:20px;color:var(--muted);font-size:14px}.current{color:var(--accent);letter-spacing:1px;margin:8px 0 12px;font-weight:700}.col{flex-direction:column;gap:10px;display:flex}.row{flex-wrap:wrap;justify-content:center;gap:10px;margin-top:12px;display:flex}.btn{appearance:none;border:1px solid var(--line);color:var(--txt);font:inherit;cursor:pointer;letter-spacing:.5px;touch-action:manipulation;background:#ffffff0f;border-radius:9px;padding:10px 16px;font-weight:700}.btn:hover{background:#ffffff1f}.btn.primary{color:#1d1806;background:linear-gradient(#e2c15a,#b58f2a);border-color:#f0d77d}.btn.primary:hover{filter:brightness(1.08)}.btn.big{padding:14px 18px;font-size:17px}.btn.small{padding:6px 10px;font-size:13px}.btn.ghost{background:0 0}.muted{color:var(--muted)}.small{font-size:13px}.err{color:var(--bad);min-height:18px;font-size:14px}.invite{border:1px dashed var(--accent);border-radius:10px;margin-top:12px;padding:10px}.join input,.field input,.field select{font:inherit;border:1px solid var(--line);color:var(--txt);background:#00000059;border-radius:8px;padding:9px 10px}.join input{text-transform:uppercase;letter-spacing:4px;text-align:center;width:110px;font-weight:800}.field{justify-content:space-between;align-items:center;gap:12px;margin:10px 0;display:flex}.field input[type=range]{width:180px;padding:0}.help p{max-width:620px;margin:8px 0;line-height:1.45}.garage{width:min(400px,100%);margin-left:max(8px, var(--sal));flex-direction:column;gap:12px;display:flex}.gHead{justify-content:space-between;align-items:center;display:flex}.gHead h2{letter-spacing:3px;text-transform:uppercase;color:var(--accent);margin:0}.gTabs{gap:8px;display:flex}.gTabs button{flex:1}.gTabs button.on{border-color:var(--accent);color:var(--accent);background:#d9b44a1f}.gInfo{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:16px 18px}.gInfo h3{letter-spacing:2px;text-transform:uppercase;margin:0 0 4px;font-size:24px}.stats{grid-template-columns:auto 1fr auto;align-items:center;gap:6px 10px;margin:12px 0 14px;font-size:14px;display:grid}.stats .b{background:#ffffff14;border-radius:4px;height:8px;overflow:hidden}.stats .b i{background:var(--accent2);height:100%;display:block}.stats .v{color:var(--muted);font-variant-numeric:tabular-nums;text-align:right}#hud{pointer-events:none;z-index:10;position:fixed;inset:0}#hud button,#hud .pick,#touch{pointer-events:auto}#markers{position:absolute;inset:0;overflow:hidden}.tm{text-align:center;white-space:nowrap;width:0;position:absolute;top:0;left:0}.tm>*{position:relative;left:0;transform:translate(-50%)}.tm .tn{color:var(--enemy);text-shadow:0 1px 2px #000,0 0 4px #000;font-size:12px;font-weight:700;display:inline-block}.tm .th{background:#0000008c;border-radius:2px;width:54px;height:4px;margin:2px 0 0;overflow:hidden}.tm .th i{background:var(--enemy);height:100%;display:block}.tm .td{color:#ffd0c8;text-shadow:0 1px 2px #000;font-size:11px}.tm.friend .tn{color:var(--friend)}.tm.friend .th i{background:var(--friend)}#cross{opacity:.55;filter:drop-shadow(0 0 1px #000);background:linear-gradient(#fff,#fff) 50%/2px 7px no-repeat,linear-gradient(#fff,#fff) 50%/7px 2px no-repeat;width:22px;height:22px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}#hud.sighted #cross{display:none}#gunMarker{will-change:transform;position:absolute;top:0;left:0}#gunMarker svg{filter:drop-shadow(0 0 1.5px #000000e6);width:100%;height:100%;overflow:visible}#gunMarker .disp{fill:none;stroke:#ffffffd9;stroke-width:1.2px;vector-effect:non-scaling-stroke}#gunMarker .rl{fill:none;stroke:#ffb03a;stroke-width:3px;vector-effect:non-scaling-stroke;stroke-dasharray:100;transform-origin:50%;transform:rotate(-90deg)}#gunMarker.ready .rl{stroke:#7cf08f;stroke-width:2px}#scope{background:radial-gradient(circle,#0000 0 min(42vh,42vw),#000000eb calc(min(42vh,42vw) + 2px));position:absolute;inset:0}#scope .ring{border:3px solid #000000e6;border-radius:50%;width:min(84vh,84vw);height:min(84vh,84vw);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:inset 0 0 40px #0000008c}#scope .cross{background:linear-gradient(#000000bf,#000000bf) 50%/100% 1px no-repeat,linear-gradient(#000000bf,#000000bf) 50%/1px 100% no-repeat;width:min(84vh,84vw);height:min(84vh,84vw);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);-webkit-mask:radial-gradient(circle,#0000 0 14px,#000 15px);mask:radial-gradient(circle,#0000 0 14px,#000 15px)}#zoomText{color:#f8e7a4;text-shadow:0 1px 2px #000;font-weight:800;position:absolute;bottom:calc(50% - min(42vh,42vw) + 14px);left:50%;transform:translate(-50%)}#hitDir{opacity:0;width:260px;height:260px;position:absolute;top:50%;left:50%}#hitDir i{background:radial-gradient(at 50% 100%,#ff3c28f2,#ff3c2800 70%);border-radius:50% 50% 0 0;width:70px;height:22px;position:absolute;top:0;left:50%;transform:translate(-50%)}#hitDir.on{animation:1.6s ease-out fadeOut}#flash{opacity:0;background:radial-gradient(#f000 40%,#c8140a8c);position:absolute;inset:0}#flash.on{animation:.8s ease-out fadeOut}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}#top{top:max(8px, var(--sat));border:1px solid var(--line);background:#10120c99;border-radius:10px;align-items:center;gap:12px;padding:5px 12px;display:flex;position:absolute;left:50%;transform:translate(-50%)}#top .sc{align-items:center;gap:8px;font-size:22px;font-weight:900;display:flex}#top .mine b{color:var(--friend)}#top .them b{color:var(--enemy)}#top .sb{background:#ffffff1a;border-radius:4px;width:110px;height:7px;overflow:hidden}#top .mine .sb{direction:rtl}#top .mine .sb i{background:var(--friend)}#top .them .sb i{background:var(--enemy)}#top .sb i{width:0;height:100%;transition:width .3s;display:block}#clock{font-variant-numeric:tabular-nums;text-align:center;min-width:50px;font-weight:800}#feed{top:max(60px, calc(var(--sat) + 52px));right:max(10px, var(--sar));flex-direction:column;align-items:flex-end;gap:4px;display:flex;position:absolute}.kf{background:#0a0c0899;border-radius:6px;padding:4px 9px;font-size:13px;font-weight:700;transition:opacity 1s}.kf.mine{border:1px solid var(--accent)}.kf.old{opacity:0}.kf .f{color:var(--friend)}.kf .e{color:var(--enemy)}.kf i{color:#ffb03a;font-style:normal}#hitMsg,#hurtMsg,#bigMsg{text-align:center;text-shadow:0 2px 4px #000,0 0 10px #000000b3;opacity:0;white-space:nowrap;font-weight:900;transition:opacity .25s;position:absolute;left:50%;transform:translate(-50%)}#hitMsg{font-size:22px;top:calc(50% + 46px)}#hitMsg small,#hurtMsg small{color:var(--muted);font-size:13px;font-weight:700;display:block}#hitMsg.pen{color:#ffcf4a}#hitMsg.nopen,#hitMsg.rico{color:#cfd6e6}#hurtMsg{color:#ff8d7d;font-size:17px;top:calc(50% + 86px)}#hurtMsg.nopen,#hurtMsg.rico{color:#b8e0ff}#bigMsg{letter-spacing:4px;color:#ffcf4a;font-size:40px;top:26%}#hitMsg.show,#hurtMsg.show,#bigMsg.show{opacity:1}#me{left:max(10px, var(--sal));bottom:max(10px, var(--sab));border:1px solid var(--line);background:#10120ca8;border-radius:10px;width:250px;padding:8px 10px;position:absolute}#meName{letter-spacing:1px;color:var(--accent);margin-bottom:5px;font-size:13px;font-weight:800}#me .hp,#me .rl{background:#00000080;border-radius:4px;height:16px;position:relative;overflow:hidden}#me .hp i,#me .rl i{background:#59c46f;transition:width .15s;position:absolute;inset:0 auto 0 0}#me .hp i.mid{background:#e2b43b}#me .hp i.low{background:#e3523f}#me .hp span,#me .rl span{text-align:center;text-shadow:0 1px 1px #000;font-size:11px;font-weight:800;line-height:16px;display:block;position:relative}#me .row2{align-items:center;gap:8px;margin-top:6px;display:flex}#me .spd{font-variant-numeric:tabular-nums;width:70px}#me .spd b{font-size:20px}#me .spd small{color:var(--muted);margin-left:3px}#me .rl{flex:1}#me .rl i{background:#c88a2a;transition:none}#me .rl i.ready{background:#59c46f}#minimap{right:max(10px, var(--sar));bottom:max(10px, var(--sab));border:2px solid #dcd2a059;border-radius:6px;width:min(210px,28vw);height:min(210px,28vw);position:absolute;box-shadow:0 6px 20px #00000080}#tools{top:max(8px, var(--sat));right:max(10px, var(--sar));gap:6px;display:flex;position:absolute}.ib{border:1px solid var(--line);width:40px;height:40px;color:var(--txt);cursor:pointer;background:#10120c99;border-radius:9px;font-size:17px}#netBox{top:max(8px, var(--sat));left:max(10px, var(--sal));color:var(--muted);background:#10120c99;border-radius:6px;padding:5px 8px;font-size:12px;position:absolute}#deadBox{position:absolute;top:20%;left:50%;transform:translate(-50%)}#deadBox .card{text-align:center;background:#10120cd1;border:1px solid #ff5a4f80;border-radius:12px;padding:12px 18px}#deadBox h2{color:var(--enemy);letter-spacing:2px;margin:0}#deadBox p{margin:6px 0}#deadPick{justify-content:center;gap:8px;display:flex}.pick{pointer-events:auto;font:inherit;color:var(--txt);border:1px solid var(--line);cursor:pointer;background:#ffffff0f;border-radius:8px;flex-direction:column;gap:2px;padding:7px 10px;display:flex}.pick small{color:var(--muted);font-size:11px}.pick.on{border-color:var(--accent);background:#d9b44a29}#board{border:1px solid var(--line);background:#10120ce6;border-radius:12px;max-width:96vw;padding:14px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.teams{flex-wrap:wrap;justify-content:center;gap:18px;display:flex}.teams table{border-collapse:collapse;min-width:300px;font-size:14px}.teams th{text-align:left;color:var(--muted);border-bottom:1px solid var(--line);padding:4px 8px;font-weight:700}.teams td{padding:4px 8px}.teams tr.me td{color:var(--accent);font-weight:800}.teams td small{color:var(--muted)}#clickHint{background:#10120cb3;border-radius:8px;padding:6px 12px;font-weight:700;position:absolute;top:calc(50% - 70px);left:50%;transform:translate(-50%)}#end h1{text-align:center;letter-spacing:6px;margin:0;font-size:40px}#end h1.won{color:var(--accent)}#end h1.lost{color:var(--enemy)}.endScore{text-align:center;margin:4px 0 10px;font-size:26px;font-weight:900}.endMe{justify-content:center;gap:18px;margin-bottom:12px;font-weight:700;display:flex}.endMe span b{color:var(--accent);margin-right:4px;font-size:22px}#endTable{max-height:40vh;overflow:auto}#touch{pointer-events:none;position:absolute;inset:0}#stickBase{background:#ffffff14;border:2px solid #ffffff40;border-radius:50%;width:120px;height:120px;display:none;position:absolute}#stickKnob{background:#ffffff59;border-radius:50%;width:50px;height:50px;position:absolute;top:35px;left:35px}.tb2{pointer-events:auto;width:84px;height:84px;right:max(28px, calc(var(--sar) + 18px));bottom:calc(min(210px, 28vw) + max(28px, var(--sab)) + 6px);touch-action:none;background:#c8501e73;border:2px solid #ffffff59;border-radius:50%;font-size:34px;position:absolute}.tb2.on{background:#f06e28bf}.tb2.small{width:58px;height:58px;right:max(124px, calc(var(--sar) + 114px));bottom:calc(min(210px, 28vw) + max(28px, var(--sab)) + 8px);background:#1e281480;font-size:24px}body.touch #me{transform-origin:0 100%;width:200px}body.touch #feed{top:max(54px, calc(var(--sat) + 48px));transform-origin:100% 0;transform:scale(.85)}@media (max-height:500px){#minimap{width:min(150px,24vw);height:min(150px,24vw)}.tb2{bottom:calc(min(150px, 24vw) + max(20px, var(--sab)));width:74px;height:74px}.tb2.small{bottom:calc(min(150px, 24vw) + max(22px, var(--sab)));right:max(108px, calc(var(--sar) + 100px))}#me{width:190px;padding:6px 8px}.panel{padding:14px 16px}.logo.big{font-size:40px}.btn.big{padding:10px 14px;font-size:15px}}body.touch #minimap{top:max(8px, var(--sat));left:max(10px, var(--sal));width:min(130px,22vw);height:min(130px,22vw);bottom:auto;right:auto}body.touch .tb2{bottom:max(26px, calc(var(--sab) + 16px))}body.touch .tb2.small{bottom:max(110px, calc(var(--sab) + 100px));right:max(40px, calc(var(--sar) + 30px))}body.touch #netBox{top:calc(max(8px, var(--sat)) + min(130px, 22vw) + 6px)}
