/* CSGO Matchmaking — account pages (settings, wallet, loadout, upgrader) */
.ac-login{text-align:center}
.out{font-size:14px;color:var(--ice);margin-top:10px}
.out.bad{color:#FF8A8D}

/* settings */
.set-layout{display:grid;grid-template-columns:220px minmax(0,1fr);gap:24px;align-items:start}
.st-nav{position:sticky;top:88px;display:grid;gap:2px}
.st-nav [role=tab]{text-align:left;padding:10px 14px;border-radius:var(--r-sm);font-weight:500;font-size:14px;color:var(--muted);border-left:2px solid transparent}
.st-nav [role=tab]:hover{color:var(--text);background:var(--hull)}
.st-nav [role=tab][aria-selected=true]{color:var(--text);background:var(--hull);border-left-color:var(--blue)}
.st-nav .danger{color:#FF8A8D}
.st-pane{display:grid;gap:14px}
.st-card{border:1px solid var(--line);border-radius:var(--r-md);background:var(--hull);padding:20px}
.st-card h2{font:700 20px/1 var(--display);text-transform:uppercase}
.st-card .cur{font-size:14px;color:var(--muted);margin-top:6px}
.st-card .cur b{color:var(--text);font-weight:600}
.st-card p.help{font-size:13px;color:var(--muted);margin-top:6px;max-width:64ch}
.st-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:14px}
.st-row .inp{height:42px;flex:1;min-width:200px;max-width:360px}
.st-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:14px;max-width:560px}
.st-grid label{display:grid;gap:6px;font-size:13px;color:var(--muted)}
.st-grid .inp{height:42px;max-width:none}
.st-grid .full{grid-column:1/-1}
.av-big{width:72px;height:72px;border-radius:var(--r-md);display:grid;place-items:center;background:linear-gradient(160deg,#173468,#0A1730);border:2px solid var(--blue);font:900 34px var(--display);color:var(--ice)}
.checks{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.checks label{display:flex;gap:8px;align-items:center;padding:8px 12px;border:1px solid var(--line-hi);border-radius:var(--r-sm);font-size:14px;cursor:pointer}
.checks input{accent-color:var(--blue)}
textarea.inp{height:auto;min-height:120px;padding:10px 12px;resize:vertical;width:100%;max-width:420px;font:inherit;font-size:14px}
.pro-only{position:relative}
.pro-only.locked>*:not(h2):not(.pro-tag){opacity:.45;pointer-events:none}
.pro-tag{display:inline-block;margin-left:8px;font:700 11px var(--body);padding:2px 7px;border-radius:3px;background:var(--blue-deep);color:#fff;vertical-align:3px}
.conn{display:flex;align-items:center;gap:14px;padding:14px 0;border-top:1px solid var(--line)}
.conn:first-of-type{border-top:0}
.conn img,.conn .dc{width:28px;height:28px}
.conn div{flex:1}
.conn b{display:block}
.conn span{font-size:13px;color:var(--muted)}
.st-card.danger{border-color:rgba(229,72,77,.5)}
.btn-danger{background:#E5484D;color:#fff}
.btn-danger:disabled{opacity:.4;cursor:not-allowed}

/* wallet */
.wl-bal{display:flex;align-items:baseline;gap:10px}
.wl-bal b{font:900 64px/1 var(--display)}
.wl-bal span{color:var(--muted)}
td small{display:block;font-size:12px;color:var(--muted)}
td.pos{color:var(--ice);font-weight:600}td.neg{color:var(--text)}

/* loadout */
.prefs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.pref h3{font-size:13px;color:var(--muted);font-weight:500;margin-bottom:6px}
.pref .seg{display:flex;background:#000;border:1px solid var(--line);border-radius:var(--r-sm);padding:3px;gap:3px}
.pref button{flex:1;height:34px;border-radius:3px;font-size:13px;font-weight:600;color:var(--muted)}
.pref button[aria-pressed=true]{background:var(--blue);color:#fff}
.lo-group{margin-top:28px}
.lo-group h2{font:800 24px/1 var(--display);text-transform:uppercase;display:flex;gap:10px;align-items:baseline}
.lo-group h2 small{font:500 13px var(--body);color:var(--muted);text-transform:none}
.lo-sides{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:12px}
.lo-side h3{font-size:13px;color:var(--muted);font-weight:500;margin-bottom:8px}
.slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:8px}
.slot-btn{display:flex;flex-direction:column;gap:4px;text-align:left;padding:10px;border:1px dashed var(--line-hi);border-radius:var(--r-sm);background:var(--hull);min-height:110px}
.slot-btn:hover{border-color:var(--blue)}
.slot-btn.filled{border-style:solid}
.slot-img{height:48px;display:grid;place-items:center;color:var(--dim);font-size:22px}
.slot-img img{max-height:48px}
.slot-w{font-size:13px;font-weight:600}
.slot-skin{font-size:12px;color:var(--muted)}
.bind{display:flex;gap:8px;align-items:center;padding:10px 12px;border:1px solid var(--line-hi);border-radius:var(--r-sm);background:#000;margin-top:10px}
.bind code{flex:1;color:var(--ice);font-size:14px;overflow-x:auto;white-space:nowrap}
.presets{list-style:none;display:grid;gap:6px;margin-top:10px}
.presets li{display:flex;justify-content:space-between;align-items:center;font-size:14px}
dialog{border:1px solid var(--line-hi);border-radius:var(--r-md);background:var(--deck);color:var(--text);padding:0;width:min(640px,calc(100vw - 32px));max-height:80vh}
dialog::backdrop{background:rgba(0,0,0,.7)}
.dlg-h{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid var(--line)}
.dlg-h h2{font:700 20px var(--display);text-transform:uppercase}
.dlg-b{padding:16px 20px;overflow:auto;max-height:60vh}
.picks{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px;margin-top:10px}
.pick{display:flex;flex-direction:column;gap:4px;align-items:flex-start;text-align:left;padding:10px;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--hull);font-size:13px}
.pick:hover{border-color:var(--blue)}
.pick img{height:56px;align-self:center;object-fit:contain}
.pick small{color:var(--muted)}

/* upgrader */
.up{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.up-card{border:1px solid var(--line);border-radius:var(--r-md);background:var(--hull);padding:20px}
.up-card h2{font:700 20px/1 var(--display);text-transform:uppercase}
.up-card>p{font-size:13px;color:var(--muted);margin-top:4px}
.up-slot{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:170px;margin-top:14px;border:1px dashed var(--line-hi);border-radius:var(--r-md);background:radial-gradient(circle at 50% 60%,rgba(47,123,255,.18),transparent 70%);width:100%;text-align:center}
.up-slot:hover{border-color:var(--blue)}
.up-slot img{max-height:96px}
.up-slot small{color:var(--muted)}
.add-row{display:flex;gap:6px;flex-wrap:wrap;margin-top:14px;align-items:center}
.add-row .inp{width:140px;height:38px}
.add-row .chip{height:32px}
.up-odds{margin-top:16px;border:1px solid var(--line-hi);border-radius:var(--r-md);background:linear-gradient(140deg,#0E2552,var(--hull) 70%);padding:20px}
.odds{display:grid;grid-template-columns:150px 1fr;gap:24px;align-items:center}
.odds-ring{width:150px;height:150px;border-radius:50%;display:grid;place-content:center;text-align:center;background:conic-gradient(var(--ice) calc(var(--p)*1%),var(--line) 0);position:relative}
.odds-ring::before{content:"";position:absolute;inset:10px;border-radius:50%;background:var(--hull)}
.odds-ring>*{position:relative}
.odds-ring b{font:900 30px/1 var(--display)}
.odds-ring small{font-size:12px;color:var(--muted)}
.odds dl{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.odds dt{font-size:12px;color:var(--muted)}.odds dd{font:800 22px var(--display);margin-top:2px}
.up-go{display:flex;gap:14px;align-items:center;margin-top:16px;flex-wrap:wrap}
.up-go .btn{height:48px;padding:0 28px}
.up-go p{font-size:13px;color:var(--muted)}
.recent{list-style:none;display:grid;gap:6px}
.recent li{display:grid;grid-template-columns:140px 1fr 70px 60px;gap:10px;align-items:center;padding:10px 14px;border:1px solid var(--line);border-left:3px solid var(--line-hi);border-radius:var(--r-sm);font-size:14px}
.recent li.w{border-left-color:var(--blue)}
.recent a{font-weight:600}.recent span{color:#B7C3DA}.recent b{text-align:right}.recent em{font-style:normal;text-align:right;color:var(--muted)}
.recent li.w em{color:var(--ice)}

@media (max-width:900px){
  .set-layout{grid-template-columns:1fr}
  .st-nav{position:static;display:flex;overflow-x:auto;gap:4px}
  .st-nav [role=tab]{border-left:0;border-bottom:2px solid transparent;white-space:nowrap}
  .st-nav [role=tab][aria-selected=true]{border-bottom-color:var(--blue)}
  .prefs{grid-template-columns:1fr 1fr}
  .up{grid-template-columns:1fr}
}
@media (max-width:720px){
  .st-grid{grid-template-columns:1fr}
  .lo-sides{grid-template-columns:1fr}
  .odds{grid-template-columns:1fr;justify-items:center}
  .recent li{grid-template-columns:1fr auto}
  .recent span{grid-column:1/-1;order:3}
}
@media (max-width:720px){.prefs{grid-template-columns:minmax(0,1fr)}.slots{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* upgrader wheel */
.uw-wrap{display:grid;grid-template-columns:260px 1fr;gap:28px;align-items:center}
.uw{position:relative;width:260px;height:260px}
.uw-svg{width:100%;height:100%;overflow:visible}
.uw-track{fill:none;stroke:rgba(255,255,255,.07);stroke-width:18}
.uw-zone{fill:none;stroke:#3DD68C;stroke-width:18;filter:drop-shadow(0 0 8px rgba(61,214,140,.55));transition:stroke-dashoffset .15s,stroke-dasharray .3s}
.uw-tick{stroke:rgba(255,255,255,.18);stroke-width:2}
.uw-needle{transform-origin:110px 110px}
.uw-needle path{fill:#F5C451}.uw-needle line{stroke:#F5C451;stroke-width:3;stroke-linecap:round}.uw-needle circle{fill:#0B1220;stroke:#F5C451;stroke-width:3}
.uw-mid{position:absolute;inset:0;display:grid;place-content:center;text-align:center;pointer-events:none;padding-top:44px}
.uw-mid b{font:900 34px/1 var(--display)}
.uw-mid small{display:block;margin-top:4px;font-size:12px;color:var(--muted);max-width:150px}
.uw.is-win .uw-mid b{color:#3DD68C}.uw.is-lose .uw-mid b{color:#FF8A8D}
.uw.is-win .uw-zone{stroke-width:22}
.uw.is-lose .uw-zone{stroke:#3a4a5e;filter:none}
.uw-dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.uw-dl div{padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-sm);background:rgba(0,0,0,.35)}
.uw-dl dt{font-size:12px;color:var(--muted)}.uw-dl dd{font:800 20px/1.2 var(--display);margin-top:2px}
.uw-pos{display:grid;gap:8px;margin-top:16px;font-size:13px;color:var(--muted)}
.uw-pos b{color:#3DD68C;font-family:ui-monospace,Menlo,Consolas,monospace;margin-left:6px}
.uw-pos input{width:100%;accent-color:#3DD68C}
.uw-quick{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.uw-hint{font-size:12px;color:var(--muted);margin-top:10px}
.uw-receipt{font:11px/1.5 ui-monospace,Menlo,Consolas,monospace;color:var(--muted);word-break:break-all;margin-top:10px}
@media (max-width:720px){.uw-wrap{grid-template-columns:1fr;justify-items:center}.uw{width:220px;height:220px}.uw-side{width:100%}}
@media (prefers-reduced-motion:reduce){.uw-zone{transition:none}}
.help.ok{color:#3DD68C}.help.bad{color:#FF8A8D}