
    :root {
      --bg: #06101d;
      --bg-deep: #030a12;
      --panel: #0b1727;
      --panel-2: #0e1c2e;
      --panel-3: #101f33;
      --border: rgba(142, 171, 211, .16);
      --border-strong: rgba(142, 171, 211, .28);
      --text: #f4f7fb;
      --muted: #8ca2c4;
      --muted-2: #657b9e;
      --blue: #42a5ff;
      --cyan: #50e0c1;
      --yellow: #ffc451;
      --orange: #ff7a27;
      --red: #ff5c7a;
      --purple: #9368ff;
      --shadow: 0 20px 70px rgba(0, 0, 0, .28);
      --radius: 22px;
      --radius-sm: 14px;
      --font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    }

    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; }
    body {
      margin: 0;
      min-height: 100vh;
      color: var(--text);
      background:
        radial-gradient(circle at 18% 0%, rgba(66, 165, 255, .11), transparent 32%),
        radial-gradient(circle at 90% 12%, rgba(147, 104, 255, .08), transparent 30%),
        linear-gradient(180deg, #071321 0%, var(--bg-deep) 100%);
      font-family: var(--font);
      font-weight: 650;
      letter-spacing: -.015em;
    }

    button, input { font: inherit; }
    button { color: inherit; }
    a { color: inherit; text-decoration: none; }

    .shell { width: min(1480px, calc(100% - 32px)); margin: 0 auto; padding: 20px 0 56px; }

    .topbar {
      position: sticky;
      z-index: 50;
      top: 14px;
      display: flex;
      align-items: center;
      gap: 22px;
      min-height: 72px;
      margin-bottom: 22px;
      padding: 12px 14px 12px 18px;
      border: 1px solid var(--border);
      border-radius: 20px;
      background: rgba(6, 16, 29, .82);
      box-shadow: 0 16px 40px rgba(0,0,0,.24);
      backdrop-filter: blur(18px);
    }

    .brand { display: flex; align-items: center; gap: 12px; flex: 0 0 auto; }
    .brand-mark {
      display: grid;
      place-items: center;
      width: 42px;
      height: 42px;
      border-radius: 13px;
      background: linear-gradient(135deg, var(--blue), var(--purple));
      box-shadow: 0 9px 30px rgba(66,165,255,.24);
      font-weight: 950;
      letter-spacing: -.08em;
    }
    .brand-copy strong { display: block; font-size: 15px; letter-spacing: .08em; }
    .brand-copy span { display: block; margin-top: 2px; color: var(--muted-2); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; }

    .search { display: flex; flex: 1 1 auto; gap: 10px; min-width: 0; }
    .search-field {
      position: relative;
      flex: 1 1 auto;
      min-width: 0;
    }
    .search-field svg { position: absolute; left: 16px; top: 50%; width: 19px; height: 19px; transform: translateY(-50%); color: var(--muted-2); }
    .search input {
      width: 100%;
      height: 48px;
      padding: 0 16px 0 46px;
      color: var(--text);
      border: 1px solid var(--border);
      border-radius: 14px;
      outline: none;
      background: #081422;
      transition: .2s ease;
    }
    .search input:focus { border-color: rgba(66,165,255,.62); box-shadow: 0 0 0 4px rgba(66,165,255,.09); }
    .search button, .primary-btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 9px;
      min-height: 48px;
      padding: 0 20px;
      border: 0;
      border-radius: 14px;
      cursor: pointer;
      background: linear-gradient(135deg, #1e8fff, #6e61ff);
      box-shadow: 0 10px 28px rgba(37,135,255,.23);
      font-weight: 850;
      transition: transform .18s ease, filter .18s ease;
    }
    .search button:hover, .primary-btn:hover { transform: translateY(-1px); filter: brightness(1.06); }
    .search button:active, .primary-btn:active { transform: translateY(0); }

    .demo-pill {
      flex: 0 0 auto;
      padding: 8px 11px;
      border: 1px solid rgba(255,196,81,.25);
      border-radius: 999px;
      color: var(--yellow);
      background: rgba(255,196,81,.08);
      font-size: 11px;
      letter-spacing: .1em;
      text-transform: uppercase;
    }

    .tabs {
      display: flex;
      gap: 8px;
      margin: 8px 0 18px;
      padding: 0 2px 12px;
      border-bottom: 1px solid var(--border);
    }
    .tab-btn {
      position: relative;
      padding: 12px 18px;
      border: 0;
      border-radius: 12px;
      color: var(--muted);
      background: transparent;
      cursor: pointer;
      font-weight: 850;
    }
    .tab-btn.active { color: var(--text); background: rgba(112,139,178,.12); }
    .tab-btn.active::after {
      content: "";
      position: absolute;
      left: 18px;
      right: 18px;
      bottom: -13px;
      height: 2px;
      border-radius: 99px;
      background: linear-gradient(90deg, var(--blue), var(--purple));
    }

    .view { display: none; }
    .view.active { display: block; animation: appear .28s ease; }
    @keyframes appear { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

    .dashboard {
      display: grid;
      grid-template-columns: minmax(350px, 1.15fr) repeat(3, minmax(220px, .75fr));
      gap: 12px;
    }

    .card {
      position: relative;
      overflow: hidden;
      border: 1px solid var(--border);
      border-radius: var(--radius);
      background: linear-gradient(180deg, rgba(14,28,46,.96), rgba(8,19,33,.96));
      box-shadow: var(--shadow);
    }
    .card::before {
      content: "";
      position: absolute;
      pointer-events: none;
      inset: 0;
      background: linear-gradient(140deg, rgba(255,255,255,.025), transparent 28%);
    }

    .profile-card { min-height: 230px; padding: 24px; }
    .profile-main { display: flex; gap: 20px; align-items: center; }
    .avatar-wrap { position: relative; flex: 0 0 auto; }
    .avatar {
      display: grid;
      place-items: center;
      width: 112px;
      height: 112px;
      overflow: hidden;
      border: 1px solid rgba(255,255,255,.13);
      border-radius: 22px;
      background:
        radial-gradient(circle at 50% 28%, #506580 0 13%, transparent 14%),
        radial-gradient(circle at 50% 75%, #17283d 0 38%, transparent 39%),
        linear-gradient(135deg, #1b2b41, #070d15 70%);
      box-shadow: 0 15px 30px rgba(0,0,0,.25);
    }
    .avatar span { font-size: 31px; font-weight: 950; color: rgba(255,255,255,.82); letter-spacing: -.1em; }
    .online-dot { position: absolute; right: -3px; bottom: 6px; width: 18px; height: 18px; border: 4px solid var(--panel); border-radius: 50%; background: var(--cyan); }

    .profile-copy { min-width: 0; }
    .status-row { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-bottom: 7px; }
    .status-badge { padding: 6px 9px; border: 1px solid rgba(80,224,193,.4); border-radius: 8px; color: var(--cyan); background: rgba(80,224,193,.09); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
    .source-badge { padding: 6px 9px; border-radius: 8px; color: var(--muted); background: rgba(255,255,255,.04); font-size: 11px; }
    .profile-copy h1 { margin: 0; max-width: 100%; overflow: hidden; text-overflow: ellipsis; font-size: 27px; line-height: 1.08; white-space: nowrap; }
    .steam-id { margin-top: 7px; color: #6f98d6; font-size: 13px; }
    .profile-links { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 17px; }
    .icon-btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-width: 40px;
      height: 40px;
      padding: 0 12px;
      border: 1px solid var(--border);
      border-radius: 12px;
      color: var(--muted);
      background: rgba(255,255,255,.025);
      cursor: pointer;
      transition: .18s ease;
    }
    .icon-btn:hover { color: var(--text); border-color: var(--border-strong); background: rgba(255,255,255,.05); }

    .mini-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 9px; margin-top: 18px; }
    .mini-stat { padding: 12px 13px; border: 1px solid var(--border); border-radius: 13px; background: rgba(2,10,18,.26); }
    .mini-stat span { display: block; color: var(--muted-2); font-size: 10px; letter-spacing: .09em; text-transform: uppercase; }
    .mini-stat strong { display: block; margin-top: 7px; font-size: 18px; }

    .metric-card { min-height: 230px; padding: 22px; text-align: center; cursor: default; }
    .metric-title { color: #dce9f8; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; }
    .metric-ring {
      --value: 31;
      --ring: var(--cyan);
      position: relative;
      display: grid;
      place-items: center;
      width: 132px;
      height: 132px;
      margin: 18px auto 9px;
      border-radius: 50%;
      background: conic-gradient(var(--ring) calc(var(--value) * 1%), rgba(255,255,255,.08) 0);
    }
    .metric-ring::before { content:""; width: 102px; height: 102px; border-radius: 50%; background: #0b1827; box-shadow: inset 0 0 22px rgba(0,0,0,.22); }
    .ring-content { position: absolute; inset: 0; display: grid; place-content: center; line-height: 1; }
    .ring-content strong { font-size: 31px; }
    .ring-content small { margin-top: 6px; color: var(--muted); font-size: 11px; }
    .metric-label { margin-top: 2px; font-size: 15px; font-weight: 900; }
    .metric-note { margin: 6px auto 0; max-width: 260px; color: var(--muted); font-size: 12px; line-height: 1.48; }
    .metric-card.risk .metric-label, .metric-card.ttd .metric-label { color: var(--cyan); }
    .metric-card.win .metric-label { color: var(--yellow); }

    .secondary-grid {
      display: grid;
      grid-template-columns: 1.1fr 1fr 1fr;
      gap: 12px;
      margin-top: 12px;
    }
    .section-card { padding: 22px; min-height: 320px; }
    .section-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 18px; }
    .section-title { display: flex; align-items: center; gap: 10px; margin: 0; font-size: 17px; }
    .section-icon { display:grid; place-items:center; width: 34px; height: 34px; border-radius: 11px; background: rgba(66,165,255,.1); color: var(--blue); }
    .ghost-btn { padding: 9px 12px; border: 1px solid var(--border); border-radius: 10px; color: var(--muted); background: transparent; cursor: pointer; }
    .ghost-btn:hover { color: var(--text); border-color: var(--border-strong); }

    .rank-hero { display: flex; align-items: center; gap: 16px; margin: 22px 0; }
    .rank-badge { display:grid; place-items:center; width: 86px; height: 86px; border-radius: 50%; background: radial-gradient(circle at 38% 28%, #8fdcff, #2351a9 50%, #101d36 72%); box-shadow: 0 0 0 6px rgba(66,165,255,.05), 0 12px 32px rgba(0,0,0,.22); font-size: 22px; font-weight: 950; }
    .rank-copy span { color: var(--muted); font-size: 12px; }
    .rank-copy strong { display: block; margin-top: 5px; font-size: 31px; }
    .rank-copy em { display: inline-block; margin-top: 6px; color: var(--cyan); font-size: 12px; font-style: normal; }

    .form-strip { display: flex; gap: 6px; margin-top: 14px; }
    .result { display:grid; place-items:center; width: 29px; height: 29px; border-radius: 8px; font-size: 11px; }
    .result.w { color: var(--cyan); border: 1px solid rgba(80,224,193,.3); background: rgba(80,224,193,.08); }
    .result.l { color: var(--red); border: 1px solid rgba(255,92,122,.26); background: rgba(255,92,122,.07); }

    .stat-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-top: 22px; }
    .stat-row span { display:block; color: var(--muted-2); font-size: 10px; letter-spacing:.09em; text-transform: uppercase; }
    .stat-row strong { display:block; margin-top: 8px; font-size: 19px; }

    .faceit-level { display: flex; align-items:center; gap: 17px; margin: 24px 0 17px; }
    .level-badge { display:grid; place-items:center; width: 80px; height: 80px; border-radius: 22px; background: linear-gradient(145deg, #ff7a27, #ba2d00); font-size: 30px; font-weight: 950; box-shadow: 0 12px 30px rgba(255,100,20,.2); }
    .faceit-level strong { display:block; font-size: 28px; }
    .faceit-level span { display:block; margin-top:5px; color:var(--muted); font-size:12px; }

    .ai-card { background: linear-gradient(145deg, rgba(16,31,51,.98), rgba(10,18,34,.98)); }
    .ai-score { display:flex; align-items:center; justify-content:space-between; gap:16px; padding: 16px; border: 1px solid rgba(147,104,255,.22); border-radius: 16px; background: rgba(147,104,255,.06); }
    .ai-score strong { font-size: 31px; }
    .ai-score span { display:block; margin-top:4px; color:var(--muted); font-size:12px; }
    .confidence { color: var(--cyan); font-size:12px; }
    .factor-list { display:grid; gap:10px; margin-top:16px; }
    .factor { display:grid; grid-template-columns: 1fr auto; align-items:center; gap:12px; }
    .factor-copy { min-width:0; }
    .factor-copy span { display:block; margin-bottom:6px; font-size:12px; }
    .track { height:7px; overflow:hidden; border-radius:99px; background:rgba(255,255,255,.07); }
    .track > i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--blue),var(--purple)); }
    .factor b { font-size:12px; color:var(--muted); }
    .disclaimer { margin-top:16px; padding:12px 13px; border-radius:12px; color:var(--muted); background:rgba(255,255,255,.025); font-size:11px; line-height:1.45; }

    .performance { margin-top: 12px; padding: 22px; }
    .performance-grid { display:grid; grid-template-columns: repeat(6, 1fr); gap: 12px; }
    .perf-item { padding: 14px; border:1px solid var(--border); border-radius:15px; background:rgba(255,255,255,.02); }
    .perf-item h4 { margin:0; font-size:13px; }
    .perf-item h4 small { color:var(--muted-2); font-weight:700; }
    .perf-value { margin:13px 0 12px; font-size:26px; }
    .perf-bar { position:relative; height:7px; border-radius:99px; background:rgba(255,255,255,.08); }
    .perf-bar i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,var(--red),var(--purple)); }
    .perf-foot { margin-top:10px; color:var(--muted); font-size:11px; }

    .bottom-grid { display:grid; grid-template-columns: .72fr 1.28fr; gap:12px; margin-top:12px; }
    .inventory-card, .chart-card { padding:22px; }
    .inventory-card { display:flex; flex-direction:column; align-items:flex-start; justify-content:space-between; gap:20px; min-width:0; }
    .inventory-value { min-width:0; max-width:100%; }
    .inventory-value > span { display:block; color:var(--cyan); font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.04em; }
    .inventory-value > strong { display:block; margin-top:8px; max-width:100%; font-size:30px; line-height:1.05; overflow-wrap:anywhere; }
    .inventory-value > small { display:block; margin-top:8px; color:var(--muted); font-size:11px; line-height:1.45; }
    #premierReason { white-space:pre-line; }
    .inventory-change { margin-top:7px; color:var(--cyan); font-size:12px; }
    .inventory-items { display:grid; gap:10px; margin-top:22px; }
    .skin-row { display:grid; grid-template-columns:46px 1fr auto; align-items:center; gap:12px; padding:10px; border:1px solid var(--border); border-radius:13px; background:rgba(255,255,255,.018); }
    .skin-img { display:grid; place-items:center; width:46px; height:46px; border-radius:10px; background:linear-gradient(135deg,rgba(66,165,255,.18),rgba(147,104,255,.16)); font-size:20px; }
    .skin-row strong { display:block; font-size:12px; }
    .skin-row span { display:block; margin-top:4px; color:var(--muted); font-size:10px; }
    .skin-row b { font-size:13px; }

    .chart-toolbar { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
    .periods { display:flex; gap:6px; }
    .period-btn { padding:8px 11px; border:1px solid var(--border); border-radius:9px; color:var(--muted); background:transparent; cursor:pointer; font-size:11px; }
    .period-btn.active { color:var(--text); border-color:rgba(66,165,255,.6); background:rgba(66,165,255,.1); }
    .chart-wrap { position:relative; height:260px; margin-top:18px; }
canvas { width:100%; height:100%; display:block; }

.inventory-top-skins { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin:auto 0; padding:24px 0; align-items:stretch; }
.inventory-top-skin { display:grid; grid-template-columns:118px minmax(0,1fr); align-items:center; gap:18px; min-width:0; min-height:152px; padding:16px; border:1px solid var(--border); border-radius:16px; background:linear-gradient(145deg,rgba(66,165,255,.045),rgba(147,104,255,.035)); }
.inventory-top-skin.is-placeholder { opacity:.55; }
.inventory-top-skin-image { display:grid; place-items:center; width:118px; height:104px; border-radius:13px; background:linear-gradient(135deg,rgba(66,165,255,.14),rgba(147,104,255,.14)); overflow:hidden; color:var(--muted); font-weight:800; }
.inventory-top-skin-image img { width:100%; height:100%; object-fit:contain; }
.inventory-top-skin-copy { min-width:0; }
.inventory-top-skin-copy > span { color:var(--cyan); font-size:11px; font-weight:800; letter-spacing:.06em; }
.inventory-top-skin-copy > strong { display:block; margin-top:7px; font-size:16px; line-height:1.25; overflow-wrap:normal; word-break:normal; }
.inventory-top-skin-copy > small { display:block; margin-top:7px; color:var(--muted); font-size:10px; }
.inventory-top-skin-copy > b { display:block; margin-top:9px; color:var(--text); font-size:20px; white-space:nowrap; }
@media (max-width:900px) {
  .inventory-top-skins { grid-template-columns:1fr; }
  .inventory-top-skin { grid-template-columns:90px minmax(0,1fr); }
  .inventory-top-skin-image { width:90px; height:76px; }
  .inventory-top-skin-copy > b { font-size:18px; }
}

/* Inventory/ranks row follows its content instead of stretching to a fixed desktop height. */
@media (min-width:901px) {
  .ranks-skins-grid {
    height:auto !important;
    min-height:0 !important;
    align-items:start !important;
  }
  .ranks-skins-grid > .rank-card,
  .ranks-skins-grid > .rank-card .competitive-panel,
  .ranks-skins-grid > .rank-card .rank-board {
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    overflow:visible !important;
  }
  .ranks-skins-grid > .bottom-grid {
    grid-template-rows:auto auto !important;
    height:auto !important;
    min-height:0 !important;
    align-self:start !important;
  }
  .ranks-skins-grid > .bottom-grid > .chart-card {
    height:auto !important;
    min-height:0 !important;
    display:block !important;
  }
  .inventory-top-skins {
    margin-top:22px;
    padding:0;
  }
}

    .matches { display:grid; gap:10px; }
    .match-card { display:grid; grid-template-columns: 110px 1fr auto; align-items:center; gap:20px; padding:17px 18px; border:1px solid var(--border); border-radius:16px; background:linear-gradient(180deg,rgba(14,28,46,.9),rgba(8,19,33,.9)); cursor:pointer; transition:.18s ease; }
    .match-card:hover { transform:translateY(-1px); border-color:var(--border-strong); }
    .match-date { color:var(--muted); font-size:11px; }
    .match-map strong { display:block; font-size:15px; }
    .match-map span { display:block; margin-top:5px; color:var(--muted); font-size:11px; }
    .match-score { text-align:right; }
    .match-score strong { font-size:22px; }
    .match-score span { display:block; margin-top:4px; font-size:11px; }
    .match-score.win span { color:var(--cyan); }
    .match-score.loss span { color:var(--red); }

    .modal { position:fixed; z-index:100; inset:0; display:none; place-items:center; padding:18px; background:rgba(1,6,12,.72); backdrop-filter:blur(10px); }
    .modal.open { display:grid; }
    .modal-panel { width:min(680px,100%); max-height:min(760px,calc(100vh - 36px)); overflow:auto; border:1px solid var(--border-strong); border-radius:24px; background:#0a1727; box-shadow:0 30px 100px rgba(0,0,0,.5); }
    .modal-head { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:20px 22px; border-bottom:1px solid var(--border); }
    .modal-head h3 { margin:0; }
    .close-btn { width:38px; height:38px; border:1px solid var(--border); border-radius:11px; background:transparent; cursor:pointer; }
    .modal-body { padding:22px; }
    .reason-list { display:grid; gap:10px; margin-top:18px; }
    .reason { padding:13px 14px; border:1px solid var(--border); border-radius:13px; color:var(--muted); background:rgba(255,255,255,.02); font-size:12px; line-height:1.45; }
    .reason.up::before { content:"↑"; color:var(--red); margin-right:9px; }
    .reason.down::before { content:"↓"; color:var(--cyan); margin-right:9px; }

    .toast { position:fixed; z-index:120; right:22px; bottom:22px; max-width:360px; padding:14px 16px; border:1px solid var(--border-strong); border-radius:14px; background:#102137; box-shadow:0 18px 50px rgba(0,0,0,.35); opacity:0; transform:translateY(12px); pointer-events:none; transition:.22s ease; font-size:12px; line-height:1.4; }
    .toast.show { opacity:1; transform:none; }

    .loading-overlay { position:absolute; z-index:5; inset:0; display:none; place-items:center; border-radius:inherit; background:rgba(7,17,31,.78); backdrop-filter:blur(4px); }
    .loading-overlay.show { display:grid; }
    .spinner { width:32px; height:32px; border:3px solid rgba(255,255,255,.12); border-top-color:var(--blue); border-radius:50%; animation:spin .8s linear infinite; }
    @keyframes spin { to { transform:rotate(360deg); } }

    @media (max-width: 1180px) {
      .dashboard { grid-template-columns: repeat(3, 1fr); }
      .profile-card { grid-column: 1 / -1; }
      .secondary-grid { grid-template-columns: 1fr 1fr; }
      .ai-card { grid-column: 1 / -1; }
      .performance-grid { grid-template-columns: repeat(3, 1fr); }
    }
    @media (max-width: 820px) {
      .shell { width:min(100% - 18px,1480px); padding-top:9px; }
      .topbar { position:relative; top:0; flex-wrap:wrap; gap:12px; }
      .brand { flex:1; }
      .demo-pill { order:2; }
      .search { order:3; width:100%; }
      .dashboard { grid-template-columns:1fr; }
      .metric-card { min-height:auto; }
      .secondary-grid, .bottom-grid { grid-template-columns:1fr; }
      .performance-grid { grid-template-columns:repeat(2,1fr); }
      .mini-grid { grid-template-columns:repeat(2,1fr); }
      .match-card { grid-template-columns:80px 1fr; }
      .match-score { grid-column:2; text-align:left; }
    }
    @media (max-width: 540px) {
      .search { display:grid; }
      .profile-main { align-items:flex-start; }
      .avatar { width:84px; height:84px; border-radius:18px; }
      .profile-copy h1 { font-size:22px; }
      .profile-card, .section-card, .performance, .inventory-card, .chart-card { padding:16px; border-radius:18px; }
      .performance-grid { grid-template-columns:1fr; }
      .stat-row { grid-template-columns:repeat(2,1fr); }
      .chart-wrap { height:220px; }
    }
  
/* Production additions */
.hidden { display: none !important; }
.is-disabled { opacity: .45; pointer-events: none; }
.avatar img { width: 100%; height: 100%; object-fit: cover; display: none; }
.avatar.has-image img { display: block; }
.avatar.has-image span { display: none; }
.integration-pill { flex: 0 0 auto; padding: 8px 11px; border: 1px solid rgba(80,224,193,.25); border-radius: 999px; color: var(--cyan); background: rgba(80,224,193,.08); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
.integration-pill.demo { color: var(--yellow); border-color: rgba(255,196,81,.25); background: rgba(255,196,81,.08); }
.error-banner { display:none; margin:0 0 16px; padding:14px 16px; border:1px solid rgba(255,92,122,.3); border-radius:14px; color:#ffb3c2; background:rgba(255,92,122,.08); }
.error-banner.show { display:block; }
.empty-state { display:grid; place-items:center; min-height:220px; padding:28px; text-align:center; color:var(--muted); border:1px dashed var(--border-strong); border-radius:18px; }
.empty-state strong { display:block; margin-bottom:8px; color:var(--text); font-size:18px; }
.badge-danger { color: var(--red) !important; border-color: rgba(255,92,122,.4) !important; background: rgba(255,92,122,.09) !important; }
.badge-warning { color: var(--yellow) !important; border-color: rgba(255,196,81,.35) !important; background: rgba(255,196,81,.08) !important; }
.modal-panel.large { width:min(980px,calc(100% - 28px)); }
.inventory-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:10px; max-height:58vh; overflow:auto; padding-right:4px; }
.inventory-item { display:flex; align-items:center; gap:12px; min-height:78px; padding:12px; border:1px solid var(--border); border-radius:14px; background:rgba(255,255,255,.025); }
.inventory-item img { width:64px; height:48px; object-fit:contain; border-radius:8px; background:rgba(255,255,255,.03); }
.inventory-item .item-placeholder { display:grid; place-items:center; width:64px; height:48px; border-radius:8px; color:var(--muted-2); background:rgba(255,255,255,.03); }
.inventory-item strong { display:block; font-size:13px; }
.inventory-item span { display:block; margin-top:5px; color:var(--muted); font-size:11px; }
.modal-subtitle { margin:0 0 16px; color:var(--muted); font-size:12px; line-height:1.5; }
.match-card[role="button"] { cursor:pointer; transition:.18s ease; }
.match-card[role="button"]:hover { transform:translateY(-1px); border-color:var(--border-strong); background:rgba(255,255,255,.035); }
.filter-row { display:flex; flex-wrap:wrap; gap:8px; }
.filter-btn { padding:9px 13px; border:1px solid var(--border); border-radius:10px; color:var(--muted); background:rgba(255,255,255,.025); cursor:pointer; }
.filter-btn.active { color:var(--text); border-color:rgba(66,165,255,.45); background:rgba(66,165,255,.1); }
.metric-ring.na { background: conic-gradient(rgba(140,162,196,.15) 0 100%); }
.metric-ring.na::after { background:var(--panel); }
.source-note { color:var(--muted-2); font-size:11px; line-height:1.45; }
.skeleton { color:transparent !important; border-radius:8px; background:linear-gradient(90deg,rgba(255,255,255,.035),rgba(255,255,255,.08),rgba(255,255,255,.035)); background-size:200% 100%; animation:skeleton 1.2s infinite; }
@keyframes skeleton { to { background-position:-200% 0; } }
@media (max-width: 760px) { .integration-pill { display:none; } .inventory-grid { grid-template-columns:1fr; } }
.attribution-row { display:flex; align-items:center; justify-content:flex-end; gap:10px; margin-top:14px; color:#f84982; font-size:11px; }
.attribution-row button { padding:7px 10px; border:1px solid rgba(248,73,130,.35); border-radius:9px; color:#f84982; background:rgba(248,73,130,.06); cursor:pointer; font-weight:700; }
.attribution-row.hidden-source { display:none; }
@media (max-width: 540px) { .attribution-row { justify-content:flex-start; flex-wrap:wrap; } }

/* v0.1.4: Premier rating history */
.premier-history { display:flex; flex-wrap:wrap; gap:8px; margin-top:-4px; }
.premier-history.hidden { display:none; }
.premier-point { min-width:92px; padding:9px 11px; border:1px solid var(--border); border-radius:12px; background:rgba(255,255,255,.025); }
.premier-point span { display:block; color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.08em; }
.premier-point strong { display:block; margin-top:3px; font-size:14px; }
.premier-point.current { border-color:rgba(89,214,255,.38); background:rgba(89,214,255,.055); }
.premier-detail-list { display:grid; gap:8px; margin-top:14px; }
.premier-detail-row { display:flex; justify-content:space-between; gap:18px; padding:10px 12px; border:1px solid var(--border); border-radius:12px; background:rgba(255,255,255,.02); }
.premier-detail-row span { color:var(--muted); }

/* v0.1.5 — Leetify data layout and richer rank history */
.dashboard { align-items:start; }
.metric-card { align-self:start; }
.profile-card { min-height: 0; }
.leetify-chip { color:#fff; border:1px solid rgba(80,224,193,.45); background:rgba(80,224,193,.10); }

.competitive-panel {
  margin-top:16px;
  padding:15px;
  border:1px solid var(--border);
  border-radius:16px;
  background:rgba(2,10,18,.24);
}
.competitive-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; }
.competitive-head strong { font-size:13px; }
.competitive-head span { color:var(--muted-2); font-size:10px; text-transform:uppercase; letter-spacing:.08em; }
.competitive-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.competitive-rank {
  display:grid;
  grid-template-columns:34px 1fr auto;
  align-items:center;
  gap:9px;
  min-width:0;
  padding:9px 10px;
  border:1px solid rgba(142,171,211,.12);
  border-radius:12px;
  background:rgba(255,255,255,.018);
}
.map-orb { display:grid; place-items:center; width:34px; height:34px; border-radius:50%; color:#d8e7ff; background:linear-gradient(145deg,#334c70,#111d30); font-size:10px; font-weight:900; }
.competitive-rank div { min-width:0; }
.competitive-rank strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:11px; }
.competitive-rank small { display:block; margin-top:3px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--muted); font-size:9px; }
.competitive-rank b { color:#b8c9e5; font-size:11px; }
.competitive-empty { grid-column:1/-1; padding:8px 0; color:var(--muted); font-size:11px; line-height:1.45; }

.premier-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin:0 0 14px; }
.premier-summary > div { padding:10px; border:1px solid var(--border); border-radius:12px; background:rgba(255,255,255,.02); }
.premier-summary span { display:block; color:var(--muted-2); font-size:9px; text-transform:uppercase; letter-spacing:.07em; }
.premier-summary strong { display:block; margin-top:5px; font-size:14px; }
.premier-history { flex-wrap:nowrap; overflow-x:auto; padding-bottom:4px; }
.premier-point { flex:0 0 auto; }

.leetify-card { padding:24px 26px 20px; border-color:rgba(248,73,130,.13); }
.leetify-head { display:grid; grid-template-columns:auto auto 1fr; align-items:center; gap:14px; margin-bottom:26px; }
.leetify-title-wrap { display:flex; align-items:center; gap:13px; }
.leetify-title-wrap h2 { margin:0; font-size:18px; }
.leetify-title-wrap span:not(.leetify-mark) { display:block; margin-top:4px; color:var(--muted); font-size:10px; }
.leetify-mark { display:grid; place-items:center; width:34px; height:34px; border-radius:10px; color:#fff; background:linear-gradient(145deg,#f84982,#ba2460); box-shadow:0 8px 24px rgba(248,73,130,.18); font-size:18px; font-weight:950; font-style:italic; }
.leetify-view { padding:9px 13px; border:1px solid rgba(248,73,130,.48); border-radius:9px; color:#f84982; background:rgba(248,73,130,.055); cursor:pointer; font-size:11px; font-weight:850; }
.leetify-sample { justify-self:end; color:#758eb8; font-size:11px; }
.leetify-grid { grid-template-columns:repeat(6,minmax(0,1fr)); gap:22px; }
.leetify-grid .perf-item { min-width:0; padding:0; border:0; border-radius:0; background:transparent; }
.leetify-grid .perf-item h4 { font-size:13px; }
.leetify-grid .perf-item h4 small { color:#7186aa; font-size:9px; }
.leetify-grid .perf-value { margin:14px 0 12px; font-size:27px; text-align:center; }
.leetify-grid .perf-bar { height:7px; overflow:visible; background:rgba(123,144,174,.20); }
.leetify-grid .perf-bar i { background:linear-gradient(90deg,#ef3f7b,#f84982); }
.leetify-grid .perf-bar b { position:absolute; z-index:2; top:-4px; width:2px; height:15px; transform:translateX(-1px); border-radius:2px; background:#c4cfdf; box-shadow:0 0 0 1px rgba(5,13,24,.6); }
.leetify-grid .perf-foot { min-height:28px; margin-top:13px; color:#7e91b0; font-size:10px; line-height:1.35; }
.rating-item .perf-value { margin-bottom:15px; font-size:29px; }
.rating-sides { display:flex; justify-content:center; gap:12px; color:#8598b7; font-size:10px; }
.rating-sides b { color:#dfe8f5; }
.attribution-row a { color:#f84982; font-weight:800; }

@media (max-width:1180px) {
  .leetify-grid { grid-template-columns:repeat(3,1fr); row-gap:24px; }
}
@media (max-width:820px) {
  .competitive-grid { grid-template-columns:1fr; }
  .leetify-head { grid-template-columns:1fr auto; }
  .leetify-sample { grid-column:1/-1; justify-self:start; }
  .leetify-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:540px) {
  .premier-summary { grid-template-columns:1fr; }
  .leetify-grid { grid-template-columns:1fr; }
  .leetify-card { padding:17px; }
}

/* v0.1.5 profile rank board — compact map ranks + known Premier history */
.rank-board { display:grid; grid-template-columns:minmax(0,1fr) 138px; gap:12px; align-items:start; }
.profile-premier-stack { min-width:0; padding-left:12px; border-left:1px solid var(--border); }
.profile-premier-title { display:flex; align-items:baseline; justify-content:space-between; gap:8px; margin-bottom:8px; }
.profile-premier-title span { font-size:11px; font-weight:900; }
.profile-premier-title small { color:var(--muted-2); font-size:8px; text-transform:uppercase; letter-spacing:.07em; }
.profile-premier-history { display:grid; gap:7px; }
.profile-premier-chip { display:flex; align-items:center; justify-content:space-between; gap:8px; min-height:35px; padding:7px 9px; border:1px solid rgba(142,171,211,.13); border-radius:9px; background:linear-gradient(90deg,rgba(173,71,232,.16),rgba(112,38,133,.34)); }
.profile-premier-chip span { color:#9faed0; font-size:8px; text-transform:uppercase; letter-spacing:.06em; }
.profile-premier-chip strong { font-size:11px; }
.profile-premier-chip.current { border-color:rgba(220,77,255,.30); background:linear-gradient(90deg,rgba(203,66,242,.28),rgba(110,31,126,.48)); }
.profile-premier-chip.peak::after { content:'MAX'; color:#e5b8ff; font-size:7px; letter-spacing:.08em; }
.profile-premier-empty { display:grid; place-items:center; min-height:76px; color:var(--muted); border:1px dashed var(--border); border-radius:10px; font-size:10px; }
@media (max-width:820px) { .rank-board { grid-template-columns:1fr; } .profile-premier-stack { padding:12px 0 0; border-left:0; border-top:1px solid var(--border); } .profile-premier-history { grid-template-columns:repeat(2,1fr); } }

/* v0.1.6 — deterministic metric benchmarks and bundled CS rank icons */
.competitive-rank-icon {
  width: 48px;
  height: 28px;
  object-fit: contain;
  justify-self: end;
  filter: drop-shadow(0 4px 8px rgba(0,0,0,.28));
}
.metric-benchmark {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 38px;
}
.metric-benchmark img {
  flex: 0 0 auto;
  width: 46px;
  height: 28px;
  object-fit: contain;
  filter: drop-shadow(0 4px 8px rgba(0,0,0,.28));
}
.metric-benchmark div { min-width: 0; }
.metric-benchmark span {
  display: block;
  color: #8fa1bf;
  white-space: nowrap;
  font-size: 10px;
}
.metric-benchmark strong {
  display: inline-block;
  margin-left: 3px;
  padding: 3px 7px;
  border-left: 3px solid #ef3f7b;
  color: #e9f0fb;
  background: linear-gradient(90deg,rgba(239,63,123,.28),rgba(147,104,255,.16));
  font-size: 11px;
  font-weight: 900;
}
.metric-benchmark small {
  display: block;
  margin-top: 3px;
  overflow: hidden;
  color: #6f84a6;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 9px;
}
.metric-detail {
  display: block;
  margin-top: 7px;
  color: #607696;
  font-size: 9px;
  line-height: 1.35;
}
.leetify-grid .perf-foot { min-height: 63px; }
.leetify-grid .perf-item h4 small { margin-left: 4px; }

@media (max-width: 540px) {
  .competitive-rank-icon { width: 42px; }
  .metric-benchmark span { white-space: normal; }
}

/* v0.1.7 — honest unavailable-source states */
.leetify-unavailable {
  display:grid; gap:8px; place-items:center; min-height:150px; padding:26px;
  border:1px dashed rgba(248,73,130,.28); border-radius:16px;
  background:linear-gradient(145deg,rgba(248,73,130,.055),rgba(80,224,193,.025));
  text-align:center;
}
.leetify-unavailable strong { font-size:18px; color:#f4f7ff; }
.leetify-unavailable span { max-width:760px; color:#9bb0d1; font-size:13px; line-height:1.55; }
.leetify-unavailable small { max-width:760px; color:#7186aa; font-size:11px; line-height:1.5; }

/* v0.3.0 — Launch Lab identity, balanced dashboard and monetization rails */
:root {
  --brand-accent: #7c5cff;
  --brand-cyan: #23c9ff;
  --page-max: 1480px;
}
body::before {
  content:"";
  position:fixed;
  z-index:-2;
  inset:0;
  background:
    linear-gradient(rgba(101,126,170,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(101,126,170,.035) 1px,transparent 1px);
  background-size:48px 48px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.75),transparent 88%);
  pointer-events:none;
}
body::after {
  content:"";
  position:fixed;
  z-index:-1;
  width:680px;
  height:680px;
  right:-260px;
  top:-260px;
  border:1px solid rgba(124,92,255,.08);
  border-radius:50%;
  box-shadow:0 0 0 90px rgba(35,201,255,.018),0 0 0 180px rgba(124,92,255,.014);
  pointer-events:none;
}
.announcement-bar {
  position:relative;
  z-index:70;
  width:100%;
  padding:9px 18px;
  color:#dfe8ff;
  border-bottom:1px solid rgba(124,92,255,.22);
  background:linear-gradient(90deg,rgba(19,37,67,.97),rgba(42,24,78,.97),rgba(19,37,67,.97));
  text-align:center;
  font-size:12px;
  letter-spacing:.02em;
}
.site-layout {
  display:grid;
  grid-template-columns:160px minmax(0,var(--page-max)) 160px;
  gap:16px;
  width:min(1812px,calc(100% - 24px));
  margin:0 auto;
  align-items:start;
}
.shell { width:100%; margin:0; }
.ad-rail {
  position:sticky;
  top:106px;
  min-height:600px;
  margin-top:112px;
}
.ad-card {
  position:relative;
  display:block;
  width:160px;
  min-height:600px;
  overflow:hidden;
  border:1px solid rgba(142,171,211,.2);
  border-radius:20px;
  background:linear-gradient(180deg,rgba(14,28,48,.98),rgba(7,15,28,.98));
  box-shadow:0 22px 70px rgba(0,0,0,.34);
  transition:transform .2s ease,border-color .2s ease;
}
.ad-card:hover { transform:translateY(-2px); border-color:rgba(124,92,255,.48); }
.ad-label {
  position:absolute;
  z-index:2;
  top:10px;
  left:50%;
  transform:translateX(-50%);
  padding:5px 8px;
  color:rgba(230,237,255,.72);
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  background:rgba(3,9,18,.72);
  font-size:8px;
  letter-spacing:.12em;
  text-transform:uppercase;
  white-space:nowrap;
  backdrop-filter:blur(8px);
}
.ad-card img { display:block; width:100%; height:600px; object-fit:cover; }
.ad-placeholder {
  display:grid;
  place-content:center;
  gap:8px;
  width:100%;
  height:600px;
  padding:18px;
  color:#91a4c5;
  background:
    radial-gradient(circle at 30% 18%,rgba(35,201,255,.18),transparent 34%),
    radial-gradient(circle at 78% 72%,rgba(124,92,255,.22),transparent 36%),
    linear-gradient(160deg,#0c1b30,#080f1c);
  text-align:center;
}
.ad-placeholder::before { content:"LL"; font-size:36px; font-weight:950; letter-spacing:-.1em; color:#fff; opacity:.9; }
.ad-placeholder strong { color:#fff; font-size:15px; }
.ad-placeholder span { font-size:11px; }
.topbar {
  min-height:76px;
  border-color:rgba(142,171,211,.2);
  background:linear-gradient(105deg,rgba(7,18,33,.93),rgba(9,19,35,.89));
  box-shadow:0 18px 55px rgba(0,0,0,.32),inset 0 1px rgba(255,255,255,.025);
}
.brand-mark {
  width:46px;
  height:46px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.1);
  background:radial-gradient(circle at 45% 25%,rgba(35,201,255,.16),rgba(124,92,255,.08) 45%,rgba(4,10,19,.8));
  box-shadow:0 10px 34px rgba(86,91,255,.22);
}
.brand-mark img { width:42px; height:42px; object-fit:contain; }
.brand-copy strong { font-size:16px; }
.brand-copy span { color:#7387aa; }
.search button,.primary-btn { background:linear-gradient(135deg,#168eff,var(--brand-accent)); }
.card {
  border-color:rgba(141,167,207,.17);
  background:linear-gradient(155deg,rgba(15,31,53,.96),rgba(7,17,31,.98));
  box-shadow:0 22px 65px rgba(0,0,0,.24),inset 0 1px rgba(255,255,255,.018);
}
.card::after {
  content:"";
  position:absolute;
  pointer-events:none;
  left:0;
  right:0;
  top:0;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(35,201,255,.13),rgba(124,92,255,.16),transparent);
}
.dashboard { grid-template-columns:minmax(340px,1.18fr) repeat(3,minmax(210px,.82fr)); align-items:stretch; }
.profile-card,.metric-card { min-height:300px; }
.profile-card { padding:22px; }
.metric-card { display:flex; flex-direction:column; justify-content:center; padding:22px 18px; }
.avatar { width:104px; height:104px; }
.profile-main { gap:17px; }
.profile-copy h1 { font-size:25px; }
.rank-card { margin-top:12px; padding:20px 22px; }
.rank-card .competitive-panel { margin:0; padding:0; border:0; background:transparent; }
.rank-card .competitive-head { margin-bottom:15px; }
.rank-card .competitive-head strong { font-size:17px; }
.rank-card .rank-board { grid-template-columns:minmax(0,1fr) 240px; gap:20px; }
.rank-card .competitive-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
.rank-card .profile-premier-history { grid-template-columns:1fr; }
.leetify-card { background:linear-gradient(145deg,rgba(16,27,48,.98),rgba(8,17,31,.98)); }
.leetify-card::after { background:linear-gradient(90deg,transparent,rgba(248,73,130,.32),transparent); }
.site-footer {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  width:min(var(--page-max),calc(100% - 32px));
  margin:0 auto;
  padding:22px 4px 34px;
  color:#7387a8;
  font-size:11px;
}
.site-footer > div { display:flex; align-items:center; gap:10px; }
.site-footer img { width:28px; height:28px; object-fit:contain; opacity:.86; }
.footer-links { display:flex; gap:14px; }
.footer-links a { color:#91a8cd; }
.footer-links a:hover { color:#fff; }
.admin-public-link { padding-left:14px; border-left:1px solid var(--border); }
@media (max-width:1810px) {
  .site-layout { grid-template-columns:minmax(0,var(--page-max)); width:min(var(--page-max),calc(100% - 32px)); }
  .ad-rail { display:none!important; }
}
@media (max-width:1120px) {
  .dashboard { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .profile-card { grid-column:1/-1; }
  .rank-card .competitive-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:760px) {
  .site-layout { width:calc(100% - 20px); }
  .shell { padding-top:10px; }
  .topbar { top:8px; }
  .brand-copy { display:none; }
  .dashboard { grid-template-columns:1fr; }
  .profile-card { grid-column:auto; }
  .profile-card,.metric-card { min-height:0; }
  .rank-card .rank-board { grid-template-columns:1fr; }
  .rank-card .competitive-grid { grid-template-columns:1fr; }
  .site-footer { flex-direction:column; align-items:flex-start; width:calc(100% - 28px); }
}

/* v0.3.1 — hard logo containment and cache-safe header */
.brand-mark {
  position: relative;
  flex: 0 0 46px;
  isolation: isolate;
  overflow: hidden !important;
}
.brand-mark img {
  position: static !important;
  display: block !important;
  width: 40px !important;
  height: 40px !important;
  max-width: 40px !important;
  max-height: 40px !important;
  margin: 0 !important;
  object-fit: contain !important;
  transform: none !important;
}

/* v0.3.2 layout hotfix — keep the main page in the center grid column even when ad rails are hidden */
.site-layout {
  grid-template-columns: 160px minmax(0, var(--page-max)) 160px;
  justify-content: center;
}
.site-layout > .ad-rail-left { grid-column: 1; }
.site-layout > .shell {
  grid-column: 2;
  min-width: 0;
}
.site-layout > .ad-rail-right { grid-column: 3; }
.topbar,
.search,
.search-field { min-width: 0; }
.search button { flex: 0 0 auto; white-space: nowrap; }

@media (max-width: 1840px) {
  .site-layout {
    grid-template-columns: minmax(0, var(--page-max));
    width: min(var(--page-max), calc(100% - 32px));
  }
  .site-layout > .shell { grid-column: 1; }
  .ad-rail { display: none !important; }
}

@media (max-width: 980px) {
  .topbar { flex-wrap: wrap; }
  .brand { flex: 0 0 auto; }
  .search { order: 3; flex-basis: 100%; width: 100%; }
  .integration-pill { margin-left: auto; }
}

@media (max-width: 540px) {
  .site-layout { width: calc(100% - 20px); }
  .search button { width: 100%; }
}


/* v0.3.3 — adaptive advertising rails.
   Ads are visible on normal desktop widths instead of only at 1840px+. */
.site-layout {
  grid-template-columns: minmax(0, var(--page-max));
  width: min(var(--page-max), calc(100% - 24px));
}
.site-layout > .shell { grid-column: 1; }

@media (min-width: 1180px) {
  .site-layout.has-left-ad,
  .site-layout.has-right-ad {
    width: calc(100% - 24px);
    max-width: 1812px;
  }

  .site-layout.has-left-ad.has-right-ad {
    grid-template-columns: 160px minmax(0, var(--page-max)) 160px;
  }
  .site-layout.has-left-ad:not(.has-right-ad) {
    grid-template-columns: 160px minmax(0, var(--page-max));
    max-width: 1648px;
  }
  .site-layout.has-right-ad:not(.has-left-ad) {
    grid-template-columns: minmax(0, var(--page-max)) 160px;
    max-width: 1648px;
  }

  .site-layout.has-left-ad > .ad-rail-left,
  .site-layout.has-right-ad > .ad-rail-right {
    display: block !important;
  }
  .site-layout.has-left-ad > .ad-rail-left { grid-column: 1; }
  .site-layout.has-left-ad.has-right-ad > .shell,
  .site-layout.has-left-ad:not(.has-right-ad) > .shell { grid-column: 2; }
  .site-layout.has-right-ad:not(.has-left-ad) > .shell { grid-column: 1; }
  .site-layout.has-left-ad.has-right-ad > .ad-rail-right { grid-column: 3; }
  .site-layout.has-right-ad:not(.has-left-ad) > .ad-rail-right { grid-column: 2; }
}

/* When two 160x600 rails consume desktop width, switch the dashboard to the
   compact two-column layout instead of squeezing four cards. */
@media (min-width: 1180px) and (max-width: 1540px) {
  .site-layout.has-left-ad.has-right-ad .dashboard {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .site-layout.has-left-ad.has-right-ad .profile-card {
    grid-column: 1 / -1;
  }
  .site-layout.has-left-ad.has-right-ad .rank-card .competitive-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .site-layout.has-left-ad.has-right-ad .leetify-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 1179px) {
  .site-layout {
    grid-template-columns: minmax(0, var(--page-max)) !important;
    width: min(var(--page-max), calc(100% - 24px));
  }
  .site-layout > .shell { grid-column: 1 !important; }
  .ad-rail { display: none !important; }
}

/* Public aggregate statistics card layout */
.provider-card { margin-top:12px; padding:22px; }
.provider-head { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:16px; }
.provider-title-wrap { display:flex; align-items:center; gap:12px; min-width:0; }
.provider-title-wrap h2 { margin:0; font-size:17px; }
.provider-title-wrap span:not(.provider-mark) { display:block; margin-top:4px; color:var(--muted); font-size:11px; line-height:1.4; }
.provider-mark { display:grid; place-items:center; width:36px; height:36px; flex:0 0 auto; border-radius:11px; color:#fff; font-weight:950; background:linear-gradient(145deg,#1779ff,#714cff); box-shadow:0 10px 24px rgba(53,111,255,.2); }
.provider-grid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:10px; }
.provider-stat { min-width:0; padding:14px; border:1px solid var(--border); border-radius:14px; background:rgba(255,255,255,.02); }
.provider-stat span { display:block; color:var(--muted-2); font-size:9px; letter-spacing:.08em; text-transform:uppercase; }
.provider-stat strong { display:block; margin-top:8px; overflow-wrap:anywhere; font-size:20px; }
.provider-foot { margin-top:13px; color:var(--muted); font-size:10px; line-height:1.45; }
.provider-card.is-unavailable .provider-head { margin-bottom:0; }
.provider-card.is-unavailable .provider-title-wrap span:not(.provider-mark) { color:var(--yellow); }

@media (max-width: 1050px) {
  .provider-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
}
@media (max-width: 720px) {
  .provider-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .provider-head { align-items:flex-start; }
}

/* v0.3.8 — visual patch 01: profile sources, explainable AI and normalized TTD */
.sr-only {
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}

.dashboard { align-items:stretch; }
.profile-card,.metric-card { min-height:390px; }
.profile-card {
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:20px;
  padding:24px;
}
.profile-main { flex:1; align-items:center; }
.profile-copy {
  display:flex;
  min-width:0;
  flex:1;
  flex-direction:column;
  align-items:flex-start;
}
.profile-copy h1 {
  width:100%;
  margin-top:2px;
  font-size:28px;
  letter-spacing:-.025em;
}
.steam-id {
  margin-top:8px;
  color:#78a9ee;
  font-weight:750;
  letter-spacing:.015em;
}
.status-row { margin-bottom:9px; gap:7px; }
.status-badge,.source-badge {
  min-height:28px;
  display:inline-flex;
  align-items:center;
  padding:5px 9px;
  border:1px solid rgba(139,164,203,.15);
  border-radius:8px;
  font-size:10px;
  font-weight:850;
  line-height:1;
  letter-spacing:.055em;
}
.status-badge { border-color:rgba(80,224,193,.38); }
.leetify-chip { color:#fff; border-color:rgba(248,73,130,.38); background:rgba(248,73,130,.08); }

.profile-links {
  display:flex;
  width:100%;
  gap:9px;
  margin-top:18px;
  align-items:center;
}
.icon-btn.source-button {
  position:relative;
  width:43px;
  min-width:43px;
  height:43px;
  padding:0;
  overflow:visible;
  border-color:rgba(139,164,203,.23);
  border-radius:13px;
  color:#91a7c7;
  background:linear-gradient(145deg,rgba(22,42,68,.8),rgba(8,19,33,.8));
  box-shadow:inset 0 1px rgba(255,255,255,.025);
}
.icon-btn.source-button svg { width:22px; height:22px; fill:currentColor; }
.icon-btn.source-button:hover,
.icon-btn.source-button:focus-visible {
  z-index:3;
  color:#fff;
  border-color:rgba(115,169,255,.56);
  background:linear-gradient(145deg,rgba(35,67,108,.9),rgba(10,25,44,.94));
  transform:translateY(-2px);
  box-shadow:0 10px 24px rgba(0,0,0,.24),0 0 20px rgba(66,165,255,.09);
  outline:none;
}
.icon-btn.source-button::after {
  content:attr(data-tooltip);
  position:absolute;
  z-index:9;
  left:50%;
  bottom:calc(100% + 9px);
  max-width:180px;
  padding:7px 9px;
  border:1px solid rgba(139,164,203,.25);
  border-radius:8px;
  color:#eaf3ff;
  background:#071321;
  box-shadow:0 12px 28px rgba(0,0,0,.35);
  font-size:10px;
  font-weight:750;
  line-height:1.2;
  white-space:nowrap;
  opacity:0;
  transform:translate(-50%,5px);
  pointer-events:none;
  transition:.16s ease;
}
.icon-btn.source-button:hover::after,
.icon-btn.source-button:focus-visible::after { opacity:1; transform:translate(-50%,0); }
.source-monogram { display:grid; place-items:center; font-weight:950; line-height:1; }
.leetify-monogram { width:24px; height:24px; border-radius:7px; color:white; background:linear-gradient(135deg,#ff4f8b,#aa56ff); font-size:15px; font-style:italic; }
.csstats-monogram { color:#d8e6fb; font-size:12px; letter-spacing:-.06em; }
.steam-source:hover { color:#66c0f4!important; }
.faceit-source:hover { color:#ff6b21!important; }
.leetify-source:hover { border-color:rgba(248,73,130,.62)!important; }
.copy-source { margin-left:auto; }
.copy-source:hover { color:var(--cyan)!important; border-color:rgba(80,224,193,.52)!important; }

.mini-grid { gap:10px; margin-top:0; }
.mini-stat {
  display:flex;
  min-height:78px;
  flex-direction:column;
  justify-content:center;
  padding:13px 14px;
  border-color:rgba(139,164,203,.2);
  background:linear-gradient(145deg,rgba(5,17,31,.42),rgba(10,25,43,.5));
}
.mini-stat span { min-height:22px; line-height:1.2; }
.mini-stat strong { margin-top:6px; font-size:20px; line-height:1.08; overflow-wrap:anywhere; }

.metric-card {
  min-width:0;
  justify-content:flex-start;
  padding:23px 20px 20px;
  cursor:default;
}
.metric-card.risk { cursor:pointer; }
.metric-title { font-weight:900; }
.metric-ring {
  width:130px;
  height:130px;
  margin:16px auto 9px;
  background:conic-gradient(from 0deg,var(--ring) calc(var(--value) * 1%),rgba(139,164,203,.12) 0);
  box-shadow:0 0 0 1px rgba(255,255,255,.018),0 0 24px color-mix(in srgb,var(--ring) 15%,transparent);
  transition:background .35s ease,box-shadow .35s ease;
}
.metric-ring::before {
  width:100px;
  height:100px;
  background:radial-gradient(circle at 48% 35%,#102238,#091625 72%);
  box-shadow:inset 0 0 26px rgba(0,0,0,.36),0 0 0 1px rgba(255,255,255,.025);
}
.ring-content strong { font-size:30px; letter-spacing:-.045em; }
.ring-content small { color:#7e96ba; font-weight:750; }
.metric-label { margin-top:2px; font-size:15px; }
.metric-note { min-height:35px; margin-top:6px; font-size:11px; line-height:1.42; }

.metric-explainer {
  width:100%;
  margin-top:14px;
  padding-top:13px;
  border-top:1px solid rgba(139,164,203,.13);
  text-align:left;
}
.metric-explainer-title {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:9px;
  color:#dce9f8;
  font-size:10px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.metric-explainer-title em { color:#647b9e; font-size:8px; font-style:normal; letter-spacing:.03em; }
.metric-reasons {
  display:grid;
  gap:5px;
  min-height:59px;
  margin:0;
  padding:0;
  list-style:none;
}
.metric-reasons li {
  position:relative;
  padding-left:16px;
  color:#8fa5c6;
  font-size:10px;
  line-height:1.35;
}
.metric-reasons li::before {
  content:"";
  position:absolute;
  left:1px;
  top:.42em;
  width:6px;
  height:6px;
  border-radius:50%;
  background:#607794;
  box-shadow:0 0 8px rgba(96,119,148,.35);
}
.metric-reasons li.positive::before { background:var(--cyan); box-shadow:0 0 9px rgba(80,224,193,.35); }
.metric-reasons li.warning::before { background:var(--yellow); box-shadow:0 0 9px rgba(255,196,81,.32); }
.metric-meta-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:6px;
  margin-top:11px;
}
.metric-meta-grid.two-columns { grid-template-columns:repeat(2,minmax(0,1fr)); }
.metric-meta-grid > div {
  min-width:0;
  padding:8px 9px;
  border:1px solid rgba(139,164,203,.14);
  border-radius:10px;
  background:rgba(3,12,22,.28);
}
.metric-meta-grid span { display:block; color:#687f9f; font-size:8px; font-weight:850; letter-spacing:.065em; text-transform:uppercase; }
.metric-meta-grid strong {
  display:block;
  margin-top:4px;
  overflow:hidden;
  color:#dce9f8;
  font-size:10px;
  line-height:1.25;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.metric-card[data-risk-level="low"] { border-color:rgba(80,224,193,.22); }
.metric-card[data-risk-level="medium"] { border-color:rgba(255,196,81,.25); }
.metric-card[data-risk-level="high"] { border-color:rgba(255,92,122,.3); }

.ttd-explainer { margin-top:auto; }
.ttd-scale {
  display:grid;
  grid-template-columns:auto minmax(48px,1fr) auto;
  align-items:center;
  gap:7px;
  color:#677d9d;
  font-size:8px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.05em;
}
.ttd-scale-track {
  position:relative;
  height:5px;
  border-radius:99px;
  background:linear-gradient(90deg,var(--cyan),#61a8ff 35%,var(--yellow) 65%,var(--red));
  opacity:.78;
}
.ttd-scale-track i {
  position:absolute;
  top:50%;
  width:10px;
  height:10px;
  border:2px solid #07111f;
  border-radius:50%;
  background:white;
  box-shadow:0 0 0 1px rgba(255,255,255,.35),0 0 9px rgba(255,255,255,.25);
  transform:translate(-50%,-50%);
  transition:left .35s ease;
}
.metric-card.win { justify-content:center; }

@media (max-width:1320px) {
  .profile-card,.metric-card { min-height:410px; }
  .metric-meta-grid { grid-template-columns:1fr; }
  .metric-meta-grid.two-columns { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .metric-meta-grid > div { display:flex; align-items:center; justify-content:space-between; gap:8px; }
  .metric-meta-grid strong { margin-top:0; text-align:right; }
  .metric-reasons { min-height:72px; }
}
@media (max-width:1120px) {
  .profile-card,.metric-card { min-height:380px; }
  .metric-meta-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .metric-meta-grid > div { display:block; }
  .metric-meta-grid strong { margin-top:4px; text-align:left; }
}
@media (max-width:760px) {
  .profile-card,.metric-card { min-height:0; }
  .profile-main { align-items:flex-start; }
  .profile-links { gap:8px; }
  .icon-btn.source-button { width:41px; min-width:41px; height:41px; }
  .metric-meta-grid { grid-template-columns:1fr; }
  .metric-meta-grid.two-columns { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .metric-meta-grid > div { display:flex; align-items:center; justify-content:space-between; }
  .metric-meta-grid strong { margin-top:0; text-align:right; }
}
@media (max-width:470px) {
  .profile-main { flex-direction:column; }
  .profile-links { flex-wrap:wrap; }
  .copy-source { margin-left:0; }
  .mini-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

/* v0.3.9 — original provider marks, statistics-only analysis, equal dashboard tiles */
.dashboard > .profile-card,
.dashboard > .metric-card {
  align-self: stretch;
  height: 100%;
}
.dashboard .metric-card { align-self: stretch; }

.source-logo {
  display: block;
  width: 27px;
  height: 27px;
  flex: 0 0 auto;
  object-fit: contain;
  object-position: center;
  pointer-events: none;
  transition: transform .16s ease, opacity .16s ease;
}
.source-button:hover .source-logo,
.source-button:focus-visible .source-logo { transform: scale(1.06); }
.source-logo.faceit-logo { width: 29px; height: 29px; }
.source-logo.leetify-logo { width: 27px; height: 27px; }
.source-logo.steam-logo { width: 27px; height: 27px; }
.source-logo.csstats-logo { width: 29px; height: 29px; image-rendering: auto; }
.icon-btn.source-button svg { width: 21px; height: 21px; }

/* Brand artwork keeps its original colours; hover changes only the surrounding button. */
.steam-source:hover,
.faceit-source:hover { color: inherit !important; }

@media (min-width: 821px) {
  .dashboard > .profile-card,
  .dashboard > .metric-card { min-height: 430px; }
}
@media (max-width: 820px) {
  .dashboard > .profile-card,
  .dashboard > .metric-card { height: auto; min-height: 0; }
}

/* CSStats public profile integration */
.csstats-card { margin-top:12px; }
.csstats-mark { padding:6px; background:linear-gradient(145deg,#18243a,#25344e); }
.csstats-mark img { width:100%; height:100%; object-fit:contain; }
.csstats-details { display:grid; grid-template-columns:1fr 1fr 1.25fr; gap:12px; margin-top:14px; }
.csstats-panel { min-width:0; padding:15px; border:1px solid var(--border); border-radius:14px; background:rgba(255,255,255,.018); }
.csstats-panel h3 { margin:0 0 12px; font-size:13px; letter-spacing:.05em; text-transform:uppercase; }
.csstats-chip-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.csstats-chip-grid > div { min-width:0; padding:10px; border:1px solid rgba(143,174,214,.14); border-radius:11px; background:rgba(3,12,25,.3); }
.csstats-chip-grid span { display:block; color:var(--muted-2); font-size:8px; letter-spacing:.07em; text-transform:uppercase; }
.csstats-chip-grid b { display:block; margin-top:5px; font-size:14px; }
.csstats-leader-columns { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.csstats-leader-columns > div > span { color:var(--muted-2); font-size:9px; letter-spacing:.06em; text-transform:uppercase; }
.csstats-leader-columns ul { display:grid; gap:6px; margin:9px 0 0; padding:0; list-style:none; }
.csstats-leader-columns li { display:flex; justify-content:space-between; gap:10px; padding:7px 9px; border-radius:9px; background:rgba(255,255,255,.025); font-size:11px; }
.csstats-leader-columns li span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-transform:capitalize; }
.csstats-leader-columns li b { color:var(--text); }
@media (max-width:1050px) { .csstats-details { grid-template-columns:1fr 1fr; } .csstats-leaders { grid-column:1/-1; } }
@media (max-width:680px) { .csstats-details { grid-template-columns:1fr; } .csstats-leaders { grid-column:auto; } .csstats-chip-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .csstats-leader-columns { grid-template-columns:1fr; } }


/* v0.3.16 — map artwork and Premier season layout */
.rank-card .competitive-head > div { display:grid; gap:4px; }
.rank-card .competitive-head small { color:var(--muted); font-size:10px; font-weight:500; }
.rank-card .rank-board { grid-template-columns:minmax(0,1fr) 310px; align-items:stretch; }
.rank-card .competitive-grid { grid-template-columns:repeat(4,minmax(0,1fr)); align-content:start; }
.competitive-rank {
  grid-template-columns:54px minmax(0,1fr) 52px;
  min-height:66px;
  padding:7px 9px;
  overflow:hidden;
  background:linear-gradient(135deg,rgba(28,48,76,.54),rgba(8,18,32,.86));
}
.competitive-rank:hover { border-color:rgba(83,204,255,.24); transform:translateY(-1px); }
.map-visual {
  position:relative;
  display:grid;
  place-items:center;
  width:50px;
  height:50px;
  overflow:hidden;
  border:1px solid rgba(151,179,220,.16);
  border-radius:13px;
  background:radial-gradient(circle at 40% 25%,rgba(91,147,208,.34),rgba(8,17,30,.9));
}
.map-visual::after { content:""; position:absolute; inset:auto 5px 4px; height:5px; border-radius:50%; background:rgba(0,0,0,.35); filter:blur(4px); }
.map-visual span { color:#8ea4c5; font-size:10px; font-weight:900; }
.map-visual img { position:absolute; z-index:1; width:44px; height:44px; object-fit:contain; filter:drop-shadow(0 5px 8px rgba(0,0,0,.45)); }
.competitive-rank-copy { min-width:0; }
.competitive-rank-copy strong { font-size:12px; }
.competitive-rank-copy small { font-size:9px; }
.rank-card .competitive-rank-icon { width:52px; height:30px; }
.profile-premier-stack { padding-left:18px; }
.profile-premier-title span { font-size:12px; }
.profile-premier-history { gap:8px; }
.profile-premier-chip {
  min-height:47px;
  padding:8px 10px;
  background:linear-gradient(100deg,rgba(133,61,200,.20),rgba(50,30,88,.40));
}
.profile-premier-chip > div { display:grid; gap:3px; min-width:0; }
.profile-premier-chip > div:last-child { justify-items:end; }
.profile-premier-chip span { color:#d8c7ed; font-size:9px; font-weight:850; }
.profile-premier-chip strong { font-size:13px; }
.profile-premier-chip small { color:#8194b3; font-size:8px; text-transform:uppercase; letter-spacing:.04em; }
.profile-premier-chip.current { border-color:rgba(190,91,255,.38); background:linear-gradient(100deg,rgba(169,64,230,.34),rgba(70,35,108,.54)); }
.profile-premier-chip.peak::after { display:none; }
.premier-card { padding:22px; }
.premier-card .section-head { margin-bottom:10px; }
.premier-layout { display:grid; grid-template-columns:minmax(210px,.85fr) minmax(310px,1.15fr); gap:18px; min-height:250px; }
.premier-overview { min-width:0; padding-right:18px; border-right:1px solid var(--border); }
.premier-card .rank-hero { margin:14px 0 12px; }
.premier-current-meta { padding:10px 12px; border:1px solid rgba(111,153,207,.13); border-radius:11px; color:#8196b7; background:rgba(255,255,255,.018); font-size:10px; line-height:1.45; }
.premier-card .empty-state { min-height:95px; margin-top:12px; }
.premier-season-detail { min-width:0; }
.premier-season-head { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:9px; }
.premier-season-head strong { font-size:12px; }
.premier-season-head span { color:var(--muted-2); font-size:8px; text-transform:uppercase; letter-spacing:.07em; }
.premier-season-list { display:grid; gap:7px; }
.premier-season-row {
  display:grid;
  grid-template-columns:minmax(92px,1.2fr) repeat(3,minmax(58px,.72fr));
  align-items:center;
  gap:8px;
  min-height:47px;
  padding:7px 9px;
  border:1px solid rgba(139,168,207,.13);
  border-radius:11px;
  background:rgba(255,255,255,.018);
}
.premier-season-row.current { border-color:rgba(79,202,255,.28); background:linear-gradient(90deg,rgba(29,146,208,.14),rgba(113,65,207,.10)); }
.premier-season-row > div { min-width:0; }
.premier-season-row span { display:block; color:#7085a7; font-size:8px; text-transform:uppercase; letter-spacing:.06em; }
.premier-season-row strong { display:block; margin-top:3px; overflow:hidden; color:#edf4ff; text-overflow:ellipsis; white-space:nowrap; font-size:12px; }
.premier-season-name span { color:#dfe9f8; font-size:10px; font-weight:900; }
.premier-season-name small { display:block; margin-top:4px; overflow:hidden; color:#7187a8; text-overflow:ellipsis; white-space:nowrap; font-size:8px; }
.premier-season-empty { display:grid; place-items:center; min-height:140px; padding:18px; border:1px dashed var(--border); border-radius:12px; color:var(--muted); text-align:center; font-size:10px; }
@media (max-width:1250px) {
  .rank-card .competitive-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .rank-card .rank-board { grid-template-columns:minmax(0,1fr) 280px; }
  .premier-layout { grid-template-columns:1fr; }
  .premier-overview { padding:0 0 14px; border-right:0; border-bottom:1px solid var(--border); }
}
@media (max-width:820px) {
  .rank-card .rank-board { grid-template-columns:1fr; }
  .profile-premier-stack { padding:15px 0 0; border-left:0; border-top:1px solid var(--border); }
  .profile-premier-history { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:560px) {
  .rank-card .competitive-grid,.profile-premier-history { grid-template-columns:1fr; }
  .premier-season-row { grid-template-columns:1fr 1fr; }
  .premier-season-name { grid-column:1/-1; }
}


/* v0.3.17 — original Premier emblem and CS Rating tier colors */
:root {
  --premier-unrated:#748196;
  --premier-gray:#a8afb9;
  --premier-cyan:#6cc7ff;
  --premier-blue:#5c7cff;
  --premier-purple:#a85cff;
  --premier-pink:#e850d8;
  --premier-red:#ef5b60;
  --premier-gold:#e2b94f;
}
.premier-emblem {
  position:relative;
  display:grid;
  grid-template-columns:1fr auto;
  grid-template-rows:auto auto;
  align-items:center;
  width:126px;
  height:82px;
  padding:10px 11px 9px;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--premier-tier,var(--premier-unrated)) 38%,transparent);
  border-radius:16px;
  background:linear-gradient(145deg,color-mix(in srgb,var(--premier-tier,var(--premier-unrated)) 17%,#0d1b2d),#07111f 76%);
  box-shadow:0 0 0 5px color-mix(in srgb,var(--premier-tier,var(--premier-unrated)) 7%,transparent),0 13px 30px rgba(0,0,0,.28);
}
.premier-emblem img { grid-column:1/2; width:78px; height:auto; object-fit:contain; filter:drop-shadow(0 4px 6px rgba(0,0,0,.35)); }
.premier-emblem strong { grid-column:1/2; align-self:end; margin-top:2px; color:#fff; font-size:18px; line-height:1; text-align:left; }
.premier-emblem small { grid-column:1/-1; overflow:hidden; color:color-mix(in srgb,var(--premier-tier,var(--premier-unrated)) 72%,#fff); font-size:7px; font-weight:850; letter-spacing:.05em; text-overflow:ellipsis; text-transform:uppercase; white-space:nowrap; }
.premier-emblem-bars { grid-column:2/3; grid-row:1/3; display:flex; align-self:stretch; gap:4px; padding-left:7px; }
.premier-emblem-bars i,.premier-mini-emblem i { display:block; width:4px; border-radius:4px; background:var(--premier-tier,var(--premier-unrated)); box-shadow:0 0 10px color-mix(in srgb,var(--premier-tier,var(--premier-unrated)) 60%,transparent); transform:skew(-9deg); }
.tier-unrated,[data-premier-tier="unrated"] { --premier-tier:var(--premier-unrated); }
.tier-gray,[data-premier-tier="gray"] { --premier-tier:var(--premier-gray); }
.tier-cyan,[data-premier-tier="cyan"] { --premier-tier:var(--premier-cyan); }
.tier-blue,[data-premier-tier="blue"] { --premier-tier:var(--premier-blue); }
.tier-purple,[data-premier-tier="purple"] { --premier-tier:var(--premier-purple); }
.tier-pink,[data-premier-tier="pink"] { --premier-tier:var(--premier-pink); }
.tier-red,[data-premier-tier="red"] { --premier-tier:var(--premier-red); }
.tier-gold,[data-premier-tier="gold"] { --premier-tier:var(--premier-gold); }
.premier-mini-emblem {
  position:relative;
  display:grid;
  grid-template-columns:1fr auto auto;
  align-items:stretch;
  flex:0 0 68px;
  width:68px;
  height:30px;
  padding:4px 5px;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--premier-tier) 34%,rgba(255,255,255,.08));
  border-radius:7px;
  background:linear-gradient(130deg,color-mix(in srgb,var(--premier-tier) 16%,#142035),#08111f 80%);
}
.premier-mini-emblem img { align-self:center; width:47px; height:auto; object-fit:contain; filter:drop-shadow(0 2px 3px rgba(0,0,0,.42)); }
.premier-mini-emblem i { width:3px; margin-left:2px; }
.profile-premier-chip { display:grid; grid-template-columns:68px minmax(0,1fr) auto; }
.profile-premier-chip > div:last-child { justify-items:end; }
.profile-premier-chip[data-premier-tier] { border-left:2px solid var(--premier-tier); }
.premier-season-name { display:flex; align-items:center; gap:9px; }
.premier-season-name > div { min-width:0; }
.premier-season-row[data-premier-tier] { border-left:2px solid var(--premier-tier); }
.premier-season-row[data-premier-tier] strong { text-shadow:0 0 14px color-mix(in srgb,var(--premier-tier) 24%,transparent); }
@media (max-width:560px) {
  .premier-emblem { width:116px; }
  .profile-premier-chip { grid-template-columns:62px minmax(0,1fr) auto; }
  .premier-mini-emblem { width:62px; flex-basis:62px; }
  .premier-mini-emblem img { width:42px; }
}

/* v0.3.18 — Premier season completeness and card-container responsiveness */
.premier-card { container-type:inline-size; }
@container (max-width:720px) {
  .premier-layout { grid-template-columns:1fr; }
  .premier-overview { padding:0 0 14px; border-right:0; border-bottom:1px solid var(--border); }
}
@container (max-width:500px) {
  .premier-season-row { grid-template-columns:1fr 1fr; }
  .premier-season-name { grid-column:1/-1; }
}


/* v0.3.19 — exact Premier rating plates and stable two-row secondary layout */
.secondary-grid {
  grid-template-columns:repeat(2,minmax(0,1fr));
  align-items:start;
}
.secondary-grid > .premier-card {
  grid-column:1/-1;
  min-height:0;
}
.secondary-grid > .section-card:not(.premier-card) { min-height:360px; }
.premier-layout { grid-template-columns:minmax(260px,.72fr) minmax(0,1.7fr); align-items:start; }
.premier-season-list { grid-template-columns:repeat(2,minmax(0,1fr)); }
.premier-season-row {
  grid-template-columns:minmax(92px,1fr) 92px 92px 58px;
  min-height:76px;
  padding:10px 11px;
}
.premier-season-name { display:block; }
.premier-season-rating > span,
.premier-season-sample > span { margin-bottom:5px; }
.premier-season-sample { align-self:center; }
.premier-season-sample strong { font-size:15px; }

.premier-rating-plate-host {
  display:grid !important;
  place-items:center !important;
  width:132px !important;
  height:auto !important;
  min-height:86px;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:none !important;
  box-shadow:none !important;
}
.premier-rating-plate-host > small {
  margin-top:5px;
  color:var(--muted);
  font-size:8px;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.premier-rating-plate {
  --premier-tier:var(--premier-unrated);
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) 13px;
  align-items:center;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--premier-tier) 55%,rgba(255,255,255,.13));
  background:linear-gradient(145deg,color-mix(in srgb,var(--premier-tier) 24%,#101827),#070d17 76%);
  box-shadow:inset 0 1px rgba(255,255,255,.08),0 7px 18px rgba(0,0,0,.22);
}
.premier-rating-plate::after {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(105deg,rgba(255,255,255,.08),transparent 35% 68%,color-mix(in srgb,var(--premier-tier) 16%,transparent));
}
.premier-rating-plate img {
  position:absolute;
  left:7px;
  top:5px;
  width:58%;
  height:auto;
  opacity:.72;
  object-fit:contain;
  filter:drop-shadow(0 2px 4px rgba(0,0,0,.4));
}
.premier-rating-plate strong {
  position:relative;
  z-index:1;
  align-self:end;
  overflow:visible;
  color:#fff;
  font-variant-numeric:tabular-nums;
  line-height:1;
  text-align:center;
  text-shadow:0 0 12px color-mix(in srgb,var(--premier-tier) 42%,transparent),0 2px 4px rgba(0,0,0,.7);
  white-space:nowrap;
}
.premier-rating-bars {
  position:relative;
  z-index:1;
  display:flex;
  align-self:stretch;
  justify-content:flex-end;
  gap:3px;
  padding:5px 3px 5px 0;
}
.premier-rating-bars i {
  display:block;
  width:4px;
  border-radius:4px;
  background:var(--premier-tier);
  box-shadow:0 0 9px color-mix(in srgb,var(--premier-tier) 65%,transparent);
  transform:skew(-8deg);
}
.premier-rating-plate-large { width:126px; height:80px; padding:10px 8px 8px; border-radius:15px; }
.premier-rating-plate-large img { left:10px; top:8px; width:76px; }
.premier-rating-plate-large strong { padding:0 2px 5px; font-size:22px; }
.premier-rating-plate-small { width:84px; height:35px; padding:5px 4px 4px; border-radius:7px; }
.premier-rating-plate-small img { left:5px; top:4px; width:47px; }
.premier-rating-plate-small strong { padding:0 1px 3px; font-size:10px; }
.premier-rating-plate-small .premier-rating-bars { gap:2px; padding:3px 1px 3px 0; }
.premier-rating-plate-small .premier-rating-bars i { width:3px; }
.premier-rating-plate-tiny { width:68px; height:29px; padding:4px 3px 3px; border-radius:6px; }
.premier-rating-plate-tiny img { left:4px; top:3px; width:39px; }
.premier-rating-plate-tiny strong { padding:0 0 2px; font-size:9px; }
.premier-rating-plate-tiny .premier-rating-bars { gap:2px; padding:3px 1px 3px 0; }
.premier-rating-plate-tiny .premier-rating-bars i { width:2px; }

.profile-premier-chip {
  grid-template-columns:minmax(72px,1fr) auto;
  align-items:center;
  min-height:61px;
}
.profile-premier-copy { min-width:0; }
.profile-premier-copy span { display:block; }
.profile-premier-values { display:grid !important; grid-template-columns:repeat(2,68px); gap:6px; }
.profile-premier-values > div { display:grid; gap:3px; justify-items:center; }
.profile-premier-values small { color:#7f91ad; font-size:7px; line-height:1; text-transform:uppercase; }
.profile-premier-chip[data-premier-tier] { border-left:2px solid var(--premier-tier); }

@media (max-width:1120px) {
  .premier-layout { grid-template-columns:1fr; }
  .premier-overview { padding:0 0 14px; border-right:0; border-bottom:1px solid var(--border); }
  .premier-season-list { grid-template-columns:1fr; }
}
@media (max-width:760px) {
  .secondary-grid { grid-template-columns:1fr; }
  .secondary-grid > .premier-card { grid-column:auto; }
  .secondary-grid > .section-card:not(.premier-card) { min-height:0; }
  .profile-premier-values { grid-template-columns:repeat(2,62px); }
  .premier-rating-plate-tiny { width:62px; }
}
@container (max-width:540px) {
  .premier-season-list { grid-template-columns:1fr; }
  .premier-season-row { grid-template-columns:1fr 1fr; }
  .premier-season-name { grid-column:1/-1; }
  .premier-season-sample { grid-column:1/-1; display:flex; align-items:center; justify-content:space-between; }
}

/* v0.3.22 — exact Premier backgrounds exported from CS2, with the rating overlaid */
.premier-rating-plate {
  --premier-tier:var(--premier-unrated);
  position:relative;
  display:inline-block;
  overflow:visible;
  box-sizing:border-box;
  flex:0 0 auto;
  background:transparent;
  border:0;
  border-radius:0;
  box-shadow:none;
  filter:drop-shadow(0 2px 4px rgba(0,0,0,.42));
  isolation:isolate;
}
.premier-rating-plate::before,
.premier-rating-plate::after { display:none; }
.premier-rating-bg {
  position:absolute;
  inset:0;
  z-index:0;
  display:block;
  width:100%;
  height:100%;
  object-fit:fill;
  pointer-events:none;
}
.premier-rating-texture {
  position:absolute;
  z-index:1;
  left:17.5%;
  top:8%;
  width:78%;
  height:84%;
  object-fit:fill;
  opacity:.34;
  mix-blend-mode:screen;
  pointer-events:none;
}
.premier-rating-plate strong {
  position:absolute;
  z-index:3;
  left:59%;
  top:51%;
  width:68%;
  transform:translate(-50%,-50%);
  padding:0;
  color:#fff;
  font-weight:950;
  font-style:italic;
  font-variant-numeric:tabular-nums;
  letter-spacing:-.055em;
  line-height:1;
  text-align:center;
  white-space:nowrap;
  text-shadow:0 2px 3px rgba(0,0,0,.96),0 0 7px color-mix(in srgb,var(--premier-tier) 58%,transparent);
}
.premier-rating-bars { display:none !important; }
.premier-rating-plate-large { width:134px; height:48px; }
.premier-rating-plate-large strong { font-size:19px; }
.premier-rating-plate-small { width:78px; height:28px; }
.premier-rating-plate-small strong { font-size:10.5px; }
.premier-rating-plate-tiny { width:70px; height:25px; }
.premier-rating-plate-tiny strong { font-size:9.5px; }
.premier-rating-plate-host { width:140px !important; min-height:68px; }
.premier-rating-plate-host > small { margin-top:5px; }
.profile-premier-values { grid-template-columns:repeat(2,70px); gap:7px; }
.premier-season-row { grid-template-columns:minmax(92px,1fr) 82px 82px 58px; }
.premier-season-rating { justify-items:center; }
.premier-season-rating > span { text-align:center; }
@media (max-width:760px) {
  .profile-premier-values { grid-template-columns:repeat(2,66px); }
  .premier-rating-plate-tiny { width:66px; height:24px; }
}


/* v0.3.23 — tune Premier badges to match the in-game / reference look more closely */
:root {
  --premier-gray:#a0a6b7;
  --premier-cyan:#71c7ff;
  --premier-blue:#4c63ff;
  --premier-purple:#b05cff;
  --premier-pink:#ff2fd2;
  --premier-red:#ff4343;
  --premier-gold:#efc84e;
}
.premier-rating-plate {
  filter:drop-shadow(0 3px 6px rgba(0,0,0,.34));
}
.premier-rating-bg {
  object-fit:contain;
}
.premier-rating-texture { display:none !important; }
.premier-rating-plate strong {
  left:59%;
  top:49.6%;
  width:64%;
  font-family:Inter,Segoe UI,Arial,sans-serif;
  font-weight:950;
  font-style:italic;
  letter-spacing:-.065em;
  text-shadow:0 1px 1px rgba(0,0,0,.9), 0 2px 4px rgba(0,0,0,.7), 0 0 7px rgba(255,255,255,.14);
}
.premier-rating-plate-large { width:152px; height:54px; }
.premier-rating-plate-large strong { font-size:18.5px; }
.premier-rating-plate-small { width:90px; height:32px; }
.premier-rating-plate-small strong { font-size:11.4px; }
.premier-rating-plate-tiny { width:90px; height:32px; }
.premier-rating-plate-tiny strong { font-size:11.4px; }

.profile-premier-values { grid-template-columns:repeat(2,90px) !important; gap:8px !important; }
.profile-premier-values > div { justify-items:center; }
.profile-premier-values small { font-size:8px !important; font-weight:800; color:#99a9c4; }

.premier-season-row {
  grid-template-columns:minmax(100px,1fr) 94px 94px 56px !important;
  align-items:center;
}
.premier-season-rating > span,
.premier-season-sample > span { font-size:8px; }
.premier-season-sample strong { font-size:15px; }

.profile-premier-chip {
  grid-template-columns:minmax(82px,1fr) auto !important;
  align-items:center;
  padding:10px 12px !important;
}
.profile-premier-copy { min-width:0; }
.profile-premier-copy span { font-size:13px; font-weight:900; color:#f1ebff; }
.profile-premier-copy small { font-size:9px !important; }
.profile-premier-chip > div:last-child { justify-items:end; }

#profilePremierHistory .profile-premier-chip,
#profilePremierHistory .profile-premier-chip.current {
  background:linear-gradient(90deg,rgba(119,37,163,.48),rgba(58,33,114,.40)) !important;
  border-color:rgba(222,112,255,.38) !important;
}
#profilePremierHistory .profile-premier-chip.current {
  box-shadow:0 0 0 1px rgba(255,87,240,.18) inset;
}

@media (max-width: 900px) {
  .premier-rating-plate-large { width:144px; height:51px; }
  .premier-rating-plate-large strong { font-size:17px; }
  .premier-rating-plate-small,
  .premier-rating-plate-tiny { width:84px; height:30px; }
  .premier-rating-plate-small strong,
  .premier-rating-plate-tiny strong { font-size:10.7px; }
  .profile-premier-values { grid-template-columns:repeat(2,84px) !important; }
  .premier-season-row { grid-template-columns:minmax(90px,1fr) 88px 88px 52px !important; }
}
@media (max-width: 760px) {
  .profile-premier-values { grid-template-columns:repeat(2,78px) !important; }
  .premier-rating-plate-small,
  .premier-rating-plate-tiny { width:78px; height:28px; }
  .premier-rating-plate-small strong,
  .premier-rating-plate-tiny strong { font-size:10px; }
}


/* v0.3.24 — fix Premier number alignment and colorize the left stripes to the tier color */
.premier-rating-plate strong {
  left:55.2% !important;
  top:49.2% !important;
  width:56% !important;
  display:flex;
  align-items:center;
  justify-content:center;
  transform:translate(-50%,-50%);
  letter-spacing:-.03em !important;
  font-variant-numeric:tabular-nums;
}
.premier-rating-plate-large strong {
  font-size:17px !important;
}
.premier-rating-plate-small strong,
.premier-rating-plate-tiny strong {
  font-size:10px !important;
}
.premier-rating-plate-small { width:86px !important; height:31px !important; }
.premier-rating-plate-tiny { width:86px !important; height:31px !important; }
.premier-rating-plate-small .premier-rating-bg,
.premier-rating-plate-tiny .premier-rating-bg { object-fit:cover; }
.profile-premier-values { grid-template-columns:repeat(2,86px) !important; }
.premier-season-row { grid-template-columns:minmax(100px,1fr) 90px 90px 56px !important; }
@media (max-width: 900px) {
  .premier-rating-plate-small,
  .premier-rating-plate-tiny { width:82px !important; height:30px !important; }
  .profile-premier-values { grid-template-columns:repeat(2,82px) !important; }
  .premier-season-row { grid-template-columns:minmax(90px,1fr) 84px 84px 52px !important; }
}
@media (max-width: 760px) {
  .premier-rating-plate-small,
  .premier-rating-plate-tiny { width:76px !important; height:28px !important; }
  .premier-rating-plate-small strong,
  .premier-rating-plate-tiny strong { font-size:9.5px !important; }
  .profile-premier-values { grid-template-columns:repeat(2,76px) !important; }
}


/* v0.3.25 — hard-center the Premier value inside the complete badge canvas */
.premier-rating-plate strong {
  inset:0 !important;
  left:0 !important;
  right:0 !important;
  top:0 !important;
  bottom:0 !important;
  width:auto !important;
  height:auto !important;
  transform:none !important;
  margin:0 !important;
  padding:0 7% 0 0 !important;
  box-sizing:border-box !important;
  display:grid !important;
  place-items:center !important;
  overflow:visible !important;
  text-align:center !important;
  line-height:1 !important;
  font-variant-numeric:tabular-nums lining-nums !important;
  font-feature-settings:"tnum" 1,"lnum" 1 !important;
}


/* v0.3.26 — render the rating number inside the SVG canvas so it cannot drift outside the badge */
svg.premier-rating-plate {
  position:relative !important;
  display:block !important;
  overflow:visible !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  filter:drop-shadow(0 2px 4px rgba(0,0,0,.42));
}
svg.premier-rating-plate .premier-rating-number {
  fill:#fff;
  stroke:rgba(0,0,0,.78);
  stroke-width:1.35px;
  paint-order:stroke fill;
  font-family:"Arial Black","Segoe UI Black",Arial,sans-serif;
  font-size:22px;
  font-weight:950;
  font-style:italic;
  letter-spacing:-.7px;
  font-variant-numeric:tabular-nums lining-nums;
}
svg.premier-rating-plate-large { width:152px !important; height:55px !important; }
svg.premier-rating-plate-small { width:86px !important; height:31px !important; }
svg.premier-rating-plate-tiny { width:86px !important; height:31px !important; }
.premier-rating-plate-host > svg { margin-inline:auto; }
@media (max-width:900px) {
  svg.premier-rating-plate-small,
  svg.premier-rating-plate-tiny { width:82px !important; height:30px !important; }
}
@media (max-width:760px) {
  svg.premier-rating-plate-small,
  svg.premier-rating-plate-tiny { width:76px !important; height:28px !important; }
}


/* v0.3.29 — Premier badges tuned closer to the provided reference */
svg.premier-rating-plate .premier-rating-number {
  font-family: Rajdhani, Teko, Oxanium, Inter, "Arial Narrow", sans-serif !important;
  font-weight: 800 !important;
  font-style: italic;
  letter-spacing: -0.035em;
  fill: #f8f7ff;
  stroke: rgba(57, 9, 66, .72);
  stroke-width: 2.15px;
  stroke-linejoin: round;
  paint-order: stroke fill;
  filter: drop-shadow(0 1px 1px rgba(0,0,0,.45));
}
svg.premier-rating-plate-large .premier-rating-number { font-size: 30px; }
svg.premier-rating-plate-small .premier-rating-number,
svg.premier-rating-plate-tiny .premier-rating-number { font-size: 15.5px; }
svg.premier-rating-plate-large { width: 154px !important; height: 55px !important; }
svg.premier-rating-plate-small, svg.premier-rating-plate-tiny { width: 88px !important; height: 31px !important; }
@media (max-width: 900px) {
  svg.premier-rating-plate-small, svg.premier-rating-plate-tiny { width: 84px !important; height: 30px !important; }
}
@media (max-width: 760px) {
  svg.premier-rating-plate-small, svg.premier-rating-plate-tiny { width: 80px !important; height: 29px !important; }
  svg.premier-rating-plate-small .premier-rating-number,
  svg.premier-rating-plate-tiny .premier-rating-number { font-size: 14.5px; }
}


/* v0.3.30 — exact Premier styling extracted from CS2 rating_emblem.css */
:root {
  --premier-gray:#b0c3d9;
  --premier-cyan:#8cc6ff;
  --premier-blue:#6a7dff;
  --premier-purple:#c166ff;
  --premier-pink:#f03cff;
  --premier-red:#eb4b4b;
  --premier-gold:#ffd700;
}
svg.premier-rating-plate {
  display:block;
  overflow:visible;
  filter:drop-shadow(0 0 5px rgba(0,0,0,.72));
}
svg.premier-rating-plate .premier-rating-number,
svg.premier-rating-plate .premier-rating-empty {
  font-family:"Stratum2 Black Italic","Arial Narrow","Roboto Condensed",Arial,sans-serif !important;
  font-style:italic;
  font-weight:900;
  fill:#fff;
  stroke:rgba(0,0,0,.78);
  stroke-width:1.15px;
  stroke-linejoin:round;
  paint-order:stroke fill;
  text-shadow:1px 1px 1px #000;
  filter:brightness(1.7);
}
svg.premier-rating-plate .major { font-size:23px; letter-spacing:.1px; }
svg.premier-rating-plate .minor { font-size:18px; letter-spacing:.5px; }
svg.premier-rating-plate .premier-rating-empty { font-size:20px; }
svg.premier-rating-plate-large { width:152px !important; height:55px !important; }
svg.premier-rating-plate-large .major { font-size:30px; }
svg.premier-rating-plate-large .minor { font-size:23px; }
svg.premier-rating-plate-small,
svg.premier-rating-plate-tiny { width:80px !important; height:32px !important; }
.profile-premier-values { grid-template-columns:repeat(2,80px) !important; gap:8px !important; }
.premier-season-row { grid-template-columns:minmax(100px,1fr) 84px 84px 56px !important; }
@media (max-width:900px) {
  svg.premier-rating-plate-small,
  svg.premier-rating-plate-tiny { width:76px !important; height:30px !important; }
  .profile-premier-values { grid-template-columns:repeat(2,76px) !important; }
  .premier-season-row { grid-template-columns:minmax(90px,1fr) 80px 80px 52px !important; }
}
@media (max-width:760px) {
  svg.premier-rating-plate-small,
  svg.premier-rating-plate-tiny { width:72px !important; height:29px !important; }
  svg.premier-rating-plate .major { font-size:21px; }
  svg.premier-rating-plate .minor { font-size:16px; }
  .profile-premier-values { grid-template-columns:repeat(2,72px) !important; }
}


/* v0.3.31 — align Premier badges to the in-game leaderboard/reference look */
@import url('https://fonts.googleapis.com/css2?family=Teko:wght@600;700&display=swap');
svg.premier-rating-plate .premier-rating-number,
svg.premier-rating-plate .premier-rating-empty {
  font-family: "Teko", "Stratum2 Black Italic", "Arial Narrow", "Roboto Condensed", Arial, sans-serif !important;
  font-style: italic;
  font-weight: 700;
  fill: #f6f3ff;
  stroke: rgba(0,0,0,.68);
  stroke-width: 1.05px;
  stroke-linejoin: round;
  paint-order: stroke fill;
  letter-spacing: .15px;
  filter: drop-shadow(0 1px 0 rgba(0,0,0,.5));
}
svg.premier-rating-plate-large .premier-rating-number,
svg.premier-rating-plate-large .premier-rating-empty { font-size: 29px !important; }
svg.premier-rating-plate-small .premier-rating-number,
svg.premier-rating-plate-small .premier-rating-empty,
svg.premier-rating-plate-tiny .premier-rating-number,
svg.premier-rating-plate-tiny .premier-rating-empty { font-size: 15px !important; }
svg.premier-rating-plate-large { width: 148px !important; height: 53px !important; }
svg.premier-rating-plate-small,
svg.premier-rating-plate-tiny { width: 84px !important; height: 30px !important; }
@media (max-width:900px){
  svg.premier-rating-plate-small,
  svg.premier-rating-plate-tiny { width:80px !important; height:29px !important; }
}


/* v0.3.33 — closer to the CS in-game Premier plate */
svg.premier-rating-plate .premier-rating-number,
svg.premier-rating-plate .premier-rating-empty {
  letter-spacing: .05px !important;
  stroke-width: .95px !important;
  filter: drop-shadow(0 1px 0 rgba(0,0,0,.56));
}
svg.premier-rating-plate-large .premier-rating-number,
svg.premier-rating-plate-large .premier-rating-empty { font-size: 28px !important; }
svg.premier-rating-plate-small .premier-rating-number,
svg.premier-rating-plate-small .premier-rating-empty,
svg.premier-rating-plate-tiny .premier-rating-number,
svg.premier-rating-plate-tiny .premier-rating-empty { font-size: 14.5px !important; }


/* v0.3.34 — FACEIT / Premier stat cards styled closer to the reference screenshot */
.faceit-card .ghost-btn { min-width:102px; }
.provider-player-name {
  display:flex;
  align-items:center;
  gap:10px;
  margin: 8px 0 6px;
  color:#f3f7ff;
  font-size:26px;
  font-weight:950;
  letter-spacing:.01em;
}
.faceit-showcase { margin:18px 0 14px; }
.faceit-copy { min-width:0; }
.faceit-player-line { margin:0 0 8px; }
.faceit-meta-line {
  display:flex;
  align-items:center;
  gap:8px;
  color:var(--muted);
  font-size:14px;
  font-weight:800;
}
.faceit-meta-line strong { color:#ffd9bf; font-size:15px; }
.faceit-meta-sep { color:#6f84a8; font-weight:700; }
.flag-emoji { font-size:32px; line-height:1; }
.recent-form-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin: 18px 0 8px;
}
.recent-form-head span {
  color:#c7d6f0;
  font-size:13px;
  font-weight:850;
}
.recent-form-head strong {
  color:#dce9ff;
  font-size:24px;
  font-weight:950;
}
.form-strip { flex-wrap:wrap; min-height:34px; }
.form-strip .result {
  width:31px;
  height:31px;
  border-radius:4px;
  font-size:16px;
}
.faceit-stat-grid, .premier-stat-grid { margin-top: 20px; }
.stat-row-compact { margin-top:18px; }
.stat-row.faceit-stat-grid strong,
.stat-row.premier-stat-grid strong { font-size:18px; }
.stat-row.faceit-stat-grid span,
.stat-row.premier-stat-grid span { font-size:10px; }
.premier-overview .provider-player-name { margin-top:2px; }
.premier-overview .rank-hero { margin-top: 12px; }
.premier-stat-grid { grid-template-columns: repeat(4, minmax(0,1fr)); }
.premier-current-meta { margin-top: 16px; }
@media (max-width: 980px) {
  .provider-player-name { font-size:22px; }
}
@media (max-width: 640px) {
  .faceit-level { align-items:flex-start; }
  .provider-player-name { font-size:20px; }
  .faceit-meta-line { font-size:12px; }
  .recent-form-head strong { font-size:20px; }
}


/* v0.3.35 — missing map icon fallback + larger readable Premier season icons */
.map-visual {
  background:
    radial-gradient(circle at 32% 22%, rgba(96,149,215,.34), rgba(8,17,30,.92)),
    linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.00));
}
.map-visual span {
  position:relative;
  z-index:0;
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  padding:0 4px;
  text-align:center;
  color:#b4c5de;
  font-size:10px;
  font-weight:950;
  line-height:1;
  letter-spacing:.03em;
  text-transform:uppercase;
}
.map-visual.is-fallback span {
  z-index:1;
  color:#eaf3ff;
  font-size:15px;
  text-shadow:0 2px 8px rgba(0,0,0,.45);
}
.map-visual.is-fallback::before {
  content:attr(data-map-name);
  position:absolute;
  left:5px;
  right:5px;
  bottom:4px;
  z-index:1;
  overflow:hidden;
  color:#83a1c9;
  font-size:7px;
  font-weight:800;
  text-align:center;
  text-overflow:ellipsis;
  white-space:nowrap;
  text-transform:none;
}
.map-visual.is-fallback::after { bottom:7px; }
.map-visual.is-fallback img { display:none !important; }

/* make small Premier badges larger and easier to read */
.profile-premier-values {
  grid-template-columns: repeat(2, 96px) !important;
  gap: 10px !important;
  align-items:start !important;
}
.profile-premier-values > div {
  display:grid !important;
  justify-items:center !important;
  align-content:start !important;
  gap:4px !important;
  padding-top:0 !important;
}
.profile-premier-values small {
  margin:0 !important;
  line-height:1 !important;
}
.premier-season-row {
  grid-template-columns: minmax(110px,1fr) 100px 100px 58px !important;
  align-items:start !important;
}
.premier-season-row > div:not(.premier-season-name) {
  align-self:start !important;
  padding-top:4px;
}
.profile-premier-chip {
  align-items:start !important;
}
svg.premier-rating-plate-tiny {
  width: 98px !important;
  height: 36px !important;
  overflow: visible;
}
svg.premier-rating-plate-tiny .premier-rating-number,
svg.premier-rating-plate-tiny .premier-rating-empty {
  font-size: 16px !important;
}
@media (max-width: 1280px) {
  .profile-premier-values { grid-template-columns: repeat(2, 92px) !important; }
  .premier-season-row { grid-template-columns:minmax(96px,1fr) 94px 94px 56px !important; }
  svg.premier-rating-plate-tiny { width: 92px !important; height: 34px !important; }
}
@media (max-width: 980px) {
  .profile-premier-values { grid-template-columns: repeat(2, 88px) !important; gap:8px !important; }
  .premier-season-row { grid-template-columns:minmax(92px,1fr) 90px 90px 54px !important; }
  svg.premier-rating-plate-tiny { width: 88px !important; height: 33px !important; }
}
@media (max-width: 700px) {
  .profile-premier-values { grid-template-columns: repeat(2, 82px) !important; }
  .premier-season-row { grid-template-columns:minmax(90px,1fr) 84px 84px 52px !important; }
  svg.premier-rating-plate-tiny { width: 82px !important; height: 31px !important; }
}


/* v0.3.36 — reliable missing-map fallback + genuinely larger Premier season badges */
.map-visual.is-fallback {
  display:grid !important;
  grid-template-rows:1fr auto;
  align-items:center;
  justify-items:center;
  padding:7px 5px 4px;
  background:
    linear-gradient(145deg, rgba(49,78,116,.88), rgba(12,25,43,.96)),
    radial-gradient(circle at 32% 20%, rgba(101,174,255,.36), transparent 62%);
  border-color:rgba(133,176,229,.25);
}
.map-visual.is-fallback span {
  display:block !important;
  position:relative !important;
  z-index:2 !important;
  width:auto !important;
  padding:0 !important;
  color:#f0f6ff !important;
  font-size:16px !important;
  font-weight:950 !important;
  line-height:1 !important;
  letter-spacing:.02em !important;
  text-shadow:0 2px 7px rgba(0,0,0,.58);
}
.map-visual.is-fallback::before {
  content:attr(data-map-name);
  position:static !important;
  z-index:2;
  display:block;
  width:100%;
  overflow:hidden;
  color:#91a9ca;
  font-size:6.5px;
  font-weight:800;
  line-height:1;
  text-align:center;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.map-visual.is-fallback::after { display:none !important; }
.map-visual.is-fallback img { display:none !important; }

.rank-card .rank-board {
  grid-template-columns:minmax(0,1fr) 390px !important;
  align-items:start !important;
}
.profile-premier-stack {
  align-self:start !important;
  margin-top:-3px !important;
  padding-top:0 !important;
}
.profile-premier-history {
  align-content:start !important;
}
.profile-premier-chip {
  min-height:76px !important;
  padding:10px 12px !important;
  align-items:start !important;
}
.profile-premier-copy {
  padding-top:2px;
}
.profile-premier-values {
  grid-template-columns:repeat(2,118px) !important;
  gap:10px !important;
  align-items:start !important;
  margin-top:-4px !important;
}
.profile-premier-values > div {
  align-content:start !important;
  justify-items:center !important;
  gap:4px !important;
}
.profile-premier-values small {
  font-size:8px !important;
  line-height:1 !important;
}
svg.premier-rating-plate-tiny,
svg.premier-rating-plate-small {
  width:118px !important;
  height:43px !important;
}
svg.premier-rating-plate-tiny .premier-rating-number,
svg.premier-rating-plate-tiny .premier-rating-empty,
svg.premier-rating-plate-small .premier-rating-number,
svg.premier-rating-plate-small .premier-rating-empty {
  font-size:24px !important;
  stroke-width:1px !important;
}
.premier-season-row {
  grid-template-columns:minmax(130px,1fr) 122px 122px 60px !important;
  min-height:68px !important;
  align-items:start !important;
  padding-top:9px !important;
}
.premier-season-rating,
.premier-season-sample {
  align-self:start !important;
  padding-top:0 !important;
}
.premier-season-rating > span,
.premier-season-sample > span {
  margin-bottom:3px !important;
}
@media (max-width:1320px) {
  .rank-card .rank-board { grid-template-columns:minmax(0,1fr) 360px !important; }
  .profile-premier-values { grid-template-columns:repeat(2,108px) !important; }
  svg.premier-rating-plate-tiny,
  svg.premier-rating-plate-small { width:108px !important; height:39px !important; }
  svg.premier-rating-plate-tiny .premier-rating-number,
  svg.premier-rating-plate-small .premier-rating-number { font-size:22px !important; }
  .premier-season-row { grid-template-columns:minmax(112px,1fr) 112px 112px 58px !important; }
}
@media (max-width:1100px) {
  .rank-card .rank-board { grid-template-columns:1fr !important; }
  .profile-premier-stack { margin-top:12px !important; padding-left:0 !important; }
  .profile-premier-history { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:760px) {
  .profile-premier-values { grid-template-columns:repeat(2,94px) !important; }
  svg.premier-rating-plate-tiny,
  svg.premier-rating-plate-small { width:94px !important; height:34px !important; }
  svg.premier-rating-plate-tiny .premier-rating-number,
  svg.premier-rating-plate-small .premier-rating-number { font-size:19px !important; }
  .premier-season-row { grid-template-columns:1fr 96px 96px !important; }
  .premier-season-sample { grid-column:1/-1; display:flex; justify-content:space-between; }
}


/* v0.3.38 — final rank-board alignment + real CS2 VPK map tokens */

/* Equal top dashboard tiles. */
.dashboard {
  align-items: stretch !important;
}
.dashboard > .profile-card,
.dashboard > .metric-card {
  height: 100% !important;
  align-self: stretch !important;
}

/* Rank board: keep cards on a rigid grid instead of letting individual content
   change row/column placement. */
.rank-card .rank-board {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 382px !important;
  gap: 16px !important;
  align-items: start !important;
}
.rank-card .competitive-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  grid-auto-rows: 68px !important;
  gap: 10px !important;
  align-content: start !important;
}
.competitive-rank {
  height: 68px !important;
  min-height: 68px !important;
  align-items: center !important;
}
.map-visual {
  width: 52px !important;
  height: 52px !important;
}
.map-visual img {
  width: 48px !important;
  height: 48px !important;
  object-fit: contain !important;
}
.map-visual:not(.is-fallback) span {
  display: none !important;
}

/* Premier rail aligns with the top row of map ranks. */
.profile-premier-stack {
  display: flex !important;
  flex-direction: column !important;
  align-self: start !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 0 0 0 16px !important;
  border-left: 1px solid var(--border) !important;
}
.profile-premier-title {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  min-height: 32px !important;
  margin: 0 !important;
}
.profile-premier-history {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
  align-content: start !important;
}
.profile-premier-chip {
  display: grid !important;
  grid-template-columns: minmax(88px, 1fr) 216px !important;
  align-items: center !important;
  min-height: 66px !important;
  height: 66px !important;
  padding: 8px 10px !important;
}
.profile-premier-copy {
  align-self: center !important;
  padding: 0 !important;
}
.profile-premier-values {
  display: grid !important;
  grid-template-columns: repeat(2, 104px) !important;
  gap: 8px !important;
  align-items: center !important;
  justify-content: end !important;
  margin: 0 !important;
}
.profile-premier-values > div {
  display: grid !important;
  grid-template-rows: 10px 38px !important;
  gap: 3px !important;
  align-items: start !important;
  justify-items: center !important;
  padding: 0 !important;
}
.profile-premier-values small {
  margin: 0 !important;
  font-size: 8px !important;
  line-height: 10px !important;
}

/* Top-right season badges: readable, but small enough to never clip. */
svg.premier-rating-plate-tiny {
  width: 104px !important;
  height: 38px !important;
}
svg.premier-rating-plate-tiny .premier-rating-number,
svg.premier-rating-plate-tiny .premier-rating-empty {
  font-size: 20px !important;
}

/* Large Premier block: fixed row alignment and no drifting. */
.premier-layout {
  display: grid !important;
  grid-template-columns: minmax(330px, .72fr) minmax(0, 1.7fr) !important;
  gap: 18px !important;
  align-items: start !important;
}
.premier-overview,
.premier-season-detail {
  align-self: start !important;
  min-width: 0 !important;
}
.premier-season-head {
  min-height: 28px !important;
  margin-bottom: 8px !important;
  align-items: center !important;
}
.premier-season-list {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  grid-auto-rows: 76px !important;
  gap: 8px !important;
  align-content: start !important;
}
.premier-season-row {
  height: 76px !important;
  min-height: 76px !important;
  grid-template-columns: minmax(116px, 1fr) 118px 118px 56px !important;
  align-items: center !important;
  padding: 8px 10px !important;
}
.premier-season-name,
.premier-season-rating,
.premier-season-sample {
  align-self: center !important;
}
.premier-season-rating {
  display: grid !important;
  grid-template-rows: 10px 43px !important;
  gap: 3px !important;
  justify-items: center !important;
  padding: 0 !important;
}
.premier-season-rating > span,
.premier-season-sample > span {
  margin: 0 !important;
  line-height: 10px !important;
}
.premier-season-sample {
  justify-self: end !important;
  text-align: right !important;
  padding: 0 !important;
}
svg.premier-rating-plate-small {
  width: 118px !important;
  height: 43px !important;
}
svg.premier-rating-plate-small .premier-rating-number,
svg.premier-rating-plate-small .premier-rating-empty {
  font-size: 24px !important;
}

/* Responsive breakpoints that preserve alignment instead of clipping. */
@media (max-width: 1320px) {
  .rank-card .rank-board {
    grid-template-columns: minmax(0, 1fr) 352px !important;
  }
  .profile-premier-chip {
    grid-template-columns: minmax(82px, 1fr) 200px !important;
  }
  .profile-premier-values {
    grid-template-columns: repeat(2, 96px) !important;
  }
  svg.premier-rating-plate-tiny {
    width: 96px !important;
    height: 35px !important;
  }
  svg.premier-rating-plate-tiny .premier-rating-number,
  svg.premier-rating-plate-tiny .premier-rating-empty {
    font-size: 18px !important;
  }
}
@media (max-width: 1180px) {
  .rank-card .competitive-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
  .rank-card .rank-board {
    grid-template-columns: 1fr !important;
  }
  .profile-premier-stack {
    padding: 14px 0 0 !important;
    border-left: 0 !important;
    border-top: 1px solid var(--border) !important;
  }
  .profile-premier-history {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 860px) {
  .rank-card .competitive-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .profile-premier-history {
    grid-template-columns: 1fr !important;
  }
  .premier-layout {
    grid-template-columns: 1fr !important;
  }
  .premier-overview {
    padding-right: 0 !important;
    border-right: 0 !important;
    padding-bottom: 16px !important;
    border-bottom: 1px solid var(--border) !important;
  }
  .premier-season-list {
    grid-template-columns: 1fr !important;
  }
}
@media (max-width: 560px) {
  .rank-card .competitive-grid {
    grid-template-columns: 1fr !important;
  }
  .profile-premier-chip {
    grid-template-columns: minmax(78px, 1fr) 176px !important;
  }
  .profile-premier-values {
    grid-template-columns: repeat(2, 84px) !important;
  }
  svg.premier-rating-plate-tiny {
    width: 84px !important;
    height: 31px !important;
  }
  svg.premier-rating-plate-tiny .premier-rating-number,
  svg.premier-rating-plate-tiny .premier-rating-empty {
    font-size: 16px !important;
  }
}


/* v0.3.39 — all map ranks + real VPK map tokens + stable rank/Premier alignment */
.rank-card .rank-board {
  display:grid !important;
  grid-template-columns:minmax(0,1fr) 360px !important;
  gap:18px !important;
  align-items:start !important;
}
.rank-card .competitive-grid {
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  grid-auto-rows:68px !important;
  gap:10px !important;
  align-content:start !important;
}
.competitive-rank {
  height:68px !important;
  min-height:68px !important;
  grid-template-columns:54px minmax(0,1fr) 52px !important;
  align-items:center !important;
}
.map-visual {
  width:52px !important;
  height:52px !important;
  border-radius:13px !important;
}
.map-visual img.map-token-img {
  display:block;
  width:48px !important;
  height:48px !important;
  object-fit:contain !important;
  z-index:2 !important;
}
.map-visual:not(.is-fallback) > span { display:none !important; }
.map-visual.is-fallback > span { display:block !important; }

.profile-premier-stack {
  position:relative;
  display:flex !important;
  flex-direction:column !important;
  align-self:start !important;
  gap:8px !important;
  margin:0 !important;
  padding:0 0 0 18px !important;
  border-left:1px solid var(--border) !important;
}
.profile-premier-title {
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  min-height:32px !important;
  margin:0 !important;
}
.profile-premier-history {
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:8px !important;
  align-content:start !important;
}
.profile-premier-chip {
  min-height:66px !important;
  height:66px !important;
  display:grid !important;
  grid-template-columns:minmax(88px,1fr) 210px !important;
  align-items:center !important;
  padding:8px 10px !important;
}
.profile-premier-values {
  display:grid !important;
  grid-template-columns:repeat(2,101px) !important;
  gap:8px !important;
  align-items:center !important;
  justify-content:end !important;
  margin:0 !important;
}
.profile-premier-values > div {
  display:grid !important;
  grid-template-rows:10px 37px !important;
  align-items:start !important;
  justify-items:center !important;
  gap:3px !important;
}
svg.premier-rating-plate-tiny {
  width:101px !important;
  height:37px !important;
}
svg.premier-rating-plate-tiny .premier-rating-number,
svg.premier-rating-plate-tiny .premier-rating-empty {
  font-size:19px !important;
}

/* Lower Premier block keeps its own larger badge sizing. */
.premier-season-list {
  align-content:start !important;
}
.premier-season-row {
  align-items:center !important;
}
.premier-season-rating,
.premier-season-sample,
.premier-season-name { align-self:center !important; }

@media (max-width:1320px) {
  .rank-card .rank-board { grid-template-columns:minmax(0,1fr) 340px !important; }
  .profile-premier-chip { grid-template-columns:minmax(82px,1fr) 198px !important; }
  .profile-premier-values { grid-template-columns:repeat(2,95px) !important; }
  svg.premier-rating-plate-tiny { width:95px !important; height:35px !important; }
  svg.premier-rating-plate-tiny .premier-rating-number,
  svg.premier-rating-plate-tiny .premier-rating-empty { font-size:18px !important; }
}
@media (max-width:1150px) {
  .rank-card .competitive-grid { grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
  .rank-card .rank-board { grid-template-columns:1fr !important; }
  .profile-premier-stack {
    padding:14px 0 0 !important;
    border-left:0 !important;
    border-top:1px solid var(--border) !important;
  }
  .profile-premier-history { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
}
@media (max-width:820px) {
  .rank-card .competitive-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .profile-premier-history { grid-template-columns:1fr !important; }
}
@media (max-width:560px) {
  .rank-card .competitive-grid { grid-template-columns:1fr !important; }
}


/* v0.3.40 — profile card only: user-provided source logos + readable fact rows */
.profile-card .profile-links {
  gap: 10px !important;
  margin-top: 16px !important;
}
.profile-card .icon-btn.source-button {
  width: 46px !important;
  min-width: 46px !important;
  height: 46px !important;
  border-radius: 13px !important;
  display: grid !important;
  place-items: center !important;
}
.profile-card .source-logo {
  width: 28px !important;
  height: 28px !important;
  object-fit: contain !important;
}
.profile-card .steam-logo { width: 30px !important; height: 30px !important; }
.profile-card .faceit-logo { width: 31px !important; height: 25px !important; }
.profile-card .leetify-logo { width: 30px !important; height: 28px !important; }
.profile-card .csstats-logo { width: 34px !important; height: 20px !important; }
.profile-card .copy-source { display:none !important; }

/* Turn the four lower boxes into a compact row list. */
.profile-card .mini-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 0 !important;
  width: 100% !important;
  margin-top: 18px !important;
  padding: 4px 14px !important;
  border: 1px solid rgba(139,164,203,.18) !important;
  border-radius: 14px !important;
  background: linear-gradient(145deg,rgba(5,17,31,.34),rgba(10,25,43,.42)) !important;
}
.profile-card .mini-stat {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 18px !important;
  min-height: 44px !important;
  padding: 8px 2px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
}
.profile-card .mini-stat + .mini-stat {
  border-top: 1px solid rgba(139,164,203,.12) !important;
}
.profile-card .mini-stat span {
  min-height: 0 !important;
  margin: 0 !important;
  color: #7188aa !important;
  font-size: 9px !important;
  font-weight: 800 !important;
  letter-spacing: .08em !important;
  line-height: 1.2 !important;
  text-transform: uppercase !important;
}
.profile-card .mini-stat strong {
  margin: 0 !important;
  max-width: 58% !important;
  color: #f5f8ff !important;
  font-size: 16px !important;
  font-weight: 950 !important;
  line-height: 1.15 !important;
  text-align: right !important;
  overflow-wrap: anywhere !important;
}
@media (max-width: 700px) {
  .profile-card .mini-grid { padding-inline: 11px !important; }
  .profile-card .mini-stat { min-height: 42px !important; }
  .profile-card .mini-stat strong { font-size: 15px !important; }
}


/* v0.3.41 — Winrate card alignment only. AI and TTD are intentionally untouched. */
.metric-card.win {
  justify-content:flex-start !important;
}
.metric-card.win .metric-note {
  min-height:36px;
}
.win-explainer {
  margin-top:auto;
  width:100%;
  padding-top:14px;
  border-top:1px solid var(--border);
}
.win-scale {
  margin-bottom:10px;
}
.win-scale .ttd-scale-track {
  background:linear-gradient(90deg, #ff6f7d 0%, #ffc451 50%, #50e0c1 100%);
}
.win-source-inline {
  display:flex !important;
  align-items:center;
  justify-content:flex-end;
  gap:7px;
  min-width:0;
}
.win-source-inline img {
  width:18px;
  height:18px;
  flex:0 0 18px;
  object-fit:contain;
  border-radius:4px;
}
.win-source-inline span {
  display:block;
  overflow:hidden;
  max-width:100px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.hidden-source-icon {
  display:none !important;
}


/* v0.3.42 — minimal header: logo + search + verify button only */
.topbar {
  display:grid !important;
  grid-template-columns:48px minmax(0,1fr) auto !important;
  align-items:center !important;
  gap:14px !important;
  min-height:68px !important;
  padding:10px 12px !important;
}
.topbar .brand {
  display:flex !important;
  align-items:center !important;
  width:48px !important;
  min-width:48px !important;
  flex:0 0 48px !important;
}
.topbar .brand-copy,
.topbar #modePill {
  display:none !important;
}
.topbar .brand-mark {
  width:44px !important;
  height:44px !important;
  margin:0 !important;
}
.topbar .brand-mark img {
  width:44px !important;
  height:44px !important;
}
.topbar .search {
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto !important;
  gap:10px !important;
  width:100% !important;
  min-width:0 !important;
  order:initial !important;
}
.topbar .search-field {
  min-width:0 !important;
}
.topbar .search button {
  width:auto !important;
  min-width:190px !important;
  white-space:nowrap !important;
}
@media (max-width:760px) {
  .topbar {
    grid-template-columns:44px minmax(0,1fr) !important;
    gap:10px !important;
  }
  .topbar .brand,
  .topbar .brand-mark,
  .topbar .brand-mark img {
    width:40px !important;
    min-width:40px !important;
    height:40px !important;
  }
  .topbar .search {
    grid-column:2 !important;
    grid-template-columns:1fr !important;
  }
  .topbar .search button {
    width:100% !important;
    min-width:0 !important;
  }
}


/* v0.3.43 — restore brand text in the minimal header */
.topbar {
  grid-template-columns:auto minmax(0,1fr) !important;
  gap:18px !important;
}
.topbar .brand {
  width:auto !important;
  min-width:176px !important;
  flex:0 0 auto !important;
  gap:10px !important;
}
.topbar .brand-copy {
  display:block !important;
  min-width:0 !important;
  white-space:nowrap !important;
}
.topbar .brand-copy strong {
  display:block !important;
  font-size:15px !important;
  line-height:1.05 !important;
  letter-spacing:.08em !important;
}
.topbar .brand-copy span {
  display:block !important;
  margin-top:3px !important;
  font-size:10px !important;
  line-height:1 !important;
  letter-spacing:.12em !important;
  text-transform:uppercase !important;
}
.topbar #modePill {
  display:none !important;
}
.topbar .search {
  min-width:0 !important;
}
@media (max-width:760px) {
  .topbar {
    grid-template-columns:1fr !important;
  }
  .topbar .brand {
    min-width:0 !important;
  }
  .topbar .brand-copy {
    display:block !important;
  }
  .topbar .search {
    grid-column:1 !important;
  }
}


/* v0.3.46 — Leetify Stats visual refresh only */
.leetify-card {
  position: relative;
  overflow: hidden;
  padding: 24px 26px 22px !important;
  border-color: rgba(157, 91, 255, .26) !important;
  background:
    radial-gradient(circle at 18% 0%, rgba(160, 77, 255, .08), transparent 34%),
    radial-gradient(circle at 82% 100%, rgba(235, 62, 208, .055), transparent 33%),
    linear-gradient(180deg, rgba(13, 25, 43, .98), rgba(9, 20, 36, .98)) !important;
}
.leetify-card::before {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(90deg, transparent, rgba(147,104,255,.025), transparent);
}
.leetify-head {
  position:relative;
  z-index:1;
  margin-bottom:28px !important;
}
.leetify-title-wrap {
  gap:12px !important;
}
.leetify-mark {
  width:42px !important;
  height:42px !important;
  padding:7px !important;
  border:1px solid rgba(193,94,255,.28);
  border-radius:12px !important;
  background:linear-gradient(145deg, rgba(146,67,255,.18), rgba(241,62,177,.13)) !important;
  box-shadow:0 9px 28px rgba(120,55,210,.20) !important;
}
.leetify-mark img {
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
}
.leetify-view {
  min-height:38px;
  padding:9px 15px !important;
  border-color:rgba(174,80,255,.55) !important;
  color:#d9adff !important;
  background:rgba(142,68,224,.08) !important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.015);
}
.leetify-view:hover {
  border-color:rgba(207,107,255,.78) !important;
  color:#f0d8ff !important;
  background:rgba(159,73,244,.13) !important;
}
.leetify-sample {
  color:#8fa2c5 !important;
}
.leetify-grid {
  position:relative;
  z-index:1;
  gap:24px !important;
}
.leetify-grid .perf-item {
  display:flex;
  min-height:192px;
  flex-direction:column;
}
.leetify-grid .perf-item h4 {
  min-height:19px;
  color:#eef3ff;
  font-size:13px !important;
}
.leetify-grid .perf-item h4 small {
  margin-left:4px;
  color:#8c9cba !important;
  font-size:9px !important;
}
.leetify-grid .perf-value {
  margin:14px 0 13px !important;
  color:#f6f8ff;
}
.leetify-grid .perf-bar {
  height:7px !important;
  border-radius:999px;
  background:rgba(104,126,160,.18) !important;
}
.leetify-grid .perf-bar i {
  border-radius:999px;
  background:linear-gradient(90deg,#7b59ff 0%,#a64cff 48%,#e950c5 100%) !important;
  box-shadow:0 0 12px rgba(169,73,255,.16);
}
.leetify-grid .perf-bar b {
  background:#d6dcef !important;
}
.leetify-grid .perf-foot {
  display:flex;
  min-height:64px !important;
  margin-top:12px !important;
  align-items:flex-start;
  color:#8798b7 !important;
}
.leetify-premier-equivalent {
  display:grid;
  width:100%;
  gap:5px;
}
.leetify-premier-equivalent > span {
  color:#899bb9;
  font-size:8px;
  font-weight:800;
  letter-spacing:.07em;
  text-transform:uppercase;
}
.custom-premier-badge {
  --custom-premier-bg: url('assets/premier-custom/gray.png');
  position:relative;
  width:min(155px,100%);
  height:38px;
  overflow:hidden;
  border-radius:5px;
  background-image:var(--custom-premier-bg);
  background-repeat:no-repeat;
  background-position:center;
  background-size:100% 100%;
  filter:drop-shadow(0 4px 8px rgba(0,0,0,.24));
}
.custom-premier-badge::after {
  content:"";
  position:absolute;
  z-index:1;
  left:31%;
  right:7%;
  top:17%;
  bottom:17%;
  border-radius:3px;
  background:linear-gradient(90deg,rgba(8,12,28,.55),rgba(8,12,28,.42));
  box-shadow:inset 0 0 13px rgba(8,12,28,.16);
}
.custom-premier-badge strong {
  position:absolute;
  z-index:2;
  left:64%;
  top:51%;
  width:58%;
  transform:translate(-50%,-50%);
  color:#f8f7ff;
  font-size:15px;
  font-style:italic;
  font-weight:950;
  line-height:1;
  text-align:center;
  white-space:nowrap;
  text-shadow:0 1px 2px rgba(0,0,0,.95);
}
.custom-premier-badge.tier-gray { --custom-premier-bg:url('assets/premier-custom/gray.png'); }
.custom-premier-badge.tier-cyan { --custom-premier-bg:url('assets/premier-custom/cyan.png'); }
.custom-premier-badge.tier-blue { --custom-premier-bg:url('assets/premier-custom/blue.png'); }
.custom-premier-badge.tier-purple { --custom-premier-bg:url('assets/premier-custom/purple.png'); }
.custom-premier-badge.tier-pink { --custom-premier-bg:url('assets/premier-custom/pink.png'); }
.custom-premier-badge.tier-red { --custom-premier-bg:url('assets/premier-custom/red.png'); }
.custom-premier-badge.tier-gold { --custom-premier-bg:url('assets/premier-custom/gold.png'); }
.custom-premier-badge.tier-unrated { --custom-premier-bg:url('assets/premier-custom/gray.png'); opacity:.65; }

.rating-item .perf-foot {
  min-height:24px !important;
}
.rating-item .rating-sides {
  min-height:22px;
}
.attribution-row {
  position:relative;
  z-index:1;
}
.attribution-row a {
  color:#c268ff !important;
  font-weight:850 !important;
}

@media (max-width:1180px) {
  .custom-premier-badge { width:145px; }
}
@media (max-width:540px) {
  .custom-premier-badge { width:170px; max-width:100%; height:42px; }
  .custom-premier-badge strong { font-size:16px; }
}


/* v0.3.47 — clean Premier equivalent badges */
.custom-premier-badge {
  overflow: visible !important;
  border-radius: 0 !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 100% 100% !important;
}
.custom-premier-badge::after {
  display: none !important;
}
.custom-premier-badge strong {
  left: 64% !important;
  top: 50% !important;
  width: 57% !important;
  transform: translate(-50%,-50%) !important;
  color: #fbfaff !important;
  font-size: 15px !important;
  font-style: italic !important;
  font-weight: 950 !important;
  letter-spacing: -.025em !important;
  text-shadow: 0 1px 2px rgba(0,0,0,.95), 0 0 5px rgba(255,255,255,.08) !important;
}


/* v0.3.49 — Leetify Rating removed; five metric columns remain */
.leetify-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}
@media (max-width: 1180px) {
  .leetify-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 760px) {
  .leetify-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 520px) {
  .leetify-grid {
    grid-template-columns: 1fr !important;
  }
}

/* v0.3.51 — clean larger Leetify Premier-equivalent badges, cache-busted asset set */
.leetify-premier-equivalent {
  gap: 7px !important;
}
.leetify-premier-equivalent > span {
  font-size: 8px !important;
  letter-spacing: .08em !important;
}
.custom-premier-badge {
  width: 176px !important;
  max-width: 100% !important;
  height: 44px !important;
  overflow: visible !important;
  border-radius: 0 !important;
  background-size: 100% 100% !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  filter: drop-shadow(0 5px 8px rgba(0,0,0,.30)) !important;
}
.custom-premier-badge::after {
  display: none !important;
}
.custom-premier-badge strong {
  left: 65% !important;
  top: 50% !important;
  width: 57% !important;
  transform: translate(-50%,-50%) !important;
  color: #fff !important;
  font-size: 18px !important;
  font-style: italic !important;
  font-weight: 950 !important;
  letter-spacing: -.035em !important;
  text-shadow:
    0 1px 2px rgba(0,0,0,.98),
    0 0 7px rgba(255,255,255,.10) !important;
}
.custom-premier-badge.tier-gray { --custom-premier-bg:url('assets/premier-custom-v2/gray.png?v=51'); }
.custom-premier-badge.tier-cyan { --custom-premier-bg:url('assets/premier-custom-v2/cyan.png?v=51'); }
.custom-premier-badge.tier-blue { --custom-premier-bg:url('assets/premier-custom-v2/blue.png?v=51'); }
.custom-premier-badge.tier-purple { --custom-premier-bg:url('assets/premier-custom-v2/purple.png?v=51'); }
.custom-premier-badge.tier-pink { --custom-premier-bg:url('assets/premier-custom-v2/pink.png?v=51'); }
.custom-premier-badge.tier-red { --custom-premier-bg:url('assets/premier-custom-v2/red.png?v=51'); }
.custom-premier-badge.tier-gold { --custom-premier-bg:url('assets/premier-custom-v2/gold.png?v=51'); }
.custom-premier-badge.tier-unrated { --custom-premier-bg:url('assets/premier-custom-v2/gray.png?v=51'); }

@media (max-width: 1180px) {
  .custom-premier-badge {
    width: 160px !important;
    height: 40px !important;
  }
  .custom-premier-badge strong {
    font-size: 16px !important;
  }
}
@media (max-width: 760px) {
  .custom-premier-badge {
    width: 170px !important;
    height: 43px !important;
  }
}


/* v0.3.53 — Leetify Premier-equivalent badges v3 */
.custom-premier-badge {
  width: 176px !important;
  max-width: 100% !important;
  height: 42px !important;
  position: relative !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background-color: transparent !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 100% 100% !important;
  background-image: var(--custom-premier-bg) !important;
  filter: drop-shadow(0 4px 8px rgba(0,0,0,.28)) !important;
}
.custom-premier-badge::before,
.custom-premier-badge::after {
  display: none !important;
  content: none !important;
}
.custom-premier-badge strong {
  position: absolute !important;
  z-index: 5 !important;
  left: 64% !important;
  top: 50% !important;
  width: 56% !important;
  transform: translate(-50%,-50%) !important;
  color: #FBFAFF !important;
  font-family: Inter, "Arial Narrow", sans-serif !important;
  font-size: 17px !important;
  font-style: italic !important;
  font-weight: 950 !important;
  letter-spacing: -.035em !important;
  line-height: 1 !important;
  text-align: center !important;
  white-space: nowrap !important;
  text-shadow: 0 1px 2px rgba(0,0,0,.96), 0 0 5px rgba(255,255,255,.08) !important;
}

.custom-premier-badge.tier-gray,
.custom-premier-badge.tier-unrated {
  --custom-premier-bg:url('assets/premier-custom-v3/gray.svg?v=53') !important;
}
.custom-premier-badge.tier-cyan {
  --custom-premier-bg:url('assets/premier-custom-v3/cyan.svg?v=53') !important;
}
.custom-premier-badge.tier-blue {
  --custom-premier-bg:url('assets/premier-custom-v3/blue.svg?v=53') !important;
}
.custom-premier-badge.tier-purple {
  --custom-premier-bg:url('assets/premier-custom-v3/purple.svg?v=53') !important;
}
.custom-premier-badge.tier-pink {
  --custom-premier-bg:url('assets/premier-custom-v3/pink.svg?v=53') !important;
}
.custom-premier-badge.tier-red {
  --custom-premier-bg:url('assets/premier-custom-v3/red.svg?v=53') !important;
}
.custom-premier-badge.tier-gold {
  --custom-premier-bg:url('assets/premier-custom-v3/gold.svg?v=53') !important;
}

@media (max-width:1180px) {
  .custom-premier-badge {
    width:160px !important;
    height:39px !important;
  }
  .custom-premier-badge strong {
    font-size:16px !important;
  }
}


/* v0.3.54 — Leetify card uses the same background surface as all other cards */
.leetify-card {
  border-color: rgba(141,167,207,.17) !important;
  background: linear-gradient(155deg, rgba(15,31,53,.96), rgba(7,17,31,.98)) !important;
  box-shadow: 0 22px 65px rgba(0,0,0,.24), inset 0 1px rgba(255,255,255,.018) !important;
}

/* Restore the normal card highlight instead of the special purple-tinted surface layer. */
.leetify-card::before {
  content:"" !important;
  position:absolute !important;
  pointer-events:none !important;
  inset:0 !important;
  background: linear-gradient(140deg, rgba(255,255,255,.025), transparent 28%) !important;
}

/* Same top separator/highlight as the rest of Launch Lab cards. */
.leetify-card::after {
  content:"" !important;
  position:absolute !important;
  pointer-events:none !important;
  left:0 !important;
  right:0 !important;
  top:0 !important;
  height:1px !important;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(35,201,255,.13),
    rgba(124,92,255,.16),
    transparent
  ) !important;
}


/* v0.3.55 — three-block row below Leetify: Premier / FACEIT / AI */

/* Equal three-column row on desktop. */
.secondary-grid {
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:12px !important;
  align-items:stretch !important;
}

/* Old rule made Premier span the full row; cancel it. */
.secondary-grid > .premier-card {
  grid-column:auto !important;
}

/* All three cards share the same footprint. */
.secondary-grid > .section-card {
  width:100% !important;
  min-width:0 !important;
  min-height:500px !important;
  height:100% !important;
  align-self:stretch !important;
  padding:22px !important;
}

/* PREMIER: keep only the content visible in the supplied reference.
   The season DOM stays present but is hidden so renderPremier() remains safe. */
.premier-card .section-head {
  margin-bottom:14px !important;
}
.premier-card #premierDetails {
  display:none !important;
}
.premier-card .premier-layout {
  display:block !important;
  min-height:0 !important;
}
.premier-card .premier-overview {
  display:flex !important;
  flex-direction:column !important;
  min-width:0 !important;
  height:100% !important;
  padding:0 !important;
  border:0 !important;
}
.premier-card .premier-season-detail {
  display:none !important;
}

/* Match the screenshot hierarchy inside Premier. */
.premier-card .provider-player-name {
  margin:3px 0 12px !important;
  min-height:52px !important;
  font-size:24px !important;
  line-height:1.35 !important;
}
.premier-card .rank-hero {
  margin:0 0 18px !important;
  min-height:82px !important;
  align-items:center !important;
}
.premier-card .recent-form-head {
  margin:2px 0 10px !important;
}
.premier-card #premierForm {
  min-height:36px !important;
  margin-bottom:16px !important;
}
.premier-card .premier-stat-grid {
  margin-top:auto !important;
  margin-bottom:16px !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:8px !important;
}
.premier-card .premier-current-meta {
  margin-top:0 !important;
  min-height:42px !important;
}

/* Empty-state remains available only when Premier itself is unavailable. */
.premier-card .empty-state:not(.hidden) {
  margin-top:14px !important;
}

/* FACEIT + AI: do not redesign; only normalize spacing/height. */
.secondary-grid > .faceit-card,
.secondary-grid > .ai-card {
  display:flex !important;
  flex-direction:column !important;
}
.faceit-card .faceit-stat-grid {
  margin-top:auto !important;
}
.ai-card .disclaimer {
  margin-top:auto !important;
}

/* Responsive: two columns, then one, without modifying individual content. */
@media (max-width:1180px) {
  .secondary-grid {
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  .secondary-grid > .ai-card {
    grid-column:1/-1 !important;
  }
}
@media (max-width:760px) {
  .secondary-grid {
    grid-template-columns:1fr !important;
  }
  .secondary-grid > .ai-card {
    grid-column:auto !important;
  }
  .secondary-grid > .section-card {
    min-height:0 !important;
  }
}


/* v0.3.57 — Rank + Skins split row */
.ranks-skins-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  align-items:stretch;
}

/* Rank block becomes half-width, with maps in two columns and Premier seasons below. */
.ranks-skins-grid > .rank-card {
  width:100%;
  min-width:0;
  height:100%;
}
.ranks-skins-grid .rank-card .rank-board {
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:16px !important;
}
.ranks-skins-grid .rank-card .competitive-grid {
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:8px !important;
}
.ranks-skins-grid .rank-card .competitive-rank {
  min-width:0 !important;
}
.ranks-skins-grid .rank-card .profile-premier-stack {
  margin:0 !important;
  padding:14px 0 0 !important;
  border-left:0 !important;
  border-top:1px solid var(--border) !important;
}
.ranks-skins-grid .rank-card .profile-premier-history {
  grid-template-columns:1fr !important;
}

/* Skins card */
.skins-card {
  display:flex;
  min-width:0;
  flex-direction:column;
  padding:22px;
}
.skins-head {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  margin-bottom:16px;
}
.skins-head > div {
  display:grid;
  gap:5px;
}
.skins-head .section-title {
  margin:0;
}
.skins-head span {
  color:var(--muted);
  font-size:10px;
  line-height:1.35;
}
.skins-preview {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  grid-auto-rows:minmax(150px,1fr);
  gap:10px;
  flex:1;
  align-content:start;
}
.skin-preview-item {
  display:flex;
  min-width:0;
  flex-direction:column;
  overflow:hidden;
  border:1px solid var(--border);
  border-radius:14px;
  background:
    radial-gradient(circle at 50% 20%, rgba(103,132,189,.12), transparent 55%),
    rgba(255,255,255,.018);
}
.skin-preview-image {
  display:grid;
  place-items:center;
  min-height:105px;
  padding:10px;
  background:linear-gradient(180deg,rgba(255,255,255,.018),rgba(255,255,255,0));
}
.skin-preview-image img {
  display:block;
  width:100%;
  max-width:175px;
  height:95px;
  object-fit:contain;
  filter:drop-shadow(0 8px 12px rgba(0,0,0,.28));
}
.skin-preview-image span {
  color:#7087aa;
  font-size:20px;
  font-weight:900;
}
.skin-preview-copy {
  display:grid;
  gap:4px;
  padding:10px 12px 12px;
  border-top:1px solid rgba(142,171,211,.09);
}
.skin-preview-copy strong {
  overflow:hidden;
  color:#eef4ff;
  font-size:11px;
  line-height:1.25;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.skin-preview-copy span {
  color:var(--muted-2);
  font-size:8px;
  text-transform:uppercase;
  letter-spacing:.06em;
}
.skins-empty {
  display:grid;
  grid-column:1/-1;
  place-items:center;
  min-height:180px;
  padding:20px;
  border:1px dashed var(--border);
  border-radius:14px;
  color:var(--muted);
  text-align:center;
  font-size:11px;
}

@media (max-width:1100px) {
  .ranks-skins-grid {
    grid-template-columns:1fr;
  }
  .ranks-skins-grid .rank-card .competitive-grid {
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
  .skins-preview {
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}
@media (max-width:760px) {
  .ranks-skins-grid .rank-card .competitive-grid,
  .skins-preview {
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}
@media (max-width:520px) {
  .ranks-skins-grid .rank-card .competitive-grid,
  .skins-preview {
    grid-template-columns:1fr !important;
  }
}


/* v0.3.58 — use the existing Inventory / Value History block beside Ranks */
.ranks-skins-grid > .bottom-grid {
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:12px !important;
  margin-top:0 !important;
  min-width:0 !important;
  height:100% !important;
  align-content:start !important;
}

.ranks-skins-grid > .bottom-grid > .inventory-card,
.ranks-skins-grid > .bottom-grid > .chart-card {
  width:100% !important;
  min-width:0 !important;
}

.ranks-skins-grid > .bottom-grid > .inventory-card {
  min-height:150px !important;
}

.ranks-skins-grid > .bottom-grid > .chart-card {
  min-height:0 !important;
  flex:1 !important;
}

.ranks-skins-grid > .bottom-grid .chart-wrap {
  min-height:260px !important;
}

/* The temporary v0.3.57 skins placeholder is no longer used. */
.skins-card,
.skins-preview {
  display:none !important;
}

@media (max-width:1100px) {
  .ranks-skins-grid > .bottom-grid {
    grid-template-columns:1fr !important;
  }
}


/* v0.3.59 — equal-height Ranks / Inventory row + scrollable long rank content */

/* One shared desktop height for the paired half-width blocks. */
.ranks-skins-grid {
  --ranks-inventory-height: 620px;
  align-items: stretch !important;
  min-height: var(--ranks-inventory-height) !important;
  height: var(--ranks-inventory-height) !important;
}

/* LEFT: Ranks fills the same height as the inventory/history column. */
.ranks-skins-grid > .rank-card {
  height: 100% !important;
  min-height: 0 !important;
  max-height: 100% !important;
  overflow: hidden !important;
}

.ranks-skins-grid > .rank-card .competitive-panel {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

.ranks-skins-grid > .rank-card .competitive-head {
  flex: 0 0 auto !important;
}

/* Maps + Premier seasons share one internal scrollbar. */
.ranks-skins-grid > .rank-card .rank-board {
  display: block !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  height: auto !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: rgba(141, 100, 255, .58) rgba(11, 24, 41, .48);
  padding-right: 7px !important;
}

.ranks-skins-grid > .rank-card .rank-board::-webkit-scrollbar {
  width: 7px;
}
.ranks-skins-grid > .rank-card .rank-board::-webkit-scrollbar-track {
  border-radius: 999px;
  background: rgba(11, 24, 41, .48);
}
.ranks-skins-grid > .rank-card .rank-board::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(106, 91, 255, .78), rgba(195, 75, 220, .72));
}

/* Normalize the map tiles so their contents no longer drift. */
.ranks-skins-grid .rank-card .competitive-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  grid-auto-rows: 62px !important;
  gap: 8px !important;
  align-items: stretch !important;
  align-content: start !important;
}

.ranks-skins-grid .rank-card .competitive-rank {
  display: grid !important;
  grid-template-columns: 48px minmax(0, 1fr) 58px !important;
  gap: 9px !important;
  align-items: center !important;
  height: 62px !important;
  min-height: 62px !important;
  padding: 6px 8px !important;
}

.ranks-skins-grid .rank-card .map-visual {
  width: 46px !important;
  height: 46px !important;
  justify-self: start !important;
}

.ranks-skins-grid .rank-card .map-visual img {
  width: 43px !important;
  height: 43px !important;
}

.ranks-skins-grid .rank-card .competitive-rank-copy {
  align-self: center !important;
  min-width: 0 !important;
}

.ranks-skins-grid .rank-card .competitive-rank-icon {
  width: 56px !important;
  height: 30px !important;
  justify-self: end !important;
  object-fit: contain !important;
}

/* Premier-by-season remains below the map grid, inside the same scroll area. */
.ranks-skins-grid .rank-card .profile-premier-stack {
  margin-top: 14px !important;
  padding-top: 14px !important;
  padding-bottom: 4px !important;
}

/* RIGHT: Inventory + history uses exactly the same paired height. */
.ranks-skins-grid > .bottom-grid {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  gap: 12px !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: 100% !important;
  overflow: hidden !important;
  align-content: stretch !important;
}

.ranks-skins-grid > .bottom-grid > .inventory-card {
  min-height: 0 !important;
  height: auto !important;
  flex: none !important;
}

.ranks-skins-grid > .bottom-grid > .chart-card {
  min-height: 0 !important;
  height: 100% !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
}

.ranks-skins-grid > .bottom-grid > .chart-card .chart-head {
  flex: 0 0 auto !important;
}

.ranks-skins-grid > .bottom-grid > .chart-card .chart-wrap {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  height: auto !important;
  overflow: hidden !important;
}

/* On narrower layouts the blocks stack; remove the artificial paired height. */
@media (max-width: 1100px) {
  .ranks-skins-grid {
    height: auto !important;
    min-height: 0 !important;
  }

  .ranks-skins-grid > .rank-card,
  .ranks-skins-grid > .bottom-grid {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  .ranks-skins-grid > .rank-card .competitive-panel {
    height: auto !important;
    overflow: visible !important;
  }

  .ranks-skins-grid > .rank-card .rank-board {
    max-height: none !important;
    overflow: visible !important;
    padding-right: 0 !important;
  }

  .ranks-skins-grid > .bottom-grid > .chart-card {
    min-height: 320px !important;
  }
}

@media (max-width: 760px) {
  .ranks-skins-grid .rank-card .competitive-grid {
    grid-template-columns: 1fr !important;
  }
}


/* v0.3.60 — align the Ranks / Inventory pair with the rest of the page */
.ranks-skins-grid {
  width: 100% !important;
  margin-top: 12px !important;
  gap: 12px !important;
  box-sizing: border-box !important;
}

/* Remove child-specific vertical offset: spacing belongs to the parent row. */
.ranks-skins-grid > .rank-card {
  margin-top: 0 !important;
}

.ranks-skins-grid > .bottom-grid {
  margin-top: 0 !important;
}

/* Keep both halves anchored to exactly the same top and bottom lines. */
.ranks-skins-grid > .rank-card,
.ranks-skins-grid > .bottom-grid {
  align-self: stretch !important;
}

/* Match the standard full-width card gutters below/above. */
.ranks-skins-grid > * {
  min-width: 0 !important;
}

@media (max-width:1100px) {
  .ranks-skins-grid {
    margin-top:12px !important;
  }
}


/* v0.3.62 — Premier card top section */
.premier-card .premier-cs2-icon {
  overflow:hidden !important;
  padding:0 !important;
  background:#0d1b2d !important;
}
.premier-card .premier-cs2-icon img {
  display:block !important;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  border-radius:inherit !important;
}

/* Nick remains the main identity line. */
.premier-card .provider-player-name {
  min-height:0 !important;
  margin:10px 0 18px !important;
}

/* Only the rating badge remains — no duplicate text rating beside/below it. */
.premier-card .premier-current-rank {
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  min-height:54px !important;
  margin:0 0 24px !important;
}
.premier-card .premier-current-badge-host {
  display:block !important;
  width:auto !important;
  min-width:0 !important;
}
.premier-card .premier-current-custom-badge {
  width:190px !important;
  height:46px !important;
}
.premier-card .premier-current-custom-badge strong {
  font-size:19px !important;
}

/* Recent form now uses the same compact W/L tiles as FACEIT. */
.premier-card .recent-form-head {
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  margin:0 0 10px !important;
}
.premier-card #premierForm {
  display:flex !important;
  flex-wrap:wrap !important;
  gap:6px !important;
  min-height:31px !important;
  margin:0 0 22px !important;
}
.premier-card #premierForm .result {
  display:grid !important;
  place-items:center !important;
  width:31px !important;
  height:31px !important;
  border-radius:4px !important;
  font-size:16px !important;
}

/* Rating was removed from the lower stats: keep the remaining three evenly spaced. */
.premier-card .premier-stat-grid {
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
}


/* v0.3.63 — Premier card cleanup and vertical alignment */

/* Remove the lower source/info strip visually, but keep the DOM target for JS. */
.premier-card #premierCurrentMeta {
  display:none !important;
}

/* Use the full card height and align the content as one clean column. */
.premier-card .premier-layout {
  height:100% !important;
}

.premier-card .premier-overview {
  display:flex !important;
  flex-direction:column !important;
  flex:1 1 auto !important;
  height:100% !important;
  min-height:0 !important;
}

/* Header/nickname/rating spacing. */
.premier-card .provider-player-name {
  margin:8px 0 18px !important;
  line-height:1.25 !important;
}

.premier-card .premier-current-rank {
  min-height:48px !important;
  margin:0 0 26px !important;
}

/* Recent-form block becomes a compact aligned section. */
.premier-card .recent-form-head {
  margin:0 0 9px !important;
  min-height:24px !important;
  align-items:center !important;
}

.premier-card #premierForm {
  min-height:31px !important;
  margin:0 0 24px !important;
  align-items:center !important;
}

/* Keep the three statistics on one baseline at the bottom,
   matching the FACEIT card's visual rhythm. */
.premier-card .premier-stat-grid {
  margin-top:auto !important;
  margin-bottom:0 !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:12px !important;
  align-items:end !important;
}

.premier-card .premier-stat-grid > div {
  min-width:0 !important;
}

.premier-card .premier-stat-grid span {
  min-height:14px !important;
  line-height:1.2 !important;
}

.premier-card .premier-stat-grid strong {
  margin-top:7px !important;
  line-height:1 !important;
}

/* If Premier is unavailable, the error state should fill the freed space cleanly. */
.premier-card .empty-state:not(.hidden) {
  margin-top:18px !important;
  margin-bottom:auto !important;
}


/* v0.3.64 — Premier card layout containment fix */

/* The previous patch gave .premier-layout height:100% in addition to the header,
   which pushed the stat row below the visible card. Make the whole card a true
   column layout and let the content area consume only the remaining height. */
.secondary-grid > .premier-card {
  display:flex !important;
  flex-direction:column !important;
  box-sizing:border-box !important;
  overflow:hidden !important;
}

.premier-card .section-head {
  flex:0 0 auto !important;
}

.premier-card .premier-layout {
  display:flex !important;
  flex:1 1 auto !important;
  min-height:0 !important;
  height:auto !important;
  overflow:hidden !important;
}

.premier-card .premier-overview {
  display:flex !important;
  flex:1 1 auto !important;
  flex-direction:column !important;
  min-height:0 !important;
  height:auto !important;
  overflow:hidden !important;
}

/* Compact, predictable vertical rhythm. */
.premier-card .provider-player-name {
  flex:0 0 auto !important;
  margin:8px 0 14px !important;
}

.premier-card .premier-current-rank {
  flex:0 0 auto !important;
  min-height:46px !important;
  margin:0 0 22px !important;
}

.premier-card .recent-form-head {
  flex:0 0 auto !important;
  margin:0 0 8px !important;
}

.premier-card #premierForm {
  flex:0 0 auto !important;
  margin:0 0 20px !important;
}

/* Statistics remain on the bottom baseline, but now inside the card. */
.premier-card .premier-stat-grid {
  flex:0 0 auto !important;
  width:100% !important;
  margin-top:auto !important;
  margin-bottom:2px !important;
  padding-top:14px !important;
  border-top:1px solid rgba(141,167,207,.11) !important;
  align-items:start !important;
}

.premier-card .premier-stat-grid > div {
  align-self:start !important;
}

.premier-card .premier-stat-grid span {
  display:block !important;
  min-height:12px !important;
  margin:0 !important;
}

.premier-card .premier-stat-grid strong {
  display:block !important;
  margin-top:8px !important;
  line-height:1.05 !important;
}

/* Hidden source line must consume no layout space at all. */
.premier-card #premierCurrentMeta {
  display:none !important;
  width:0 !important;
  height:0 !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
}


/* v0.3.65 — pin Matches / K/D / HS% to the actual bottom of the Premier card */
.secondary-grid > .premier-card {
  position:relative !important;
}

/* Reserve room so the content above can never overlap the bottom statistics. */
.premier-card .premier-layout {
  padding-bottom:76px !important;
  box-sizing:border-box !important;
}

/* Bottom stats are anchored to the card itself, not to the changing content height. */
.premier-card .premier-stat-grid {
  position:absolute !important;
  left:22px !important;
  right:22px !important;
  bottom:20px !important;
  width:auto !important;
  margin:0 !important;
  padding:14px 0 0 !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:12px !important;
  border-top:1px solid rgba(141,167,207,.11) !important;
  z-index:2 !important;
}

/* Stable baseline and spacing for all three values. */
.premier-card .premier-stat-grid > div {
  min-width:0 !important;
  align-self:start !important;
}
.premier-card .premier-stat-grid span {
  display:block !important;
  margin:0 !important;
  min-height:12px !important;
  line-height:1.1 !important;
}
.premier-card .premier-stat-grid strong {
  display:block !important;
  margin-top:8px !important;
  line-height:1 !important;
}

@media (max-width:760px) {
  /* On stacked mobile cards return to natural document flow. */
  .premier-card .premier-layout {
    padding-bottom:0 !important;
  }
  .premier-card .premier-stat-grid {
    position:static !important;
    width:100% !important;
    margin-top:18px !important;
    padding-top:14px !important;
  }
}


/* v0.3.66 — Premier recent form: exactly one row, maximum 9 tiles */
.premier-card #premierForm {
  flex-wrap: nowrap !important;
  overflow: hidden !important;
  max-width: 100% !important;
}
.premier-card #premierForm .result:nth-child(n+10) {
  display: none !important;
}


/* v0.3.67 — standard 10-match Premier recent form */
.premier-card #premierForm {
  display:flex !important;
  flex-wrap:nowrap !important;
  gap:5px !important;
  overflow:hidden !important;
  width:100% !important;
  max-width:100% !important;
}

/* Slightly smaller than FACEIT so ten results fit cleanly in this card. */
.premier-card #premierForm .result {
  flex:0 0 27px !important;
  width:27px !important;
  height:27px !important;
  min-width:27px !important;
  border-radius:4px !important;
  font-size:14px !important;
}

/* v0.3.66 hid item #10 defensively; restore it and only hide beyond ten. */
.premier-card #premierForm .result:nth-child(10) {
  display:grid !important;
}
.premier-card #premierForm .result:nth-child(n+11) {
  display:none !important;
}


/* v0.3.68 — Premier recent form: centered 5x2 layout */
.premier-card #premierForm {
  display:grid !important;
  grid-template-columns:repeat(5, 36px) !important;
  grid-auto-rows:36px !important;
  gap:8px !important;
  width:max-content !important;
  max-width:100% !important;
  min-height:80px !important;
  margin:0 auto 22px !important;
  overflow:visible !important;
  justify-content:center !important;
  align-content:center !important;
}

/* Larger, more readable FACEIT-style result tiles. */
.premier-card #premierForm .result {
  display:grid !important;
  place-items:center !important;
  width:36px !important;
  height:36px !important;
  min-width:36px !important;
  flex:none !important;
  border-radius:5px !important;
  font-size:17px !important;
  line-height:1 !important;
}

/* Exactly ten positions maximum. */
.premier-card #premierForm .result:nth-child(-n+10) {
  display:grid !important;
}
.premier-card #premierForm .result:nth-child(n+11) {
  display:none !important;
}

/* Keep the recent-form section visually centered within the card body. */
.premier-card .recent-form-head {
  width:100% !important;
}


/* v0.3.69 — Premier form uses real Leetify Premier matches */
.premier-card #premierForm {
  display:flex !important;
  flex-wrap:wrap !important;
  justify-content:center !important;
  align-content:center !important;
  gap:8px !important;
  width:212px !important; /* 5 × 36px + 4 × 8px */
  max-width:100% !important;
  min-height:80px !important;
  margin:0 auto 22px !important;
  overflow:visible !important;
}
.premier-card #premierForm .result {
  flex:0 0 36px !important;
  width:36px !important;
  height:36px !important;
  min-width:36px !important;
}
.premier-card #premierForm .result.d {
  color:#d9e2f2 !important;
  border-color:rgba(163,181,210,.35) !important;
  background:rgba(116,136,168,.12) !important;
}

/* Never show more than ten live results. */
.premier-card #premierForm .result:nth-child(n+11) {
  display:none !important;
}


/* v0.3.70 — larger Premier form tiles and true vertical centering */
.premier-card .premier-overview {
  position:relative !important;
}

/* Form heading stays in normal flow. */
.premier-card .recent-form-head {
  flex:0 0 auto !important;
  margin:0 !important;
}

/* Create a flexible middle zone between heading and bottom stats.
   The W/L grid is centered horizontally AND vertically inside it. */
.premier-card #premierForm {
  display:flex !important;
  flex:1 1 auto !important;
  flex-wrap:wrap !important;
  justify-content:center !important;
  align-content:center !important;
  align-items:center !important;

  width:260px !important;
  max-width:100% !important;
  min-height:132px !important;

  margin:0 auto 76px !important; /* reserve bottom stats area */
  padding:14px 0 !important;
  gap:10px !important;
  box-sizing:border-box !important;
  overflow:visible !important;
}

/* 5 columns × 2 rows, larger and easier to read. */
.premier-card #premierForm .result {
  flex:0 0 44px !important;
  width:44px !important;
  height:44px !important;
  min-width:44px !important;

  display:grid !important;
  place-items:center !important;

  border-radius:6px !important;
  font-size:19px !important;
  line-height:1 !important;
}

/* Keep ten as the hard maximum. */
.premier-card #premierForm .result:nth-child(-n+10) {
  display:grid !important;
}
.premier-card #premierForm .result:nth-child(n+11) {
  display:none !important;
}

/* Bottom stats remain pinned to the card bottom. */
.premier-card .premier-stat-grid {
  bottom:20px !important;
}

/* On mobile return to natural flow while preserving the 5x2 visual when space allows. */
@media (max-width:760px) {
  .premier-card #premierForm {
    flex:0 0 auto !important;
    width:260px !important;
    min-height:118px !important;
    margin:14px auto 20px !important;
    padding:8px 0 !important;
  }

  .premier-card #premierForm .result {
    width:42px !important;
    height:42px !important;
    min-width:42px !important;
    flex-basis:42px !important;
    font-size:18px !important;
  }
}


/* v0.3.71 — compact Premier / FACEIT / AI row */

/* Reduce the common card footprint while keeping all three aligned. */
.secondary-grid {
  align-items: stretch !important;
}

.secondary-grid > .section-card {
  min-height: 460px !important;
  height: 460px !important;
  padding: 20px !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
}

/* Use Premier's lower statistic row as the common visual bottom baseline. */
.premier-card .premier-stat-grid {
  left: 20px !important;
  right: 20px !important;
  bottom: 18px !important;
}

/* Slightly tighten Premier spacing so the larger 5x2 form still breathes. */
.premier-card .provider-player-name {
  margin: 6px 0 10px !important;
}
.premier-card .premier-current-rank {
  margin: 0 0 14px !important;
}
.premier-card #premierForm {
  min-height: 116px !important;
  margin: 0 auto 70px !important;
  padding: 8px 0 !important;
}

/* FACEIT: same bottom baseline as Premier without redesigning its content. */
.secondary-grid > .faceit-card {
  min-height: 460px !important;
  height: 460px !important;
}
.faceit-card .faceit-showcase {
  margin: 12px 0 10px !important;
}
.faceit-card .recent-form-head {
  margin: 12px 0 7px !important;
}
.faceit-card .faceit-stat-grid {
  margin-top: auto !important;
  margin-bottom: 0 !important;
  padding-top: 14px !important;
  border-top: 1px solid rgba(141,167,207,.11) !important;
}

/* AI: compact internal gaps; disclaimer stays aligned near the bottom. */
.secondary-grid > .ai-card {
  min-height: 460px !important;
  height: 460px !important;
}
.ai-card .section-head {
  margin-bottom: 10px !important;
}
.ai-card .disclaimer {
  margin-top: auto !important;
  margin-bottom: 0 !important;
}

/* On narrower layouts return to natural heights to avoid clipping. */
@media (max-width: 1180px) {
  .secondary-grid > .section-card,
  .secondary-grid > .faceit-card,
  .secondary-grid > .ai-card {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  .premier-card #premierForm {
    margin-bottom: 76px !important;
  }
}


/* v0.3.72 — Premier card centering + bottom stats pinned lower */

/* Header stays left-aligned: CS2 logo + Premier text are intentionally untouched. */

/* Center the nickname block. */
.premier-card .provider-player-name {
  width:100% !important;
  justify-content:center !important;
  text-align:center !important;
  align-items:center !important;
}

/* Center the current Premier badge. */
.premier-card .premier-current-rank {
  width:100% !important;
  justify-content:center !important;
  text-align:center !important;
}
.premier-card .premier-current-badge-host {
  margin-left:auto !important;
  margin-right:auto !important;
}

/* "Недавня форма" stays left and W/L summary stays right as requested. */
.premier-card .recent-form-head {
  justify-content:space-between !important;
  text-align:left !important;
}

/* The actual 5x2 result grid stays centered. */
.premier-card #premierForm {
  margin-left:auto !important;
  margin-right:auto !important;
  justify-content:center !important;
}

/* Put Matches / K/D / HS% as low as possible inside the card. */
.premier-card .premier-layout {
  padding-bottom:66px !important;
}

.premier-card .premier-stat-grid {
  left:20px !important;
  right:20px !important;
  bottom:10px !important;
  padding-top:12px !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
}

/* Center every lower statistic inside its own third. */
.premier-card .premier-stat-grid > div {
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:flex-end !important;
  text-align:center !important;
}

.premier-card .premier-stat-grid span,
.premier-card .premier-stat-grid strong {
  width:100% !important;
  text-align:center !important;
}

/* Keep the form vertically balanced above the now-lower stat row. */
.premier-card #premierForm {
  margin-bottom:62px !important;
}

@media (max-width:760px) {
  .premier-card .premier-layout {
    padding-bottom:0 !important;
  }

  .premier-card .premier-stat-grid {
    position:static !important;
    margin-top:16px !important;
    padding-top:12px !important;
  }

  .premier-card #premierForm {
    margin-bottom:18px !important;
  }
}


/* v0.3.73 — Premier bottom stats truly pinned to the card bottom */

/* Keep only the header area fixed and let the content use the full remaining height. */
.secondary-grid > .premier-card {
  position:relative !important;
  display:flex !important;
  flex-direction:column !important;
}

.premier-card .section-head {
  flex:0 0 auto !important;
}

.premier-card .premier-layout {
  position:relative !important;
  flex:1 1 auto !important;
  min-height:0 !important;
  height:auto !important;
  padding-bottom:88px !important; /* reserve exact room for the bottom stat row */
  box-sizing:border-box !important;
}

.premier-card .premier-overview {
  position:relative !important;
  flex:1 1 auto !important;
  min-height:0 !important;
  padding-bottom:0 !important;
}

/* Center the main content block while keeping title/form labels untouched. */
.premier-card .provider-player-name,
.premier-card .premier-current-rank,
.premier-card #premierForm {
  margin-left:auto !important;
  margin-right:auto !important;
}

/* The 5x2 recent form sits above the bottom stats with a stable gap. */
.premier-card #premierForm {
  margin-top:10px !important;
  margin-bottom:90px !important;
}

/* Pin the lower three stats almost flush with the card bottom. */
.premier-card .premier-stat-grid {
  position:absolute !important;
  left:20px !important;
  right:20px !important;
  bottom:8px !important;
  width:auto !important;
  margin:0 !important;
  padding-top:12px !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:12px !important;
  border-top:1px solid rgba(141,167,207,.11) !important;
  z-index:3 !important;
}

.premier-card .premier-stat-grid > div {
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:flex-end !important;
  text-align:center !important;
}

.premier-card .premier-stat-grid span,
.premier-card .premier-stat-grid strong {
  width:100% !important;
  text-align:center !important;
}

@media (max-width:760px) {
  .premier-card .premier-layout {
    padding-bottom:0 !important;
  }
  .premier-card #premierForm {
    margin-bottom:20px !important;
  }
  .premier-card .premier-stat-grid {
    position:static !important;
    width:100% !important;
    margin-top:16px !important;
    padding-top:12px !important;
  }
}


/* v0.3.74 — fix Premier bottom-row containing block */
.secondary-grid > .premier-card {
  position:relative !important;
}
.premier-card .premier-overview {
  position:static !important;
}
.premier-card .premier-stat-grid {
  position:absolute !important;
  left:20px !important;
  right:20px !important;
  bottom:14px !important;
  width:auto !important;
  margin:0 !important;
  padding-top:10px !important;
  box-sizing:border-box !important;
  z-index:8 !important;
}
.premier-card .premier-layout {
  padding-bottom:82px !important;
}
.premier-card .premier-stat-grid strong {
  position:relative !important;
  z-index:9 !important;
  padding-bottom:1px !important;
}
@media (max-width:760px) {
  .premier-card .premier-overview {
    position:relative !important;
  }
  .premier-card .premier-stat-grid {
    position:static !important;
    width:100% !important;
    margin-top:16px !important;
  }
  .premier-card .premier-layout {
    padding-bottom:0 !important;
  }
}


/* v0.3.75 FACEIT card refresh */
.faceit-brand-icon {
  background: rgba(255,122,39,.12) !important;
}
.faceit-brand-icon img {
  width: 20px;
  height: 20px;
  object-fit: contain;
  display: block;
}
.secondary-grid > .faceit-card {
  min-height: 460px !important;
  height: 460px !important;
  display: flex;
  flex-direction: column;
}
.faceit-card .section-head {
  margin-bottom: 8px !important;
}
.faceit-card .section-title {
  gap: 12px;
}
.faceit-card .section-title span:last-child {
  font-size: 17px;
  font-weight: 900;
}
.faceit-card .faceit-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.faceit-card .faceit-showcase {
  display: flex;
  align-items: center;
  gap: 18px;
  margin: 18px 0 20px !important;
}
.faceit-card .faceit-official-level {
  flex: 0 0 82px;
  width: 82px;
  height: 82px;
  border-radius: 24px;
  background: linear-gradient(180deg, #ff8f2e 0%, #ff6d12 52%, #de4f00 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 16px 30px rgba(255,111,17,.18);
  color: #fff;
  font-size: 24px;
  font-weight: 950;
  letter-spacing: -.03em;
}
.faceit-card .faceit-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 7px;
}
.faceit-card .faceit-player-line {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 18px;
  font-weight: 900;
  line-height: 1.15;
}
.faceit-card .faceit-player-line .flag-emoji {
  font-size: 18px;
  line-height: 1;
}
.faceit-card .faceit-player-line #faceitPlayerName {
  overflow-wrap: anywhere;
}
.faceit-card .faceit-meta-line {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  color: var(--muted);
  font-size: 13px;
  font-weight: 700;
}
.faceit-card .faceit-meta-line strong {
  color: var(--text);
  font-size: 15px;
  font-weight: 900;
}
.faceit-card .recent-form-head {
  margin: 10px 0 10px !important;
}
.faceit-card #faceitForm {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px 10px;
  max-width: 286px;
  width: 100%;
  margin: 0 auto 22px !important;
  min-height: 92px;
  align-content: center;
}
.faceit-card #faceitForm .result {
  width: 42px;
  height: 42px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 900;
}
.faceit-card .faceit-stat-grid {
  grid-template-columns: repeat(3, 1fr) !important;
  margin-top: auto !important;
  margin-bottom: 0 !important;
  padding-top: 14px !important;
  border-top: 1px solid rgba(141,167,207,.11) !important;
}
.faceit-card .faceit-stat-grid > div {
  text-align: center;
}
.faceit-card .faceit-hidden-meta {
  display: none !important;
}
@media (max-width: 820px) {
  .faceit-card .faceit-showcase {
    align-items: flex-start;
  }
}


/* v0.3.76 — FACEIT card structure matching Premier */

.secondary-grid > .faceit-card {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  height: 460px !important;
  min-height: 460px !important;
  overflow: hidden !important;
}

.faceit-card .section-head {
  flex: 0 0 auto !important;
  margin-bottom: 6px !important;
}

.faceit-card .faceit-brand-icon {
  padding: 6px !important;
  background: rgba(255,122,39,.10) !important;
}

.faceit-card .faceit-brand-icon img {
  width: 22px !important;
  height: 22px !important;
  object-fit: contain !important;
}

.faceit-card .faceit-content {
  position: relative !important;
  display: flex !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  flex-direction: column !important;
  padding-bottom: 82px !important;
  box-sizing: border-box !important;
}

/* 2. Large FACEIT nickname */
.faceit-card .faceit-main-nickname {
  width: 100% !important;
  margin: 12px 0 12px !important;
  text-align: center !important;
  justify-content: center !important;
  font-size: 24px !important;
  line-height: 1.18 !important;
  font-weight: 950 !important;
  overflow-wrap: anywhere !important;
}

/* 3. Official level icon + exact ELO */
.faceit-card .faceit-rank-line {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 14px !important;
  min-height: 64px !important;
  margin-bottom: 4px !important;
}

.faceit-card .faceit-level-icon {
  display: grid !important;
  place-items: center !important;
  width: 62px !important;
  height: 62px !important;
  flex: 0 0 62px !important;
}

.faceit-card .faceit-level-icon img {
  display: block !important;
  width: 62px !important;
  height: 62px !important;
  object-fit: contain !important;
  filter: drop-shadow(0 7px 12px rgba(0,0,0,.26));
}

.faceit-card .faceit-level-icon span {
  color: var(--muted) !important;
  font-size: 22px !important;
  font-weight: 900 !important;
}

.faceit-card .faceit-main-elo {
  color: var(--text) !important;
  font-size: 21px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

/* 4. Flag + 2–3 character country code */
.faceit-card .faceit-country-row {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  min-height: 24px !important;
  margin: 1px 0 8px !important;
}

.faceit-card .faceit-country-row .flag-emoji {
  font-size: 20px !important;
  line-height: 1 !important;
}

.faceit-card .faceit-country-row strong {
  color: var(--muted) !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  letter-spacing: .08em !important;
}

/* Same lower structure as Premier */
.faceit-card .recent-form-head {
  flex: 0 0 auto !important;
  margin: 5px 0 0 !important;
  justify-content: space-between !important;
}

.faceit-card #faceitForm {
  display: flex !important;
  flex: 1 1 auto !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-content: center !important;
  gap: 10px !important;
  width: 260px !important;
  max-width: 100% !important;
  min-height: 100px !important;
  margin: 0 auto 72px !important;
  padding: 6px 0 !important;
  box-sizing: border-box !important;
}

.faceit-card #faceitForm .result {
  display: grid !important;
  place-items: center !important;
  flex: 0 0 44px !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  border-radius: 6px !important;
  font-size: 18px !important;
  font-weight: 900 !important;
}

.faceit-card #faceitForm .result.d {
  color: #d9e2f2 !important;
  border-color: rgba(163,181,210,.35) !important;
  background: rgba(116,136,168,.12) !important;
}

.faceit-card #faceitForm .result:nth-child(n+11) {
  display: none !important;
}

/* Bottom row matches Premier: Matches / K/D / HS% */
.faceit-card .faceit-stat-grid {
  position: absolute !important;
  left: 20px !important;
  right: 20px !important;
  bottom: 14px !important;
  width: auto !important;
  margin: 0 !important;
  padding-top: 10px !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
  border-top: 1px solid rgba(141,167,207,.11) !important;
  z-index: 8 !important;
}

.faceit-card .faceit-stat-grid > div {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
}

.faceit-card .faceit-stat-grid span,
.faceit-card .faceit-stat-grid strong {
  width: 100% !important;
  text-align: center !important;
}

.faceit-card .faceit-hidden-meta {
  display: none !important;
}

@media (max-width: 760px) {
  .secondary-grid > .faceit-card {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  .faceit-card .faceit-content {
    padding-bottom: 0 !important;
  }

  .faceit-card #faceitForm {
    flex: 0 0 auto !important;
    margin-bottom: 20px !important;
  }

  .faceit-card .faceit-stat-grid {
    position: static !important;
    width: 100% !important;
    margin-top: 16px !important;
  }
}


/* v0.3.77 — FACEIT card flag image + lobby-style ELO pill */
.faceit-card .faceit-rank-pill {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  margin: 0 auto 6px !important;
  min-height: 48px !important;
  padding: 9px 16px 9px 10px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(246, 193, 74, .34) !important;
  background: linear-gradient(180deg, rgba(18,28,50,.98) 0%, rgba(10,16,32,.98) 100%) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.02), 0 10px 24px rgba(0,0,0,.18) !important;
}

.faceit-card .faceit-rank-pill-label {
  color: var(--text) !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  letter-spacing: .02em !important;
}

.faceit-card .faceit-level-icon {
  width: 28px !important;
  height: 28px !important;
  flex: 0 0 28px !important;
}

.faceit-card .faceit-level-icon img {
  width: 28px !important;
  height: 28px !important;
  filter: drop-shadow(0 2px 4px rgba(0,0,0,.26));
}

.faceit-card .faceit-main-elo {
  color: #f7f8fb !important;
  font-size: 14px !important;
  font-weight: 950 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

.faceit-card .faceit-country-row {
  gap: 8px !important;
  min-height: 28px !important;
  margin: 0 0 8px !important;
}

.faceit-card .country-flag-img {
  display: block !important;
  width: 24px !important;
  height: 18px !important;
  object-fit: cover !important;
  border-radius: 4px !important;
  box-shadow: 0 1px 2px rgba(0,0,0,.25) !important;
  background: rgba(255,255,255,.08) !important;
}

.faceit-card .flag-fallback {
  display: inline-grid !important;
  place-items: center !important;
  width: 24px !important;
  height: 18px !important;
  font-size: 16px !important;
  line-height: 1 !important;
}

.faceit-card .flag-poop {
  font-size: 18px !important;
}


/* v0.3.78 — FACEIT rank pill switched to the simpler native lobby-chip style */
.faceit-card .faceit-rank-pill {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 9px !important;
  width: fit-content !important;
  min-height: 40px !important;
  margin: 0 auto 8px !important;
  padding: 6px 14px 6px 10px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(247, 208, 84, 0.38) !important;
  background: rgba(9, 15, 29, 0.94) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.025) !important;
}

.faceit-card .faceit-level-icon {
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  min-height: 24px !important;
  flex: 0 0 24px !important;
  display: inline-grid !important;
  place-items: center !important;
}

.faceit-card .faceit-level-icon img {
  width: 24px !important;
  height: 24px !important;
  display: block !important;
  filter: none !important;
}

.faceit-card .faceit-rank-pill-label {
  color: rgba(255,255,255,0.92) !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  letter-spacing: 0.02em !important;
  text-transform: uppercase !important;
  line-height: 1 !important;
}

.faceit-card .faceit-main-elo {
  color: #f6c54f !important;
  font-size: 12px !important;
  font-weight: 950 !important;
  letter-spacing: 0.01em !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}


/* v0.3.79 — exact FACEIT badge implementation copied from Launch Lab Lobby */
.faceit-card .faceit-badge {
  --faceit-rgb: 255, 85, 0;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  width: fit-content !important;
  min-height: 0 !important;
  margin: 0 auto 8px !important;
  padding: 3px 9px 3px 4px !important;
  border: 1px solid rgba(var(--faceit-rgb), .42) !important;
  border-radius: 999px !important;
  background:
    linear-gradient(180deg, rgba(var(--faceit-rgb), .18), rgba(var(--faceit-rgb), .06)),
    rgba(5, 8, 18, .74) !important;
  color: rgb(var(--faceit-rgb)) !important;
  font-size: 9px !important;
  font-weight: 1000 !important;
  line-height: 1 !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 0 14px rgba(var(--faceit-rgb), .08) !important;
}

.faceit-card .faceit-level-icon {
  width: 28px !important;
  height: 28px !important;
  flex: 0 0 28px !important;
  display: inline-grid !important;
  place-items: center !important;
}

.faceit-card .faceit-level-icon img {
  width: 28px !important;
  height: 28px !important;
  display: block !important;
  object-fit: contain !important;
  filter: none !important;
}

.faceit-card .faceit-label {
  color: #fff2df !important;
}

.faceit-card .faceit-main-elo {
  color: rgba(255, 242, 223, .82) !important;
  font-size: 9px !important;
  font-weight: 1000 !important;
  line-height: 1 !important;
  letter-spacing: .04em !important;
  white-space: nowrap !important;
}

.faceit-card .faceit-level-1 { --faceit-rgb: 126, 139, 158; }
.faceit-card .faceit-level-2 { --faceit-rgb: 100, 166, 90; }
.faceit-card .faceit-level-3 { --faceit-rgb: 72, 190, 103; }
.faceit-card .faceit-level-4 { --faceit-rgb: 172, 202, 78; }
.faceit-card .faceit-level-5 { --faceit-rgb: 230, 197, 61; }
.faceit-card .faceit-level-6 { --faceit-rgb: 244, 169, 55; }
.faceit-card .faceit-level-7 { --faceit-rgb: 249, 132, 43; }
.faceit-card .faceit-level-8 { --faceit-rgb: 252, 97, 36; }
.faceit-card .faceit-level-9 { --faceit-rgb: 247, 71, 42; }
.faceit-card .faceit-level-10 { --faceit-rgb: 255, 85, 0; }

/* Explicitly neutralize reconstructed v0.3.77/v0.3.78 pill rules. */
.faceit-card .faceit-rank-pill,
.faceit-card .faceit-rank-pill-label {
  all: unset;
}


/* v0.3.80 — scale the ORIGINAL Launch Lab Lobby FACEIT badge for the Check card */
.faceit-card .faceit-badge {
  display: grid !important;
  grid-template-columns: 38px auto auto !important;
  align-items: center !important;
  justify-content: center !important;
  column-gap: 9px !important;

  width: 190px !important;
  min-width: 190px !important;
  height: 48px !important;
  min-height: 48px !important;
  box-sizing: border-box !important;

  margin: 2px auto 10px !important;
  padding: 5px 13px 5px 7px !important;

  border-radius: 999px !important;
  overflow: hidden !important;
  flex: 0 0 auto !important;
}

/* Keep the real Lobby level icon inside the pill instead of letting it protrude. */
.faceit-card .faceit-badge .faceit-level-icon {
  display: grid !important;
  place-items: center !important;
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  min-height: 38px !important;
  flex: 0 0 38px !important;
  margin: 0 !important;
  padding: 0 !important;
}

.faceit-card .faceit-badge .faceit-level-icon img {
  display: block !important;
  width: 38px !important;
  height: 38px !important;
  max-width: none !important;
  object-fit: contain !important;
  margin: 0 !important;
  filter: none !important;
}

/* Same original dynamic colors, only larger typography. */
.faceit-card .faceit-badge .faceit-label {
  display: block !important;
  color: #fff2df !important;
  font-size: 11px !important;
  font-weight: 1000 !important;
  line-height: 1 !important;
  letter-spacing: .035em !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

.faceit-card .faceit-badge .faceit-main-elo {
  display: block !important;
  color: rgba(255, 242, 223, .90) !important;
  font-size: 11px !important;
  font-weight: 1000 !important;
  line-height: 1 !important;
  letter-spacing: .02em !important;
  white-space: nowrap !important;
}

/* Stable vertical rhythm around the larger badge. */
.faceit-card .faceit-main-nickname {
  margin-bottom: 10px !important;
}

.faceit-card .faceit-country-row {
  margin: 0 0 8px !important;
  min-height: 24px !important;
}

/* Slightly tighten the live form area so the larger badge fits without pushing the bottom stats. */
.faceit-card #faceitForm {
  min-height: 88px !important;
  margin-bottom: 66px !important;
}


/* v0.3.81 — align FACEIT card content to the same visual rhythm as the Premier card */
.faceit-card .faceit-content {
  padding-bottom: 66px !important;
}

.faceit-card .faceit-main-nickname {
  width: 100% !important;
  margin: 12px 0 14px !important;
  text-align: center !important;
  justify-content: center !important;
  align-items: center !important;
}

.faceit-card .faceit-badge {
  width: 214px !important;
  min-width: 214px !important;
  height: 50px !important;
  min-height: 50px !important;
  margin: 0 auto 12px !important;
  padding: 5px 14px 5px 7px !important;
}

.faceit-card .faceit-badge .faceit-level-icon {
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  min-height: 38px !important;
}

.faceit-card .faceit-badge .faceit-level-icon img {
  width: 38px !important;
  height: 38px !important;
}

.faceit-card .faceit-country-row {
  width: 100% !important;
  justify-content: center !important;
  margin: 0 0 18px !important;
}

.faceit-card .recent-form-head {
  width: 100% !important;
  margin: 0 0 2px !important;
  justify-content: space-between !important;
}

.faceit-card #faceitForm {
  display: flex !important;
  flex: 1 1 auto !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-content: center !important;
  align-items: center !important;

  width: 260px !important;
  max-width: 100% !important;
  min-height: 132px !important;

  margin: 0 auto 62px !important;
  padding: 14px 0 !important;
  gap: 10px !important;
  box-sizing: border-box !important;
  overflow: visible !important;
}

.faceit-card #faceitForm .result {
  flex: 0 0 44px !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 6px !important;
  font-size: 19px !important;
  line-height: 1 !important;
}

.faceit-card .faceit-stat-grid {
  position: absolute !important;
  left: 20px !important;
  right: 20px !important;
  bottom: 10px !important;
  width: auto !important;
  margin: 0 !important;
  padding-top: 12px !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

.faceit-card .faceit-stat-grid > div {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-end !important;
  text-align: center !important;
}

.faceit-card .faceit-stat-grid span,
.faceit-card .faceit-stat-grid strong {
  width: 100% !important;
  text-align: center !important;
}

@media (max-width:760px) {
  .faceit-card .faceit-content {
    padding-bottom: 0 !important;
  }

  .faceit-card #faceitForm {
    flex: 0 0 auto !important;
    width: 260px !important;
    min-height: 118px !important;
    margin: 14px auto 20px !important;
    padding: 8px 0 !important;
  }

  .faceit-card #faceitForm .result {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    flex-basis: 42px !important;
    font-size: 18px !important;
  }

  .faceit-card .faceit-stat-grid {
    position: static !important;
    margin-top: 16px !important;
    padding-top: 12px !important;
  }
}


/* v0.3.82 — tighten and align FACEIT card to the Premier card rhythm */
.faceit-card .faceit-content {
  padding-top: 2px !important;
  padding-bottom: 82px !important;
}

/* Reserve a Premier-like heading block height so one-line FACEIT names do not pull the whole card upward. */
.faceit-card .faceit-main-nickname {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 72px !important;
  margin: 4px 0 8px !important;
  line-height: 1.18 !important;
}

/* Slightly larger and more centered badge, closer in visual weight to the Premier rank badge. */
.faceit-card .faceit-badge {
  width: 226px !important;
  min-width: 226px !important;
  height: 54px !important;
  min-height: 54px !important;
  margin: 0 auto 12px !important;
  padding: 6px 15px 6px 8px !important;
  grid-template-columns: 40px auto auto !important;
  column-gap: 10px !important;
}

.faceit-card .faceit-badge .faceit-level-icon {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  min-height: 40px !important;
  flex-basis: 40px !important;
}

.faceit-card .faceit-badge .faceit-level-icon img {
  width: 40px !important;
  height: 40px !important;
}

.faceit-card .faceit-badge .faceit-label,
.faceit-card .faceit-badge .faceit-main-elo {
  font-size: 11px !important;
}

.faceit-card .faceit-country-row {
  min-height: 28px !important;
  margin: 0 0 14px !important;
}

/* Match the vertical position of the form header/grid to the Premier card. */
.faceit-card .recent-form-head {
  margin: 0 0 6px !important;
}

.faceit-card #faceitForm {
  width: 260px !important;
  min-height: 122px !important;
  margin: 8px auto 90px !important;
  padding: 10px 0 !important;
  gap: 10px !important;
}

.faceit-card #faceitForm .result {
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  flex-basis: 44px !important;
  font-size: 19px !important;
}

/* Pin the lower row exactly like the Premier block. */
.faceit-card .faceit-stat-grid {
  left: 20px !important;
  right: 20px !important;
  bottom: 14px !important;
  width: auto !important;
  margin: 0 !important;
  padding-top: 10px !important;
  border-top: 1px solid rgba(141,167,207,.11) !important;
  box-sizing: border-box !important;
  z-index: 8 !important;
}

.faceit-card .faceit-stat-grid strong {
  position: relative !important;
  z-index: 9 !important;
  padding-bottom: 1px !important;
}

@media (max-width:760px) {
  .faceit-card .faceit-content {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
  .faceit-card .faceit-main-nickname {
    min-height: 0 !important;
    margin: 8px 0 8px !important;
  }
  .faceit-card .faceit-badge {
    width: 214px !important;
    min-width: 214px !important;
    height: 50px !important;
    min-height: 50px !important;
  }
  .faceit-card #faceitForm {
    min-height: 118px !important;
    margin: 10px auto 20px !important;
  }
  .faceit-card .faceit-stat-grid {
    position: static !important;
    width: 100% !important;
    margin-top: 16px !important;
  }
}


/* v0.3.83 — move flag/country into the FACEIT level row to free vertical space */
.faceit-card .faceit-badge {
  grid-template-columns: 38px auto auto auto !important;
  width: 258px !important;
  min-width: 258px !important;
  padding: 5px 14px 5px 7px !important;
  column-gap: 8px !important;
}

.faceit-card .faceit-country-inline {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 6px !important;
  min-width: 0 !important;
  white-space: nowrap !important;
}

.faceit-card .faceit-country-inline .flag-emoji {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 18px !important;
  line-height: 1 !important;
}

.faceit-card .faceit-country-inline strong {
  font-size: 11px !important;
  font-weight: 1000 !important;
  line-height: 1 !important;
  letter-spacing: .03em !important;
  color: rgba(255, 242, 223, .88) !important;
}

/* Standalone country row removed in markup; keep hidden as safety for older DOM. */
.faceit-card .faceit-country-row {
  display: none !important;
}

/* Since the country now lives in the badge, tighten the gap before recent form. */
.faceit-card .faceit-badge {
  margin: 0 auto 16px !important;
}

.faceit-card .recent-form-head {
  margin: 0 0 4px !important;
}

@media (max-width: 760px) {
  .faceit-card .faceit-badge {
    width: 244px !important;
    min-width: 244px !important;
    grid-template-columns: 36px auto auto auto !important;
    column-gap: 7px !important;
  }
  .faceit-card .faceit-country-inline .flag-emoji {
    font-size: 17px !important;
  }
  .faceit-card .faceit-country-inline strong,
  .faceit-card .faceit-badge .faceit-label,
  .faceit-card .faceit-badge .faceit-main-elo {
    font-size: 10px !important;
  }
}


/* v0.3.84 — lock FACEIT internal rhythm to the same vertical levels as Premier */
.faceit-card .section-head {
  margin-bottom: 10px !important;
}

.faceit-card .faceit-content {
  display: grid !important;
  grid-template-rows: 74px 54px 28px 112px !important;
  align-content: start !important;
  row-gap: 12px !important;
  padding-top: 4px !important;
  padding-bottom: 82px !important;
  box-sizing: border-box !important;
}

.faceit-card .faceit-main-nickname {
  margin: 0 !important;
  min-height: 0 !important;
  width: 100% !important;
  align-self: center !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  line-height: 1.18 !important;
}

.faceit-card .faceit-badge {
  align-self: center !important;
  margin: 0 auto !important;
}

.faceit-card .recent-form-head {
  align-self: end !important;
  width: 100% !important;
  margin: 0 !important;
  min-height: 28px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

.faceit-card #faceitForm {
  align-self: start !important;
  margin: 0 auto !important;
  min-height: 98px !important;
  padding: 0 !important;
  width: 260px !important;
  max-width: 100% !important;
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-content: start !important;
  gap: 10px !important;
}

/* Keep the country visually balanced inside the long pill. */
.faceit-card .faceit-country-inline {
  margin-left: 2px !important;
  gap: 5px !important;
}

/* Preserve the same bottom line as Premier. */
.faceit-card .faceit-stat-grid {
  bottom: 14px !important;
}

@media (max-width: 760px) {
  .faceit-card .faceit-content {
    display: flex !important;
    flex-direction: column !important;
    row-gap: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  .faceit-card .faceit-main-nickname,
  .faceit-card .faceit-badge,
  .faceit-card .recent-form-head,
  .faceit-card #faceitForm {
    align-self: auto !important;
  }

  .faceit-card .faceit-main-nickname {
    margin: 8px 0 !important;
  }

  .faceit-card .faceit-badge {
    margin: 0 auto 10px !important;
  }

  .faceit-card .recent-form-head {
    margin: 0 0 8px !important;
  }

  .faceit-card #faceitForm {
    margin: 0 auto 20px !important;
  }
}


/* v0.3.85 — hide FACEIT profile button and align header with Premier */
.faceit-card #faceitProfileButton {
  display: none !important;
}

.faceit-card .section-head {
  justify-content: flex-start !important;
  margin-bottom: 10px !important;
}

.faceit-card .faceit-content {
  padding-top: 0 !important;
}


/* v0.3.86 — hard-align FACEIT card geometry to the Premier card */
.secondary-grid > .faceit-card {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
}

.faceit-card .section-head {
  flex: 0 0 auto !important;
  margin-bottom: 10px !important;
}

.faceit-card .faceit-content {
  position: relative !important;
  display: block !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  height: auto !important;
  padding: 0 0 82px !important;
  box-sizing: border-box !important;
}

/* Use the same vertical rhythm as the Premier block: name zone, badge zone, form zone, bottom stats. */
.faceit-card .faceit-main-nickname {
  position: absolute !important;
  left: 18px !important;
  right: 18px !important;
  top: 26px !important;
  margin: 0 !important;
  min-height: 56px !important;
  width: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  line-height: 1.18 !important;
}

.faceit-card .faceit-badge {
  position: absolute !important;
  left: 50% !important;
  top: 102px !important;
  transform: translateX(-50%) !important;
  margin: 0 !important;
  width: 262px !important;
  min-width: 262px !important;
}

.faceit-card .recent-form-head {
  position: absolute !important;
  left: 20px !important;
  right: 20px !important;
  top: 182px !important;
  width: auto !important;
  margin: 0 !important;
  min-height: 28px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

.faceit-card #faceitForm {
  position: absolute !important;
  left: 50% !important;
  top: 224px !important;
  transform: translateX(-50%) !important;
  margin: 0 !important;
  width: 260px !important;
  max-width: 100% !important;
  min-height: 98px !important;
  padding: 0 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  align-content: start !important;
  gap: 10px !important;
}

.faceit-card #faceitForm .result:nth-child(n+11) {
  display: none !important;
}

.faceit-card .faceit-stat-grid {
  position: absolute !important;
  left: 20px !important;
  right: 20px !important;
  bottom: 14px !important;
  width: auto !important;
  margin: 0 !important;
  padding-top: 10px !important;
  box-sizing: border-box !important;
  z-index: 8 !important;
}

.faceit-card .faceit-stat-grid > div {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-end !important;
  text-align: center !important;
}

.faceit-card .faceit-stat-grid span,
.faceit-card .faceit-stat-grid strong {
  width: 100% !important;
  text-align: center !important;
}

.faceit-card .faceit-hidden-meta {
  display: none !important;
}

@media (max-width: 760px) {
  .faceit-card .faceit-content {
    position: static !important;
    display: flex !important;
    flex-direction: column !important;
    padding-bottom: 0 !important;
  }

  .faceit-card .faceit-main-nickname,
  .faceit-card .faceit-badge,
  .faceit-card .recent-form-head,
  .faceit-card #faceitForm,
  .faceit-card .faceit-stat-grid {
    position: static !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    bottom: auto !important;
    transform: none !important;
  }

  .faceit-card .faceit-main-nickname {
    margin: 8px 0 !important;
    min-height: 0 !important;
    width: 100% !important;
  }

  .faceit-card .faceit-badge {
    margin: 0 auto 10px !important;
    width: 244px !important;
    min-width: 244px !important;
  }

  .faceit-card .recent-form-head {
    width: 100% !important;
    margin: 0 0 8px !important;
  }

  .faceit-card #faceitForm {
    margin: 0 auto 20px !important;
  }

  .faceit-card .faceit-stat-grid {
    width: 100% !important;
    margin-top: 16px !important;
  }
}


/* v0.3.87 — persistent admin layout editor */
[data-layout-id] {
  translate: var(--layout-x, 0px) var(--layout-y, 0px);
  scale: var(--layout-scale, 1);
  transform-origin: center center;
}

.layout-editing [data-layout-id] {
  position: relative;
  outline: 1px dashed rgba(98, 199, 255, .45);
  outline-offset: 3px;
  cursor: grab !important;
  user-select: none !important;
  touch-action: none !important;
  transition: outline-color .12s ease, box-shadow .12s ease;
}

.layout-editing [data-layout-id]:hover {
  outline-color: rgba(98, 199, 255, .95);
  box-shadow: 0 0 0 4px rgba(98, 199, 255, .06);
}

.layout-editing [data-layout-id].layout-selected {
  outline: 2px solid #7c5cff;
  box-shadow: 0 0 0 5px rgba(124, 92, 255, .10);
}

.layout-editing [data-layout-id].layout-dragging {
  cursor: grabbing !important;
  z-index: 50 !important;
}

.layout-editor-toolbar {
  position: fixed;
  z-index: 9999;
  left: 50%;
  bottom: 18px;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  gap: 14px;
  width: min(960px, calc(100% - 28px));
  padding: 10px 12px;
  border: 1px solid rgba(145,171,213,.28);
  border-radius: 16px;
  color: #f4f7ff;
  background: rgba(5, 12, 24, .94);
  box-shadow: 0 22px 70px rgba(0,0,0,.46);
  backdrop-filter: blur(18px);
}

.layout-editor-title {
  min-width: 190px;
}

.layout-editor-title strong,
.layout-editor-title span {
  display: block;
}

.layout-editor-title strong {
  font-size: 12px;
}

.layout-editor-title span {
  margin-top: 3px;
  color: #8fa5c8;
  font-size: 10px;
}

.layout-editor-values {
  display: flex;
  gap: 8px;
  color: #b9c8df;
  font-size: 10px;
  white-space: nowrap;
}

.layout-editor-values span {
  padding: 6px 8px;
  border: 1px solid rgba(145,171,213,.16);
  border-radius: 8px;
  background: rgba(255,255,255,.025);
}

.layout-editor-controls {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  flex: 1;
}

.layout-editor-controls button,
.layout-editor-controls a {
  min-height: 32px;
  padding: 0 10px;
  border: 1px solid rgba(145,171,213,.2);
  border-radius: 9px;
  color: #dce7fa;
  background: rgba(255,255,255,.035);
  text-decoration: none;
  cursor: pointer;
  font-size: 10px;
  font-weight: 800;
}

.layout-editor-controls button:hover,
.layout-editor-controls a:hover {
  border-color: rgba(124,92,255,.55);
  background: rgba(124,92,255,.10);
}

.layout-editor-controls .save {
  border-color: transparent;
  color: #fff;
  background: linear-gradient(135deg,#168fff,#7c5cff);
}

.layout-editor-controls button:disabled {
  opacity: .55;
  cursor: wait;
}

@media (max-width: 820px) {
  [data-layout-id] {
    translate: 0 0 !important;
    scale: 1 !important;
  }

  .layout-editor-toolbar {
    display: none !important;
  }
}


/* v0.3.88 — universal editor can select every registered visible element */
.layout-editing .site-layout,
.layout-editing .site-layout * {
  -webkit-user-select: none !important;
  user-select: none !important;
}

.layout-editing [data-layout-id] {
  outline-color: rgba(98, 199, 255, .22);
}

.layout-editing [data-layout-id]:hover {
  outline-color: rgba(98, 199, 255, .92);
}

.layout-editing a,
.layout-editing button,
.layout-editing input,
.layout-editing textarea,
.layout-editing select {
  pointer-events: auto;
}

.layout-editor-values #layoutEditorCount {
  color: #62e4c5;
}


/* v0.4.6 — 50/50 Active Duty map ranks + Premier seasons */
.rank-card .rank-board.rank-board-split {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:0;
  align-items:stretch;
}
.rank-half { min-width:0; }
.rank-half-maps { padding-right:20px; }
.rank-half-premier { padding-left:20px; border-left:1px solid var(--border); }
.rank-half-head {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  min-height:42px;
  margin-bottom:12px;
}
.rank-half-head > div { display:grid; gap:4px; min-width:0; }
.rank-half-head strong { color:var(--text); font-size:17px; line-height:1.1; }
.rank-half-head small { color:var(--muted); font-size:10px; font-weight:500; line-height:1.3; }
.rank-half-head > span {
  flex:0 0 auto;
  color:var(--muted-2);
  font-size:9px;
  font-weight:800;
  letter-spacing:.07em;
  text-transform:uppercase;
}
.rank-card .rank-half-maps .competitive-grid {
  grid-template-columns:1fr;
  gap:8px;
}
.rank-card .rank-half-maps .competitive-rank { min-height:66px; }
.rank-card .rank-half-maps .competitive-rank.is-unranked {
  opacity:.72;
  background:linear-gradient(135deg,rgba(23,38,61,.38),rgba(7,15,27,.72));
}
.rank-card .rank-half-maps .competitive-rank.is-unranked .competitive-rank-icon { opacity:.72; filter:none; }
.rank-card .rank-half-premier .profile-premier-history { grid-template-columns:1fr; gap:8px; }
.rank-card .rank-half-premier .profile-premier-chip {
  grid-template-columns:minmax(96px,.72fr) minmax(0,1.28fr);
  min-height:82px;
  padding:10px 11px;
}
.rank-card .rank-half-premier .profile-premier-copy { align-content:center; }
.rank-card .rank-half-premier .profile-premier-copy span { font-size:10px; }
.rank-card .rank-half-premier .profile-premier-copy small { margin-top:2px; }
.rank-card .rank-half-premier .profile-premier-values {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:7px;
  align-items:center;
  justify-items:stretch;
}
.rank-card .rank-half-premier .profile-premier-values > div {
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:6px;
  min-width:0;
}
.rank-card .rank-half-premier .profile-premier-values > div > small {
  margin:0;
  color:#7187a8;
  font-size:8px;
  font-weight:800;
  text-transform:uppercase;
}
.rank-card .rank-half-premier .premier-rating-plate-tiny { width:min(100%,104px); height:auto; }
.rank-card .rank-half-premier .profile-premier-empty { min-height:510px; }
@media (max-width:720px) {
  .rank-card .rank-board.rank-board-split { grid-template-columns:1fr; }
  .rank-half-maps { padding-right:0; }
  .rank-half-premier { margin-top:18px; padding:18px 0 0; border-left:0; border-top:1px solid var(--border); }
  .rank-card .rank-half-premier .profile-premier-history { grid-template-columns:1fr; }
}
@media (max-width:520px) {
  .rank-card .rank-half-maps .competitive-grid,
  .rank-card .rank-half-premier .profile-premier-history { grid-template-columns:1fr; }
  .rank-card .rank-half-premier .profile-premier-chip { grid-template-columns:1fr; }
  .rank-card .rank-half-premier .profile-premier-values { margin-top:5px; }
}


/* v0.4.7 — force true side-by-side Map ranks / Premier seasons layout */
.ranks-skins-grid > .rank-card .rank-board.rank-board-split {
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
  gap:0 !important;
  align-items:start !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  padding-right:7px !important;
}
.ranks-skins-grid > .rank-card .rank-board.rank-board-split > .rank-half-maps {
  min-width:0 !important;
  padding:0 16px 0 0 !important;
}
.ranks-skins-grid > .rank-card .rank-board.rank-board-split > .rank-half-premier {
  min-width:0 !important;
  margin:0 !important;
  padding:0 0 0 16px !important;
  border-top:0 !important;
  border-left:1px solid var(--border) !important;
}
.ranks-skins-grid > .rank-card .rank-half-maps .competitive-grid {
  display:grid !important;
  grid-template-columns:1fr !important;
  grid-auto-rows:62px !important;
  gap:8px !important;
}
.ranks-skins-grid > .rank-card .rank-half-premier .profile-premier-history {
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:8px !important;
}
.ranks-skins-grid > .rank-card .rank-half-premier .profile-premier-chip,
.ranks-skins-grid > .rank-card .rank-half-premier .profile-premier-chip.current {
  display:grid !important;
  grid-template-columns:minmax(88px,.72fr) minmax(0,1.28fr) !important;
  min-height:78px !important;
  padding:10px 11px !important;
  border:1px solid rgba(142,171,211,.14) !important;
  border-left:2px solid var(--premier-tier) !important;
  border-radius:11px !important;
  background:linear-gradient(135deg,rgba(19,35,56,.92),rgba(11,24,41,.88)) !important;
  box-shadow:none !important;
}
.ranks-skins-grid > .rank-card .rank-half-premier .profile-premier-chip.current {
  border-color:rgba(151,111,255,.28) !important;
  border-left-color:var(--premier-tier) !important;
  background:linear-gradient(135deg,rgba(35,39,74,.94),rgba(17,27,50,.94)) !important;
}
.ranks-skins-grid > .rank-card .rank-half-premier .profile-premier-copy span {
  color:#f2f6ff !important;
  font-size:11px !important;
  font-weight:900 !important;
}
.ranks-skins-grid > .rank-card .rank-half-premier .profile-premier-copy small {
  color:#7f93b3 !important;
  font-size:8px !important;
}
.ranks-skins-grid > .rank-card .rank-half-premier .profile-premier-values {
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:8px !important;
  align-items:center !important;
}
.ranks-skins-grid > .rank-card .rank-half-premier .profile-premier-values > div {
  display:grid !important;
  grid-template-columns:1fr !important;
  justify-items:center !important;
  gap:4px !important;
  min-width:0 !important;
}
.ranks-skins-grid > .rank-card .rank-half-premier .profile-premier-values > div > small {
  margin:0 !important;
  color:#7187a8 !important;
  font-size:8px !important;
  font-weight:850 !important;
  text-transform:uppercase !important;
}
.ranks-skins-grid > .rank-card .rank-half-premier svg.premier-season-rating-plate {
  display:block !important;
  width:min(100%,112px) !important;
  height:auto !important;
  overflow:visible !important;
  filter:drop-shadow(0 2px 4px rgba(0,0,0,.42)) !important;
}
.ranks-skins-grid > .rank-card .rank-half-premier svg.premier-season-rating-plate .premier-rating-number {
  font-size:16px !important;
  font-weight:900 !important;
  letter-spacing:-.03em !important;
}
.ranks-skins-grid > .rank-card .rank-half-premier svg.premier-season-rating-plate .premier-season-rating-frame {
  opacity:.95;
}
@media (max-width:1180px) {
  .ranks-skins-grid > .rank-card .rank-board.rank-board-split {
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
  }
  .ranks-skins-grid > .rank-card .rank-half-premier svg.premier-season-rating-plate {
    width:min(100%,104px) !important;
  }
}
@media (max-width:760px) {
  .ranks-skins-grid > .rank-card .rank-board.rank-board-split {
    grid-template-columns:1fr !important;
  }
  .ranks-skins-grid > .rank-card .rank-board.rank-board-split > .rank-half-maps {
    padding-right:0 !important;
  }
  .ranks-skins-grid > .rank-card .rank-board.rank-board-split > .rank-half-premier {
    margin-top:18px !important;
    padding:18px 0 0 !important;
    border-left:0 !important;
    border-top:1px solid var(--border) !important;
  }
}
@media (max-width:520px) {
  .ranks-skins-grid > .rank-card .rank-half-premier .profile-premier-chip,
  .ranks-skins-grid > .rank-card .rank-half-premier .profile-premier-chip.current {
    grid-template-columns:1fr !important;
  }
}


/* v0.4.8 — Premier seasons use the approved Launch Lab custom Premier badges */
.ranks-skins-grid > .rank-card .rank-half-premier .profile-season-premier-badge {
  width:min(100%,132px) !important;
  height:32px !important;
  margin:0 auto !important;
  background-image:var(--custom-premier-bg) !important;
  background-size:100% 100% !important;
  background-position:center !important;
  background-repeat:no-repeat !important;
  filter:drop-shadow(0 2px 4px rgba(0,0,0,.42)) !important;
}
.ranks-skins-grid > .rank-card .rank-half-premier .profile-season-premier-badge strong {
  left:64% !important;
  top:50% !important;
  width:56% !important;
  font-size:13px !important;
  font-style:italic !important;
  font-weight:950 !important;
  letter-spacing:-.035em !important;
}
@media (max-width:1180px) {
  .ranks-skins-grid > .rank-card .rank-half-premier .profile-season-premier-badge {
    width:min(100%,124px) !important;
    height:30px !important;
  }
  .ranks-skins-grid > .rank-card .rank-half-premier .profile-season-premier-badge strong { font-size:12px !important; }
}
@media (max-width:520px) {
  .ranks-skins-grid > .rank-card .rank-half-premier .profile-season-premier-badge {
    width:min(100%,142px) !important;
    height:34px !important;
  }
}


/* launch-lab-check-empty-home */
body:not(.has-player) .tabs,
body:not(.has-player) .view {
  display: none;
}

body.has-player .start-guide {
  display: none;
}

.start-guide {
  min-height: 430px;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 28px;
  margin-top: 18px;
  padding: clamp(32px, 6vw, 72px);
  border: 1px solid rgba(118, 140, 190, .16);
  border-radius: 22px;
  background:
    radial-gradient(circle at 10% 20%, rgba(64, 174, 255, .10), transparent 32%),
    radial-gradient(circle at 85% 80%, rgba(104, 72, 255, .10), transparent 34%),
    linear-gradient(145deg, rgba(12, 30, 49, .94), rgba(7, 19, 33, .97));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.025),
    0 24px 60px rgba(0,0,0,.16);
}

.start-guide-icon {
  width: 68px;
  height: 68px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(102, 190, 255, .28);
  border-radius: 20px;
  color: #a8dcff;
  background: rgba(43, 130, 196, .12);
  font-size: 26px;
  font-weight: 900;
  box-shadow: 0 0 40px rgba(59, 151, 220, .10);
}

.start-guide-copy {
  max-width: 720px;
}

.start-guide-kicker {
  color: #8092ad;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .16em;
}

.start-guide h1 {
  margin: 8px 0 12px;
  color: #f4f7fb;
  font-size: clamp(28px, 4vw, 44px);
  line-height: 1.05;
  letter-spacing: -.035em;
}

.start-guide p {
  max-width: 650px;
  margin: 0;
  color: #8291a8;
  font-size: 14px;
  line-height: 1.65;
}

.start-guide-steps {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 25px;
}

.start-guide-steps span {
  padding: 9px 12px;
  border: 1px solid rgba(117, 139, 185, .14);
  border-radius: 10px;
  color: #8695ac;
  background: rgba(255,255,255,.025);
  font-size: 10px;
  font-weight: 700;
}

.start-guide-steps b {
  margin-right: 6px;
  color: #63bdf7;
  font-size: 9px;
}

@media (max-width: 680px) {
  .start-guide {
    min-height: 360px;
    grid-template-columns: 1fr;
    align-content: center;
    padding: 28px 22px;
  }

  .start-guide-icon {
    width: 54px;
    height: 54px;
    border-radius: 16px;
  }

  .start-guide-steps {
    display: grid;
  }
}

/* TEMP: hide start guide while Layout Editor is active */
body.layout-editing .start-guide {
  display: none !important;
}


/* v0.4.10 — real advertising dimensions from Admin "Розмір" */
.ad-rail {
  width: var(--ad-width, 160px) !important;
  min-height: var(--ad-height, 600px) !important;
}

.ad-card {
  width: var(--ad-width, 160px) !important;
  min-height: var(--ad-height, 600px) !important;
}

.ad-card img {
  width: var(--ad-width, 160px) !important;
  height: var(--ad-height, 600px) !important;
  object-fit: cover;
}

.ad-placeholder {
  width: var(--ad-width, 160px) !important;
  height: var(--ad-height, 600px) !important;
}

@media (min-width: 1180px) {
  .site-layout.has-left-ad.has-right-ad {
    grid-template-columns:
      var(--left-ad-width, 160px)
      minmax(0, var(--page-max))
      var(--right-ad-width, 160px) !important;
  }

  .site-layout.has-left-ad:not(.has-right-ad) {
    grid-template-columns:
      var(--left-ad-width, 160px)
      minmax(0, var(--page-max)) !important;
  }

  .site-layout.has-right-ad:not(.has-left-ad) {
    grid-template-columns:
      minmax(0, var(--page-max))
      var(--right-ad-width, 160px) !important;
  }
}

/* v0.4.10 — ad label position fix */
.ad-card .ad-label {
  top: 12px !important;
  left: 12px !important;
  right: 12px !important;

  width: max-content;
  max-width: calc(100% - 24px);

  margin: 0 auto;
  transform: none !important;

  line-height: 1;
  text-align: center;
}

/* v0.4.10 — ad label header space */
.ad-card {
  position: relative !important;
  box-sizing: border-box !important;
  overflow: hidden !important;

  padding: 38px 12px 12px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.ad-card .ad-label {
  position: absolute !important;
  top: 10px !important;
  left: 12px !important;
  right: 12px !important;

  width: max-content !important;
  max-width: calc(100% - 24px) !important;

  margin: 0 auto !important;
  transform: none !important;
  z-index: 3 !important;
}

.ad-card img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;

  object-fit: contain !important;
  display: block !important;
}

/* v0.4.10 — keep single square ad visible on smaller desktops */
@media (min-width: 900px) and (max-width: 1179px) {
  .site-layout.has-left-ad:not(.has-right-ad) {
    display: grid !important;
    grid-template-columns:
      var(--left-ad-width, 250px)
      minmax(0, 1fr) !important;
    gap: 16px !important;
    width: calc(100% - 24px) !important;
    max-width: none !important;
  }

  .site-layout.has-left-ad:not(.has-right-ad) > .ad-rail-left {
    display: block !important;
    grid-column: 1 !important;
  }

  .site-layout.has-left-ad:not(.has-right-ad) > .shell {
    grid-column: 2 !important;
    min-width: 0 !important;
  }
}


/* v0.4.10 — native Launch Lab project-support widget.
   Deliberately separate from the real advertising rail on the right. */
.project-support-rail {
  position: sticky;
  top: 106px;
  width: var(--support-width, 250px);
  min-height: var(--support-height, 250px);
  margin-top: 112px;
}

.project-support-card {
  position: relative;
  box-sizing: border-box;
  width: var(--support-width, 250px);
  height: var(--support-height, 250px);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  padding: 38px 12px 12px;
  border: 1px solid rgba(142,171,211,.20);
  border-radius: 20px;
  color: inherit;
  background: linear-gradient(180deg,rgba(14,28,48,.98),rgba(7,15,28,.98));
  box-shadow: 0 22px 70px rgba(0,0,0,.34);
  text-decoration: none;
  transition: transform .2s ease,border-color .2s ease;
}

.project-support-card:hover {
  transform: translateY(-2px);
  border-color: rgba(124,92,255,.48);
}

.project-support-label {
  position: absolute;
  z-index: 3;
  top: 10px;
  left: 12px;
  right: 12px;
  width: max-content;
  max-width: calc(100% - 24px);
  margin: 0 auto;
  padding: 5px 8px;
  color: rgba(230,237,255,.72);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 999px;
  background: rgba(3,9,18,.72);
  font-size: 8px;
  line-height: 1;
  letter-spacing: .12em;
  text-align: center;
  text-transform: uppercase;
  white-space: nowrap;
  backdrop-filter: blur(8px);
}

.project-support-media {
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: calc(var(--support-height, 250px) - 50px);
  object-fit: contain;
}

.project-support-placeholder {
  width: 100%;
  height: 100%;
  display: grid;
  place-content: center;
  gap: 8px;
  padding: 12px;
  color: #91a4c5;
  text-align: center;
  background:
    radial-gradient(circle at 30% 18%,rgba(35,201,255,.18),transparent 34%),
    radial-gradient(circle at 78% 72%,rgba(124,92,255,.22),transparent 36%),
    linear-gradient(160deg,#0c1b30,#080f1c);
}

@media (min-width: 1180px) {
  .site-layout.has-support.has-right-ad {
    width: calc(100% - 24px) !important;
    max-width: 1900px !important;
    grid-template-columns:
      var(--support-width, 250px)
      minmax(0, var(--page-max))
      var(--right-ad-width, 160px) !important;
    gap: 16px !important;
  }

  .site-layout.has-support:not(.has-right-ad) {
    width: calc(100% - 24px) !important;
    max-width: 1700px !important;
    grid-template-columns:
      var(--support-width, 250px)
      minmax(0, var(--page-max)) !important;
    gap: 16px !important;
  }

  .site-layout.has-support > .project-support-rail {
    display: block !important;
    grid-column: 1 !important;
  }

  .site-layout.has-support > .shell {
    grid-column: 2 !important;
    min-width: 0 !important;
  }

  .site-layout.has-support.has-right-ad > .ad-rail-right {
    grid-column: 3 !important;
  }
}

/* A single compact support card remains useful on ordinary desktop widths. */
@media (min-width: 900px) and (max-width: 1179px) {
  .site-layout.has-support {
    display: grid !important;
    width: calc(100% - 24px) !important;
    max-width: none !important;
    grid-template-columns:
      var(--support-width, 250px)
      minmax(0, 1fr) !important;
    gap: 16px !important;
  }

  .site-layout.has-support > .project-support-rail {
    display: block !important;
    grid-column: 1 !important;
  }

  .site-layout.has-support > .shell {
    grid-column: 2 !important;
    min-width: 0 !important;
  }
}

@media (max-width: 899px) {
  .project-support-rail {
    display: none !important;
  }
}


/* v0.4.12 — header language switcher */
.language-switcher {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 3px;
  border: 1px solid rgba(123, 151, 205, .18);
  border-radius: 12px;
  background: rgba(7, 17, 31, .72);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025);
  flex: 0 0 auto;
}

.language-switcher-icon {
  width: 26px;
  height: 30px;
  display: grid;
  place-items: center;
  font-size: 13px;
  opacity: .68;
  filter: saturate(.75);
}

.language-switcher-btn {
  min-width: 38px;
  min-height: 30px;
  padding: 0 9px;
  border: 1px solid transparent;
  border-radius: 8px;
  color: #7384a4;
  background: transparent;
  box-shadow: none;
  font: inherit;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .08em;
  cursor: pointer;
  transition: color .16s ease, border-color .16s ease, background .16s ease, box-shadow .16s ease, transform .16s ease;
}

.language-switcher-btn:hover {
  color: #dce9ff;
  background: rgba(91, 132, 207, .10);
}

.language-switcher-btn.active {
  border-color: rgba(75, 211, 255, .27);
  color: #baf2ff;
  background: linear-gradient(135deg, rgba(42, 190, 236, .16), rgba(113, 94, 255, .14));
  box-shadow: 0 0 18px rgba(54, 184, 255, .08), inset 0 1px 0 rgba(255,255,255,.04);
}

.language-switcher-btn:focus-visible {
  outline: 2px solid rgba(93, 215, 255, .64);
  outline-offset: 2px;
}

@media (max-width: 920px) {
  .topbar .language-switcher {
    order: 4;
    margin-left: auto;
  }
}

@media (max-width: 620px) {
  .language-switcher {
    min-height: 34px;
    border-radius: 10px;
  }

  .language-switcher-icon {
    display: none;
  }

  .language-switcher-btn {
    min-width: 35px;
    min-height: 28px;
    padding: 0 7px;
  }
}


/* v0.4.13 — language dropdown to the left of search */

.topbar {
  grid-template-columns:
    auto
    auto
    minmax(0, 1fr) !important;
  gap: 12px !important;
}

.topbar .language-switcher {
  grid-column: 2 !important;
  grid-row: 1 !important;
}

.topbar .search {
  grid-column: 3 !important;
  grid-row: 1 !important;
}

.language-switcher.language-dropdown {
  position: relative;
  z-index: 80;
  min-height: 48px;
  display: block;
  padding: 0;
  border: 0;
  border-radius: 14px;
  background: transparent;
  box-shadow: none;
  flex: 0 0 auto;
}

.language-switcher-trigger {
  height: 48px;
  min-width: 82px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 12px;
  border: 1px solid rgba(123, 151, 205, .20);
  border-radius: 14px;
  color: #b7c8e3;
  background: #081422;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.025);
  font: inherit;
  cursor: pointer;
  transition:
    border-color .16s ease,
    color .16s ease,
    background .16s ease,
    box-shadow .16s ease;
}

.language-switcher-trigger:hover,
.language-switcher.open .language-switcher-trigger {
  color: #eaf6ff;
  border-color: rgba(83, 203, 255, .36);
  background: #0a192a;
  box-shadow:
    0 0 0 3px rgba(55, 180, 255, .055),
    inset 0 1px 0 rgba(255,255,255,.035);
}

.language-switcher-trigger:focus-visible {
  outline: 2px solid rgba(93, 215, 255, .64);
  outline-offset: 2px;
}

.language-switcher-globe {
  display: inline-grid;
  place-items: center;
  width: 18px;
  height: 18px;
  font-size: 13px;
  line-height: 1;
  opacity: .82;
}

.language-switcher-current {
  min-width: 20px;
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .08em;
  text-align: center;
}

.language-switcher-chevron {
  position: relative;
  top: -1px;
  color: #7085a5;
  font-size: 14px;
  line-height: 1;
  transition: transform .16s ease;
}

.language-switcher.open .language-switcher-chevron {
  transform: rotate(180deg);
}

.language-switcher-menu {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  z-index: 1000;
  width: 190px;
  padding: 6px;
  border: 1px solid rgba(123, 151, 205, .22);
  border-radius: 14px;
  background:
    linear-gradient(
      180deg,
      rgba(11, 27, 45, .985),
      rgba(7, 18, 32, .99)
    );
  box-shadow:
    0 18px 44px rgba(0,0,0,.45),
    inset 0 1px 0 rgba(255,255,255,.035);
  backdrop-filter: blur(18px);
}

.language-switcher-menu[hidden] {
  display: none !important;
}

.language-switcher-option {
  width: 100%;
  min-height: 42px;
  display: grid;
  grid-template-columns: 32px minmax(0,1fr) 18px;
  align-items: center;
  gap: 8px;
  padding: 0 10px;
  border: 0;
  border-radius: 10px;
  color: #8ea0bd;
  background: transparent;
  box-shadow: none;
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition:
    color .15s ease,
    background .15s ease;
}

.language-switcher-option:hover,
.language-switcher-option:focus-visible {
  outline: none;
  color: #e9f5ff;
  background: rgba(96, 146, 220, .10);
}

.language-switcher-option.active {
  color: #c7f4ff;
  background:
    linear-gradient(
      135deg,
      rgba(42, 190, 236, .13),
      rgba(113, 94, 255, .10)
    );
}

.language-option-code {
  font-size: 9px;
  font-weight: 950;
  letter-spacing: .08em;
  color: #78dfff;
}

.language-option-label {
  overflow: hidden;
  font-size: 11px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.language-option-check {
  color: #59e0c2;
  font-size: 12px;
  font-weight: 950;
  text-align: right;
}

/* Old v0.4.12 segmented-button children are no longer used. */
.language-switcher-btn,
.language-switcher-icon {
  display: none !important;
}

/* Tablet/mobile: brand + language on first row, search below. */
@media (max-width: 760px) {
  .topbar {
    grid-template-columns:
      minmax(0,1fr)
      auto !important;
    gap: 10px !important;
  }

  .topbar .brand {
    grid-column: 1 !important;
    grid-row: 1 !important;
  }

  .topbar .language-switcher {
    grid-column: 2 !important;
    grid-row: 1 !important;
    margin-left: 0 !important;
    order: initial !important;
  }

  .topbar .search {
    grid-column: 1 / 3 !important;
    grid-row: 2 !important;
    width: 100% !important;
  }

  .language-switcher.language-dropdown {
    min-height: 40px;
  }

  .language-switcher-trigger {
    height: 40px;
    min-width: 74px;
    padding: 0 10px;
    border-radius: 12px;
  }

  .language-switcher-menu {
    left: auto;
    right: 0;
  }
}

@media (max-width: 420px) {
  .language-switcher-trigger {
    min-width: 68px;
    gap: 6px;
    padding: 0 9px;
  }

  .language-switcher-globe {
    font-size: 12px;
  }

  .language-switcher-menu {
    width: 176px;
  }
}


/* ============================================================
   launchlab-responsive-system-v1
   Final public responsive normalization layer.
   ============================================================ */

html {
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
}

body {
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
}

img,
svg,
canvas,
video {
  max-width: 100%;
}

.site-layout,
.shell,
.view,
.dashboard,
.performance,
.leetify-grid,
.secondary-grid,
.ranks-skins-grid,
.bottom-grid,
.card,
.rank-board,
.rank-half,
.profile-main,
.profile-copy,
.leetify-head,
.section-head,
.chart-toolbar,
.matches,
.match-card {
  min-width: 0 !important;
}

.site-layout {
  width: min(calc(100% - 24px), var(--page-max)) !important;
  max-width: none !important;
  margin-inline: auto !important;
}

.shell {
  width: 100% !important;
  max-width: var(--page-max) !important;
  min-width: 0 !important;
  margin-inline: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* deterministic header */
.topbar {
  display: grid !important;
  grid-template-columns:
    auto
    auto
    minmax(260px, 1fr)
    auto !important;
  grid-template-areas: "brand language search mode";
  align-items: center !important;
  gap: 12px !important;
  min-width: 0 !important;
}

.topbar .brand {
  grid-area: brand !important;
  min-width: 0 !important;
}

.topbar .language-switcher {
  grid-area: language !important;
  min-width: 0 !important;
  margin: 0 !important;
  order: initial !important;
}

.topbar .search {
  grid-area: search !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 10px !important;
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  order: initial !important;
}

.topbar .search-field {
  width: 100% !important;
  min-width: 0 !important;
}

.topbar .search input {
  min-width: 0 !important;
  text-overflow: ellipsis;
}

.topbar .search button {
  width: auto !important;
  max-width: 260px;
  white-space: nowrap !important;
}

.topbar .integration-pill {
  grid-area: mode !important;
  justify-self: end !important;
  max-width: 190px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* top dashboard */
.dashboard {
  display: grid !important;
  grid-template-columns:
    minmax(360px, 1.22fr)
    repeat(3, minmax(215px, .82fr)) !important;
  gap: 12px !important;
  align-items: stretch !important;
}

.dashboard > .profile-card,
.dashboard > .metric-card {
  min-width: 0 !important;
  height: 100% !important;
}

/* Leetify */
.leetify-grid {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

.leetify-head,
.leetify-title-wrap,
.leetify-title-wrap > div {
  min-width: 0 !important;
}

/* Premier / FACEIT / AI */
.secondary-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 12px !important;
  align-items: stretch !important;
}

.secondary-grid > * {
  min-width: 0 !important;
}

/* ranks / inventory */
.ranks-skins-grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(360px, .82fr) !important;
  gap: 12px !important;
  width: 100% !important;
}

.ranks-skins-grid > * {
  min-width: 0 !important;
}

.chart-toolbar {
  min-width: 0 !important;
}

.periods {
  max-width: 100%;
}

/* wrapping safety */
.profile-copy h1,
.provider-player-name,
.steam-id,
.metric-note,
.disclaimer,
.rank-half-head,
.section-head {
  overflow-wrap: anywhere;
}

/* modals */
.modal {
  padding:
    max(16px, env(safe-area-inset-top))
    max(16px, env(safe-area-inset-right))
    max(16px, env(safe-area-inset-bottom))
    max(16px, env(safe-area-inset-left)) !important;
}

.modal-panel,
.modal-panel.large {
  width: min(980px, 100%) !important;
  max-width: 100% !important;
  max-height: calc(100dvh - 32px) !important;
}

.site-footer {
  width: min(var(--page-max), calc(100% - 28px)) !important;
  min-width: 0 !important;
}

/* ULTRA WIDE */
@media (min-width: 1760px) {
  .site-layout.has-support.has-right-ad {
    width: min(calc(100% - 24px), 1900px) !important;
    grid-template-columns:
      var(--support-width, 250px)
      minmax(0, var(--page-max))
      var(--right-ad-width, 160px) !important;
    gap: 16px !important;
  }

  .site-layout.has-support:not(.has-right-ad) {
    width: min(calc(100% - 24px), 1760px) !important;
    grid-template-columns:
      var(--support-width, 250px)
      minmax(0, var(--page-max)) !important;
    gap: 16px !important;
  }

  .site-layout.has-support > .project-support-rail {
    display: block !important;
    grid-column: 1 !important;
  }

  .site-layout.has-support > .shell {
    grid-column: 2 !important;
  }

  .site-layout.has-support.has-right-ad > .ad-rail-right {
    display: block !important;
    grid-column: 3 !important;
  }
}

/* NORMAL DESKTOP */
@media (min-width: 1400px) and (max-width: 1759px) {
  .site-layout.has-support {
    width: calc(100% - 24px) !important;
    grid-template-columns:
      minmax(210px, var(--support-width, 250px))
      minmax(0, 1fr) !important;
    gap: 14px !important;
  }

  .site-layout.has-support > .project-support-rail {
    display: block !important;
    grid-column: 1 !important;
  }

  .site-layout.has-support > .shell {
    grid-column: 2 !important;
    max-width: none !important;
  }

  .site-layout > .ad-rail-right {
    display: none !important;
  }

  .site-layout.has-support .dashboard {
    grid-template-columns:
      minmax(320px, 1.15fr)
      repeat(3, minmax(190px, .82fr)) !important;
  }
}

/* LAPTOP / 1366 CLASS */
@media (min-width: 1100px) and (max-width: 1399px) {
  .site-layout {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: min(calc(100% - 24px), 1280px) !important;
  }

  .site-layout > .shell {
    grid-column: 1 !important;
    max-width: none !important;
  }

  .project-support-rail,
  .ad-rail {
    display: none !important;
  }

  .dashboard {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  .dashboard > .profile-card {
    grid-column: 1 / -1 !important;
  }

  .secondary-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  .ranks-skins-grid {
    grid-template-columns: minmax(0, 1fr) minmax(330px, .75fr) !important;
  }
}

/* TABLET / SMALL LAPTOP */
@media (min-width: 760px) and (max-width: 1099px) {
  .site-layout {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: calc(100% - 24px) !important;
  }

  .project-support-rail,
  .ad-rail {
    display: none !important;
  }

  .site-layout > .shell {
    grid-column: 1 !important;
  }

  .topbar {
    grid-template-columns:
      auto
      auto
      minmax(0, 1fr) !important;
    grid-template-areas:
      "brand language mode"
      "search search search" !important;
  }

  .topbar .integration-pill {
    display: block !important;
    justify-self: end !important;
  }

  .dashboard {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .dashboard > .profile-card {
    grid-column: 1 / -1 !important;
  }

  .dashboard > .metric-card:last-child {
    grid-column: 1 / -1 !important;
  }

  .leetify-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  .secondary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .secondary-grid > .ai-card {
    grid-column: 1 / -1 !important;
  }

  .ranks-skins-grid {
    grid-template-columns: 1fr !important;
    height: auto !important;
    min-height: 0 !important;
  }

  .ranks-skins-grid > .rank-card,
  .ranks-skins-grid > .bottom-grid,
  .ranks-skins-grid > .rank-card .competitive-panel,
  .ranks-skins-grid > .rank-card .rank-board {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  .start-guide {
    min-height: 360px !important;
    padding: 36px !important;
  }
}

/* MOBILE */
@media (max-width: 759px) {
  :root {
    --radius: 18px;
    --radius-sm: 12px;
  }

  .announcement-bar {
    padding-left: max(12px, env(safe-area-inset-left)) !important;
    padding-right: max(12px, env(safe-area-inset-right)) !important;
    font-size: 10px !important;
    line-height: 1.45;
  }

  .site-layout {
    display: block !important;
    width: calc(100% - 16px) !important;
  }

  .project-support-rail,
  .ad-rail {
    display: none !important;
  }

  .shell {
    width: 100% !important;
    padding-top: 8px !important;
    padding-bottom: 32px !important;
  }

  .topbar {
    position: sticky !important;
    top: max(6px, env(safe-area-inset-top)) !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "brand language"
      "search search" !important;
    gap: 9px !important;
    min-height: 0 !important;
    margin-bottom: 14px !important;
    padding: 9px !important;
    border-radius: 16px !important;
  }

  .topbar .brand-copy {
    display: block !important;
    min-width: 0 !important;
  }

  .topbar .brand-copy strong,
  .topbar .brand-copy span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .topbar .brand-copy strong {
    font-size: 12px !important;
  }

  .topbar .brand-copy span {
    font-size: 8px !important;
  }

  .brand-mark {
    width: 40px !important;
    height: 40px !important;
    flex-basis: 40px !important;
  }

  .brand-mark img {
    width: 36px !important;
    height: 36px !important;
    max-width: 36px !important;
    max-height: 36px !important;
  }

  .topbar .integration-pill {
    display: none !important;
  }

  .topbar .search {
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 8px !important;
  }

  .topbar .search input {
    height: 44px !important;
    padding-left: 42px !important;
    font-size: 13px !important;
  }

  .topbar .search-field svg {
    left: 14px !important;
    width: 17px !important;
    height: 17px !important;
  }

  .topbar .search button {
    min-height: 44px !important;
    padding-inline: 14px !important;
    border-radius: 12px !important;
    font-size: 11px !important;
  }

  .language-switcher.language-dropdown {
    min-height: 40px !important;
  }

  .language-switcher-trigger {
    height: 40px !important;
    min-width: 68px !important;
    padding-inline: 9px !important;
  }

  .language-switcher-menu {
    left: auto !important;
    right: 0 !important;
    max-width: calc(100vw - 24px);
  }

  .tabs {
    width: 100%;
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  .tabs::-webkit-scrollbar {
    display: none;
  }

  .tab-btn {
    flex: 0 0 auto;
    white-space: nowrap;
  }

  .dashboard {
    grid-template-columns: 1fr !important;
  }

  .dashboard > .profile-card,
  .dashboard > .metric-card {
    grid-column: auto !important;
    min-height: 0 !important;
    height: auto !important;
  }

  .profile-card,
  .metric-card,
  .performance,
  .section-card,
  .rank-card,
  .inventory-card,
  .chart-card {
    border-radius: 18px !important;
  }

  .profile-card,
  .metric-card,
  .performance,
  .section-card,
  .inventory-card,
  .chart-card {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  .avatar {
    width: 82px !important;
    height: 82px !important;
  }

  .profile-copy h1 {
    font-size: 21px !important;
    line-height: 1.08 !important;
  }

  .mini-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .leetify-head {
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 10px !important;
  }

  .leetify-sample {
    grid-column: 1 / -1;
    justify-self: start !important;
    white-space: normal !important;
  }

  .leetify-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .secondary-grid {
    grid-template-columns: 1fr !important;
  }

  .secondary-grid > .ai-card {
    grid-column: auto !important;
  }

  .secondary-grid > .section-card,
  .secondary-grid > .faceit-card,
  .secondary-grid > .ai-card {
    min-height: 0 !important;
    height: auto !important;
    overflow: visible !important;
  }

  .ranks-skins-grid {
    grid-template-columns: 1fr !important;
    height: auto !important;
    min-height: 0 !important;
  }

  .ranks-skins-grid > .rank-card,
  .ranks-skins-grid > .bottom-grid,
  .ranks-skins-grid > .rank-card .competitive-panel,
  .ranks-skins-grid > .rank-card .rank-board {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
  }

  .ranks-skins-grid > .rank-card .rank-board.rank-board-split {
    grid-template-columns: 1fr !important;
    overflow: visible !important;
    padding-right: 0 !important;
  }

  .ranks-skins-grid > .rank-card .rank-board.rank-board-split > .rank-half-maps {
    padding-right: 0 !important;
  }

  .ranks-skins-grid > .rank-card .rank-board.rank-board-split > .rank-half-premier {
    margin-top: 18px !important;
    padding: 18px 0 0 !important;
    border-left: 0 !important;
    border-top: 1px solid var(--border) !important;
  }

  .ranks-skins-grid .rank-card .competitive-grid {
    grid-template-columns: 1fr !important;
  }

  .rank-card .rank-half-premier .profile-premier-history {
    grid-template-columns: 1fr !important;
  }

  .rank-card .rank-half-premier .profile-premier-chip,
  .rank-card .rank-half-premier .profile-premier-chip.current {
    grid-template-columns: minmax(80px, .72fr) minmax(0, 1.28fr) !important;
  }

  .ranks-skins-grid > .bottom-grid {
    display: grid !important;
    grid-template-rows: auto auto !important;
    gap: 12px !important;
  }

  .ranks-skins-grid > .bottom-grid > .chart-card {
    min-height: 310px !important;
  }

  .chart-toolbar,
  .section-head {
    flex-wrap: wrap !important;
    gap: 10px !important;
  }

  .periods {
    width: 100%;
    display: flex;
    overflow-x: auto;
    padding-bottom: 2px;
    scrollbar-width: none;
  }

  .periods::-webkit-scrollbar {
    display: none;
  }

  .period-btn {
    flex: 0 0 auto;
  }

  .filter-row {
    width: 100%;
    overflow-x: auto;
    flex-wrap: nowrap !important;
    padding-bottom: 4px;
    scrollbar-width: none;
  }

  .filter-row::-webkit-scrollbar {
    display: none;
  }

  .filter-btn {
    flex: 0 0 auto;
    white-space: nowrap;
  }

  .start-guide {
    min-height: 0 !important;
    grid-template-columns: 1fr !important;
    gap: 18px !important;
    margin-top: 10px !important;
    padding: 28px 20px !important;
    border-radius: 18px !important;
  }

  .start-guide h1 {
    font-size: clamp(27px, 8vw, 38px) !important;
  }

  .start-guide p {
    font-size: 13px !important;
  }

  .start-guide-steps {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 7px !important;
  }

  .site-footer {
    width: calc(100% - 20px) !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 12px !important;
    padding-bottom: max(24px, env(safe-area-inset-bottom)) !important;
  }

  .modal {
    align-items: end !important;
    padding: 8px !important;
  }

  .modal-panel,
  .modal-panel.large {
    width: 100% !important;
    max-height: calc(100dvh - 16px) !important;
    border-radius: 20px 20px 14px 14px !important;
  }
}

/* COMPACT MOBILE */
@media (max-width: 519px) {
  .site-layout {
    width: calc(100% - 12px) !important;
  }

  .topbar {
    padding: 8px !important;
    border-radius: 14px !important;
  }

  .topbar .brand-copy {
    display: none !important;
  }

  .topbar .search {
    grid-template-columns: 1fr !important;
  }

  .topbar .search button {
    width: 100% !important;
    max-width: none !important;
  }

  .language-switcher-trigger {
    min-width: 64px !important;
  }

  .profile-main {
    display: grid !important;
    grid-template-columns: 72px minmax(0, 1fr) !important;
    gap: 12px !important;
  }

  .avatar-wrap {
    width: 72px !important;
  }

  .avatar {
    width: 72px !important;
    height: 72px !important;
  }

  .profile-links {
    flex-wrap: wrap !important;
  }

  .mini-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 7px !important;
  }

  .leetify-grid {
    grid-template-columns: 1fr !important;
  }

  .leetify-head {
    grid-template-columns: 1fr !important;
  }

  .leetify-view {
    justify-self: start !important;
  }

  .rank-card .rank-half-premier .profile-premier-chip,
  .rank-card .rank-half-premier .profile-premier-chip.current {
    grid-template-columns: 1fr !important;
  }

  .rank-card .rank-half-premier .profile-premier-values {
    margin-top: 6px !important;
  }

  .competitive-rank {
    grid-template-columns: 42px minmax(0, 1fr) 48px !important;
  }

  .map-visual {
    width: 40px !important;
    height: 40px !important;
  }

  .map-visual img {
    width: 38px !important;
    height: 38px !important;
  }

  .competitive-rank-icon {
    width: 46px !important;
  }
}

/* VERY SMALL MOBILE */
@media (max-width: 360px) {
  .site-layout {
    width: calc(100% - 8px) !important;
  }

  .topbar {
    gap: 7px !important;
    padding: 7px !important;
  }

  .brand-mark {
    width: 36px !important;
    height: 36px !important;
    flex-basis: 36px !important;
  }

  .brand-mark img {
    width: 32px !important;
    height: 32px !important;
  }

  .language-switcher-trigger {
    min-width: 60px !important;
    height: 36px !important;
    padding-inline: 7px !important;
  }

  .language-switcher-globe {
    display: none !important;
  }

  .topbar .search input {
    font-size: 12px !important;
  }

  .start-guide {
    padding: 22px 16px !important;
  }
}

/* short landscape */
@media (max-height: 700px) and (min-width: 700px) {
  .topbar {
    position: relative !important;
    top: 0 !important;
  }

  .project-support-rail,
  .ad-rail {
    top: 16px !important;
    margin-top: 16px !important;
  }

  .modal-panel,
  .modal-panel.large {
    max-height: calc(100dvh - 20px) !important;
  }
}

body.layout-editing {
  overflow-x: clip !important;
}

body.layout-editing .site-layout,
body.layout-editing .shell {
  max-width: 100% !important;
}



/* ============================================================
   launchlab-fluid-proportional-desktop-v2

   Desktop / laptop keeps ONE design composition and scales it
   proportionally. Mobile below 900px continues to use the
   dedicated responsive/reflow layout.
   ============================================================ */

@media (min-width: 900px) {
  html.ll-fluid-desktop body {
    overflow-x: clip !important;
  }

  html.ll-fluid-desktop .site-layout {
    width: var(--ll-layout-width, 1500px) !important;
    max-width: none !important;
    margin-left: auto !important;
    margin-right: auto !important;

    /*
      CSS zoom participates in layout, unlike transform:scale().
      This means the element's actual occupied space shrinks too,
      so there is no giant phantom width/height after scaling.
    */
    zoom: var(--ll-ui-scale, 1);
  }

  /* Keep the original desktop composition instead of reflowing
     to "laptop cards". Everything is scaled together instead. */

  html.ll-fluid-desktop .dashboard {
    display: grid !important;
    grid-template-columns:
      minmax(360px, 1.22fr)
      repeat(3, minmax(215px, .82fr)) !important;
    gap: 12px !important;
  }

  html.ll-fluid-desktop .dashboard > .profile-card,
  html.ll-fluid-desktop .dashboard > .metric-card {
    grid-column: auto !important;
    min-width: 0 !important;
    height: 100% !important;
  }

  html.ll-fluid-desktop .leetify-grid {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  html.ll-fluid-desktop .secondary-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }

  html.ll-fluid-desktop .secondary-grid > .ai-card {
    grid-column: auto !important;
  }

  html.ll-fluid-desktop .ranks-skins-grid {
    display: grid !important;
    grid-template-columns:
      minmax(0, 1fr)
      minmax(360px, .82fr) !important;
    gap: 12px !important;
    height: auto !important;
  }

  html.ll-fluid-desktop .ranks-skins-grid > .rank-card,
  html.ll-fluid-desktop .ranks-skins-grid > .bottom-grid {
    max-height: none !important;
  }

  /* Header stays one proportional desktop row. */
  html.ll-fluid-desktop .topbar {
    display: grid !important;
    grid-template-columns:
      auto
      auto
      minmax(320px, 1fr)
      auto !important;
    grid-template-areas:
      "brand language search mode" !important;
    gap: 12px !important;
  }

  html.ll-fluid-desktop .topbar .brand {
    grid-area: brand !important;
  }

  html.ll-fluid-desktop .topbar .language-switcher {
    grid-area: language !important;
  }

  html.ll-fluid-desktop .topbar .search {
    grid-area: search !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
  }

  html.ll-fluid-desktop .topbar .integration-pill {
    grid-area: mode !important;
    display: block !important;
  }

  /* Side rails now scale with the page instead of being hidden
     just because the physical viewport is narrower. */
  html.ll-fluid-desktop .site-layout.has-support {
    display: grid !important;
  }

  html.ll-fluid-desktop .site-layout.has-support.has-right-ad {
    grid-template-columns:
      var(--support-width, 250px)
      minmax(0, 1fr)
      var(--right-ad-width, 160px) !important;
    gap: 16px !important;
  }

  html.ll-fluid-desktop .site-layout.has-support:not(.has-right-ad) {
    grid-template-columns:
      var(--support-width, 250px)
      minmax(0, 1fr) !important;
    gap: 16px !important;
  }

  html.ll-fluid-desktop .site-layout:not(.has-support).has-right-ad {
    display: grid !important;
    grid-template-columns:
      minmax(0, 1fr)
      var(--right-ad-width, 160px) !important;
    gap: 16px !important;
  }

  html.ll-fluid-desktop .site-layout.has-support > .project-support-rail {
    display: block !important;
    grid-column: 1 !important;
  }

  html.ll-fluid-desktop .site-layout.has-support > .shell {
    grid-column: 2 !important;
    max-width: none !important;
    min-width: 0 !important;
  }

  html.ll-fluid-desktop
  .site-layout.has-support.has-right-ad > .ad-rail-right {
    display: block !important;
    grid-column: 3 !important;
  }

  html.ll-fluid-desktop
  .site-layout:not(.has-support).has-right-ad > .shell {
    grid-column: 1 !important;
    max-width: none !important;
  }

  html.ll-fluid-desktop
  .site-layout:not(.has-support).has-right-ad > .ad-rail-right {
    display: block !important;
    grid-column: 2 !important;
  }

  html.ll-fluid-desktop .project-support-rail,
  html.ll-fluid-desktop .ad-rail {
    /*
      Their own px sizes remain unchanged in design-space and are
      therefore automatically reduced by the same page zoom.
    */
    transform: none !important;
  }

  /* Keep the editor usable while preserving the same scale. */
  html.ll-fluid-desktop body.layout-editing .site-layout {
    max-width: none !important;
  }
}

/* Phone/tablet: do NOT shrink the desktop site to unreadable size. */
@media (max-width: 899px) {
  html {
    --ll-ui-scale: 1;
  }

  .site-layout {
    zoom: 1 !important;
  }
}



/* ============================================================
   launchlab-profile-scan-loader-v1
   Animated profile scan shown while /api/player is loading.
   ============================================================ */

.profile-scan-loader[hidden] {
  display: none !important;
}

.profile-scan-loader {
  position: relative;
  min-height: 430px;
  display: grid;
  grid-template-columns: minmax(250px, .72fr) minmax(0, 1.28fr);
  align-items: center;
  gap: clamp(28px, 5vw, 72px);
  overflow: hidden;
  margin-top: 18px;
  padding: clamp(34px, 5vw, 68px);
  border: 1px solid rgba(92, 170, 232, .19);
  border-radius: 22px;
  background:
    radial-gradient(circle at 18% 50%, rgba(35, 183, 255, .13), transparent 32%),
    radial-gradient(circle at 80% 78%, rgba(117, 76, 255, .12), transparent 36%),
    linear-gradient(145deg, rgba(9, 28, 47, .97), rgba(5, 16, 29, .985));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.03),
    0 26px 70px rgba(0,0,0,.19);
}

.profile-scan-loader::before {
  position: absolute;
  inset: 0;
  content: "";
  pointer-events: none;
  opacity: .32;
  background-image:
    linear-gradient(rgba(83, 180, 240, .045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(83, 180, 240, .045) 1px, transparent 1px);
  background-size: 34px 34px;
  mask-image: linear-gradient(to right, #000, transparent 75%);
}

.profile-scan-visual {
  position: relative;
  width: min(260px, 100%);
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  justify-self: center;
}

.profile-scan-core {
  position: relative;
  z-index: 5;
  width: 106px;
  height: 106px;
  overflow: hidden;
  display: grid;
  place-items: center;
  border: 1px solid rgba(94, 208, 255, .36);
  border-radius: 30px;
  background:
    radial-gradient(circle at 50% 35%, rgba(62, 193, 255, .19), transparent 60%),
    rgba(7, 24, 40, .94);
  box-shadow:
    0 0 0 12px rgba(44, 153, 222, .035),
    0 0 54px rgba(44, 183, 255, .16),
    inset 0 1px 0 rgba(255,255,255,.045);
}

.profile-scan-core img {
  grid-area: 1 / 1;
  width: 72px;
  height: 72px;
  object-fit: contain;
  transition: opacity .28s ease, transform .32s cubic-bezier(.2,.75,.25,1);
  filter:
    drop-shadow(0 0 12px rgba(68, 203, 255, .26))
    saturate(1.08);
}

.profile-scan-core .profile-scan-brand {
  opacity: 1;
  transform: scale(1);
}

.profile-scan-core .profile-scan-avatar {
  width: 100%;
  height: 100%;
  opacity: 0;
  transform: scale(1.08);
  object-fit: cover;
  filter: saturate(.92) contrast(1.04);
}

.profile-scan-loader.has-player-avatar .profile-scan-brand {
  opacity: 0;
  transform: scale(.84);
}

.profile-scan-loader.has-player-avatar .profile-scan-avatar {
  opacity: 1;
  transform: scale(1);
}

@media (prefers-reduced-motion: reduce) {
  .profile-scan-core img {
    transition: none;
  }
}

.profile-scan-beam {
  position: absolute;
  z-index: 6;
  left: 7px;
  right: 7px;
  height: 2px;
  top: 10px;
  border-radius: 999px;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(92, 229, 255, .95),
    transparent
  );
  box-shadow:
    0 0 13px rgba(92, 229, 255, .85),
    0 7px 28px rgba(92, 229, 255, .28);
  animation: ll-scan-beam 1.55s cubic-bezier(.45,0,.55,1) infinite alternate;
}

.profile-scan-orbit {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
}

.profile-scan-orbit::before,
.profile-scan-orbit::after {
  position: absolute;
  content: "";
  border-radius: 50%;
}

.profile-scan-orbit-a {
  inset: 18px;
  border: 1px solid rgba(65, 205, 255, .18);
  border-top-color: rgba(70, 218, 255, .95);
  border-right-color: rgba(70, 218, 255, .48);
  animation: ll-orbit-cw 2.5s linear infinite;
}

.profile-scan-orbit-b {
  inset: 2px;
  border: 1px dashed rgba(123, 98, 255, .27);
  border-left-color: rgba(140, 105, 255, .95);
  animation: ll-orbit-ccw 4.2s linear infinite;
}

.profile-scan-orbit-c {
  inset: 42px;
  border: 1px solid rgba(64, 230, 189, .17);
  border-bottom-color: rgba(64, 230, 189, .72);
  animation: ll-orbit-cw 3.4s linear infinite;
}

.profile-scan-ping {
  position: absolute;
  z-index: 7;
  width: 8px;
  height: 8px;
  border: 2px solid rgba(113, 226, 255, .85);
  border-radius: 50%;
  background: #0a2034;
  box-shadow: 0 0 12px rgba(83, 218, 255, .72);
  animation: ll-ping 1.8s ease-in-out infinite;
}

.profile-scan-ping.ping-a {
  top: 20%;
  right: 11%;
}

.profile-scan-ping.ping-b {
  bottom: 13%;
  left: 20%;
  animation-delay: .55s;
  border-color: rgba(139, 111, 255, .85);
  box-shadow: 0 0 12px rgba(139, 111, 255, .65);
}

.profile-scan-ping.ping-c {
  bottom: 29%;
  right: 5%;
  animation-delay: 1.05s;
  border-color: rgba(68, 228, 186, .86);
  box-shadow: 0 0 12px rgba(68, 228, 186, .6);
}

.profile-scan-copy {
  position: relative;
  z-index: 2;
  min-width: 0;
  max-width: 760px;
}

.profile-scan-eyebrow {
  color: #5fdcff;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .19em;
}

.profile-scan-title {
  margin: 9px 0 11px;
  color: #f5f9ff;
  font-size: clamp(30px, 4vw, 48px);
  line-height: 1.02;
  letter-spacing: -.045em;
}

.profile-scan-subtitle {
  max-width: 630px;
  margin: 0;
  color: #8193ad;
  font-size: 14px;
  line-height: 1.62;
}

.profile-scan-stage-row {
  min-width: 0;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 11px;
  margin-top: 29px;
}

.profile-scan-stage-code {
  min-width: 68px;
  padding: 7px 9px;
  border: 1px solid rgba(71, 205, 255, .2);
  border-radius: 9px;
  color: #74ddff;
  background: rgba(26, 115, 160, .10);
  font-size: 9px;
  font-weight: 950;
  letter-spacing: .09em;
  text-align: center;
}

.profile-scan-stage-text {
  min-width: 0;
  overflow: hidden;
  color: #dfe8f5;
  font-size: 12px;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.profile-scan-percent {
  color: #7f91aa;
  font-size: 11px;
  font-weight: 850;
  font-variant-numeric: tabular-nums;
}

.profile-scan-progress {
  position: relative;
  height: 7px;
  overflow: visible;
  margin-top: 12px;
  border-radius: 999px;
  background: rgba(67, 94, 125, .18);
}

.profile-scan-progress-fill {
  position: absolute;
  inset: 0 auto 0 0;
  width: 8%;
  border-radius: inherit;
  background:
    linear-gradient(
      90deg,
      #22bce8,
      #63d7ff 48%,
      #806eff 100%
    );
  box-shadow: 0 0 18px rgba(66, 200, 255, .24);
  transition: width .2s ease;
}

.profile-scan-progress-glow {
  position: absolute;
  top: 50%;
  left: 8%;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #e9fbff;
  box-shadow:
    0 0 0 4px rgba(71, 212, 255, .11),
    0 0 18px rgba(71, 212, 255, .88);
  transform: translate(-50%, -50%);
  transition: left .2s ease;
}

.profile-scan-sources {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 22px;
}

.profile-scan-sources span {
  position: relative;
  padding: 7px 9px 7px 22px;
  border: 1px solid rgba(117, 139, 184, .11);
  border-radius: 9px;
  color: #5d6f89;
  background: rgba(255,255,255,.018);
  font-size: 8px;
  font-weight: 900;
  letter-spacing: .07em;
  transition:
    color .22s ease,
    border-color .22s ease,
    background .22s ease,
    box-shadow .22s ease;
}

.profile-scan-sources span::before {
  position: absolute;
  left: 8px;
  top: 50%;
  width: 6px;
  height: 6px;
  content: "";
  border-radius: 50%;
  background: #34445b;
  transform: translateY(-50%);
  transition: inherit;
}

.profile-scan-sources span.active {
  color: #9fc7dc;
  border-color: rgba(72, 196, 235, .18);
  background: rgba(34, 129, 166, .07);
}

.profile-scan-sources span.active::before {
  background: #42d1ef;
  box-shadow: 0 0 9px rgba(66, 209, 239, .55);
}

.profile-scan-sources span.current {
  color: #dff9ff;
  border-color: rgba(75, 213, 255, .32);
  background: rgba(46, 170, 213, .12);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025);
}

body.profile-loading .start-guide,
body.profile-loading .tabs,
body.profile-loading .view {
  display: none !important;
}

body.profile-loading .profile-scan-loader {
  display: grid !important;
}

.profile-scan-loader.is-complete .profile-scan-core {
  border-color: rgba(69, 230, 188, .45);
  box-shadow:
    0 0 0 12px rgba(42, 189, 151, .04),
    0 0 58px rgba(69, 230, 188, .19),
    inset 0 1px 0 rgba(255,255,255,.045);
}

.profile-scan-loader.is-complete .profile-scan-progress-fill {
  background: linear-gradient(90deg, #32c7dd, #48e5b8);
}

@keyframes ll-scan-beam {
  from { transform: translateY(2px); opacity: .48; }
  to   { transform: translateY(82px); opacity: 1; }
}

@keyframes ll-orbit-cw {
  to { transform: rotate(360deg); }
}

@keyframes ll-orbit-ccw {
  to { transform: rotate(-360deg); }
}

@keyframes ll-ping {
  0%, 100% { transform: scale(.75); opacity: .35; }
  50% { transform: scale(1.25); opacity: 1; }
}

@media (max-width: 720px) {
  .profile-scan-loader {
    min-height: 430px;
    grid-template-columns: 1fr;
    align-content: center;
    gap: 18px;
    padding: 26px 20px;
    text-align: center;
  }

  .profile-scan-visual {
    width: 170px;
  }

  .profile-scan-core {
    width: 78px;
    height: 78px;
    border-radius: 23px;
  }

  .profile-scan-core img {
    width: 54px;
    height: 54px;
  }

  .profile-scan-beam {
    animation-name: ll-scan-beam-mobile;
  }

  .profile-scan-copy {
    max-width: none;
  }

  .profile-scan-title {
    font-size: clamp(27px, 8vw, 36px);
  }

  .profile-scan-subtitle {
    margin-inline: auto;
    font-size: 12px;
  }

  .profile-scan-stage-row {
    grid-template-columns: auto minmax(0, 1fr) auto;
    text-align: left;
  }

  .profile-scan-sources {
    justify-content: center;
  }

  @keyframes ll-scan-beam-mobile {
    from { transform: translateY(2px); opacity: .48; }
    to   { transform: translateY(55px); opacity: 1; }
  }
}

@media (max-width: 420px) {
  .profile-scan-loader {
    min-height: 390px;
    padding: 22px 14px;
  }

  .profile-scan-visual {
    width: 145px;
  }

  .profile-scan-stage-code {
    min-width: 56px;
    padding-inline: 6px;
  }

  .profile-scan-stage-text {
    font-size: 10px;
  }

  .profile-scan-sources {
    gap: 5px;
  }

  .profile-scan-sources span {
    padding: 6px 7px 6px 18px;
    font-size: 7px;
  }

  .profile-scan-sources span::before {
    left: 7px;
    width: 5px;
    height: 5px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .profile-scan-orbit,
  .profile-scan-beam,
  .profile-scan-ping {
    animation: none !important;
  }
}



/* launchlab-match-history-map-previews-v0.4.14 */
.match-card {
  grid-template-columns: 110px 88px minmax(0, 1fr) auto;
}

.match-map-preview {
  position: relative;
  width: 88px;
  height: 64px;
  overflow: hidden;
  border: 1px solid rgba(120, 148, 192, .18);
  border-radius: 14px;
  background:
    radial-gradient(circle at 20% 20%, rgba(98, 212, 255, .08), transparent 34%),
    linear-gradient(145deg, rgba(14, 29, 47, .95), rgba(9, 18, 31, .95));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.03);
}

.match-map-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  opacity: .94;
}

.match-map-preview::after {
  position: absolute;
  inset: auto 0 0 0;
  height: 52%;
  content: "";
  background: linear-gradient(to top, rgba(5, 10, 18, .92), transparent);
}

.match-map-preview span {
  position: absolute;
  left: 9px;
  right: 9px;
  bottom: 8px;
  z-index: 1;
  overflow: hidden;
  color: #eef5ff;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .08em;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}

.match-map {
  min-width: 0;
}

.match-map strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.match-map span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 980px) {
  .match-card {
    grid-template-columns: 90px 72px minmax(0, 1fr) auto;
    gap: 14px;
  }

  .match-map-preview {
    width: 72px;
    height: 54px;
    border-radius: 12px;
  }
}

@media (max-width: 720px) {
  .match-card {
    grid-template-columns: 72px 1fr;
    gap: 12px;
  }

  .match-date {
    grid-column: 1 / -1;
  }

  .match-map-preview {
    width: 72px;
    height: 52px;
  }

  .match-map {
    align-self: center;
  }

  .match-score {
    grid-column: 2;
    text-align: left;
  }
}

@media (max-width: 480px) {
  .match-card {
    grid-template-columns: 1fr;
  }

  .match-map-preview {
    width: 100%;
    height: 84px;
  }

  .match-score {
    grid-column: auto;
  }
}

/* Launch Lab Learning UI cleanup */
.ll-learning-dataset-note {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 12px 0 16px;
  padding: 12px 14px;
  border: 1px solid rgba(122, 162, 255, .18);
  border-radius: 12px;
  background: rgba(28, 55, 92, .24);
  font-size: 12px;
  line-height: 1.45;
}

.ll-learning-dataset-note strong {
  white-space: nowrap;
}

.ll-learning-dataset-note span {
  opacity: .72;
}

[data-launchlab-legacy-verified-importer="hidden"] {
  display: none !important;
}

[data-launchlab-legacy-verified-importer="hidden"] {
  display: none !important;
}

.hero-llc-note{
  margin-top:10px!important;
  color:var(--muted);
  font-size:11px!important;
  line-height:1.5!important;
}

/* LLC quick-check highlight */
.hero-llc-note{
  display:flex!important;
  align-items:center;
  gap:9px;

  width:max-content;
  max-width:100%;

  margin:14px 0 2px!important;
  padding:10px 14px!important;

  border:1px solid rgba(35,201,255,.32)!important;
  border-radius:11px;

  color:#c9eeff!important;
  background:
    linear-gradient(
      110deg,
      rgba(35,201,255,.11),
      rgba(124,92,255,.08)
    )!important;

  box-shadow:
    0 0 0 1px rgba(35,201,255,.025),
    0 8px 24px rgba(0,0,0,.12);

  font-size:11px!important;
  font-weight:750!important;
  line-height:1.45!important;
}

.hero-llc-note::before{
  content:"⚡";
  display:grid;
  place-items:center;
  flex:0 0 auto;

  width:25px;
  height:25px;

  border-radius:7px;

  color:#7fddff;
  background:rgba(35,201,255,.11);

  font-size:13px;
}

@media(max-width:720px){
  .hero-llc-note{
    width:100%;
    padding:9px 11px!important;
    font-size:10px!important;
  }
}

/* Profile force refresh */
.profile-card .avatar-wrap{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:9px;
}

.profile-card .avatar-stage{
  position:relative;
  width:max-content;
}

.profile-refresh-button{
  display:none;
  align-items:center;
  justify-content:center;
  gap:6px;

  min-height:30px;
  padding:0 10px;

  border:1px solid rgba(35,201,255,.24);
  border-radius:9px;

  color:#bfeaff;
  background:rgba(35,201,255,.055);

  font:inherit;
  font-size:9px;
  font-weight:800;
  line-height:1;

  white-space:nowrap;
  cursor:pointer;

  transition:
    border-color .18s ease,
    background .18s ease,
    opacity .18s ease,
    transform .18s ease;
}

body.has-player .profile-refresh-button{
  display:inline-flex;
}

.profile-refresh-button:hover{
  border-color:rgba(35,201,255,.5);
  background:rgba(35,201,255,.11);
  transform:translateY(-1px);
}

.profile-refresh-button:disabled{
  opacity:.55;
  cursor:wait;
  transform:none;
}

.profile-refresh-icon{
  color:#55d8ff;
  font-size:14px;
  line-height:1;
}

.profile-refresh-button:disabled
.profile-refresh-icon{
  animation:
    profile-refresh-spin
    .8s linear infinite;
}

@keyframes profile-refresh-spin{
  to{
    transform:rotate(360deg);
  }
}

@media(max-width:720px){
  .profile-refresh-button{
    min-height:29px;
    padding:0 9px;
    font-size:8px;
  }
}


/* LL_CSSTATS_LEETIFY_RESERVE_V1 */

.ll-has-csstats-reserve {
  position: relative !important;
  min-height: 220px;
}

.ll-csstats-reserve {
  position: absolute;
  inset: 0;
  z-index: 50;

  display: flex;
  flex-direction: column;

  padding: 22px;

  border-radius: inherit;

  background:
    radial-gradient(
      circle at 8% 0%,
      rgba(111, 83, 255, .16),
      transparent 38%
    ),
    linear-gradient(
      145deg,
      rgba(15, 19, 41, .995),
      rgba(8, 12, 29, .995)
    );

  overflow: hidden;
}

.ll-csstats-reserve-head {
  display: flex;
  align-items: center;
  gap: 12px;

  margin-bottom: 25px;
}

.ll-csstats-reserve-head strong {
  color: #f7f7ff;
  font-size: 20px;
  font-weight: 800;
}

.ll-csstats-reserve-logo {
  width: 42px;
  height: 42px;

  display: grid;
  place-items: center;

  border-radius: 11px;

  background:
    linear-gradient(
      135deg,
      #6349ff,
      #9f65ff
    );

  color: white;

  font-size: 13px;
  font-weight: 900;

  box-shadow:
    0 8px 26px
    rgba(100, 70, 255, .25);
}

.ll-csstats-reserve-grid {
  flex: 1;

  display: grid;
  grid-template-columns:
    repeat(6, minmax(0, 1fr));
}

.ll-csstats-reserve-metric {
  min-width: 0;

  padding: 8px 18px 12px;

  border-left:
    1px solid rgba(255,255,255,.07);
}

.ll-csstats-reserve-metric:first-child {
  border-left: 0;
}

.ll-csstats-reserve-metric span {
  display: block;

  margin-bottom: 10px;

  color: rgba(230,232,255,.55);

  font-size: 11px;
  font-weight: 800;
  letter-spacing: .07em;
}

.ll-csstats-reserve-metric strong {
  display: block;

  color: #f8f8ff;

  font-size:
    clamp(25px, 2.2vw, 38px);

  line-height: 1;

  letter-spacing: -.04em;
}

.ll-csstats-reserve-line {
  height: 4px;
  width: 100%;

  margin-top: 20px;

  border-radius: 999px;

  overflow: hidden;

  background:
    rgba(255,255,255,.08);
}

.ll-csstats-reserve-line i {
  display: block;

  width: 60%;
  height: 100%;

  border-radius: inherit;

  background:
    linear-gradient(
      90deg,
      #7257ff,
      #a967ff
    );
}

@media (max-width: 900px) {
  .ll-csstats-reserve {
    padding: 17px;
    overflow: auto;
  }

  .ll-csstats-reserve-grid {
    grid-template-columns:
      repeat(2, minmax(0, 1fr));
  }

  .ll-csstats-reserve-metric {
    min-height: 100px;

    padding:
      14px 12px;

    border-left: 0;

    border-top:
      1px solid rgba(255,255,255,.07);
  }

  .ll-csstats-reserve-metric:nth-child(odd) {
    border-right:
      1px solid rgba(255,255,255,.07);
  }

  .ll-csstats-reserve-metric:nth-child(-n+2) {
    border-top: 0;
  }
}



/* ============================================================
   LL_CSSTATS_NATIVE_V4
   ============================================================ */

/* Disable all old overlay reserve implementations. */
.ll-csstats-reserve {
  display: none !important;
}

.ll-has-csstats-reserve {
  min-height: unset !important;
}


/* Native CSStats mode keeps original Leetify geometry. */
.leetify-card.ll-csstats-native-v4 {
  position: relative;
}

.leetify-card.ll-csstats-native-v4
.leetify-mark {
  display: grid;
  place-items: center;
}

.ll-cs-native-mark {
  width: 100%;
  height: 100%;

  display: grid;
  place-items: center;

  border-radius: inherit;

  font-size: 11px;
  font-weight: 900;
  letter-spacing: -.04em;

  color: #fff;

  background:
    linear-gradient(
      135deg,
      #6348ff,
      #9c61ff
    );
}

.leetify-card.ll-csstats-native-v4
.perf-value {
  color: #f7f8ff;
}

.leetify-card.ll-csstats-native-v4
.perf-bar i {
  background:
    linear-gradient(
      90deg,
      #7255ff,
      #ad67ff
    );

  box-shadow:
    0 0 14px
    rgba(118, 82, 255, .28);
}


/* CSStats Premier season fallback */
.ll-csstats-season-host {
  width: 100% !important;
  height: 100% !important;

  display: block !important;

  padding: 0 !important;

  text-align: left !important;

  color: inherit !important;
}

.ll-csstats-season-list {
  width: 100%;

  display: flex;
  flex-direction: column;

  gap: 10px;
}

.ll-csstats-season-row {
  display: grid;

  grid-template-columns:
    minmax(120px, 1fr)
    minmax(180px, 1.15fr);

  align-items: center;

  gap: 18px;

  padding: 14px 16px;

  border:
    1px solid
    rgba(139, 108, 255, .14);

  border-radius: 12px;

  background:
    linear-gradient(
      135deg,
      rgba(89, 64, 170, .11),
      rgba(20, 26, 52, .12)
    );
}

.ll-csstats-season-name {
  min-width: 0;
}

.ll-csstats-season-name strong {
  display: block;

  color: #f4f5ff;

  font-size: 13px;
  font-weight: 800;
}

.ll-csstats-season-name span {
  display: block;

  margin-top: 4px;

  color:
    rgba(211, 216, 242, .52);

  font-size: 10px;
}

.ll-csstats-season-values {
  display: grid;

  grid-template-columns:
    1fr 32px 1fr;

  align-items: center;

  gap: 8px;
}

.ll-csstats-season-values > div {
  min-width: 0;
}

.ll-csstats-season-values span {
  display: block;

  margin-bottom: 4px;

  color:
    rgba(209, 214, 243, .46);

  font-size: 9px;
  font-weight: 800;

  letter-spacing: .08em;
}

.ll-csstats-season-values strong {
  color: #f6f7ff;

  font-size: 17px;
  font-weight: 850;
}

.ll-csstats-season-values i {
  height: 2px;

  border-radius: 999px;

  background:
    linear-gradient(
      90deg,
      rgba(106, 84, 255, .25),
      #8a60ff,
      rgba(106, 84, 255, .25)
    );
}


@media (max-width: 720px) {

  .ll-csstats-season-row {
    grid-template-columns: 1fr;

    gap: 10px;
  }

}



/* ============================================================
   LL_CSSTATS_VISUAL_V13
   ============================================================ */

.csstats-old-brand-icon {
  display: none !important;
}


/* ---------- CSStats wordmark ---------- */

.csstats-brand-wordmark {
  display: inline-flex !important;
  align-items: center !important;
  width: 126px !important;
  min-width: 126px !important;
  height: 32px !important;
  line-height: 1 !important;
}

.csstats-brand-wordmark svg {
  display: block;
  width: 126px;
  height: auto;
  overflow: visible;
}

.csstats-brand-wordmark text {
  font-family:
    "Arial Black",
    Inter,
    "Segoe UI",
    Arial,
    sans-serif;

  font-size: 45px;
  font-weight: 950;
  font-style: italic;
  letter-spacing: -3.2px;
}

.csstats-brand-cs {
  fill: #f7f9ff;
}

.csstats-brand-stats {
  fill: #3478f6;
}


/* ---------- dynamic metric ---------- */

.csstats-live-cell {
  min-width: 0;
}

.csstats-live-meter {
  position: relative;
  width: 100%;
  height: 7px;
  overflow: visible;
  margin-top: 12px;
  border-radius: 999px;

  background:
    rgba(78, 103, 143, .24);

  box-shadow:
    inset 0 1px 2px rgba(0,0,0,.22);
}

.csstats-live-meter-fill {
  position: absolute;
  inset: 0 auto 0 0;
  width: 0%;
  border-radius: inherit;

  background:
    linear-gradient(
      90deg,
      #6d53ff 0%,
      #a84cff 52%,
      #ec49bd 100%
    );

  box-shadow:
    0 0 13px rgba(171, 76, 255, .25);

  transition:
    width .72s
    cubic-bezier(
      .2,
      .8,
      .25,
      1
    );
}

.csstats-live-meter-marker {
  position: absolute;
  z-index: 3;
  top: 50%;
  left: 1.2%;

  width: 3px;
  height: 16px;

  border-radius: 99px;

  background:
    #f7f9ff;

  box-shadow:
    0 0 0 1px rgba(109,83,255,.35),
    0 0 10px rgba(150,91,255,.45);

  transform:
    translate(
      -50%,
      -50%
    );

  transition:
    left .72s
    cubic-bezier(
      .2,
      .8,
      .25,
      1
    );
}

.csstats-live-meter.is-empty
  .csstats-live-meter-fill {
  width: 0% !important;
  box-shadow: none;
}

.csstats-live-meter.is-empty
  .csstats-live-meter-marker {
  opacity: .35;
  left: 1.2% !important;
}


/* subtle hover feedback */

.csstats-live-cell:hover
  .csstats-live-meter-fill {
  filter: brightness(1.12);
}


/* mobile */

@media (max-width: 720px) {

  .csstats-brand-wordmark {
    width: 108px !important;
    min-width: 108px !important;
  }

  .csstats-brand-wordmark svg {
    width: 108px;
  }

}


/* LL_TEMP_SERVICE_BANNER_V1 */

.has-temporary-service-banner {
  padding-top: 54px;
}

.temporary-service-banner {
  position: fixed;
  z-index: 999999;
  top: 0;
  left: 0;
  right: 0;

  min-height: 54px;

  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;

  padding: 12px 20px;

  background:
    linear-gradient(
      90deg,
      rgba(118, 36, 65, .98),
      rgba(76, 29, 65, .98)
    );

  border-bottom:
    1px solid rgba(255, 110, 145, .45);

  box-shadow:
    0 8px 30px rgba(0, 0, 0, .28);

  color: #fff;

  font-size: 15px;
  text-align: center;
}

.temporary-service-banner strong {
  font-weight: 800;
  letter-spacing: .01em;
}

.temporary-service-banner-icon {
  width: 25px;
  height: 25px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  flex: 0 0 auto;

  border-radius: 50%;

  background:
    rgba(255,255,255,.12);

  border:
    1px solid rgba(255,255,255,.28);

  font-weight: 900;
}

@media (max-width: 600px) {
  .temporary-service-banner {
    min-height: 50px;
    padding: 10px 12px;
    font-size: 13px;
  }

  .has-temporary-service-banner {
    padding-top: 50px;
  }
}


/* LL_TEMP_SERVICE_BANNER_V2 */

.temporary-service-banner {
  min-height: 68px;
}

.has-temporary-service-banner {
  padding-top: 68px;
}

.temporary-service-banner-copy {
  display: flex;
  flex-direction: column;
  gap: 3px;

  line-height: 1.35;
}

.temporary-service-banner-copy strong {
  font-size: 15px;
  font-weight: 850;
  color: #fff;
}

.temporary-service-banner-copy span {
  font-size: 12px;
  font-weight: 600;

  color:
    rgba(255,255,255,.78);
}

@media (max-width: 600px) {

  .temporary-service-banner {
    min-height: 74px;
  }

  .has-temporary-service-banner {
    padding-top: 74px;
  }

  .temporary-service-banner-copy strong {
    font-size: 13px;
  }

  .temporary-service-banner-copy span {
    font-size: 11px;
  }

}


/* LL_PREMIER_MAX_RATING_V2 */
.premier-rating-caption {
  margin: 7px 0 0;
  text-align: center;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: .06em;
  text-transform: uppercase;
  opacity: .58;
}


/* LL_PREMIER_MAX_CAPTION_LAYOUT_V3 */

.premier-current-rank {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
}

.premier-current-rank #premierBadge {
  order: 1 !important;
  display: block !important;
  width: fit-content !important;
  margin: 0 auto !important;
}

.premier-current-rank .premier-rating-caption {
  order: 2 !important;
  display: block !important;
  width: 100% !important;

  margin: 7px 0 0 !important;

  text-align: center !important;

  font-size: 10px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;

  opacity: .58 !important;
}


/* LL_MATCH_PAGINATION_V2 */

.matches-load-more-wrap {
  display: flex;
  justify-content: center;
  width: 100%;
  padding: 22px 0 8px;
}

.matches-load-more {
  min-width: 190px;
  min-height: 44px;

  padding:
    10px
    22px;

  border:
    1px solid
    rgba(112, 162, 255, .30);

  border-radius:
    12px;

  background:
    rgba(15, 34, 58, .92);

  color:
    inherit;

  font:
    inherit;

  font-weight:
    750;

  cursor:
    pointer;

  transition:
    transform .15s ease,
    background .15s ease,
    border-color .15s ease;
}

.matches-load-more:hover {
  transform:
    translateY(-1px);

  background:
    rgba(22, 47, 78, .98);

  border-color:
    rgba(112, 162, 255, .58);
}


/* LL_WINRATE_BOTTOM_BOX_ALIGN_V1 */

/* ��� ������ ���� �������� */
#winSourceMeta,
#winSampleMeta {
  line-height: 1.15;
}

/* ��������� ������� */
*:has(> #winSourceMeta) {
  min-height: 64px;
}

/* ��������� ������� */
*:has(> #winSampleMeta) {
  min-height: 64px;
}

/* ���� �������� ������� */
#winSampleMeta {
  display: flex;
  align-items: center;

  min-height: 28px;

  font-weight: 800;
}

/*
 * ����������� �������� ������� ����� ����
 * �� ����� ������������ ���.
 */
*:has(> #winSourceIcon),
*:has(> #winSampleMeta) {
  display: flex;
  align-items: center;
}

#winSourceIcon {
  flex-shrink: 0;
}


/* LL_WINRATE_BOTTOM_BOX_CENTER_V2 */

/*
 * ������ ��������:
 * ������� ������ �� ������,
 * ���������� ����.
 */
*:has(> #winSampleMeta) {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;

  gap: 9px !important;

  min-height: 64px !important;

  text-align: center !important;
}

/* ��������� ������� � ������ ������� �������� */
*:has(> #winSampleMeta) > span:first-child {
  width: 100% !important;

  text-align: center !important;
}

/* ���������� ������ */
#winSampleMeta {
  display: block !important;

  width: 100% !important;
  min-height: 0 !important;

  text-align: center !important;

  font-size: 17px !important;
  line-height: 1.05 !important;
  font-weight: 900 !important;
}


/*
 * ����� �������� �������.
 * ���������� ��������� ��������.
 */
*:has(#winSourceIcon) > span:first-child {
  width: 100% !important;
  text-align: center !important;
}

/* ��� ������� ����� ������ �� ������ */
#winSourceIcon.win-source-icon-csstats {
  display: block !important;

  width: 105px !important;
  max-width: 105px !important;
  height: 28px !important;

  margin-left: auto !important;
  margin-right: auto !important;

  object-position: center center !important;
}


/* LL_WINRATE_BOTTOM_FINAL_ALIGN_V3 */

/* ��� ������ ���������� */
*:has(> #winSourceIcon),
*:has(> #winSampleMeta) {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;

  text-align: center !important;
  gap: 10px !important;
}

/* ��������� ������� / ������� */
*:has(> #winSourceIcon) > span:first-child,
*:has(> #winSampleMeta) > span:first-child {
  display: block !important;

  width: 100% !important;

  margin: 0 !important;

  text-align: center !important;
}


/* ===== CSSTATS ===== */

#winSourceIcon.win-source-icon-csstats {
  display: block !important;

  width: 96px !important;
  max-width: 96px !important;
  height: 26px !important;

  margin:
    0
    auto !important;

  object-fit: contain !important;
  object-position: center center !important;

  align-self: center !important;
}

/* �� ������ ���� �������� ������ �������������� wrapper */
*:has(> #winSourceIcon) {
  width: 100% !important;
}

*:has(> #winSourceIcon) #winSourceIcon {
  margin-left: auto !important;
  margin-right: auto !important;
}


/* ===== ������� ===== */

#winSampleMeta {
  display: block !important;

  width: 100% !important;
  min-height: 0 !important;

  margin: 0 !important;

  text-align: center !important;

  font-size: 15px !important;
  line-height: 1.1 !important;
  font-weight: 850 !important;
}


/* LL_WINRATE_BOTTOM_UNIFIED_V4 */

/*
 * ������� + �������
 * �������� � ���� �� ����������� ����,
 * ��� �ֲ��� / CROSSHAIR � ��������� mini-card.
 */

*:has(> #winSourceIcon),
*:has(> #winSampleMeta) {
  box-sizing: border-box !important;

  height: 50px !important;
  min-height: 50px !important;

  padding: 7px 10px !important;

  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;

  gap: 4px !important;

  text-align: center !important;
}


/* ������� / ������� */

*:has(> #winSourceIcon) > span:first-child,
*:has(> #winSampleMeta) > span:first-child {
  display: block !important;

  width: 100% !important;

  margin: 0 !important;

  text-align: center !important;

  font-size: 8px !important;
  line-height: 1 !important;
  font-weight: 800 !important;
}


/* CSSTATS logo */

#winSourceIcon.win-source-icon-csstats {
  display: block !important;

  width: 82px !important;
  max-width: 82px !important;
  height: 18px !important;

  margin: 0 auto !important;

  object-fit: contain !important;
  object-position: center center !important;

  align-self: center !important;
}


/* ������� */

#winSampleMeta {
  display: block !important;

  width: 100% !important;
  min-height: 0 !important;

  margin: 0 !important;

  text-align: center !important;

  font-size: 14px !important;
  line-height: 1 !important;
  font-weight: 850 !important;

  white-space: nowrap !important;
}


/* LL_WINRATE_MINICARDS_V5 */

/*
 * ������� / �������
 * ������ ��� � ���������� KPI-�������� �����.
 */
*:has(> #winSourceIcon),
*:has(> #winSampleMeta) {
  box-sizing: border-box !important;

  height: 46px !important;
  min-height: 46px !important;

  padding: 6px 10px !important;

  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;

  gap: 5px !important;

  text-align: center !important;
}


/* ��������� ������� / ������� */
*:has(> #winSourceIcon) > span:first-child,
*:has(> #winSampleMeta) > span:first-child {
  display: block !important;

  width: 100% !important;

  margin: 0 !important;

  text-align: center !important;

  font-size: 8.5px !important;
  line-height: 1 !important;
  font-weight: 850 !important;

  letter-spacing: .03em !important;
}


/* CSSTATS */
#winSourceIcon.win-source-icon-csstats {
  display: block !important;

  width: 90px !important;
  max-width: 90px !important;
  height: 19px !important;

  margin: 0 auto !important;

  object-fit: contain !important;
  object-position: center center !important;

  align-self: center !important;
}


/* 2 493 ������ */
#winSampleMeta {
  display: block !important;

  width: 100% !important;
  min-height: 0 !important;

  margin: 0 !important;

  text-align: center !important;

  font-size: 15.5px !important;
  line-height: 1 !important;
  font-weight: 900 !important;

  letter-spacing: -.02em !important;

  white-space: nowrap !important;
}


/* LL_WINRATE_META_CARDS_FINAL_V6 */

/* ��� ���������� ���������� */
.win-explainer .metric-meta-grid.two-columns {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  align-items: stretch !important;
  gap: 8px !important;
}

.win-explainer .metric-meta-grid.two-columns > div {
  box-sizing: border-box !important;

  height: 46px !important;
  min-height: 46px !important;

  padding: 6px 10px !important;

  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;

  gap: 5px !important;

  text-align: center !important;
}


/* ������� / ������� */
.win-explainer .metric-meta-grid.two-columns > div > span:first-child {
  display: block !important;

  width: 100% !important;
  margin: 0 !important;

  text-align: center !important;

  font-size: 8.5px !important;
  line-height: 1 !important;
  font-weight: 850 !important;

  letter-spacing: .03em !important;
}


/* ������ ������ ����� �������� � ����� ������ */
.win-explainer .win-source-inline,
.win-explainer #winSampleMeta {
  box-sizing: border-box !important;

  width: 100% !important;
  height: 20px !important;
  min-height: 20px !important;

  margin: 0 !important;
  padding: 0 !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  text-align: center !important;
}


/* CSStats ������ �� ������ */
.win-explainer #winSourceIcon.win-source-icon-csstats {
  display: block !important;

  width: 88px !important;
  max-width: 88px !important;
  height: 19px !important;

  margin: 0 !important;

  object-fit: contain !important;
  object-position: center center !important;
}


/* ����� ����� � wordmark �� ����� */
.win-explainer #winSourceMeta {
  display: none !important;
}


/* ������� */
.win-explainer #winSampleMeta {
  font-size: 15px !important;
  line-height: 1 !important;
  font-weight: 900 !important;

  letter-spacing: -.015em !important;
  white-space: nowrap !important;
}


/* LL_CSSTATS_LOGO_SIZE_V7 */

.win-explainer #winSourceIcon.win-source-icon-csstats {
  width: 72px !important;
  max-width: 72px !important;
  height: 16px !important;
}


/* LL_WINRATE_META_POSITION_FIX_V8 */

.win-explainer .metric-meta-grid.two-columns > div {
  box-sizing: border-box !important;

  height: 48px !important;
  min-height: 48px !important;

  padding: 7px 10px !important;

  display: grid !important;
  grid-template-rows: 9px 20px !important;
  align-content: center !important;
  justify-items: center !important;

  row-gap: 5px !important;
}


/* ������� / ������� � ����������� ������ �������� */

.win-explainer .metric-meta-grid.two-columns > div > span:first-child {
  position: static !important;

  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;

  transform: none !important;

  width: 100% !important;
  height: 9px !important;

  margin: 0 !important;
  padding: 0 !important;

  display: block !important;

  text-align: center !important;

  font-size: 8.5px !important;
  line-height: 9px !important;
  font-weight: 850 !important;
}


/* ������ ������ */

.win-explainer .win-source-inline,
.win-explainer #winSampleMeta {
  position: static !important;

  width: 100% !important;
  height: 20px !important;
  min-height: 20px !important;

  margin: 0 !important;
  padding: 0 !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  transform: none !important;
}


/* CSStats */

.win-explainer #winSourceIcon.win-source-icon-csstats {
  width: 72px !important;
  max-width: 72px !important;
  height: 16px !important;

  margin: 0 auto !important;

  object-fit: contain !important;
  object-position: center !important;
}


/* ������ */

.win-explainer #winSampleMeta {
  font-size: 15px !important;
  line-height: 20px !important;
  font-weight: 900 !important;

  white-space: nowrap !important;
}


/* LL_DYNAMIC_PERFORMANCE_META_WINRATE_V2 */

/*
 * ADR / HLTV fallback:
 * ������� + ������� � ��� �� �����,
 * ��� ������ �������� WINRATE.
 */

.performance-csstats-fallback
.metric-meta-grid.two-columns {
  grid-template-columns:
    repeat(2, minmax(0, 1fr)) !important;

  align-items: stretch !important;

  gap: 8px !important;
}


.performance-csstats-fallback
.metric-meta-grid.two-columns > div {
  box-sizing: border-box !important;

  height: 48px !important;
  min-height: 48px !important;

  padding: 7px 10px !important;

  display: grid !important;

  grid-template-rows:
    9px
    20px !important;

  align-content: center !important;
  justify-items: center !important;

  row-gap: 5px !important;

  text-align: center !important;
}


/* ������� / ������� */

.performance-csstats-fallback
.metric-meta-grid.two-columns
> div
> span:first-child {
  position: static !important;

  width: 100% !important;
  height: 9px !important;

  margin: 0 !important;
  padding: 0 !important;

  display: block !important;

  text-align: center !important;

  font-size: 8.5px !important;
  line-height: 9px !important;
  font-weight: 850 !important;

  letter-spacing: .03em !important;

  transform: none !important;
}


/* ������ ������ */

.performance-csstats-fallback
#ttdQuality,

.performance-csstats-fallback
#ttdCrosshair {
  box-sizing: border-box !important;

  width: 100% !important;
  height: 20px !important;
  min-height: 20px !important;

  margin: 0 !important;
  padding: 0 !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  text-align: center !important;

  transform: none !important;
}


/* CSStats wordmark */

.performance-csstats-fallback
#ttdQuality.ttd-csstats-source {
  font-size: 0 !important;
}

.performance-csstats-fallback
.ttd-csstats-logo {
  display: block !important;

  width: 88px !important;
  max-width: 72px !important;
  height: 16px !important;

  margin: 0 auto !important;

  object-fit: contain !important;
  object-position: center center !important;
}


/* ���������� ������ */

.performance-csstats-fallback
#ttdCrosshair {
  font-size: 15px !important;
  line-height: 20px !important;
  font-weight: 900 !important;

  letter-spacing: -.015em !important;

  white-space: nowrap !important;
}


/* LL_DYNAMIC_PERFORMANCE_META_WINRATE_V2 */

/*
 * ADR / HLTV fallback:
 * ������� + ������� � ��� �� �����,
 * ��� ������ �������� WINRATE.
 */

.performance-csstats-fallback
.metric-meta-grid.two-columns {
  grid-template-columns:
    repeat(2, minmax(0, 1fr)) !important;

  align-items: stretch !important;

  gap: 8px !important;
}


.performance-csstats-fallback
.metric-meta-grid.two-columns > div {
  box-sizing: border-box !important;

  height: 48px !important;
  min-height: 48px !important;

  padding: 7px 10px !important;

  display: grid !important;

  grid-template-rows:
    9px
    20px !important;

  align-content: center !important;
  justify-items: center !important;

  row-gap: 5px !important;

  text-align: center !important;
}


/* ������� / ������� */

.performance-csstats-fallback
.metric-meta-grid.two-columns
> div
> span:first-child {
  position: static !important;

  width: 100% !important;
  height: 9px !important;

  margin: 0 !important;
  padding: 0 !important;

  display: block !important;

  text-align: center !important;

  font-size: 8.5px !important;
  line-height: 9px !important;
  font-weight: 850 !important;

  letter-spacing: .03em !important;

  transform: none !important;
}


/* ������ ������ */

.performance-csstats-fallback
#ttdQuality,

.performance-csstats-fallback
#ttdCrosshair {
  box-sizing: border-box !important;

  width: 100% !important;
  height: 20px !important;
  min-height: 20px !important;

  margin: 0 !important;
  padding: 0 !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  text-align: center !important;

  transform: none !important;
}


/* CSStats wordmark */

.performance-csstats-fallback
#ttdQuality.ttd-csstats-source {
  font-size: 0 !important;
}

.performance-csstats-fallback
.ttd-csstats-logo {
  display: block !important;

  width: 88px !important;
  max-width: 72px !important;
  height: 16px !important;

  margin: 0 auto !important;

  object-fit: contain !important;
  object-position: center center !important;
}


/* ���������� ������ */

.performance-csstats-fallback
#ttdCrosshair {
  font-size: 15px !important;
  line-height: 20px !important;
  font-weight: 900 !important;

  letter-spacing: -.015em !important;

  white-space: nowrap !important;
}


/* LL_HIDE_BOTTOM_META_LABELS_V1 */
/*
 * Bottom mini-cards:
 * hide small captions like "???????", "???????", "??????????"
 * and center the main values.
 */
.risk-card .metric-meta-grid > div > span:first-child,
.performance .metric-meta-grid > div > span:first-child,
.win-explainer .metric-meta-grid > div > span:first-child {
  display: none !important;
}

.risk-card .metric-meta-grid > div,
.performance .metric-meta-grid > div,
.win-explainer .metric-meta-grid > div {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  min-height: 44px !important;
}

.risk-card .metric-meta-grid > div > strong,
.performance .metric-meta-grid > div > strong,
.win-explainer .metric-meta-grid > div > strong {
  margin: 0 !important;
  text-align: center !important;
}

.performance .metric-meta-grid > div > strong.win-source-inline {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  width: 100% !important;
}


/* LL_BOTTOM_META_NO_CAPTIONS_FINAL_V2 */

/* ������� ������� ������� �� ���� ������ mini-card */
.metric-meta-grid > div > span:first-child {
  display: none !important;
}

/* ����� �������� ������� ���������� �������� */
.metric-meta-grid > div {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  min-height: 44px !important;
  padding: 6px 10px !important;

  text-align: center !important;
}

/* ������� �������� */
.metric-meta-grid > div > strong {
  width: 100% !important;

  margin: 0 !important;
  padding: 0 !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  text-align: center !important;
}

/* CSStats */
.metric-meta-grid .win-source-inline,
.metric-meta-grid .ttd-csstats-source {
  width: 100% !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  margin: 0 !important;
  padding: 0 !important;
}

/* ���������� ������ */
.metric-meta-grid #winSampleMeta,
.metric-meta-grid #ttdCrosshair {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  margin: 0 !important;
  padding: 0 !important;

  text-align: center !important;
}


/* LL_REMOVE_ADR_WIN_CAPTIONS_FINAL_V3 */

/* ������� ������� / ������� ������������ */
.win-explainer
.metric-meta-grid.two-columns
> div
> span:first-child,

.performance-csstats-fallback
.metric-meta-grid.two-columns
> div
> span:first-child {
  display: none !important;

  width: 0 !important;
  height: 0 !important;
  min-height: 0 !important;

  margin: 0 !important;
  padding: 0 !important;
}


/* ����� �������� ��������� ��������� ������ ���� ������ */
.win-explainer
.metric-meta-grid.two-columns
> div,

.performance-csstats-fallback
.metric-meta-grid.two-columns
> div {
  height: 42px !important;
  min-height: 42px !important;

  padding: 6px 10px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  text-align: center !important;

  gap: 0 !important;
}


/* CSStats ������ �� ������ */
.win-explainer .win-source-inline,
.performance-csstats-fallback #ttdQuality {
  width: 100% !important;
  height: 22px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  margin: 0 !important;
  padding: 0 !important;
}


/* ���������� ������ */
.win-explainer #winSampleMeta,
.performance-csstats-fallback #ttdCrosshair {
  width: 100% !important;
  height: 22px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  margin: 0 !important;
  padding: 0 !important;

  font-size: 15px !important;
  line-height: 1 !important;
  font-weight: 900 !important;
}


/* LL_WINRATE_REMOVE_LAST_CAPTION_V4 */

/*
 * ������ ������� � :has(#winSampleMeta)
 * ����� ������� specificity.
 * ����������� �� ��� �� ������ ����������.
 */

*:has(> #winSampleMeta) > span:first-child,
*:has(> .win-source-inline) > span:first-child {
  display: none !important;

  width: 0 !important;
  height: 0 !important;
  min-width: 0 !important;
  min-height: 0 !important;

  margin: 0 !important;
  padding: 0 !important;

  line-height: 0 !important;
  font-size: 0 !important;

  overflow: hidden !important;
}

/* ����� �������� ������� ���������� �������� */
*:has(> #winSampleMeta),
*:has(> .win-source-inline) {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  height: 42px !important;
  min-height: 42px !important;

  padding: 6px 10px !important;
}

/* LL_CSSTATS_TOP_METRICS_EQUAL_V1 */

/* ADR fallback + Winrate: ���������� ������ CSStats */
#winSourceIcon[src*="csstats"],
article:has(#ttdRing) img[src*="csstats"],
.card:has(#ttdRing) img[src*="csstats"] {
    width: 84px !important;
    min-width: 84px !important;
    max-width: 84px !important;

    height: 18px !important;
    max-height: 18px !important;

    object-fit: contain !important;
    object-position: center !important;

    display: block !important;
    margin: 0 auto !important;
}


/* LL_METRIC_RING_ENTER_ANIMATION_V1 */

#riskRing.metric-ring-enter,
#ttdRing.metric-ring-enter,
#winRing.metric-ring-enter {
  animation: llMetricRingEnter 560ms cubic-bezier(.2,.8,.2,1) both;
}

#riskRing.metric-ring-enter > *,
#ttdRing.metric-ring-enter > *,
#winRing.metric-ring-enter > * {
  animation: llMetricValueEnter 420ms cubic-bezier(.2,.8,.2,1) 130ms both;
}

@keyframes llMetricRingEnter {
  0% {
    opacity: 0;
    transform: scale(.78) rotate(-18deg);
    filter: blur(3px);
  }

  55% {
    opacity: 1;
    transform: scale(1.045) rotate(2deg);
    filter: blur(0);
  }

  100% {
    opacity: 1;
    transform: scale(1) rotate(0);
    filter: blur(0);
  }
}

@keyframes llMetricValueEnter {
  0% {
    opacity: 0;
    transform: scale(.82);
  }

  70% {
    opacity: 1;
    transform: scale(1.06);
  }

  100% {
    opacity: 1;
    transform: scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  #riskRing.metric-ring-enter,
  #ttdRing.metric-ring-enter,
  #winRing.metric-ring-enter,
  #riskRing.metric-ring-enter > *,
  #ttdRing.metric-ring-enter > *,
  #winRing.metric-ring-enter > * {
    animation: none !important;
  }
}


/* LL_RING_FILL_VISIBLE_FIX_V3
   ��������� ������ fade/scale ���������.
   ������ ������ ������ �����, � ����������� ������ ����������. */

#riskRing.metric-ring-enter,
#ttdRing.metric-ring-enter,
#winRing.metric-ring-enter {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
}

#riskRing.metric-ring-enter > *,
#ttdRing.metric-ring-enter > *,
#winRing.metric-ring-enter > * {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
}


/* LL_REAL_CONIC_RING_FILL_V4 */

/*
 * ������������ --value ��� �����.
 * ��� ����� ������� ����������� custom property ���������.
 */
@property --value {
    syntax: '<number>';
    inherits: false;
    initial-value: 0;
}


/*
 * ��������� ������ �����, �� �������� �������� conic-gradient.
 */
#riskRing,
#ttdRing,
#winRing {
    transition:
        --value 950ms cubic-bezier(.16,.84,.32,1),
        box-shadow 350ms ease !important;
}


/*
 * ������ �������� ��������� ������������ ���������.
 */
#riskRing.metric-ring-enter,
#ttdRing.metric-ring-enter,
#winRing.metric-ring-enter,
#riskRing.metric-ring-enter > *,
#ttdRing.metric-ring-enter > *,
#winRing.metric-ring-enter > * {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
}

/* LL_PROFILE_HEADER_CLEAN_V1 */

/*
 * ��������� � ������� ������ ������ ������ �����.
 * visibilityBadge � leetifyBadge �������� � DOM ��� JS.
 */
.profile-card #visibilityBadge,
.profile-card #leetifyBadge {
  display: none !important;
}


/* �������� � ���� ��� ���������� ������ */
.profile-card {
  position: relative !important;
}


/* ������ ���������� � ������ ������ */
.profile-card > #profileRefreshButton {
  position: absolute !important;
  z-index: 5 !important;

  top: 24px !important;
  right: 24px !important;

  width: auto !important;
  min-width: 0 !important;

  margin: 0 !important;

  white-space: nowrap !important;
}


/*
 * ��������� ����� ������, ����� ������ �����
 * ������� �� ������� ��� ������.
 */
.profile-card .status-row {
  padding-right: 150px !important;
}


/* �� �������� �� �������� �������� �� � ���� ������ */
@media (max-width: 560px) {

  .profile-card > #profileRefreshButton {
    top: 18px !important;
    right: 18px !important;
  }

  .profile-card .status-row {
    padding-right: 135px !important;
  }
}

/* /LL_PROFILE_HEADER_CLEAN_V1 */


/* LL_PROFILE_STRUCTURE_MOCKUP_V2_START */

/* =========================================================
   PROFILE CARD — layout по макету пользователя
   ========================================================= */

.profile-card {
  position: relative !important;
}


/* ---------- ВЕРХ: AVATAR + PROFILE INFO ---------- */

.profile-card .profile-main {
  display: grid !important;

  grid-template-columns:
    122px minmax(0, 1fr) !important;

  align-items: center !important;

  gap: 26px !important;
}


/* ---------- AVATAR ---------- */

.profile-card .avatar-wrap {
  display: flex !important;

  align-items: center !important;
  justify-content: center !important;

  width: 122px !important;

  align-self: center !important;
}


.profile-card .avatar-stage {
  width: 112px !important;
}


.profile-card .avatar {
  width: 112px !important;
  height: 112px !important;

  border-radius: 22px !important;
}


/* ---------- RIGHT COLUMN ---------- */

.profile-card .profile-copy {
  display: flex !important;

  flex-direction: column !important;
  align-items: flex-start !important;

  min-width: 0 !important;

  width: 100% !important;
}


/*
 * DOM:
 * status-row сейчас находится перед h1,
 * поэтому задаём визуальный порядок самостоятельно.
 */

.profile-card .profile-copy > h1 {
  order: 1 !important;

  width: 100% !important;

  margin:
    0 !important;

  color:
    #f4f7fb !important;

  font-size:
    28px !important;

  font-weight:
    950 !important;

  line-height:
    1.05 !important;

  letter-spacing:
    -.035em !important;
}


.profile-card .steam-id {
  order: 2 !important;

  width: 100% !important;

  margin-top:
    8px !important;

  padding-bottom:
    13px !important;

  border-bottom:
    1px solid rgba(135,166,207,.34) !important;

  color:
    #55aaff !important;

  font-size:
    14px !important;

  font-weight:
    850 !important;

  line-height:
    1.1 !important;
}


/* ---------- BAN STATUS ---------- */

.profile-card .status-row {
  order: 3 !important;

  display: flex !important;

  align-items: center !important;

  width: 100% !important;

  margin-top:
    10px !important;

  padding:
    0 !important;
}


/*
 * Оставляем только состояние банов.
 * Остальные плашки больше не нужны.
 */

.profile-card #visibilityBadge,
.profile-card #leetifyBadge,
.profile-card #demoBadge {
  display: none !important;
}


.profile-card #statusBadge {
  display: inline-flex !important;

  align-items: center !important;

  min-height:
    31px !important;

  padding:
    7px 11px !important;

  border-radius:
    9px !important;

  font-size:
    10px !important;

  font-weight:
    900 !important;

  line-height:
    1.05 !important;

  letter-spacing:
    .025em !important;
}


/* ---------- SERVICE ICONS ---------- */

.profile-card .profile-links {
  order: 4 !important;

  display: flex !important;

  align-items: center !important;

  gap:
    9px !important;

  margin-top:
    11px !important;
}


.profile-card .icon-btn.source-button {
  width:
    48px !important;

  min-width:
    48px !important;

  height:
    48px !important;

  border-radius:
    13px !important;
}


/* ---------- REFRESH BUTTON ---------- */

.profile-card #profileRefreshButton {
  order: 5 !important;

  position: static !important;

  top: auto !important;
  right: auto !important;
  left: auto !important;
  bottom: auto !important;

  display: inline-flex !important;

  align-items: center !important;
  justify-content: center !important;

  gap:
    7px !important;

  width:
    100% !important;

  max-width:
    260px !important;

  min-height:
    39px !important;

  margin:
    12px 0 0 !important;

  padding:
    8px 14px !important;

  white-space:
    nowrap !important;

  align-self:
    flex-start !important;
}


.profile-card .profile-refresh-icon {
  flex:
    0 0 auto !important;
}


/* ---------- LOWER FACTS ---------- */

.profile-card .mini-grid {
  width:
    100% !important;

  margin-top:
    20px !important;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 700px) {

  .profile-card .profile-main {
    grid-template-columns:
      108px minmax(0,1fr) !important;

    gap:
      18px !important;
  }

  .profile-card .avatar-wrap {
    width:
      108px !important;
  }

  .profile-card .avatar-stage,
  .profile-card .avatar {
    width:
      100px !important;

    height:
      100px !important;
  }

  .profile-card #profileRefreshButton {
    max-width:
      240px !important;
  }
}


/* =========================================================
   PHONE
   ========================================================= */

@media (max-width: 470px) {

  .profile-card .profile-main {
    grid-template-columns:
      94px minmax(0,1fr) !important;

    gap:
      14px !important;
  }

  .profile-card .avatar-wrap {
    width:
      94px !important;
  }

  .profile-card .avatar-stage,
  .profile-card .avatar {
    width:
      88px !important;

    height:
      88px !important;
  }

  .profile-card .profile-copy > h1 {
    font-size:
      23px !important;
  }

  .profile-card .steam-id {
    font-size:
      11px !important;
  }

  .profile-card .icon-btn.source-button {
    width:
      41px !important;

    min-width:
      41px !important;

    height:
      41px !important;
  }

  .profile-card #profileRefreshButton {
    width:
      100% !important;

    max-width:
      none !important;

    font-size:
      10px !important;
  }
}

/* LL_PROFILE_STRUCTURE_MOCKUP_V2_END */


/* LL_PROFILE_REFRESH_BUTTON_FIX_V3 */

.profile-card #profileRefreshButton {
  position: static !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  width: auto !important;
  min-width: 205px !important;
  max-width: none !important;

  height: 40px !important;
  min-height: 40px !important;

  margin: 12px 0 0 !important;
  padding: 0 16px !important;

  flex: 0 0 auto !important;
  align-self: flex-start !important;

  overflow: visible !important;
  white-space: nowrap !important;
  text-overflow: clip !important;

  line-height: 1 !important;
}

.profile-card #profileRefreshLabel {
  display: inline-block !important;
  width: auto !important;
  max-width: none !important;

  overflow: visible !important;
  white-space: nowrap !important;
  text-overflow: clip !important;
}

.profile-card .profile-refresh-icon {
  display: inline-flex !important;
  flex: 0 0 auto !important;

  margin-right: 7px !important;
}

/* /LL_PROFILE_REFRESH_BUTTON_FIX_V3 */


/* LL_PROFILE_REFRESH_BUTTON_FIX_V3 */

.profile-card #profileRefreshButton {
  position: static !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  width: auto !important;
  min-width: 205px !important;
  max-width: none !important;

  height: 40px !important;
  min-height: 40px !important;

  margin: 12px 0 0 !important;
  padding: 0 16px !important;

  flex: 0 0 auto !important;
  align-self: flex-start !important;

  overflow: visible !important;
  white-space: nowrap !important;
  text-overflow: clip !important;

  line-height: 1 !important;
}

.profile-card #profileRefreshLabel {
  display: inline-block !important;
  width: auto !important;
  max-width: none !important;

  overflow: visible !important;
  white-space: nowrap !important;
  text-overflow: clip !important;
}

.profile-card .profile-refresh-icon {
  display: inline-flex !important;
  flex: 0 0 auto !important;

  margin-right: 7px !important;
}

/* /LL_PROFILE_REFRESH_BUTTON_FIX_V3 */


/* LL_PROFILE_REFRESH_DOM_FIX_V4 */

.profile-card .profile-copy > #profileRefreshButton {
  order: 5 !important;

  position: static !important;
  inset: auto !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  box-sizing: border-box !important;

  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;

  height: 40px !important;
  min-height: 40px !important;

  margin: 12px 0 0 !important;
  padding: 0 14px !important;

  align-self: stretch !important;
  flex: 0 0 auto !important;

  overflow: hidden !important;
  white-space: nowrap !important;
}

.profile-card .profile-copy > #profileRefreshButton #profileRefreshLabel {
  display: block !important;

  min-width: 0 !important;

  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.profile-card .profile-copy > #profileRefreshButton .profile-refresh-icon {
  display: inline-flex !important;
  flex: 0 0 auto !important;

  margin: 0 7px 0 0 !important;
}

/* /LL_PROFILE_REFRESH_DOM_FIX_V4 */


/* LL_PROFILE_REFRESH_FINAL_V5 */

.profile-card .profile-copy > #profileRefreshButton {
  order: 5 !important;

  position: static !important;
  inset: auto !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  box-sizing: border-box !important;

  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;

  height: 40px !important;
  min-height: 40px !important;

  margin: 12px 0 0 !important;
  padding: 0 14px !important;

  align-self: stretch !important;

  overflow: hidden !important;
  white-space: nowrap !important;
}

.profile-card .profile-copy > #profileRefreshButton #profileRefreshLabel {
  display: inline-block !important;

  width: auto !important;
  max-width: 100% !important;

  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.profile-card .profile-copy > #profileRefreshButton .profile-refresh-icon {
  flex: 0 0 auto !important;
  margin-right: 7px !important;
}

/* /LL_PROFILE_REFRESH_FINAL_V5 */



/* launchlab-footer-pages-20260817 */
.site-footer {
  display: grid !important;
  grid-template-columns: minmax(220px, 1fr) auto auto;
  align-items: center;
  gap: 24px;
  margin: 0 auto 24px;
  padding: 18px 20px !important;
  border: 1px solid var(--border);
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(14, 28, 46, .86), rgba(7, 17, 31, .9));
  box-shadow: 0 16px 46px rgba(0, 0, 0, .2);
  backdrop-filter: blur(16px);
}
.footer-brand { display: flex; align-items: center; gap: 11px; min-width: 0; }
.footer-brand img { flex: 0 0 auto; width: 32px; height: 32px; border-radius: 10px; }
.footer-brand span { display: grid; min-width: 0; }
.footer-brand strong { color: var(--text); font-size: 12px; letter-spacing: .04em; }
.footer-brand small { margin-top: 2px; color: var(--muted-2); font-size: 10px; font-weight: 650; letter-spacing: 0; }
.footer-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 18px; }
.footer-links a { position: relative; padding: 7px 0; color: var(--muted); font-size: 11px; font-weight: 800; transition: color .18s ease; }
.footer-links a:hover, .footer-links a:focus-visible { color: var(--cyan); outline: none; }
.footer-links a::after { content: ""; position: absolute; right: 0; bottom: 3px; left: 0; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: right; transition: transform .18s ease; }
.footer-links a:hover::after, .footer-links a:focus-visible::after { transform: scaleX(1); transform-origin: left; }
.footer-copy { color: var(--muted-2); font-size: 10px; white-space: nowrap; }

.content-page { min-height: 100vh; }
.content-shell { width: min(960px, calc(100% - 32px)); margin: 0 auto; padding: 20px 0 56px; }
.content-page .topbar { position: relative; top: 0; justify-content: space-between; }
.content-back { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 14px; border: 1px solid var(--border); border-radius: 12px; color: var(--muted); background: rgba(112, 139, 178, .08); font-size: 12px; font-weight: 850; transition: .18s ease; }
.content-back:hover, .content-back:focus-visible { color: var(--text); border-color: var(--border-strong); background: rgba(112, 139, 178, .14); outline: none; }
.content-hero { position: relative; overflow: hidden; margin: 30px 0 18px; padding: clamp(26px, 6vw, 54px); border: 1px solid var(--border); border-radius: var(--radius); background: linear-gradient(145deg, rgba(16, 31, 51, .96), rgba(7, 17, 31, .94)); box-shadow: var(--shadow); }
.content-hero::after { content: ""; position: absolute; width: 260px; height: 260px; top: -140px; right: -80px; border-radius: 50%; background: rgba(80, 224, 193, .08); filter: blur(8px); pointer-events: none; }
.content-kicker { display: inline-flex; margin-bottom: 16px; color: var(--cyan); font-size: 10px; font-weight: 900; letter-spacing: .18em; text-transform: uppercase; }
.content-hero h1 { max-width: 720px; margin: 0; font-size: clamp(30px, 5vw, 54px); line-height: 1.02; letter-spacing: -.045em; }
.content-hero > p { max-width: 720px; margin: 17px 0 0; color: var(--muted); font-size: 14px; line-height: 1.75; font-weight: 600; }
.content-meta { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
.content-meta span { padding: 7px 10px; border: 1px solid var(--border); border-radius: 999px; color: var(--muted); background: rgba(112, 139, 178, .07); font-size: 10px; }
.content-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.content-card { padding: 24px; border: 1px solid var(--border); border-radius: 18px; background: rgba(11, 23, 39, .8); box-shadow: 0 14px 36px rgba(0, 0, 0, .14); }
.content-card.full { grid-column: 1 / -1; }
.content-card h2 { margin: 0 0 12px; font-size: 17px; }
.content-card h3 { margin: 20px 0 8px; font-size: 13px; }
.content-card p, .content-card li { color: var(--muted); font-size: 12px; line-height: 1.75; font-weight: 600; }
.content-card p { margin: 0 0 10px; }
.content-card p:last-child { margin-bottom: 0; }
.content-card ul, .content-card ol { margin: 0; padding-left: 20px; }
.content-card li + li { margin-top: 7px; }
.step-number { display: grid; place-items: center; width: 34px; height: 34px; margin-bottom: 18px; border: 1px solid rgba(80, 224, 193, .25); border-radius: 11px; color: var(--cyan); background: rgba(80, 224, 193, .08); font-size: 11px; font-weight: 950; }
.status-panel { display: grid; place-items: center; min-height: 300px; text-align: center; }
.status-orb { display: grid; place-items: center; width: 68px; height: 68px; margin: 0 auto 20px; border: 1px solid rgba(66, 165, 255, .26); border-radius: 22px; color: var(--blue); background: linear-gradient(135deg, rgba(66, 165, 255, .12), rgba(147, 104, 255, .12)); font-size: 25px; box-shadow: 0 16px 48px rgba(66, 165, 255, .12); }
.placeholder-contact { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 10px; padding: 15px 16px; border: 1px dashed var(--border-strong); border-radius: 13px; background: rgba(112, 139, 178, .05); }
.placeholder-contact span { color: var(--muted-2); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
.placeholder-contact strong { color: var(--muted); font-size: 12px; overflow-wrap: anywhere; }
.placeholder-note { margin-top: 16px !important; padding: 12px 14px; border-left: 2px solid var(--yellow); border-radius: 0 10px 10px 0; background: rgba(255, 196, 81, .06); }
.content-page .site-footer { margin-top: 4px; }

@media (max-width: 900px) {
  .site-footer { grid-template-columns: 1fr; justify-items: start; gap: 9px !important; }
  .footer-links { justify-content: flex-start; }
}
@media (max-width: 640px) {
  .content-shell { width: calc(100% - 20px); padding-top: 10px; }
  .content-page .topbar { min-height: 60px; margin-bottom: 12px; padding: 9px 10px; }
  .content-page .brand-copy { display: block !important; }
  .content-back { padding: 0 11px; }
  .content-hero { margin-top: 14px; padding: 25px 20px; border-radius: 18px; }
  .content-grid { grid-template-columns: 1fr; }
  .content-card { padding: 20px; }
  .content-card.full { grid-column: auto; }
  .site-footer { width: calc(100% - 20px) !important; padding: 17px !important; }
  .footer-brand small { max-width: 260px; }
  .footer-links { gap: 2px 16px; }
  .footer-links a { min-height: 38px; display: inline-flex; align-items: center; }
  .placeholder-contact { align-items: flex-start; flex-direction: column; gap: 5px; }
}


/* launchlab-real-contacts-20260817 */
.contact-grid { align-items: stretch; }
.contact-channel-card { display: flex; min-height: 190px; flex-direction: column; }
.contact-link {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: 13px;
  margin-top: 2px;
  padding: 15px 16px;
  border: 1px solid var(--border-strong);
  border-radius: 13px;
  background: rgba(112, 139, 178, .05);
  transition: border-color .18s ease, background .18s ease, transform .18s ease;
}
.contact-link:hover, .contact-link:focus-visible { border-color: rgba(80, 224, 193, .48); background: rgba(80, 224, 193, .075); transform: translateY(-1px); outline: none; }
.contact-link strong { color: var(--text); }
.contact-note { margin-top: 12px !important; margin-bottom: 0 !important; color: var(--muted-2) !important; }


/* launchlab-contact-icons-20260817 */
.contact-icon { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; }
.contact-icon svg { width: 22px; height: 22px; fill: currentColor; }
.telegram-icon { color: #48b7ee; background: rgba(42, 171, 238, .12); box-shadow: inset 0 0 0 1px rgba(72, 183, 238, .16); }
.tiktok-icon { color: #f4f7fb; background: linear-gradient(135deg, rgba(37, 244, 238, .13), rgba(254, 44, 85, .13)); box-shadow: inset 0 0 0 1px rgba(244, 247, 251, .12); }
.email-icon { color: var(--cyan); background: rgba(80, 224, 193, .1); box-shadow: inset 0 0 0 1px rgba(80, 224, 193, .15); }
.contact-link-copy { display: grid; min-width: 0; text-transform: none !important; letter-spacing: 0 !important; }
.contact-link-copy small { margin-bottom: 4px; color: var(--muted-2); font-size: 9px; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.contact-link-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.contact-arrow { color: var(--muted-2) !important; font-size: 16px !important; letter-spacing: 0 !important; transition: color .18s ease, transform .18s ease; }
.contact-link:hover .contact-arrow, .contact-link:focus-visible .contact-arrow { color: var(--cyan) !important; transform: translate(2px, -2px); }
@media (max-width: 640px) {
  .contact-channel-card { min-height: 0; }
  .contact-link { grid-template-columns: 40px minmax(0, 1fr) auto; gap: 11px; padding: 13px 14px; }
  .contact-icon { width: 40px; height: 40px; }
  .contact-link-copy strong { font-size: 11px; }
}


/* launchlab-locale-only-20260817 */
.locale-en { display: none; }
html[data-launchlab-locale="en"] .locale-uk { display: none; }
html[data-launchlab-locale="en"] .locale-en { display: inline; }

/* launchlab-account-mvp-20260817 */
.account-page [hidden] { display: none !important; }
.account-page .content-shell { width: min(1120px, calc(100% - 32px)); }
.account-hero { margin-bottom: 18px; }
.account-hero-points { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
.account-hero-points span { padding: 8px 11px; border: 1px solid var(--border); border-radius: 999px; color: var(--muted); background: rgba(112,139,178,.07); font-size: 10px; }
.account-loading { display: flex; align-items: center; justify-content: center; gap: 12px; min-height: 170px; }
.account-spinner { width: 22px; height: 22px; border: 2px solid rgba(255,255,255,.12); border-top-color: var(--cyan); border-radius: 50%; animation: account-spin .8s linear infinite; }
@keyframes account-spin { to { transform: rotate(360deg); } }
.account-signin-card { display: grid; grid-template-columns: 72px minmax(0, 1fr) auto; align-items: center; gap: 22px; padding: 30px; background: linear-gradient(135deg, rgba(15,32,53,.96), rgba(8,20,35,.96)); }
.account-signin-mark { display: grid; place-items: center; width: 72px; height: 72px; border: 1px solid rgba(66,165,255,.25); border-radius: 22px; color: #d8e8ff; background: linear-gradient(145deg, rgba(66,165,255,.15), rgba(147,104,255,.12)); box-shadow: 0 18px 44px rgba(34,105,180,.14); }
.account-signin-mark svg { width: 38px; height: 38px; fill: currentColor; }
.account-signin-copy .content-kicker, .account-section-head .content-kicker, .account-settings-card .content-kicker, .account-danger-card .content-kicker, .account-profile-copy .content-kicker { margin-bottom: 8px; }
.account-signin-copy h2, .account-profile-copy h2, .account-section-head h2, .account-settings-card h2, .account-danger-card h2 { margin: 0; }
.account-signin-copy p { margin: 9px 0 0; max-width: 620px; color: var(--muted); font-size: 12px; line-height: 1.7; }
.account-steam-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 50px; padding: 0 20px; border: 1px solid rgba(66,165,255,.28); border-radius: 14px; color: #fff; background: linear-gradient(135deg, #193b62, #10223c); box-shadow: 0 13px 34px rgba(0,0,0,.2); font-size: 12px; font-weight: 900; white-space: nowrap; transition: transform .18s ease, border-color .18s ease, filter .18s ease; }
.account-steam-btn:hover, .account-steam-btn:focus-visible { transform: translateY(-1px); border-color: rgba(80,224,193,.48); filter: brightness(1.08); outline: none; }
.account-steam-btn svg { width: 20px; height: 20px; fill: currentColor; }
.account-benefits { margin-top: 14px; }
.account-feature-number { display: inline-grid; place-items: center; width: 34px; height: 34px; margin-bottom: 18px; border: 1px solid rgba(80,224,193,.22); border-radius: 11px; color: var(--cyan); background: rgba(80,224,193,.07); font-size: 10px; }
.account-guest-note { display: flex; align-items: center; gap: 16px; }
.account-guest-note strong { flex: 0 0 auto; }
.account-guest-note p { flex: 1 1 auto; margin: 0; }
.account-guest-note .content-back { flex: 0 0 auto; }
.account-profile-card { padding: 28px; }
.account-profile-head { display: flex; align-items: center; gap: 18px; }
.account-avatar { flex: 0 0 auto; width: 76px; height: 76px; object-fit: cover; border: 1px solid var(--border-strong); border-radius: 22px; background: var(--panel-2); box-shadow: 0 13px 34px rgba(0,0,0,.2); }
.account-profile-copy { min-width: 0; flex: 1 1 auto; }
.account-profile-copy h2 { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 24px; }
.account-profile-copy p { margin: 6px 0 0; color: var(--muted-2); font-size: 11px; }
.account-profile-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.account-ghost-btn, .account-text-btn, .account-item-btn, .account-danger-btn { border: 0; font: inherit; cursor: pointer; }
.account-ghost-btn { min-height: 40px; padding: 0 14px; border: 1px solid var(--border); border-radius: 12px; color: var(--muted); background: rgba(112,139,178,.06); font-size: 11px; font-weight: 850; }
.account-ghost-btn:hover { color: var(--text); border-color: var(--border-strong); }
.account-summary-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 10px; margin-top: 24px; }
.account-summary-grid div { padding: 15px 16px; border: 1px solid var(--border); border-radius: 14px; background: rgba(3,12,22,.27); }
.account-summary-grid span { display: block; color: var(--muted-2); font-size: 9px; letter-spacing: .09em; text-transform: uppercase; }
.account-summary-grid strong { display: block; margin-top: 7px; font-size: 17px; }
.account-dashboard-grid { margin-top: 14px; }
.account-section-card { min-width: 0; }
.account-section-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.account-limit { padding: 7px 10px; border: 1px solid var(--border); border-radius: 999px; color: var(--muted); font-size: 10px; white-space: nowrap; }
.account-add-form { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 9px; margin-bottom: 15px; }
.account-add-form input { min-width: 0; height: 46px; padding: 0 14px; border: 1px solid var(--border); border-radius: 13px; outline: none; color: var(--text); background: rgba(3,12,22,.35); font-size: 12px; }
.account-add-form input:focus { border-color: rgba(66,165,255,.55); box-shadow: 0 0 0 4px rgba(66,165,255,.08); }
.account-add-form button { min-height: 46px; padding: 0 18px; border: 0; border-radius: 13px; color: #06101d; background: var(--cyan); cursor: pointer; font: inherit; font-size: 11px; font-weight: 950; }
.account-add-form button:disabled { cursor: wait; opacity: .6; }
.account-list { display: grid; gap: 9px; }
.account-list-item { display: grid; grid-template-columns: 48px minmax(0,1fr) auto; align-items: center; gap: 13px; padding: 12px; border: 1px solid var(--border); border-radius: 14px; background: rgba(3,12,22,.25); }
.account-list-avatar { width: 48px; height: 48px; object-fit: cover; border-radius: 13px; background: var(--panel-2); }
.account-list-copy { display: grid; min-width: 0; }
.account-list-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.account-list-copy span { margin-top: 3px; color: var(--muted-2); font-size: 9px; }
.account-list-copy small { margin-top: 6px; overflow: hidden; color: var(--muted); font-size: 10px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.account-item-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.account-item-btn { display: inline-flex; align-items: center; min-height: 34px; padding: 0 10px; border: 1px solid var(--border); border-radius: 10px; color: var(--muted); background: rgba(112,139,178,.05); font-size: 9px; font-weight: 850; }
.account-item-btn:hover, .account-item-btn:focus-visible { color: var(--text); border-color: var(--border-strong); outline: none; }
.account-item-btn.primary { color: var(--cyan); border-color: rgba(80,224,193,.2); }
.account-item-btn.danger { color: #ff91a6; border-color: rgba(255,92,122,.18); }
.account-empty { padding: 30px 18px; border: 1px dashed var(--border); border-radius: 14px; color: var(--muted-2); text-align: center; font-size: 11px; }
.account-text-btn { padding: 7px 0; color: var(--muted); background: transparent; font-size: 10px; font-weight: 850; }
.account-text-btn:hover { color: var(--text); }
.account-text-btn:disabled { opacity: .35; cursor: default; }
.account-settings-card, .account-danger-card { min-height: 190px; }
.account-setting-row { display: grid; grid-template-columns: minmax(0,1fr) 46px; align-items: center; gap: 15px; margin-top: 20px; cursor: pointer; }
.account-setting-row span { display: grid; }
.account-setting-row strong { font-size: 12px; }
.account-setting-row small { margin-top: 6px; color: var(--muted); font-size: 10px; line-height: 1.55; font-weight: 600; }
.account-setting-row input { position: absolute; opacity: 0; pointer-events: none; }
.account-setting-row i { position: relative; width: 46px; height: 26px; border: 1px solid var(--border-strong); border-radius: 999px; background: rgba(112,139,178,.12); transition: .2s ease; }
.account-setting-row i::after { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: var(--muted); transition: .2s ease; }
.account-setting-row input:checked + i { border-color: rgba(80,224,193,.42); background: rgba(80,224,193,.18); }
.account-setting-row input:checked + i::after { transform: translateX(20px); background: var(--cyan); }
.account-setting-row input:focus-visible + i { box-shadow: 0 0 0 4px rgba(66,165,255,.1); }
.account-danger-card { border-color: rgba(255,92,122,.16); }
.account-danger-card p { margin: 13px 0 18px; }
.account-danger-btn { min-height: 40px; padding: 0 14px; border: 1px solid rgba(255,92,122,.25); border-radius: 12px; color: #ff9daf; background: rgba(255,92,122,.06); font-size: 10px; font-weight: 900; }
.account-danger-btn:hover { border-color: rgba(255,92,122,.5); background: rgba(255,92,122,.11); }
.account-toast { position: fixed; z-index: 120; right: 22px; bottom: 22px; max-width: min(380px, calc(100% - 28px)); padding: 13px 16px; border: 1px solid rgba(80,224,193,.3); border-radius: 13px; color: var(--text); background: rgba(8,24,38,.96); box-shadow: 0 18px 52px rgba(0,0,0,.4); backdrop-filter: blur(14px); font-size: 11px; }
.account-toast.error { border-color: rgba(255,92,122,.36); }

@media (max-width: 760px) {
  .account-signin-card { grid-template-columns: 58px minmax(0,1fr); padding: 23px; }
  .account-signin-mark { width: 58px; height: 58px; border-radius: 18px; }
  .account-signin-mark svg { width: 31px; height: 31px; }
  .account-steam-btn { grid-column: 1 / -1; width: 100%; }
  .account-guest-note { align-items: flex-start; flex-direction: column; }
  .account-profile-head { align-items: flex-start; flex-wrap: wrap; }
  .account-profile-copy { width: calc(100% - 94px); }
  .account-profile-actions { width: 100%; justify-content: flex-start; }
  .account-summary-grid { grid-template-columns: 1fr; }
  .account-list-item { grid-template-columns: 44px minmax(0,1fr); }
  .account-list-avatar { width: 44px; height: 44px; }
  .account-item-actions { grid-column: 1 / -1; justify-content: flex-start; padding-left: 57px; }
}

@media (max-width: 640px) {
  .account-page .content-shell { width: calc(100% - 20px); }
  .account-hero-points { display: grid; }
  .account-hero-points span { width: fit-content; }
  .account-profile-card { padding: 20px; }
  .account-avatar { width: 64px; height: 64px; border-radius: 18px; }
  .account-profile-copy { width: calc(100% - 82px); }
  .account-profile-copy h2 { font-size: 20px; }
  .account-add-form { grid-template-columns: 1fr; }
  .account-add-form button { width: 100%; }
  .account-list-item { padding: 11px; }
  .account-item-actions { padding-left: 0; }
  .account-item-btn { flex: 1 1 auto; justify-content: center; }
  .account-toast { right: 14px; bottom: 14px; }
}

/* steam-header-20260817 */
.header-account-link {
  grid-area: account;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  justify-self: end;
  gap: 8px;
  min-width: 104px;
  height: 42px;
  padding: 0 12px 0 8px;
  border: 1px solid rgba(102, 192, 244, .24);
  border-radius: 13px;
  color: #edf6ff;
  background: linear-gradient(145deg, rgba(24, 58, 94, .92), rgba(10, 27, 50, .96));
  box-shadow: 0 10px 26px rgba(0, 0, 0, .18);
  font-size: 10px;
  font-weight: 900;
  white-space: nowrap;
  transition: transform .18s ease, border-color .18s ease, filter .18s ease;
}

.header-account-link:hover,
.header-account-link:focus-visible {
  transform: translateY(-1px);
  border-color: rgba(102, 192, 244, .54);
  filter: brightness(1.08);
  outline: none;
}

.header-account-link img {
  flex: 0 0 auto;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  object-fit: cover;
}

.header-account-link.is-authenticated {
  max-width: 162px;
  border-color: rgba(80, 224, 193, .24);
  background: linear-gradient(145deg, rgba(15, 48, 62, .94), rgba(8, 27, 43, .96));
}

.header-account-link.is-authenticated span {
  overflow: hidden;
  text-overflow: ellipsis;
}

.topbar {
  grid-template-columns: auto auto minmax(260px, 1fr) auto auto !important;
  grid-template-areas: "brand language search mode account" !important;
}

html.ll-fluid-desktop .topbar {
  grid-template-columns: auto auto minmax(320px, 1fr) auto auto !important;
  grid-template-areas: "brand language search mode account" !important;
}

.account-signin-mark img {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  object-fit: cover;
  filter: drop-shadow(0 10px 20px rgba(0, 104, 180, .22));
}

.account-steam-btn img {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  object-fit: cover;
}

@media (min-width: 760px) and (max-width: 1099px) {
  .topbar {
    grid-template-columns: auto auto minmax(0, 1fr) auto !important;
    grid-template-areas:
      "brand language mode account"
      "search search search search" !important;
  }
}

@media (max-width: 759px) {
  .topbar {
    grid-template-columns: minmax(0, 1fr) auto auto !important;
    grid-template-areas:
      "brand language account"
      "search search search" !important;
  }

  .header-account-link {
    min-width: 40px;
    width: 40px;
    height: 40px;
    padding: 6px;
    border-radius: 12px;
  }

  .header-account-link span {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
  }

  .header-account-link img {
    width: 27px;
    height: 27px;
  }
}

@media (max-width: 390px) {
  .language-switcher-trigger {
    min-width: 58px !important;
    padding-inline: 7px !important;
  }
}

/* Final desktop sizing override: keep the ranks and inventory cards content-height. */
@media (min-width:901px) {
  html.ll-fluid-desktop body.has-player .ranks-skins-grid {
    height:auto !important;
    min-height:0 !important;
    align-items:start !important;
  }
  html.ll-fluid-desktop body.has-player .ranks-skins-grid > .rank-card,
  html.ll-fluid-desktop body.has-player .ranks-skins-grid > .rank-card .competitive-panel,
  html.ll-fluid-desktop body.has-player .ranks-skins-grid > .rank-card .rank-board {
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    align-self:start !important;
    overflow:visible !important;
  }
  html.ll-fluid-desktop body.has-player .ranks-skins-grid > .rank-card {
    align-self:stretch !important;
  }
  html.ll-fluid-desktop body.has-player .ranks-skins-grid > .rank-card .competitive-panel,
  html.ll-fluid-desktop body.has-player .ranks-skins-grid > .rank-card .rank-board {
    width:100% !important;
    align-self:stretch !important;
  }
  html.ll-fluid-desktop body.has-player .ranks-skins-grid > .bottom-grid {
    grid-template-rows:auto 404px !important;
    height:auto !important;
    min-height:0 !important;
    align-self:start !important;
    overflow:visible !important;
  }
  html.ll-fluid-desktop body.has-player .ranks-skins-grid > .bottom-grid > .chart-card {
    height:404px !important;
    min-height:404px !important;
    display:block !important;
    overflow:hidden !important;
  }
  html.ll-fluid-desktop body.has-player .inventory-top-skins {
    grid-template-columns:1fr !important;
    gap:12px !important;
    margin:18px 0 0 !important;
    padding:0;
  }
  html.ll-fluid-desktop body.has-player .inventory-top-skin {
    grid-template-columns:132px minmax(0,1fr) !important;
    min-height:145px !important;
    height:145px !important;
    padding:14px 18px !important;
  }
  html.ll-fluid-desktop body.has-player .inventory-top-skin-image {
    width:118px !important;
    height:108px !important;
  }
  html.ll-fluid-desktop body.has-player .inventory-top-skin-copy > strong {
    font-size:17px !important;
  }
}
