/* Generated by apps/web-overlays build packaging. Source lives under apps/web-overlays/src. Do not edit generated outputs directly. Tier: generated-packaged-overlays. Source: shared runtime asset shared/OverlayRuntime.css. */
:root {
  --footprint-width: 100%;
  --footprint-height: auto;
  --footprint-scale: 1;

  --overlay-scale: 1;
  --scale: var(--overlay-scale, 1);
  --overlay-shell-density: 0.92;

  --font-body-stack:
    'Inter', 'Segoe UI', system-ui, -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Arial, sans-serif;
  --font-display-stack: 'Bebas Neue', 'Impact', 'Haettenschweiler', 'Arial Narrow', sans-serif;
  --font-mono:
    'Space Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New',
    monospace;
  --font-monospace:
    'Roboto Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New',
    monospace;

  --shell-scale: 1;
  --shell-density: var(
    --overlay-shell-density,
    var(--overlay-density-factor-full, var(--overlay-density-factor, 0.92))
  );
  --shell-panel: var(--overlay-panel, rgba(4, 10, 16, 0.92));
  --shell-panel-strong: var(--overlay-panel-strong, rgba(6, 14, 22, 0.96));
  --shell-border: var(--overlay-border, rgba(255, 255, 255, 0.12));
  --shell-shadow: var(--overlay-shadow-lg, 0 24px 60px rgba(0, 0, 0, 0.55));
  --shell-radius-lg: calc(var(--overlay-radius-lg, 28px) * var(--shell-density));
  --shell-radius-md: calc(var(--overlay-radius-md, 18px) * var(--shell-density));
  --shell-gap: calc(16px * var(--shell-density));
  --shell-padding: var(--overlay-padding-full, calc(18px * var(--shell-density)));
  --shell-chip-font: calc(12px * var(--shell-density));
  --shell-chip-padding: calc(4px * var(--shell-density)) calc(12px * var(--shell-density));
  --shell-divider: rgba(255, 255, 255, 0.12);

  --broadcast-panel: var(--panel-solid-bg, rgba(6, 12, 18, 0.9));
  --broadcast-panel-strong: var(--panel-glass-bg, rgba(10, 18, 26, 0.94));
  --broadcast-border: var(--panel-solid-border, rgba(255, 255, 255, 0.18));
  --broadcast-border-soft: rgba(255, 255, 255, 0.08);
  --broadcast-text: var(--overlay-text, #f5f8ff);
  --broadcast-muted: var(--overlay-muted, #97a6bb);
  --broadcast-accent: var(--overlay-primary, #00aeef);
  --broadcast-accent-soft: rgba(0, 174, 239, 0.2);
  --broadcast-danger: var(--overlay-accent-warning, #ff5c73);
  --broadcast-radius: var(--overlay-radius-lg, 22px);
  --broadcast-shadow: var(--detail-depth-shadow, var(--overlay-shadow-lg, 0 24px 60px rgba(0, 0, 0, 0.65)));
  --broadcast-gradient: var(--detail-gradient, none);
  --broadcast-border-style: var(--detail-border-style, solid);
  --broadcast-border-glow: var(--detail-border-glow, transparent);
  --broadcast-stripe-color: var(--detail-stripe-color, transparent);
  --broadcast-stripe-spacing: var(--detail-stripe-spacing, 180px);
  --broadcast-stripe-width: var(--detail-stripe-width, 18px);
  --broadcast-stripe-opacity: var(--detail-stripe-opacity, 0);
  --broadcast-dash-color: var(--detail-dash-color, var(--broadcast-accent));
  --broadcast-dash-spacing: var(--detail-dash-spacing, 16px);
  --broadcast-glow: var(--detail-glow, transparent);
  --broadcast-surface-solid: color-mix(
    in srgb,
    var(--panel-solid-bg, var(--broadcast-panel, rgba(6, 12, 18, 0.9))) 78%,
    transparent
  );
  --broadcast-surface-strong: color-mix(
    in srgb,
    var(--panel-solid-bg, var(--broadcast-panel, rgba(6, 12, 18, 0.9))) 92%,
    transparent
  );
  --broadcast-surface-glass: color-mix(
    in srgb,
    var(--panel-glass-bg, rgba(255, 255, 255, 0.08)) 58%,
    transparent
  );
  --broadcast-chip-bg: var(--chip-primary-bg, rgba(255, 255, 255, 0.06));
  --broadcast-chip-border: var(
    --chip-primary-border,
    var(--broadcast-border-soft, rgba(255, 255, 255, 0.12))
  );
  --broadcast-chip-text: var(--chip-primary-text, var(--broadcast-text, #f5f8ff));

  --portal-bg: #0b1117;
  --portal-bg-soft: #0f1922;
  --portal-card: rgba(14, 24, 32, 0.9);
  --portal-border: rgba(255, 255, 255, 0.12);
  --portal-muted: #9db0c2;
  --portal-text: #f5f7fb;
  --portal-accent: #21d4b3;
  --portal-accent-2: #ff8a5c;
  --portal-danger: #ff5c73;
  --portal-shadow: 0 30px 60px rgba(0, 0, 0, 0.35);
  --portal-radius: 22px;

  --welcome-bg:
    radial-gradient(circle at 20% 15%, rgba(18, 38, 66, 0.28), transparent 40%),
    radial-gradient(circle at 80% 10%, rgba(10, 22, 34, 0.18), transparent 45%),
    linear-gradient(160deg, #05070b 0%, #0a0f16 45%, #070a0f 100%);
  --welcome-panel: rgba(12, 19, 28, 0.92);
  --welcome-border: rgba(255, 255, 255, 0.12);
  --welcome-accent: #44d0ff;
  --welcome-accent-2: #ff9b4b;

  --control-room-judge-line-gradient: linear-gradient(135deg, rgba(17, 80, 124, 0.85), rgba(9, 20, 30, 0.95));
  --control-room-judge-angle-gradient: linear-gradient(
    135deg,
    rgba(9, 20, 30, 0.92),
    rgba(255, 95, 109, 0.85)
  );
  --control-room-judge-style-gradient: linear-gradient(
    135deg,
    rgba(255, 145, 77, 0.82),
    rgba(9, 20, 30, 0.95)
  );
}

.judge-shell,
.commentator-layout {
  --overlay-primary: #11507c;
  --overlay-primary-strong: #0b4064;
  --overlay-panel: #0f1f2b;
  --overlay-panel-dark: #0f0f0f;
  --overlay-surface: #566b7b;
  --overlay-border: rgba(161, 164, 168, 0.35);
  --overlay-text: #f5f8ff;
  --overlay-muted: #a1a4a8;
  --overlay-accent-success: #7dff8a;
  --overlay-accent-warning: #ff914d;
  --overlay-radius-lg: 32px;
  --overlay-radius-md: 20px;
  --overlay-radius-sm: 12px;
  --overlay-shadow-lg: 0 24px 60px rgba(0, 0, 0, 0.55);
  --overlay-shadow-md: 0 16px 36px rgba(0, 0, 0, 0.35);
}

.qual-selector-shell {
  --overlay-shell-density: 0.92;
  --scale: var(--overlay-shell-density, 0.92);
  --bg: #040f13;
  --bg2: #071e26;
  --panel: #08171d;
  --panel-soft: #0d222b;
  --card: #0e222c;
  --card-hover: #143446;
  --card-active: #00aeef;
  --border: rgba(255, 255, 255, 0.16);
  --border-soft: rgba(255, 255, 255, 0.1);
  --text: #ffffff;
  --muted: #aeb7c2;
  --warning: #ffb347;
  --error: #ff6868;
  --success: #8ee28e;
}

body.judge-bracket-page {
  --bg: #03070d;
  --panel: rgba(8, 10, 18, 0.92);
  --panel-strong: rgba(6, 14, 22, 0.96);
  --text: #f6f8ff;
  --muted: #9fb0c8;
  --accent: #00aef0;
  --line: rgba(255, 255, 255, 0.08);
  --overlay-width: 720px;
  --column-count: 2;
}

@media (max-width: 900px) {
  body.judge-bracket-page {
    --overlay-width: 100%;
    --column-count: 1;
  }
}

.judge-shell--battle {
  --overlay-shell-density: 0.95;
  --overlay-scale-factor: var(--overlay-scale, 1);
  --canvas-width: calc(1920px * var(--overlay-scale-factor));
  --canvas-height: calc(1080px * var(--overlay-scale-factor));
  --bg: var(--overlay-bg, #03070d);
  --panel: var(--judge-panel, var(--overlay-panel, rgba(8, 18, 28, 0.96)));
  --panel-dark: var(--judge-panel-dark, var(--panel));
  --border: var(--overlay-border, rgba(255, 255, 255, 0.15));
  --text: var(--overlay-text, #ecf6ff);
  --muted: var(--overlay-muted, #8ea5c3);
  --accent: var(--judge-accent, var(--overlay-primary, #00b7ff));
  --accent-strong: var(--judge-accent-strong, var(--accent));
  --accent-red: var(--danger, #ff5c73);
  --omt: var(--warning, #ffc857);
  --bg2: var(--overlay-panel, #06182b);
}

.judge-shell--quali {
  --overlay-shell-density: 0.92;
  --overlay-scale-factor: var(--overlay-scale, 1);
  --canvas-width: calc(1920px * var(--overlay-scale-factor));
  --canvas-height: calc(1080px * var(--overlay-scale-factor));
  --bg: var(--overlay-bg, #03070d);
  --bg2: var(--overlay-panel, #041121);
  --panel: var(--judge-panel, var(--overlay-panel, rgba(8, 18, 28, 0.96)));
  --panel-dark: var(--judge-panel-dark, rgba(3, 12, 19, 0.96));
  --border: var(--overlay-border, rgba(255, 255, 255, 0.14));
  --text: var(--overlay-text, #ecf6ff);
  --muted: var(--overlay-muted, #94a8c4);
  --accent: var(--judge-accent, var(--overlay-primary, #00b7ff));
  --accent-soft: var(--judge-accent-soft, rgba(0, 183, 255, 0.25));
  --accent-danger: var(--danger, #ff5c73);
}

body.asset-manager-page {
  --accent: #00aeef;
  --accent-soft: #3ba1c5;
  --bg: #040f13;
  --bg2: #071e26;
  --card: #08171d;
  --card-soft: #0d222b;
  --border: rgba(255, 255, 255, 0.14);
  --text: #ffffff;
  --muted: #aeb7c2;
  --danger: #ff4444;
  --success: #00c851;
}

body.ops-control-page {
  --bg: #0a0f14;
  --bg-deep: #020407;
  --panel: rgba(12, 20, 28, 0.9);
  --panel-strong: rgba(12, 20, 28, 0.97);
  --accent: #2af0c2;
  --accent-strong: #1ee6ff;
  --muted: rgba(220, 232, 242, 0.6);
  --border: rgba(255, 255, 255, 0.12);
  --glow: 0 24px 60px rgba(0, 0, 0, 0.6);
  --radius: 18px;
}

body.obs-bridge-page {
  --bg: #070b10;
  --panel: rgba(10, 16, 24, 0.88);
  --panel-strong: rgba(10, 16, 24, 0.96);
  --border: rgba(255, 255, 255, 0.12);
  --muted: rgba(230, 240, 255, 0.68);
  --accent: #2af0c2;
  --accent-2: #1ee6ff;
  --danger: #ff6b6b;
  --radius: 18px;
}

body.quali-groups-editor-page {
  --bg: #01070a;
  --panel: #08151b;
  --panel-soft: #102028;
  --border: rgba(255, 255, 255, 0.15);
  --border-soft: rgba(255, 255, 255, 0.08);
  --text: #f0f6f8;
  --muted: #9db0bb;
  --accent: #00aeef;
  --danger: #ff6161;
  --success: #7dd47d;
  --warning: #f2c078;
}

body.quali-run-manager-page {
  --bg: #000000;
  --panel: rgba(10, 16, 28, 0.94);
  --panel-soft: rgba(17, 24, 39, 0.92);
  --border: rgba(255, 255, 255, 0.08);
  --text: #f4f6ff;
  --muted: #94a3b8;
  --accent: #00c6ff;
  --accent-dark: #0077ff;
  --danger: #ff5a7c;
  --success: #4ade80;
}

body.commentator-dq-page {
  --footprint-width: 1280px;
  --footprint-height: 800px;
  --overlay-shell-density: 0.92;
  --panel: var(--commentator-panel, rgba(11, 24, 36, 0.92));
  --panel-strong: rgba(5, 10, 18, 0.85);
  --border: var(--overlay-border, rgba(255, 255, 255, 0.14));
  --accent: var(--commentator-accent, var(--danger, #ff5f6d));
  --muted: var(--overlay-muted, #a1a4a8);
  --text: var(--overlay-text, #ffffff);
}

body.commentator-mechanical-page {
  --footprint-width: 1280px;
  --footprint-height: 800px;
  --overlay-shell-density: 0.92;
  --panel: var(--commentator-panel, rgba(11, 24, 36, 0.92));
  --panel-strong: rgba(5, 10, 18, 0.85);
  --border: var(--overlay-border, rgba(255, 255, 255, 0.14));
  --accent: var(--commentator-accent, var(--overlay-primary, #11507c));
  --muted: var(--overlay-muted, #a1a4a8);
  --text: var(--overlay-text, #ffffff);
}

body.commentator-noshow-page {
  --footprint-width: 1280px;
  --footprint-height: 800px;
  --overlay-shell-density: 0.92;
  --panel: var(--commentator-panel, rgba(11, 24, 36, 0.92));
  --panel-strong: rgba(5, 10, 18, 0.85);
  --border: var(--overlay-border, rgba(255, 255, 255, 0.14));
  --accent: var(--commentator-accent, var(--warning, #ff914d));
  --muted: var(--overlay-muted, #a1a4a8);
  --text: var(--overlay-text, #ffffff);
}

body.commentator-status-manager-page {
  --footprint-width: 1280px;
  --footprint-height: 800px;
  --overlay-shell-density: 0.92;
  --panel: var(--commentator-panel, rgba(11, 24, 36, 0.92));
  --panel-strong: rgba(5, 10, 18, 0.85);
  --border: var(--overlay-border, rgba(255, 255, 255, 0.14));
  --accent: var(--commentator-accent, var(--overlay-primary, #11507c));
  --muted: var(--overlay-muted, #a1a4a8);
  --text: var(--overlay-text, #ffffff);
}

body.commentator-status-manager-page[data-status-tab='noshow'] {
  --accent: var(--commentator-accent, var(--warning, #ff914d));
}

body.commentator-status-manager-page[data-status-tab='dq'] {
  --accent: var(--commentator-accent, var(--danger, #ff5f6d));
}

body.commentator-status-manager-page[data-status-tab='mechanical'] {
  --accent: var(--commentator-accent, var(--overlay-primary, #11507c));
}

body.commentator-palette-page {
  --palette-bg: #02040a;
  --palette-panel: rgba(17, 24, 31, 0.9);
  --palette-border: rgba(255, 255, 255, 0.08);
  --palette-accent: #72ffea;
  --palette-muted: rgba(255, 255, 255, 0.6);
  --palette-soft: rgba(255, 255, 255, 0.05);
}


@import url('/vendor/bridge-fonts.css');

*,
*::before,
*::after {
  box-sizing: border-box;
}

[hidden] {
  display: none !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
figure,
blockquote,
dl,
dd {
  margin: 0;
}

ul,
ol {
  margin: 0;
  padding: 0;
}

html,
body {
  width: 100%;
  min-height: 100vh;
  margin: 0;
  padding: 0;
  background: transparent;
  overflow-x: hidden;
  overflow-y: auto;
}

html {
  color-scheme: dark;
}

body {
  font-family: var(--font-body-stack, 'Inter', 'Segoe UI', sans-serif);
  color: var(--overlay-text, #f4f6fb);
  -webkit-font-smoothing: antialiased;
}

.scale-wrapper {
  width: 100%;
  min-height: 100vh;
}

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

select {
  background-color: rgba(8, 16, 24, 0.92);
  border: 1px solid rgba(255, 255, 255, 0.14);
  color: #eef5ff;
}

select:focus-visible {
  outline: 2px solid rgba(0, 174, 239, 0.55);
  outline-offset: 1px;
}

select option,
select optgroup {
  background: #0a1521;
  color: #eef5ff;
}

.flex-center {
  display: flex;
  align-items: center;
  justify-content: center;
}

.flex-between {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.text-right {
  text-align: right;
}

.text-center {
  text-align: center;
}

.truncate-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}