@font-face{font-family:'Caveat';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/caveat-cyrillic-ext.woff2) format('woff2');unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F}
@font-face{font-family:'Caveat';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/caveat-cyrillic.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Caveat';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/caveat-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Caveat';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/caveat-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url(fonts/inter-cyrillic-ext.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url(fonts/inter-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 500 700;
  font-display: swap;
  src: url(fonts/oswald-cyrillic-ext.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 500 700;
  font-display: swap;
  src: url(fonts/oswald-cyrillic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face{font-family:'Inter';font-weight:400 800;font-display:swap;src:url(fonts/inter-latin-ext.woff2) format('woff2');unicode-range:U+0100-02AF,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Inter';font-weight:400 800;font-display:swap;src:url(fonts/inter-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Oswald';font-weight:500 700;font-display:swap;src:url(fonts/oswald-latin-ext.woff2) format('woff2');unicode-range:U+0100-02AF,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Oswald';font-weight:500 700;font-display:swap;src:url(fonts/oswald-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
:root{--c1:#00f0ff;--c2:#b000ff;--bg:#07080d;--card:rgba(12,14,24,.88);--line:rgba(255,255,255,.1);--txt:#e9ecf5;--mut:#9aa3b8;--font:'Inter',system-ui,'Hiragino Sans','Yu Gothic UI','Meiryo','PingFang SC','Microsoft YaHei','Noto Sans CJK SC','Noto Sans CJK JP',sans-serif;--display:'Oswald','Inter','Hiragino Sans','Yu Gothic UI','Meiryo','PingFang SC','Microsoft YaHei','Noto Sans CJK SC','Noto Sans CJK JP',sans-serif}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:var(--bg);color:var(--txt);font-family:var(--font);overflow:hidden}
#app{position:fixed;inset:0}
#gl,#xh{position:absolute;inset:0;width:100%;height:100%;display:block}
#xh{pointer-events:none}
#fx{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.hidden{display:none!important}
.grad{background:linear-gradient(90deg,var(--c1),var(--c2));-webkit-background-clip:text;background-clip:text;color:transparent}
.screen{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:24px;background:radial-gradient(ellipse at 50% 30%,rgba(7,8,13,.35),rgba(7,8,13,.82));backdrop-filter:blur(3px)}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:26px 28px;box-shadow:0 20px 60px rgba(0,0,0,.55),0 0 0 1px rgba(0,240,255,.06) inset;position:relative}
.card::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;border-radius:16px 16px 0 0;background:linear-gradient(90deg,var(--c1),var(--c2))}
.center{text-align:center}
h1,h2{font-family:var(--display);text-transform:uppercase;letter-spacing:.02em;margin:.2em 0 .5em;color:#fff}
h1{font-size:40px;line-height:1.1}
h2{font-size:22px}
.logo{width:100%;height:auto;display:block;margin:0}
/* new FlowAthletiq logo with the red wolf eye fading red -> dark -> red (same 9 s cycle as the main site header) */
.logo-mark{position:relative;display:block;width:220px;margin:0 auto 6px}
.logo-eye{position:absolute;left:90.43%;top:21.84%;width:7%;aspect-ratio:1;transform:translate(-50%,-50%);pointer-events:none}
.logo-eye i{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:50%}
.logo-eye .glow{width:100%;height:100%;mix-blend-mode:screen;opacity:.9;background:radial-gradient(circle,rgba(255,236,226,.95) 0 7%,rgba(255,45,30,.95) 16%,rgba(255,0,0,.4) 38%,rgba(255,0,0,0) 68%);animation:logo-eye-glow 9s ease-in-out infinite}
.logo-eye .lid{left:52%;top:52%;width:62%;height:36%;background:#07070a;transform:translate(-50%,-50%) rotate(-24deg);opacity:0;animation:logo-eye-lid 9s ease-in-out infinite}
@keyframes logo-eye-glow{0%,20%{opacity:.9}60%,75%{opacity:0}88%,100%{opacity:.9}}
@keyframes logo-eye-lid{0%,30%{opacity:0}60%,75%{opacity:1}85%,100%{opacity:0}}
@media (prefers-reduced-motion:reduce){.logo-eye .glow,.logo-eye .lid{animation:none}}
.menu-wrap{display:flex;gap:20px;align-items:stretch;max-width:1180px;width:100%}
.menu-main{flex:1.8;text-align:center}
.menu-side{flex:1;min-width:300px}
.lead{color:#cfd5e4;font-size:16px;line-height:1.55;max-width:560px;margin:0 auto 18px}
.btn{appearance:none;border:0;cursor:pointer;font:inherit;font-weight:800;color:#000;background:linear-gradient(90deg,var(--c1),var(--c2));padding:12px 22px;border-radius:10px;min-height:44px;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;transition:filter .15s,transform .05s}
.btn:hover{filter:brightness(1.12)}.btn:active{transform:translateY(1px)}
.btn.big{font-size:17px;padding:14px 24px;font-family:var(--display);text-transform:uppercase;letter-spacing:.05em}
.btn.ghost{background:rgba(255,255,255,.06);color:#fff;border:1px solid rgba(0,240,255,.35)}
.btn.small{padding:8px 12px;min-height:36px;font-size:13px}
.btn-row{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:16px}
.btn-row.col{flex-direction:column;align-items:stretch;min-width:240px}
.tips{list-style:none;padding:0;margin:20px 0 6px;color:var(--mut);font-size:14px;line-height:1.8}
.tips b{color:#fff}
.sensline{margin-top:10px;font-size:13px;color:var(--c1)}
.muted{color:var(--mut)}.small{font-size:12.5px;line-height:1.5}
.ranks{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:6px}
.ranks li{display:flex;align-items:center;gap:12px;padding:6px 10px;border-radius:10px;background:rgba(255,255,255,.03);border:1px solid transparent}
.ranks li.me{border-color:rgba(0,240,255,.5);background:rgba(0,240,255,.07)}
.ranks li .rank-img{width:48px;height:48px;flex:none;object-fit:contain;filter:drop-shadow(0 0 6px rgba(0,240,255,.25))}
.ranks li.top .rank-img{filter:drop-shadow(0 0 8px rgba(176,0,255,.5))}
.ranks li.top .rl{color:#d7a6ff}
.ranks li .rn{font-weight:700}.ranks li .rl{font-size:12px;color:var(--mut)}
#pb{margin-bottom:16px;color:#cfd5e4;font-size:14px;line-height:1.6}
#pb b{color:#fff}
.modal{width:min(520px,100%);max-height:calc(100vh - 48px);overflow:auto}
.modal.wide{width:min(940px,100%)}
.row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px solid rgba(255,255,255,.05);font-size:14px}
.row input[type=number],.row select,.share input[type=text]{background:#0d1020;border:1px solid rgba(255,255,255,.15);color:#fff;border-radius:8px;padding:7px 10px;font:inherit;width:140px}
.row input[type=range]{flex:1;max-width:220px;accent-color:var(--c1)}
.row output{width:44px;text-align:right;font-variant-numeric:tabular-nums;color:var(--c1)}
.row input[type=checkbox]{width:20px;height:20px;accent-color:var(--c1)}
.row.info b{color:var(--c1)}
.ed{display:flex;gap:22px;flex-wrap:wrap}
.ed-prev{flex:1;min-width:300px;text-align:center}
.ed-prev canvas{width:100%;max-width:420px;border-radius:12px;border:1px solid var(--line);display:block;margin:0 auto 6px}
.ed-ctl{flex:1;min-width:320px}
.share{margin-top:14px;font-size:14px}
.share .inline{display:flex;gap:8px;margin-top:6px;flex-wrap:wrap}
.share input[type=text]{flex:1;min-width:280px;width:auto;font-family:ui-monospace,Consolas,monospace}
#x-msg.ok{color:#5ef08a}#x-msg.err{color:#ff6b6b}
/* HUD */
#hud{position:absolute;inset:0;pointer-events:none;font-family:var(--display);text-shadow:0 2px 6px rgba(0,0,0,.6)}
.hud-tl{position:absolute;left:14px;top:10px;background:rgba(7,8,13,.55);border:1px solid var(--line);border-radius:12px;padding:7px 14px}
.hud-title{font-size:18px;text-transform:uppercase;letter-spacing:.04em;font-weight:700}
.hud-sens{font-family:var(--font);font-size:12px;color:#d6dbe8;margin-top:2px}
.hud-tc{position:absolute;left:50%;top:10px;transform:translateX(-50%);text-align:center;background:rgba(7,8,13,.55);border:1px solid var(--line);border-radius:12px;padding:6px 22px}
.hud-level{font-size:14px;text-transform:uppercase;color:var(--c1);letter-spacing:.08em}
.hud-level b{color:#fff}
.hud-timer{font-size:30px;font-weight:700;line-height:1.05;font-variant-numeric:tabular-nums}
.hud-timer.warn{color:#ff5a5a}
.hud-left{font-family:var(--font);font-size:12px;color:#d6dbe8}
.hud-tr{position:absolute;right:18px;top:14px;display:flex;gap:10px}
.hud-tr div{background:rgba(7,8,13,.55);border:1px solid var(--line);border-radius:10px;padding:5px 12px;text-align:center;min-width:72px}
.hud-tr span{display:block;font-size:11px;color:var(--mut);text-transform:uppercase;letter-spacing:.08em;font-family:var(--font)}
.hud-tr b{font-size:22px}
.hud-br{position:absolute;right:22px;bottom:18px;text-align:right}
.ammo b{font-size:46px;line-height:1}.ammo span{font-size:20px;color:#cfd5e4;margin-left:4px}
.ammo i{font-style:normal}
.ammo.low b{color:#ff5a5a}
.wname{font-size:14px;letter-spacing:.2em;color:var(--c1)}
.reload{font-size:16px;color:#ffd34d}
.feed{position:absolute;right:18px;top:78px;display:flex;flex-direction:column;gap:4px;align-items:flex-end;font-family:var(--font)}
.feed div{background:rgba(7,8,13,.6);border:1px solid rgba(255,255,255,.08);border-radius:6px;padding:3px 10px;font-size:13px;animation:fade 3s forwards}
.feed .hs{color:#ffd34d}
@keyframes fade{0%,80%{opacity:1}100%{opacity:0}}
.banner{position:absolute;left:50%;top:30%;transform:translate(-50%,-50%);text-align:center;font-size:54px;text-transform:uppercase;font-weight:700;letter-spacing:.06em}
.banner small{display:block;font-size:18px;color:#d6dbe8;letter-spacing:.1em;font-family:var(--font);font-weight:600}
.clicklock{position:absolute;left:50%;top:62%;transform:translateX(-50%);background:rgba(7,8,13,.7);padding:8px 18px;border-radius:10px;border:1px solid rgba(0,240,255,.4);font-family:var(--font);font-size:14px}
.dmg{position:absolute;font-family:var(--display);font-weight:700;font-size:22px;color:#fff;text-shadow:0 0 4px #000,0 2px 4px #000;transform:translate(-50%,-50%);animation:dmgup .8s ease-out forwards;white-space:nowrap}
.dmg.hs{color:#ffd34d;font-size:28px}
.dmg.kill::after{content:" ✕";color:#ff5a5a}
@keyframes dmgup{0%{opacity:1;margin-top:0}100%{opacity:0;margin-top:-46px}}
/* Game over */
.over-reason{font-family:var(--display);font-size:26px;text-transform:uppercase;color:#ff6b6b;letter-spacing:.05em}
.rank-big .rank-img{width:168px;height:168px;margin:6px auto 0;display:block;object-fit:contain;filter:drop-shadow(0 0 16px rgba(0,240,255,.3))}
.hs-hint{margin-top:6px;font-size:13px;color:#e2b8ff;background:rgba(176,0,255,.1);border:1px solid rgba(176,0,255,.35);border-radius:8px;padding:6px 10px;display:inline-block}
.card.top-rank{border-color:rgba(176,0,255,.6);box-shadow:0 0 0 1px rgba(176,0,255,.35),0 0 60px rgba(176,0,255,.28),0 20px 60px rgba(0,0,0,.5)}
.card.top-rank .rank-big .rank-img{width:200px;height:200px;animation:topGlow 2.8s ease-in-out infinite}
.card.top-rank .rank-name{background:linear-gradient(90deg,#00f0ff,#d9b3ff,#b000ff);-webkit-background-clip:text;background-clip:text;color:transparent}
@keyframes topGlow{0%,100%{filter:drop-shadow(0 0 14px rgba(176,0,255,.45));transform:scale(1)}50%{filter:drop-shadow(0 0 30px rgba(176,0,255,.85)) drop-shadow(0 0 10px rgba(0,240,255,.4));transform:scale(1.03)}}
@media (prefers-reduced-motion:reduce){.card.top-rank .rank-big .rank-img{animation:none}}
.rank-name{font-family:var(--display);font-size:30px;text-transform:uppercase;margin-top:4px}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:18px 0 6px}
.stats div{background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:10px;padding:8px 4px}
.stats span{display:block;font-size:11px;color:var(--mut);text-transform:uppercase;letter-spacing:.08em}
.stats b{font-family:var(--display);font-size:24px}
.pbline{margin-top:10px;color:var(--c1);font-weight:700}
#mobile .card{max-width:440px}
#mobile h1{font-size:30px}
#mobile p{line-height:1.6}
@media (max-width:860px){.menu-wrap{flex-direction:column}.menu-side{min-width:0}}

.btn.big.alt{background:rgba(255,255,255,.06);color:#fff;border:1px solid rgba(176,0,255,.6);box-shadow:0 0 18px rgba(176,0,255,.18) inset}
.weapons{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:18px auto 0;max-width:620px}
.wpick{appearance:none;cursor:pointer;font:inherit;text-align:left;background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:10px;padding:9px 11px;color:var(--txt);display:flex;flex-direction:column;gap:2px}
.wpick b{font-family:var(--display);font-size:16px;letter-spacing:.03em;text-transform:uppercase}
.wpick span{font-size:11.5px;color:var(--mut)}
.wpick.on{border-color:var(--c1);background:linear-gradient(135deg,rgba(0,240,255,.12),rgba(176,0,255,.12));box-shadow:0 0 0 1px rgba(0,240,255,.25) inset}
.wpick:hover{border-color:rgba(0,240,255,.5)}
.wkeys{font-family:var(--font);font-size:11px;color:var(--mut);margin-top:2px}
.hud-spray{display:none;position:absolute;left:50%;top:10px;transform:translateX(-50%);background:rgba(7,8,13,.62);border:1px solid var(--line);border-radius:12px;padding:8px 18px;text-align:center}
.mode-spray .hud-spray{display:block}
.mode-spray .hud-tc,.mode-spray .hud-tr{display:none}
.sp-t{font-size:14px;text-transform:uppercase;letter-spacing:.08em;color:var(--c1)}.sp-t b{color:#fff}
.sp-row{display:flex;gap:18px;justify-content:center;margin-top:2px}
.sp-row span{display:block;font-family:var(--font);font-size:11px;color:var(--mut);text-transform:uppercase;letter-spacing:.06em}
.sp-row b{font-size:24px}
.sp-k{font-family:var(--font);font-size:11px;color:#cfd5e4;margin-top:2px}
.ranks li .rank-img{width:52px;height:52px}
.spray-card{display:none;position:absolute;left:16px;top:50%;transform:translateY(-50%);background:rgba(7,8,13,.9);border:1px solid var(--line);border-radius:12px}
.mode-spray .spray-card{display:block}
.lang-sw{display:inline-flex;gap:4px}
.card>.lang-sw{position:absolute;top:14px;right:14px}
.lang-sw button{appearance:none;cursor:pointer;font:600 12px var(--font);color:var(--mut);background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:7px;padding:4px 8px;min-width:34px}
.lang-sw button.on{color:#000;background:linear-gradient(90deg,var(--c1),var(--c2));border-color:transparent}
.lang-sw button:hover{color:#fff}
.lang-dd{position:relative;display:inline-flex;align-items:center;font:600 12px var(--font);color:#000;background:linear-gradient(90deg,var(--c1),var(--c2));border-radius:7px;padding:4px 9px;cursor:pointer;white-space:nowrap}
.lang-dd select{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;font:14px var(--font)}
.lang-dd select option{color:#000}

/* Leaderboard */
.menu-side{flex:1.3;min-width:400px}
.side-tabs{display:flex;gap:6px;margin:14px 0 10px}
.stab{appearance:none;flex:1;font:inherit;font-family:var(--display);text-transform:uppercase;letter-spacing:.04em;font-size:17px;color:var(--mut);background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:10px;padding:8px 10px;cursor:pointer}
.stab.on{color:#fff;border-color:rgba(0,240,255,.5);background:rgba(0,240,255,.08)}
.lb-period{display:flex;gap:6px;margin-bottom:8px}
.lbp{appearance:none;font:inherit;font-size:12px;font-weight:700;color:var(--mut);background:transparent;border:1px solid var(--line);border-radius:999px;padding:3px 10px;cursor:pointer}
.lbp.on{color:#000;background:var(--c1);border-color:var(--c1)}
/* leaderboard written inside the whiteboard of vilov's transparent chicken cutout (white area x 38.3-97.5 %, y 10.9-84.7 %; rifle enters below ~70 %) */
.lb-art{position:relative;line-height:0;container-type:inline-size;filter:drop-shadow(0 10px 18px rgba(0,0,0,.45))}
.lb-art>img{width:100%;height:auto;display:block}
.lb-white{position:absolute;left:40%;top:13%;width:56%;height:56%;line-height:1.1;color:#14204a;font-family:'Caveat','Segoe Print','Comic Sans MS','Klee One','Yuji Syuku','HGMaruGothicMPRO','Hiragino Maru Gothic ProN','Kaiti SC','STKaiti','KaiTi','Hiragino Sans','Yu Gothic UI','Meiryo','PingFang SC','Microsoft YaHei','Noto Sans CJK SC','Noto Sans CJK JP',cursive;font-weight:700;display:flex;flex-direction:column}
.lb-head{font-size:clamp(13px,5.2cqw,26px);line-height:1;color:#c4161c;text-align:center;letter-spacing:.04em;margin-bottom:.15em}
.lb{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:0;font-size:clamp(9px,3.05cqw,16px);line-height:1.08;flex:1}
.lb li{display:grid;grid-template-columns:1.4em 1.35em 2.15em minmax(0,1fr) auto auto auto auto;align-items:center;gap:.28em;white-space:nowrap;padding:.02em .2em;border-bottom:1px dashed rgba(20,32,74,.14)}
.lb li:last-child{border-bottom:0}
.lb li.me{background:rgba(0,170,255,.16);border-radius:4px}
.lb li.msg{display:block;text-align:center;padding:1.6em .4em;font-size:1.25em;color:#334;border:0}
.lb .p{text-align:right;color:#14204a}
.lb li:nth-child(1) .p{color:#c4161c}.lb li:nth-child(2) .p{color:#1d58c9}.lb li:nth-child(3) .p{color:#1a7f3b}
.lb .n{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lb .ri{width:2.15em;height:2.15em;margin:-.45em 0;object-fit:contain;display:block;position:relative;z-index:1}.lb .ri.top{filter:drop-shadow(0 0 2px rgba(255,190,60,.8))}
.lb .w{font:800 .58em/1 Inter,system-ui,sans-serif;letter-spacing:.02em;color:#7a2a12;border:1.5px solid rgba(122,42,18,.55);border-radius:3px;padding:.18em .3em;white-space:nowrap}
.lb .w:empty{display:none}.lb .w-m4a4{color:#1d4f9a;border-color:rgba(29,79,154,.55)}.lb .w-m4a1s{color:#2f5d3a;border-color:rgba(47,93,58,.55)}
.lb .l{color:#1d58c9}.lb .s{font-variant-numeric:tabular-nums}.lb .h{color:#1a7f3b;min-width:2em;text-align:right;font-size:.82em}
.flag{font-size:1.05em;line-height:1;font-family:'Segoe UI Emoji','Apple Color Emoji','Noto Color Emoji',sans-serif}
.flag.code{font-family:'Inter',sans-serif;font-size:.62em;font-weight:800;border:1.5px solid currentColor;border-radius:3px;padding:1px 2px;color:#14204a;text-align:center}
.submit-box{margin:14px auto 4px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.03);max-width:560px;text-align:left}
.sb-title{font-weight:800;margin-bottom:8px;color:#fff}
.sb-row{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}
.sb-row label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--mut)}
.sb-row input,.sb-row select{background:#0d1020;border:1px solid rgba(255,255,255,.15);color:#fff;border-radius:8px;padding:9px 10px;font:inherit;font-size:15px}
.sb-row input{width:150px}.sb-row select{width:170px}
.sb-msg{min-height:1.3em;margin-top:8px;font-size:14px;font-weight:700}
.sb-msg.ok{color:#5dffa8}.sb-msg.err{color:#ff7b7b}
@media (max-width:860px){.menu-side{min-width:0}}

.privacy-note{margin:.45em 0 0;font-size:11.5px;line-height:1.35;color:rgba(220,228,255,.62);text-align:center}
.privacy-note::before{content:'🔒 '}

/* ---------- Touch mode (phones / tablets): html.mobile is set in main.js ---------- */
.m-only{display:none!important}
html.mobile .pc-only{display:none!important}
html.mobile .m-only{display:revert!important}
html.mobile label.row.m-only{display:flex!important}
html.mobile,html.mobile body{touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;overscroll-behavior:none}
html.mobile input,html.mobile select{-webkit-user-select:auto;user-select:auto;touch-action:manipulation}
html.mobile .screen{padding:max(6px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) 6px max(8px,env(safe-area-inset-left));align-items:flex-start;overflow:auto;touch-action:pan-y}
html.mobile .screen>*{zoom:var(--uiz,1);margin:auto}
html.mobile .menu-wrap{flex-direction:row}
html.mobile .menu-side{min-width:0}
html.mobile .modal{max-height:none}
html.mobile #hud{zoom:var(--hudz,1)}
html.mobile .hud-title,html.mobile .wkeys,html.mobile .hud-sens#h-sens{display:none}
html.mobile .hud-tl{left:78px;padding:4px 10px;border:0;background:none}
html.mobile .hud-br{right:auto;left:50%;transform:translateX(-50%);bottom:8px;text-align:center}
html.mobile .clicklock{display:none}
#touch{position:absolute;inset:0;z-index:5}
#t-look{position:absolute;inset:0;touch-action:none}
#touch button{appearance:none;-webkit-tap-highlight-color:transparent;touch-action:none;font-family:var(--display);color:#fff;cursor:pointer}
#t-fire{position:absolute;right:max(22px,env(safe-area-inset-right));bottom:22px;width:96px;height:96px;border-radius:50%;border:3px solid rgba(255,255,255,.75);background:radial-gradient(circle at 40% 35%,rgba(255,80,80,.55),rgba(160,10,20,.55));display:flex;align-items:center;justify-content:center;box-shadow:0 4px 18px rgba(0,0,0,.45)}
#t-fire.on{transform:scale(.93);background:radial-gradient(circle at 40% 35%,rgba(255,120,120,.8),rgba(200,20,30,.8))}
.t-wpn{position:absolute;right:max(18px,env(safe-area-inset-right));bottom:132px;display:flex;flex-direction:column;gap:6px}
.t-wpn button{width:64px;height:38px;border-radius:10px;border:1px solid rgba(255,255,255,.35);background:rgba(7,8,13,.55);font-size:16px;font-weight:700;line-height:1;display:flex;flex-direction:column;align-items:center;justify-content:center}
.t-wpn button small{font:600 9px var(--font);color:#cfd5e4;margin-top:2px}
#t-pause{position:absolute;left:max(12px,env(safe-area-inset-left));top:10px;width:50px;height:44px;border-radius:12px;border:1px solid rgba(255,255,255,.35);background:rgba(7,8,13,.55);display:flex;gap:7px;align-items:center;justify-content:center}
#t-pause i{display:block;width:6px;height:18px;border-radius:2px;background:#fff}
#rotate{display:none}
@media (orientation:portrait){html.mobile #rotate{display:flex;position:fixed;inset:0;z-index:50;align-items:center;justify-content:center;text-align:center;background:#07080d;color:var(--txt);font:600 18px var(--font);padding:24px}
  html.mobile #rotate .rot-ico{font-size:64px;display:inline-block;animation:rot 2.2s ease-in-out infinite}}
@keyframes rot{0%,25%{transform:rotate(0)}55%,100%{transform:rotate(-90deg)}}
.lb-dev{margin-left:auto;display:inline-flex;gap:0}
.lbd{appearance:none;font:inherit;font-size:12px;font-weight:700;color:var(--mut);background:transparent;border:1px solid var(--line);padding:3px 10px;cursor:pointer}
.lbd:first-child{border-radius:999px 0 0 999px}.lbd:last-child{border-radius:0 999px 999px 0;border-left:0}
.lbd.on{color:#000;background:var(--c2);border-color:var(--c2)}
.lb-tag{font:800 .42em 'Inter',sans-serif;color:#1a7f3b;border:1.5px solid currentColor;border-radius:4px;padding:0 4px;vertical-align:middle;letter-spacing:.04em}
a.home-logo{cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;border-radius:10px}
a.home-logo:focus-visible{outline:2px solid var(--cyan,#00f0ff);outline-offset:4px}
.menu-main{position:relative}
@media (max-height:520px){html.mobile .menu-main .logo-mark{float:left;width:96px;margin:-6px 6px 0 -8px;padding:6px 8px;box-sizing:content-box}html.mobile .menu-main h1{margin-top:4px}html.mobile .menu-main .lead{clear:both}}
html.mobile .mode-spray .spray-card{display:none;width:200px;height:auto;left:10px;top:auto;bottom:10px;transform:none}
html.mobile .mode-spray .spray-card.has{display:block}
/* forced landscape (rotation lock / iOS): #app rotated 90° clockwise to fill the portrait screen */
html.forcerot #app{inset:auto;top:0;left:100vw;width:100vh;height:100vw;transform-origin:0 0;transform:rotate(90deg)}
@supports (height:100dvh){html.forcerot #app{left:100dvw;width:100dvh;height:100dvw}}
html.forcerot body{overflow:hidden}
html.forcerot #rotate{display:none!important}
.fr-only{display:none!important}
html.forcerot .fr-only{display:revert!important}
html.forcerot label.row.fr-only{display:flex!important}
#rotate .btn{margin-top:18px;font-size:18px;padding:14px 26px}
#rotate .small{margin-top:12px;max-width:320px;margin-inline:auto}
html.forcerot .screen{touch-action:pan-x pan-y}
/* game over on phones: two columns (rank | stats + submit + buttons) so it fits short landscape screens without scrolling */
html.mobile #over .over{width:min(900px,100%);display:grid;grid-template-columns:minmax(200px,.8fr) 1.4fr;gap:4px 22px;align-items:center;padding:16px 20px}
html.mobile #over .rank-big .rank-img{width:118px;height:118px}
html.mobile #over .card.top-rank .rank-big .rank-img,html.mobile #over .over.top-rank .rank-big .rank-img{width:130px;height:130px}
html.mobile #over .over-reason{font-size:22px}
html.mobile #over .rank-name{font-size:24px}
html.mobile #over .stats{margin:0 0 4px;gap:8px}
html.mobile #over .stats b{font-size:20px}
html.mobile #over .pbline{margin-top:4px}
html.mobile #over .submit-box{margin:8px 0 4px;padding:8px 12px;max-width:none}
html.mobile #over .submit-box .privacy-note{margin:4px 0 0;font-size:11px}
html.mobile #over .sb-row input{width:140px}html.mobile #over .sb-row select{width:150px}
html.mobile #over .over-r>.btn-row{position:sticky;bottom:0;margin-top:8px;padding-top:4px;background:var(--card)}
#btn-touch{margin-top:10px}
#btn-touch b{display:inline}
html.mobile #btn-touch b.m-only{display:inline!important}
#touch-offer{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:60;font-size:18px;padding:14px 26px}
/* touch: bigger hit areas, FIRE size from settings */
#t-fire{width:var(--fire,104px);height:var(--fire,104px)}
.t-wpn{bottom:calc(var(--fire,104px) + 34px)}
.t-wpn button{width:72px;height:44px;font-size:17px}
#t-pause{width:58px;height:52px}
html.mobile .btn{min-height:44px}
html.mobile .lbp,html.mobile .lbd{padding:6px 12px}
html.mobile #settings input[type=checkbox]{width:22px;height:22px}
html.mobile #settings input[type=range]{min-height:30px}
/* get-ready countdown 5..1, GO */
.countdown{position:absolute;left:50%;top:42%;transform:translate(-50%,-50%);font-family:var(--display);font-weight:700;font-size:170px;line-height:1;color:#fff;text-shadow:0 0 30px rgba(0,240,255,.65),0 6px 20px rgba(0,0,0,.6);pointer-events:none}
.countdown.tick{animation:cdTick 1s ease-out both}
.countdown.go{font-size:120px;color:#00f0ff;text-shadow:0 0 24px rgba(176,0,255,.85),0 0 6px rgba(0,240,255,.8),0 6px 20px rgba(0,0,0,.6);animation:cdGo .9s ease-out both}
@keyframes cdTick{0%{opacity:0;transform:translate(-50%,-50%) scale(1.8)}18%{opacity:1;transform:translate(-50%,-50%) scale(1)}100%{opacity:.85;transform:translate(-50%,-50%) scale(.9)}}
@keyframes cdGo{0%{opacity:0;transform:translate(-50%,-50%) scale(.5)}25%{opacity:1;transform:translate(-50%,-50%) scale(1.12)}75%{opacity:1}100%{opacity:0;transform:translate(-50%,-50%) scale(1.4)}}
@media (prefers-reduced-motion:reduce){.countdown.tick,.countdown.go{animation:none}}

/* practice (unranked) mode */
.hud-prac{position:absolute;left:50%;top:var(--prac-top,92px);transform:translateX(-50%);background:#ffb020;color:#111;font-family:var(--display);font-size:14px;letter-spacing:.06em;text-transform:uppercase;padding:3px 12px;border-radius:8px;white-space:nowrap;z-index:3}
html.mobile .hud-prac{--prac-top:auto;top:auto;bottom:8px}
.lvl-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin:12px 0}
.lvl-grid button{min-height:48px;font-size:18px}
.toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);z-index:90;background:#00f0ff;color:#071018;font-weight:800;padding:10px 18px;border-radius:10px;box-shadow:0 6px 24px rgba(0,0,0,.4)}
.share-pop{position:fixed;inset:0;z-index:95;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.6)}
.share-pop.hidden{display:none}
.share-pop .card{max-width:min(92vw,420px);padding:18px}
.share-pop input{width:100%;font:inherit;font-size:16px;padding:10px;margin:10px 0;border-radius:8px;border:1px solid var(--line);background:#0b0d14;color:#fff;user-select:all;-webkit-user-select:all}
#rotate #rot-share{margin-top:10px;font-size:15px;padding:10px 18px}
[data-share]{touch-action:manipulation}

/* v35 desktop HUD declutter: no title / sens line while playing (shown in the menu + settings), FPS counter stays */
html:not(.mobile) #hud .hud-title,html:not(.mobile) #hud #h-sens{display:none}
html:not(.mobile) #hud .hud-tl{background:none;border:0;padding:4px 6px;text-shadow:0 1px 3px #000}

/* v37 free mode + Vistu krogs */
.hud-free{position:absolute;left:16px;bottom:16px;max-width:min(560px,52vw);font:600 14px/1.5 var(--font);color:#fff;letter-spacing:.01em;text-shadow:none;background:rgba(8,10,16,.62);border:1px solid rgba(255,207,110,.45);border-radius:10px;padding:7px 12px}
.hud-free.hidden{display:none}
.hud-free kbd{display:inline-block;min-width:1.6em;text-align:center;font:800 13px var(--font);color:#1a1206;background:#ffcf6e;border-radius:5px;padding:1px 6px;margin:0 2px;box-shadow:0 2px 0 #b8892e}
.hud-near{position:absolute;left:50%;top:62%;transform:translateX(-50%);font:700 16px var(--font);color:#ffe2a8;background:rgba(10,8,6,.55);border:1px solid rgba(255,200,120,.35);padding:7px 14px;border-radius:9px;white-space:nowrap}
html.mobile .hud-free,html.mobile .hud-near{display:none}
html.in-tav .hud-tc,html.in-tav .hud-tr,html.in-tav .hud-br,html.in-tav #feed,html.in-tav #banner{display:none!important}
html.tav-seated #xh{display:none}
#tv-ov{position:absolute;inset:0;z-index:4;pointer-events:none}
#tv-ov.hidden{display:none}
#tv-ov .tv-frame{position:absolute;background:#000;pointer-events:auto;box-shadow:0 0 40px rgba(120,170,255,.25)}
#tv-ov .tv-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
#tv-ov .tv-bar{position:absolute;display:flex;flex-wrap:wrap;gap:6px;align-items:center;justify-content:center;pointer-events:auto;font:600 13px var(--font);color:var(--txt)}
#tv-ov .tv-live{color:#ff5a5a;font-weight:800;margin-right:4px}
#tv-ov .tv-ch.on{outline:2px solid #ffcf6e;background:rgba(255,190,80,.25)}
#tv-ov .tv-note{flex-basis:100%;text-align:center;opacity:.6;font-size:11px}

/* v40 menu: Kuldīga on the Latvia map ("dark matter" mood). SVG + CSS only, no images, no JS. */
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.loc{position:relative;margin:0 auto 8px;max-width:520px;padding:8px 12px 10px;border-radius:16px;overflow:hidden;isolation:isolate;
  background:radial-gradient(ellipse at 22% 45%,rgba(120,60,255,.28),transparent 55%),radial-gradient(ellipse at 85% 80%,rgba(0,220,255,.14),transparent 60%),linear-gradient(180deg,#0b0a1f,#100a26 60%,#090b1c);
  border:1px solid rgba(160,110,255,.28);box-shadow:inset 0 0 40px rgba(110,50,255,.18),0 0 26px rgba(120,60,255,.12)}
.loc::before,.loc::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background-repeat:no-repeat}
.loc::before{background-image:radial-gradient(1.2px 1.2px at 8% 18%,#fff,transparent),radial-gradient(1px 1px at 23% 72%,#cfe,transparent),radial-gradient(1.4px 1.4px at 41% 12%,#fff,transparent),radial-gradient(1px 1px at 57% 84%,#bdf,transparent),radial-gradient(1.2px 1.2px at 69% 30%,#fff,transparent),radial-gradient(1px 1px at 83% 14%,#e8d9ff,transparent),radial-gradient(1.3px 1.3px at 92% 62%,#fff,transparent),radial-gradient(1px 1px at 33% 40%,#9ef,transparent),radial-gradient(1px 1px at 76% 92%,#fff,transparent),radial-gradient(1.1px 1.1px at 14% 90%,#d9c7ff,transparent);opacity:.75}
.loc::after{background-image:radial-gradient(1px 1px at 17% 33%,#fff,transparent),radial-gradient(1.3px 1.3px at 48% 58%,#bff,transparent),radial-gradient(1px 1px at 63% 8%,#fff,transparent),radial-gradient(1.2px 1.2px at 88% 40%,#e4d4ff,transparent),radial-gradient(1px 1px at 4% 60%,#fff,transparent),radial-gradient(1px 1px at 96% 88%,#9ef,transparent);animation:loc-tw 5.5s ease-in-out infinite alternate}
@keyframes loc-tw{from{opacity:.15}to{opacity:.9}}
.loc-map{display:block;width:100%;height:auto;max-height:178px;overflow:visible}
.loc-map .lv{fill:url(#lvF);stroke:url(#lvS);stroke-width:1.7;stroke-linejoin:round}
.loc-map .lv-glow{fill:none;stroke:#8a4dff;stroke-width:5;opacity:.5}
.loc-map .drop{fill:#0d0b24;stroke:#6ff6ff;stroke-width:1.6;filter:drop-shadow(0 0 4px #4ff0ff) drop-shadow(0 0 9px #a24dff)}
.loc-map .eye{fill:#dffcff;filter:drop-shadow(0 0 3px #5ff4ff)}
.loc-map .halo{opacity:.55;transform-box:fill-box;transform-origin:center;animation:loc-pulse 3.2s ease-in-out infinite}
.loc-map .drop,.loc-map .eye{transform-box:view-box;animation:loc-float 3.2s ease-in-out infinite}
.loc-map .rip{fill:none;stroke:#62f2ff;stroke-width:1.2;opacity:0;transform-box:fill-box;transform-origin:center;animation:loc-rip 3.6s ease-out infinite}
.loc-map .rip.r2{stroke:#b06bff;animation-delay:1.8s}
@keyframes loc-pulse{0%,100%{opacity:.35;transform:scale(.85)}50%{opacity:.75;transform:scale(1.12)}}
@keyframes loc-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}
@keyframes loc-rip{0%{opacity:.7;transform:scale(.4)}100%{opacity:0;transform:scale(4.2)}}
.loc-lbl{font:700 21px var(--display,Oswald,sans-serif);letter-spacing:.06em;fill:#eafcff;paint-order:stroke;stroke:#140a2e;stroke-width:3px;filter:drop-shadow(0 0 5px rgba(95,244,255,.7))}
.loc-sub{font:600 10px var(--font,Inter,sans-serif);letter-spacing:.08em;fill:#a99be0;opacity:.85}
.lead-short{color:#c9cfe0;font-size:14px;line-height:1.45;max-width:520px;margin:0 auto 14px}
@media (prefers-reduced-motion:reduce){.loc::after,.loc-map .halo,.loc-map .drop,.loc-map .eye,.loc-map .rip{animation:none}}
html.mobile .loc{padding:6px 8px 8px;margin-bottom:6px}html.mobile .loc-map{max-height:120px}html.mobile html.mobile .lead-short{font-size:12.5px;margin-bottom:8px}
@media (max-height:520px){html.mobile .menu-main .loc{clear:none}}
html.mobile .mv-home .loc{margin-top:20px}html.mobile .mv-home .loc-map{max-height:210px}
.home-row{margin-top:14px}

/* FA Village Training Ground entry (/aim/?mode=ranked&from=village): ranked only, desktop only */
.village-mode #btn-prac, .village-mode #o-prac, .village-mode #o-cont, .village-mode #o-ranked, .village-mode #btn-touch, .village-mode #touch-offer { display: none !important; }
.village-mode #settings label:has(#s-touch) { display: none !important; }
.village-touch #app { display: none; }
.village-desk { position: fixed; inset: 0; display: grid; place-items: center; padding: 20px; z-index: 50;
  background: radial-gradient(ellipse at 50% 30%, rgba(60, 40, 120, .45), rgba(7, 8, 15, 1) 70%), #07080f; }
.village-desk .card { max-width: 440px; text-align: center; }
.village-desk img { width: 200px; height: auto; display: block; margin: 0 auto 6px; }
.village-desk .vd-ico { font-size: 42px; margin: 6px 0; }
.village-desk h1 { font-size: 24px; line-height: 1.25; margin: 6px 0 10px; }
.village-desk p { line-height: 1.5; margin: 0 0 18px; }
.village-desk .btn { display: inline-block; text-decoration: none; }