@font-face {
  font-family: "BakBak";
  src: url("/static/fonts/BakBak-Regular.95fa33233d10.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "SpaceMono";
  src: url("/static/fonts/SpaceMono-Regular.2dd18ae3afdf.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  --fecod-night: #010729;
  --fecod-white: #ffffff;
  --fecod-blue-light: #afdff9;
  --fecod-blue-main: #004b9c;
  --fecod-blue-deep: #001e46;
  --fecod-red: #d30535;
  --fecod-line: rgba(175, 223, 249, 0.34);
  --fecod-line-strong: rgba(175, 223, 249, 0.56);
  --fecod-text-soft: rgba(175, 223, 249, 0.84);
  --fecod-card: rgba(1, 7, 41, 0.9);
  --fecod-card-strong: rgba(0, 30, 70, 0.88);
  --fecod-shadow: 0 18px 46px rgba(1, 7, 41, 0.56);
}

.overlay-brand,
.overlay-brand * {
  font-family: "SpaceMono", "Segoe UI", monospace;
}

.overlay-brand h1,
.overlay-brand h2,
.overlay-brand h3,
.overlay-brand .head-kicker,
.overlay-brand .stats-title,
.overlay-brand .stats-kicker,
.overlay-brand .compact-brand,
.overlay-brand .compact-title,
.overlay-brand .kicker,
.overlay-brand .brand,
.overlay-brand .tboard-topbar h1 {
  font-family: "BakBak", "Segoe UI", sans-serif;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.overlay-brand button,
.overlay-brand .btn,
.overlay-brand .btn-link {
  border-color: var(--fecod-line);
  background: linear-gradient(135deg, rgba(0, 30, 70, 0.82), rgba(0, 75, 156, 0.6));
  color: var(--fecod-white);
}

.overlay-brand button:hover,
.overlay-brand .btn:hover,
.overlay-brand .btn-link:hover {
  border-color: rgba(211, 5, 53, 0.64);
  background: linear-gradient(135deg, rgba(0, 75, 156, 0.78), rgba(211, 5, 53, 0.4));
}

.overlay-brand input,
.overlay-brand select,
.overlay-brand textarea {
  border-color: var(--fecod-line);
  background: rgba(1, 7, 41, 0.9);
  color: var(--fecod-white);
}

.overlay-brand input:focus-visible,
.overlay-brand select:focus-visible,
.overlay-brand textarea:focus-visible,
.overlay-brand button:focus-visible,
.overlay-brand .btn:focus-visible,
.overlay-brand .btn-link:focus-visible {
  outline: 2px solid var(--fecod-blue-light);
  outline-offset: 1px;
}

body.overlay-brand {
  color: var(--fecod-white);
}

body.realizador-body.overlay-brand {
  --rz-bg: var(--fecod-night);
  --rz-panel: var(--fecod-night);
  --rz-panel-alt: var(--fecod-blue-deep);
  --rz-cyan: var(--fecod-blue-light);
  --rz-red: var(--fecod-red);
  --rz-gold: var(--fecod-blue-light);
  --rz-soft: var(--fecod-text-soft);
  --rz-border: var(--fecod-line);
  background:
    radial-gradient(circle at 8% 12%, rgba(0, 75, 156, 0.22), transparent 35%),
    radial-gradient(circle at 92% 8%, rgba(211, 5, 53, 0.16), transparent 34%),
    linear-gradient(180deg, #010729 0%, #001e46 56%, #010729 100%);
}

body.overlay-v2-page.overlay-brand #overlay,
body.hp-chart-page.overlay-brand,
body.series-page.overlay-brand {
  background: transparent;
}

body.overlay-v2-page.overlay-brand {
  --accent: var(--fecod-blue-light);
  --bg: var(--fecod-night);
  --bg-dark: var(--fecod-blue-deep);
}

body.overlay-v2-page.overlay-brand .header,
body.overlay-v2-page.overlay-brand .map-strip,
body.overlay-v2-page.overlay-brand .bans-section,
body.overlay-v2-page.overlay-brand .map-pool {
  border-color: var(--fecod-line);
}

body.series-page.overlay-brand {
  background: transparent;
}

body.hp-chart-page.overlay-brand {
  background:
    radial-gradient(circle at top, rgba(0, 75, 156, 0.42), rgba(1, 7, 41, 0.95) 70%);
}

body.stats-summary-page.overlay-brand .stats-frame {
  border-color: var(--fecod-line-strong);
  background: linear-gradient(135deg, rgba(1, 7, 41, 0.95), rgba(0, 30, 70, 0.84));
}

body.stats-summary-page.overlay-brand .stats-kicker,
body.stats-summary-page.overlay-brand .stats-panel-title,
body.stats-summary-page.overlay-brand .stats-score-chip {
  color: var(--fecod-blue-light);
}

body.stats-summary-page.overlay-brand .stats-row,
body.stats-summary-page.overlay-brand .stats-metric,
body.stats-summary-page.overlay-brand .stats-score-chip,
body.stats-summary-page.overlay-brand .stats-winner-chip {
  border-color: var(--fecod-line);
  background: rgba(1, 7, 41, 0.78);
}

body.overlay-compact-body.overlay-brand .compact-card {
  border-color: var(--fecod-line);
  background: linear-gradient(135deg, rgba(1, 7, 41, 0.92), rgba(0, 30, 70, 0.86));
}

body.overlay-compact-body.overlay-brand .compact-head {
  border-bottom-color: var(--fecod-line);
  background: rgba(0, 30, 70, 0.56);
}

body.overlay-compact-body.overlay-brand .compact-brand {
  color: var(--fecod-blue-light);
}

body.heatmap-page.overlay-brand {
  --heatmap-bg: var(--fecod-night);
  --heatmap-panel: rgba(1, 7, 41, 0.92);
  --heatmap-panel-strong: rgba(0, 30, 70, 0.96);
  --heatmap-border: var(--fecod-line);
  --heatmap-border-strong: var(--fecod-line-strong);
  --heatmap-text: var(--fecod-white);
  --heatmap-muted: var(--fecod-text-soft);
  --heatmap-soft: rgba(175, 223, 249, 0.58);
  --heatmap-accent: var(--fecod-blue-light);
  --heatmap-success: var(--fecod-blue-main);
  background:
    radial-gradient(circle at top left, rgba(0, 75, 156, 0.2), transparent 32%),
    radial-gradient(circle at top right, rgba(211, 5, 53, 0.14), transparent 28%),
    linear-gradient(180deg, #010729 0%, #001e46 56%, #010729 100%);
}

body.guard-input-page.overlay-brand {
  --guard-bg: rgba(1, 7, 41, 0.9);
  --guard-card: rgba(0, 30, 70, 0.92);
  --guard-stroke: var(--fecod-line);
  --guard-text: var(--fecod-white);
  --guard-muted: var(--fecod-text-soft);
  --guard-blue: var(--fecod-blue-light);
  --good: var(--fecod-blue-main);
  --warn: var(--fecod-blue-light);
  --bad: var(--fecod-red);
}

body.guard-active-page.overlay-brand {
  --guard-card: rgba(1, 7, 41, 0.88);
  --guard-stroke: var(--fecod-line);
  --guard-text: var(--fecod-white);
  --guard-muted: var(--fecod-text-soft);
  --team-accent: var(--fecod-blue-light);
}

body.guard-pulse-page.overlay-brand {
  --pulse-accent: var(--fecod-blue-light);
  --pulse-accent-rgb: 175, 223, 249;
  --pulse-stroke: rgba(175, 223, 249, 0.72);
  --pulse-text: var(--fecod-white);
  --pulse-muted: var(--fecod-text-soft);
}

body.camera-feed-page.overlay-brand .camera-root {
  border-color: var(--fecod-line);
  background:
    radial-gradient(circle at top, rgba(0, 75, 156, 0.26), transparent 48%),
    linear-gradient(180deg, rgba(1, 7, 41, 0.84), rgba(0, 30, 70, 0.9));
}

body.gateway-body.overlay-brand .gateway-empty {
  background: linear-gradient(135deg, rgba(1, 7, 41, 0.76), rgba(0, 30, 70, 0.82));
  color: var(--fecod-white);
}

body.gateway-body.overlay-brand .gateway-empty-kicker {
  color: var(--fecod-blue-light);
  font-family: "BakBak", "Segoe UI", sans-serif;
  text-transform: uppercase;
}

body.stage-mv-page.overlay-brand {
  --bg: var(--fecod-night);
  --card: rgba(1, 7, 41, 0.9);
  --line: var(--fecod-line);
  --text: var(--fecod-white);
  --muted: var(--fecod-text-soft);
  --accent: var(--fecod-blue-light);
  background:
    radial-gradient(circle at 8% 12%, rgba(0, 75, 156, 0.28), transparent 34%),
    radial-gradient(circle at 92% 10%, rgba(211, 5, 53, 0.14), transparent 26%),
    linear-gradient(135deg, #010729 0%, #001e46 44%, #010729 100%);
}

body.tboard-body.overlay-brand {
  --tb-bg-0: var(--fecod-night);
  --tb-bg-1: var(--fecod-blue-deep);
  --tb-bg-2: #01245a;
  --tb-bg-3: #010729;
  --tb-card: rgba(1, 7, 41, 0.86);
  --tb-card-strong: rgba(0, 30, 70, 0.94);
  --tb-glass: rgba(0, 75, 156, 0.22);
  --tb-cyan: var(--fecod-blue-light);
  --tb-blue: var(--fecod-blue-main);
  --tb-violet: var(--fecod-blue-main);
  --tb-pink: var(--fecod-red);
  --tb-acid: var(--fecod-blue-light);
  --tb-gold: var(--fecod-blue-light);
  --tb-text: var(--fecod-white);
  --tb-text-soft: var(--fecod-text-soft);
  --tb-text-dim: rgba(175, 223, 249, 0.68);
}

body.arbitro-page.overlay-brand {
  --bg0: var(--fecod-night);
  --bg1: var(--fecod-blue-deep);
  --card: rgba(1, 7, 41, 0.8);
  --card2: rgba(0, 30, 70, 0.92);
  --line: var(--fecod-line);
  --text: var(--fecod-white);
  --muted: var(--fecod-text-soft);
  --ok: var(--fecod-blue-light);
  --warn: var(--fecod-blue-main);
  background:
    radial-gradient(1200px 800px at 10% 10%, rgba(0, 75, 156, 0.28), transparent 55%),
    radial-gradient(900px 600px at 85% 15%, rgba(211, 5, 53, 0.14), transparent 55%),
    linear-gradient(180deg, var(--bg0), var(--bg1));
}

body.arbitro-page.overlay-brand .tournament-selector,
body.arbitro-page.overlay-brand .assigned-section,
body.arbitro-page.overlay-brand .assigned-match,
body.arbitro-page.overlay-brand .filter-btn,
body.arbitro-page.overlay-brand .match-search,
body.arbitro-page.overlay-brand .stat-chip,
body.arbitro-page.overlay-brand .assigned-match-action {
  border-color: var(--fecod-line) !important;
}

body.arbitro-page.overlay-brand .assigned-section,
body.arbitro-page.overlay-brand .assigned-match,
body.arbitro-page.overlay-brand .tournament-selector {
  background: linear-gradient(135deg, rgba(1, 7, 41, 0.86), rgba(0, 30, 70, 0.74)) !important;
}

body.arbitro-page.overlay-brand .assigned-section h3,
body.arbitro-page.overlay-brand .assigned-match-tournament,
body.arbitro-page.overlay-brand .filter-btn.active,
body.arbitro-page.overlay-brand .assigned-match-action {
  color: var(--fecod-blue-light) !important;
}

body.arbitro-page.overlay-brand .assigned-match-action,
body.arbitro-page.overlay-brand .filter-btn.active {
  background: rgba(0, 75, 156, 0.28) !important;
}

@media (max-width: 1200px) {
  .overlay-brand h1,
  .overlay-brand h2,
  .overlay-brand h3 {
    letter-spacing: 0.03em;
  }
}
