:root {
  --bg: #070a0e;
  --bg-grad:
    radial-gradient(900px 700px at 72% -120px, rgba(120, 150, 110, .1), transparent 62%),
    radial-gradient(800px 600px at 18% 4%, rgba(70, 95, 120, .13), transparent 70%),
    linear-gradient(180deg, #0f1620 0%, #0a0f15 40%, #070a0e 100%);
  --panel: rgba(11, 15, 21, .84);
  --panel-2: #171d27;
  --panel-3: #1d2532;
  --line: #1f2733;
  --line-soft: #1b222d;
  --text: #e8ebf2;
  --muted: #8d96a8;
  --dim: #5b6474;
  --accent: #d1452a;
  --accent-hot: #ff5c3a;
  --gold: #e8a33d;
  --radiant: #55b06b;
  --dire: #c74236;
  --blue: #4b8fd6;
  --violet: #8b6ede;
  --r1: #e05c5c;
  --r2: #e0a45c;
  --r3: #6ec06e;
  --r4: #5c9de0;
  --r5: #b07ee0;
  --radius: 10px;
  --radius-sm: 6px;
  --shadow: 0 18px 40px -20px rgba(0, 0, 0, .9);
  --font: "Inter", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  --mono: "JetBrains Mono", "SF Mono", Consolas, monospace;
  --header-h: 56px;
  --chat-w: 330px;
}

* { box-sizing: border-box; }
/* атрибут hidden всегда прячет, даже если у элемента свой display */
[hidden] { display: none !important; }

html, body { height: 100%; }

body {
  margin: 0;
  font-family: var(--font);
  background: var(--bg);
  background-image: var(--bg-grad);
  background-attachment: fixed;
  color: var(--text);
  font-size: 14px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }

h1, h2, h3, h4 { margin: 0; font-weight: 650; letter-spacing: -.01em; }

input, select, textarea, button { font-family: inherit; font-size: inherit; color: inherit; }

::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #272f3d; border-radius: 6px; }
::-webkit-scrollbar-thumb:hover { background: #333d4e; }

.logo { display: flex; align-items: center; gap: 10px; font-weight: 800; letter-spacing: .14em; font-size: 13px; text-transform: uppercase; }
.logo-mark {
  width: 28px; height: 28px; border-radius: 7px;
  background: linear-gradient(145deg, var(--accent-hot), #7b1d10);
  display: grid; place-items: center;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .06) inset, 0 6px 18px -8px var(--accent);
}
.logo-mark { overflow: hidden; }
.logo-mark img { width: 100%; height: 100%; object-fit: cover; display: block; }
.logo span em { font-style: normal; color: var(--accent-hot); }

.search {
  display: flex; align-items: center; gap: 8px;
  background: var(--panel); border: 1px solid var(--line);
  border-radius: var(--radius-sm); padding: 7px 11px; width: 210px;
}
.search input { background: none; border: 0; outline: 0; width: 100%; font-size: 13px; }
.search input::placeholder { color: var(--dim); }
.search svg { width: 14px; height: 14px; color: var(--dim); flex: none; }

.user-chip {
  display: flex; align-items: center; gap: 9px;
  padding: 4px 11px 4px 4px;
  border: 1px solid var(--line); border-radius: 30px; background: var(--panel);
  cursor: pointer; transition: .15s;
}
.user-chip:hover { border-color: #33404f; }
.user-chip .avatar { width: 26px; height: 26px; }
.user-chip b { font-size: 12.5px; font-weight: 600; }
.user-chip i { font-style: normal; font-size: 11px; color: var(--gold); font-variant-numeric: tabular-nums; }

.avatar {
  width: 34px; height: 34px; border-radius: 50%;
  display: grid; place-items: center;
  font-size: 12px; font-weight: 700; letter-spacing: .02em;
  background: linear-gradient(140deg, #2c3646, #1b2230);
  border: 1px solid var(--line); color: #c3ccdb; flex: none;
  overflow: hidden;
}
.avatar.sm { width: 26px; height: 26px; font-size: 10px; }
.avatar.lg { width: 56px; height: 56px; font-size: 17px; }
.avatar.xl { width: 84px; height: 84px; font-size: 26px; border-radius: 16px; }

.layout { display: flex; min-height: calc(100vh - var(--header-h)); }
.main { flex: 1; min-width: 0; }
.wrap { max-width: 1320px; margin: 0 auto; padding: 26px 22px 70px; }
.wrap.narrow { max-width: 940px; }

.page-head { display: flex; align-items: flex-end; gap: 16px; margin-bottom: 20px; flex-wrap: wrap; }
.page-head h1 { font-size: 23px; }
.page-head p { margin: 4px 0 0; color: var(--muted); font-size: 13px; }
.page-head p:empty { display: none; }
.page-head .spacer { flex: 1; }

.eyebrow {
  font-size: 10.5px; letter-spacing: .18em; text-transform: uppercase;
  color: var(--dim); font-weight: 700;
}

.panel {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  backdrop-filter: blur(8px);
}
.panel-head {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 16px; border-bottom: 1px solid var(--line-soft);
  background: linear-gradient(180deg, rgba(255, 255, 255, .03), transparent);
}
.panel-head h3 {
  font-size: 10.5px; font-weight: 800;
  letter-spacing: .14em; text-transform: uppercase; color: var(--muted);
}
.panel-head .spacer { flex: 1; }
.panel-body { padding: 16px; }
.panel-body.flush { padding: 0; }
.panel-foot { padding: 12px 16px; border-top: 1px solid var(--line-soft); display: flex; gap: 10px; align-items: center; }
.panel-foot > .muted:empty { display: none; }

.grid { display: grid; gap: 16px; }
.g-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.g-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.g-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.g-main { grid-template-columns: minmax(0, 1fr) 330px; }
.g-side { grid-template-columns: 290px minmax(0, 1fr); }
.g-main.solo { grid-template-columns: minmax(0, 1fr); }

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  height: 36px; padding: 0 16px;
  border: 1px solid var(--line); border-radius: var(--radius-sm);
  background: var(--panel-2); color: var(--text);
  font-size: 13px; font-weight: 600; cursor: pointer;
  transition: .15s; white-space: nowrap;
}
.btn:hover { background: var(--panel-3); border-color: #34404f; }
.btn svg { width: 15px; height: 15px; }
.btn-primary {
  background: linear-gradient(180deg, var(--accent-hot), #8d2415);
  border-color: transparent; color: #fff;
  box-shadow: 0 10px 24px -14px var(--accent-hot);
}
.btn-primary:not(.btn-sm):not(.btn-icon) {
  clip-path: polygon(10px 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%, 0 10px);
}
.btn-primary:hover { filter: brightness(1.08); background: linear-gradient(160deg, var(--accent-hot), var(--accent)); }
.btn-ghost { background: transparent; }
.btn-ghost:hover { background: var(--panel-2); }
.btn-gold { background: linear-gradient(160deg, #f0b455, #c8811f); border-color: transparent; color: #211603; }
.btn-danger { background: rgba(199, 66, 54, .12); border-color: rgba(199, 66, 54, .4); color: var(--dire); }
.btn-danger:hover { background: rgba(199, 66, 54, .2); border-color: rgba(199, 66, 54, .6); }
.btn-lg { height: 44px; padding: 0 24px; font-size: 14px; }
.btn-sm { height: 29px; padding: 0 11px; font-size: 12px; border-radius: 5px; }
.btn-block { width: 100%; }
.btn[disabled] { opacity: .45; pointer-events: none; }
.btn-icon { width: 36px; padding: 0; }
.btn-icon.btn-sm { width: 29px; }

.chip {
  display: inline-flex; align-items: center; gap: 6px;
  height: 22px; padding: 0 9px; border-radius: 30px;
  background: var(--panel-3); border: 1px solid var(--line);
  font-size: 11px; font-weight: 600; color: var(--muted);
  white-space: nowrap;
}
.chip .dot { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.chip-live { color: #ff6b5a; border-color: rgba(255, 107, 90, .35); background: rgba(255, 107, 90, .1); }
.chip-live .dot { animation: pulse 1.6s infinite; }
.chip-open { color: var(--radiant); border-color: rgba(85, 176, 107, .3); background: rgba(85, 176, 107, .1); }
.chip-soon { color: var(--blue); border-color: rgba(75, 143, 214, .3); background: rgba(75, 143, 214, .1); }
.chip-done { color: var(--dim); }
.chip-gold { color: var(--gold); border-color: rgba(232, 163, 61, .3); background: rgba(232, 163, 61, .08); }

@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: .25; } }

.role {
  width: 22px; height: 22px; border-radius: 5px;
  display: inline-grid; place-items: center;
  font-size: 11px; font-weight: 800; font-variant-numeric: tabular-nums;
  background: var(--panel-3); border: 1px solid var(--line); color: var(--muted);
  flex: none;
}
.role-1 { color: var(--r1); border-color: rgba(224, 92, 92, .35); background: rgba(224, 92, 92, .1); }
.role-2 { color: var(--r2); border-color: rgba(224, 164, 92, .35); background: rgba(224, 164, 92, .1); }
.role-3 { color: var(--r3); border-color: rgba(110, 192, 110, .35); background: rgba(110, 192, 110, .1); }
.role-4 { color: var(--r4); border-color: rgba(92, 157, 224, .35); background: rgba(92, 157, 224, .1); }
.role-5 { color: var(--r5); border-color: rgba(176, 126, 224, .35); background: rgba(176, 126, 224, .1); }
.role-group { display: inline-flex; gap: 3px; }
.role.ghost { opacity: .3; }

.mmr { font-variant-numeric: tabular-nums; font-weight: 700; color: var(--gold); }
.mmr-sm { font-size: 12px; }
.muted { color: var(--muted); }
.dim { color: var(--dim); }
.tnum { font-variant-numeric: tabular-nums; }

.hero {
  position: relative; overflow: hidden;
  border: 1px solid var(--line); border-radius: 14px;
  background:
    linear-gradient(100deg, rgba(10, 12, 16, .97) 30%, rgba(10, 12, 16, .55) 62%, rgba(10, 12, 16, .2)),
    radial-gradient(700px 400px at 78% 40%, rgba(209, 69, 42, .5), transparent 65%),
    radial-gradient(600px 400px at 95% 90%, rgba(139, 110, 222, .28), transparent 60%),
    var(--panel);
  padding: 34px 36px;
  margin-bottom: 22px;
}
.hero::after {
  content: ''; position: absolute; inset: 0;
  background-image: repeating-linear-gradient(115deg, rgba(255, 255, 255, .022) 0 2px, transparent 2px 9px);
  pointer-events: none;
}
.hero-inner { position: relative; z-index: 1; max-width: 660px; }
.hero h1 { font-size: 33px; line-height: 1.12; margin: 12px 0 10px; letter-spacing: -.02em; }
.hero p { color: #aab3c4; margin: 0 0 20px; max-width: 520px; }
.hero-meta { display: flex; gap: 26px; flex-wrap: wrap; margin: 0 0 22px; }
.hero h1 + .hero-meta { margin-top: 18px; }
.hero-meta div span { display: block; font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--dim); font-weight: 700; margin-bottom: 3px; }
.hero-meta div b { font-size: 16px; font-weight: 700; }
.hero-actions { display: flex; gap: 10px; flex-wrap: wrap; }

.stat-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 22px; }
.stat {
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 15px 16px; backdrop-filter: blur(8px);
}
.stat span { font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--dim); font-weight: 700; }
.stat b { display: block; font-size: 24px; margin-top: 5px; font-variant-numeric: tabular-nums; letter-spacing: -.02em; }

.section-title { display: flex; align-items: center; gap: 12px; margin: 30px 0 14px; }
.section-title h2 { font-size: 16px; }
.section-title .spacer { flex: 1; }
.section-title a { font-size: 12.5px; color: var(--muted); }
.section-title a:hover { color: var(--text); }

.t-card {
  position: relative;
  display: block; background: var(--panel); border: 1px solid var(--line);
  border-radius: var(--radius); overflow: hidden;
  transition: transform .35s cubic-bezier(.2, .8, .2, 1), border-color .25s, box-shadow .35s;
}
.t-card:hover {
  border-color: rgba(255, 92, 58, .38); transform: translateY(-4px);
  box-shadow: 0 24px 46px -24px rgba(255, 92, 58, .5), 0 0 0 1px rgba(255, 92, 58, .06);
}
.t-card-banner {
  height: 92px; position: relative; overflow: hidden;
  background: linear-gradient(135deg, #2a1b2e, #16202e);
  display: flex; align-items: flex-start; justify-content: space-between; padding: 11px;
}
.t-card-banner::after {
  content: ''; position: absolute; inset: 0;
  background-image: repeating-linear-gradient(125deg, rgba(255, 255, 255, .03) 0 1px, transparent 1px 7px);
}
.t-card-banner.v2 { background: linear-gradient(135deg, #2e2418, #16202e); }
.t-card-banner.v3 { background: linear-gradient(135deg, #17292c, #141b2a); }
.t-card-banner.v4 { background: linear-gradient(135deg, #251a2d, #101823); }
.t-card-body { padding: 13px 15px 15px; }
.t-card-body h3 { font-size: 14.5px; margin-bottom: 4px; }
.t-card-body .t-sub { font-size: 12px; color: var(--muted); }
.t-card-foot {
  display: flex; align-items: center; gap: 14px;
  margin-top: 13px; padding-top: 12px; border-top: 1px solid var(--line-soft);
  font-size: 12px; color: var(--muted);
}
.t-card-foot b { color: var(--text); font-variant-numeric: tabular-nums; }

.progress { height: 5px; border-radius: 4px; background: var(--panel-3); overflow: hidden; margin-top: 11px; }
.progress i { display: block; height: 100%; background: linear-gradient(90deg, var(--accent), var(--gold)); border-radius: 4px; }
.progress.thin { height: 3px; }

.tabs {
  position: relative;
  display: flex; gap: 3px; box-shadow: inset 0 -1px 0 var(--line);
  margin-bottom: 20px; overflow-x: auto; overflow-y: hidden;
}
.tabs button {
  position: relative;
  background: none; border: 0; border-bottom: 2px solid transparent;
  padding: 11px 16px;
  color: var(--muted); cursor: pointer;
  font-size: 11.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  white-space: nowrap; transition: .15s;
}
.tabs button:hover { color: var(--text); }
.tabs button.is-active { color: var(--text); border-bottom-color: var(--accent-hot); }
.count {
  display: inline-grid; place-items: center;
  min-width: 18px; height: 18px; padding: 0 5px; margin-left: 6px;
  border-radius: 20px; background: var(--panel-3); border: 1px solid var(--line);
  font-size: 10.5px; font-weight: 700; line-height: 1; color: var(--muted);
  font-variant-numeric: tabular-nums;
}
.count[hidden] { display: none; }
.seg button.is-active .count { background: var(--accent); border-color: transparent; color: #fff; }
.tabs button .count { color: var(--dim); }
.tab-panel { display: none; }
.tab-panel.is-active { display: block; animation: fade .2s ease; }

@keyframes fade { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

.seg {
  display: inline-flex; padding: 3px; gap: 2px;
  background: var(--panel); border: 1px solid var(--line); border-radius: 8px;
}
.seg button {
  background: none; border: 0; border-radius: 5px; padding: 6px 13px;
  color: var(--muted); font-size: 12.5px; font-weight: 600; cursor: pointer; transition: .15s;
}
.seg button:hover { color: var(--text); }
.seg button.is-active { background: var(--panel-3); color: var(--text); }

.table { width: 100%; border-collapse: collapse; }
.table th {
  text-align: left; padding: 10px 14px;
  font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase;
  color: var(--dim); font-weight: 700;
  border-bottom: 1px solid var(--line);
  background: var(--panel-2);
  position: sticky; top: 0; z-index: 2;
}
.table td { padding: 10px 14px; border-bottom: 1px solid var(--line-soft); font-size: 13px; vertical-align: middle; }
.table tbody tr:hover td { background: rgba(255, 255, 255, .018); }
.table tbody tr:last-child td { border-bottom: 0; }
.table .num { text-align: right; font-variant-numeric: tabular-nums; }
.table .idx { color: var(--dim); font-variant-numeric: tabular-nums; width: 38px; }

.p-cell { display: flex; align-items: center; gap: 10px; }
.p-cell b { font-weight: 600; font-size: 13px; }
.p-cell small { display: block; color: var(--dim); font-size: 11px; }

.scroll-y { max-height: 520px; overflow-y: auto; }

.balance-bar { display: flex; align-items: center; gap: 12px; }
.balance-track { flex: 1; height: 8px; background: var(--panel-3); border-radius: 5px; position: relative; overflow: hidden; }
.balance-track i { position: absolute; top: 0; bottom: 0; background: linear-gradient(90deg, var(--radiant), var(--gold)); border-radius: 5px; }
.balance-track .mark { position: absolute; top: -3px; bottom: -3px; width: 2px; background: rgba(255, 255, 255, .25); }

.mix-team {
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden;
}
.mix-team-head {
  display: flex; align-items: center; gap: 11px; padding: 12px 14px;
  border-bottom: 1px solid var(--line-soft);
  background: linear-gradient(180deg, rgba(255, 255, 255, .022), transparent);
}
.mix-team-head .tno {
  width: 28px; height: 28px; border-radius: 7px; display: grid; place-items: center;
  background: var(--panel-3); border: 1px solid var(--line);
  font-size: 12px; font-weight: 800; color: var(--muted);
}
.mix-team-head h4 { font-size: 13.5px; }
.mix-team-head small { display: block; color: var(--dim); font-size: 11px; }
.mix-team-head .spacer { flex: 1; }
.mix-row {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 14px; border-bottom: 1px solid var(--line-soft);
}
.mix-row:last-child { border-bottom: 0; }
.mix-row b { font-size: 12.5px; font-weight: 600; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mix-row[draggable] { cursor: grab; }
.mix-row[draggable]:active { cursor: grabbing; }
.mix-row.dragging { opacity: .4; }
.mix-row.drop-ok {
  background: rgba(85, 176, 107, .14);
  box-shadow: inset 2px 0 0 var(--radiant);
}
.mix-row [data-make-captain] {
  padding: 0 6px; min-width: 0; line-height: 18px;
  opacity: 0; transition: opacity .12s;
}
.mix-row:hover [data-make-captain] { opacity: .75; }
.mix-row [data-make-captain]:hover { opacity: 1; color: var(--gold); }
.mix-team.drop-ok { border-color: var(--radiant); box-shadow: 0 0 0 3px rgba(85, 176, 107, .14); }
.mix-team.drop-no { border-color: var(--dire); box-shadow: 0 0 0 3px rgba(199, 66, 54, .14); }

.pool-box { min-height: 90px; }
[data-mix-note].warn { color: var(--gold); }
.pool-box.drop-ok { border-color: var(--radiant); box-shadow: 0 0 0 3px rgba(85, 176, 107, .14); }
.pool-chip {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 6px 11px; margin: 0 6px 6px 0;
  background: var(--panel-2); border: 1px solid var(--line); border-radius: 30px;
  font-size: 12.5px; cursor: grab;
}
.pool-chip:active { cursor: grabbing; }
.ulink { color: inherit; text-decoration: none; border-bottom: 1px dotted transparent; transition: .15s; }
.ulink:hover { color: var(--accent-hot); border-bottom-color: currentColor; }
.mix-row .chip-alert { height: 19px; padding: 0 7px; font-size: 10px; }

.check-list { margin-top: 12px; display: flex; flex-direction: column; gap: 7px; }
.check-row {
  padding: 8px 10px 8px 12px; border-radius: 7px;
  background: var(--panel-2); border-left: 3px solid var(--line);
}
.check-row b { display: block; font-size: 12.5px; font-weight: 600; }
.check-row small { display: block; margin-top: 3px; font-size: 11.5px; color: var(--dim); word-break: break-word; }
.check-row.check-ok { border-left-color: var(--radiant); }
.check-row.check-warn { border-left-color: var(--gold); }
.check-row.check-warn b { color: #e8c88a; }
.check-row.check-bad { border-left-color: var(--dire); background: rgba(199, 66, 54, .1); }
.check-row.check-bad b { color: #f08a7e; }

.check-accs { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.check-acc {
  display: flex; flex-direction: column; gap: 1px;
  padding: 6px 10px; border-radius: 7px;
  background: var(--panel-2); border: 1px solid var(--line); color: inherit;
}
.check-acc:hover { border-color: #3a475a; }
.check-acc b { font-size: 12px; font-weight: 600; }
.check-acc small { font-size: 10.5px; color: var(--gold); }

.hero-row { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; justify-content: flex-end; }
.side-head + .side-body .hero-row, [data-user-head] .hero-row { justify-content: flex-start; }
.hero-chip {
  display: inline-flex; align-items: center; gap: 6px;
  height: 24px; padding: 0 10px; border-radius: 20px;
  background: rgba(139, 110, 222, .12); border: 1px solid rgba(139, 110, 222, .35);
  color: #c7b6f5; font-size: 12px; font-weight: 600; white-space: nowrap;
}
.hero-chip button {
  border: 0; background: none; color: inherit; cursor: pointer;
  padding: 0; font-size: 14px; line-height: 1; opacity: .7;
}
.hero-chip button:hover { opacity: 1; }
.hero-picker { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; min-height: 40px; padding: 6px 10px; cursor: text; }
.hero-picker-chips { display: contents; }
.hero-picker-field { flex: 1 1 120px; min-width: 120px; background: none; border: 0; outline: 0; padding: 3px 0; }
.hero-picker-field::placeholder { color: var(--dim); }
.hero-picker-field:disabled { display: none; }

.hold-box {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  padding: 11px 12px; border-radius: 8px;
  background: var(--panel-2); border: 1px solid var(--line);
}
.hold-box .grow { flex: 1 1 160px; min-width: 0; }
.hold-box b { display: block; font-size: 12.5px; font-weight: 650; }
.hold-box small { display: block; font-size: 11.5px; color: var(--dim); margin-top: 2px; }
.hold-box.on { background: rgba(199, 66, 54, .09); border-color: rgba(199, 66, 54, .4); }
.hold-box.on b { color: #f08a7e; }

.mix-row.is-picked, .pool-chip.is-picked {
  background: rgba(255, 92, 58, .12);
  box-shadow: inset 0 0 0 2px var(--accent-hot);
}
.pool-chip.dragging { opacity: .4; }

.mix-team-foot {
  display: flex; align-items: center; gap: 10px; padding: 10px 14px;
  border-top: 1px solid var(--line); background: var(--panel-2); font-size: 12px;
}

.delta-ok { color: var(--radiant); }
.delta-warn { color: var(--gold); }
.delta-bad { color: var(--dire); }

.bracket-wrap { position: relative; overflow-x: auto; padding: 14px 2px 20px; }
.bracket { display: flex; gap: 54px; position: relative; min-width: max-content; align-items: stretch; min-height: 320px; }
.bracket svg.links { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 0; }
.br-col { display: flex; flex-direction: column; min-width: 238px; position: relative; z-index: 1; }
.br-round { flex: 1; display: flex; flex-direction: column; justify-content: space-around; gap: 24px; }
.br-round-title {
  font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase;
  color: var(--dim); font-weight: 700; margin-bottom: 14px; text-align: center;
}
.br-match {
  background: var(--panel); border: 1px solid var(--line); border-radius: 7px;
  position: relative; transition: .15s; cursor: pointer;
}
.br-match:hover { border-color: #3b4757; }
.br-match.is-live { border-color: rgba(255, 107, 90, .5); box-shadow: 0 0 0 3px rgba(255, 107, 90, .07); }
.br-slot {
  display: flex; align-items: center; gap: 9px; padding: 7px 10px;
  font-size: 12.5px; border-bottom: 1px solid var(--line-soft);
}
.br-slot:last-child { border-bottom: 0; }
.br-slot b { flex: 1; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.br-slot .sc { font-variant-numeric: tabular-nums; font-weight: 700; color: var(--muted); width: 16px; text-align: center; }
.br-slot.win b { color: var(--text); }
.br-slot.win .sc { color: var(--radiant); }
.br-slot.lose b, .br-slot.lose .sc { color: var(--dim); }
.br-slot.tbd b { color: var(--dim); font-style: italic; }
.br-slot .seed { font-size: 10px; color: var(--dim); width: 14px; font-variant-numeric: tabular-nums; }
.br-match-tag {
  position: absolute; top: -9px; left: 10px;
  font-size: 9.5px; letter-spacing: .1em; text-transform: uppercase; font-weight: 700;
  background: var(--panel-3); border: 1px solid var(--line); color: var(--dim);
  padding: 1px 7px; border-radius: 20px;
}

.match-row {
  display: flex; align-items: center; gap: 14px;
  padding: 13px 16px; border-bottom: 1px solid var(--line-soft);
  transition: .15s;
}
.match-row:last-child { border-bottom: 0; }
.match-row:hover { background: rgba(255, 255, 255, .015); }
.match-time { width: 62px; font-size: 12px; color: var(--muted); font-variant-numeric: tabular-nums; flex: none; }
.match-time b { display: block; color: var(--text); font-size: 13px; }
.match-teams { flex: 1; display: flex; align-items: center; gap: 12px; min-width: 0; }
.match-side { flex: 1; display: flex; align-items: center; gap: 9px; min-width: 0; }
.match-side.right { flex-direction: row-reverse; text-align: right; }
.match-side b { font-size: 13px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.match-score {
  font-variant-numeric: tabular-nums; font-weight: 800; font-size: 15px;
  padding: 3px 12px; background: var(--panel-2); border: 1px solid var(--line);
  border-radius: 6px; flex: none; letter-spacing: .04em;
}
.match-actions { display: flex; gap: 7px; flex: none; }

.stream-grid {
  display: grid; gap: 12px;
  grid-template-columns: min(100%, 780px, calc(52vh * 16 / 9));
  justify-content: center;
}
.player {
  position: relative; border-radius: var(--radius); overflow: hidden;
  border: 1px solid var(--line);
  background:
    radial-gradient(500px 260px at 50% 40%, rgba(75, 143, 214, .12), transparent 70%),
    linear-gradient(160deg, #141b26, #0c1017);
  aspect-ratio: 16 / 9;
  display: grid; place-items: center;
}
.player::after {
  content: ''; position: absolute; inset: 0;
  background-image: repeating-linear-gradient(0deg, rgba(255, 255, 255, .02) 0 1px, transparent 1px 4px);
  pointer-events: none;
}
.player-center { text-align: center; z-index: 1; }
.player-play {
  width: 54px; height: 54px; border-radius: 50%; margin: 0 auto 12px;
  background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .14);
  display: grid; place-items: center; backdrop-filter: blur(4px);
}
.player-play svg { width: 20px; height: 20px; margin-left: 3px; }
.player-center b { display: block; font-size: 13px; }
.player-center small { color: var(--dim); font-size: 11.5px; }
.player-bar {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 2;
  display: flex; align-items: center; gap: 10px;
  padding: 9px 12px;
  background: linear-gradient(0deg, rgba(8, 10, 14, .92), transparent);
  font-size: 12px;
}
.player-bar .spacer { flex: 1; }
.player-top { position: absolute; top: 10px; left: 12px; right: 12px; z-index: 2; display: flex; gap: 8px; }

.chat {
  width: var(--chat-w); flex: none;
  border-left: 1px solid var(--line);
  background: var(--panel);
  display: flex; flex-direction: column;
  height: calc(100vh - var(--header-h));
  position: sticky; top: var(--header-h);
}
.chat-tabs { display: flex; padding: 8px 8px 0; gap: 2px; border-bottom: 1px solid var(--line); }
.chat-tabs button {
  flex: 1; background: none; border: 0; border-bottom: 2px solid transparent;
  padding: 8px 4px; margin-bottom: -1px;
  color: var(--muted); font-size: 12px; font-weight: 600; cursor: pointer; transition: .15s;
}
.chat-tabs button:hover { color: var(--text); }
.chat-tabs button.is-active { color: var(--text); border-bottom-color: var(--accent-hot); }
.chat-body { flex: 1; overflow-y: auto; padding: 12px 14px; display: flex; flex-direction: column; gap: 13px; }
.msg { display: flex; gap: 9px; }
.msg-content { min-width: 0; flex: 1; }
.msg-head { display: flex; align-items: baseline; gap: 7px; margin-bottom: 1px; }
.msg-head b { font-size: 12.5px; font-weight: 650; }
.msg-head time { font-size: 10.5px; color: var(--dim); font-variant-numeric: tabular-nums; }
.msg-text { font-size: 12.5px; color: #c4ccda; word-wrap: break-word; }
.msg-tag {
  font-size: 9px; letter-spacing: .08em; text-transform: uppercase; font-weight: 800;
  padding: 1px 5px; border-radius: 4px; background: var(--panel-3); color: var(--muted);
}
.msg-tag.cap { color: var(--gold); background: rgba(232, 163, 61, .12); }
.msg-tag.adm { color: var(--accent-hot); background: rgba(255, 92, 58, .12); }
.msg-tag.bot { color: var(--blue); background: rgba(75, 143, 214, .12); }
.msg.sys { padding: 7px 10px; background: var(--panel-2); border-left: 2px solid var(--blue); border-radius: 0 6px 6px 0; }
.msg.sys .msg-text { color: var(--muted); font-size: 12px; }
.chat-input { padding: 10px 12px; border-top: 1px solid var(--line); }
.chat-input .field { display: flex; align-items: flex-end; gap: 8px; background: var(--panel-2); border: 1px solid var(--line); border-radius: 8px; padding: 7px 9px; }
.chat-input textarea {
  flex: 1; background: none; border: 0; outline: 0; resize: none;
  font-size: 12.5px; max-height: 90px; min-height: 20px; line-height: 1.45;
}
.chat-input textarea::placeholder { color: var(--dim); }
.chat-meta { display: flex; align-items: center; gap: 8px; margin-top: 7px; font-size: 11px; color: var(--dim); }
.chat-meta .spacer { flex: 1; }

.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.field-group { display: flex; flex-direction: column; gap: 6px; }
.field-group.full { grid-column: 1 / -1; }
.field-group label { font-size: 11.5px; font-weight: 650; color: var(--muted); display: flex; align-items: center; gap: 6px; }
.field-group label .req { color: var(--accent-hot); }
.hint { font-size: 11.5px; line-height: 1.45; color: var(--dim); }
.field-group .hint { font-size: 11px; color: var(--dim); }
.input, .select, .textarea {
  background: var(--panel-2); border: 1px solid var(--line); border-radius: var(--radius-sm);
  padding: 9px 12px; outline: 0; transition: .15s; width: 100%; font-size: 13px;
}
.input:focus, .select:focus, .textarea:focus { border-color: #3e5570; background: #181f2a; }
.input::placeholder, .textarea::placeholder { color: var(--dim); }
.input[type="datetime-local"], .input[type="date"] { color-scheme: dark; cursor: pointer; }
.textarea { resize: vertical; min-height: 84px; }
.select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--dim) 50%), linear-gradient(135deg, var(--dim) 50%, transparent 50%); background-position: calc(100% - 17px) 17px, calc(100% - 12px) 17px; background-size: 5px 5px, 5px 5px; background-repeat: no-repeat; padding-right: 32px; }
.input-icon { position: relative; }
.input-icon .input { padding-left: 34px; }
.input-icon svg { position: absolute; left: 11px; top: 50%; transform: translateY(-50%); width: 15px; height: 15px; color: var(--dim); }

.role-picker { display: flex; gap: 8px; flex-wrap: wrap; }
.role-pick {
  display: flex; align-items: center; gap: 8px; cursor: pointer;
  background: var(--panel-2); border: 1px solid var(--line); border-radius: 8px;
  padding: 9px 13px 9px 10px; transition: .15s; user-select: none;
}
.role-pick:hover { border-color: #38455a; }
.role-pick.on { border-color: var(--accent); background: rgba(209, 69, 42, .08); }
.role-pick span { font-size: 12px; font-weight: 600; }
.role-pick small { display: block; font-size: 10.5px; color: var(--dim); font-weight: 500; }

.switch-row {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 14px; background: var(--panel-2);
  border: 1px solid var(--line); border-radius: 8px;
}
.switch-row .txt { flex: 1; }
.switch-row b { font-size: 12.5px; font-weight: 600; display: block; }
.switch-row small { font-size: 11.5px; color: var(--dim); }
.switch {
  width: 38px; height: 21px; border-radius: 20px; background: var(--panel-3);
  border: 1px solid var(--line); position: relative; cursor: pointer; flex: none; transition: .18s;
}
.switch::after {
  content: ''; position: absolute; top: 2px; left: 2px;
  width: 15px; height: 15px; border-radius: 50%; background: var(--dim); transition: .18s;
}
.switch.on { background: rgba(209, 69, 42, .3); border-color: var(--accent); }
.switch.on::after { left: 19px; background: var(--accent-hot); }

.check { display: flex; align-items: flex-start; gap: 10px; cursor: pointer; user-select: none; }
.check .box {
  width: 17px; height: 17px; border-radius: 4px; flex: none; margin-top: 1px;
  border: 1px solid var(--line); background: var(--panel-2);
  display: grid; place-items: center; transition: .15s;
}
.check .box svg { width: 11px; height: 11px; opacity: 0; color: #fff; }
.check.on .box { background: var(--accent); border-color: var(--accent); }
.check.on .box svg { opacity: 1; }
.check span { font-size: 12.5px; color: var(--muted); }

.roster-slot {
  display: flex; align-items: center; gap: 11px;
  padding: 10px 12px; background: var(--panel-2);
  border: 1px solid var(--line); border-radius: 8px;
}
.roster-slot .input { background: var(--panel); }
.roster-slot .grow { flex: 1; min-width: 0; }
.roster-slot.empty { border-style: dashed; justify-content: center; color: var(--dim); font-size: 12.5px; cursor: pointer; }
.roster-slot.empty:hover { border-color: #3a475a; color: var(--muted); }

.role-select { width: 138px; flex: none; font-weight: 600; background: var(--panel); }
.role-select.r1 { color: var(--r1); }
.role-select.r2 { color: var(--r2); }
.role-select.r3 { color: var(--r3); }
.role-select.r4 { color: var(--r4); }
.role-select.r5 { color: var(--r5); }
.role-select option { color: var(--text); }

.steps { display: flex; gap: 0; margin-bottom: 24px; }
.step { flex: 1; display: flex; align-items: center; gap: 10px; position: relative; padding-right: 10px; }
.step::after { content: ''; flex: 1; height: 1px; background: var(--line); }
.step:last-child::after { display: none; }
.step .num {
  width: 26px; height: 26px; border-radius: 50%; flex: none;
  display: grid; place-items: center; font-size: 12px; font-weight: 700;
  background: var(--panel-2); border: 1px solid var(--line); color: var(--dim);
}
.step b { font-size: 12.5px; color: var(--dim); font-weight: 600; white-space: nowrap; }
.step.on .num { background: var(--accent); border-color: var(--accent); color: #fff; }
.step.on b { color: var(--text); }
.step.done .num { background: rgba(85, 176, 107, .14); border-color: rgba(85, 176, 107, .4); color: var(--radiant); }
.step.done b { color: var(--muted); }

.forum-row {
  display: flex; align-items: center; gap: 14px;
  padding: 14px 16px; border-bottom: 1px solid var(--line-soft); transition: .15s;
}
.forum-row:last-child { border-bottom: 0; }
.forum-row:hover { background: rgba(255, 255, 255, .015); }
.forum-icon {
  width: 38px; height: 38px; border-radius: 9px; flex: none;
  display: grid; place-items: center; background: var(--panel-3); border: 1px solid var(--line);
}
.forum-icon svg { width: 17px; height: 17px; color: var(--muted); }
.forum-main { flex: 1; min-width: 0; }
.forum-main b { font-size: 13.5px; font-weight: 600; display: block; }
.forum-main small { font-size: 11.5px; color: var(--dim); }
.forum-num { text-align: center; width: 62px; flex: none; }
.forum-num b { display: block; font-size: 14px; font-variant-numeric: tabular-nums; }
.forum-num small { font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--dim); }

.admin-nav { display: flex; flex-direction: column; gap: 2px; }
.admin-nav button {
  display: flex; align-items: center; gap: 10px; width: 100%;
  padding: 9px 12px; border: 0; background: none; text-align: left; cursor: pointer;
  border-radius: var(--radius-sm); color: var(--muted); font-size: 13px; font-weight: 500; transition: .15s;
}
.admin-nav button:hover { background: var(--panel-2); color: var(--text); }
.admin-nav button.is-active { background: var(--panel-3); color: var(--text); }
.admin-nav button svg { width: 15px; height: 15px; flex: none; }
.admin-nav button .badge {
  margin-left: auto; font-size: 10.5px; font-weight: 700;
  background: var(--accent); color: #fff; padding: 1px 7px; border-radius: 20px;
}

.entry-row {
  display: flex; align-items: center; gap: 11px;
  padding: 11px 15px; border-bottom: 1px solid var(--line-soft);
  cursor: pointer; transition: .15s;
}
.entry-row:last-child { border-bottom: 0; }
.entry-row:hover { background: rgba(255, 255, 255, .02); }
.entry-row.is-active { background: rgba(255, 255, 255, .04); box-shadow: inset 2px 0 0 var(--accent-hot); }
.entry-main { flex: 1; min-width: 0; }
.entry-main b { display: block; font-size: 13px; font-weight: 600; }
.entry-main small { font-size: 11px; color: var(--dim); }

.chip-alert { color: var(--dire); border-color: rgba(199, 66, 54, .35); background: rgba(199, 66, 54, .1); }

.flag {
  padding: 9px 11px; border-radius: 7px; font-size: 12px; line-height: 1.45;
  background: rgba(199, 66, 54, .08); border: 1px solid rgba(199, 66, 54, .25); color: #e0a8a0;
}
.flag + .flag { margin-top: 8px; }
.flag.warn { background: rgba(232, 163, 61, .08); border-color: rgba(232, 163, 61, .25); color: #ddbe8a; }
.flag.ok { background: rgba(85, 176, 107, .08); border-color: rgba(85, 176, 107, .25); color: #a3d3b0; }

.shot-box {
  display: flex; align-items: center; gap: 10px; justify-content: space-between;
  height: 96px; padding: 0 16px; border-radius: 8px;
  background: repeating-linear-gradient(120deg, rgba(255, 255, 255, .02) 0 12px, transparent 12px 24px), var(--panel-2);
  border: 1px solid var(--line);
}
.shot-box span { font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--dim); font-weight: 700; }
.shot-box b { font-size: 20px; }

.queue-item {
  display: flex; align-items: center; gap: 13px;
  padding: 13px 16px; border-bottom: 1px solid var(--line-soft);
}
.queue-item:last-child { border-bottom: 0; }
.queue-main { flex: 1; min-width: 0; }
.queue-main b { font-size: 13px; font-weight: 600; }
.queue-main small { display: block; color: var(--dim); font-size: 11.5px; margin-top: 2px; }

.log { font-family: var(--mono); font-size: 11.5px; line-height: 1.75; color: var(--muted); }
.log div { display: flex; gap: 10px; }
.log time { color: var(--dim); flex: none; }
.log .ok { color: var(--radiant); }
.log .warn { color: var(--gold); }
.log .err { color: var(--dire); }

.bar-chart { display: flex; align-items: flex-end; gap: 6px; height: 108px; }
.bar-chart div { flex: 1; background: linear-gradient(180deg, var(--accent), rgba(209, 69, 42, .2)); border-radius: 3px 3px 0 0; position: relative; }
.bar-chart div span {
  position: absolute; bottom: -19px; left: 0; right: 0; text-align: center;
  font-size: 10px; color: var(--dim);
}

.form-line { display: flex; gap: 12px; font-size: 15px; font-weight: 800; }
.form-line .w { color: var(--radiant); }
.form-line .l { color: var(--dire); }

.legend { display: flex; gap: 16px; flex-wrap: wrap; font-size: 11.5px; color: var(--muted); }
.legend i { width: 9px; height: 9px; border-radius: 3px; display: inline-block; margin-right: 6px; }

.modal-back {
  position: fixed; inset: 0; z-index: 200;
  background: rgba(5, 7, 10, .72); backdrop-filter: blur(3px);
  display: none; align-items: center; justify-content: center; padding: 24px;
}
.modal-back.on { display: flex; animation: fade .16s ease; }
.modal {
  width: 100%; max-width: 480px;
  background: var(--panel); border: 1px solid var(--line);
  border-radius: 12px; box-shadow: 0 40px 80px -30px #000;
  overflow: hidden;
}
.modal-head { display: flex; align-items: center; gap: 12px; padding: 16px 18px; border-bottom: 1px solid var(--line-soft); }
.modal-head h3 { font-size: 15px; }
.modal-head .spacer { flex: 1; }
.modal-body { padding: 18px; }
.modal-foot { padding: 14px 18px; border-top: 1px solid var(--line-soft); display: flex; gap: 10px; justify-content: flex-end; background: var(--panel-2); }
.x-btn { background: none; border: 0; color: var(--dim); cursor: pointer; padding: 4px; display: grid; place-items: center; border-radius: 5px; }
.x-btn:hover { color: var(--text); background: var(--panel-3); }
.x-btn svg { width: 16px; height: 16px; }

.side-card { background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius); backdrop-filter: blur(8px); }
.side-card + .side-card { margin-top: 16px; }
.side-head {
  padding: 11px 15px; border-bottom: 1px solid var(--line-soft);
  display: flex; align-items: center; gap: 10px;
  background: linear-gradient(180deg, rgba(255, 255, 255, .03), transparent);
}
.side-head h4 {
  font-size: 10.5px; font-weight: 800;
  letter-spacing: .14em; text-transform: uppercase; color: var(--muted);
}
.side-head h4.plain {
  font-size: 14px; font-weight: 700;
  letter-spacing: -.01em; text-transform: none; color: var(--text);
}
.side-head .spacer { flex: 1; }
.side-body { padding: 13px 15px; }
.side-body.flush { padding: 0; }

.kv { display: flex; justify-content: space-between; gap: 12px; padding: 7px 0; font-size: 12.5px; border-bottom: 1px solid var(--line-soft); }
.kv:last-child { border-bottom: 0; }
.kv span { color: var(--muted); }
.kv b { font-weight: 600; text-align: right; }

.rank-row { display: flex; align-items: center; gap: 11px; padding: 9px 15px; border-bottom: 1px solid var(--line-soft); }
.rank-row[data-stream] { cursor: pointer; transition: .15s; }
.rank-row[data-stream]:hover { background: rgba(255, 255, 255, .02); }
.rank-row[data-stream].is-active { background: rgba(255, 255, 255, .035); box-shadow: inset 2px 0 0 var(--accent-hot); }
.rank-row:last-child { border-bottom: 0; }
.rank-row .pos { width: 18px; font-size: 12px; font-weight: 700; color: var(--dim); font-variant-numeric: tabular-nums; }
.rank-row .pos.top { color: var(--gold); }
.rank-row .grow { flex: 1; min-width: 0; }
.rank-row b { font-size: 12.5px; font-weight: 600; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rank-row small { font-size: 11px; color: var(--dim); }

.empty-state { padding: 46px 20px; text-align: center; }
.empty-state svg { width: 34px; height: 34px; color: var(--dim); margin-bottom: 12px; }
.empty-state b { display: block; font-size: 13.5px; margin-bottom: 4px; }
.empty-state p { margin: 0 auto; color: var(--dim); font-size: 12.5px; max-width: 330px; }

.footer {
  border-top: 1px solid var(--line); margin-top: 40px;
  padding: 26px 22px; color: var(--dim); font-size: 12px;
}
.footer-inner { max-width: 1320px; margin: 0 auto; display: flex; gap: 22px; align-items: center; flex-wrap: wrap; }
.footer-inner .spacer { flex: 1; }
.footer a { color: var(--muted); }
.footer a:hover { color: var(--text); }
.footer .author a { color: var(--gold); font-weight: 600; }
.footer .author a:hover { color: var(--accent-hot); }

.client-body { overflow: hidden; }

.client { position: relative; height: 100vh; overflow: hidden; }
.client-bg {
  position: absolute; inset: 0;
  background:
    radial-gradient(900px 700px at 62% 58%, rgba(120, 150, 110, .22), transparent 62%),
    radial-gradient(700px 500px at 30% 20%, rgba(70, 95, 120, .16), transparent 70%),
    linear-gradient(180deg, #0f1620 0%, #0a0f15 45%, #070a0e 100%);
}
.client-bg::before {
  content: ''; position: absolute; inset: 0;
  background:
    radial-gradient(420px 620px at 63% 62%, rgba(150, 190, 130, .2), transparent 60%),
    conic-gradient(from 210deg at 63% 55%, rgba(90, 130, 90, .18), transparent 35%, rgba(60, 90, 70, .14) 70%, transparent);
  filter: blur(6px);
}
.client-bg::after {
  content: ''; position: absolute; inset: 0;
  background:
    linear-gradient(90deg, rgba(7, 10, 14, .96) 0 22%, transparent 46%),
    linear-gradient(270deg, rgba(7, 10, 14, .94) 0 18%, transparent 40%),
    linear-gradient(0deg, rgba(7, 10, 14, .98) 0 8%, transparent 34%);
}

.client-top {
  position: sticky; top: 0; z-index: 60;
  height: var(--header-h); display: flex; align-items: stretch;
  background: linear-gradient(180deg, #11161d, #0a0e13);
  border-bottom: 1px solid #000;
  box-shadow: 0 2px 14px rgba(0, 0, 0, .6);
}
.ct-icon {
  width: 56px; border: 0; background: none; cursor: pointer;
  display: grid; place-items: center; color: var(--dim);
}
.ct-icon:hover { color: var(--text); }
.ct-icon svg { width: 18px; height: 18px; }
.ct-icon { position: relative; }
.ct-icon .dot-badge {
  position: absolute; top: 15px; right: 14px;
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--accent-hot); border: 1px solid #0a0e13;
}

.client-logo {
  width: 92px; transform: skewX(-11deg);
  background: linear-gradient(180deg, #4a1f10, #1a0d07);
  border-left: 1px solid #63301a; border-right: 1px solid #63301a;
  display: grid; place-items: center;
  box-shadow: 0 0 26px -6px rgba(209, 69, 42, .55) inset;
}
.client-logo img {
  width: 42px; height: 42px; border-radius: 7px; object-fit: cover; transform: skewX(11deg);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .08), 0 4px 14px -4px rgba(0, 0, 0, .8);
}

.client-tabs { display: flex; align-items: stretch; margin-left: 10px; }
.client-tabs a {
  position: relative; display: grid; place-items: center;
  padding: 0 22px;
  font-size: 12.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: #7d8799; transition: .15s;
}
.client-tabs a::after {
  content: ''; position: absolute; right: 0; top: 16px; bottom: 16px;
  width: 1px; background: #1d2530; transform: skewX(-11deg);
}
.client-tabs a:last-child::after { display: none; }
.client-tabs a:hover { color: #cfd6e2; background-color: rgba(255, 255, 255, .03); }
.client-tabs a.is-active {
  color: #fff;
  background: linear-gradient(180deg, rgba(209, 69, 42, .28), rgba(209, 69, 42, .02));
  box-shadow: inset 0 -2px 0 var(--accent-hot);
}

.ct-right { margin-left: auto; display: flex; align-items: center; gap: 14px; padding: 0 16px; }
.ct-mmr { display: flex; align-items: center; gap: 8px; font-size: 12px; }
.ct-mmr b { font-size: 15px; font-weight: 800; color: var(--gold); font-variant-numeric: tabular-nums; }
.ct-mmr span { color: var(--dim); text-transform: uppercase; letter-spacing: .1em; font-size: 10px; font-weight: 700; }
.cpanel {
  background: rgba(11, 15, 21, .84);
  border: 1px solid #1f2733;
  backdrop-filter: blur(8px);
  box-shadow: 0 20px 44px -26px #000;
}
.cpanel + .cpanel { margin-top: 10px; }
.cp-head {
  display: flex; align-items: center; gap: 9px;
  padding: 8px 12px; border-bottom: 1px solid #1a222c;
  background: linear-gradient(180deg, rgba(255, 255, 255, .03), transparent);
  font-size: 10.5px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--dim);
}
.cp-head .spacer { flex: 1; }
.cp-body { padding: 11px 12px; }
.cp-body.flush { padding: 0; }

.client-left {
  position: absolute; left: 16px; top: 72px; width: 320px; z-index: 4;
  max-height: calc(100vh - 130px); overflow-y: auto;
}

.cp-me { display: flex; align-items: center; gap: 11px; padding: 11px 12px; }
.cp-me .avatar { border-radius: 4px; }
.cp-me .grow { flex: 1; min-width: 0; }
.cp-me b { font-size: 14px; font-weight: 700; display: block; }
.cp-me small { font-size: 11.5px; color: var(--muted); }
.cp-rank {
  width: 40px; height: 40px; border-radius: 50%;
  background: radial-gradient(circle at 50% 35%, #4a3a12, #16120a);
  border: 1px solid #6b5520; display: grid; place-items: center;
  font-size: 11px; font-weight: 800; color: var(--gold);
}

.cp-goal { padding: 10px 12px; border-top: 1px solid #1a222c; }
.cp-goal .eyebrow { font-size: 9.5px; }
.cp-goal b { display: block; font-size: 12.5px; margin: 3px 0 7px; }
.cp-goal .progress { margin: 0; }
.cp-goal .foot { display: flex; justify-content: space-between; margin-top: 6px; font-size: 11px; color: var(--dim); }

.cp-row {
  display: flex; align-items: center; gap: 9px;
  padding: 7px 12px; font-size: 12.5px;
  border-bottom: 1px solid rgba(26, 34, 44, .7);
}
.cp-row:last-child { border-bottom: 0; }
.cp-row .grow { flex: 1; min-width: 0; }
.cp-row b { font-size: 12.5px; font-weight: 600; display: block; }
.cp-row small { font-size: 11px; color: var(--dim); }
.cp-row:hover { background: rgba(255, 255, 255, .025); }
a.cp-row { color: inherit; text-decoration: none; }
.cp-go { color: var(--dim); font-size: 16px; line-height: 1; }
a.cp-row:hover .cp-go { color: var(--text); }
.cp-row.cp-act small { color: var(--gold); }
.cp-row.cp-act { background: rgba(232, 163, 61, .07); }

.client-center {
  position: absolute; left: 360px; top: 50%; transform: translateY(-50%);
  z-index: 3; width: 470px;
}
.client-center .eyebrow { font-size: 10px; }
.client-center h1 {
  font-size: 50px; line-height: 1; letter-spacing: -.02em;
  margin: 8px 0 12px; text-shadow: 0 6px 30px rgba(0, 0, 0, .9);
}
.cc-meta { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 22px; }

.cc-path { margin: 6px 0 20px; }
.cc-path .row {
  display: flex; align-items: center; gap: 12px;
  padding: 9px 0; border-bottom: 1px solid rgba(31, 39, 51, .8); font-size: 13px;
}
.cc-path .row:last-child { border-bottom: 0; }
.cc-path .m { width: 146px; flex: none; }
.cc-path .m b { font-weight: 600; }
.cc-path .sc {
  width: 44px; flex: none; text-align: center;
  font-variant-numeric: tabular-nums; font-weight: 800;
}
.cc-path .note { color: var(--dim); font-size: 12px; }

.cp-msg {
  padding: 8px 12px; font-size: 12px; line-height: 1.45;
  border-bottom: 1px solid rgba(26, 34, 44, .7);
}
.cp-msg:last-child { border-bottom: 0; }
.cp-msg b { font-weight: 650; margin-right: 6px; color: var(--muted); }
.cp-msg.bot b { color: var(--blue); }
.cp-msg.adm b { color: var(--accent-hot); }
.cp-msg span { color: #b4bdcc; }

.ct-author { color: var(--dim); font-size: 11.5px; }
.ct-author a { color: var(--gold); font-weight: 600; }
.ct-author a:hover { color: var(--accent-hot); }

.client-right {
  position: absolute; right: 16px; top: 72px; width: 300px; z-index: 4;
  max-height: calc(100vh - 204px); overflow-y: auto;
}
.cp-promo {
  position: relative; height: 128px; overflow: hidden;
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: 12px;
  background:
    linear-gradient(0deg, rgba(8, 11, 15, .95), rgba(8, 11, 15, .35)),
    radial-gradient(300px 160px at 70% 20%, rgba(209, 69, 42, .5), transparent 70%),
    linear-gradient(135deg, #2a1a22, #121a26);
}
.cp-promo b { font-size: 14px; }
.cp-promo small { font-size: 11.5px; color: #b9c2d0; }

.cp-live { position: relative; }
.cp-live .thumb {
  height: 108px; position: relative;
  background:
    radial-gradient(240px 120px at 50% 45%, rgba(75, 143, 214, .2), transparent 70%),
    linear-gradient(160deg, #141b26, #0b0f15);
  display: grid; place-items: center;
}
.cp-live .thumb .vs { display: flex; align-items: center; gap: 12px; font-weight: 800; font-size: 14px; }
.cp-live .meta { display: flex; align-items: center; gap: 8px; padding: 9px 12px; font-size: 11.5px; color: var(--muted); }
.cp-live .meta .spacer { flex: 1; }

.play-btn {
  position: absolute; right: 24px; bottom: 58px; z-index: 6;
  width: 300px; min-height: 58px; border: 0; cursor: pointer;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 10px 26px; text-align: center; text-decoration: none;
  clip-path: polygon(16px 0, 100% 0, 100% calc(100% - 16px), calc(100% - 16px) 100%, 0 100%, 0 16px);
  background: linear-gradient(180deg, var(--accent-hot), #8d2415);
  color: #fff; font-size: 16px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase;
  line-height: 1.25;
  box-shadow: 0 16px 40px -14px rgba(255, 92, 58, .7);
  transition: .15s;
}
.play-btn:hover { filter: brightness(1.1); }
.play-btn small {
  font-size: 10.5px; font-weight: 600; letter-spacing: .04em;
  text-transform: none; opacity: .85; margin-top: 3px;
}

.client-chat {
  position: absolute; left: 0; right: 0; bottom: 0; z-index: 6;
  height: 40px; display: flex; align-items: center; gap: 10px; padding: 0 18px;
  background: rgba(7, 10, 14, .92); border-top: 1px solid #1a222c;
  font-size: 12.5px;
}
.client-chat .who { color: var(--gold); font-weight: 600; }
.client-chat input { flex: 1; background: none; border: 0; outline: 0; color: var(--text); }
.client-chat input::placeholder { color: var(--dim); }
.client-chat .ic { width: 26px; height: 22px; border: 1px solid #222a36; border-radius: 4px; display: grid; place-items: center; color: var(--dim); font-size: 11px; }

@media (max-width: 1180px) {
  .client { height: auto; min-height: 100vh; overflow: visible; display: flex; flex-direction: column; }
  .client-top { order: 0; }
  .client-center { order: 1; position: static; transform: none; width: auto; margin: 22px 16px 14px; max-width: none; }
  .play-btn { order: 2; position: static; width: calc(100% - 32px); margin: 0 16px 16px; }
  .client-left { order: 3; }
  .client-right { order: 4; }
  .client-left, .client-right { position: static; width: auto; max-height: none; margin: 0 16px 12px; }
  .client-chat { order: 5; position: static; margin-top: auto; }
  .client-body { overflow: auto; }
}

.toast-host { position: fixed; right: 20px; bottom: 20px; z-index: 300; display: flex; flex-direction: column; gap: 9px; }
.toast {
  display: flex; align-items: center; gap: 10px;
  background: var(--panel-3); border: 1px solid var(--line);
  border-left: 3px solid var(--radiant);
  padding: 11px 15px; border-radius: 8px; font-size: 12.5px;
  box-shadow: var(--shadow); animation: slidein .22s ease;
}
@keyframes slidein { from { opacity: 0; transform: translateX(16px); } to { opacity: 1; transform: none; } }


.chat-fab { display: none; }
.chat-close { display: none; }
.lbl-short { display: none; }

@media (max-width: 1240px) {
  .chat { display: none; }
  .chat.is-open {
    display: flex; position: fixed; z-index: 90;
    top: var(--header-h); right: 0; bottom: 0; width: min(100%, 420px); height: auto;
    box-shadow: -20px 0 50px -20px #000; animation: fade .16s ease;
    background: #0b0f15;
  }
  .chat.is-open .chat-close { display: grid; flex: none; align-self: center; margin: 0 0 4px 4px; }
  .chat-fab {
    display: grid; place-items: center;
    position: fixed; right: 18px; bottom: 20px; z-index: 75;
    width: 54px; height: 54px; border-radius: 50%; border: 0; cursor: pointer;
    background: linear-gradient(160deg, var(--accent-hot), #8d2415); color: #fff;
    box-shadow: 0 14px 30px -10px rgba(255, 92, 58, .75);
  }
  .chat-fab svg { width: 23px; height: 23px; }
  .chat-fab-badge {
    position: absolute; top: -3px; right: -3px;
    min-width: 20px; height: 20px; padding: 0 5px; border-radius: 10px;
    background: #fff; color: #8d2415; font-size: 11px; font-weight: 800;
    display: grid; place-items: center; font-variant-numeric: tabular-nums;
  }
  .chat-fab-badge[hidden] { display: none; }
  body.chat-open .chat-fab { display: none; }
  [data-entry-detail] { scroll-margin-top: calc(var(--header-h) + 76px); }
  .g-main { grid-template-columns: minmax(0, 1fr); }
  .g-2 { grid-template-columns: minmax(0, 1fr); }
  .stat-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 1080px) {
  .client-tabs a { padding: 0 13px; font-size: 11.5px; letter-spacing: .06em; }
  .search { display: none; }
}
@media (max-width: 860px) {
  .client-tabs { overflow-x: auto; }
  .client-tabs a { padding: 0 11px; }
  .ct-mmr { display: none; }
}
@media (max-width: 980px) {
  .g-2, .g-3, .g-4, .g-side { grid-template-columns: minmax(0, 1fr); }
  .form-grid { grid-template-columns: minmax(0, 1fr); }
  .hero h1 { font-size: 25px; }

  .g-side > aside { display: contents; }
  .g-side > aside > .side-card:first-child {
    position: sticky; top: var(--header-h); z-index: 20;
    background: rgba(11, 15, 21, .96);
  }
  .g-side > aside > .side-card + .side-card { order: 2; margin-top: 0; }
  .g-side .admin-nav { flex-direction: row; overflow-x: auto; scrollbar-width: none; }
  .g-side .admin-nav::-webkit-scrollbar { display: none; }
  .g-side .admin-nav button { width: auto; flex: none; white-space: nowrap; }
  .g-side > aside > .side-card:first-child > .side-body { padding: 6px; }
}

.client-tabs a[href="/"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 11 12 3l9 8M5 9.5V21h5v-6h4v6h5V9.5'/%3E%3C/svg%3E"); }
.client-tabs a[href="/tournaments"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 21h8M12 17v4M7 4h10v5a5 5 0 0 1-10 0V4ZM7 6H4a3 3 0 0 0 3 4M17 6h3a3 3 0 0 1-3 4'/%3E%3C/svg%3E"); }
.client-tabs a[href="/matches"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 5h5l3 3v8l3 3h7M3 19h5l3-3M11 12h10'/%3E%3C/svg%3E"); }
.client-tabs a[href="/streams"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 5h18v12H3zM10 8.5l5 2.5-5 2.5zM8 21h8'/%3E%3C/svg%3E"); }
.client-tabs a[href="/forum"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12a8 8 0 0 1-8 8H4l2-3a8 8 0 1 1 15-5Z'/%3E%3C/svg%3E"); }
.client-tabs a[href="/admin"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2 4 5v7c0 5 3.4 8.7 8 10 4.6-1.3 8-5 8-10V5l-8-3Z'/%3E%3C/svg%3E"); }

@media (max-width: 760px) {
  :root { --header-h: 52px; --tabbar-h: 58px; }

  body { padding-bottom: calc(var(--tabbar-h) + env(safe-area-inset-bottom)); background-attachment: scroll; }

  .client-top { height: var(--header-h); }
  .client-logo { width: 64px; }
  .client-logo img { width: 36px; height: 36px; }

  .client-tabs {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 70;
    height: calc(var(--tabbar-h) + env(safe-area-inset-bottom));
    padding-bottom: env(safe-area-inset-bottom);
    margin: 0; overflow: hidden;
    background: linear-gradient(180deg, #11161d, #090c11);
    border-top: 1px solid #000;
    box-shadow: 0 -6px 20px rgba(0, 0, 0, .55);
  }
  .client-tabs a {
    flex: 1 1 0; min-width: 0; padding: 7px 2px 6px;
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
    font-size: 10px; font-weight: 650; letter-spacing: .01em; text-transform: none;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  .client-tabs a::before {
    content: ''; width: 22px; height: 22px; flex: none;
    background: currentColor;
    -webkit-mask: var(--ico) center / contain no-repeat;
    mask: var(--ico) center / contain no-repeat;
  }
  .client-tabs a::after { display: none; }
  .client-tabs a:hover { background: none; }
  .client-tabs a.is-active {
    color: #fff;
    background: linear-gradient(0deg, transparent, rgba(209, 69, 42, .2));
    box-shadow: inset 0 2px 0 var(--accent-hot);
  }
  .client-tabs a.is-active::before { background: var(--accent-hot); }

  .ct-right { gap: 8px; padding: 0 10px; min-width: 0; }
  .ct-right > .btn:not(.btn-sm) { display: none; }
  .ct-right .btn-sm { height: 32px; }
  .ct-right .lbl-full { display: none; }
  .ct-right .lbl-short { display: inline; }
  .user-chip { padding: 3px; }
  .user-chip > span:not(.avatar) { display: none; }
  .user-chip .avatar { width: 30px; height: 30px; }
  .ct-icon { width: 40px; }

  .client-chat { position: static; }

  .chat.is-open { top: 0; left: 0; width: 100%; height: 100dvh; bottom: auto; z-index: 95; }
  .chat.is-open .chat-tabs { padding-top: max(8px, env(safe-area-inset-top)); }
  .chat.is-open .chat-input { padding-bottom: max(10px, env(safe-area-inset-bottom)); }
  .chat-fab { right: 14px; bottom: calc(var(--tabbar-h) + 14px + env(safe-area-inset-bottom)); width: 52px; height: 52px; }
  body.chat-open { overflow: hidden; }

  .toast-host { left: 12px; right: 12px; bottom: calc(var(--tabbar-h) + 12px + env(safe-area-inset-bottom)); }
  .toast { width: 100%; }

  .wrap { padding: 16px 14px 36px; }
  .grid { gap: 12px; }
  .page-head { gap: 12px; margin-bottom: 16px; align-items: stretch; }
  .page-head h1 { font-size: 21px; }
  .page-head > .spacer { display: none; }
  .page-head > div:first-child { flex: 1 1 100%; }
  .page-head > .field-group { flex: 1 1 140px; width: auto !important; }
  .page-head > .seg, .page-head > .btn { flex: 1 1 auto; }

  .hero { padding: 20px 18px !important; margin-bottom: 16px; border-radius: 12px; }
  .hero h1 { font-size: 23px; margin: 8px 0 8px; }
  .hero p { font-size: 13px; margin-bottom: 16px; }
  .hero-meta { gap: 14px 22px; margin-bottom: 16px; }
  .hero-meta div b { font-size: 14.5px; }
  .hero-actions .btn { flex: 1 1 auto; }

  .stat-row { gap: 10px; margin-bottom: 16px; }
  .stat { padding: 12px 13px; }
  .stat b { font-size: 20px; }

  .section-title { flex-wrap: wrap; margin: 22px 0 12px; }
  .section-title .spacer { display: none; }
  .section-title > .seg { flex: 1 1 100%; }

  .seg { max-width: 100%; overflow-x: auto; scrollbar-width: none; }
  .seg::-webkit-scrollbar { display: none; }
  .seg button { flex: none; white-space: nowrap; padding: 7px 12px; }

  .tabs { margin-bottom: 14px; scrollbar-width: none; margin-left: -14px; margin-right: -14px; padding: 0 8px; }
  .tabs::-webkit-scrollbar { display: none; }
  .tabs button { padding: 12px 12px; }

  .panel-head { flex-wrap: wrap; padding: 11px 14px; }
  .panel-body { padding: 14px; }
  .panel-body.flush { padding: 0; overflow-x: auto; }
  .panel-body[style*="display:flex"] > .spacer { display: none; }
  .panel-body[style*="display:flex"] > .field-group[style*="width"] { width: auto !important; flex: 1 1 140px; }
  .panel-body[style*="display:flex"] > .search { width: 100% !important; display: flex; }
  .panel-body[style*="display:flex"] > div[style*="width:1px"] { display: none; }
  .panel-body[style*="display:flex"] > .btn { flex: 1 1 auto; }
  .panel-foot { flex-wrap: wrap; padding: 11px 14px; }
  .panel-foot > .spacer { display: none; }
  .panel-foot > .muted { flex: 1 1 100%; font-size: 12px; }
  .panel-foot > .btn { flex: 1 1 auto; }
  .side-head { flex-wrap: wrap; }

  .scroll-y { max-height: none; overflow-x: auto; }
  .table th { padding: 9px 10px; white-space: nowrap; }
  .table td { padding: 9px 10px; }

  .match-row { flex-wrap: wrap; gap: 8px 10px; padding: 12px 14px; }
  .match-row > div[style*="width"] { width: auto !important; }
  .match-row > .muted { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .match-time { width: auto; display: flex; align-items: baseline; gap: 6px; }
  .match-teams { order: 5; flex: 1 1 100%; gap: 8px; }
  .match-actions { order: 6; flex: 1 1 100%; }
  .match-actions:empty { display: none; }
  .match-actions .btn { flex: 1; height: 34px; }
  .match-score { padding: 3px 9px; font-size: 14px; }

  .forum-row { gap: 11px; padding: 12px 14px; }
  .forum-num { width: 44px; }
  .forum-num small { font-size: 9px; letter-spacing: .04em; }

  .queue-item { flex-wrap: wrap; gap: 10px; padding: 12px 14px; }
  .queue-main { flex: 1 1 160px; }
  .entry-row { padding: 11px 14px; }

  .kv { flex-wrap: wrap; }

  .steps { margin-bottom: 18px; }
  .step b { display: none; }
  .step.on b { display: inline; }

  .role-pick { flex: 1 1 calc(50% - 8px); }
  .roster-slot { flex-wrap: wrap; }
  .role-select { width: 100%; }

  .switch-row { align-items: flex-start; }

  .br-col { min-width: 208px; }
  .bracket { gap: 36px; }

  .input, .select, .textarea, .chat-input textarea, .search input, .client-chat input, .hero-picker-field { font-size: 16px; }
  .btn { height: 40px; }
  .btn-sm { height: 32px; }
  .btn-lg { height: 46px; }
  .btn-icon { width: 40px; }
  .btn-icon.btn-sm { width: 32px; }

  .modal-back { align-items: flex-end; padding: 0; }
  .modal {
    max-width: none; max-height: 92dvh; overflow-y: auto;
    border-radius: 16px 16px 0 0; border-bottom: 0; background: #0d1219;
    padding-bottom: env(safe-area-inset-bottom);
  }
  .modal-foot { position: sticky; bottom: 0; }
  .modal-foot .btn { flex: 1; }

  .client-center { margin: 18px 14px 12px; }
  .client-center h1 { font-size: 34px; }
  .cc-meta { margin-bottom: 16px; }
  .cc-path .m { width: 108px; }
  .cc-path .sc { width: 36px; }
  .play-btn { font-size: 15px; min-height: 54px; width: calc(100% - 28px); margin: 0 14px 16px; }
  .client-left, .client-right { margin: 0 14px 12px; }

  .footer { margin-top: 24px; padding: 20px 14px; }
  .footer-inner { gap: 12px 18px; }
  .footer-inner .spacer { flex-basis: 100%; height: 0; }
}

@media (hover: none) {
  .t-card:hover { transform: none; }
  .mix-row [data-make-captain] { opacity: .75; }
}

/* ---------- движение и отделка ---------- */

:root {
  --fx-ease: cubic-bezier(.2, .75, .25, 1);
  --fx-spring: cubic-bezier(.3, 1.45, .5, 1);
}

@media (hover: hover) and (pointer: fine) and (min-width: 1100px) {
  @view-transition { navigation: auto; }
}
.client-top { view-transition-name: fx-top; }

::selection { background: rgba(255, 92, 58, .35); color: #fff; }

@keyframes fx-rise { from { opacity: 0; translate: 0 var(--fx-y, 14px); } }
@keyframes fx-fade { from { opacity: 0; } }
@keyframes fx-slide-l { from { opacity: 0; translate: -28px 0; } }
@keyframes fx-slide-r { from { opacity: 0; translate: 28px 0; } }
@keyframes fx-sheet { from { translate: 0 100%; } }
@keyframes fx-pop { 0% { scale: .86; } 60% { scale: 1.08; } 100% { scale: 1; } }
@keyframes fx-pop-in { 0% { opacity: 0; scale: .5; } 70% { opacity: 1; scale: 1.08; } 100% { scale: 1; } }
@keyframes fx-spin { to { rotate: 360deg; } }
@keyframes fx-ring { from { scale: 1; opacity: .75; } to { scale: 3.4; opacity: 0; } }
@keyframes fx-soft { 50% { opacity: .4; } }
@keyframes fx-float { 50% { translate: 0 -5px; } }
@keyframes fx-breathe { from { scale: 1; opacity: .75; } to { scale: 1.08; opacity: 1; } }
@keyframes fx-drift {
  0% { translate: 0 0; scale: 1; }
  50% { translate: -8% 6%; scale: 1.12; }
  100% { translate: 5% -4%; scale: .96; }
}
@keyframes fx-skel { from { background-position: 160% 0; } to { background-position: -60% 0; } }
@keyframes fx-dash { to { stroke-dashoffset: 0; } }
@keyframes fx-late { to { opacity: 1; } }

/* страница собирается при загрузке */
.wrap > * { animation: fx-rise .6s var(--fx-ease) backwards; }
.wrap > :nth-child(2) { animation-delay: .06s; }
.wrap > :nth-child(3) { animation-delay: .12s; }
.wrap > :nth-child(4) { animation-delay: .18s; }
.wrap > :nth-child(5) { animation-delay: .24s; }
.wrap > :nth-child(n+6) { animation-delay: .3s; }
.wrap > :is(.stat-row, [data-tournaments]) { animation: none; }
.footer { animation: fx-fade .8s .3s backwards; }

/* пока сервер отвечает, пустые блоки мерцают вместо дыр */
.fx-loading :is([data-home-stats], [data-t-stats], [data-profile-stats], [data-user-stats], [data-admin-stats],
  [data-tournaments], [data-matches-upcoming], [data-home-pool], [data-forum-list], [data-profile-head], [data-user-head]):empty {
  min-height: 78px; border-radius: var(--radius);
  background: linear-gradient(100deg, transparent 25%, rgba(255, 255, 255, .045) 45%, transparent 65%) 0 0 / 250% 100% no-repeat,
    rgba(255, 255, 255, .015);
  animation: fx-skel 1.4s linear infinite, fx-fade .3s .25s backwards;
}
.fx-loading :is([data-tournaments], [data-matches-upcoming], [data-home-pool], [data-forum-list]):empty { min-height: 220px; }
.fx-loading :is([data-home-hero], [data-t-hero]):empty { min-height: 210px; }

/* то, что дорисовывает JS, выезжает по мере появления на экране */
.fx-pre.fx-pre { opacity: 0; animation: none; }
.fx-in.fx-in { animation: fx-rise .55s var(--fx-ease) backwards; animation-delay: var(--fx-d, 0ms); }
tr.fx-in.fx-in { animation-name: fx-fade; }
.msg.fx-in, .kv.fx-in, .cp-row.fx-in { --fx-y: 8px; }

.tab-panel.is-active { --fx-y: 8px; animation: fx-rise .42s var(--fx-ease); }

/* шапка */
.client-top { transition: box-shadow .3s; }
.fx-scrolled .client-top { box-shadow: 0 12px 30px -12px rgba(0, 0, 0, .95); }
.client-top::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px; pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(255, 92, 58, .75), transparent) no-repeat;
  background-size: 34% 100%;
  animation: fx-scan 10s ease-in-out infinite alternate;
}
@keyframes fx-scan { from { background-position: -30% 0; } to { background-position: 130% 0; } }

.client-logo { overflow: hidden; animation: fx-logo 4.5s ease-in-out infinite; }
.client-logo img { transition: filter .3s, scale .3s var(--fx-spring); }
.client-logo:hover img { filter: brightness(1.15) drop-shadow(0 0 8px rgba(255, 150, 80, .7)); scale: 1.06; }
@keyframes fx-logo {
  0%, 100% { box-shadow: 0 0 26px -6px rgba(209, 69, 42, .55) inset; }
  50% { box-shadow: 0 0 34px -2px rgba(255, 92, 58, .85) inset; }
}

@media (min-width: 761px) {
  .client-tabs a {
    background-image: linear-gradient(var(--accent-hot), var(--accent-hot));
    background-repeat: no-repeat; background-origin: content-box;
    background-position: 50% 100%; background-size: 0 2px;
    transition: color .2s, background-color .2s, background-size .3s var(--fx-ease);
  }
  .client-tabs a:not(.is-active):hover { background-size: 100% 2px; }
}

/* правая часть шапки проявляется, когда известно, кто вошёл: без мигания «гостя» */
.ct-right { opacity: 0; animation: fx-late .01s 2.5s forwards; }
.fx-session .ct-right { opacity: 1; animation: fx-fade .35s ease; }

.user-chip { transition: border-color .2s, box-shadow .25s, background-color .2s; }
.user-chip:hover { box-shadow: 0 0 0 3px rgba(232, 163, 61, .07); }
.user-chip .avatar { transition: box-shadow .25s; }
.user-chip:hover .avatar { box-shadow: 0 0 0 2px rgba(232, 163, 61, .6); }

/* кнопки */
.btn {
  position: relative;
  transition: background-color .2s, border-color .2s, color .2s, box-shadow .25s, filter .2s, transform .15s var(--fx-spring);
}
.btn:active { transform: translateY(1px) scale(.975); transition-duration: .06s; }
.btn-primary::after {
  content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  background: linear-gradient(115deg, transparent 38%, rgba(255, 255, 255, .34) 50%, transparent 62%) no-repeat;
  background-size: 250% 100%; background-position: 130% 0;
  transition: background-position .8s var(--fx-ease);
}
.btn-primary:hover::after { background-position: -30% 0; }

.seg button, .role-pick, .admin-nav button, .chat-tabs button { position: relative; }
.fx-ripples { position: absolute; inset: 0; overflow: hidden; border-radius: inherit; pointer-events: none; }
.fx-ripple {
  position: absolute; border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle, rgba(255, 255, 255, .3), rgba(255, 255, 255, .12) 45%, transparent 70%);
  scale: 0; animation: fx-ripple .65s var(--fx-ease) forwards;
}
@keyframes fx-ripple { to { scale: 1; opacity: 0; } }

.x-btn svg { transition: rotate .3s var(--fx-spring); }
.x-btn:hover svg { rotate: 90deg; }

:is(a, button, [tabindex]):focus-visible { outline: 2px solid rgba(255, 140, 100, .8); outline-offset: 2px; }
:is(.btn-primary, .play-btn):focus-visible { outline: 0; box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .85); }

/* бегунок под вкладками и подложка в переключателях */
.fx-ink, .fx-pill {
  position: absolute; left: 0; top: 0; pointer-events: none; opacity: 0;
  transition: transform .4s var(--fx-ease), width .4s var(--fx-ease), height .4s var(--fx-ease), opacity .2s;
}
.fx-ink {
  top: auto; bottom: 0; height: 2px; border-radius: 2px;
  background: var(--accent-hot); box-shadow: 0 0 10px rgba(255, 92, 58, .75);
}
.chat-tabs .fx-ink { bottom: -1px; }
.fx-pill { z-index: 0; border-radius: 5px; background: var(--panel-3); }
.admin-nav .fx-pill { border-radius: var(--radius-sm); box-shadow: inset 2px 0 0 var(--accent-hot); }
.seg, .admin-nav, .chat-tabs { position: relative; }
.fx-marked > button { position: relative; z-index: 1; }
:is(.tabs, .chat-tabs).fx-marked > button.is-active { border-bottom-color: transparent; }
:is(.seg, .admin-nav).fx-marked > button.is-active,
:is(.seg, .admin-nav).fx-marked > button.is-active:hover { background: transparent; }

/* заголовки блоков */
.panel-head h3, .side-head h4:not(.plain), .section-title h2 { display: flex; align-items: center; gap: 9px; }
.panel-head h3::before, .side-head h4:not(.plain)::before, .section-title h2::before, .cp-head::before {
  content: ''; flex: none; width: 3px; height: 11px; border-radius: 1px;
  background: linear-gradient(180deg, var(--accent-hot), var(--accent));
  box-shadow: 0 0 8px rgba(255, 92, 58, .5);
  transform: skewX(-14deg);
}
.section-title h2::before { width: 4px; height: 15px; }
:is(.page-head, .client-center) .eyebrow:not(:empty)::before {
  content: ''; display: inline-block; vertical-align: middle;
  width: 16px; height: 2px; margin: -2px 8px 0 0; border-radius: 2px;
  background: var(--accent-hot); box-shadow: 0 0 8px rgba(255, 92, 58, .6);
}
.page-head h1, .hero h1 {
  background: linear-gradient(180deg, #fff 35%, #b8c1cf);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}

/* герой-баннер */
.hero::before {
  content: ''; position: absolute; pointer-events: none;
  width: 62%; aspect-ratio: 1; right: -14%; top: -55%;
  background: radial-gradient(closest-side, rgba(255, 92, 58, .24), rgba(255, 92, 58, .06) 55%, transparent 72%);
  animation: fx-drift 18s ease-in-out infinite alternate;
}
.fx-embers { position: absolute; left: 0; top: 0; pointer-events: none; }

/* карточки турниров */
.t-card-banner::before {
  content: ''; position: absolute; right: -6px; bottom: -20px; width: 100px; height: 100px; pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 21h8M12 17v4M7 4h10v5a5 5 0 0 1-10 0V4ZM7 6H4a3 3 0 0 0 3 4M17 6h3a3 3 0 0 1-3 4'/%3E%3C/svg%3E") center / contain no-repeat;
  opacity: .07; transition: opacity .45s, rotate .7s var(--fx-ease), scale .7s var(--fx-ease);
}
.t-card:hover .t-card-banner::before { opacity: .16; rotate: -8deg; scale: 1.1; }
.t-card-banner::after { transition: background-position 1.4s var(--fx-ease); }
.t-card:hover .t-card-banner::after { background-position: 42px 0; }
.t-card-banner > * { position: relative; z-index: 1; }

/* свет под курсором */
.stat, .mix-team { position: relative; }
:is(.t-card, .stat, .mix-team, .play-btn)::after {
  content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  background: radial-gradient(240px circle at var(--mx, 50%) var(--my, 50%), rgba(255, 130, 90, .13), transparent 70%);
  opacity: 0; transition: opacity .35s;
}
:is(.t-card, .stat, .mix-team, .play-btn):hover::after { opacity: 1; }

/* плитки со статистикой */
.stat { overflow: hidden; transition: border-color .25s; }
.stat::before {
  content: ''; position: absolute; left: 0; right: 0; top: 0; height: 2px; pointer-events: none;
  background: linear-gradient(90deg, transparent, var(--accent-hot), transparent);
  scale: 0 1; transition: scale .5s var(--fx-ease);
}
.stat:hover { border-color: #334052; }
.stat:hover::before { scale: 1 1; }
.stat b { background: linear-gradient(180deg, #fff 30%, #aab4c4); -webkit-background-clip: text; background-clip: text; color: transparent; }

.mix-team { transition: border-color .25s, box-shadow .3s; }
.mix-team:not(.drop-ok):not(.drop-no):hover { border-color: #334052; box-shadow: 0 18px 36px -24px rgba(0, 0, 0, .9); }
.pool-chip { transition: border-color .2s, box-shadow .2s, opacity .2s; }
.pool-chip:hover { border-color: #3a475a; box-shadow: 0 6px 16px -10px rgba(0, 0, 0, .9); }

/* полосы прогресса наполняются и поблёскивают */
.progress i {
  position: relative; overflow: hidden; transform-origin: left center;
  animation: fx-grow 1.1s var(--fx-ease) backwards; transition: width .9s var(--fx-ease);
}
.progress i::after {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .38), transparent);
  translate: -100% 0; animation: fx-bar-shine 3s 1.2s ease-in-out infinite;
}
@keyframes fx-grow { from { scale: 0 1; } }
@keyframes fx-bar-shine { 0% { translate: -100% 0; } 45%, 100% { translate: 100% 0; } }

/* статусы */
.chip-live .dot, .chip-open .dot { position: relative; }
.chip-live .dot::after {
  content: ''; position: absolute; inset: 0; border-radius: 50%; background: currentColor;
  animation: fx-ring 1.8s ease-out infinite;
}
.chip-open .dot { animation: fx-soft 2.6s ease-in-out infinite; }
.admin-nav button .badge:not([hidden]) { animation: fx-badge 2.4s ease-in-out infinite; }
@keyframes fx-badge { 50% { box-shadow: 0 0 0 4px rgba(209, 69, 42, .18), 0 0 12px rgba(255, 92, 58, .55); } }

/* строки списков */
:is(.forum-row[data-topic], a.rank-row, .rank-row[data-stream], a.queue-item, .queue-item[data-replace-pick], a.cp-row, .entry-row) {
  transition: background-color .2s, box-shadow .25s;
}
:is(.forum-row[data-topic], a.rank-row, a.queue-item, .queue-item[data-replace-pick], a.cp-row, .entry-row):hover {
  box-shadow: inset 2px 0 0 rgba(255, 92, 58, .75);
}
.forum-row[data-topic] b { transition: color .2s; }
.forum-row[data-topic]:hover b { color: #fff; }
a.cp-row .cp-go { transition: translate .25s var(--fx-spring), color .2s; }
a.cp-row:hover .cp-go { translate: 3px 0; }
.match-row .match-score { transition: border-color .25s, box-shadow .25s; }
.match-row:hover .match-score { border-color: rgba(255, 92, 58, .35); box-shadow: 0 0 14px -4px rgba(255, 92, 58, .35); }
.table tbody td { transition: background-color .2s, box-shadow .2s; }
.table tbody tr:hover td:first-child { box-shadow: inset 2px 0 0 rgba(255, 92, 58, .75); }
.rank-row:nth-child(1) .pos.top { color: #f5c451; text-shadow: 0 0 12px rgba(245, 196, 81, .55); }
.rank-row:nth-child(2) .pos.top { color: #cfd8e3; }
.rank-row:nth-child(3) .pos.top { color: #d8925a; }

/* сетка: колонки проявляются, линии прорисовываются слева направо */
.br-match { transition: border-color .2s, box-shadow .25s; }
.br-match:hover {
  border-color: rgba(255, 92, 58, .45);
  box-shadow: 0 0 0 3px rgba(255, 92, 58, .08), 0 14px 28px -18px rgba(255, 92, 58, .7);
}
.br-match.is-live { animation: fx-live 2.4s ease-in-out infinite; }
@keyframes fx-live {
  0%, 100% { box-shadow: 0 0 0 3px rgba(255, 107, 90, .06); }
  50% { box-shadow: 0 0 0 4px rgba(255, 107, 90, .16), 0 0 24px -6px rgba(255, 107, 90, .6); }
}
.br-slot.win { background: linear-gradient(90deg, rgba(85, 176, 107, .1), transparent 70%); box-shadow: inset 2px 0 0 var(--radiant); }
.br-match > .br-slot:nth-child(2) { border-radius: 6px 6px 0 0; }
.br-match > .br-slot:last-child { border-radius: 0 0 6px 6px; }
.bracket svg.links path { stroke: #2b3547; }
.bracket.is-entering .br-col { animation: fx-fade .45s ease backwards; animation-delay: calc(var(--col, 0) * 90ms); }
.bracket.is-entering svg.links path {
  stroke-dasharray: 1; stroke-dashoffset: 1;
  animation: fx-dash .55s cubic-bezier(.4, 0, .2, 1) forwards;
  animation-delay: calc(.12s + var(--ri, 0) * 90ms);
}

/* формы */
.input, .select, .textarea, .hero-picker { transition: border-color .2s, background-color .2s, box-shadow .2s; }
:is(.input, .select, .textarea):hover:not(:focus):not(:disabled) { border-color: #2d3848; }
:is(.input, .select, .textarea):focus, .hero-picker:focus-within { border-color: #4a6a8e; box-shadow: 0 0 0 3px rgba(75, 143, 214, .16); }
.hero-picker:focus-within { background: #181f2a; }

.role-pick { transition: border-color .2s, background-color .2s, box-shadow .3s, translate .2s var(--fx-ease); }
.role-pick:hover { translate: 0 -1px; }
.role-pick.on { box-shadow: 0 0 0 3px rgba(209, 69, 42, .1), 0 10px 22px -14px rgba(255, 92, 58, .85); }
.role-pick.on .role { animation: fx-pop .38s var(--fx-ease); }

.switch::after { transition: left .32s var(--fx-spring), background-color .2s, box-shadow .25s; }
.switch.on { box-shadow: 0 0 14px -4px rgba(255, 92, 58, .7); }
.switch.on::after { box-shadow: 0 0 8px rgba(255, 92, 58, .9); }

.check .box svg path { stroke-dasharray: 24; stroke-dashoffset: 24; transition: stroke-dashoffset .3s var(--fx-ease) .05s; }
.check.on .box svg path { stroke-dashoffset: 0; }
.check.on .box { animation: fx-pop .32s var(--fx-ease); box-shadow: 0 0 10px -2px rgba(255, 92, 58, .7); }

.step .num { transition: background-color .3s, border-color .3s, color .3s; }
.step.on .num { animation: fx-beacon 2.2s ease-out infinite; }
@keyframes fx-beacon {
  0% { box-shadow: 0 0 0 0 rgba(255, 92, 58, .55); }
  70%, 100% { box-shadow: 0 0 0 10px rgba(255, 92, 58, 0); }
}

/* окна и уведомления */
.modal-back.on { animation: fx-fade .22s ease; }
.modal-back.on .modal { animation: fx-modal .42s cubic-bezier(.2, 1.1, .3, 1) backwards; }
@keyframes fx-modal { from { opacity: 0; translate: 0 16px; scale: .96; } }

.toast {
  position: relative; overflow: hidden;
  background: rgba(29, 37, 50, .94); backdrop-filter: blur(10px);
  animation: fx-toast-in .42s var(--fx-spring) backwards;
}
.toast::after {
  content: ''; position: absolute; left: 0; bottom: 0; width: 100%; height: 2px;
  background: linear-gradient(90deg, var(--radiant), rgba(85, 176, 107, .25));
  transform-origin: left; animation: fx-timer 3.2s linear forwards;
}
.toast.is-leaving { animation: fx-toast-out .28s ease forwards; }
@keyframes fx-toast-in { from { opacity: 0; translate: 30px 0; scale: .95; } }
@keyframes fx-toast-out { to { opacity: 0; translate: 30px 0; scale: .97; } }
@keyframes fx-timer { to { scale: 0 1; } }

.empty-state:not(:has(> svg))::before {
  content: ''; display: block; width: 40px; height: 40px; margin: 0 auto 12px; border-radius: 50%;
  border: 1px solid var(--line);
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13 2 3 14h8l-1 8 10-12h-8l1-8Z' fill='%236b7486'/%3E%3C/svg%3E") center / 17px 17px no-repeat,
    radial-gradient(circle, rgba(255, 92, 58, .14), transparent 70%);
  animation: fx-float 3.6s ease-in-out infinite;
}

/* чат */
.chat-fab { transition: transform .25s var(--fx-spring), box-shadow .25s; animation: fx-pop-in .55s .5s var(--fx-ease) backwards; }
.chat-fab:hover { transform: translateY(-2px) scale(1.05); }
.chat-fab:has(.chat-fab-badge:not([hidden]))::before {
  content: ''; position: absolute; inset: 0; border-radius: 50%; pointer-events: none;
  border: 2px solid var(--accent-hot); animation: fx-ring2 1.9s ease-out infinite;
}
@keyframes fx-ring2 { from { scale: 1; opacity: .8; } to { scale: 1.45; opacity: 0; } }
.chat-fab-badge:not([hidden]) { animation: fx-pop .35s var(--fx-ease); }

.player { transition: border-color .25s, box-shadow .3s; }
.player:hover { border-color: #33404f; box-shadow: 0 26px 50px -30px rgba(0, 0, 0, .9); }

/* подвал */
.footer { position: relative; border-top-color: transparent; }
.footer::before {
  content: ''; position: absolute; left: 0; right: 0; top: -1px; height: 1px; pointer-events: none;
  background: linear-gradient(90deg, transparent, var(--line) 18%, rgba(255, 92, 58, .5) 50%, var(--line) 82%, transparent);
}
.logo-mark { transition: box-shadow .3s, rotate .4s var(--fx-spring), scale .4s var(--fx-spring); }
.logo:hover .logo-mark { box-shadow: 0 0 0 1px rgba(255, 255, 255, .08) inset, 0 8px 26px -6px var(--accent-hot); rotate: -8deg; scale: 1.06; }

/* главная в стиле клиента: дышащий фон, портал за героем, выезжающие панели */
.client-bg { overflow: hidden; }
.client-bg::before { animation: fx-breathe 9s ease-in-out infinite alternate; }
.client-aura {
  position: absolute; left: 63%; top: 57%; width: min(76vh, 720px); aspect-ratio: 1;
  translate: -50% -50%; pointer-events: none;
  animation: fx-aura-in 2.4s .2s var(--fx-ease) backwards;
}
@keyframes fx-aura-in { from { opacity: 0; scale: .85; } }
.client-aura i { position: absolute; inset: 0; border-radius: 50%; }
.client-aura i:nth-child(1) { border: 1px solid rgba(170, 215, 160, .07); }
.client-aura i:nth-child(2), .client-aura i:nth-child(3) {
  background: conic-gradient(from 0deg,
    transparent 0deg, rgba(140, 230, 150, 0) 20deg, rgba(140, 230, 150, .6) 110deg, transparent 111deg 180deg,
    rgba(255, 110, 70, 0) 200deg, rgba(255, 110, 70, .55) 290deg, transparent 291deg);
  animation: fx-spin 16s linear infinite;
}
.client-aura i:nth-child(2) {
  opacity: .35;
  -webkit-mask: radial-gradient(closest-side, transparent calc(100% - 22px), #000 calc(100% - 3px), transparent 100%);
  mask: radial-gradient(closest-side, transparent calc(100% - 22px), #000 calc(100% - 3px), transparent 100%);
}
.client-aura i:nth-child(3) {
  -webkit-mask: radial-gradient(closest-side, transparent calc(100% - 3px), #000 calc(100% - 2px), #000 calc(100% - 1px), transparent 100%);
  mask: radial-gradient(closest-side, transparent calc(100% - 3px), #000 calc(100% - 2px), #000 calc(100% - 1px), transparent 100%);
}
.client-aura i:nth-child(4) {
  inset: 7%;
  background: repeating-conic-gradient(rgba(190, 230, 175, .3) 0 .6deg, transparent .6deg 6deg);
  -webkit-mask: radial-gradient(closest-side, transparent calc(100% - 9px), #000 calc(100% - 8px), #000 calc(100% - 1px), transparent 100%);
  mask: radial-gradient(closest-side, transparent calc(100% - 9px), #000 calc(100% - 8px), #000 calc(100% - 1px), transparent 100%);
  animation: fx-spin 90s linear infinite reverse;
}
.client-aura i:nth-child(5) { inset: 18%; border: 1px dashed rgba(170, 215, 160, .13); animation: fx-spin 50s linear infinite; }
.client-aura i:nth-child(6) {
  inset: 26%;
  background: radial-gradient(closest-side, rgba(150, 215, 135, .18), rgba(150, 215, 135, .05) 60%, transparent 75%);
  animation: fx-breathe 6s ease-in-out infinite alternate;
}

.client-left { animation: fx-slide-l .7s .15s var(--fx-ease) backwards; }
.client-right { animation: fx-slide-r .7s .2s var(--fx-ease) backwards; }
.client-center { --fx-y: 18px; animation: fx-rise .8s .25s var(--fx-ease) backwards; }
.client-center h1 { animation: fx-title-glow 5s ease-in-out infinite alternate; }
@keyframes fx-title-glow {
  from { text-shadow: 0 6px 30px rgba(0, 0, 0, .9); }
  to { text-shadow: 0 6px 30px rgba(0, 0, 0, .9), 0 0 30px rgba(150, 215, 135, .28); }
}
.client-chat { animation: fx-fade .8s .5s backwards; }

.play-btn { overflow: hidden; animation: fx-rise .7s .4s var(--fx-ease) backwards; }
.play-btn::before {
  content: ''; position: absolute; top: 0; bottom: 0; left: 0; width: 38%; pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .3), transparent);
  transform: skewX(-20deg); translate: -120% 0;
  animation: fx-sweep 5.5s 1.6s ease-in-out infinite;
}
@keyframes fx-sweep { 0% { translate: -120% 0; } 20%, 100% { translate: 320% 0; } }

.cp-promo::before {
  content: ''; position: absolute; inset: -40%; pointer-events: none;
  background: radial-gradient(circle at 65% 30%, rgba(255, 92, 58, .38), transparent 40%);
  animation: fx-drift 14s ease-in-out infinite alternate;
}
.cp-promo > * { position: relative; }
.cp-rank { position: relative; overflow: hidden; isolation: isolate; }
.cp-rank::after {
  content: ''; position: absolute; inset: -40%; z-index: -1;
  background: conic-gradient(from 0deg, transparent 0 75%, rgba(255, 215, 130, .45) 88%, transparent 100%);
  animation: fx-spin 3.5s linear infinite;
}

@media (max-width: 1240px) {
  .chat.is-open { animation: fx-slide-r .34s var(--fx-ease); }
}
@media (max-width: 1180px) {
  .play-btn { position: relative; right: auto; bottom: auto; }
  .client-aura { left: 50%; top: 250px; width: min(112vw, 560px); opacity: .6; }
  .client-left, .client-right { animation-name: fx-rise; }
}
@media (max-width: 760px) {
  .modal-back.on .modal { animation: fx-sheet .42s var(--fx-ease) backwards; }
  .chat.is-open { animation: fx-sheet .38s var(--fx-ease); }
  .toast { animation-name: fx-toast-up; }
  .toast.is-leaving { animation-name: fx-toast-down; }
}
@keyframes fx-toast-up { from { opacity: 0; translate: 0 18px; scale: .97; } }
@keyframes fx-toast-down { to { opacity: 0; translate: 0 18px; } }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 1ms !important; animation-delay: 0s !important; animation-iteration-count: 1 !important;
    transition-duration: 1ms !important; transition-delay: 0s !important;
  }
  .fx-pre { opacity: 1 !important; }
  ::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation: none !important; }
}

/* ---------- новые блоки ---------- */

/* матчи: этап и комментарий */
.match-stage { width: 170px; flex: none; display: flex; flex-direction: column; gap: 2px; min-width: 0; font-size: 12px; color: var(--muted); }
.match-stage small {
  color: var(--gold); font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

/* составы: запасные и переименование */
.role-sub { color: var(--dim); border-style: dashed; font-size: 10px; }
.mix-row.is-sub { background: rgba(255, 255, 255, .015); }
.mix-row.is-sub b { color: var(--muted); font-weight: 500; }
.mix-team-head .grow { flex: 1; min-width: 0; }
.mix-team-head .grow + .spacer { display: none; }
.mix-team-head h4 { display: flex; align-items: center; gap: 4px; }
.team-rename { padding: 2px 4px; font-size: 12px; opacity: .55; }
.mix-team:hover .team-rename, .team-rename:focus-visible { opacity: 1; }

/* закреп в чате */
.chat-pin {
  display: flex; align-items: flex-start; gap: 9px;
  margin: 8px 10px 0; padding: 9px 10px; border-radius: 8px;
  background: linear-gradient(90deg, rgba(255, 92, 58, .14), rgba(255, 92, 58, .04));
  border: 1px solid rgba(255, 92, 58, .3);
  animation: fx-rise .35s var(--fx-ease);
}
.chat-pin[hidden] { display: none; }
.chat-pin-icon { font-size: 13px; line-height: 1.4; }
.chat-pin-body { flex: 1; min-width: 0; font-size: 12.5px; line-height: 1.45; }
.chat-pin-body b { display: block; font-size: 11px; color: var(--accent-hot); letter-spacing: .02em; }
.chat-pin-body span { color: var(--text); word-wrap: break-word; }
.chat-pin .x-btn { padding: 0 4px; font-size: 15px; line-height: 1; }
.msg-head .x-btn { padding: 0 3px; font-size: 12px; opacity: .45; }
.msg:hover .msg-head .x-btn { opacity: 1; }

/* главная: чат, стрим, боты */
.home-chat { display: flex; flex-direction: column; height: 330px; }
.home-chat .chat-tabs { padding: 4px 6px 0; }
.home-chat .chat-body { flex: 1; min-height: 0; padding: 14px 12px 12px; gap: 12px; }
.home-chat .chat-input { padding: 8px 10px; }
.home-chat .msg .avatar { width: 22px; height: 22px; font-size: 9px; }
.home-stream { position: relative; aspect-ratio: 16 / 9; background: #06080b; }
.home-stream iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.bot-stats { display: grid; grid-template-columns: repeat(4, 1fr); border-bottom: 1px solid #1a222c; }
.bot-stats div { padding: 8px 6px; text-align: center; }
.bot-stats div + div { border-left: 1px solid #1a222c; }
.bot-stats b { display: block; font-size: 15px; font-variant-numeric: tabular-nums; }
.bot-stats span { font-size: 9.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--dim); font-weight: 700; }
.cp-head .delta-ok, .cp-head .delta-bad { letter-spacing: 0; text-transform: none; font-weight: 600; font-size: 11px; }

/* обложки */
.hero.has-cover {
  background:
    linear-gradient(100deg, rgba(10, 12, 16, .96) 25%, rgba(10, 12, 16, .55) 60%, rgba(10, 12, 16, .25)),
    var(--cover) center / cover no-repeat,
    var(--panel);
}
.t-card-banner.has-cover {
  background: linear-gradient(180deg, rgba(10, 12, 16, .15), rgba(10, 12, 16, .75)), var(--cover) center / cover no-repeat;
}
.t-card-banner.has-cover::before { display: none; }
.cp-promo.has-cover {
  background: linear-gradient(0deg, rgba(8, 11, 15, .95), rgba(8, 11, 15, .25)), var(--cover) center / cover no-repeat;
}

/* регламент */
.rules-line { margin: 8px 0; font-size: 13px; color: var(--muted); }

/* «О нас» */
.about-text { font-size: 14px; line-height: 1.65; color: #c4ccda; }
.about-text p { margin: 0 0 12px; }
.about-text p:last-child { margin-bottom: 0; }
.about-links { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; }
.about-link {
  display: flex; flex-direction: column; gap: 3px; padding: 14px 16px;
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius);
  transition: border-color .2s, translate .25s var(--fx-ease);
}
.about-link:hover { border-color: rgba(255, 92, 58, .45); translate: 0 -2px; }
.about-link b { font-size: 14px; }
.about-link small { color: var(--dim); font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.about-support { margin-top: 22px; }
.about-support .panel-body { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.about-support .panel-body > div { flex: 1; min-width: 180px; }
.about-support b { display: block; font-size: 15px; }
.about-support .muted { font-size: 12.5px; }

/* подвал */
.footer-links { display: contents; }

/* админка: этапы */
.stage { border-bottom: 1px solid var(--line-soft); }
.stage:last-child { border-bottom: 0; }
.stage-head {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 12px 16px; background: rgba(255, 255, 255, .02);
}
.stage-head b { flex: 1 1 180px; font-size: 13px; }
.stage-head .input { width: 210px; }
.stage-head .select { width: 110px; }
.stage-match { display: flex; align-items: center; gap: 10px; padding: 7px 16px 7px 28px; font-size: 12.5px; }
.stage-match .grow { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.stage-match .input { width: 260px; padding: 6px 10px; font-size: 12px; }

/* админка: жалобы */
.report-item { align-items: flex-start; flex-wrap: wrap; }
.report-item.is-closed { opacity: .6; }
.report-body { margin-top: 6px; font-size: 12.5px; color: #b4bdcc; white-space: pre-wrap; }

/* админка: поддержка */
.support-grid { grid-template-columns: 300px minmax(0, 1fr); }
.support-chat { display: flex; flex-direction: column; min-height: 460px; }
.support-log { flex: 1; max-height: 420px; overflow-y: auto; display: flex; flex-direction: column; gap: 8px; }
.support-msg { max-width: 80%; padding: 8px 11px; border-radius: 10px; font-size: 13px; background: var(--panel-2); border: 1px solid var(--line); }
.support-msg small { display: block; margin-top: 4px; font-size: 10.5px; color: var(--dim); }
.support-msg.out { align-self: flex-end; background: rgba(255, 92, 58, .1); border-color: rgba(255, 92, 58, .3); }

/* админка: обложка */
.cover-edit { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; }
.cover-preview {
  width: 240px; aspect-ratio: 16 / 7; border-radius: 8px; border: 1px solid var(--line);
  background: var(--panel-2) center / cover no-repeat;
  display: grid; place-items: center; color: var(--dim); font-size: 12px;
}
.cover-actions { display: flex; gap: 8px; }

.post-drop { display: inline-grid; vertical-align: middle; padding: 0 4px; font-size: 14px; }

.client-tabs a[href="/about"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 11v6M12 7.5v.01'/%3E%3C/svg%3E"); }

@media (max-width: 1240px) {
  .support-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
  .match-stage { width: auto; flex: 1 1 auto; }
  .stage-head .input, .stage-head .select { width: auto; flex: 1 1 140px; }
  .stage-match { flex-wrap: wrap; padding-left: 16px; }
  .stage-match .input { width: 100%; }
  .home-chat { height: 360px; }
  .client-tabs a { font-size: 9.5px; }
}

/* админка: карточка лобби-бота */
.bot-row { cursor: pointer; transition: background-color .2s, box-shadow .25s; }
.bot-row:hover { background: rgba(255, 255, 255, .025); box-shadow: inset 2px 0 0 rgba(255, 92, 58, .75); }
.bot-card { margin-bottom: 16px; border-color: rgba(255, 92, 58, .3); }
.bot-card[hidden] { display: none; }
.bot-card-body { display: flex; flex-direction: column; gap: 16px; }
.bot-facts .kv b small { font-weight: 500; }
.bot-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.bot-cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 20px; }
.bot-members, .bot-log { margin-top: 8px; border: 1px solid var(--line-soft); border-radius: 8px; overflow: hidden; }
.bot-member, .bot-log-row {
  display: flex; align-items: center; gap: 10px; padding: 8px 12px;
  border-bottom: 1px solid var(--line-soft); font-size: 12.5px;
}
.bot-member:last-child, .bot-log-row:last-child { border-bottom: 0; }
.bot-member .grow, .bot-log-row .grow { flex: 1; min-width: 0; }
.bot-log-row b { display: block; font-weight: 600; }
.bot-log-row small { display: block; color: var(--dim); font-size: 11px; }
.bot-team { width: 110px; flex: none; font-size: 11px; font-weight: 700; letter-spacing: .04em; color: var(--dim); }
.team-radiant .bot-team { color: var(--radiant); }
.team-dire .bot-team { color: var(--dire); }
.bot-empty { padding: 12px; font-size: 12.5px; }
@media (max-width: 980px) {
  .bot-cols { grid-template-columns: minmax(0, 1fr); }
}

/* форма своего лобби */
.lobby-modal { max-width: 620px; max-height: calc(100vh - 48px); display: flex; flex-direction: column; }
.lobby-modal .modal-body { overflow-y: auto; }
.lobby-modal .form-grid { gap: 12px 14px; }
.lobby-switches { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 14px; }
.lobby-switches .switch-row { padding: 10px 12px; }
.lobby-warn { margin-bottom: 14px; padding: 10px 12px; border-radius: 8px; font-size: 12.5px; background: rgba(214, 164, 72, .1); border: 1px solid rgba(214, 164, 72, .35); color: #e8c88a; }
.lobby-error { margin-top: 12px; font-size: 12.5px; color: #f08a7e; }
.field-group.is-off { opacity: .45; }
@media (max-width: 720px) {
  .lobby-modal { max-height: 92vh; }
  .lobby-switches { grid-template-columns: minmax(0, 1fr); }
}

/* команды капитанов и набор из пула */
.draft-bar { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.draft-bar .switch-row { padding: 9px 12px; }
.mix-coach { display: flex; align-items: center; gap: 8px; padding: 8px 14px; font-size: 12.5px; border-bottom: 1px solid var(--line-soft); }
.mix-coach .spacer { flex: 1; }
.mix-empty { padding: 14px; font-size: 12.5px; text-align: center; }
.reg-switches { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.reg-switches .switch-row { padding: 10px 12px; }
.draft-panel { margin-bottom: 16px; }
.draft-note { padding: 10px 18px; font-size: 12.5px; color: #e8c88a; background: rgba(214, 164, 72, .08); border-bottom: 1px solid var(--line-soft); }
.draft-cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 20px; }
.draft-list { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
.draft-pool { max-height: 420px; overflow-y: auto; padding-right: 4px; }
.draft-row { display: flex; align-items: center; gap: 9px; padding: 7px 10px; background: var(--panel-2); border: 1px solid var(--line); border-radius: 8px; min-width: 0; }
.draft-row .grow { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.draft-row.is-sub { opacity: .75; }
.draft-row .role-badges, .draft-row .roles { flex: none; }
.draft-empty { padding: 12px; font-size: 12.5px; }
.draft-tools { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.draft-tools .spacer { flex: 1; }
.draft-tools .input-sm { width: 130px; padding: 6px 10px; font-size: 12.5px; }
.draft-tools .select-sm { width: 110px; padding: 6px 30px 6px 10px; font-size: 12.5px; background-position: calc(100% - 15px) 13px, calc(100% - 10px) 13px; }
.draft-form { display: flex; flex-direction: column; gap: 14px; }
.df-coach { min-height: 26px; display: flex; align-items: center; }
.df-results { display: flex; flex-direction: column; gap: 6px; max-height: 240px; overflow-y: auto; }
.df-results .queue-item { cursor: pointer; }
.chip-x { background: none; border: 0; color: inherit; cursor: pointer; font-size: 14px; line-height: 1; padding: 0 0 0 4px; }
@media (max-width: 720px) {
  .draft-cols { grid-template-columns: minmax(0, 1fr); }
  .reg-switches { grid-template-columns: minmax(0, 1fr); }
  .draft-bar .switch-row { flex: 1 1 100%; }
  .draft-bar .btn { flex: 1; }
  .draft-tools .input-sm, .draft-tools .select-sm { flex: 1; width: auto; }
}

/* чат команды: выбор команды у организатора */
.chat-team-pick { padding: 8px 10px; border-bottom: 1px solid var(--line); }
.chat-team-pick .select { padding: 7px 30px 7px 10px; font-size: 12.5px; background-position: calc(100% - 15px) 14px, calc(100% - 10px) 14px; }

/* ================= главная: три колонки ================= */
.home-body { background: #07090d; }
.client.home { height: auto; min-height: 100vh; overflow: visible; display: flex; flex-direction: column; }
.home .client-bg {
  position: fixed; inset: 0; z-index: 0;
  background:
    radial-gradient(1100px 620px at 50% -10%, rgba(150, 40, 20, .22), transparent 70%),
    radial-gradient(700px 500px at 100% 100%, rgba(120, 30, 18, .14), transparent 70%),
    linear-gradient(180deg, #0d1016 0%, #090b10 50%, #06080b 100%);
}
.home .client-bg::before, .home .client-bg::after, .home .client-aura { display: none; }

.home-brand {
  display: flex; flex-direction: column; justify-content: center; gap: 1px;
  padding: 0 22px 0 16px; color: #fff; text-decoration: none; line-height: 1;
}
.home-brand b { font-size: 17px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.home-brand span { font-size: 9.5px; font-weight: 700; letter-spacing: .42em; text-transform: uppercase; color: var(--dim); margin-top: 3px; }
.home .ct-right { gap: 16px; }
.home .search { width: 290px; background: rgba(14, 18, 24, .9); border-color: #242c38; }

/* главная: баннер → моё участие → две колонки (турнир | расписание и общение) → цифры */
.home-page {
  position: relative; z-index: 1; flex: 1;
  display: flex; flex-direction: column; gap: 16px; padding: 16px;
  width: 100%; max-width: 1480px; margin: 0 auto;
}
.home-cols { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 16px; align-items: start; }
.home-right { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.home .home-right > .cpanel, .home .home-page > .cpanel { margin-top: 0; }
.home-center { min-width: 0; display: flex; flex-direction: column; gap: 16px; }

/* моё участие */
.hme .hlist-head { border-bottom: 1px solid #1a222c; gap: 8px; }
.hme .hlist-head h2 { margin-right: 10px; }
.hme-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; padding: 14px 16px; }
.hme-card { display: flex; flex-direction: column; gap: 8px; padding: 14px; background: rgba(20, 24, 32, .8); border: 1px solid #242c38; border-radius: 6px; min-width: 0; }
.hme-head { display: flex; align-items: center; gap: 10px; margin-bottom: 2px; }
.hme-head b { flex: 1; min-width: 0; font-size: 14.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hme-row { display: flex; align-items: center; gap: 12px; font-size: 13px; min-height: 24px; }
.hme-row > span:first-child { width: 70px; flex: none; font-size: 11px; color: var(--dim); text-transform: uppercase; letter-spacing: .08em; }
.hme-row > span:last-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.hme-row a { color: #fff; font-weight: 650; }
.hme-row a:hover { color: var(--accent-hot); }
.hme-row small { color: var(--dim); }
.hme-act { margin-top: auto; padding-top: 6px; display: flex; gap: 8px; flex-wrap: wrap; }
.hme-act .ready-ask { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.hme-act .ready-q { font-size: 12.5px; font-weight: 650; }
.hme-tip { display: block; margin: 0 16px 14px; padding: 10px 14px; border-radius: 6px; font-size: 13px; color: #d9dee6; text-decoration: none;
  background: rgba(232, 163, 61, .08); border: 1px solid rgba(232, 163, 61, .3); }
.hme-cards + .hme-tip { margin-top: 0; }
.hlist-head + .hme-tip { margin-top: 14px; }
.hme-tip u { color: var(--gold); text-decoration: none; font-weight: 650; }
.hme-tip:hover u { text-decoration: underline; }
.home .cpanel { border-radius: 6px; }
.home-center > .cpanel + .cpanel { margin-top: 0; }
.home .cp-head { padding: 11px 14px; font-size: 11px; color: #c9d0dc; }

.online { width: 7px; height: 7px; border-radius: 50%; background: #3ecf6e; box-shadow: 0 0 8px rgba(62, 207, 110, .7); }

/* баннер */
.hh {
  position: relative; min-height: 250px; overflow: hidden; border-radius: 8px;
  border: 1px solid #2c1d19; background: #120c0b;
  box-shadow: 0 30px 60px -30px rgba(0, 0, 0, .9);
}
.hh-art {
  position: absolute; inset: 0;
  background:
    radial-gradient(420px 300px at 62% 40%, rgba(255, 110, 50, .38), transparent 70%),
    radial-gradient(520px 360px at 80% 90%, rgba(190, 40, 20, .45), transparent 70%),
    radial-gradient(300px 220px at 45% 110%, rgba(255, 150, 60, .25), transparent 70%),
    repeating-linear-gradient(115deg, transparent 0 38px, rgba(255, 120, 60, .035) 38px 40px),
    linear-gradient(120deg, #1a0d0a, #3a120b 55%, #1b0a08);
}
.hh-art.has-cover { background: var(--cover) center / cover no-repeat; }
.hh-art::after {
  content: ''; position: absolute; inset: 0;
  background:
    linear-gradient(90deg, rgba(8, 9, 12, .96) 0%, rgba(8, 9, 12, .72) 38%, rgba(8, 9, 12, .15) 70%, rgba(8, 9, 12, .55) 100%),
    linear-gradient(0deg, rgba(8, 9, 12, .7), transparent 45%);
}
.hh::before {
  content: ''; position: absolute; left: 16px; top: 31px; z-index: 2;
  width: 3px; height: 22px; background: var(--accent-hot); transform: skewX(-18deg);
}
.hh-body { position: relative; z-index: 1; display: flex; align-items: center; gap: 24px; min-height: 250px; padding: 30px 34px 34px; }
.hh-main { flex: 1; min-width: 0; }
.hh-now { display: inline-flex; align-items: center; gap: 8px; font-size: 11.5px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: #e9edf3; }
.hh-now i { width: 8px; height: 8px; border-radius: 50%; background: var(--accent-hot); box-shadow: 0 0 10px var(--accent-hot); }
.hh-now.is-live i { animation: hh-pulse 1.6s ease-in-out infinite; }
@keyframes hh-pulse { 50% { opacity: .35; transform: scale(.8); } }
.hh h1 { font-size: 46px; line-height: 1.02; letter-spacing: -.02em; margin: 12px 0 10px; text-shadow: 0 6px 30px rgba(0, 0, 0, .9); }
.hh p { margin: 0 0 22px; font-size: 15px; color: #c8cfd9; }
.hh-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.hh-actions .btn-lg { min-width: 160px; }
.hh-ghost { background: rgba(10, 12, 16, .75); border-color: #333c49; gap: 10px; }
.hh-ghost svg { width: 15px; height: 15px; }
.hh-side { width: 300px; flex: none; }
.hh-card-kicker { display: flex; align-items: center; gap: 7px; font-size: 9.5px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--accent-hot); }
.hh-card-kicker i { width: 6px; height: 6px; border-radius: 50%; background: var(--accent-hot); }
/* плитки статистики */
.hs-row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.stat.hs { display: flex; align-items: center; gap: 14px; padding: 16px; background: rgba(12, 15, 21, .86); border: 1px solid #1f2733; border-radius: 6px; }
.hs-ico {
  width: 48px; height: 48px; flex: none; display: grid; place-items: center; border-radius: 6px;
  background: linear-gradient(160deg, rgba(209, 69, 42, .28), rgba(209, 69, 42, .06));
  border: 1px solid rgba(255, 92, 58, .25); color: var(--accent-hot); font-style: normal;
}
.hs-ico svg { width: 24px; height: 24px; }
.hs-txt { min-width: 0; }
.stat.hs span { display: block; font-size: 10.5px; }
.stat.hs b { font-size: 30px; margin-top: 3px; line-height: 1.05; }
.stat.hs small { display: block; margin-top: 3px; font-size: 11.5px; color: var(--dim); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* список турниров */
.hlist-head { display: flex; align-items: center; gap: 18px; padding: 14px 16px; flex-wrap: wrap; }
.hlist-head h2 { display: flex; align-items: center; gap: 10px; font-size: 19px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; margin: 0; }
.hlist-head h2::before { content: ''; width: 3px; height: 20px; background: var(--accent-hot); transform: skewX(-18deg); }
.hlist-head .spacer { flex: 1; }
.hlist-filter { display: flex; gap: 6px; flex-wrap: wrap; }
.hlist-filter button {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 6px 12px; font-size: 12px; font-weight: 600; color: var(--muted);
  background: transparent; border: 1px solid transparent; border-radius: 5px; cursor: pointer; transition: .15s;
}
.hlist-filter button:hover { color: #fff; }
.hlist-filter button.is-active { color: #fff; border-color: rgba(255, 92, 58, .6); background: rgba(209, 69, 42, .16); }
.hlist-filter i { width: 7px; height: 7px; border-radius: 50%; }
.hlist-filter .f-open i { background: #3ecf6e; }
.hlist-filter .f-live i { border: 1.5px solid var(--muted); }
/* статус-чипы главной */
.hchip {
  display: inline-flex; align-items: center; gap: 6px; flex: none;
  padding: 3px 9px; border-radius: 20px; font-size: 11px; font-weight: 650; white-space: nowrap;
  color: var(--muted); background: rgba(10, 12, 16, .8); border: 1px solid #2a323e;
}
.hchip i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.hchip.is-open { color: #52d983; border-color: rgba(62, 207, 110, .4); background: rgba(20, 50, 32, .75); }
.hchip.is-live { color: #ff7a5c; border-color: rgba(255, 92, 58, .45); background: rgba(60, 20, 14, .75); }
.hchip.is-live i { animation: hh-pulse 1.6s ease-in-out infinite; }
.hchip.is-done { color: var(--dim); }
.hchip.is-alert { color: #f0b85c; border-color: rgba(232, 163, 61, .45); }

/* матчи сегодня */
.htoday .hlist-head { border-bottom: 1px solid #1a222c; }
.ht-row {
  display: grid; grid-template-columns: 58px minmax(0, 1fr) 70px minmax(0, 1fr) 80px; align-items: center;
  gap: 4px 12px; padding: 11px 16px; color: inherit; text-decoration: none; border-bottom: 1px solid rgba(26, 34, 44, .7);
}
.ht-row:last-child { border-bottom: 0; }
.ht-row:hover { background: rgba(255, 255, 255, .025); }
.ht-time { font-weight: 800; font-variant-numeric: tabular-nums; color: var(--gold); }
.ht-side { font-weight: 650; text-align: right; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ht-side.right { text-align: left; }
.ht-score { text-align: center; font-weight: 800; font-size: 16px; font-variant-numeric: tabular-nums; background: rgba(255, 255, 255, .04); border-radius: 4px; padding: 3px 0; }
.ht-row .hchip { justify-self: end; }
.ht-where { grid-column: 2 / 5; text-align: center; font-size: 11px; color: var(--dim); }
/* правая колонка */
.hsch-day { display: flex; align-items: center; gap: 8px; padding: 10px 14px 6px; font-size: 11.5px; font-weight: 650; color: #c9d0dc; }
.hsch-day::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: var(--accent-hot); }
.hsch-row {
  display: flex; align-items: center; gap: 10px; margin: 0 10px 8px; padding: 9px 10px;
  background: rgba(20, 24, 32, .8); border: 1px solid #242c38; border-radius: 5px; color: inherit; text-decoration: none;
}
.hsch-row:hover { border-color: rgba(255, 92, 58, .4); }
.hsch-row .grow { flex: 1; min-width: 0; }
.hsch-row b { display: block; font-size: 12.5px; font-weight: 650; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hsch-row small { font-size: 11px; color: var(--dim); }
.hsch-ico { width: 28px; height: 28px; flex: none; display: grid; place-items: center; border-radius: 5px; color: var(--gold); background: rgba(232, 163, 61, .1); font-style: normal; }
.hsch-ico svg { width: 16px; height: 16px; }
.home .home-chat { height: 360px; }
.hcommunity {
  position: relative; overflow: hidden; padding: 20px 18px 18px; display: flex; flex-direction: column; gap: 6px; align-items: flex-start;
  background:
    radial-gradient(260px 160px at 90% 10%, rgba(255, 92, 58, .35), transparent 70%),
    repeating-linear-gradient(125deg, transparent 0 26px, rgba(255, 120, 60, .04) 26px 28px),
    linear-gradient(135deg, #2a0f0a, #14090a 70%);
}
.home .hcommunity { border-color: #3a1d17; }
.hcommunity b { font-size: 15px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.hcommunity span { display: flex; align-items: center; gap: 8px; font-size: 12px; color: #d3b9b0; }
.hcommunity span i { width: 4px; height: 4px; border-radius: 50%; background: var(--accent-hot); }
.hcommunity .btn { margin-top: 10px; border-color: rgba(255, 92, 58, .6); background: rgba(10, 8, 8, .5); }

/* подвал */
.home-foot {
  position: relative; z-index: 1; display: flex; align-items: center; gap: 20px;
  padding: 18px 24px; border-top: 1px solid #161c24; background: rgba(6, 8, 11, .9);
}
.home-foot .spacer { flex: 1; }
.hf-legal { display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 12px; }
.hf-legal a { color: var(--muted); }
.hf-legal a:hover { color: #fff; }
.hf-social { display: flex; align-items: center; gap: 14px; font-size: 12px; }
.hf-social a { color: var(--muted); }
.hf-social a:hover { color: #fff; }
.hf-social .hf-ico svg { width: 20px; height: 20px; display: block; }

/* поиск в шапке */
.search { position: relative; }
.search-pop {
  position: absolute; left: 0; top: calc(100% + 6px); z-index: 90; width: max(100%, 360px);
  max-height: 70vh; overflow-y: auto; padding: 6px;
  background: #10141b; border: 1px solid #2a323e; border-radius: 8px; box-shadow: 0 24px 50px -16px #000;
}
.sp-group { padding: 8px 10px 4px; font-size: 10px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--dim); }
.sp-row { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 6px; color: inherit; text-decoration: none; font-size: 13px; }
.sp-row:hover { background: rgba(255, 255, 255, .05); }
.sp-row b { flex: 1; min-width: 0; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sp-row small { color: var(--dim); font-size: 11px; }
.sp-ico { width: 26px; height: 26px; flex: none; display: grid; place-items: center; border-radius: 5px; background: rgba(255, 92, 58, .12); color: var(--accent-hot); font-style: normal; }
.sp-ico svg { width: 15px; height: 15px; }
.sp-empty { padding: 14px; text-align: center; font-size: 12.5px; color: var(--dim); }

@media (max-width: 1560px) {
  .home .search { width: 230px; }
  .hs-ico { width: 42px; height: 42px; }
  .stat.hs b { font-size: 26px; }
}
@media (max-width: 1360px) {
  .home-cols { grid-template-columns: minmax(0, 1fr) 300px; }
  .home-brand { display: none; }
  .hs-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 1080px) {
  .hh-body { flex-direction: column; align-items: stretch; }
  .hh-side { width: auto; }
}
@media (max-width: 900px) {
  .home-page { padding: 12px; gap: 12px; }
  .home-cols { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .hh h1 { font-size: 32px; }
  .hh-body { padding: 26px 20px 30px; min-height: 0; }
  .hh::before { display: none; }
  .hh p { font-size: 14px; }
  .home-foot { flex-direction: column; gap: 12px; text-align: center; }
  .hf-legal { justify-content: center; }
}
@media (max-width: 760px) {
  .hs-row { gap: 8px; }
  .stat.hs { padding: 12px; gap: 10px; }
  .hs-ico { width: 36px; height: 36px; }
  .hs-ico svg { width: 19px; height: 19px; }
  .stat.hs b { font-size: 22px; }
  .stat.hs small { display: none; }
  .hlist-head { padding: 12px; gap: 10px; }
  .hlist-head h2 { font-size: 16px; }
  .ht-row { grid-template-columns: 46px minmax(0, 1fr) 56px minmax(0, 1fr); padding: 10px 12px; }
  .ht-row .hchip { grid-column: 1 / -1; justify-self: center; }
  .ht-where { grid-column: 1 / -1; }
  .hh-actions .btn-lg { flex: 1; min-width: 0; }
}

/* ---------- главная v3: без повторов ---------- */
  font-style: normal; margin-left: 4px; padding: 1px 6px; border-radius: 4px; font-size: 10px; font-weight: 800;
  letter-spacing: .06em; text-transform: uppercase; color: var(--gold); background: rgba(232, 163, 61, .12); border: 1px solid rgba(232, 163, 61, .35);
}
  width: 34px; height: 34px; flex: none; display: grid; place-items: center; border-radius: 6px; font-style: normal;
  color: var(--dim); background: rgba(255, 255, 255, .04); border: 1px solid #262e3a;
}

.hh-now.is-open i { background: #3ecf6e; box-shadow: 0 0 10px #3ecf6e; animation: hh-pulse 1.8s ease-in-out infinite; }
.hh-meta { display: flex; flex-wrap: wrap; gap: 6px; margin: 4px 0 22px; }
.hh-meta span {
  padding: 4px 10px; border-radius: 4px; font-size: 12px; font-weight: 600; color: #d6dce5;
  background: rgba(10, 12, 16, .6); border: 1px solid rgba(255, 255, 255, .08); backdrop-filter: blur(4px);
}
.hh-progress { max-width: 420px; margin: -8px 0 22px; }
.hh-progress span { display: block; height: 6px; border-radius: 3px; background: rgba(255, 255, 255, .08); overflow: hidden; }
.hh-progress span::before {
  content: ''; display: block; height: 100%; width: var(--p); border-radius: inherit;
  background: linear-gradient(90deg, #a12a17, var(--accent-hot)); box-shadow: 0 0 12px rgba(255, 92, 58, .6);
  animation: hh-grow 1.2s cubic-bezier(.2, .8, .2, 1) both;
}
@keyframes hh-grow { from { width: 0; } }
.hh-progress small { display: block; margin-top: 7px; font-size: 12px; color: var(--muted); }
.hh-done { cursor: default; color: #52d983; border-color: rgba(62, 207, 110, .45); background: rgba(20, 50, 32, .7); }

.hh-side { width: 330px; }
.hh-reg, .hh-match {
  display: flex; gap: 18px; align-items: center; padding: 18px;
  background: rgba(10, 11, 14, .78); backdrop-filter: blur(8px);
  border: 1px solid rgba(255, 255, 255, .09); border-radius: 10px; color: inherit; text-decoration: none;
  box-shadow: 0 20px 40px -24px #000;
}
.hh-ring { position: relative; width: 104px; height: 104px; flex: none; }
.hh-ring svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.hh-ring circle { fill: none; stroke-width: 9; }
.hh-ring .bg { stroke: rgba(255, 255, 255, .07); }
.hh-ring .fg {
  stroke: var(--accent-hot); stroke-linecap: round;
  stroke-dashoffset: var(--off); filter: drop-shadow(0 0 6px rgba(255, 92, 58, .7));
  animation: hh-ring 1.4s cubic-bezier(.2, .8, .2, 1) both;
}
@keyframes hh-ring { from { stroke-dashoffset: var(--full); } }
.hh-ring > span { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.hh-ring b { font-size: 28px; font-weight: 800; line-height: 1; font-variant-numeric: tabular-nums; }
.hh-ring small { font-size: 11px; color: var(--muted); margin-top: 3px; }
.hh-reg-info { min-width: 0; flex: 1; }
.hh-count { display: flex; gap: 4px; margin: 8px 0 12px; min-height: 42px; align-items: center; min-width: 0; }
.hh-count span { flex: 1 1 0; display: flex; flex-direction: column; align-items: center; min-width: 0; padding: 5px 2px; border-radius: 6px; background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 255, 255, .07); }
.hh-count b { font-size: 16px; font-weight: 800; line-height: 1; font-variant-numeric: tabular-nums; }
.hh-count small { font-size: 9.5px; color: var(--dim); margin-top: 3px; }
.hh-count em { font-style: normal; font-size: 13px; color: var(--muted); }
.hh-faces { display: flex; align-items: center; }
.hh-faces .avatar { width: 28px; height: 28px; font-size: 8.5px; letter-spacing: 0; overflow: hidden; border-radius: 50%; box-shadow: 0 0 0 2px #0c0e12; }
.hh-faces .avatar + .avatar, .hh-faces .more { margin-left: -8px; }
.hh-faces .more { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font-size: 10.5px; font-weight: 700; background: #1d232d; box-shadow: 0 0 0 2px #0c0e12; }
.hh-faces-note { display: block; margin-top: 6px; font-size: 11px; color: var(--dim); }
.hh-match { flex-direction: column; align-items: stretch; gap: 10px; }
.hh-match:hover { border-color: rgba(255, 92, 58, .5); }
.hh-vs { display: flex; align-items: center; gap: 10px; }
.hh-vs b { flex: 1; min-width: 0; font-size: 15px; line-height: 1.2; overflow-wrap: anywhere; }
.hh-vs b:last-child { text-align: right; }
.hh-vs em { font-style: normal; font-weight: 800; font-size: 20px; padding: 2px 10px; border-radius: 5px; background: rgba(255, 92, 58, .14); color: #fff; font-variant-numeric: tabular-nums; }
.hh-match small { font-size: 11.5px; color: var(--muted); }

/* пул набора */
.hp-sum { font-size: 12.5px; color: var(--muted); }
.hp-body { display: grid; grid-template-columns: minmax(0, 300px) minmax(0, 1fr); gap: 22px; padding: 4px 16px 18px; }
.hp-roles { display: flex; flex-direction: column; gap: 9px; }
.hp-roles .eyebrow { margin-bottom: 4px; }
.hp-role { display: grid; grid-template-columns: 22px 70px minmax(0, 1fr) 24px auto; align-items: center; gap: 9px; font-size: 12.5px; }
.hp-name { color: #c4cbd6; }
.hp-bar { height: 7px; border-radius: 4px; background: rgba(255, 255, 255, .06); overflow: hidden; }
.hp-bar i { display: block; height: 100%; width: var(--w); border-radius: inherit; background: linear-gradient(90deg, #2f6f4a, #52d983); animation: hh-grow 1.1s cubic-bezier(.2, .8, .2, 1) both; }
.hp-role b { text-align: right; font-variant-numeric: tabular-nums; }
.hp-role em { font-style: normal; font-size: 10px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: #f0b85c; }
.hp-role.is-scarce .hp-bar i { background: linear-gradient(90deg, #7a4a12, #f0b85c); }
.hp-people { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; align-content: start; }
.hp-card {
  display: flex; align-items: center; gap: 10px; padding: 8px 10px; min-width: 0;
  background: rgba(20, 24, 32, .75); border: 1px solid #242c38; border-radius: 6px; color: inherit; text-decoration: none;
  transition: border-color .2s, transform .2s;
}
.hp-card:hover { border-color: rgba(255, 92, 58, .45); transform: translateY(-1px); }
.hp-card .avatar { width: 34px; height: 34px; border-radius: 50%; flex: none; }
.hp-card .grow { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.hp-card b { font-size: 13px; font-weight: 650; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hp-card .role { width: 16px; height: 16px; font-size: 9.5px; }
.hp-mmr { font-weight: 800; font-size: 13px; color: var(--muted); font-variant-numeric: tabular-nums; }
.hp-mmr.top { color: var(--gold); }
.hp-empty { grid-column: 1 / -1; padding: 22px; text-align: center; font-size: 12.5px; color: var(--dim); border: 1px dashed #2a323e; border-radius: 6px; }

/* список турниров: компактные строки вместо повторяющихся картинок */
.hlist-filter small { color: var(--dim); font-weight: 700; margin-left: 2px; }
.tl-row {
  display: flex; align-items: center; gap: 14px; padding: 12px 16px; color: inherit; text-decoration: none;
  border-top: 1px solid #1a222c; transition: background-color .2s;
}
.tl-row:hover { background: rgba(255, 255, 255, .025); }
.tl-date {
  width: 50px; height: 50px; flex: none; display: flex; flex-direction: column; align-items: center; justify-content: center;
  border-radius: 7px; background: rgba(255, 255, 255, .04); border: 1px solid #262e3a;
}
.tl-date b { font-size: 19px; font-weight: 800; line-height: 1; }
.tl-date small { font-size: 10px; color: var(--dim); text-transform: uppercase; letter-spacing: .06em; margin-top: 3px; }
.st-open .tl-date { border-color: rgba(62, 207, 110, .35); }
.st-live .tl-date { border-color: rgba(255, 92, 58, .45); }
.tl-thumb { width: 50px; height: 50px; flex: none; border-radius: 7px; background: var(--cover) center / cover; }
.tl-main { flex: 1; min-width: 0; }
.tl-main b { display: block; font-size: 15px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tl-main small { font-size: 12px; color: var(--dim); }
.tl-fill { width: 130px; flex: none; }
.tl-fill i { display: block; height: 5px; border-radius: 3px; background: rgba(255, 255, 255, .07); overflow: hidden; }
.tl-fill i::before { content: ''; display: block; height: 100%; width: var(--w); background: linear-gradient(90deg, #a12a17, var(--accent-hot)); }
.st-done .tl-fill i::before { background: #3a4250; }
.tl-fill small { display: block; margin-top: 5px; font-size: 11px; color: var(--muted); text-align: right; font-variant-numeric: tabular-nums; }
.tl-row .hchip { width: 92px; justify-content: center; }

/* последние результаты */
.hr-row { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 10px; align-items: center; padding: 9px 14px; font-size: 12.5px; color: var(--muted); border-bottom: 1px solid rgba(26, 34, 44, .7); text-decoration: none; }
.hr-row:last-child { border-bottom: 0; }
.hr-row:hover { background: rgba(255, 255, 255, .025); }
.hr-row span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hr-row span:first-child { text-align: right; }
.hr-row .win { color: #fff; font-weight: 700; }
.hr-row em { font-style: normal; font-weight: 800; color: #fff; padding: 2px 8px; border-radius: 4px; background: rgba(255, 255, 255, .05); font-variant-numeric: tabular-nums; }

@media (max-width: 1080px) {
  .hh-side { width: auto; }
  .hp-body { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
  .hh-reg { gap: 14px; padding: 14px; }
  .hh-ring { width: 88px; height: 88px; }
  .hh-ring b { font-size: 23px; }
  .hp-people { grid-template-columns: minmax(0, 1fr); }
  .hp-role { grid-template-columns: 22px 64px minmax(0, 1fr) 22px auto; }
  .tl-fill { display: none; }
  .tl-row .hchip { width: auto; }
  .tl-row .cp-go { display: none; }
  .hp-sum { flex-basis: 100%; order: 3; }
}

/* лента чата: срез при прокрутке уходит в затухание, а не обрывается по линии вкладок */
.chat-body {
  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 16px, #000 calc(100% - 10px), transparent 100%);
  mask-image: linear-gradient(180deg, transparent 0, #000 16px, #000 calc(100% - 10px), transparent 100%);
}

/* лобби-боты в узкой левой колонке: 2×2 и подписи в одну строку */
.home-left .bot-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.home-left .bot-stats div { display: flex; align-items: baseline; gap: 8px; padding: 10px 14px; text-align: left; min-width: 0; }
.home-left .bot-stats div + div { border-left: 0; }
.home-left .bot-stats div:nth-child(even) { border-left: 1px solid #1a222c; }
.home-left .bot-stats div:nth-child(n + 3) { border-top: 1px solid #1a222c; }
.home-left .bot-stats b { display: inline; font-size: 17px; }
.home-left .bot-stats span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; letter-spacing: .06em; }

/* ================= общий вид всех страниц ================= */
:root {
  --bg-grad:
    radial-gradient(1100px 620px at 50% -160px, rgba(160, 45, 22, .2), transparent 70%),
    radial-gradient(800px 600px at 100% 100%, rgba(120, 30, 18, .1), transparent 70%),
    radial-gradient(700px 500px at 0% 60%, rgba(60, 70, 95, .1), transparent 70%),
    repeating-linear-gradient(125deg, transparent 0 46px, rgba(255, 120, 60, .016) 46px 47px),
    linear-gradient(180deg, #0e1117 0%, #0a0c11 45%, #07090d 100%);
}


/* шапка: без переносов на ноутбуках */
.client-tabs a, .user-chip span, .home-brand { white-space: nowrap; }
@media (max-width: 1600px) {
  .home-brand { display: none; }
}
@media (max-width: 1500px) and (min-width: 761px) {
  .client-tabs a { padding: 0 15px; letter-spacing: .07em; }
  .home .search, .search { width: 220px; }
}

/* заголовок страницы — баннер */
.page-head {
  position: relative; overflow: hidden; align-items: center;
  padding: 24px 28px; border: 1px solid #2a1d1a; border-radius: 12px;
  background:
    radial-gradient(420px 220px at 88% 0%, rgba(255, 92, 58, .26), transparent 70%),
    radial-gradient(500px 260px at 100% 120%, rgba(160, 40, 20, .3), transparent 70%),
    repeating-linear-gradient(115deg, transparent 0 34px, rgba(255, 120, 60, .03) 34px 36px),
    linear-gradient(120deg, rgba(14, 12, 14, .92), rgba(28, 14, 12, .9));
  box-shadow: 0 24px 50px -32px rgba(0, 0, 0, .9);
}
.page-head::before {
  content: ''; position: absolute; left: 0; top: 18px; bottom: 18px; width: 3px;
  background: linear-gradient(180deg, transparent, var(--accent-hot), transparent);
}
.page-head::after {
  content: ''; position: absolute; right: -40px; bottom: -70px; width: 220px; height: 220px; pointer-events: none;
  background: url("/assets/img/logo.webp") center / contain no-repeat;
  opacity: .05; transform: rotate(-12deg);
}
.page-head > * { position: relative; z-index: 1; }
.page-head h1 { font-size: 28px; letter-spacing: -.01em; }

/* баннер турнира на страницах турниров и матчей */
.hero {
  border-color: #2c1d19; border-radius: 12px;
  background:
    linear-gradient(100deg, rgba(9, 10, 13, .97) 28%, rgba(9, 10, 13, .6) 60%, rgba(9, 10, 13, .25)),
    radial-gradient(520px 360px at 75% 40%, rgba(255, 110, 50, .42), transparent 70%),
    radial-gradient(600px 400px at 95% 100%, rgba(190, 40, 20, .45), transparent 70%),
    linear-gradient(120deg, #1a0d0a, #3a120b 60%, #1b0a08);
}
.hero .hero-inner::before {
  content: ''; position: absolute; left: -18px; top: 4px; width: 3px; height: 22px;
  background: var(--accent-hot); transform: skewX(-18deg);
}
.hero h1 { font-size: 38px; }
.hero-meta div b { font-size: 17px; }

/* шапка профиля и страницы игрока */
.panel:has(> [data-profile-head]), .panel:has(> [data-user-head]) {
  position: relative; overflow: hidden; border-color: #2c1d19;
  background:
    radial-gradient(520px 260px at 92% -10%, rgba(255, 92, 58, .24), transparent 70%),
    repeating-linear-gradient(115deg, transparent 0 34px, rgba(255, 120, 60, .03) 34px 36px),
    linear-gradient(120deg, rgba(14, 12, 14, .94), rgba(30, 14, 12, .92));
}
:is([data-profile-head], [data-user-head]) { padding: 26px 28px; }
:is([data-profile-head], [data-user-head]) .avatar.xl {
  border-radius: 50%; box-shadow: 0 0 0 3px #15181e, 0 0 0 5px rgba(255, 92, 58, .5), 0 16px 34px -12px rgba(255, 92, 58, .45);
}
:is([data-profile-head], [data-user-head]) h1 { font-size: 28px !important; }

/* плитки статистики с иконками на всех страницах */
.stat-row .stat.hs b { font-size: 26px; }

/* строки матчей: в узких панелях названия команд не сжимаются в ноль */
.match-row { flex-wrap: wrap; row-gap: 8px; }
.match-teams { flex: 1 1 300px; }
.match-meta { flex: 1 1 400px; min-width: 0; display: flex; align-items: center; gap: 14px; }
.match-meta .match-stage { flex: 1 1 140px; width: auto; }
.match-meta .match-actions { margin-left: auto; }

/* панели: мягкая подсветка краёв */
.panel { box-shadow: 0 24px 50px -36px rgba(0, 0, 0, .95); }
.panel-head { background: linear-gradient(180deg, rgba(255, 255, 255, .025), transparent); }

@media (max-width: 760px) {
  .page-head { padding: 18px 18px; border-radius: 10px; }
  .page-head h1 { font-size: 22px; }
  .page-head::after { width: 150px; height: 150px; right: -30px; bottom: -50px; }
  .hero h1 { font-size: 28px; }
  .hero .hero-inner::before { display: none; }
  :is([data-profile-head], [data-user-head]) { padding: 18px; }
}

@media (max-width: 760px) {
  .match-meta { order: 6; flex: 1 1 100%; flex-wrap: wrap; gap: 8px 10px; }
  .match-meta > div[style*="width"] { width: auto !important; }
  .match-meta .match-actions { flex: 1 1 100%; margin-left: 0; }
}

/* ================= телефоны и планшеты: без тяжёлых эффектов =================
   Размытие фона под каждой панелью пересчитывается на каждом кадре прокрутки;
   на телефонах и во встроенных браузерах это даёт мигание и недорисованные блоки. */
@media (hover: none), (max-width: 900px) {
  *, *::before, *::after { -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
  :root { --panel: rgba(12, 15, 21, .97); }
  .cpanel { background: rgba(12, 15, 21, .97); }
  .hh-meta span, .hh-reg, .hh-match { background: rgba(12, 12, 15, .92); }
  .chat-body { -webkit-mask-image: none; mask-image: none; }
  .page-head::after { display: none; }
  .hh-ring .fg, .hh-progress span::before { filter: none; box-shadow: none; }
  .fx-pre { opacity: 1 !important; transform: none !important; }
}

/* тренеры турнира в админке */
.coach-row { display: flex; align-items: center; gap: 10px; padding: 10px 16px; border-bottom: 1px solid var(--line-soft); }
.coach-row:last-child { border-bottom: 0; }
.coach-row .grow { flex: 1; min-width: 0; }
.coach-row b { display: block; font-size: 13px; }
.coach-row small { font-size: 11.5px; color: var(--dim); }


/* сетка: подпись под встречей */
.br-match > .br-slot:last-of-type { border-radius: 0; }
.br-foot {
  display: flex; align-items: center; gap: 8px; padding: 5px 10px;
  border-top: 1px solid var(--line-soft); font-size: 11px; color: var(--muted);
  background: rgba(255, 255, 255, .02); border-radius: 0 0 6px 6px; min-width: 0;
}
.br-when { font-variant-numeric: tabular-nums; white-space: nowrap; }
.br-when::before {
  content: ''; display: inline-block; width: 11px; height: 11px; margin: 0 5px -1px 0; background: currentColor; opacity: .7;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E") center / contain no-repeat;
}
.br-when.none { color: var(--dim); }
.br-bo { margin-left: auto; font-weight: 700; color: var(--gold); letter-spacing: .04em; }
.br-note { flex: 1 1 100%; order: 3; color: var(--dim); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.br-foot:has(.br-note) { flex-wrap: wrap; row-gap: 2px; }

/* окно встречи в админке */
body[data-admin] .bracket [data-mid] { cursor: pointer; }
body[data-admin] .br-match:hover { border-color: rgba(255, 92, 58, .55); }
.modal.mm { max-width: 520px; }
.mm-vs { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; gap: 14px; margin-bottom: 14px; }
.mm-team { display: flex; flex-direction: column; min-width: 0; }
.mm-team:last-child { text-align: right; }
.mm-team b { font-size: 16px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mm-team small { font-size: 11.5px; color: var(--dim); }
.mm-team.tbd b { color: var(--dim); font-style: italic; }
.mm-score { font-size: 22px; font-weight: 800; padding: 4px 14px; border-radius: 6px; background: rgba(255, 92, 58, .12); font-variant-numeric: tabular-nums; }
.mm-lobby { margin: -4px 0 14px; font-size: 12px; color: var(--muted); }
.mm-form { gap: 12px 14px; }

/* решение по заявке и отмена */
.entry-decided { margin-top: 14px; padding: 9px 12px; border-radius: 8px; font-size: 12.5px; font-weight: 600; }
.entry-decided.ok { color: #52d983; background: rgba(62, 207, 110, .08); border: 1px solid rgba(62, 207, 110, .3); }
.entry-decided.no { color: #f08a7e; background: rgba(199, 66, 54, .08); border: 1px solid rgba(199, 66, 54, .3); }
.entry-delete { color: #f08a7e; }
.entry-delete:hover { border-color: rgba(199, 66, 54, .6); background: rgba(199, 66, 54, .1); }

/* заявка: как участвуете и список команд */
.reg-join { display: inline-flex; flex-wrap: wrap; }
.tab-count:not(:empty) { margin-left: 6px; padding: 0 7px; border-radius: 10px; font-size: 10.5px; background: rgba(255, 92, 58, .18); color: #ff9a80; }
.groups { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 14px; }
.groups > .empty-state { grid-column: 1 / -1; }
.grp-card { display: flex; flex-direction: column; background: rgba(16, 19, 26, .9); border: 1px solid #242c38; border-radius: 10px; overflow: hidden; }
.grp-card.is-mine { border-color: rgba(255, 92, 58, .55); box-shadow: 0 0 0 3px rgba(255, 92, 58, .08); }
.grp-head { display: flex; align-items: center; gap: 12px; padding: 14px; border-bottom: 1px solid #1d242f;
  background: radial-gradient(260px 120px at 90% 0%, rgba(255, 92, 58, .14), transparent 70%); }
.grp-head .grow { flex: 1; min-width: 0; }
.grp-head b { display: block; font-size: 16px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.grp-head small { font-size: 11.5px; color: var(--dim); }
.grp-av { width: 46px; height: 46px; flex: none; border-radius: 10px; background: center / cover no-repeat; box-shadow: 0 0 0 1px rgba(255, 255, 255, .08); }
.grp-av.empty { display: grid; place-items: center; font-weight: 800; font-size: 15px; color: #fff;
  background: linear-gradient(135deg, #7a2a16, #2a0f0a); }
.grp-members, .grp-req { display: flex; flex-direction: column; padding: 6px 0; }
.grp-req { border-top: 1px dashed #2a323e; background: rgba(232, 163, 61, .04); }
.grp-req .eyebrow { padding: 6px 14px 2px; }
.grp-row { display: flex; align-items: center; gap: 9px; padding: 6px 14px; min-width: 0; }
.grp-row .grow { flex: 1; min-width: 0; display: flex; align-items: center; gap: 8px; }
.grp-row .grow b { font-size: 13px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.grp-row .role { width: 16px; height: 16px; font-size: 9.5px; }
.grp-cap { font-style: normal; font-size: 10px; font-weight: 800; color: var(--gold); margin-left: 4px; text-transform: uppercase; letter-spacing: .06em; }
.grp-note { padding: 8px 14px; font-size: 12px; color: var(--dim); border-top: 1px dashed #2a323e; }
.grp-actions { margin-top: auto; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; padding: 12px 14px; border-top: 1px solid #1d242f; }
.grp-actions label.btn { cursor: pointer; }
.grp-danger { color: #f08a7e; }
.tno.has-av { background: center / cover no-repeat; color: transparent; }
.avatar.team-av { background: center / cover no-repeat; }
@media (max-width: 760px) {
  .groups { grid-template-columns: minmax(0, 1fr); }
  .reg-join { display: flex; }
  .reg-join button { flex: 1 1 auto; }
}

/* подтверждение Telegram в анкете */
.tg-confirm { display: flex; align-items: center; gap: 10px; margin-top: 8px; padding: 10px 12px; border-radius: 8px;
  background: rgba(232, 163, 61, .07); border: 1px solid rgba(232, 163, 61, .35); }
.tg-confirm .grow { flex: 1; min-width: 0; }
.tg-confirm b { display: block; font-size: 12.5px; }
.tg-confirm small { display: block; font-size: 11px; color: var(--muted); }
.tg-ico { width: 26px; height: 26px; flex: none; display: grid; place-items: center; border-radius: 50%; font-weight: 800; font-size: 13px;
  color: #1a1208; background: var(--gold); }
.tg-confirm.is-wait .tg-ico { animation: hh-pulse 1.4s ease-in-out infinite; }
.tg-confirm.is-need { animation: tg-shake .5s ease; border-color: rgba(255, 92, 58, .8); }
@keyframes tg-shake { 20%, 60% { transform: translateX(-5px); } 40%, 80% { transform: translateX(5px); } }
.tg-confirm.is-ok { background: rgba(62, 207, 110, .07); border-color: rgba(62, 207, 110, .35); }
.tg-confirm.is-ok .tg-ico { background: #3ecf6e; color: #07140c; }
.tg-confirm .btn { flex: none; }
@media (max-width: 760px) {
  .tg-confirm { flex-wrap: wrap; }
  .tg-confirm .btn { flex: 1 1 100%; }
}

/* перестановка команд в первом раунде */
.mm-swap { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line-soft); display: flex; flex-direction: column; gap: 8px; }
.mm-swap > label { font-size: 11.5px; font-weight: 650; color: var(--muted); }
.mm-swap-row { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1.3fr) auto; align-items: center; gap: 8px; }
.mm-swap-row b { font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mm-swap-row span { color: var(--accent-hot); font-weight: 800; }
.mm-swap-row .select { padding: 7px 30px 7px 10px; font-size: 12.5px; background-position: calc(100% - 15px) 14px, calc(100% - 10px) 14px; }
@media (max-width: 560px) {
  .mm-swap-row { grid-template-columns: minmax(0, 1fr) auto; }
  .mm-swap-row .select { grid-column: 1 / -1; }
  .mm-swap-row .btn { grid-column: 1 / -1; }
}

/* сетка в админке: перетаскивание команд первого раунда */
.br-slot.br-drag { cursor: grab; }
.br-slot.br-drag:active { cursor: grabbing; }
.br-slot.dragging { opacity: .35; }
.bracket-wrap.is-dragging .br-slot.br-drop:not(.dragging) { box-shadow: inset 0 0 0 1px rgba(255, 92, 58, .35); }
.br-slot.drop-ok { background: rgba(255, 92, 58, .16) !important; box-shadow: inset 0 0 0 2px var(--accent-hot) !important; }

/* колокольчик уведомлений */
.bell { position: relative; }
.bell-btn { position: relative; width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%;
  background: rgba(255, 255, 255, .04); border: 1px solid #242c38; color: #c9d0dc; cursor: pointer; transition: .15s; }
.bell-btn:hover { color: #fff; border-color: rgba(255, 92, 58, .5); }
.bell-btn svg { width: 18px; height: 18px; }
.bell-count { position: absolute; top: -4px; right: -4px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px;
  display: grid; place-items: center; font-size: 10.5px; font-weight: 800; color: #fff; background: var(--accent-hot);
  box-shadow: 0 0 0 2px #0c0f14, 0 0 10px rgba(255, 92, 58, .6); }
.bell.has-ready .bell-btn { animation: bell-ring 2.4s ease-in-out infinite; }
@keyframes bell-ring { 0%, 70%, 100% { transform: rotate(0); } 75% { transform: rotate(14deg); } 80% { transform: rotate(-12deg); } 85% { transform: rotate(8deg); } 90% { transform: rotate(-4deg); } }
.bell-pop { position: absolute; right: 0; top: calc(100% + 10px); z-index: 95; width: 360px; max-width: calc(100vw - 24px);
  background: #10141b; border: 1px solid #2a323e; border-radius: 10px; box-shadow: 0 24px 50px -16px #000; overflow: hidden; }
.bell-head { display: flex; align-items: center; gap: 8px; padding: 12px 14px; border-bottom: 1px solid #1d242f; }
.bell-head .spacer { flex: 1; }
.bell-all { background: none; border: 0; color: var(--accent-hot); font-size: 12px; cursor: pointer; }
.bell-list { max-height: min(70vh, 520px); overflow-y: auto; }
.bell-item { display: block; padding: 11px 14px; border-bottom: 1px solid rgba(29, 36, 47, .8); color: inherit; text-decoration: none; }
.bell-item:hover { background: rgba(255, 255, 255, .03); }
.bell-item.unread { background: rgba(255, 92, 58, .06); box-shadow: inset 3px 0 0 var(--accent-hot); }
.bell-text { font-size: 12.5px; line-height: 1.45; color: #c9d0dc; word-wrap: break-word; }
.bell-text b { color: #fff; }
.bell-item small { display: block; margin-top: 4px; font-size: 10.5px; color: var(--dim); }
.bell-empty { padding: 28px 14px; text-align: center; font-size: 12.5px; color: var(--dim); }
.bell-ready { padding: 12px 14px; border-bottom: 1px solid #1d242f; background: rgba(232, 163, 61, .08); box-shadow: inset 3px 0 0 var(--gold); }
.bell-ready b { display: block; font-size: 13px; }
.bell-ready small { display: block; font-size: 11.5px; color: var(--muted); margin-top: 2px; }
.bell-ready-act { display: flex; gap: 8px; margin-top: 9px; }
.bell-ready-act .btn { flex: 1; }
@media (max-width: 760px) {
  .bell-btn { width: 34px; height: 34px; }
  .bell-pop { position: fixed; right: 12px; left: 12px; top: calc(var(--header-h) + 6px); width: auto; max-width: none; }
}

/* чек реди в окне встречи */
.mm-ready { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line-soft); }
.mm-ready-head { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.mm-ready-head label { font-size: 11.5px; font-weight: 650; color: var(--muted); }
.mm-ready-head .spacer { flex: 1; }
.mm-ready-sum { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-bottom: 10px; }
.mm-ready-sum small { font-size: 11px; }
.mm-ready-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.mm-ready-cols > div > b { display: block; font-size: 12.5px; margin-bottom: 6px; }
.mm-ready-row { display: flex; align-items: center; gap: 8px; padding: 3px 0; font-size: 12.5px; }
.mm-ready-row .grow { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rd { width: 18px; height: 18px; flex: none; display: grid; place-items: center; border-radius: 50%; font-style: normal; font-size: 11px; font-weight: 800; }
.rd.yes { background: rgba(62, 207, 110, .18); color: #52d983; }
.rd.no { background: rgba(199, 66, 54, .2); color: #f08a7e; }
.rd.wait { background: rgba(255, 255, 255, .06); color: var(--dim); }
.grp-av.sm { width: 32px; height: 32px; border-radius: 8px; font-size: 11px; }

/* готовность пула перед шафлом */
.pool-ready-head { flex-wrap: wrap; gap: 8px; }
.pool-ready-head .select { width: auto; min-width: 200px; height: 32px; padding-top: 0; padding-bottom: 0; }
.pool-rd-list { display: flex; flex-wrap: wrap; gap: 6px; }
.pool-rd {
  display: inline-flex; align-items: center; gap: 7px; padding: 4px 10px 4px 5px;
  background: var(--panel-2); border: 1px solid var(--line); border-radius: 30px; font-size: 12.5px; opacity: .55;
}
.pool-rd.in { opacity: 1; border-color: rgba(62, 207, 110, .35); }
.pool-rd .chip { padding: 1px 7px; font-size: 10.5px; }
@media (max-width: 640px) { .pool-ready-head .select { min-width: 0; flex: 1; } }

/* таймер неявки */
.queue-item.has-ns { flex-wrap: wrap; }
.ns-line {
  flex-basis: 100%; display: flex; align-items: center; flex-wrap: wrap; gap: 8px;
  padding: 9px 11px; margin-top: 2px; border-radius: 10px;
  background: var(--panel-2); border: 1px solid var(--line-soft);
}
.ns-line .select { width: auto; height: 30px; padding-top: 0; padding-bottom: 0; font-size: 12.5px; }
.ns-state { font-size: 12.5px; color: var(--muted); }
.ns-state b { color: var(--text, #fff); font-variant-numeric: tabular-nums; }
.ns-state.bad { color: #f08a7e; }
.ns-state.ok { color: #52d983; }
.ns-state small { color: var(--dim); }
.ns-alerts { display: grid; gap: 8px; margin-bottom: 14px; }
.ns-alert {
  display: flex; align-items: center; gap: 12px; padding: 11px 14px; border-radius: 12px;
  background: rgba(199, 66, 54, .12); border: 1px solid rgba(199, 66, 54, .45);
}
.ns-alert b { font-size: 13.5px; }
.ns-alert small { display: block; color: var(--muted); font-size: 12px; margin-top: 2px; }
.ns-ico {
  flex: none; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center;
  background: rgba(199, 66, 54, .3); color: #ffb2a8; font-weight: 800;
}
.ns-opt {
  display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; margin-bottom: 8px; cursor: pointer;
  border: 1px solid var(--line); border-radius: 10px; background: var(--panel-2);
}
.ns-opt:has(input:checked) { border-color: rgba(199, 66, 54, .6); }
.ns-opt input { margin-top: 3px; accent-color: #c74236; }
.ns-opt small { display: block; color: var(--dim); font-size: 11.5px; margin-top: 2px; }
.ns-modal-state { font-size: 13px; color: #f08a7e; margin: 0 0 12px; }
@media (max-width: 640px) {
  .ns-line .spacer { display: none; }
  .ns-alert { flex-wrap: wrap; }
}

/* ссылки на темы и сообщения форума */
a.forum-row { color: inherit; text-decoration: none; }
.forum-post { position: relative; scroll-margin-top: 90px; transition: background-color .6s, box-shadow .6s; }
.forum-post.is-target { background: rgba(232, 163, 61, .07); box-shadow: inset 3px 0 0 var(--gold); }
.post-link {
  position: absolute; top: 12px; right: 14px; font-size: 11.5px; color: var(--dim);
  text-decoration: none; padding: 2px 6px; border-radius: 6px; font-variant-numeric: tabular-nums;
}
.post-link:hover { color: var(--text, #fff); background: var(--panel-2); }
.forum-post .queue-main { padding-right: 34px; }
[data-topic-link] svg { vertical-align: -2px; }

/* правка сообщений форума */
.post-edit {
  margin-top: 6px; padding: 0; border: 0; background: none; cursor: pointer;
  color: var(--dim); font-size: 11.5px;
}
.post-edit:hover { color: var(--text, #fff); text-decoration: underline; }
.post-edit-bar { display: flex; gap: 8px; margin-top: 8px; }

/* ссылка на канал в плеере стрима: значок справа сверху, название выезжает при наведении */
.stream-link {
  position: absolute; top: 10px; right: 10px; z-index: 3;
  display: inline-flex; align-items: center; height: 34px; padding: 0 9px;
  border-radius: 17px; background: rgba(10, 12, 18, .72); border: 1px solid rgba(255, 255, 255, .12);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  color: #fff; text-decoration: none; font-size: 12.5px; font-weight: 600;
  transition: background-color .3s, border-color .3s, box-shadow .3s;
}
.stream-link svg { width: 16px; height: 16px; flex: none; color: #a970ff; }
.stream-link .sl-name {
  max-width: 0; opacity: 0; margin-left: 0; overflow: hidden; white-space: nowrap;
  transition: max-width .4s cubic-bezier(.22, .8, .24, 1), opacity .25s ease, margin-left .4s cubic-bezier(.22, .8, .24, 1);
}
.stream-link:hover, .stream-link:focus-visible {
  background: rgba(24, 16, 40, .88); border-color: rgba(169, 112, 255, .55);
  box-shadow: 0 8px 22px -12px rgba(169, 112, 255, .8);
}
.stream-link:hover .sl-name, .stream-link:focus-visible .sl-name {
  max-width: 260px; opacity: 1; margin-left: 8px; transition-delay: 0s, .08s, 0s;
}

/* быстрые плитки на обзоре админки */
.quick-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; margin-bottom: 22px; }
.qt {
  display: flex; flex-direction: column; align-items: flex-start; gap: 4px; text-align: left; cursor: pointer;
  padding: 14px 15px; border-radius: var(--radius); border: 1px solid var(--line); background: var(--panel);
  color: var(--text, #fff); font: inherit; transition: border-color .2s, transform .2s, box-shadow .25s, background-color .2s;
}
.qt:hover { border-color: #3a475a; transform: translateY(-2px); box-shadow: 0 16px 30px -22px rgba(0, 0, 0, .9); }
.qt-title { font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--dim); font-weight: 700; }
.qt-val { font-size: 24px; font-weight: 700; line-height: 1.15; font-variant-numeric: tabular-nums; }
.qt small { font-size: 11.5px; color: var(--muted); }
.qt.is-hot { border-color: rgba(255, 92, 58, .5); background: linear-gradient(160deg, rgba(255, 92, 58, .1), var(--panel) 60%); }
.qt.is-hot .qt-title { color: #ff9a80; }

/* переход к панели: короткая подсветка */
.panel { scroll-margin-top: 84px; }
.jump-flash { animation: jump-flash 1.6s ease-out; }
@keyframes jump-flash { 0%, 35% { box-shadow: 0 0 0 2px rgba(255, 92, 58, .7), 0 0 28px rgba(255, 92, 58, .25); } 100% { box-shadow: 0 0 0 0 rgba(255, 92, 58, 0); } }

/* «Найти» / Ctrl+K */
.jump-open { align-self: flex-end; height: 40px; gap: 8px; color: var(--muted); }
.jump-open svg { width: 15px; height: 15px; }
kbd {
  display: inline-block; padding: 1px 6px; border-radius: 5px; border: 1px solid var(--line);
  background: var(--panel-2); color: var(--dim); font: 600 10.5px/1.5 var(--mono, monospace);
}
.jump-back { align-items: flex-start; padding-top: 12vh; }
.jump-modal { width: min(560px, calc(100vw - 32px)); padding: 0; overflow: hidden; }
.jump-input { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-bottom: 1px solid var(--line); }
.jump-input svg { width: 17px; height: 17px; color: var(--dim); flex: none; }
.jump-input input { flex: 1; min-width: 0; background: none; border: 0; outline: 0; color: var(--text, #fff); font-size: 15px; }
.jump-list { max-height: min(420px, 55vh); overflow-y: auto; padding: 6px; }
.jump-sec { padding: 10px 10px 4px; font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--dim); font-weight: 700; }
.jump-item {
  display: flex; align-items: center; gap: 10px; width: 100%; padding: 9px 10px; border: 0; border-radius: 8px;
  background: none; color: var(--text, #fff); font: inherit; font-size: 13.5px; text-align: left; cursor: pointer;
}
.jump-item small { margin-left: auto; color: var(--dim); font-size: 11.5px; }
.jump-item.is-on { background: var(--panel-3); box-shadow: inset 2px 0 0 var(--accent-hot); }
.jump-empty { padding: 22px; text-align: center; color: var(--dim); font-size: 13px; }
.jump-foot { padding: 9px 14px; border-top: 1px solid var(--line); font-size: 11.5px; color: var(--dim); }
@media (max-width: 760px) { .jump-open kbd, .jump-open span { display: none; } }

/* команды на странице турнира */
.grp-free { color: var(--dim); font-size: 12px; justify-content: center; }

/* плитки обзора: ровные ряды при любом числе (7 в ряд, 4+3, на телефоне по две) */
#tab-overview { container-type: inline-size; }
.quick-grid { grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 10px; }
.quick-grid .qt { padding: 13px 12px; min-width: 0; }
.quick-grid .qt small { overflow-wrap: anywhere; }
@container (max-width: 940px) {
  .quick-grid { grid-template-columns: repeat(12, minmax(0, 1fr)); }
  .quick-grid > .qt { grid-column: span 3; }
  .quick-grid > .qt:nth-child(n+5) { grid-column: span 4; }
}
@container (max-width: 540px) {
  .quick-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .quick-grid > .qt, .quick-grid > .qt:nth-child(n+5) { grid-column: auto; }
  .quick-grid > .qt:last-child:nth-child(odd) { grid-column: 1 / -1; }
}

/* проверка компьютера: страница, плашка, заметка в анкете */
.check-steps { margin: 0; padding: 0; list-style: none; counter-reset: step; display: grid; gap: 14px; }
.check-steps li { counter-increment: step; display: grid; grid-template-columns: 34px 1fr; column-gap: 12px; row-gap: 3px; }
.check-steps li::before {
  content: counter(step); grid-row: span 2; width: 34px; height: 34px; border-radius: 50%;
  display: grid; place-items: center; font-weight: 800; color: #fff;
  background: linear-gradient(160deg, var(--accent-hot), #8d2415); box-shadow: 0 6px 16px -8px var(--accent-hot);
}
.check-steps b { font-size: 14px; padding-top: 6px; }
.check-steps span { color: var(--muted); font-size: 13px; line-height: 1.5; }
.check-need {
  display: flex; flex-direction: column; gap: 4px; padding: 14px 16px; margin-bottom: 16px;
  border-radius: var(--radius); border: 1px solid rgba(232, 163, 61, .45); background: rgba(232, 163, 61, .08);
}
.check-need span { color: var(--muted); font-size: 13px; }
.check-need a { color: var(--gold); }
.check-need.is-held { border-color: rgba(199, 66, 54, .55); background: rgba(199, 66, 54, .1); }
.check-need.is-ok { border-color: rgba(62, 207, 110, .45); background: rgba(62, 207, 110, .07); }
.check-banner {
  display: flex; align-items: center; gap: 12px; padding: 11px 14px; margin-bottom: 16px;
  border-radius: 12px; border: 1px solid rgba(232, 163, 61, .5); background: rgba(232, 163, 61, .09);
  color: inherit; text-decoration: none; transition: border-color .2s, background-color .2s;
}
.check-banner:hover { border-color: rgba(232, 163, 61, .8); }
.check-banner.is-held { border-color: rgba(199, 66, 54, .6); background: rgba(199, 66, 54, .12); }
.check-banner b { font-size: 13.5px; }
.check-banner small { display: block; color: var(--muted); font-size: 12px; margin-top: 2px; }
.check-banner .cb-ico { font-size: 20px; }
.check-note {
  display: flex !important; flex-direction: row !important; align-items: center; gap: 10px;
  padding: 10px 12px; border-radius: 10px; border: 1px solid rgba(232, 163, 61, .45); background: rgba(232, 163, 61, .08);
  font-size: 13px;
}
@media (max-width: 640px) { .check-banner { flex-wrap: wrap; } .check-banner .btn { width: 100%; } }

/* на узком экране кнопка «Скачать проверку» — сверху, над инструкцией */
@media (max-width: 1240px) { [data-check-page] .g-main > aside { order: -1; } }

/* кастеры */
.caster-add { display: flex; gap: 8px; flex-wrap: wrap; }
.caster-add .input { flex: 1 1 160px; min-width: 0; }
.caster-row { flex-wrap: wrap; }
.caster-row .switch-row { display: flex; align-items: center; gap: 8px; padding: 0; background: none; border: 0; }
.caster-row .switch-row .txt b { font-size: 12px; font-weight: 500; color: var(--muted); }

/* поле скриншота, когда организатор его попросил */
[data-reg-shot-card].shot-need {
  padding: 12px; border-radius: 12px; border: 1px solid rgba(232, 163, 61, .6); background: rgba(232, 163, 61, .07);
  animation: shot-need 1.6s ease-out 2;
}
@keyframes shot-need { 0%, 40% { box-shadow: 0 0 0 3px rgba(232, 163, 61, .35); } 100% { box-shadow: 0 0 0 0 rgba(232, 163, 61, 0); } }

/* своя команда на странице турнира */
.my-team {
  display: flex; align-items: center; gap: 14px; padding: 14px 16px; margin-bottom: 16px;
  border-radius: var(--radius); border: 1px solid rgba(232, 163, 61, .5);
  background: linear-gradient(120deg, rgba(232, 163, 61, .12), rgba(232, 163, 61, .03));
}
.my-team .tno { width: 44px; height: 44px; font-size: 16px; }
.my-team small { display: block; font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--gold); font-weight: 700; }
.my-team b { display: block; font-size: 18px; margin: 2px 0; }
.my-team em { font-style: normal; color: var(--muted); font-size: 12.5px; }
.mix-team.is-mine { border-color: rgba(232, 163, 61, .6); box-shadow: 0 0 0 3px rgba(232, 163, 61, .1); }
.mix-row.is-me { background: rgba(232, 163, 61, .08); }
.mix-row.is-me b { color: var(--gold); }
.my-team-chip { cursor: pointer; border: 0; font: inherit; }
.mix-team { scroll-margin-top: 90px; }

/* приём проверок */
.check-window { display: flex; align-items: center; gap: 8px; min-height: 40px; }
.check-closed {
  display: flex; flex-direction: column; gap: 4px; padding: 12px; border-radius: 10px;
  border: 1px solid var(--line); background: var(--panel-2); font-size: 13px;
}
.check-closed span { color: var(--muted); font-size: 12.5px; line-height: 1.45; }

/* «Будете играть?» прямо на сайте */
.ready-ask { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ready-q { font-weight: 700; font-size: 14px; margin-right: 2px; }
.ready-ask.is-yes .ready-done { border-color: rgba(62, 207, 110, .5); color: #52d983; }
.ready-ask.is-no .ready-done { border-color: rgba(199, 66, 54, .5); color: #f08a7e; }
.reg-ready { margin-top: 10px; }

/* чаты турнира в админке */
.admin-chat { display: grid; grid-template-columns: 280px minmax(0, 1fr); min-height: 560px; overflow: hidden; }
.achat-rooms { border-right: 1px solid var(--line); overflow-y: auto; max-height: 72vh; padding: 6px; }
.achat-room {
  display: grid; grid-template-columns: 1fr auto; gap: 2px 8px; width: 100%; text-align: left; cursor: pointer;
  padding: 9px 10px; border: 0; border-radius: 8px; background: none; color: var(--text, #fff); font: inherit;
}
.achat-room:hover { background: var(--panel-2); }
.achat-room.is-active { background: var(--panel-3); box-shadow: inset 2px 0 0 var(--accent-hot); }
.achat-room-head { display: flex; align-items: center; gap: 6px; min-width: 0; }
.achat-room-head b { font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.achat-room-head em { font-style: normal; color: var(--dim); font-size: 11px; }
.achat-count { font-size: 10.5px; padding: 0 6px; border-radius: 9px; background: var(--panel-3); color: var(--muted); }
.achat-room small { grid-column: 1; color: var(--dim); font-size: 11.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.achat-room time { grid-column: 2; grid-row: 1 / span 2; align-self: center; color: var(--dim); font-size: 10.5px; }
.achat-main { display: flex; flex-direction: column; min-width: 0; }
.achat-body { flex: 1; overflow-y: auto; padding: 10px 14px; max-height: 60vh; min-height: 360px; }
.achat-input { display: flex; gap: 8px; padding: 10px 14px; border-top: 1px solid var(--line); }
.achat-input .textarea { flex: 1; min-height: 44px; resize: vertical; }
@media (max-width: 860px) {
  .admin-chat { grid-template-columns: 1fr; }
  .achat-rooms { border-right: 0; border-bottom: 1px solid var(--line); max-height: 220px; }
}

/* связь с игроком: Telegram / Steam */
.contact-row { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.contact-btn { display: inline-flex; align-items: center; gap: 6px; }
.contact-btn svg { width: 14px; height: 14px; }
.contact-btn[title="Telegram"] { border-color: rgba(42, 171, 238, .45); color: #6cc6f5; }
.mc-links { display: inline-flex; gap: 4px; margin-left: auto; margin-right: 6px; }
.mc-link {
  display: grid; place-items: center; width: 24px; height: 24px; border-radius: 6px;
  background: var(--panel-2); border: 1px solid var(--line); color: var(--muted); transition: color .2s, border-color .2s;
}
.mc-link svg { width: 13px; height: 13px; }
.mc-link:hover { color: #fff; border-color: #3a475a; }
.mc-link[title="Telegram"]:hover { color: #6cc6f5; border-color: rgba(42, 171, 238, .6); }

/* отметка «на проверке» в строке состава — компактно, чтобы ник не обрезался */
.held-mark { padding: 0 5px; font-size: 11px; line-height: 18px; }
.mix-row b { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* замена в панели набора */
.draft-swap-bar {
  display: flex; align-items: center; gap: 8px; padding: 8px 10px; margin: 6px 0;
  border-radius: 8px; border: 1px solid rgba(232, 163, 61, .5); background: rgba(232, 163, 61, .08); font-size: 12.5px;
}
.draft-row .btn.is-on { border-color: rgba(232, 163, 61, .7); color: var(--gold); }
.draft-row .mc-links { margin-left: 0; }

/* документы: политика и согласие */
.legal h2 { font-size: 16px; margin: 22px 0 8px; }
.legal p, .legal li { color: var(--muted); font-size: 14px; line-height: 1.65; }
.legal ul { padding-left: 20px; margin: 6px 0; }
.legal a { color: var(--gold); }
.legal-meta { padding: 10px 12px; border-radius: 8px; background: var(--panel-2); border: 1px solid var(--line); }
.legal-meta b { color: var(--text, #fff); font-weight: 600; }
.consent-modal { width: min(480px, calc(100vw - 32px)); }
.consent-lead { color: var(--muted); font-size: 13.5px; margin: 0 0 14px; }
.consent-check { display: flex; gap: 10px; align-items: flex-start; font-size: 13.5px; line-height: 1.5; cursor: pointer; }
.consent-check input { margin-top: 3px; width: 17px; height: 17px; accent-color: var(--accent-hot); flex: none; }
.consent-check a, .reg-privacy a, .privacy-notice a { color: var(--gold); }
.btn.is-off { opacity: .45; pointer-events: none; }
.privacy-notice {
  position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 60; max-width: 760px; margin: 0 auto;
  display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 12px;
  background: rgba(16, 19, 26, .97); border: 1px solid rgba(232, 163, 61, .5); box-shadow: 0 18px 40px -20px #000; font-size: 13px;
}
@media (max-width: 760px) { .privacy-notice { bottom: 76px; flex-wrap: wrap; } }
/* ограничения в профиле */
.mute-form { display: grid; gap: 8px; margin-top: 12px; }
.mute-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.forum-block { color: #f08a7e; font-size: 13px; }

/* удаление аккаунта в карточке «Права» */
.hold-box.acc-del { margin-top: 10px; border-color: rgba(229, 72, 77, .35); }
.hold-box.acc-del .hint { display: block; margin-top: 2px; font-size: 12px; }

/* админка: карточки заявленных команд */
.ga-card + .ga-card { border-top: 1px solid var(--line, #1b222c); }
.ga-head { cursor: pointer; border: 0 !important; }
.ga-head:hover { background: rgba(255, 255, 255, .02); }
.ga-caret { color: var(--muted); font-size: 12px; transition: transform .2s; margin-left: 6px; }
.ga-card.open .ga-caret { transform: rotate(180deg); }
.ga-body { padding: 0 16px 14px 16px; }
.ga-body .grp-row .btn { padding: 3px 8px; }
.ga-add { display: flex; gap: 8px; margin-top: 10px; }
.ga-add .select { flex: 1; min-width: 0; }
.ga-body .grp-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 12px; }
.ga-body .grp-actions .spacer { flex: 1; }
.ga-code { font-size: 12px; }
.ga-new { display: flex; flex-wrap: wrap; gap: 8px; padding: 12px 16px; border-bottom: 1px solid var(--line, #1b222c); }
.ga-new .select, .ga-new .input { flex: 1 1 160px; min-width: 0; }

/* админка: разделы меню и блок «Как собрать команды» */
.admin-nav .nav-sec {
  display: block; padding: 12px 12px 4px; font-size: 10.5px; font-weight: 700;
  letter-spacing: .08em; text-transform: uppercase; color: var(--muted); opacity: .7;
}
.admin-nav .nav-sec:first-child { padding-top: 4px; }
.admin-nav button[hidden] { display: none; }
.mix-sub { border-top: 1px solid var(--line); }
@media (max-width: 980px) {
  .g-side .admin-nav .nav-sec { display: none; }
}
[data-pool-ready] { max-height: 236px; overflow-y: auto; scrollbar-width: thin; }

/* суммарный MMR в карточке заявленной команды */
.grp-pts { flex: none; font-size: 12.5px; font-weight: 700; color: var(--gold); font-variant-numeric: tabular-nums; white-space: nowrap; }

/* проверки компьютера: решение организатора */
.check-decide { margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--line); }
.check-decide-btns { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.cb-head { flex-wrap: wrap; gap: 8px; }
.cb-row { display: flex; align-items: center; gap: 12px; padding: 11px 16px; border-top: 1px solid var(--line); }
.cb-row .grow { flex: 1; min-width: 0; }
.cb-row .grow b { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; font-size: 13.5px; }
.cb-result { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: 4px; }
.cb-result small { color: var(--dim); font-size: 12px; }
.cb-acts { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; flex: none; max-width: 50%; }
@media (max-width: 760px) {
  .cb-row { flex-wrap: wrap; }
  .cb-acts { max-width: none; width: 100%; justify-content: flex-start; }
}

/* заявки: основа / слоты */
.slots-line { font-size: 12.5px; color: var(--muted); white-space: nowrap; }
.slots-line b { color: var(--text); }
.slots-line b.delta-bad { color: var(--danger, #e5484d); }

/* пауза рассылки в Telegram */
.tg-pause-btn.is-paused { border-color: rgba(232, 163, 61, .6); color: var(--gold); background: rgba(232, 163, 61, .08); }
.tg-paused-box { display: flex; flex-direction: column; gap: 6px; margin: 12px 16px 0; padding: 12px 14px;
  border: 1px solid rgba(232, 163, 61, .4); border-radius: var(--radius-sm); background: rgba(232, 163, 61, .06); }
.tg-paused-box b { color: var(--gold); }
.tg-paused-box span { font-size: 12.5px; color: var(--muted); }
.tg-paused-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }

/* строка игрока в составе: ник не съедают кнопки ★ ⇄ и контакты */
.mix-row { position: relative; gap: 8px; }
.mix-row .mmr { flex: none; min-width: 34px; text-align: right; }
.mr-acts { display: inline-flex; align-items: center; gap: 4px; flex: none; }
.mr-acts .mc-links { margin: 0; }
.mr-acts [data-make-captain] { opacity: .75; }
@media (hover: hover) and (min-width: 981px) {
  .mr-acts {
    position: absolute; right: 54px; top: 50%; transform: translateY(-50%);
    padding-left: 22px; background: linear-gradient(90deg, transparent, var(--panel) 18px);
    opacity: 0; pointer-events: none; transition: opacity .12s;
  }
  .mix-row:hover .mr-acts, .mix-row:focus-within .mr-acts { opacity: 1; pointer-events: auto; }
  .mix-row.is-me .mr-acts { background: linear-gradient(90deg, transparent, #1a1712 18px); }
}

/* «Написать всем» */
.bc-modal { width: min(560px, 100%); }
.bc-modal .select { width: 100%; }
.bc-count { margin-top: 10px; font-size: 12.5px; color: var(--muted); line-height: 1.5; }
.bc-count b { color: var(--text); }

/* отметка чек реди в выборе игроков */
.rd-mark { flex: none; font-size: 12px; line-height: 1; cursor: default; }
.rd-mark.wait { opacity: .65; }
.draft-row .rd-mark, .mix-row .rd-mark { margin-right: 2px; }

/* позиция игрока — выпадающий список у капитана/тренера/организатора (цвета — от .role-1…5) */
.role-sel {
  appearance: none; -webkit-appearance: none; flex: none; width: 22px; height: 22px; padding: 0;
  text-align: center; text-align-last: center; border-radius: 5px; font-size: 11px; font-weight: 800; cursor: pointer;
  font-family: inherit;
}
.role-sel:hover, .role-sel:focus { outline: none; box-shadow: 0 0 0 2px rgba(232, 163, 61, .35); }
.role-sel option { background: var(--panel); color: var(--text); }

/* роли из заявки у запасного */
.sub-roles { display: inline-flex; flex: none; transform: scale(.85); transform-origin: left center; opacity: .85; }

/* окно встречи на странице турнира */
.br-match[data-mid] { cursor: pointer; }
.mi-modal { width: min(820px, 100%); }
.mi-meta { display: flex; flex-wrap: wrap; gap: 8px 16px; font-size: 13px; color: var(--muted); margin-bottom: 14px; }
.mi-meta .mi-note { color: var(--text); }
.mi-sides { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 14px; align-items: start; }
.mi-vs { align-self: center; color: var(--dim); font-weight: 800; font-size: 13px; }
.mi-side { border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 12px; background: var(--panel-2); min-width: 0; }
.mi-side.tbd { color: var(--muted); display: flex; flex-direction: column; gap: 4px; }
.mi-head { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.mi-head .grow { min-width: 0; }
.mi-head b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mi-head small { color: var(--dim); font-size: 11.5px; }
.mi-score { font-size: 22px; font-weight: 800; }
.mi-coach { font-size: 12.5px; margin-bottom: 6px; }
.mi-list { display: flex; flex-direction: column; gap: 4px; }
.mi-row { display: flex; align-items: center; gap: 8px; font-size: 12.5px; }
.mi-row b { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.mi-row.is-sub b { color: var(--muted); }
.mi-open { margin-top: 10px; width: 100%; }
@media (max-width: 700px) {
  .mi-sides { grid-template-columns: minmax(0, 1fr); }
  .mi-vs { justify-self: center; }
}

/* роли из заявки в фишках общего пула */
.pool-roles { display: inline-flex; transform: scale(.85); margin: 0 -4px; }

/* составы в окне встречи админки */
.mm .mi-sides { margin-top: 14px; }
.modal.mm:has(.mi-sides) { max-width: 780px; width: 100%; }

/* ---------- доска сетки: верх и низ слева, гранд-финал справа по центру ---------- */
.br-board { overflow-x: auto; padding: 4px 0 8px; }
.br-board-in { position: relative; display: flex; align-items: center; gap: 64px; min-width: max-content; }
.br-board-main { display: flex; flex-direction: column; gap: 10px; }
.br-board .bracket-wrap { overflow: visible; padding: 8px 2px 12px; }
.br-board .bracket { min-height: 0; }
.br-part { position: relative; z-index: 1; }
.br-part-head {
  display: flex; align-items: center; gap: 8px; margin: 0 0 4px 2px;
  font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--muted);
}
.br-part-head i { width: 8px; height: 8px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 10px rgba(255, 92, 58, .5); }
.br-lower { padding-top: 16px; border-top: 1px dashed var(--line); }
.br-lower .br-part-head i { background: #5c9de0; box-shadow: 0 0 10px rgba(92, 157, 224, .45); }
.br-final { align-self: center; padding: 14px 16px 6px; border-radius: var(--radius);
  background: radial-gradient(120% 90% at 50% 0%, rgba(232, 163, 61, .1), transparent 70%); border: 1px solid rgba(232, 163, 61, .22); }
.br-final .br-part-head { color: var(--gold); justify-content: center; }
.br-final .br-part-head i { background: var(--gold); box-shadow: 0 0 12px rgba(232, 163, 61, .6); }
.br-final .br-round-title { display: none; }
.br-final .br-col { min-width: 260px; }
.br-final .br-match { border-color: rgba(232, 163, 61, .5); box-shadow: 0 0 0 1px rgba(232, 163, 61, .15), 0 12px 32px -12px rgba(232, 163, 61, .45); }
.br-final .br-slot { padding: 10px 12px; font-size: 13.5px; }
.br-final .br-match-tag { border-color: rgba(232, 163, 61, .5); color: var(--gold); }
svg.br-board-links { position: absolute; inset: 0; pointer-events: none; z-index: 0; overflow: visible; }
svg.br-board-links path.up { stroke: rgba(232, 163, 61, .45); }
svg.br-board-links path.low { stroke: rgba(92, 157, 224, .4); }
.br-part[hidden] { display: none; }
/* сетка не собрана: одна заглушка вместо трёх */
.br-lower:has(.empty-state), .br-final:has(.empty-state) { display: none; }
.br-upper:has(.empty-state) .br-part-head { display: none; }
@media (max-width: 760px) {
  .br-board-in { gap: 40px; }
  .br-final .br-col { min-width: 230px; }
}

/* профиль: выбор даты проверки компьютера */
.check-pick { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }
.check-pick .select { flex: 1; min-width: 0; }
.check-pick .dim { font-size: 11.5px; white-space: nowrap; }
.check-past { font-size: 12px; color: var(--gold); margin: -2px 0 10px; }

/* проверка: подробности по аккаунтам и хронология */
button.check-acc { font: inherit; text-align: left; cursor: pointer; }
.check-acc.is-open { border-color: var(--gold); box-shadow: 0 0 0 1px rgba(232, 163, 61, .3); }
.check-acc-info { margin-top: 8px; padding: 10px 12px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--panel-2); }
.check-acc-info .kv b { text-align: right; }
.check-acc-links { display: flex; gap: 6px; margin-top: 8px; }
.check-timeline { margin-top: 10px; font-size: 12px; }
.check-timeline summary { cursor: pointer; color: var(--muted); font-weight: 600; padding: 4px 0; }
.check-timeline .ct-row { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 2px 10px; padding: 5px 0; border-top: 1px solid var(--line-soft); }
.check-timeline .ct-row time { color: var(--dim); font-variant-numeric: tabular-nums; grid-row: span 2; white-space: nowrap; }
.check-timeline .ct-row b { cursor: pointer; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.check-timeline .ct-row b:hover { color: var(--gold); }
.check-timeline .ct-row span { color: var(--muted); }

/* ---------- окно проверки компьютера ---------- */
.modal.ck-modal { width: min(1120px, 100%); max-width: 1120px; }
.ck-bar-top { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin-bottom: 12px; }
.ck-bar-top .select { width: auto; min-width: 280px; }
.ck-meta { font-size: 12.5px; color: var(--muted); }
.ck-meta b { color: var(--text); }
.ck-tabs { margin-bottom: 12px; }
.ck-body { min-height: 220px; max-height: 62vh; overflow: auto; }
.ck-empty { padding: 30px 10px; text-align: center; color: var(--dim); font-size: 13px; }
.ck-table-wrap { overflow-x: auto; }
.ck-table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.ck-table th { position: sticky; top: 0; background: var(--panel); z-index: 1; text-align: left; font-size: 10.5px; letter-spacing: .08em;
  text-transform: uppercase; color: var(--dim); font-weight: 700; padding: 8px 10px; border-bottom: 1px solid var(--line); cursor: pointer; white-space: nowrap; user-select: none; }
.ck-table th:hover, .ck-table th.is-sorted { color: var(--gold); }
.ck-table td { padding: 9px 10px; border-bottom: 1px solid var(--line-soft); vertical-align: top; white-space: nowrap; }
.ck-table td b { font-weight: 700; }
.ck-table td small { display: block; color: var(--dim); font-size: 11px; margin-top: 2px; }
.ck-table td .chip { margin-left: 4px; vertical-align: middle; }
.ck-row { cursor: pointer; transition: background .15s; }
.ck-row:hover { background: rgba(255, 255, 255, .025); }
.ck-row.is-mine td:first-child { box-shadow: inset 3px 0 0 var(--radiant); }
.ck-row.is-open { background: rgba(232, 163, 61, .06); }
.ck-detail td { white-space: normal; background: rgba(232, 163, 61, .03); }
.ck-detail .check-acc-info { margin: 0; max-width: 620px; }
.ck-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 11.5px; color: var(--muted); margin-bottom: 10px; }
.ck-legend span { display: inline-flex; align-items: center; gap: 6px; }
.ck-legend .ck-mark { position: static; transform: none; }
.ck-bar-sample { display: inline-block; width: 22px; height: 8px; border-radius: 4px; background: rgba(92, 157, 224, .35); }
.ck-tl { display: flex; flex-direction: column; gap: 4px; }
.ck-tl-row { display: grid; grid-template-columns: 170px minmax(0, 1fr); align-items: center; gap: 10px; cursor: pointer; }
.ck-tl-row:hover .ck-tl-name { color: var(--gold); }
.ck-tl-name { font-size: 12.5px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ck-tl-track { position: relative; height: 22px; border-radius: 6px; background: var(--panel-2); }
.ck-bar { position: absolute; top: 7px; height: 8px; border-radius: 4px; background: rgba(92, 157, 224, .35); }
.ck-mark { position: absolute; top: 50%; width: 9px; height: 9px; transform: translate(-50%, -50%); border-radius: 50%; display: inline-block; }
.ck-mark.m-login { background: #5c9de0; box-shadow: 0 0 0 2px var(--panel); z-index: 3; }
.ck-mark.m-dota { background: var(--gold); border-radius: 2px; transform: translate(-50%, -50%) rotate(45deg); width: 8px; height: 8px; z-index: 2; }
.ck-mark.m-log { background: #6b7686; width: 3px; height: 12px; border-radius: 1px; z-index: 1; }
.ck-axis { cursor: default; }
.ck-axis .ck-tl-track { background: none; height: 20px; border-top: 1px solid var(--line); border-radius: 0; }
.ck-axis span { position: absolute; top: 4px; transform: translateX(-50%); font-size: 10.5px; color: var(--dim); white-space: nowrap; }
.ck-axis span:first-child { transform: none; }
.ck-axis span:last-of-type { transform: translateX(-100%); }
.ck-now { position: absolute; top: -6px; bottom: 0; width: 0; border-left: 1px dashed rgba(229, 72, 77, .6); }
@media (max-width: 700px) {
  .ck-tl-row { grid-template-columns: 96px minmax(0, 1fr); }
  .ck-bar-top .select { min-width: 0; width: 100%; }
}

/* шапка админки: кнопки и выбор турнира/статуса — одной строкой, одной высоты */
.admin-head { flex-wrap: wrap; row-gap: 14px; }
.admin-head > div:first-child { min-width: 0; }
.admin-tools { display: flex; align-items: flex-end; gap: 10px; flex-wrap: nowrap; margin-left: auto; }
.admin-tools > .btn { height: 38px; align-self: flex-end; flex: none; }
.admin-tools .select { height: 38px; padding-top: 0; padding-bottom: 0; background-position: calc(100% - 17px) 16px, calc(100% - 12px) 16px; }
.admin-tools .at-tour { width: 250px; }
.admin-tools .at-status { width: 150px; }
@media (max-width: 1180px) {
  .admin-tools { width: 100%; margin-left: 0; }
  .admin-tools .at-tour { flex: 1 1 220px; width: auto; }
}
@media (max-width: 980px) {
  .admin-tools { flex-wrap: wrap; }
  .admin-tools > .btn { flex: 1 1 auto; }
  .admin-tools .field-group { flex: 1 1 160px; width: auto; }
}

/* статистика карт: таблица как в Dotabuff, игры в профиле */
.gm-title { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin: 18px 0 10px; }
.gm-title b { font-size: 14px; margin-right: 6px; }
.gm-tab { font: inherit; font-size: 12px; padding: 4px 10px; border-radius: 999px; border: 1px solid var(--line); background: transparent; color: var(--muted); cursor: pointer; }
.gm-tab.on { border-color: var(--gold); color: var(--text); }
.gm-board { display: grid; gap: 12px; }
.gm-meta { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 12px; color: var(--muted); }
.gm-meta b { color: var(--text); }
.gm-meta a { color: var(--gold); text-decoration: none; }
.gm-meta a:hover { text-decoration: underline; }
.gm-side { border: 1px solid var(--line); border-radius: var(--radius-sm); overflow: hidden; }
.gm-side-head { display: flex; align-items: center; gap: 8px; padding: 8px 12px; background: var(--panel-2); font-size: 13px; }
.gm-side-head .gm-dot { width: 8px; height: 8px; border-radius: 50%; background: #5bbf5b; flex: none; }
.gm-side.dire .gm-side-head .gm-dot { background: #d9534f; }
.gm-side-head span:not(.chip):not(.spacer) { color: var(--muted); }
.gm-scroll { overflow-x: auto; }
.gm-table { width: 100%; border-collapse: collapse; font-size: 12px; font-variant-numeric: tabular-nums; min-width: 760px; }
.gm-table th { text-align: left; font-weight: 600; color: var(--dim); padding: 6px 8px; border-bottom: 1px solid var(--line-soft); white-space: nowrap; }
.gm-table td { padding: 6px 8px; border-bottom: 1px solid var(--line-soft); white-space: nowrap; vertical-align: middle; }
.gm-table tr:last-child td { border-bottom: 0; }
.gm-player { display: flex; align-items: center; gap: 8px; min-width: 190px; }
.gm-player span { display: grid; min-width: 0; }
.gm-player b { font-weight: 600; overflow: hidden; text-overflow: ellipsis; max-width: 150px; }
.gm-player b a { color: inherit; text-decoration: none; }
.gm-player b a:hover { color: var(--gold); }
.gm-player small { color: var(--muted); font-size: 11px; }
.gm-hero { width: 56px; height: 32px; border-radius: 4px; object-fit: cover; flex: none; background: var(--panel-2); display: inline-block; }
.gm-kda b { color: #5bbf5b; font-weight: 600; }
.gm-kda i { color: #d9534f; font-style: normal; }
.gm-nw { color: var(--gold); font-weight: 600; }
.gm-items { display: flex; gap: 3px; align-items: center; }
.gm-item { width: 30px; height: 22px; border-radius: 3px; object-fit: cover; background: var(--panel-2); display: inline-block; flex: none; }
.gm-item.neutral { width: 22px; height: 22px; border-radius: 50%; margin-left: 4px; }
.gm-item.empty { opacity: .45; }
.gm-modal { width: min(1020px, 100%); }
.gm-row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto auto; align-items: center; gap: 12px; width: 100%;
  padding: 10px 16px; border: 0; border-bottom: 1px solid var(--line-soft); background: transparent; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.gm-row:last-child { border-bottom: 0; }
.gm-row:hover { background: var(--panel-2); }
.gm-row-hero { width: 60px; height: 34px; border-radius: 4px; object-fit: cover; background: var(--panel-2); display: inline-block; }
.gm-row-main { display: grid; min-width: 0; }
.gm-row-main small { color: var(--muted); font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gm-row .gm-kda { font-variant-numeric: tabular-nums; font-size: 13px; }
.gm-row-dur { font-size: 12px; font-variant-numeric: tabular-nums; }
@media (max-width: 560px) {
  .gm-row { grid-template-columns: auto minmax(0, 1fr) auto; }
  .gm-row-dur, .gm-row .chip { display: none; }
}
/* окно игры и окно матча с таблицей карт — широкие */
.modal.gm-modal, .modal.mi-modal:has(.gm-board), .modal.mm:has(.gm-board) { width: min(1020px, 100%); max-width: 1020px; }
/* одинаковые колонки у Radiant и Dire, чтобы цифры стояли друг под другом */
.gm-table { table-layout: fixed; }
.gm-table th:nth-child(1) { width: 230px; }
.gm-table th:nth-child(2) { width: 78px; }
.gm-table th:nth-child(3) { width: 78px; }
.gm-table th:nth-child(4) { width: 82px; }
.gm-table th:nth-child(5), .gm-table th:nth-child(6), .gm-table th:nth-child(7) { width: 74px; }
.gm-table th:nth-child(8) { width: 230px; }
.gm-player { min-width: 0; }
.gm-player b { max-width: 160px; }

/* высокие окна (игра, проверка) на компьютере: фон прокручивается, окно не обрезается по высоте экрана */
@media (min-width: 761px) {
  .modal-back { align-items: flex-start; overflow-y: auto; overscroll-behavior: contain; }
  .modal-back > .modal { margin: auto; flex: none; }
}

/* итоги турнира */
.sum-table { width: 100%; border-collapse: collapse; font-size: 13px; font-variant-numeric: tabular-nums; min-width: 480px; }
.sum-table th { text-align: left; font-size: 11px; font-weight: 600; color: var(--dim); padding: 8px 16px; border-bottom: 1px solid var(--line-soft); white-space: nowrap; }
.sum-table td { padding: 10px 16px; border-bottom: 1px solid var(--line-soft); white-space: nowrap; }
.sum-table tr:last-child td { border-bottom: 0; }
.sum-table tr.is-champ td { background: rgba(232, 163, 61, .07); }
.sum-place { display: inline-grid; place-items: center; min-width: 30px; height: 26px; padding: 0 7px; border-radius: 7px; background: var(--panel-2); font-weight: 700; }
.sum-place.p1 { background: linear-gradient(180deg, #f2c35b, #c98a1c); color: #1a1205; }
.sum-place.p2 { background: linear-gradient(180deg, #d9dee6, #9aa3b1); color: #11151b; }
.sum-place.p3 { background: linear-gradient(180deg, #d99a6a, #9c5f33); color: #1a0f07; }
.sum-team { font: inherit; background: none; border: 0; padding: 0; color: inherit; cursor: pointer; text-align: left; }
.sum-team:hover b { color: var(--gold); }
.sum-heroes { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px; }
.sum-hero { display: flex; align-items: center; gap: 10px; min-width: 0; }
.sum-hero span { display: grid; min-width: 0; }
.sum-hero small { color: var(--muted); font-size: 12px; }
.sum-lead { display: flex; align-items: center; gap: 12px; padding: 9px 16px; border-bottom: 1px solid var(--line-soft); font-size: 13px; }
.sum-lead:last-child { border-bottom: 0; }
.sum-lead .grow { display: grid; min-width: 0; }
.sum-lead .grow a { color: inherit; text-decoration: none; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sum-lead .grow a:hover { color: var(--gold); }
.sum-lead small { color: var(--muted); font-size: 11px; }
.sum-lead b { font-variant-numeric: tabular-nums; }
.sum-lead .pos { width: 18px; font-size: 12px; font-weight: 700; color: var(--dim); font-variant-numeric: tabular-nums; }
.sum-lead .pos.top { color: var(--gold); }
.sum-lead .grow { flex: 1; }

/* раздел «Команды» */
.teams-head { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 18px; }
.teams-head h1 { font-size: 26px; margin: 0; }
.teams-head .input { width: min(260px, 100%); }
.teams-head .select { width: auto; min-width: 200px; }
.teams-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; }
.team-tile { display: grid; gap: 12px; padding: 16px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); color: inherit; text-decoration: none; transition: border-color .2s, transform .2s; }
.team-tile:hover { border-color: var(--gold); transform: translateY(-2px); }
.team-tile-head { display: flex; align-items: center; gap: 12px; min-width: 0; }
.team-tile-head .grow { display: grid; min-width: 0; }
.team-tile-head b { font-size: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.team-tile-head small { color: var(--muted); font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.team-tile-players { display: flex; flex-wrap: wrap; gap: 5px; }
.team-tile-players span { font-size: 12px; padding: 3px 8px; border-radius: 999px; background: var(--panel-2); color: var(--muted); max-width: 140px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.team-tile-foot { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 12px; color: var(--muted); border-top: 1px solid var(--line-soft); padding-top: 10px; }
.team-tile-foot b { color: var(--text); font-variant-numeric: tabular-nums; }
.team-head { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; }
.team-head .grow { min-width: 0; flex: 1; }
.team-head h1 { font-size: 26px; margin: 0 0 6px; overflow-wrap: anywhere; }
.team-head p { margin: 0; color: var(--muted); }
.team-head p a { color: var(--gold); text-decoration: none; }
.team-head-place .sum-place { min-width: 46px; height: 40px; font-size: 18px; border-radius: 10px; }
.team-hero { width: 44px; height: 25px; border-radius: 3px; object-fit: cover; background: var(--panel-2); display: inline-block; }
.team-heroes, .team-game-heroes { display: flex; gap: 3px; }
.team-players a { color: inherit; text-decoration: none; }
.team-players a:hover b { color: var(--gold); }
.team-game { grid-template-columns: auto minmax(0, 1fr) auto auto auto; }
.team-page-link { color: inherit; text-decoration: none; }
.team-page-link:hover { color: var(--gold); }
.sum-team { color: inherit; text-decoration: none; }
@media (max-width: 560px) {
  .team-game { grid-template-columns: minmax(0, 1fr) auto; }
  .team-game .team-game-heroes { grid-column: 1 / -1; }
}
.team-tile-head .grow { flex: 1; }

/* пункт меню «Команды»: иконка для нижней панели на телефоне и чуть плотнее меню на узких экранах */
.client-tabs a[href="/teams"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2M9 11a4 4 0 1 0 0-8 4 4 0 0 0 0 8ZM22 21v-2a4 4 0 0 0-3-3.9M16 3.1a4 4 0 0 1 0 7.8'/%3E%3C/svg%3E"); }
@media (min-width: 761px) and (max-width: 1180px) {
  .client-tabs a { padding: 0 10px; letter-spacing: .04em; }
  .ct-right { gap: 10px; padding: 0 12px; }
}

/* профиль: история по командам */
.ut-row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto auto; align-items: center; gap: 12px; padding: 11px 16px; border-bottom: 1px solid var(--line-soft); color: inherit; text-decoration: none; }
.ut-row:last-child { border-bottom: 0; }
.ut-row:hover { background: var(--panel-2); }
.ut-row:hover .ut-main b { color: var(--gold); }
.ut-main { display: grid; min-width: 0; }
.ut-main b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ut-main small { color: var(--muted); font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ut-main .ut-mates { color: var(--dim); font-size: 11px; }
.ut-kda, .ut-rec { font-size: 13px; font-variant-numeric: tabular-nums; }
.ut-rec { color: var(--muted); }
.ut-place { min-width: 44px; display: flex; justify-content: flex-end; }
@media (max-width: 560px) {
  .ut-row { grid-template-columns: auto minmax(0, 1fr) auto; }
  .ut-kda, .ut-rec { display: none; }
}

/* сетка для трансляции (OBS): прозрачный фон, без прокрутки, масштаб из ссылки */
html:has(body.ov), body.ov { background: transparent !important; background-image: none !important; height: auto; }
body.ov { overflow: hidden; padding: 0 !important; }
.ov-wrap { display: inline-block; padding: 18px 22px; zoom: var(--ov-scale, 1); }
body.ov-dark .ov-wrap { background: rgba(8, 11, 16, .88); border: 1px solid rgba(255, 255, 255, .06); border-radius: 16px; }
.ov-head { display: flex; align-items: baseline; gap: 12px; margin: 0 2px 10px; }
.ov-head b { font-size: 22px; letter-spacing: -.01em; text-shadow: 0 2px 8px rgba(0, 0, 0, .6); }
.ov-head span { font-size: 12px; text-transform: uppercase; letter-spacing: .14em; color: var(--accent-hot, #ff6b3d); font-weight: 700; }
body.ov-notitle .ov-head { display: none; }
body.ov .br-board { overflow: visible; }
body.ov .br-match { box-shadow: 0 6px 18px rgba(0, 0, 0, .45); }
body.ov[data-part="upper"] [data-bpart]:not([data-bpart="upper"]),
body.ov[data-part="lower"] [data-bpart]:not([data-bpart="lower"]),
body.ov[data-part="grand"] [data-bpart]:not([data-bpart="grand"]) { display: none; }
body.ov[data-part] .br-board-links { display: none; }
/* масштаб оверлея — transform (одинаково во всех версиях браузера OBS); линии сетки учитывают его сами */
.ov-wrap { zoom: 1; transform: scale(var(--ov-scale, 1)); transform-origin: 0 0; }

/* админка: ссылка на сетку для OBS */
.ov-builder { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; margin-bottom: 14px; }
.ov-builder .field-group { display: grid; gap: 6px; margin: 0; }
.ov-builder .field-group > span { font-size: 12px; color: var(--muted); }
.ov-link { display: flex; gap: 8px; flex-wrap: wrap; }
.ov-link .input { flex: 1 1 320px; min-width: 0; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 12px; }
.ov-hint { font-size: 12px; margin: 10px 0 0; }
/* у организатора в нижней панели телефона 8 пунктов — «О нас» убираем (она есть в подвале), чтобы подписи помещались */
@media (max-width: 760px) {
  .client-tabs:has(a[href="/admin"]) a[href="/about"] { display: none; }
}

/* админка: окно заявки — слева заявка и решение, справа история кандидата у нас */
.modal.en-modal { width: min(1180px, 100%); max-width: 1180px; }
.en-modal .modal-head .btn { min-width: 34px; }
.en-grid { display: grid; grid-template-columns: minmax(330px, 420px) minmax(0, 1fr); gap: 0; align-items: start; }
.en-detail { border: 0; border-right: 1px solid var(--line-soft); border-radius: 0; background: transparent; backdrop-filter: none; }
.en-history { padding: 14px 18px 18px; display: grid; gap: 16px; min-width: 0; }
.en-sec h4 { font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--dim); font-weight: 700; margin: 0 0 8px; }
.en-kv { display: flex; justify-content: space-between; gap: 12px; padding: 5px 0; font-size: 13px; border-bottom: 1px solid var(--line-soft); }
.en-kv span { color: var(--muted); }
.en-flags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.en-row { display: flex; align-items: center; gap: 10px; padding: 7px 10px; border-radius: 8px; background: var(--panel-2); margin-bottom: 6px; color: inherit; text-decoration: none; width: 100%; border: 0; font: inherit; text-align: left; }
a.en-row:hover, button.en-row:hover { outline: 1px solid var(--gold); cursor: pointer; }
.en-row.is-now { outline: 1px solid rgba(232, 163, 61, .45); }
.en-row .grow { display: grid; min-width: 0; flex: 1; }
.en-row b { font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.en-row small { color: var(--muted); font-size: 11.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.en-row .gm-kda { font-size: 12px; font-variant-numeric: tabular-nums; }
.en-empty { font-size: 12px; padding: 4px 0; }
.en-log { max-height: 280px; overflow-y: auto; border: 1px solid var(--line-soft); border-radius: 8px; }
.en-ev { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 10px; padding: 7px 10px; border-bottom: 1px solid var(--line-soft); font-size: 12.5px; }
.en-ev:last-child { border-bottom: 0; }
.en-ev time { color: var(--dim); font-variant-numeric: tabular-nums; white-space: nowrap; }
.en-ev small { display: block; color: var(--muted); font-size: 11.5px; overflow-wrap: anywhere; }
@media (max-width: 900px) {
  .en-grid { grid-template-columns: minmax(0, 1fr); }
  .en-detail { border-right: 0; border-bottom: 1px solid var(--line-soft); }
}

/* кадрирование обложки */
.modal.cc-modal { width: min(1000px, 100%); max-width: 1000px; }
.cc-stage { position: relative; border-radius: 10px; overflow: hidden; background: #05070a; user-select: none; }
.cc-stage canvas { display: block; width: 100%; height: auto; cursor: grab; touch-action: none; }
.cc-stage canvas:active { cursor: grabbing; }
.cc-guide { position: absolute; left: 0; right: 0; border-top: 1px dashed rgba(255, 255, 255, .55); border-bottom: 1px dashed rgba(255, 255, 255, .55); pointer-events: none; }
.cc-guide + .cc-guide { border-color: rgba(232, 163, 61, .7); }
.cc-guide span { position: absolute; right: 8px; top: 4px; font-size: 11px; padding: 1px 6px; border-radius: 4px; background: rgba(0, 0, 0, .55); color: #fff; }
.cc-guide + .cc-guide span { top: auto; bottom: 4px; color: var(--gold); }
.cc-tools { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 12px; }
.cc-tools input[type="range"] { flex: 1 1 200px; accent-color: var(--gold); }
.cc-tools .dim { font-size: 12px; }
.cover-preview { aspect-ratio: 3 / 1; }

/* запасная привязка Telegram: код, который можно отправить боту сообщением */
.tg-alt { flex-basis: 100%; display: flex; align-items: center; gap: 8px 10px; flex-wrap: wrap; margin-top: 10px; }
.tg-alt small { color: var(--muted); font-size: 12px; }
.tg-alt small a { color: var(--gold); }
.tg-code { display: inline-flex; align-items: center; gap: 8px; }
.tg-code code { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 15px; letter-spacing: .06em; padding: 4px 10px; border-radius: 6px; background: var(--panel-2); border: 1px solid var(--line); user-select: all; }
.tg-confirm { flex-wrap: wrap; }

/* v2: меню аватара — всё личное в одном месте */
.um { position: relative; display: inline-flex; }
.um .user-chip { cursor: pointer; }
.um-caret { width: 14px; height: 14px; color: var(--dim); margin-left: 2px; flex: none; transition: transform .15s; }
.um:has(.um-menu:not([hidden])) .um-caret { transform: rotate(180deg); }
.um-menu { position: absolute; right: 0; top: calc(100% + 8px); z-index: 120; min-width: 230px; padding: 6px;
  background: var(--panel); border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 24px 48px -16px #000; }
.um-menu[hidden] { display: none; }
.um-menu a { display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-radius: 8px; color: var(--text); text-decoration: none; font-size: 13.5px; white-space: nowrap; }
.um-menu a:hover { background: var(--panel-2); color: var(--gold); }
.um-menu svg { width: 17px; height: 17px; color: var(--muted); flex: none; }
.um-menu a:hover svg { color: var(--gold); }
.um-menu hr { border: 0; border-top: 1px solid var(--line-soft); margin: 5px 4px; }
[data-apply-btn][hidden] { display: none !important; }

/* v2: иконки нижней панели на телефоне — «Турнир» (кубок) и «Архив» (коробка) */
.client-tabs a[href="/tournament"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 21h8M12 17v4M7 4h10v5a5 5 0 0 1-10 0V4ZM7 6H4a3 3 0 0 0 3 4M17 6h3a3 3 0 0 1-3 4'/%3E%3C/svg%3E"); }
.client-tabs a[href="/tournaments"] { --ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 4h18v4H3zM5 8v12h14V8M10 12h4'/%3E%3C/svg%3E"); }
@media (max-width: 760px) {
  .um-menu { position: fixed; left: 12px; right: 12px; top: calc(var(--header-h) + 6px); min-width: 0; }
  .um-caret { display: none; }
}

/* v2: команды сгруппированы по турнирам */
.teams-group { margin-bottom: 26px; }
.teams-group-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 0 0 12px; }
.teams-group-head h2 { font-size: 18px; margin: 0; }
.teams-group-head > a:first-child { color: inherit; text-decoration: none; }
.teams-group-head > a:first-child:hover h2 { color: var(--gold); }
.teams-group-head .dim { font-size: 12px; }
.team-tile { text-decoration: none; }
.team-tile:hover { transform: none; }
.team-tile-head { color: inherit; text-decoration: none; }
.team-tile-head:hover b { color: var(--gold); }
.team-tile-players a { font-size: 12px; padding: 3px 8px; border-radius: 999px; background: var(--panel-2); color: var(--muted); text-decoration: none;
  max-width: 140px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.team-tile-players a:hover { color: var(--gold); }
.team-tile-foot a { color: inherit; text-decoration: none; }
.team-tile-foot a:hover b { color: var(--gold); }


/* постоянные команды: участия по турнирам, выбор прошлой команды */
.th-item { border-bottom: 1px solid var(--line-soft); }
.th-item:last-child { border-bottom: 0; }
.th-item summary { display: flex; align-items: center; gap: 10px; padding: 10px 16px; cursor: pointer; list-style: none; }
.th-item summary::-webkit-details-marker { display: none; }
.th-item summary .grow { display: grid; min-width: 0; flex: 1; }
.th-item summary small { color: var(--muted); font-size: 12px; }
.th-item[open] summary { background: var(--panel-2); }
.th-roster { padding: 6px 16px 12px; display: grid; gap: 4px; }
.th-roster a { display: flex; justify-content: space-between; gap: 10px; padding: 5px 8px; border-radius: 6px; color: inherit; text-decoration: none; font-size: 13px; }
.th-roster a:hover { background: var(--panel-2); color: var(--gold); }
.th-roster a small { color: var(--muted); font-size: 11.5px; }
.th-roster .th-open { color: var(--gold); justify-content: flex-start; margin-top: 4px; font-size: 12.5px; }
.th-link { display: flex; gap: 8px; flex-wrap: wrap; }
.th-link .select { flex: 1 1 220px; min-width: 0; }
.th-times { font-size: 11px; vertical-align: middle; margin-left: 6px; }
.pp-list { display: grid; gap: 8px; }
.pp-item { display: grid; gap: 2px; text-align: left; padding: 10px 14px; border-radius: 10px; border: 1px solid var(--line); background: var(--panel-2); color: inherit; font: inherit; cursor: pointer; }
.pp-item:hover { border-color: var(--gold); }
.pp-item small { color: var(--muted); font-size: 12px; }
.pp-new { color: var(--gold); }
.pp-note { font-size: 12px; margin: 4px 0 0; }

@media (max-width: 760px) {
  .hme .hlist-head .btn { display: none; }
  .hme-cards { padding: 12px; }
  .hme-tip { margin: 0 12px 12px; }
}

/* личный кабинет */
.cab-head { margin-bottom: 16px; }
[data-cab-tabs] { margin-bottom: 16px; }
#tab-now.is-active, #tab-history.is-active { display: flex; flex-direction: column; gap: 16px; }
#tab-now > .cpanel { margin-top: 0; }
.cab-todo-row { display: flex; align-items: center; gap: 14px; padding: 12px 16px; border-top: 1px solid #1a222c; flex-wrap: wrap; }
.cab-todo-row .grow { flex: 1; min-width: 200px; display: grid; gap: 2px; }
.cab-todo-row b { font-size: 14px; }
.cab-todo-row small { font-size: 12px; color: var(--muted); }
.cab-todo-n { width: 26px; height: 26px; flex: none; display: grid; place-items: center; border-radius: 50%; font-size: 12px; font-weight: 800;
  color: var(--accent-hot); background: rgba(255, 92, 58, .12); border: 1px solid rgba(255, 92, 58, .35); }
.cab-todo-row .ready-ask { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cab-todo-row .ready-q { display: none; }
.cab-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; }
.cab-2 .panel { margin: 0; }
.cab-2 .panel-body.flush { max-height: 520px; overflow-y: auto; }
.cab-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; align-items: start; }
.cab-3 .side-card { margin: 0; }
@media (max-width: 1080px) {
  .cab-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .cab-2, .cab-3 { grid-template-columns: minmax(0, 1fr); }
  .cab-todo-row { padding: 12px; }
}
[data-cab-tabs][hidden], [data-tab-host][hidden] { display: none; }

/* админка: этапы турнира */
.stage-bar { margin-bottom: 16px; border: 1px solid var(--line); border-radius: 10px; background: var(--panel); overflow: hidden; }
.stage-bar[hidden] { display: none; }
.sb-steps { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); border-bottom: 1px solid var(--line); }
.sb-step { display: flex; align-items: center; gap: 10px; padding: 12px 16px; background: none; border: 0; border-right: 1px solid var(--line);
  color: var(--dim); font: inherit; font-size: 13px; font-weight: 650; cursor: pointer; text-align: left; position: relative; min-width: 0; }
.sb-step:last-child { border-right: 0; }
.sb-step:hover { background: var(--panel-2); color: var(--text); }
.sb-num { width: 24px; height: 24px; flex: none; display: grid; place-items: center; border-radius: 50%; font-size: 12px; font-weight: 800;
  border: 1px solid var(--line); background: var(--panel-2); }
.sb-title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sb-step.is-done { color: var(--muted); }
.sb-step.is-done .sb-num { color: #52d983; border-color: rgba(62, 207, 110, .45); background: rgba(20, 50, 32, .6); }
.sb-step.is-now { color: var(--text); background: rgba(209, 69, 42, .1); }
.sb-step.is-now::after { content: ''; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--accent-hot); }
.sb-step.is-now .sb-num { color: #fff; border-color: var(--accent-hot); background: var(--accent); }
.sb-now { display: flex; align-items: center; gap: 12px; padding: 12px 16px; flex-wrap: wrap; }
.sb-label { font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.sb-items { display: flex; gap: 6px; flex-wrap: wrap; }
.sb-item { padding: 5px 10px; border-radius: 6px; border: 1px solid rgba(232, 163, 61, .35); background: rgba(232, 163, 61, .08);
  color: #f0c27a; font: inherit; font-size: 12.5px; cursor: pointer; }
.sb-item.is-ok { border-color: var(--line); background: transparent; color: var(--muted); }
.sb-item:hover { border-color: var(--accent-hot); color: var(--text); }
.sb-now .spacer { flex: 1; }
.admin-nav .is-stage-now { color: var(--text); }
.admin-nav .nav-sec.is-stage-now { color: var(--accent-hot); }
.admin-nav button.is-stage-later:not(.is-active) { opacity: .55; }
@media (max-width: 900px) {
  .sb-steps { grid-template-columns: repeat(5, auto); overflow-x: auto; }
  .sb-title { display: none; }
  .sb-step.is-now .sb-title { display: inline; }
}

/* архив турниров */
.arc-head { align-items: flex-end; gap: 16px; flex-wrap: wrap; overflow: clip; }
.arc-head p { margin: 6px 0 0; }
.arc-search { width: 320px; max-width: 100%; }
.arc-now { margin-bottom: 26px; }
.arc-now-list { display: grid; gap: 8px; }
.arc-now-row { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border: 1px solid var(--line); border-radius: 8px;
  background: var(--panel); color: inherit; text-decoration: none; flex-wrap: wrap; }
.arc-now-row:hover { border-color: rgba(255, 92, 58, .5); }
.arc-now-row b { font-size: 15px; }
.arc-now-row small { color: var(--muted); font-size: 12.5px; flex: 1; min-width: 160px; }
.arc-month { margin: 22px 0 10px; font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.arc-month:first-child { margin-top: 0; }
.arc-list { display: grid; gap: 12px; }
.arc-card { display: grid; grid-template-columns: 180px minmax(0, 1fr) auto; gap: 18px; padding: 14px; align-items: start;
  border: 1px solid var(--line); border-radius: 10px; background: var(--panel); }
.arc-cover { position: relative; display: block; aspect-ratio: 16 / 9; border-radius: 6px; overflow: hidden;
  background: linear-gradient(135deg, #2a0f0a, #14090a 70%); }
.arc-cover.has-cover { background: var(--cover) center / cover no-repeat; }
.arc-date { position: absolute; left: 8px; top: 8px; padding: 2px 8px; border-radius: 5px; font-size: 12px; font-weight: 700;
  background: rgba(8, 9, 12, .8); color: #fff; }
.arc-main { min-width: 0; display: grid; gap: 4px; }
.arc-name { font-size: 17px; font-weight: 800; color: #fff; text-decoration: none; }
.arc-name:hover { color: var(--accent-hot); }
.arc-main > small { color: var(--muted); font-size: 12.5px; }
.arc-podium { display: grid; gap: 6px; margin-top: 8px; }
.arc-place { display: flex; align-items: center; gap: 10px; padding: 7px 10px; border-radius: 7px; background: var(--panel-2); min-width: 0; }
.arc-place.p1 { background: rgba(232, 163, 61, .1); border: 1px solid rgba(232, 163, 61, .3); }
.arc-medal { font-size: 18px; width: 24px; text-align: center; flex: none; }
.arc-place .grow { flex: 1; min-width: 0; display: grid; gap: 1px; }
.arc-place a { color: inherit; text-decoration: none; }
.arc-place a:hover { color: var(--accent-hot); }
.arc-place small { font-size: 12px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.arc-place small a.is-hit { color: var(--gold); font-weight: 700; }
.arc-nopodium { margin-top: 8px; font-size: 12.5px; }
.arc-links { display: flex; flex-direction: column; gap: 6px; }
@media (max-width: 900px) {
  .arc-card { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .arc-cover { aspect-ratio: 3 / 1; }
  .arc-links { flex-direction: row; }
  .arc-search { width: 100%; }
}
.page-head.arc-head { overflow: clip; }
@media (max-width: 900px) {
  .page-head .search.arc-search { display: flex; }
  .arc-cover:not(.has-cover) { aspect-ratio: auto; height: 34px; }
}

/* главная: лобби-боты (видит только организатор) — колонкой слева во всю высоту */
.home-page:has(> .home-left:not([hidden])) {
  display: grid; grid-template-columns: 270px minmax(0, 1fr); align-items: start; max-width: 1760px;
}
.home-page:has(> .home-left:not([hidden])) > :not(.home-left) { grid-column: 2; min-width: 0; }
.home-page > .home-left { grid-column: 1; grid-row: 1 / span 4; position: sticky; top: calc(var(--header-h) + 16px); margin: 0; }
@media (max-width: 1080px) {
  .home-page:has(> .home-left:not([hidden])) { display: flex; }
  .home-page > .home-left { position: static; order: 1; }
  .home-page > .hh { order: 0; }
  .home-page > :not(.hh):not(.home-left) { order: 2; }
}

/* техлуз */
.br-slot .sc.ff { width: auto; font-size: 10.5px; letter-spacing: .04em; color: #e36b5a; }
.br-slot.is-out b { text-decoration: line-through; text-decoration-color: rgba(227, 107, 90, .6); }
.mm-ff { margin-top: 14px; padding: 12px; border: 1px solid rgba(227, 107, 90, .3); border-radius: 8px; background: rgba(227, 107, 90, .05); display: grid; gap: 8px; }
.mm-ff > label { font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: #e36b5a; }
.mm-ff-row, .mm-ff-team { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.mm-ff-team b { flex: 1; min-width: 120px; font-size: 13px; }
.mm-ff-ns { display: flex; align-items: center; gap: 8px; font-size: 12.5px; cursor: pointer; }
.mm-ff .hint { font-size: 11.5px; }
.mm-ff > .mm-ff-ns, .mm-ff-row .mm-ff-ns { font-size: 12.5px; font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--text); }

/* обложка профиля */
.has-ucover { background-image: linear-gradient(90deg, rgba(8, 9, 12, .92) 0%, rgba(8, 9, 12, .7) 45%, rgba(8, 9, 12, .25) 100%), var(--ucover) !important;
  background-size: cover !important; background-position: center var(--ucover-y, 50%) !important; }
.ucover-preview { height: 90px; border-radius: 8px; border: 1px dashed var(--line); display: grid; place-items: center; color: var(--dim); font-size: 12px;
  background-size: cover; background-position: center var(--ucover-y, 50%); }
.ucover-preview.has-ucover { border-style: solid; background-image: var(--ucover) !important; }
.ucover-pos { display: grid; gap: 4px; margin-top: 10px; font-size: 12px; color: var(--muted); }
.ucover-pos input { width: 100%; accent-color: var(--accent-hot); }
.ucover-actions { display: flex; gap: 8px; margin-top: 10px; }

/* порядочность */
.conduct-chip { display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px; border-radius: 20px; font-size: 11.5px; font-weight: 600;
  border: 1px solid var(--line); background: rgba(10, 12, 16, .6); color: var(--muted); white-space: nowrap; }
.conduct-chip b { font-weight: 800; font-variant-numeric: tabular-nums; }
.conduct-chip i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.conduct-chip.is-good { color: #52d983; border-color: rgba(62, 207, 110, .4); }
.conduct-chip.is-normal { color: #c9d0dc; }
.conduct-chip.is-low { color: #f0b85c; border-color: rgba(232, 163, 61, .45); }
.conduct-chip.is-bad { color: #ff7a5c; border-color: rgba(255, 92, 58, .5); }
.conduct-bar { height: 6px; border-radius: 3px; background: var(--panel-2); overflow: hidden; }
.conduct-bar i { display: block; height: 100%; background: currentColor; }
.conduct-bar.is-good { color: #3ecf6e; } .conduct-bar.is-normal { color: #8a93a3; } .conduct-bar.is-low { color: #e8a33d; } .conduct-bar.is-bad { color: #ff5c3a; }
.conduct-log { margin-top: 10px; display: grid; gap: 2px; max-height: 260px; overflow-y: auto; }
.conduct-row { display: flex; align-items: center; gap: 10px; padding: 6px 0; border-top: 1px solid var(--line-soft); font-size: 12.5px; }
.conduct-row b { width: 56px; flex: none; font-variant-numeric: tabular-nums; }
.conduct-row .grow { flex: 1; min-width: 0; display: grid; }
.conduct-row small { font-size: 11px; color: var(--dim); }
.conduct-form { display: grid; gap: 8px; margin-top: 12px; }

/* хосты и боты турнира */
.hp-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.hp-col h4 { margin: 0 0 4px; font-size: 13px; }
.hp-col .hint { margin: 0 0 10px; font-size: 12px; }
.hp-host { display: flex; align-items: center; gap: 10px; padding: 6px 0; border-bottom: 1px solid var(--line-soft); font-size: 13px; }
.hp-add { margin-top: 10px; }
.hp-found { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.hp-pick { padding: 4px 10px; border-radius: 6px; border: 1px solid var(--line); background: var(--panel-2); color: inherit; font: inherit; font-size: 12.5px; cursor: pointer; }
.hp-pick:hover { border-color: var(--accent-hot); }
.hp-bots { display: grid; gap: 6px; margin-bottom: 10px; font-size: 13px; }
@media (max-width: 760px) { .hp-grid { grid-template-columns: minmax(0, 1fr); } }

/* импорт игроков списком */
.imp-modal { max-width: 820px; width: calc(100vw - 32px); }
.imp-text { width: 100%; font-family: ui-monospace, Consolas, monospace; font-size: 12.5px; resize: vertical; }
.imp-file { display: flex; align-items: center; gap: 10px; margin-top: 8px; flex-wrap: wrap; }
.imp-sum { margin: 14px 0 8px; font-size: 13px; }
.imp-rows { max-height: 300px; overflow-y: auto; border: 1px solid var(--line); border-radius: 8px; }
.imp-row { display: grid; grid-template-columns: 30px minmax(0, 1.2fr) 110px minmax(0, 1fr) auto; gap: 10px; align-items: center;
  padding: 6px 10px; border-bottom: 1px solid var(--line-soft); font-size: 12.5px; }
.imp-row:last-child { border-bottom: 0; }
.imp-row.is-bad { background: rgba(227, 107, 90, .06); }
.imp-row b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 760px) { .imp-row { grid-template-columns: 24px minmax(0, 1fr) auto; } .imp-row > :nth-child(3), .imp-row > :nth-child(4) { display: none; } }

.cover-mod { display: flex; gap: 8px; flex-wrap: wrap; }

/* билет у ботов */
.lg-bots { display: grid; gap: 4px; }
.lg-row { display: grid; grid-template-columns: minmax(0, 1fr) 120px auto 150px; gap: 10px; align-items: center; padding: 6px 0; border-bottom: 1px solid var(--line-soft); font-size: 13px; }
.lg-row small { text-align: right; }
.lg-actions { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
@media (max-width: 760px) { .lg-row { grid-template-columns: minmax(0, 1fr) auto; } .lg-row .tnum, .lg-row small { display: none; } }

.lg-format { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-bottom: 10px; font-size: 12.5px; }
.lg-format button { padding: 4px 10px; border-radius: 6px; border: 1px solid var(--line); background: transparent; color: var(--muted); font: inherit; font-size: 12px; cursor: pointer; }
.lg-format button.is-active { color: #fff; border-color: rgba(255, 92, 58, .6); background: rgba(209, 69, 42, .16); }
.lg-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr) auto auto 130px !important; }
.lg-id { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
@media (max-width: 760px) { .lg-row { grid-template-columns: minmax(0, 1fr) auto auto !important; } .lg-row .lg-id, .lg-row small { display: none; } }

/* «Что требует внимания»: боты без билета — красным */
.queue-item.is-red { background: rgba(227, 70, 50, .1); box-shadow: inset 3px 0 0 #e34632; }
.queue-item.is-red .queue-main b { color: #ff6a52; }
.queue-item.is-red .queue-main small { color: #f0a497; }

/* «Провести свой турнир» */
.ho-head p { max-width: 720px; margin: 8px 0 0; }
.ho-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 16px; align-items: start; }
.ho-grid .panel { margin: 0; }
.ho-base { display: grid; gap: 8px; font-size: 13.5px; }
.ho-base div { padding-left: 22px; position: relative; }
.ho-base div::before { content: '✓'; position: absolute; left: 0; color: #52d983; font-weight: 800; }
.ho-feats { display: grid; gap: 8px; margin-top: 14px; }
.ho-feats-title { font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.ho-feat { display: flex; align-items: flex-start; gap: 10px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 8px; cursor: pointer; }
.ho-feat:has(input:checked) { border-color: rgba(255, 92, 58, .55); background: rgba(209, 69, 42, .08); }
.ho-feat input { margin-top: 3px; accent-color: var(--accent-hot); }
.ho-feat .grow { flex: 1; min-width: 0; display: grid; gap: 2px; }
.ho-feat b { font-size: 13.5px; }
.ho-feat small { font-size: 12px; color: var(--muted); }
.ho-feat-price { font-size: 12px; color: var(--gold); white-space: nowrap; }
.ho-sum { margin: 16px 0; }
.ho-total { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 24px; align-items: center; }
.ho-total > div:first-child b { display: block; font-size: 34px; font-weight: 800; margin: 4px 0; }
.ho-total small { color: var(--muted); font-size: 13px; }
.ho-lines { display: grid; gap: 4px; font-size: 13px; }
.ho-lines div { display: flex; justify-content: space-between; gap: 12px; padding: 4px 0; border-bottom: 1px solid var(--line-soft); }
.ho-cap { color: var(--gold); }
.ho-send { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 14px; }
@media (max-width: 900px) {
  .ho-grid, .ho-total { grid-template-columns: minmax(0, 1fr); }
}

/* хосты: функции; заявки организаторов */
.hp-host-box { border-bottom: 1px solid var(--line-soft); padding-bottom: 8px; margin-bottom: 4px; }
.hp-host-box .hp-host { border-bottom: 0; }
.hp-perms { display: flex; flex-wrap: wrap; gap: 6px 14px; padding-left: 34px; font-size: 12.5px; }
.hp-perms label { display: flex; align-items: center; gap: 5px; cursor: pointer; color: var(--muted); }
.hp-perms label:has(input:checked) { color: var(--text); }
.hq-item { display: grid; grid-template-columns: minmax(0, 1fr) 190px; gap: 16px; padding: 14px 16px; border-bottom: 1px solid var(--line-soft); }
.hq-item:last-child { border-bottom: 0; }
.hq-main { display: grid; gap: 4px; min-width: 0; }
.hq-main b { font-size: 15px; }
.hq-main small { color: var(--muted); font-size: 12px; }
.hq-order { font-size: 13px; }
.hq-comment { font-size: 12.5px; color: var(--muted); white-space: pre-wrap; }
.hq-side { display: grid; gap: 4px; justify-items: end; align-content: start; }
.hq-price { font-size: 18px; }
.hq-btns { display: flex; gap: 6px; margin-top: 6px; }
.hp-price-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 760px) { .hq-item { grid-template-columns: minmax(0, 1fr); } .hq-side { justify-items: start; } .hp-price-grid { grid-template-columns: minmax(0, 1fr); } }

/* «Провести турнир» в шапке: на узких экранах прячем — там он в меню под аватаркой и в подвале */
.host-cta { white-space: nowrap; }
@media (max-width: 1240px) { .host-cta { display: none; } }

/* промокоды */
.ho-promo { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 14px; }
.ho-promo .input { width: 180px; text-transform: uppercase; }
.ho-promo-state { font-size: 12.5px; }
.ho-promo-state.is-ok { color: #52d983; }
.ho-promo-state.is-bad { color: #ff7a5c; }
.ho-old { display: block; color: var(--dim); font-size: 15px; margin-top: 4px; }
.ho-disc { color: #52d983; }
.hq-promo { color: #52d983; font-size: 11.5px; text-align: right; }
.pc-form { display: grid; grid-template-columns: 1.2fr 70px 100px 1.3fr 150px 1.4fr auto; gap: 8px; }
.pc-list { display: grid; gap: 4px; margin-top: 12px; }
.pc-row { display: grid; grid-template-columns: 140px 80px minmax(0, 1fr) auto auto auto; gap: 10px; align-items: center; padding: 6px 0; border-bottom: 1px solid var(--line-soft); font-size: 13px; }
.pc-row.is-off { opacity: .55; }
@media (max-width: 1080px) { .pc-form { grid-template-columns: repeat(2, minmax(0, 1fr)); } .pc-row { grid-template-columns: minmax(0, 1fr) auto; } .pc-row small { grid-column: 1 / -1; } }

/* Live: идущие игры */
.live-box { margin: 0 0 18px; }
.live-head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.live-head h2 { margin: 0; font-size: 17px; text-transform: uppercase; letter-spacing: .08em; }
.live-dot { width: 10px; height: 10px; border-radius: 50%; background: #ff3b30; box-shadow: 0 0 10px #ff3b30; animation: hh-pulse 1.4s infinite; }
.live-list { display: grid; gap: 14px; }
.lv-card { border: 1px solid var(--line); border-radius: 12px; overflow: hidden;
  background: linear-gradient(180deg, rgba(26, 52, 64, .55), rgba(10, 14, 19, .95)); }
.lv-card.is-wait { padding: 14px 16px; display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.lv-top { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 16px; padding: 14px 18px 6px; }
.lv-name { font-size: 15px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lv-name.is-radiant { text-align: right; color: #8ee6a4; }
.lv-name.is-dire { color: #ff8f7a; }
.lv-score { display: flex; align-items: center; gap: 14px; }
.lv-score b { font-size: 30px; font-weight: 800; font-variant-numeric: tabular-nums; min-width: 36px; text-align: center; }
.lv-score span { display: grid; text-align: center; font-weight: 800; font-size: 15px; font-variant-numeric: tabular-nums; }
.lv-score em { font-style: normal; font-size: 10.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.lv-body { display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, 440px) minmax(0, 1fr); gap: 16px; padding: 8px 18px 12px; align-items: center; }
.lv-side { display: grid; gap: 6px; }
.lv-p { display: flex; align-items: center; gap: 10px; min-width: 0; }
.lv-side.is-radiant .lv-p { flex-direction: row-reverse; text-align: right; }
.lv-hero-ico { width: 48px; height: 27px; border-radius: 4px; object-fit: cover; flex: none; }
.lv-p .grow { flex: 1; min-width: 0; display: grid; }
.lv-p b { font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lv-p b a { color: inherit; }
.lv-p small { font-size: 11.5px; color: var(--muted); }
.lv-kda { color: #e7ecf3; font-weight: 700; font-variant-numeric: tabular-nums; }
.lv-mid { display: grid; gap: 6px; }
.lv-map { position: relative; aspect-ratio: 1; border-radius: 8px; overflow: hidden; background: #0d1215 url(/assets/img/minimap.png) center / 100% 100% no-repeat; }
.lv-bld { position: absolute; width: 2.8%; aspect-ratio: 1; transform: translate(-50%, -50%); border-radius: 1px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3), inset 0 -1px 0 rgba(0, 0, 0, .25), 0 0 0 1px rgba(0, 0, 0, .7); }
.lv-bld.t-1 { width: 3.4%; }
.lv-bld.t-2 { width: 4%; transform: translate(-50%, -50%) rotate(45deg); border-radius: 2px; }
.lv-bld.is-radiant { background: #47b858; }
.lv-bld.is-dire { background: #d9472e; }
.lv-hero { position: absolute; width: 8.5%; aspect-ratio: 1; transform: translate(-50%, -50%); z-index: 1; border-radius: 50%; overflow: hidden; border: 2px solid; background: #111; transition: left 1s linear, top 1s linear; }
.lv-hero.is-radiant { border-color: #3ecf6e; }
.lv-hero.is-dire { border-color: #e5533d; }
.lv-hero img { width: 100%; height: 100%; object-fit: cover; }
.lv-lead { text-align: center; font-size: 12px; font-weight: 700; }
.lv-lead.is-radiant { color: #8ee6a4; }
.lv-lead.is-dire { color: #ff8f7a; }
.lv-foot { padding: 0 18px 12px; font-size: 11.5px; text-align: center; }
.modal .lv-card { margin-bottom: 14px; }
@media (max-width: 900px) {
  .lv-body { grid-template-columns: minmax(0, 1fr); }
  .lv-mid { order: -1; max-width: 420px; width: 100%; margin: 0 auto; }
  .lv-side.is-radiant .lv-p { flex-direction: row; text-align: left; }
  .lv-score b { font-size: 24px; }
}

.bot-live { margin: 14px 0 4px; }