/* Neutral site foundation; independent BoomScore identity.
   Red is an accent, not a page/panel tint. Data and team colors are independent. */
:root {
  --brand-red: #fb090b;
  --brand-red-ink: #c40709;
  --brand-red-soft: #f4f4f4;
  --surface: #fff;
  --surface-muted: #f3f3f3;
  --charcoal: #202020;
  --ink: #141414;
  --muted: #666;
  --soft: #858585;
  --line: #e7e7e7;
  --bg: #f5f5f5;
  --white: #fff;
  --nav: #080808;
  --coral: var(--brand-red);
  --coral-light: var(--brand-red-soft);
  --shadow: 0 4px 18px #00000005;
}
::selection { background: #ffd8d8; color: #111; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible {
  outline-color: var(--brand-red-ink);
}
.brand img, .mobile-brand img { object-fit: contain; }
.brand img { transform: scale(1.13); }
.brand small { color: #aaa; }
.sidebar { color: #b8b8b8; scrollbar-color: #484848 #080808; }
.sidebar .sport-picker { background: #191919; border-color: transparent; }
.sport-picker small, .sport-picker > .icon { color: #aaa; }
.cs-mark { background: var(--brand-red); color: #000; }
.nav-link > .icon { color: #aaa; }
.nav-link:hover { background: #202020; }
.nav-link.active { background: #242424; }
.nav-link.active > .icon { color: var(--brand-red); }
.nav-count { background: var(--brand-red); color: #000; font-weight: 750; }
.nav-label, .sidebar-bottom > p { color: #959595; }
.sidebar-bottom > a { color: #c0c0c0; }
.sidebar-separator { background: #303030; }
.preview-badge > span { background: var(--brand-red); }
.topbar { background: #fff; border-color: transparent; }
.sample-notice { background: #fafafa; border-color: transparent; color: #666; }
.sample-notice a { color: #333; }
.button { color: #333; border-color: transparent; }
.button:hover { background: #f4f4f4; border-color: transparent; }
.button.coral { background: var(--brand-red-ink); border-color: var(--brand-red-ink); color: #fff; box-shadow: none; }
.button.coral:hover { background: #a90608; border-color: #a90608; color: #fff; }
.text-link, .data-table a { transition: color .15s; }
.text-link:hover, .data-table a:hover { color: var(--brand-red-ink); }
.page-tabs > button.active, .match-tabs > button.active, .region-tabs > button.active,
.tabs > button.active { color: var(--brand-red-ink); }
.page-tabs > button.active:after { background: var(--brand-red); }
.segment-control > button.active, .segmented > button.active { color: #111; }
.feature-match { background: var(--charcoal); }
.feature-match:before { background: none; }
.editorial-banner { background: #f0f0f0; border-color: transparent; }
.editorial-banner h3 { color: #222; }
.editorial-banner p { color: #666; }
.region-picker > a { color: #666; border-color: transparent; }
.region-picker > a.active { background: #111; border-color: transparent; color: #fff; }
.region-intro, .rankings-intro { background: #f0f0f0; border-color: transparent; }
.region-intro h2, .rankings-intro h2 { color: #252525; }
.region-intro p, .rankings-intro p { color: #666; }
.region-intro:after { color: #dedede; }
.ranking-window { border-color: transparent; }
.ranking-window > strong { color: #252525; }
.ranking-window > span, .ranking-window > small { color: #666; }
.section-head h2, .scoreboard-team > a, .score-player, .table-team, .region-mini h3,
.team-context h3, .team-power-value > strong { color: #333; }
.ranking-row small, .player-card-info p, .team-card > p { color: #707070; }
.map-card.selected { border-color: var(--brand-red); box-shadow: 0 0 0 1px var(--brand-red); }
.round-cell:not(.round-b) > b { background: #ffe4e4; color: var(--brand-red-ink); }
.coral-bg { background: var(--brand-red); }
.timeline-point.current { box-shadow: 0 0 0 1px #ffb8b8; }
.search-results { border-color: transparent; box-shadow: 0 12px 40px #00000020; }
.search-results > a:hover { background: #f4f4f4; }
.search-results strong { color: #333; }
.search-results small { color: #777; }
.footer-brand { color: #333; }
.about-panel > img { object-fit: contain; }

/* Surface palette applies across profiles, matches, regions and utility views. */
.sample-tag, .user-avatar { background: #f2f2f2; border-color: transparent; color: #666; }
.note-card, .player-of-match, .planned-art { background: #f0f0f0; border-color: transparent; }
.note-card:after, .planned-art > span { color: #ddd; }
.note-card h3, .player-of-match h3 { color: #292929; }
.note-card > .eyebrow, .note-card > .text-link,
.player-of-match > .eyebrow, .player-of-match > div > span { color: #666; }
.planned-art > .icon { color: #999; }
.player-identity-art { background: linear-gradient(140deg, #e9e9e9, #f2f2f2); }
.player-card-image { background: #f0f0f0; }
.editorial-icon, .region-mini > span { background: #e8e8e8; color: #777; }
.official-monogram { background: #f3f3f3; border-color: transparent; color: #888; }
.trophy-art { background: #f5f5f5; border-color: transparent; }
.trophy-cabinet .eyebrow { color: #777; }
.bracket-stage > a > div, .bracket-tbd > p { background: #fafafa; color: #666; }
.bracket-stage > span, .bracket-stage b, .bracket-stage > small { color: #777; }
.bracket-connector:after { background: #ddd; }
.toast { background: #262626; border-color: transparent; color: #eee; box-shadow: 0 7px 24px #0003; }
.sidebar-overlay { background: #0007; }
.week-lineup > a, .roster-card, .event-team-grid > a { background: #fafafa; border-color: transparent; }
.segmented { background: #eee; border-color: transparent; }
.segmented > button { color: #666; }
.segmented > button.active { border-color: transparent; box-shadow: 0 1px 3px #0000000d; }
.match-tabs > button.active { background: #f0f0f0; }
.trait-tags > .chip { background: #f8f8f8; border-color: transparent; color: #666; }
.coral-chip { background: #f5f5f5; border-color: transparent; color: #555; }
.map-card, .map-card:nth-child(2), .map-card:nth-child(3) {
  background: #f0f0f0; color: #555; border-color: transparent;
}
.map-card:after { background: repeating-linear-gradient(45deg, transparent 0 18px, #d0d0d060 19px 31px, transparent 32px 62px); }
.map-card:nth-child(2):after { background: repeating-linear-gradient(90deg, transparent 0 40px, #d0d0d050 41px 68px, transparent 69px 93px); }
.map-card.selected { border-color: var(--brand-red); }
.map-card > span, .map-card > b > small { color: #777; }
.map-thumbnail { background: repeating-linear-gradient(135deg, #c7c7c7 0 8px, #ddd 9px 14px, #ccc 15px 23px); }
.map-pool-bar { background: #eee; }
.map-pool-bar > i { background: #777; }
.map-pool-row > b { color: #555; }
.career-row strong, .trophy-cabinet h3, .compare-heroes > a > h2,
.event-card-body h2, .event-hero h1, .planned-feature h2,
.regional-team-row strong, .week-lineup strong, .event-team-grid strong,
.event-leaders strong, .category-leaders strong, .compare-heroes > div h3 { color: #333; }
.trait-summary > div > p, .trait-summary > div > small, .map-insight p,
.map-disclaimer, .map-legend > small, .trait-row, .career-row small,
.trophy-cabinet p, .team-context p, .map-pool-row > small, .roster-card small,
.roster-card p, .team-hero p, .team-power-value > span > small, .power-context,
.map-pool-row > strong, .region-intro > div:last-child > span, .regional-team-row small,
.week-context > span, .week-lineup > a > span:last-child, .planned-feature p,
.event-card-body > p, .event-card-body > div, .event-card-body > div > strong,
.event-team-grid small { color: #707070; }
@media (max-width: 640px) {
  .sidebar .sport-picker { background: #191919; border-color: transparent; }
}

/* Text-only product identity until the dedicated logo and wordmark are designed. */
.brand-short { display: none; }
.mobile-brand { color: #141414; text-decoration: none; }
.mobile-brand strong { font-size: 17px; font-weight: 800; letter-spacing: -.8px; white-space: nowrap; }
.about-wordmark { color: #141414; font-size: 32px; font-weight: 800; letter-spacing: -1.4px; margin-bottom: 24px; }
@media (min-width: 541px) and (max-width: 860px) {
  .brand .brand-short { display: block; font-size: 18px; letter-spacing: -1px; }
  .brand { justify-content: center; padding: 0; }
}