/* STRIKE ARENA — competitive FPS interface. Dark, dense, high-contrast. */
:root{
  --bg:#0b0e12; --bg2:#11161c; --bg3:#171e26; --line:#232c37;
  --fg:#e6edf5; --dim:#8494a6; --accent:#f0a020; --accent2:#4a9fe0;
  --t1:#4a9fe0; --t2:#e0a54a; --good:#48d18a; --bad:#e05555;
  --r-consumer:#b0c3d9; --r-industrial:#5e98d9; --r-milspec:#4b69ff;
  --r-restricted:#8847ff; --r-classified:#d32ce6; --r-covert:#eb4b4b; --r-exotic:#ffd700;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;background:var(--bg);color:var(--fg);font-family:Rajdhani,system-ui,sans-serif;overflow:hidden}
body{-webkit-font-smoothing:antialiased}
.hidden{display:none!important}
button{font-family:inherit;color:inherit;background:none;border:none;cursor:pointer}
input,select{font-family:inherit;color:var(--fg);background:var(--bg3);border:1px solid var(--line);padding:8px 10px;border-radius:3px;outline:none}
input:focus,select:focus{border-color:var(--accent2)}
canvas#game{position:fixed;inset:0;width:100%;height:100%;display:block}

/* ---------------------------------------------------------------- login -- */
.loginWrap{height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:34px;
  background:radial-gradient(circle at 50% 30%,#1b2530 0%,#0b0e12 65%)}
.brand h1{font-family:'Barlow Condensed',sans-serif;font-size:76px;letter-spacing:6px;font-weight:700}
.brand h1 span{color:var(--accent)}
.brand p{text-align:center;letter-spacing:8px;color:var(--dim);font-size:13px;margin-top:-6px}
.loginCard{width:380px;background:var(--bg2);border:1px solid var(--line);padding:26px;display:flex;flex-direction:column;gap:14px}
.loginCard .tabs{display:flex;gap:2px;margin-bottom:6px}
.loginCard .tabs button{flex:1;padding:10px;background:var(--bg3);color:var(--dim);font-weight:600;letter-spacing:1px;font-size:13px}
.loginCard .tabs button.on{background:var(--accent);color:#000}
.loginCard label{display:flex;flex-direction:column;gap:6px;font-size:12px;letter-spacing:2px;color:var(--dim)}
.primary{background:var(--accent);color:#000;font-weight:700;letter-spacing:2px;padding:12px;font-size:14px}
.primary:hover{filter:brightness(1.12)}
.primary.big{padding:18px;font-size:18px;margin-top:auto}
.ghost{background:var(--bg3);border:1px solid var(--line);padding:10px;letter-spacing:2px;font-size:13px;color:var(--dim)}
.ghost:hover{color:var(--fg);border-color:var(--accent2)}
.ghost.small{padding:6px 12px;font-size:11px}
.danger{background:#3a1a1a;border:1px solid #5a2020;color:#e08080}
.err{color:var(--bad);font-size:13px;min-height:18px}

/* ----------------------------------------------------------------- menu -- */
.menuRoot{height:100vh;display:flex;flex-direction:column;background:linear-gradient(180deg,#0d1218,#0b0e12)}
.topBar{display:flex;align-items:center;gap:28px;padding:0 26px;height:64px;border-bottom:1px solid var(--line);background:#0e1319}
.logo{font-family:'Barlow Condensed',sans-serif;font-size:26px;letter-spacing:3px;font-weight:700}
.logo span{color:var(--accent)}
.mainNav{display:flex;gap:4px;flex:1}
.mainNav button{padding:10px 15px;font-size:13px;letter-spacing:2px;color:var(--dim);font-weight:600;border-bottom:2px solid transparent}
.mainNav button:hover{color:var(--fg)}
.mainNav button.on{color:var(--accent);border-bottom-color:var(--accent)}
.acct{display:flex;align-items:center;gap:14px}
.acct .lvl{display:flex;align-items:center;gap:8px}
.acct .lvl b{background:var(--accent);color:#000;padding:2px 8px;font-size:13px}
.xpbar{display:block;width:80px;height:5px;background:var(--bg3);overflow:hidden}
.xpbar i{display:block;height:100%;background:var(--accent2)}
.xpbar.big{width:220px;height:8px}
.who{display:flex;flex-direction:column;line-height:1.1}
.who .nick{font-weight:700}
.who .cred{color:var(--accent);font-size:12px}
main#panel{flex:1;overflow-y:auto;padding:22px 26px}

/* ----------------------------------------------------------------- play -- */
.playPanel{display:grid;grid-template-columns:1fr 1fr 1fr;gap:22px;height:100%}
.playPanel .col{display:flex;flex-direction:column;gap:10px;min-height:0}
.playPanel h3{font-size:12px;letter-spacing:3px;color:var(--dim);margin-top:8px}
.modeCard{text-align:left;padding:13px 15px;background:var(--bg2);border:1px solid var(--line);border-left:3px solid transparent;display:flex;flex-direction:column;gap:3px}
.modeCard.on{border-left-color:var(--accent);background:var(--bg3)}
.modeCard .mt{font-weight:700;letter-spacing:1px}
.modeCard .md{font-size:12px;color:var(--dim)}
.modeList{display:flex;flex-direction:column;gap:6px}
.mapList{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.mapCard{background:var(--bg2);border:1px solid var(--line);padding:6px;display:flex;flex-direction:column;gap:5px;font-size:13px;font-weight:600}
.mapCard.on{border-color:var(--accent)}
.mapThumb{height:64px;border-radius:2px}
.mapThumb.sky-desert{background:linear-gradient(160deg,#c9a86a,#6b5535)}
.mapThumb.sky-dusk{background:linear-gradient(160deg,#c98a5a,#40305a)}
.mapThumb.sky-overcast{background:linear-gradient(160deg,#98a4b2,#4a545e)}
.mapThumb.sky-day{background:linear-gradient(160deg,#7ab0e0,#3a5a7a)}
.hint{font-size:12px;color:var(--dim)}
.serverList{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:4px;min-height:120px}
.serverRow{display:grid;grid-template-columns:1fr 1fr auto auto;gap:10px;padding:10px;background:var(--bg2);border:1px solid var(--line);font-size:13px;text-align:left}
.serverRow:hover{border-color:var(--accent2)}
.empty{color:var(--dim);padding:16px;text-align:center;font-size:14px}
.empty.big{padding:60px;font-size:18px;display:flex;flex-direction:column;gap:16px;align-items:center}

/* ------------------------------------------------------- inventory/store -- */
.filters{display:flex;gap:8px;align-items:center;margin-bottom:14px;flex-wrap:wrap}
.filters input{min-width:220px}
.filters .count{margin-left:auto;color:var(--dim);font-size:13px}
.itemGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:10px}
.itemGrid.small{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));max-height:56vh;overflow-y:auto}
.itemCard{background:var(--bg2);border:1px solid var(--line);border-bottom:3px solid var(--line);padding:9px;text-align:left;position:relative;display:flex;flex-direction:column;gap:4px}
.itemCard:hover{background:var(--bg3);transform:translateY(-2px);transition:.12s}
.itemCard .thumb{height:74px;border-radius:2px;background:linear-gradient(125deg,var(--c1),var(--c2));position:relative;overflow:hidden}
.itemCard .thumb:after{content:'';position:absolute;inset:0;background:
  repeating-linear-gradient(115deg,rgba(255,255,255,.09) 0 8px,transparent 8px 22px)}
.itemCard .nm{font-weight:600;font-size:13px;line-height:1.15}
.itemCard .sub{font-size:11px;color:var(--dim);text-transform:uppercase;letter-spacing:1px}
.itemCard .val{color:var(--accent);font-size:13px;font-weight:700}
.itemCard .eqTag{position:absolute;top:6px;right:6px;background:var(--good);color:#000;font-size:9px;padding:2px 5px;letter-spacing:1px}
.itemCard.default{align-items:center;justify-content:center;min-height:130px;color:var(--dim)}
.r-consumer{border-bottom-color:var(--r-consumer)} .r-industrial{border-bottom-color:var(--r-industrial)}
.r-milspec{border-bottom-color:var(--r-milspec)} .r-restricted{border-bottom-color:var(--r-restricted)}
.r-classified{border-bottom-color:var(--r-classified)} .r-covert{border-bottom-color:var(--r-covert)}
.r-exotic{border-bottom-color:var(--r-exotic)}

.modal{position:fixed;inset:0;background:rgba(4,6,9,.82);display:flex;align-items:center;justify-content:center;z-index:60}
.modalCard{background:var(--bg2);border:1px solid var(--line);padding:24px;width:440px;position:relative;display:flex;flex-direction:column;gap:12px}
.modalCard.wide{width:min(880px,92vw)}
.modalCard .close{position:absolute;top:10px;right:14px;font-size:24px;color:var(--dim)}
.preview3d{height:180px;background:linear-gradient(125deg,var(--c1),var(--c2));border-radius:3px;position:relative;overflow:hidden}
.preview3d:after{content:'';position:absolute;inset:0;background:
  repeating-linear-gradient(115deg,rgba(255,255,255,.10) 0 10px,transparent 10px 26px),
  radial-gradient(circle at 30% 25%,rgba(255,255,255,.25),transparent 55%)}
.meta{display:flex;gap:10px;align-items:center;font-size:12px;color:var(--dim)}
.meta .rar{color:#000;padding:2px 7px;font-weight:700;letter-spacing:1px}
.meta .val{margin-left:auto;color:var(--accent);font-weight:700;font-size:14px}
.actions{display:flex;gap:8px}
.actions button{flex:1}
.wearSel{display:flex;flex-direction:column;gap:6px;font-size:11px;letter-spacing:2px;color:var(--dim)}
table.hist{width:100%;border-collapse:collapse;font-size:13px}
table.hist th{text-align:left;color:var(--dim);font-size:11px;letter-spacing:2px;padding:8px;border-bottom:1px solid var(--line)}
table.hist td{padding:8px;border-bottom:1px solid #1a212a}
table.hist tr.win .res{color:var(--good)} table.hist tr.loss .res{color:var(--bad)}
.up{color:var(--good)} .down{color:var(--bad)}

/* -------------------------------------------------------------- loadout -- */
.loadoutPanel{display:grid;grid-template-columns:300px 1fr;gap:22px}
.agentRow{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.agentCard{background:var(--bg2);border:1px solid var(--line);padding:7px;display:flex;flex-direction:column;gap:4px;font-size:12px}
.agentCard.on{border-color:var(--accent)}
.agentArt{height:96px;border-radius:2px;background:linear-gradient(160deg,#2c3947,#151b22)}
.agentArt.r-covert{background:linear-gradient(160deg,#5a2020,#1a1010)}
.agentArt.r-classified{background:linear-gradient(160deg,#4a2050,#150a18)}
.agentArt.r-restricted{background:linear-gradient(160deg,#33255a,#0f0c18)}
.agentCard .an{font-weight:700} .agentCard .af{color:var(--dim);font-size:10px;letter-spacing:2px}
.catBlock{margin-bottom:16px}
.catBlock h4{font-size:11px;letter-spacing:3px;color:var(--dim);margin-bottom:6px}
.slotGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:6px}
.loadoutSlot{background:var(--bg2);border:1px solid var(--line);padding:9px;text-align:left;display:flex;flex-direction:column;gap:2px}
.loadoutSlot:hover{border-color:var(--accent2)}
.loadoutSlot .sl{font-size:10px;letter-spacing:2px;color:var(--dim)}
.loadoutSlot .it{font-size:13px;font-weight:600}

/* -------------------------------------------------------------- profile -- */
.profHead{display:flex;gap:20px;align-items:center;margin-bottom:22px}
.avatar{width:96px;height:96px;background:linear-gradient(140deg,#2a3947,#131a22);display:flex;align-items:center;justify-content:center;
  font-size:34px;font-weight:700;border:1px solid var(--line)}
.pi h2{font-family:'Barlow Condensed',sans-serif;font-size:38px;letter-spacing:2px}
.lvlRow{display:flex;align-items:center;gap:12px;font-size:12px;letter-spacing:2px;color:var(--dim);margin:6px 0}
.credits{color:var(--accent);font-weight:700}
.statGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;margin-bottom:22px}
.statBox{background:var(--bg2);border:1px solid var(--line);padding:12px;display:flex;flex-direction:column;gap:3px}
.statBox span{font-size:10px;letter-spacing:2px;color:var(--dim)}
.statBox b{font-size:24px;font-family:'Barlow Condensed',sans-serif}
.achRow{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:8px}
.ach{background:var(--bg2);border:1px solid var(--line);border-left:3px solid var(--accent);padding:10px;display:flex;flex-direction:column}
.ach span{font-size:11px;color:var(--dim)}

/* -------------------------------------------------------------- friends -- */
.addRow{display:flex;gap:8px;align-items:center;margin-bottom:16px}
.friendRow{display:flex;align-items:center;gap:12px;padding:11px;background:var(--bg2);border:1px solid var(--line);margin-bottom:5px}
.friendRow .dot{width:8px;height:8px;border-radius:50%;background:#40484f}
.friendRow.on .dot{background:var(--good)}
.friendRow .fn{font-weight:700;min-width:150px}
.friendRow .fl{color:var(--dim);font-size:12px}
.friendRow .fs{color:var(--dim);font-size:12px;margin-left:auto}

/* ----------------------------------------------------------------- news -- */
.newsPanel{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:12px}
.newsCard{background:var(--bg2);border:1px solid var(--line);padding:18px;display:flex;flex-direction:column;gap:8px}
.newsCard .tag{align-self:flex-start;background:var(--accent);color:#000;font-size:10px;letter-spacing:2px;padding:2px 7px;font-weight:700}
.newsCard h3{font-size:19px}
.newsCard time{color:var(--dim);font-size:12px}
.newsCard p{color:#b8c4d0;font-size:14px;line-height:1.5}

/* ------------------------------------------------------------- settings -- */
.setPanel{display:flex;flex-direction:column;gap:14px;max-width:900px}
.setTabs{display:flex;gap:3px;border-bottom:1px solid var(--line)}
.setTabs button{padding:10px 16px;font-size:12px;letter-spacing:2px;color:var(--dim);font-weight:600}
.setTabs button.on{color:var(--accent);border-bottom:2px solid var(--accent)}
.setRow{display:grid;grid-template-columns:280px 1fr;gap:16px;align-items:center;padding:10px 0;border-bottom:1px solid #161d25}
.setRow label{display:flex;flex-direction:column;font-size:14px}
.setRow label em{font-style:normal;font-size:11px;color:var(--dim)}
.setRow input[type=range]{width:260px;vertical-align:middle}
.setRow output{display:inline-block;min-width:44px;color:var(--accent);font-weight:700}
.sw{position:relative;display:inline-block;width:44px;height:22px}
.sw input{display:none}
.sw i{position:absolute;inset:0;background:var(--bg3);border:1px solid var(--line);border-radius:12px;transition:.15s}
.sw i:before{content:'';position:absolute;width:16px;height:16px;left:2px;top:2px;background:var(--dim);border-radius:50%;transition:.15s}
.sw input:checked+i{background:#243a2c;border-color:var(--good)}
.sw input:checked+i:before{transform:translateX(22px);background:var(--good)}
.keyGrid{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.keyRow{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 10px;background:var(--bg2);border:1px solid var(--line)}
.keyBtn{background:var(--bg3);border:1px solid var(--line);padding:5px 12px;min-width:86px;font-weight:700;font-size:12px;letter-spacing:1px}
.keyBtn.listening{background:var(--accent);color:#000}
.chPreview{display:flex;justify-content:center;padding:10px}
.chPreview canvas{border:1px solid var(--line)}

/* -------------------------------------------------------------- loading -- */
#loading{position:fixed;inset:0;background:radial-gradient(circle at 50% 40%,#141c25,#07090c);display:flex;align-items:center;justify-content:center;z-index:80}
.loadInner{text-align:center;display:flex;flex-direction:column;gap:16px;align-items:center}
.loadLogo{font-family:'Barlow Condensed',sans-serif;font-size:54px;letter-spacing:6px;font-weight:700}
.loadLogo span{color:var(--accent)}
.loadBar{width:340px;height:3px;background:var(--bg3);overflow:hidden}
.loadBar i{display:block;height:100%;width:35%;background:var(--accent);animation:slide 1.1s infinite}
@keyframes slide{0%{transform:translateX(-100%)}100%{transform:translateX(340%)}}
#loadStatus{color:var(--dim);letter-spacing:2px;font-size:13px}
.tips{list-style:none;color:#5d6b7a;font-size:13px;max-width:460px;margin-top:20px}
.tips li{padding:3px 0}

/* ------------------------------------------------------------------ HUD -- */
#hud{position:fixed;inset:0;pointer-events:none;z-index:20;font-family:'Barlow Condensed',sans-serif}
#hud canvas#overlay{position:absolute;inset:0}
#flashOverlay{position:absolute;inset:0;background:#fff;opacity:0;transition:opacity .08s}
#bloodOverlay{position:absolute;inset:0;opacity:0;background:radial-gradient(ellipse at center,transparent 42%,rgba(150,10,10,.55) 100%);transition:opacity .25s}
#hudTop{position:absolute;top:12px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:16px}
.teamScore{display:flex;align-items:center;gap:10px;background:rgba(10,14,19,.78);padding:7px 16px;border:1px solid var(--line)}
.teamScore .sc{font-size:30px;font-weight:700;line-height:1}
.teamScore .nm{font-size:12px;letter-spacing:3px;color:var(--dim)}
.teamScore.t1 .sc{color:var(--t1)} .teamScore.t2 .sc{color:var(--t2)}
.clock{background:rgba(10,14,19,.86);padding:6px 20px;border:1px solid var(--line);text-align:center}
#roundTimer{font-size:30px;font-weight:700;line-height:1;letter-spacing:1px}
#roundTimer.danger{color:var(--bad)}
#phaseLabel{font-size:10px;letter-spacing:3px;color:var(--dim)}
#aliveRow{position:absolute;top:76px;left:50%;transform:translateX(-50%);display:flex;gap:44px}
#aliveA,#aliveB{display:flex;gap:5px}
#aliveRow i{width:11px;height:11px;background:var(--t1);display:block;transform:skewX(-14deg)}
#aliveRow i.t2{background:var(--t2)}
#aliveRow i.dead{background:#333b45}
#bombStatus{position:absolute;top:106px;left:50%;transform:translateX(-50%);background:rgba(60,12,12,.85);border:1px solid #7a2020;padding:5px 16px;text-align:center}
#bombStatus span{font-size:13px;letter-spacing:3px;color:#ffb0a0}
#bombBar{width:180px;height:3px;background:#3a1414;margin-top:4px}
#bombBar i{display:block;height:100%;background:var(--bad)}
#hudBottomLeft{position:absolute;left:26px;bottom:22px;display:flex;flex-direction:column;gap:8px}
.vitals{display:flex;gap:18px;align-items:center}
.stat{display:flex;align-items:center;gap:7px;font-size:36px;font-weight:700;line-height:1}
.stat svg{width:24px;height:24px;fill:currentColor;opacity:.85}
.stat.hp{color:#e8eef5} .stat.hp.low{color:var(--bad)} .stat.ar{color:var(--t1);font-size:26px}
#moneyRow{display:flex;gap:10px;align-items:baseline}
#moneyVal{font-size:24px;font-weight:700;color:var(--good)}
#moneyDelta{font-size:16px;opacity:0;transition:opacity .3s}
#moneyDelta.show{opacity:1} #moneyDelta.up{color:var(--good)} #moneyDelta.down{color:var(--bad)}
#nadeRow{display:flex;gap:6px}
.nade{width:16px;height:22px;background:#3d4a2a;border:1px solid #566334;border-radius:3px;opacity:.55}
.nade.active{opacity:1;box-shadow:0 0 0 2px var(--accent)}
.nade.n-flash{background:#8d9298} .nade.n-smoke{background:#4a5a48}
.nade.n-molotov,.nade.n-incendiary{background:#8a4a20}
#hudBottomRight{position:absolute;right:26px;bottom:22px;text-align:right}
#ammoBlock{display:flex;align-items:baseline;gap:6px;justify-content:flex-end}
#clipVal{font-size:44px;font-weight:700;line-height:1}
#reserveVal{font-size:20px;color:var(--dim)}
#weaponName{font-size:13px;letter-spacing:3px;color:var(--dim)}
#killfeed{position:absolute;top:14px;right:20px;display:flex;flex-direction:column;gap:4px;align-items:flex-end}
.kf{background:rgba(10,14,19,.75);padding:4px 10px;font-size:14px;display:flex;gap:8px;align-items:center;border-right:2px solid var(--line)}
.kf .p.t1{color:var(--t1)} .kf .p.t2{color:var(--t2)}
.kf .w{color:var(--dim);font-size:12px;letter-spacing:1px}
.kf .ast{color:#7d8894;font-size:12px}
#centerMsg{position:absolute;top:24%;left:50%;transform:translateX(-50%);font-size:32px;letter-spacing:4px;
  opacity:0;transition:opacity .25s;text-shadow:0 2px 12px rgba(0,0,0,.9);text-align:center}
#centerMsg.show{opacity:1}
#centerMsg.good{color:var(--good)} #centerMsg.bad{color:var(--bad)}
#centerMsg.alert{color:var(--accent)} #centerMsg.mvp{color:var(--r-exotic)}
#centerMsg.death{color:#c8d2dc;font-size:24px} #centerMsg.chat{font-size:18px;letter-spacing:1px}
#centerMsg.warn{color:var(--accent);font-size:22px}
#progressRing{position:absolute;top:56%;left:50%;transform:translate(-50%,-50%);width:120px;height:120px;text-align:center}
#progressRing svg{width:120px;height:120px;transform:rotate(-90deg)}
#progressRing circle{fill:none;stroke:#2a3340;stroke-width:5}
#progressRing #ringFill{stroke:var(--accent);stroke-linecap:round}
#ringLabel{display:block;margin-top:-72px;font-size:12px;letter-spacing:3px;color:var(--accent)}
#minimap{position:absolute;top:14px;left:16px;border:1px solid var(--line);background:rgba(8,11,15,.6)}
#netGraph{position:absolute;bottom:6px;right:12px;font-family:ui-monospace,monospace;font-size:11px;color:#7d8894;background:rgba(8,11,15,.6);padding:3px 8px}

/* -------------------------------------------------------------- buy menu -- */
#buyMenu{position:absolute;inset:0;background:rgba(6,9,13,.93);pointer-events:auto;display:flex;flex-direction:column;font-family:Rajdhani,sans-serif}
.buyHead{display:flex;align-items:center;gap:22px;padding:16px 30px;border-bottom:1px solid var(--line)}
.buyHead h2{font-family:'Barlow Condensed',sans-serif;letter-spacing:5px;font-size:26px}
.buyMoney{color:var(--good);font-size:26px;font-weight:700}
.buyHint{margin-left:auto;color:var(--dim);font-size:12px}
.buyBody{flex:1;display:grid;grid-template-columns:210px 1fr;min-height:0}
.buyCats{display:flex;flex-direction:column;border-right:1px solid var(--line);padding:12px 0}
.buyCats button{text-align:left;padding:13px 20px;color:var(--dim);letter-spacing:2px;font-weight:600;display:flex;gap:12px;align-items:center}
.buyCats button.on{color:var(--accent);background:rgba(240,160,32,.08);border-right:2px solid var(--accent)}
.buyCats .hk{background:var(--bg3);padding:1px 7px;font-size:11px;border:1px solid var(--line)}
.buyGrid{padding:18px 24px;overflow-y:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px;align-content:start}
.buyItem{background:var(--bg2);border:1px solid var(--line);padding:11px;text-align:left;position:relative;display:flex;flex-direction:column;gap:5px}
.buyItem:hover{border-color:var(--accent);background:var(--bg3)}
.buyItem.poor{opacity:.42}
.buyItem .hk{position:absolute;top:8px;right:9px;color:var(--dim);font-size:11px;border:1px solid var(--line);padding:0 5px}
.buyItem .ico{height:52px;background:linear-gradient(120deg,#2b333d,#161c23);border-radius:2px;position:relative}
.buyItem .ico:after{content:'';position:absolute;left:8%;right:12%;top:44%;height:9px;background:#39434f;border-radius:2px}
.buyItem .ico.pistols:after{left:26%;right:34%;height:12px}
.buyItem .ico.grenades:after{left:38%;right:38%;top:30%;height:26px;border-radius:50%}
.buyItem .ico.gear:after{left:30%;right:30%;top:22%;height:26px;border-radius:4px}
.buyItem .nm{font-weight:700;font-size:14px}
.buyItem .pr{color:var(--good);font-weight:700}
.buyItem .st{position:relative;height:4px;background:#20272f;margin-top:2px}
.buyItem .st i{display:block;height:100%;background:var(--accent2)}
.buyItem .st em{position:absolute;right:0;top:-13px;font-style:normal;font-size:9px;letter-spacing:1px;color:var(--dim)}
.buyItem .sub{font-size:10px;color:var(--dim);letter-spacing:1px;margin-top:6px}

/* ------------------------------------------------------------ scoreboard -- */
#scoreboard{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(6,9,13,.72)}
.sbWrap{width:min(1000px,94vw);background:rgba(11,15,20,.97);border:1px solid var(--line)}
.sbHead{display:flex;gap:20px;padding:12px 18px;border-bottom:1px solid var(--line);font-size:12px;letter-spacing:3px;color:var(--dim)}
.sbHead .mode{color:var(--accent)}
.sbTeamHead{display:flex;justify-content:space-between;padding:8px 18px;font-size:15px;letter-spacing:3px}
.sbTeam.t1 .sbTeamHead{background:rgba(74,159,224,.14);color:var(--t1)}
.sbTeam.t2 .sbTeamHead{background:rgba(224,165,74,.14);color:var(--t2)}
.sbTeam table{width:100%;border-collapse:collapse;font-family:Rajdhani,sans-serif}
.sbTeam th{font-size:10px;letter-spacing:2px;color:var(--dim);padding:6px 10px;text-align:center}
.sbTeam th:first-child{text-align:left;padding-left:18px}
.sbTeam td{padding:6px 10px;text-align:center;font-size:14px;border-bottom:1px solid #141a21}
.sbTeam td.nm{text-align:left;padding-left:18px;font-weight:600;display:flex;align-items:center;gap:8px}
.sbTeam td.nm em{font-style:normal;font-size:9px;background:var(--bg3);padding:1px 4px;color:var(--dim)}
.sbTeam tr.dead{opacity:.42}
.sbTeam tr.me{background:rgba(240,160,32,.10)}
.sbTeam td.bad{color:var(--bad)}
.bombIcon{width:8px;height:11px;background:var(--bad);display:inline-block;border-radius:1px}