/* ============================================================
   CLAW WRESTLING V5 — SCAR GLOW SYSTEM
   
   Core principle: Text/objects stay WHITE. The ENVIRONMENT
   around them glows. Exactly like the gold scar on the ground —
   the gun is gold but the LIGHT radiates outward onto the 
   grid/grass/water around it.
   
   Method: drop-shadow filters on containers, box-shadow on
   borders, pseudo-elements with radial gradients BEHIND text.
   Never text-shadow with color. Text is always white.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Lilita+One&family=Russo+One&family=Bowlby+One&family=Barlow+Condensed:wght@700;800;900&family=Orbitron:wght@400;500;600;700;800;900&family=Barlow:wght@300;400;500&family=DM+Mono:wght@400;500&display=swap');

:root {
  --gx: 52px;          /* side gutter: grows on wide screens, shrinks on phones */
  --fs-xs: 9px;        /* floor for micro labels */
  --fs-s: 9px;
  --red:       #c8102e;
  --red2:      #e8203e;
  --red-dark:  #6a0018;
  --blue:      #0a1e4a;
  --blue2:     #122060;
  --cyan:      #00d4ff;
  --white:     #ffffff;
  --off-white: #e8f0ff;
  --chrome:    #a0b8d8;

  /* Bloom colors — these go on BACKGROUNDS, not text */
  --bloom-red:  rgba(200,16,46,0.65);
  --bloom-gold: rgba(255,190,40,0.55);
  --bloom-cyan: rgba(0,212,255,0.45);
  --bloom-white:rgba(255,255,255,0.15);

  /* Surfaces */
  --bg:     #04080f;
  --s1:     #060c18;
  --s2:     #091220;
  --s3:     #0d1a2e;
  --s4:     #122038;
  --border: #162848;
  --border2:#1e3860;
  --dim:    #1a3050;

  /* Text — always near-white */
  --t1: #f0f4ff;
  --t2: #7a9ac8;
  --t3: #3a5878;

  /* Team accent colors */
  --tc-cicadas:  #7ec832;
  --tc-enforce:  #c41230;
  --tc-leopards: #d4940a;
  --tc-hammers:  #5bbcd4;
  --tc-matkings: #9b4fd4;
  --tc-kaos:     #d4581a;

  /* Fonts */
  --display:  'Lilita One', 'Russo One', sans-serif;  /* Fortnite-style chunky cartoon */
  --num:      'Russo One', sans-serif;                /* Stats, numbers — clean angular */
  --orb:      'Orbitron', sans-serif;                 /* Tech labels, nav */
  --cond:     'Barlow Condensed', sans-serif;
  --body:     'Barlow', sans-serif;
  --mono:     'DM Mono', monospace;
}

/* ── RESET ─────────────────────────────────────────────── */
* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  background: var(--bg);
  color: var(--t1);
  font-family: var(--body);
  min-height: 100vh;
  overflow-x: hidden;
}

/* Scanline — subtle CRT texture */
body::after {
  content: '';
  position: fixed; inset: 0; z-index: 9999;
  pointer-events: none;
  background: repeating-linear-gradient(
    0deg,
    transparent, transparent 3px,
    rgba(0,0,0,0.055) 3px, rgba(0,0,0,0.055) 4px
  );
}

::-webkit-scrollbar { width: 3px; }
::-webkit-scrollbar-track { background: var(--bg); }
::-webkit-scrollbar-thumb { background: var(--red); }

/* ── SCAR GLOW UTILITY ─────────────────────────────────────
   Apply these to a WRAPPER element, not the text itself.
   The pseudo-element sits BEHIND and radiates outward.
   ─────────────────────────────────────────────────────── */
.scar-red,
.scar-gold,
.scar-cyan {
  position: relative;
  /* isolate so z-index on ::before works */
}

.scar-red::before {
  content: '';
  position: absolute;
  inset: -40px -60px;
  background: radial-gradient(
    ellipse at 50% 55%,
    var(--bloom-red) 0%,
    rgba(200,16,46,0.25) 35%,
    rgba(200,16,46,0.08) 60%,
    transparent 80%
  );
  pointer-events: none;
  z-index: 0;
}

.scar-gold::before {
  content: '';
  position: absolute;
  inset: -40px -60px;
  background: radial-gradient(
    ellipse at 50% 55%,
    var(--bloom-gold) 0%,
    rgba(255,190,40,0.22) 35%,
    rgba(255,190,40,0.06) 60%,
    transparent 80%
  );
  pointer-events: none;
  z-index: 0;
}

.scar-cyan::before {
  content: '';
  position: absolute;
  inset: -40px -60px;
  background: radial-gradient(
    ellipse at 50% 55%,
    var(--bloom-cyan) 0%,
    rgba(0,212,255,0.2) 35%,
    rgba(0,212,255,0.05) 60%,
    transparent 80%
  );
  pointer-events: none;
  z-index: 0;
}

/* Text sits above the bloom */
.scar-red > *, .scar-gold > *, .scar-cyan > * { position: relative; z-index: 1; }

/* ── ANIMATIONS ────────────────────────────────────────── */
@keyframes float {
  0%,100% { transform: translateY(0px) rotate(0deg); }
  33%      { transform: translateY(-5px) rotate(0.3deg); }
  66%      { transform: translateY(-3px) rotate(-0.2deg); }
}

@keyframes sweep {
  0%   { left: -80%; opacity: 0; }
  10%  { opacity: 1; }
  90%  { opacity: 1; }
  100% { left: 180%; opacity: 0; }
}

@keyframes pulse-border-red {
  0%,100% { box-shadow: 0 0 0 0 transparent, 0 0 12px var(--bloom-red); }
  50%      { box-shadow: 0 0 0 1px rgba(200,16,46,0.3), 0 0 28px var(--bloom-red); }
}

@keyframes pulse-dot {
  0%,100% { opacity: 1; }
  50%      { opacity: 0.25; }
}

@keyframes bloom-breathe {
  0%,100% { opacity: 0.7; }
  50%      { opacity: 1; }
}

/* ── NAV ───────────────────────────────────────────────── */
.nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 200;
  height: 58px;
  background: linear-gradient(180deg, rgba(4,8,15,0.98), rgba(6,12,24,0.96));
  backdrop-filter: blur(20px);
  /* Gold bloom on the bottom border — light catching the edge */
  border-bottom: 1px solid rgba(200,16,46,0.5);
  box-shadow:
    0 1px 0 rgba(200,16,46,0.15),
    0 3px 20px rgba(200,16,46,0.08),
    0 8px 40px rgba(0,0,0,0.6);
  display: flex; align-items: center;
  padding: 0 max(20px, var(--gx)); gap: 0;
}

/* Red vertical bloom on left edge */
.nav::before {
  content: '';
  position: absolute; left: 0; top: 0; bottom: 0;
  width: 2px;
  background: var(--red);
  box-shadow: 0 0 12px var(--bloom-red), 0 0 30px rgba(200,16,46,0.4);
}

.nav-logo {
  display: flex; align-items: center; gap: 9px;
  cursor: pointer; padding-left: 10px; margin-right: 20px;
  flex-shrink: 0;
}

.nav-logo-text {
  font-family: var(--orb);
  font-size: 16px; font-weight: 700;
  letter-spacing: 0.12em;
  color: var(--white);
}

.nav-divider {
  width: 1px; height: 22px;
  background: linear-gradient(to bottom, transparent, var(--border2), transparent);
  flex-shrink: 0; margin-right: 4px;
}

.nav-links { display: flex; flex: 1; padding: 0 8px; }

.nav-link {
  white-space: nowrap;
  font-family: var(--orb);
  font-size: 10px; font-weight: 500;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--t3); cursor: pointer;
  padding: 0 12px; height: 58px;
  display: flex; align-items: center;
  border-bottom: 2px solid transparent;
  transition: all 0.15s;
}
.nav-link:hover { color: var(--white); }
.nav-link.active {
  color: var(--white);
  border-bottom-color: var(--red);
  /* The active tab has a bloom underneath the border */
  box-shadow: inset 0 -4px 12px rgba(200,16,46,0.15);
}

.nav-right { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }

.nav-cta {
  background: var(--red);
  color: white;
  font-family: var(--orb);
   font-size: var(--fs-s); font-weight: 600;
  letter-spacing: 0.14em; text-transform: uppercase;
  padding: 8px 14px; border: none;
  border-radius: 1px; cursor: pointer;
  display: flex; align-items: center; gap: 7px;
  /* Red bloom radiating outward from the button */
  box-shadow:
    0 0 8px var(--bloom-red),
    0 0 20px rgba(200,16,46,0.3),
    0 2px 8px rgba(0,0,0,0.5);
  animation: pulse-border-red 3s ease-in-out infinite;
  transition: all 0.15s;
}
.nav-cta:hover {
  box-shadow: 0 0 16px var(--bloom-red), 0 0 40px rgba(200,16,46,0.4);
  transform: translateY(-1px);
}

/* ── HERO ──────────────────────────────────────────────── */
.hero {
  height: 100vh; min-height: 660px;
  position: relative; overflow: hidden;
  display: flex; flex-direction: column;
  padding-top: 58px;
}

.hero-bg {
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse at 20% 60%, rgba(200,16,46,0.18) 0%, transparent 45%),
    radial-gradient(ellipse at 80% 30%, rgba(10,30,100,0.3) 0%, transparent 55%),
    linear-gradient(180deg, #020510 0%, #030812 60%, #010308 100%);
}

/* PRIMARY SCAR GRID — the grid that catches the bloom light */
/* Two layers: fine grid close to logo, coarser grid farther out */
.hero-grid-fine {
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(200,16,46,0.10) 1px, transparent 1px),
    linear-gradient(90deg, rgba(200,16,46,0.10) 1px, transparent 1px);
  background-size: 32px 32px;
  /* Masked so it's intense near the logo position and fades away */
  -webkit-mask-image: radial-gradient(
    ellipse 50% 45% at 28% 62%,
    rgba(255,255,255,0.9) 0%,
    rgba(255,255,255,0.4) 30%,
    transparent 70%
  );
  mask-image: radial-gradient(
    ellipse 50% 45% at 28% 62%,
    rgba(255,255,255,0.9) 0%,
    rgba(255,255,255,0.4) 30%,
    transparent 70%
  );
}

/* Coarser grid — the outer glow catching the light further away */
.hero-grid-coarse {
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(200,16,46,0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(200,16,46,0.05) 1px, transparent 1px);
  background-size: 80px 80px;
  -webkit-mask-image: radial-gradient(
    ellipse 70% 60% at 28% 62%,
    transparent 20%,
    rgba(255,255,255,0.8) 40%,
    rgba(255,255,255,0.3) 65%,
    transparent 80%
  );
  mask-image: radial-gradient(
    ellipse 70% 60% at 28% 62%,
    transparent 20%,
    rgba(255,255,255,0.8) 40%,
    rgba(255,255,255,0.3) 65%,
    transparent 80%
  );
}

/* The bloom light column — the upward shaft of light from the scar */
.hero-bloom {
  position: absolute;
  left: 20%; top: 0; bottom: 0;
  width: 400px;
  transform: translateX(-50%);
  background: linear-gradient(
    180deg,
    transparent 0%,
    rgba(200,16,46,0.02) 30%,
    rgba(200,16,46,0.08) 55%,
    rgba(200,16,46,0.18) 70%,
    rgba(200,16,46,0.08) 80%,
    transparent 100%
  );
  animation: bloom-breathe 4s ease-in-out infinite;
  pointer-events: none;
}

/* Light sweep — Tomorrowland promo energy */
.hero-sweep {
  position: absolute; top: 0; bottom: 0;
  width: 6%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.03), transparent);
  animation: sweep 9s ease-in-out infinite;
}

.hero-fade {
  position: absolute; bottom: 0; left: 0; right: 0;
  height: 50%;
  background: linear-gradient(to bottom, transparent, rgba(4,8,15,0.92) 80%, var(--bg) 100%);
}

.hero-content {
  position: relative; z-index: 3;
  padding: 52px var(--gx) 0;
  flex: 1;
  display: flex; flex-direction: column;
  justify-content: flex-end;
}

/* WORDMARK — the "scar object" — normal colors, bloom radiates INTO environment */
.hero-wordmark {
  margin-bottom: 24px;
  margin-top: 8px;
  position: relative;
  width: fit-content;
  max-width: 100%;
  animation: float 5s ease-in-out infinite;
  padding: 4px 0;
}

/* The bloom that radiates OUTWARD from the wordmark onto the grid */
.hero-wordmark::before {
  content: '';
  position: absolute;
  /* Larger than the image — radiates beyond the logo */
  inset: -30px -60px -50px -60px;
  background: radial-gradient(
    ellipse at 50% 60%,
    rgba(200,16,46,0.7) 0%,
    rgba(200,16,46,0.35) 25%,
    rgba(200,16,46,0.12) 50%,
    rgba(200,16,46,0.03) 70%,
    transparent 85%
  );
  pointer-events: none;
  z-index: -1;
  animation: bloom-breathe 4s ease-in-out infinite;
}

.hero-wordmark img {
  height: 100px; width: auto;
  max-width: 100%;
  display: block;
  position: relative; z-index: 1;
  /* Subtle white edge to make logo pop off dark bg */
  filter: drop-shadow(0 0 2px rgba(255,255,255,0.4))
          drop-shadow(0 2px 6px rgba(0,0,0,0.5));
}

.hero-title {
  font-family: var(--display);
  font-size: clamp(54px, 8.5vw, 124px);
  line-height: 0.88;
  text-transform: uppercase;
  margin-bottom: 18px;
  position: relative;
}

.hero-title .line1 {
  display: block;
  color: var(--white);
}

/* Line 2 — white text with bloom radiating outward INTO the space behind it */
.hero-title .line2 {
  display: block;
  color: var(--white);
  position: relative;
}

/* The bloom sits behind line2, like the scar light on the ground */
.hero-title .line2::before {
  content: '';
  position: absolute;
  inset: -10px -30px -20px -10px;
  background: radial-gradient(
    ellipse at 30% 60%,
    rgba(200,16,46,0.45) 0%,
    rgba(200,16,46,0.18) 35%,
    rgba(200,16,46,0.05) 65%,
    transparent 80%
  );
  z-index: -1;
  pointer-events: none;
}

.hero-sub {
  font-family: var(--orb);
  font-size: 11px; font-weight: 400;
  letter-spacing: 0.26em; text-transform: uppercase;
  color: var(--chrome);
  margin-bottom: 28px;
  display: flex; align-items: center; gap: 12px;
}
.hero-sub::before {
  content: ''; display: inline-block;
  width: 28px; height: 1px;
  background: var(--red);
  box-shadow: 0 0 8px var(--bloom-red);
}

.hero-actions { display: flex; gap: 12px; flex-wrap: wrap; }

/* ── BUTTONS ───────────────────────────────────────────── */
.btn-red {
  background: var(--red);
  color: white;
  font-family: var(--orb);
  font-size: 11px; font-weight: 700;
  letter-spacing: 0.16em; text-transform: uppercase;
  padding: 13px 28px; border: 1px solid var(--red2);
  cursor: pointer;
  clip-path: polygon(8px 0%, 100% 0%, calc(100% - 8px) 100%, 0% 100%);
  /* Bloom radiating outward from the button */
  box-shadow:
    0 0 8px var(--bloom-red),
    0 0 24px rgba(200,16,46,0.3),
    0 4px 12px rgba(0,0,0,0.5);
  transition: all 0.15s;
}
.btn-red:hover {
  box-shadow: 0 0 16px var(--bloom-red), 0 0 48px rgba(200,16,46,0.4), 0 4px 16px rgba(0,0,0,0.6);
  transform: translateY(-2px);
}

.btn-chrome {
  background: transparent;
  color: var(--chrome);
  font-family: var(--orb);
  font-size: 11px; font-weight: 500;
  letter-spacing: 0.16em; text-transform: uppercase;
  padding: 12px 24px;
  border: 1px solid var(--border2);
  cursor: pointer; transition: all 0.15s;
  clip-path: polygon(8px 0%, 100% 0%, calc(100% - 8px) 100%, 0% 100%);
}
.btn-chrome:hover {
  border-color: var(--cyan);
  color: var(--white);
  box-shadow: 0 0 10px var(--bloom-cyan), 0 0 24px rgba(0,212,255,0.15);
}

/* ── TICKER BAR ────────────────────────────────────────── */
/* Dark bar — gold bloom light comes from the TOP border, like a horizon */
.stats-ticker {
  position: relative; z-index: 3;
  background: var(--s2);
  border-top: 1px solid rgba(200,16,46,0.55);
  border-bottom: 1px solid var(--border);
  padding: 0 var(--gx);
  display: flex;
  /* The bloom radiates UPWARD from this bar into the hero */
  box-shadow:
    0 -1px 0 rgba(200,16,46,0.4),
    0 -8px 30px rgba(200,16,46,0.12),
    0 -20px 60px rgba(200,16,46,0.05);
  margin-top: 20px;
}

.ticker-label {
  font-family: var(--orb);
   font-size: var(--fs-s); font-weight: 700;
  letter-spacing: 0.26em; text-transform: uppercase;
  color: var(--t3);
  padding: 11px 18px 11px 0;
  border-right: 1px solid var(--border2);
  margin-right: 18px; flex-shrink: 0;
  display: flex; align-items: center;
}

.ticker-stats { display: flex; gap: 0; flex: 1; }

.ticker-stat {
  display: flex; align-items: center; gap: 8px;
  padding: 9px 18px;
  border-right: 1px solid var(--border);
  flex-shrink: 0;
}
.ticker-stat:last-child { border-right: none; }

.ticker-stat-num {
  font-family: var(--num);
  font-size: 12px; color: var(--white);
  line-height: 1; letter-spacing: 0.06em;
}
.ticker-stat-lbl {
  font-family: var(--mono);
   font-size: var(--fs-xs); letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--t3);
}

/* ── SECTIONS ──────────────────────────────────────────── */
.sec {
  padding: 52px var(--gx);
  border-bottom: 1px solid var(--border);
  position: relative;
}

/* Vertical red bloom on left edge of every section */
.sec::before {
  content: '';
  position: absolute; left: 0; top: 20%; bottom: 20%;
  width: 1px;
  background: var(--red);
  box-shadow: 0 0 8px var(--bloom-red), 0 0 20px rgba(200,16,46,0.2);
  opacity: 0.4;
}

.sec-head {
  display: flex; align-items: flex-end;
  justify-content: space-between; margin-bottom: 28px;
}

.sec-title {
  font-family: var(--display);
  font-size: 46px; line-height: 0.9;
  text-transform: uppercase;
  color: var(--white);
}
.sec-title small {
  display: block;
  font-family: var(--orb);
   font-size: var(--fs-s); font-weight: 400;
  letter-spacing: 0.24em; text-transform: uppercase;
  color: var(--t3); margin-bottom: 8px;
}

/* Highlighted word in section title — white + bloom behind */
.sec-title .glow {
  color: var(--white);
  position: relative;
  display: inline-block;
}
.sec-title .glow::after {
  content: '';
  position: absolute;
  inset: -8px -16px -12px -4px;
  background: radial-gradient(
    ellipse at 35% 70%,
    rgba(200,16,46,0.5) 0%,
    rgba(200,16,46,0.18) 40%,
    transparent 70%
  );
  z-index: -1; pointer-events: none;
}

.sec-more {
  font-family: var(--orb);
   font-size: var(--fs-s); font-weight: 500;
  letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--t2); cursor: pointer;
  display: flex; align-items: center; gap: 6px;
  border-bottom: 1px solid var(--border2);
  padding-bottom: 2px; transition: all 0.15s;
}
.sec-more::after { content: '→'; }
.sec-more:hover { color: var(--white); border-color: var(--chrome); }

/* ── TIER COLORS ───────────────────────────────────────── */
/* OVR text stays white — parent container gets the bloom */
.c-elite  { color: var(--white); text-shadow: 0 0 6px rgba(255,255,255,0.6), 0 0 18px rgba(0,255,157,0.7), 0 0 40px rgba(0,255,157,0.3); }
.c-strong { color: var(--white); text-shadow: 0 0 6px rgba(255,255,255,0.6), 0 0 18px rgba(255,200,60,0.7), 0 0 40px rgba(255,200,60,0.3); }
.c-good   { color: var(--white); text-shadow: 0 0 4px rgba(255,255,255,0.5), 0 0 14px rgba(255,140,0,0.7); }
.c-mid    { color: var(--white); text-shadow: 0 0 4px rgba(255,255,255,0.4), 0 0 12px rgba(255,80,0,0.6); }
.c-low    { color: var(--t2); }
.f-elite  { background: #00ff9d; box-shadow: 0 0 6px rgba(0,255,157,0.8); }
.f-strong { background: #ffc83c; box-shadow: 0 0 6px rgba(255,200,60,0.8); }
.f-good   { background: #ff9900; box-shadow: 0 0 5px rgba(255,153,0,0.7); }
.f-mid    { background: #ff5500; box-shadow: 0 0 5px rgba(255,85,0,0.6); }
.f-low    { background: var(--t3); }

/* ── TEAMS STRIP ───────────────────────────────────────── */
.teams-strip { display: grid; grid-template-columns: repeat(6,1fr); gap: 2px; background: var(--dim); }

.tstrip {
  background: var(--s1);
  padding: 18px 10px; text-align: center;
  cursor: pointer; transition: background 0.3s, box-shadow 0.3s, transform 0.2s;
  position: relative; overflow: hidden;
  border-top: 2px solid var(--c2, var(--border));
}

/* Full flood light — fills entire strip cell like the scar pool of light */
.tstrip::before {
  content: '';
  position: absolute; inset: 0; z-index: 0;
  background: radial-gradient(
    ellipse at 50% 35%,
    var(--tc-bloom-bright, rgba(200,16,46,0.85)) 0%,
    var(--tc-bloom-mid,   rgba(200,16,46,0.5))  35%,
    var(--tc-bloom-edge,  rgba(200,16,46,0.2))  65%,
    transparent 85%
  );
  opacity: 0; transition: opacity 0.3s;
  pointer-events: none;
}

/* Grid catching the light */
.tstrip::after {
  content: '';
  position: absolute; inset: 0; z-index: 0;
  background-image:
    linear-gradient(var(--tc-grid, rgba(200,16,46,0.3)) 1px, transparent 1px),
    linear-gradient(90deg, var(--tc-grid, rgba(200,16,46,0.3)) 1px, transparent 1px);
  background-size: 22px 22px;
  -webkit-mask-image: radial-gradient(ellipse 80% 80% at 50% 35%, white 0%, rgba(255,255,255,0.6) 35%, transparent 70%);
  mask-image: radial-gradient(ellipse 80% 80% at 50% 35%, white 0%, rgba(255,255,255,0.6) 35%, transparent 70%);
  opacity: 0; transition: opacity 0.3s;
  pointer-events: none;
}

.tstrip:hover { background: #050505; transform: translateY(-5px); box-shadow: 0 12px 40px rgba(0,0,0,0.8), 0 0 30px var(--tc-bloom-edge, rgba(200,16,46,0.2)); }
.tstrip:hover::before { opacity: 1; }
.tstrip:hover::after  { opacity: 1; }

.tstrip-logo {
  width: 60px; height: 60px; border-radius: 50%;
  background: #f4f4f4; margin: 0 auto 10px;
  overflow: hidden; border: 2px solid var(--c2, var(--border));
  display: flex; align-items: center; justify-content: center;
  position: relative; z-index: 1;
  transition: box-shadow 0.3s, transform 0.2s;
}
.tstrip:hover .tstrip-logo {
  box-shadow:
    0 0 0 3px rgba(255,255,255,0.15),
    0 0 24px var(--tc-bloom-bright, rgba(200,16,46,0.8));
  transform: scale(1.1) translateY(-2px);
}
.tstrip-logo img { width: 80%; height: 80%; object-fit: contain; }
.tstrip-name {
  font-family: var(--display); font-size: 15px; text-transform: uppercase;
  line-height: 1; margin-bottom: 3px; position: relative; z-index: 1;
  transition: text-shadow 0.3s;
}
.tstrip:hover .tstrip-name {
  text-shadow: 0 0 8px rgba(255,255,255,0.7), 0 0 20px var(--tc-bloom-mid, rgba(200,16,46,0.6));
}
.tstrip-rec { font-family: var(--mono);  font-size: var(--fs-s); color: var(--t3); position: relative; z-index: 1; }

/* ── P4P ───────────────────────────────────────────────── */
.p4p-grid { display: grid; grid-template-columns: repeat(5,1fr); gap: 2px; background: var(--dim); }

.p4p-card {
  background: linear-gradient(160deg, var(--s2) 0%, var(--s1) 100%);
  padding: 16px 14px; cursor: pointer;
  transition: all 0.18s; position: relative; overflow: hidden;
  border-top: 2px solid var(--border);
}
.p4p-card.podium { border-top-color: rgba(200,16,46,0.5); }
.p4p-card:hover { background: var(--s3); }

/* Bloom behind the logo on hover */
.p4p-card::after {
  content: '';
  position: absolute; top: 10px; left: 8px;
  width: 52px; height: 52px;
  background: radial-gradient(circle, var(--c-glow, var(--bloom-red)) 0%, transparent 70%);
  opacity: 0; transition: opacity 0.2s;
  pointer-events: none;
}
.p4p-card:hover::after { opacity: 1; }

.p4p-rank-bg { position: absolute; top: -10px; right: 2px; font-family: var(--display); font-size: 66px; color: rgba(255,255,255,0.028); line-height: 1; pointer-events: none; }
.p4p-logo { width: 36px; height: 36px; border-radius: 50%; background: #f4f4f4; overflow: hidden; margin-bottom: 8px; border: 2px solid var(--c2, var(--border2)); display: flex; align-items: center; justify-content: center; position: relative; z-index: 1; transition: box-shadow 0.2s; }
.p4p-card:hover .p4p-logo { box-shadow: 0 0 16px var(--c-glow, var(--bloom-red)); }
.p4p-logo img { width: 80%; height: 80%; object-fit: contain; }
.p4p-rank-tag { font-family: var(--mono);  font-size: var(--fs-xs); letter-spacing: 0.18em; color: var(--t3); margin-bottom: 4px; }
.p4p-name { font-family: var(--cond); font-size: 14px; font-weight: 800; letter-spacing: 0.04em; line-height: 1.15; margin-bottom: 2px; }
.p4p-meta { font-family: var(--mono);  font-size: var(--fs-xs); color: var(--t3); letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 8px; }
.p4p-ovr { font-family: var(--num); font-size: 34px; line-height: 1; }
.p4p-ovr-lbl { font-family: var(--mono);  font-size: var(--fs-xs); color: var(--t3); letter-spacing: 0.18em; }

/* ── NEWS ──────────────────────────────────────────────── */
.news-grid { display: grid; grid-template-columns: 1fr 340px; gap: 2px; background: var(--dim); }
.news-main { background: var(--s1); cursor: pointer; position: relative; overflow: hidden; }
.news-main:hover .news-img-wrap img { transform: scale(1.04); }
.news-img-wrap { width: 100%; aspect-ratio: 16/9; overflow: hidden; position: relative; }
.news-img-wrap img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s; }
.news-img-placeholder { width: 100%; aspect-ratio: 16/9; background: linear-gradient(135deg, #0a1428, #030810); display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; }
.news-img-placeholder img { width: 100%; height: 100%; object-fit: cover; opacity: 0.55; }
.news-body { padding: 18px 20px; }
.news-tag { display: inline-block; font-family: var(--orb);  font-size: var(--fs-xs); letter-spacing: 0.18em; text-transform: uppercase; padding: 3px 10px; background: var(--red); color: white; clip-path: polygon(0 0, 100% 0, 96% 100%, 0 100%); margin-bottom: 9px; box-shadow: 0 0 10px var(--bloom-red); }
.news-title { font-family: var(--display); font-size: 22px; line-height: 1.1; margin-bottom: 7px; }
.news-date { font-family: var(--mono);  font-size: var(--fs-xs); color: var(--t3); letter-spacing: 0.1em; }
.news-sidebar { background: var(--s1); display: flex; flex-direction: column; }
.news-item { padding: 12px 16px; border-bottom: 1px solid var(--border); cursor: pointer; transition: background 0.12s; display: flex; gap: 10px; align-items: flex-start; }
.news-item:hover { background: var(--s2); }
.news-item:last-child { border-bottom: none; }
.news-item-num { font-family: var(--display); font-size: 26px; color: var(--dim); line-height: 1; flex-shrink: 0; }
.news-item-title { font-family: var(--cond); font-size: 14px; font-weight: 700; letter-spacing: 0.02em; line-height: 1.25; margin-bottom: 3px; }
.news-item-meta { font-family: var(--mono);  font-size: var(--fs-xs); color: var(--t3); letter-spacing: 0.1em; }

/* ── SPONSORS ──────────────────────────────────────────── */
.sponsors-strip { padding: 18px var(--gx); background: var(--s1); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: 28px; }
.sponsor-label { font-family: var(--orb);  font-size: var(--fs-xs); letter-spacing: 0.2em; text-transform: uppercase; color: var(--t3); flex-shrink: 0; }
.sponsor-logos { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; }
.sponsor-img { height: 28px; width: auto; object-fit: contain; opacity: 0.4; filter: grayscale(100%) brightness(2); transition: all 0.2s; }
.sponsor-img:hover { opacity: 0.85; filter: none; }

/* ── SCHEDULE ──────────────────────────────────────────── */
.sched-hero { background: var(--s1); border-bottom: 1px solid var(--border); padding: 28px var(--gx); display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.div-stand { background: var(--s2); border: 1px solid var(--border); overflow: hidden; }
.div-head { padding: 11px 18px; border-bottom: 2px solid var(--div-color, var(--red)); background: var(--s3); display: flex; align-items: center; gap: 10px; }
.div-name { font-family: var(--display); font-size: 19px; text-transform: uppercase; }
.div-name.lib { color: var(--white); text-shadow: 0 0 8px var(--bloom-cyan); }
.div-name.jus { color: var(--white); text-shadow: 0 0 8px var(--bloom-red); }
.st-cols { display: grid; grid-template-columns: 26px 30px 1fr 36px 36px 52px; gap: 8px; align-items: center; }
.st-head { padding: 6px 18px; border-bottom: 1px solid var(--border); font-family: var(--mono);  font-size: var(--fs-xs); letter-spacing: 0.16em; text-transform: uppercase; color: var(--t3); }
.st-row { padding: 10px 18px; border-bottom: 1px solid var(--border); cursor: pointer; transition: background 0.1s; }
.st-row:hover { background: var(--s3); }
.st-row:last-child { border-bottom: none; }
.st-rank { font-family: var(--num); font-size: 18px; color: var(--t3); }
.st-rank.g { color: var(--white); text-shadow: 0 0 8px var(--bloom-red), 0 0 20px rgba(200,16,46,0.4); }
.st-logo { width: 26px; height: 26px; border-radius: 50%; background: #f4f4f4; overflow: hidden; border: 1px solid var(--border2); display: flex; align-items: center; justify-content: center; }
.st-logo img { width: 80%; height: 80%; object-fit: contain; }
.st-name { font-family: var(--cond); font-size: 16px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.st-num { font-family: var(--num); font-size: 18px; text-align: center; }
.st-pct { font-family: var(--mono); font-size: 10px; color: var(--t2); text-align: right; }
.results-wrap { padding: 32px var(--gx); }
.week-label { font-family: var(--orb); font-size: 10px; font-weight: 600; letter-spacing: 0.26em; text-transform: uppercase; color: var(--chrome); padding: 0 0 10px; margin-bottom: 12px; border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: 10px; }
.week-label::before { content: ''; width: 3px; height: 12px; background: var(--red); border-radius: 1px; display: block; box-shadow: 0 0 8px var(--bloom-red); }
.dual-cards { display: flex; flex-direction: column; gap: 2px; margin-bottom: 28px; }
.dual-card { background: var(--s1); padding: 13px 18px; display: grid; grid-template-columns: 1fr auto 1fr 100px; gap: 14px; align-items: center; border-left: 2px solid transparent; transition: all 0.12s; }
.dual-card:hover { border-left-color: var(--red); background: var(--s2); box-shadow: inset 2px 0 20px rgba(200,16,46,0.06); }
.dual-team { display: flex; align-items: center; gap: 9px; }
.dual-team.away { flex-direction: row-reverse; text-align: right; }
.dual-logo { width: 30px; height: 30px; border-radius: 50%; background: #f4f4f4; overflow: hidden; border: 1px solid var(--border2); flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
.dual-logo img { width: 80%; height: 80%; object-fit: contain; }
.dual-name { font-family: var(--cond); font-size: 16px; font-weight: 800; letter-spacing: 0.05em; text-transform: uppercase; }
.dual-div { font-family: var(--mono);  font-size: var(--fs-xs); color: var(--t3); letter-spacing: 0.1em; }
.dual-score { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.dscore { font-family: var(--num); font-size: 38px; line-height: 1; min-width: 48px; text-align: center; }
.dscore.W { color: var(--white); text-shadow: 0 0 8px rgba(255,255,255,0.5), 0 0 20px rgba(0,255,157,0.6), 0 0 40px rgba(0,255,157,0.2); }
.dscore.L { color: var(--t3); }
.dscore-sep { font-family: var(--cond); font-size: 16px; color: var(--dim); }
.dual-note { font-family: var(--mono);  font-size: var(--fs-xs); color: var(--t3); letter-spacing: 0.1em; text-align: right; }
.dual-note .highlight { display: block; color: var(--white); font-family: var(--orb);  font-size: var(--fs-s); font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 3px; text-shadow: 0 0 6px var(--bloom-red); }

/* ── STATS ─────────────────────────────────────────────── */
.stats-wrap { padding: 32px var(--gx); }
.undef-panel { background: var(--s1); border: 1px solid var(--border); padding: 16px 20px; margin-bottom: 12px; border-left: 3px solid var(--red); box-shadow: inset 3px 0 20px rgba(200,16,46,0.06), 0 0 0 0 transparent; }
.undef-head { font-family: var(--display); font-size: 18px; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 14px; display: flex; align-items: center; gap: 8px; }
.undef-head::before { content: '●'; color: var(--red); font-size: 10px; animation: pulse-dot 2s infinite; text-shadow: 0 0 8px var(--bloom-red); }
.undef-grid { display: grid; grid-template-columns: repeat(7,1fr); gap: 6px; }
.undef-pill { background: var(--s2); border: 1px solid var(--border); border-top: 2px solid var(--c2, var(--red)); padding: 10px 8px; text-align: center; cursor: pointer; transition: all 0.15s; position: relative; overflow: hidden; }
.undef-pill::after { content: ''; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 70px; height: 40px; background: radial-gradient(circle, var(--c-glow, var(--bloom-red)) 0%, transparent 70%); opacity: 0; transition: opacity 0.15s; pointer-events: none; }
.undef-pill:hover { background: var(--s3); transform: translateY(-2px); }
.undef-pill:hover::after { opacity: 0.8; }
.undef-pname { font-family: var(--cond); font-size: 13px; font-weight: 800; letter-spacing: 0.04em; line-height: 1.1; margin-bottom: 2px; position: relative; z-index: 1; }
.undef-pwc { font-family: var(--mono);  font-size: var(--fs-xs); color: var(--t3); letter-spacing: 0.1em; position: relative; z-index: 1; }
.undef-badge { display: inline-block; margin-top: 5px; background: rgba(0,255,157,0.08); border: 1px solid rgba(0,255,157,0.25); color: #00ff9d; font-family: var(--mono);  font-size: var(--fs-xs); letter-spacing: 0.14em; text-transform: uppercase; padding: 2px 5px; position: relative; z-index: 1; box-shadow: 0 0 6px rgba(0,255,157,0.2); }
.lb-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; background: var(--dim); margin-bottom: 2px; }
.lb-block { background: var(--s1); }
.lb-head { background: var(--s2); padding: 11px 18px; border-bottom: 1px solid var(--border); border-top: 1px solid rgba(200,16,46,0.3); display: flex; align-items: center; justify-content: space-between; }
.lb-title { font-family: var(--display); font-size: 18px; text-transform: uppercase; letter-spacing: 0.04em; }
.lb-badge { font-family: var(--orb);  font-size: var(--fs-xs); letter-spacing: 0.14em; text-transform: uppercase; color: var(--t3); background: var(--s3); border: 1px solid var(--border2); padding: 2px 7px; }
.lb-row { display: grid; grid-template-columns: 26px 1fr 52px; gap: 12px; align-items: center; padding: 10px 18px; border-bottom: 1px solid var(--border); cursor: pointer; transition: background 0.1s; }
.lb-row:hover { background: var(--s2); }
.lb-row:last-child { border-bottom: none; }
.lb-rank { font-family: var(--num); font-size: 18px; color: var(--t3); }
.lb-rank.g1 { color: var(--white); text-shadow: 0 0 6px rgba(255,255,255,0.7), 0 0 18px rgba(255,200,60,0.6), 0 0 40px rgba(255,200,60,0.25); }
.lb-rank.g2 { color: var(--white); text-shadow: 0 0 5px rgba(255,255,255,0.5), 0 0 14px rgba(192,200,215,0.5); }
.lb-rank.g3 { color: var(--white); text-shadow: 0 0 5px rgba(255,255,255,0.4), 0 0 12px rgba(205,127,50,0.5); }
.lb-ath-name { font-family: var(--cond); font-size: 15px; font-weight: 800; letter-spacing: 0.04em; line-height: 1; margin-bottom: 3px; }
.lb-ath-meta { display: flex; align-items: center; gap: 5px; font-family: var(--mono);  font-size: var(--fs-xs); color: var(--t3); letter-spacing: 0.1em; text-transform: uppercase; }
.tdot { width: 5px; height: 5px; border-radius: 50%; flex-shrink: 0; }
.lb-val { font-family: var(--num); font-size: 30px; text-align: right; line-height: 1; }
.lb-val.top { color: var(--white); text-shadow: 0 0 8px rgba(255,255,255,0.8), 0 0 24px var(--tc-glow, rgba(200,16,46,0.7)), 0 0 50px var(--tc-glow, rgba(200,16,46,0.3)); }

/* ── TEAMS PAGE ────────────────────────────────────────── */
.teams-wrap { padding: 32px var(--gx); }
.teams-full-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; background: var(--dim); margin-bottom: 2px; }
.tcard { background: var(--s1); cursor: pointer; overflow: hidden; position: relative; transition: all 0.2s; }
.tcard:hover { background: var(--s2); }
.tcard-photo { position: relative; height: 260px; overflow: hidden; }
.tcard-photo-img { width: 100%; height: 100%; object-fit: cover; object-position: top center; transition: transform 0.3s; filter: brightness(0.7) saturate(1.1); }
.tcard:hover .tcard-photo-img { transform: scale(1.04); filter: brightness(0.8); }
.tcard-photo-overlay { position: absolute; inset: 0; background: linear-gradient(to bottom, transparent 25%, var(--s1) 100%); }
.tcard-name-over { position: absolute; bottom: 0; left: 0; right: 0; padding: 10px 18px; font-family: var(--display); font-size: 46px; line-height: 0.9; text-transform: uppercase; text-shadow: 0 2px 12px rgba(0,0,0,0.9); }
.tcard-info { padding: 14px 18px; border-top: 2px solid var(--tc2, var(--red)); display: flex; align-items: center; gap: 14px; box-shadow: inset 0 1px 0 rgba(255,255,255,0.04); }
.tcard-logo { width: 48px; height: 48px; border-radius: 50%; background: transparent; overflow: hidden; flex-shrink: 0; border: 2px solid var(--tc2, var(--border2)); display: flex; align-items: center; justify-content: center; transition: box-shadow 0.2s; }
.tcard:hover .tcard-logo { box-shadow: 0 0 14px var(--tc2, var(--bloom-red)); }
.tcard-logo img { width: 82%; height: 82%; object-fit: contain; }
.tcard-div { font-family: var(--mono);  font-size: var(--fs-xs); letter-spacing: 0.2em; text-transform: uppercase; color: var(--t3); margin-bottom: 2px; }
.tcard-rec { font-family: var(--num); font-size: 22px; color: var(--white); }
.tcard-rtg { font-family: var(--num); font-size: 14px; color: var(--t2); line-height: 1.2; }
.tcard-roster { border-top: 1px solid var(--border); }
.tcard-rrow { display: grid; grid-template-columns: 34px 1fr auto; gap: 10px; align-items: center; padding: 8px 18px; border-bottom: 1px solid var(--border); transition: background 0.1s; }
.tcard-rrow:hover { background: var(--s2); cursor: pointer; }
.tcard-rrow:last-child { border-bottom: none; }
.tcard-rwc { font-family: var(--num); font-size: 16px; color: var(--t3); text-align: center; }
.tcard-rname { font-family: var(--cond); font-size: 14px; font-weight: 800; letter-spacing: 0.04em; }
.tcard-rsub { font-family: var(--mono);  font-size: var(--fs-xs); color: var(--t3); letter-spacing: 0.1em; }
.tcard-rovr { font-family: var(--num); font-size: 19px; }

/* ── TEAM DETAIL ───────────────────────────────────────── */
.tdetail-hero { height: 400px; position: relative; overflow: hidden; }
.tdetail-photo { width: 100%; height: 100%; object-fit: cover; object-position: top; filter: brightness(0.55) saturate(1.1); }
.tdetail-hero-overlay { position: absolute; inset: 0; background: linear-gradient(135deg, rgba(4,8,15,0.85) 0%, transparent 55%, rgba(4,8,15,0.4) 100%); }
.tdetail-hero-content { position: absolute; bottom: 0; left: 0; right: 0; padding: 28px var(--gx); border-top: 2px solid var(--tc2, var(--red)); background: linear-gradient(to top, rgba(4,8,15,0.97) 0%, transparent 100%); box-shadow: 0 -2px 30px var(--tc-bloom-edge, rgba(200,16,46,0.12)); }
.tdetail-logo-wrap { display: flex; align-items: flex-end; gap: 22px; }
.tdetail-logo { width: 90px; height: 90px; border-radius: 50%; background: transparent; overflow: hidden; border: 3px solid var(--tc2, var(--red)); flex-shrink: 0; display: flex; align-items: center; justify-content: center; box-shadow: 0 0 20px var(--tc-glow, var(--bloom-red)); }
.tdetail-logo img { width: 86%; height: 86%; object-fit: contain; }
.tdetail-div { font-family: var(--orb);  font-size: var(--fs-xs); letter-spacing: 0.22em; text-transform: uppercase; color: var(--chrome); margin-bottom: 4px; }
.tdetail-name { font-family: var(--display); font-size: 62px; line-height: 0.88; text-transform: uppercase; flex: 1; }
.tdetail-stats-row { display: flex; gap: 22px; margin-top: 8px; font-family: var(--mono);  font-size: var(--fs-s); color: var(--t3); letter-spacing: 0.1em; flex-wrap: wrap; }
.tdetail-stats-row span { font-family: var(--cond); font-size: 17px; font-weight: 800; color: var(--white); margin-left: 5px; text-shadow: 0 0 4px rgba(255,255,255,0.3); }
.tdetail-stats-row .hi { color: var(--white); text-shadow: 0 0 6px rgba(255,255,255,0.6), 0 0 16px rgba(0,255,157,0.5); }
.tdetail-stats-row .ac { color: var(--white); }
.tdetail-rec { font-family: var(--num); font-size: 62px; color: var(--white); line-height: 0.88; flex-shrink: 0; }
.tdetail-roster { padding: 28px var(--gx); }
.roster-title { font-family: var(--display); font-size: 30px; text-transform: uppercase; margin-bottom: 12px; }
.roster-title .r { color: var(--white); text-shadow: 0 0 6px rgba(255,255,255,0.6), 0 0 18px var(--bloom-red); }
.roster-row { display: grid; grid-template-columns: 50px 34px 1fr 54px 54px 54px 46px; gap: 12px; align-items: center; padding: 11px 16px; background: var(--s1); border: 1px solid var(--border); border-left: 2px solid transparent; margin-bottom: 3px; cursor: pointer; transition: all 0.13s; }
.roster-row:hover { background: var(--s2); border-left-color: var(--tc2, var(--red)); box-shadow: inset 2px 0 16px var(--tc-bloom-edge, rgba(200,16,46,0.06)); }
.rr-wc { font-family: var(--num); font-size: 20px; color: var(--t3); text-align: center; }
.rr-logo { width: 28px; height: 28px; border-radius: 50%; background: transparent; overflow: hidden; border: 1px solid var(--border2); display: flex; align-items: center; justify-content: center; }
.rr-logo img { width: 80%; height: 80%; object-fit: contain; }
.rr-name { font-family: var(--cond); font-size: 16px; font-weight: 800; letter-spacing: 0.04em; line-height: 1; margin-bottom: 2px; }
.rr-sub { font-family: var(--mono);  font-size: var(--fs-xs); color: var(--t3); letter-spacing: 0.1em; }
.rr-stat { font-family: var(--mono);  font-size: var(--fs-s); color: var(--t2); text-align: center; letter-spacing: 0.05em; }
.rr-stat .sv { font-family: var(--display); font-size: 18px; color: var(--t1); display: block; line-height: 1; }
.rr-ovr { font-family: var(--num); font-size: 23px; text-align: right; }

/* ── ATHLETES ──────────────────────────────────────────── */
.aths-wrap { padding: 32px var(--gx); }
.wt-btns { display: flex; gap: 2px; margin-bottom: 18px; background: var(--dim); }
.wt-btn { font-family: var(--orb);  font-size: var(--fs-s); font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; padding: 9px 12px; background: var(--s1); border: none; color: var(--t3); cursor: pointer; flex: 1; border-top: 2px solid transparent; transition: all 0.13s; }
.wt-btn:hover { background: var(--s2); color: var(--t1); }
.wt-btn.active { background: var(--s2); color: var(--white); border-top-color: var(--red); box-shadow: inset 0 -1px 0 rgba(200,16,46,0.2); }
.wt-section { margin-bottom: 22px; }
.wt-label { font-family: var(--orb); font-size: 10px; font-weight: 600; letter-spacing: 0.24em; text-transform: uppercase; color: var(--chrome); padding: 7px 0; margin-bottom: 7px; border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: 8px; }
.wt-label::before { content: ''; width: 3px; height: 11px; background: var(--red); border-radius: 1px; display: block; box-shadow: 0 0 8px var(--bloom-red); }
.ath-row { display: grid; grid-template-columns: 34px 1fr 44px 44px 44px 42px; gap: 10px; align-items: center; padding: 10px 14px; background: var(--s1); border: 1px solid var(--border); border-left: 2px solid transparent; margin-bottom: 3px; cursor: pointer; transition: all 0.12s; }
.ath-row:hover { background: var(--s2); border-left-color: var(--red); }
.ath-logo { width: 28px; height: 28px; border-radius: 50%; background: #f4f4f4; overflow: hidden; border: 1px solid var(--border2); display: flex; align-items: center; justify-content: center; }
.ath-logo img { width: 80%; height: 80%; object-fit: contain; }
.ath-name { font-family: var(--cond); font-size: 15px; font-weight: 800; letter-spacing: 0.04em; line-height: 1; margin-bottom: 2px; color: var(--white); }
.ath-sub { font-family: var(--mono);  font-size: var(--fs-xs); color: var(--t3); letter-spacing: 0.1em; }
.ath-stat { font-family: var(--mono);  font-size: var(--fs-s); color: var(--t2); text-align: center; letter-spacing: 0.05em; }
.ath-stat .sv { font-family: var(--display); font-size: 16px; color: var(--t1); display: block; line-height: 1; }
.ath-ovr { font-family: var(--num); font-size: 22px; text-align: right; }
.undef-tag { display: inline-block; margin-left: 6px; font-family: var(--mono);  font-size: var(--fs-xs); letter-spacing: 0.14em; text-transform: uppercase; color: #00ff9d; background: rgba(0,255,157,0.06); border: 1px solid rgba(0,255,157,0.22); padding: 2px 5px; vertical-align: middle; box-shadow: 0 0 5px rgba(0,255,157,0.15); }

/* ── ATHLETE DETAIL ────────────────────────────────────── */
.ath-detail { padding: 28px var(--gx) 52px; }
.ath-hero-grid { display: grid; grid-template-columns: 320px 1fr; gap: 2px; background: var(--dim); margin-bottom: 2px; }
.ath-card { position: relative; overflow: hidden; aspect-ratio: 3/4; background: var(--s1); }
.ath-card-bg { position: absolute; inset: 0; }
.ath-card-grid-overlay { position: absolute; inset: 0; background-image: linear-gradient(rgba(200,16,46,0.06) 1px, transparent 1px), linear-gradient(90deg, rgba(200,16,46,0.06) 1px, transparent 1px); background-size: 20px 20px; }
.ath-card-silh { position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); width: 88%; height: 80%; z-index: 2; }
.ath-card-top { position: absolute; top: 0; left: 0; right: 0; padding: 12px 14px; display: flex; justify-content: space-between; align-items: flex-start; z-index: 3; }
.ath-badge { display: flex; align-items: center; gap: 6px; background: rgba(4,8,15,0.8); backdrop-filter: blur(12px); border: 1px solid var(--border2); border-left: 2px solid var(--tc2, var(--red)); padding: 5px 9px; cursor: pointer; transition: all 0.15s; }
.ath-badge:hover { box-shadow: 0 0 12px rgba(200,16,46,0.3); }
.ath-badge-logo { width: 20px; height: 20px; border-radius: 50%; background: #f4f4f4; overflow: hidden; display: flex; align-items: center; justify-content: center; }
.ath-badge-logo img { width: 80%; height: 80%; object-fit: contain; }
.ath-badge-name { font-family: var(--cond); font-size: 11px; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.ath-badge-div { font-family: var(--mono);  font-size: var(--fs-xs); color: var(--t3); letter-spacing: 0.1em; }
.ath-status { background: rgba(0,255,157,0.08); border: 1px solid rgba(0,255,157,0.3); color: #00ff9d; font-family: var(--orb);  font-size: var(--fs-xs); letter-spacing: 0.16em; text-transform: uppercase; padding: 4px 9px; box-shadow: 0 0 8px rgba(0,255,157,0.2); animation: pulse-dot 2s infinite; }
.ath-status.rated { background: rgba(255,255,255,0.04); border-color: var(--border2); color: var(--t3); animation: none; box-shadow: none; }
.ath-card-bot { position: absolute; bottom: 0; left: 0; right: 0; padding: 14px 16px 18px; z-index: 3; background: linear-gradient(to top, rgba(4,8,15,0.98) 0%, rgba(4,8,15,0.7) 60%, transparent 100%); border-top: 1px solid var(--tc2, rgba(200,16,46,0.4)); }
.ath-card-name { font-family: var(--display); font-size: 44px; line-height: 0.88; text-transform: uppercase; margin-bottom: 5px; }
.ath-card-wc { font-family: var(--orb);  font-size: var(--fs-xs); letter-spacing: 0.2em; text-transform: uppercase; color: var(--chrome); }
.rtg-panel { background: var(--s1); padding: 22px; }
.rtg-head { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 18px; padding-bottom: 14px; border-bottom: 1px solid var(--border); }
.rtg-title { font-family: var(--display); font-size: 22px; text-transform: uppercase; letter-spacing: 0.04em; }
.rtg-sub { font-family: var(--mono);  font-size: var(--fs-xs); letter-spacing: 0.16em; text-transform: uppercase; color: var(--t3); margin-top: 4px; }
.ovr-ring { position: relative; width: 96px; height: 96px; flex-shrink: 0; }
.ovr-ring svg { transform: rotate(-90deg); width: 100%; height: 100%; }
.ring-track { fill: none; stroke: var(--s4); stroke-width: 8; }
.ring-fill { fill: none; stroke-width: 8; stroke-linecap: round; filter: drop-shadow(0 0 4px currentColor); }
.ovr-mid { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.ovr-num { font-family: var(--num); font-size: 36px; line-height: 1; }
.ovr-lbl { font-family: var(--orb);  font-size: var(--fs-xs); letter-spacing: 0.18em; color: var(--t3); margin-top: 2px; }
.attr-row { display: grid; grid-template-columns: 100px 1fr 32px; gap: 10px; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--border); }
.attr-row:last-child { border-bottom: none; }
.attr-lbl { font-family: var(--mono);  font-size: var(--fs-s); letter-spacing: 0.12em; text-transform: uppercase; color: var(--t3); }
.attr-bar { height: 4px; background: var(--s4); border-radius: 1px; overflow: hidden; }
.attr-fill { height: 100%; border-radius: 1px; }
.attr-val { font-family: var(--num); font-size: 20px; text-align: right; line-height: 1; }
.splits { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 5px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border); }
.split-box { background: var(--s2); border: 1px solid var(--border); padding: 9px; text-align: center; }
.split-lbl { font-family: var(--mono);  font-size: var(--fs-xs); letter-spacing: 0.18em; text-transform: uppercase; color: var(--t3); margin-bottom: 4px; }
.split-val { font-family: var(--num); font-size: 26px; line-height: 1; }
.src-bar { background: rgba(0,255,157,0.03); border: 1px solid rgba(0,255,157,0.1); padding: 14px 18px; margin-bottom: 20px; display: flex; align-items: center; gap: 22px; }
.src-lbl { font-family: var(--mono);  font-size: var(--fs-xs); letter-spacing: 0.18em; text-transform: uppercase; color: #00ff9d; flex-shrink: 0; display: flex; align-items: center; gap: 5px; }
.src-lbl::before { content: ''; width: 4px; height: 4px; border-radius: 50%; background: #00ff9d; display: block; box-shadow: 0 0 5px rgba(0,255,157,0.6); }
.src-nums { display: flex; gap: 20px; flex-wrap: wrap; }
.src-num { font-family: var(--num); font-size: 22px; line-height: 1; }
.src-num.hi { text-shadow: 0 0 6px rgba(255,255,255,0.6), 0 0 16px rgba(200,16,46,0.6); }
.src-numlab { font-family: var(--mono);  font-size: var(--fs-xs); letter-spacing: 0.1em; text-transform: uppercase; color: var(--t3); margin-top: 2px; }
.ath-bottom { display: grid; grid-template-columns: 1fr 240px; gap: 2px; background: var(--dim); }
.scout { background: var(--s1); padding: 20px; }
.scout-title { font-family: var(--display); font-size: 16px; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 9px; padding-bottom: 7px; border-bottom: 1px solid var(--border); }
.scout-text { font-size: 13px; color: var(--t2); line-height: 1.7; }
.ath-sidebar { background: var(--s1); }
.asb { border-bottom: 1px solid var(--border); padding: 11px 14px; }
.asb:last-child { border-bottom: none; }
.asb-title { font-family: var(--orb);  font-size: var(--fs-xs); letter-spacing: 0.16em; text-transform: uppercase; color: var(--t3); margin-bottom: 9px; }
.asb-row { display: flex; justify-content: space-between; align-items: baseline; padding: 4px 0; border-bottom: 1px solid var(--border); }
.asb-row:last-child { border-bottom: none; }
.asb-lbl { font-family: var(--mono);  font-size: var(--fs-s); letter-spacing: 0.1em; color: var(--t3); }
.asb-val { font-family: var(--num); font-size: 16px; }
.asb-val.g { color: var(--white); text-shadow: 0 0 5px rgba(255,255,255,0.5), 0 0 14px rgba(0,255,157,0.5); }

/* ── RULES ─────────────────────────────────────────────── */
.rules-wrap { padding: 32px var(--gx); }
.rules-hero-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; background: var(--dim); margin-bottom: 2px; }
.rules-left { background: var(--s1); padding: 32px; }
.rules-big { font-family: var(--display); font-size: 66px; line-height: 0.86; text-transform: uppercase; margin-bottom: 16px; }
.rules-big .r { position: relative; display: inline-block; }
.rules-big .r::before { content: ''; position: absolute; inset: -8px -16px -12px -8px; background: radial-gradient(ellipse at 35% 70%, rgba(200,16,46,0.45) 0%, rgba(200,16,46,0.15) 45%, transparent 70%); z-index: -1; pointer-events: none; }
.rules-desc { font-size: 13px; color: var(--t2); line-height: 1.65; max-width: 380px; }
.sb-mock { background: var(--s3); border: 1px solid var(--border2); }
.sb-head-bar { background: var(--blue2); padding: 6px 12px; display: flex; justify-content: space-between; font-family: var(--orb);  font-size: var(--fs-xs); letter-spacing: 0.16em; text-transform: uppercase; color: rgba(255,255,255,0.4); }
.sb-team-r { display: grid; grid-template-columns: 1fr 48px 48px 52px; border-bottom: 1px solid var(--border); }
.sb-team-r:last-child { border-bottom: none; }
.sb-c { padding: 10px 12px; border-right: 1px solid var(--border); display: flex; flex-direction: column; justify-content: center; }
.sb-c:last-child { border-right: none; }
.sb-wn { font-family: var(--display); font-size: 18px; text-transform: uppercase; }
.sb-wt { font-family: var(--mono);  font-size: var(--fs-xs); color: var(--t3); letter-spacing: 0.1em; margin-top: 2px; }
.sb-pts { display: flex; align-items: center; justify-content: center; font-family: var(--num); font-size: 28px; text-shadow: 0 0 6px rgba(255,255,255,0.5), 0 0 18px rgba(200,16,46,0.5); }
.sb-rd { display: flex; align-items: center; justify-content: center; flex-direction: column; background: var(--red); box-shadow: 0 0 12px var(--bloom-red); }
.sb-rdn { font-family: var(--num); font-size: 24px; }
.sb-rdl { font-family: var(--mono);  font-size: var(--fs-xs); letter-spacing: 0.16em; text-transform: uppercase; color: rgba(255,255,255,0.5); }
.sb-clock-bar { background: var(--blue2); padding: 8px 12px; display: flex; align-items: center; justify-content: space-between; border-top: 1px solid var(--border2); }
.sb-clock { font-family: var(--num); font-size: 34px; text-shadow: 0 0 8px rgba(255,255,255,0.5), 0 0 24px rgba(200,16,46,0.5); }
.sb-wc-tag { font-family: var(--display); font-size: 16px; color: var(--chrome); }
.rules-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; background: var(--dim); margin-bottom: 2px; }
.rule-card { background: var(--s1); padding: 20px; }
.rule-num { font-family: var(--display); font-size: 50px; line-height: 1; color: rgba(255,255,255,0.04); margin-bottom: 2px; }
.rule-title { font-family: var(--display); font-size: 18px; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 7px; padding-bottom: 7px; border-bottom: 1px solid var(--border); }
.rule-desc { font-size: 12px; color: var(--t2); line-height: 1.65; }
.score-table { background: var(--s1); border: 1px solid var(--border); }
.score-table-head { padding: 12px 18px; border-bottom: 1px solid var(--border); font-family: var(--display); font-size: 20px; text-transform: uppercase; letter-spacing: 0.04em; }
.score-cols { display: grid; grid-template-columns: 1fr 1fr 1fr; }
.score-col { padding: 16px 18px; border-right: 1px solid var(--border); }
.score-col:last-child { border-right: none; }
.score-col-title { font-family: var(--orb);  font-size: var(--fs-xs); letter-spacing: 0.16em; text-transform: uppercase; color: var(--t3); margin-bottom: 10px; padding-bottom: 7px; border-bottom: 1px solid var(--border); }
.score-item { display: flex; justify-content: space-between; align-items: center; padding: 6px 0; border-bottom: 1px solid var(--border); font-size: 12px; }
.score-item:last-child { border-bottom: none; }
.score-act { color: var(--t2); }
.score-pts { font-family: var(--num); font-size: 17px; text-shadow: 0 0 5px rgba(255,255,255,0.5), 0 0 14px rgba(200,16,46,0.4); }

/* ── BC + FOOTER ───────────────────────────────────────── */
.bc { padding: 12px var(--gx); font-family: var(--orb);  font-size: var(--fs-xs); letter-spacing: 0.18em; text-transform: uppercase; color: var(--t3); display: flex; gap: 7px; align-items: center; background: var(--s1); border-bottom: 1px solid var(--border); }
.bc span { color: var(--dim); }
.bc .cur { color: var(--chrome); }
.bc a { cursor: pointer; transition: color 0.1s; }
.bc a:hover { color: var(--t1); }
.footer { background: var(--s1); border-top: 1px solid var(--red); padding: 32px var(--gx); display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 28px; box-shadow: 0 -1px 0 var(--red), 0 -4px 20px rgba(200,16,46,0.08); }
.footer-col-title { font-family: var(--orb); font-size: 10px; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: var(--chrome); margin-bottom: 11px; padding-bottom: 7px; border-bottom: 1px solid var(--border); }
.footer-tag { font-family: var(--mono);  font-size: var(--fs-xs); letter-spacing: 0.2em; text-transform: uppercase; color: var(--t3); margin-bottom: 10px; margin-top: 6px; }
.footer-lnk { display: block; font-size: 12px; color: var(--t3); cursor: pointer; padding: 4px 0; transition: color 0.1s; }
.footer-lnk:hover { color: var(--white); }
.footer-bottom { padding: 12px var(--gx); border-top: 1px solid var(--border); display: flex; justify-content: space-between; font-family: var(--mono);  font-size: var(--fs-xs); letter-spacing: 0.12em; text-transform: uppercase; color: var(--t3); }
.powered-badge { display: inline-flex; align-items: center; gap: 7px; background: rgba(200,16,46,0.06); border: 1px solid rgba(200,16,46,0.25); padding: 5px 10px; margin-top: 10px; box-shadow: 0 0 8px rgba(200,16,46,0.1); }
.powered-badge-label { font-family: var(--mono);  font-size: var(--fs-xs); letter-spacing: 0.14em; text-transform: uppercase; color: var(--t3); }
.powered-badge-brand { font-family: var(--orb); font-size: 11px; font-weight: 600; color: var(--white); }

/* ── RESPONSIVE ────────────────────────────────────────── */
@media (max-width: 1100px) {
  .nav { padding: 0 16px; }
  :root { --gx: 20px; }
  .teams-strip, .p4p-grid { grid-template-columns: repeat(3,1fr); }
  .news-grid, .ath-hero-grid, .rules-hero-grid, .sched-hero,
  .teams-full-grid, .rules-cards, .score-cols, .ath-bottom { grid-template-columns: 1fr; }
  .undef-grid { grid-template-columns: repeat(3,1fr); }
  .lb-grid { grid-template-columns: 1fr; }
  .footer { grid-template-columns: 1fr; }
  .tdetail-hero { height: 260px; }
  .hero-title { font-size: 52px; }
}

.aths-wrap { padding: 32px var(--gx); }
.card-grid-row { display:flex; flex-wrap:wrap; gap:28px; padding:8px 0 32px; }


/* ══ RESPONSIVE v2 — wide / zoomed-out, tablet, phone ═══════════════════ */
html { overflow-x: hidden; }
body { max-width: 100%; overflow-x: clip; }
img, video, canvas, svg { max-width: 100%; }

/* Wide screens and browser zoom-out: content caps at ~1600px and centers,
   backgrounds stay full-bleed because the cap is done with side padding. */
@media (min-width: 1700px) {
  :root { --gx: calc((100vw - 1600px) / 2); }
  .hero { height: auto; min-height: min(100vh, 1000px); }
}
@media (min-width: 2200px) {
  :root { --gx: calc((100vw - 1800px) / 2); }
  html { font-size: 17px; }
}

/* Tablet */
@media (max-width: 900px) {
  .nav-ticker, .nav-divider { display: none; }
  .nav-links { overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; min-width: 0; }
  .nav-links::-webkit-scrollbar { display: none; }
  .nav-link { padding: 0 10px; white-space: nowrap; flex-shrink: 0; }
  .stats-ticker { overflow-x: auto; scrollbar-width: none; }
  .stats-ticker::-webkit-scrollbar { display: none; }
  .teams-strip, .p4p-grid, .undef-grid { grid-template-columns: repeat(2,1fr); }
  .hero { height: auto; min-height: 560px; }
}

/* Phone */
@media (max-width: 600px) {
  :root { --gx: 14px; --fs-xs: 10px; --fs-s: 10.5px; }
  .nav { padding: 0 10px; }
  .nav-logo { margin-right: 6px; padding-left: 4px; }
  .nav-logo-text { display: none; }
  .nav-link { padding: 0 9px; font-size: 10px; letter-spacing: 0.1em; }
  .nav-cta { font-size: 0; padding: 8px 10px; gap: 0; }
  .nav-cta::after { content: 'ACCESS'; font-size: 9px; letter-spacing: 0.12em; }
  .nav-cta img { display: none; }
  .sec, .results-wrap, .stats-wrap, .teams-wrap, .aths-wrap, .rules-wrap { padding-top: 28px; padding-bottom: 28px; }
  .hero-title { font-size: 40px; }
  .hero-content { padding-top: 28px; }
  .sec-head { flex-wrap: wrap; gap: 10px; }
  .teams-strip, .p4p-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .undef-grid { grid-template-columns: 1fr; }
  .tdetail-hero { height: 200px; }
  .footer-bottom { flex-direction: column; gap: 6px; }
  .bc { overflow-x: auto; white-space: nowrap; }
  table { display: block; overflow-x: auto; max-width: 100%; }

  /* Bout cards (athlete + schedule pages inject their own styles, so bump specificity) */
  body .bout-card { grid-template-columns: 1fr 74px 1fr; padding: 12px 10px; gap: 6px; }
  body .bc-side { min-width: 0; overflow-wrap: anywhere; }

  /* Inline micro-type in rendered pages */
  #app [style*="font-size:6px"], #app [style*="font-size:7px"], #app [style*="font-size:8px"],
  #app [style*="font-size: 6px"], #app [style*="font-size: 7px"], #app [style*="font-size: 8px"] { font-size: 10px !important; }
  #app [style*="font-size:9px"], #app [style*="font-size: 9px"] { font-size: 10.5px !important; }
  /* Inline multi-column grids collapse */
  #app [style*="grid-template-columns:1fr 1fr"], #app [style*="grid-template-columns: 1fr 1fr"],
  #app [style*="grid-template-columns:repeat(3"], #app [style*="grid-template-columns:repeat(4"] { grid-template-columns: 1fr !important; }
}

/* Athlete detail: card on top, stats below on narrower screens */
@media (max-width: 900px) {
  .ath-layout { flex-direction: column; align-items: stretch !important; }
  .ath-layout .ath-card-col { margin: 0 auto 16px; }
  .ath-layout .ath-stats-col { border-left: none !important; border-top: 1px solid var(--border); }
}
@media (max-width: 600px) {
  body .bc-tp-lbl, body .bc-wt-lbl, body .bc-rt { font-size: 10px; }
  .ath-stats-col > div { padding-left: 14px !important; padding-right: 14px !important; }
  .team-grid { gap: 16px !important; }
  #app section header h2 { font-size: 30px !important; }
  #app section header img { height: 44px !important; }
}
@media (max-width: 600px) {
  body .bc-center { padding: 0 6px; min-width: 0; }
  body .bc-rounds { font-size: 30px !important; white-space: nowrap; letter-spacing: 0; }
  body .bout-card { grid-template-columns: minmax(0,1fr) 84px minmax(0,1fr); }
}
@media (max-width: 600px) {
  .dual-card { grid-template-columns: 1fr auto 1fr; padding: 12px 10px; gap: 8px; }
  .dual-card .dual-note { grid-column: 1 / -1; text-align: center; }
  .tdetail-logo-wrap { flex-wrap: wrap; gap: 12px; }
  .tdetail-rec { font-size: 44px; }
  .roster-row { grid-template-columns: 34px 26px minmax(0,1fr) 46px 40px; gap: 8px; padding: 10px 10px; }
  .roster-row > :nth-child(5), .roster-row > :nth-child(6) { display: none; }
  #app [style*="display:flex;align-items:center;gap:32px"] { flex-wrap: wrap; gap: 18px !important; }
  #app [style*="display:flex"][style*="gap:32px"], #app [style*="display:flex"][style*="gap:28px"] { flex-wrap: wrap; }
}
@media (max-width: 900px) {
  .nav-links { -webkit-mask-image: linear-gradient(to right, #000 82%, transparent); mask-image: linear-gradient(to right, #000 82%, transparent); }
}
@media (max-width: 900px) {
  :root { --fs-xs: 10px; --fs-s: 10.5px; }
  #app [style*="font-size:6px"], #app [style*="font-size:7px"], #app [style*="font-size:8px"],
  #app [style*="font-size: 6px"], #app [style*="font-size: 7px"], #app [style*="font-size: 8px"] { font-size: 10px !important; }
  #app [style*="font-size:9px"], #app [style*="font-size: 9px"] { font-size: 10.5px !important; }
  body .bc-tp-lbl, body .bc-wt-lbl, body .bc-rt { font-size: 10px; }
}
@media (min-width: 1700px) {
  .all-pro-banner { background: var(--s1); }
  .all-pro-banner img { max-width: 1600px; margin: 0 auto; }
}
@media (min-width: 2200px) { .all-pro-banner img { max-width: 1800px; } }

/* ── CLAW-STAR CLASSIC ─────────────────────────────────── */
.sc-hero { position:relative; overflow:hidden; padding:52px var(--gx) 34px; background:var(--s1); border-bottom:2px solid var(--red); }
.sc-hero-bloom { position:absolute; inset:0; pointer-events:none;
  background: radial-gradient(ellipse 50% 70% at 12% 100%, rgba(31,207,106,0.16) 0%, transparent 60%),
              radial-gradient(ellipse 50% 70% at 88% 100%, rgba(232,32,62,0.18) 0%, transparent 60%),
              repeating-linear-gradient(90deg, transparent 0 47px, rgba(30,56,96,0.18) 47px 48px),
              repeating-linear-gradient(0deg, transparent 0 47px, rgba(30,56,96,0.18) 47px 48px); }
.sc-final { position:relative; display:grid; grid-template-columns:1fr auto 1fr; gap:18px; align-items:stretch; max-width:900px; margin-top:30px; }
.sc-team { position:relative; padding:18px 22px; background:var(--s2); border:1px solid var(--border); border-top:3px solid var(--c); box-shadow:0 0 40px var(--g); }
.sc-team-name { font-family:var(--cond); font-weight:900; font-size:22px; letter-spacing:0.06em; color:var(--c); }
.sc-team-score { font-family:var(--num); font-size:72px; line-height:1; color:#fff; text-shadow:0 0 24px var(--g); }
.sc-team-gm { font-family:var(--mono); font-size:9px; letter-spacing:0.14em; text-transform:uppercase; color:var(--t2); margin-top:6px; }
.sc-vs { align-self:center; font-family:var(--orb); font-size:11px; letter-spacing:0.3em; color:var(--t3); }
.sc-firsts { position:relative; display:flex; flex-wrap:wrap; gap:8px; margin-top:22px; }
.sc-firsts span { font-family:var(--mono); font-size:9px; letter-spacing:0.12em; text-transform:uppercase; color:var(--t2); padding:6px 10px; background:var(--s2); border:1px solid var(--border2); }
.sc-table { border:1px solid var(--border); background:var(--s1); }
.sc-row { display:grid; grid-template-columns:34px 52px minmax(0,1fr) 78px 86px 64px 92px; align-items:center; gap:10px; padding:12px 14px; border-bottom:1px solid var(--border); cursor:pointer; }
.sc-row:hover { background:var(--s2); }
.sc-head { cursor:default; font-family:var(--mono); font-size:8px; letter-spacing:0.16em; text-transform:uppercase; color:var(--t3); padding:8px 14px; }
.sc-head:hover { background:none; }
.sc-n { font-family:var(--mono); font-size:10px; color:var(--t3); }
.sc-wt { font-family:var(--num); font-size:16px; }
.sc-wt small { font-family:var(--mono); font-size:8px; color:#f5c542; margin-left:3px; vertical-align:top; }
.sc-mu { font-size:13px; color:var(--t2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sc-mu b { color:#fff; font-weight:700; }
.sc-d { font-family:var(--mono); font-size:9px; color:var(--t3); margin:0 4px; }
.sc-ovr { font-family:var(--num); font-size:13px; margin-left:8px; padding:1px 6px; border:1px solid currentColor; border-radius:3px; }
.sc-score { font-family:var(--num); font-size:16px; }
.sc-score small, .sc-tp small { display:block; font-family:var(--mono); font-size:8px; letter-spacing:0.12em; color:var(--t3); }
.sc-tp { font-family:var(--num); font-size:14px; }
.sc-run { font-family:var(--num); font-size:14px; }
.sc-act { display:flex; align-items:center; justify-content:flex-end; gap:8px; }
.sc-watch { font-family:var(--mono); font-size:9px; letter-spacing:0.1em; text-transform:uppercase; color:#fff; text-decoration:none; padding:4px 8px; background:var(--red); }
.sc-caret { color:var(--t3); transition:transform 0.2s; }
.sc-bout.open .sc-caret { transform:rotate(180deg); }
.sc-detail { display:none; padding:14px; border-bottom:1px solid var(--border); background:var(--bg); }
.sc-bout.open .sc-detail { display:block; }
.sc-cards { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.sc-link { display:inline-block; margin-top:6px; font-family:var(--mono); font-size:9px; letter-spacing:0.12em; text-transform:uppercase; color:var(--cyan); cursor:pointer; }
.sc-leaders { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:8px; }
.sc-leader { display:flex; align-items:center; gap:12px; padding:12px 14px; background:var(--s1); border:1px solid var(--border); border-left:3px solid var(--c); cursor:pointer; }
.sc-leader:hover { background:var(--s2); }
.sc-leader-rank { font-family:var(--num); font-size:14px; color:var(--t3); width:18px; }
.sc-leader-name { font-family:var(--cond); font-weight:800; font-size:17px; text-transform:uppercase; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sc-leader-sub { font-family:var(--mono); font-size:8.5px; letter-spacing:0.1em; text-transform:uppercase; color:var(--t2); }
.sc-leader-ovr { font-family:var(--num); font-size:26px; }
.sc-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:2px; background:var(--border); border:1px solid var(--border); }
.sc-box { background:var(--s1); padding:20px 22px; }
.sc-box-sub { font-family:var(--mono); font-size:9px; letter-spacing:0.16em; text-transform:uppercase; color:var(--red); margin-bottom:6px; }
.sc-box-title { font-family:var(--cond); font-weight:800; font-size:21px; text-transform:uppercase; margin-bottom:8px; }
.sc-box p { font-size:12.5px; color:var(--t2); line-height:1.7; }
.sc-vids { display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:6px; }
.sc-vid { display:flex; align-items:center; gap:12px; padding:12px 14px; background:var(--s1); border:1px solid var(--border); color:var(--t1); text-decoration:none; font-size:13px; }
.sc-vid:hover { border-color:var(--red); background:var(--s2); }
.sc-vid-play { width:26px; height:26px; display:flex; align-items:center; justify-content:center; background:var(--red); font-size:10px; flex-shrink:0; }
.sc-vid-d { font-family:var(--mono); font-size:10px; color:var(--t3); }
.champ-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:18px; }
.champ-card { position:relative; overflow:hidden; aspect-ratio:3/4; padding:18px; border-radius:12px; background:linear-gradient(165deg,#120e04 0%,#070b14 55%,#0b0803 100%);
  border:1.5px solid rgba(245,197,66,0.7); box-shadow:0 0 22px rgba(245,197,66,0.35), 0 0 70px rgba(245,197,66,0.12); display:flex; flex-direction:column; }
.champ-glow { position:absolute; inset:0; pointer-events:none; background:radial-gradient(ellipse at 50% 35%,rgba(245,197,66,0.22) 0%,transparent 60%), repeating-linear-gradient(0deg,transparent 0 3px,rgba(0,0,0,0.14) 3px 4px); }
.champ-top { position:relative; display:flex; justify-content:space-between; align-items:flex-start; }
.champ-wt { font-family:var(--num); font-size:44px; line-height:0.9; color:#fff; text-shadow:0 0 18px rgba(245,197,66,0.6); }
.champ-wt small { display:block; font-family:var(--mono); font-size:8px; letter-spacing:0.24em; color:#f5c542; }
.champ-badge { font-family:var(--orb); font-size:8px; font-weight:900; letter-spacing:0.16em; color:#120e04; background:#f5c542; padding:3px 8px; }
.champ-belt { position:relative; flex:1; display:flex; align-items:center; justify-content:center; filter:drop-shadow(0 0 10px rgba(245,197,66,0.5)); }
.champ-name { position:relative; font-family:'Russo One',sans-serif; font-size:26px; line-height:0.95; text-transform:uppercase; color:#fff; }
.champ-club { position:relative; font-family:var(--mono); font-size:9px; letter-spacing:0.14em; text-transform:uppercase; color:#f5c542; margin-top:6px; }
.champ-finals { position:relative; font-size:12px; color:var(--t2); margin-top:6px; }
.champ-foot { position:relative; font-family:var(--mono); font-size:7.5px; letter-spacing:0.18em; color:var(--t3); margin-top:12px; border-top:1px solid rgba(245,197,66,0.25); padding-top:8px; }
@media (max-width: 900px) {
  .sc-row { grid-template-columns:28px 44px minmax(0,1fr) 64px 60px; }
  .sc-row > :nth-child(6), .sc-row > :nth-child(7) { display:none; }
  .sc-cards { grid-template-columns:1fr; }
  .sc-final { grid-template-columns:1fr; }
  .sc-vs { display:none; }
}
@media (max-width: 600px) {
  .sc-row { grid-template-columns:40px minmax(0,1fr) 60px; }
  .sc-row > :nth-child(1), .sc-row > :nth-child(5) { display:none; }
}

/* ── LEAGUE PAGES ──────────────────────────────────────── */
.lg-wrap { padding:36px var(--gx) 48px; max-width:1200px; }
.lg-tabs { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:26px; }
.lg-tab { font-family:var(--mono); font-size:10px; letter-spacing:0.14em; text-transform:uppercase; padding:8px 14px; background:var(--s1); border:1px solid var(--border2); color:var(--t2); cursor:pointer; }
.lg-tab.on { background:var(--red); border-color:var(--red); color:#fff; }
.lg-h { font-family:var(--display); font-size:clamp(34px,5vw,54px); text-transform:uppercase; line-height:0.95; margin-bottom:8px; }
.lg-sub { font-size:14px; color:var(--t2); line-height:1.7; max-width:760px; margin-bottom:24px; }
.rb-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(340px,1fr)); gap:16px; }
.rb-sec { background:var(--s1); border:1px solid var(--border); border-top:3px solid var(--red); }
.rb-sec h3 { font-family:var(--cond); font-weight:900; font-size:18px; letter-spacing:0.08em; padding:12px 16px; border-bottom:1px solid var(--border); }
.rb-row { display:grid; grid-template-columns:1fr 64px; gap:4px 12px; padding:9px 16px; border-bottom:1px solid var(--border); }
.rb-row:last-child { border-bottom:0; }
.rb-cat { font-size:12px; color:var(--t2); }
.rb-val { font-family:var(--num); font-size:15px; text-align:right; color:#fff; }
.rb-who { grid-column:1 / -1; font-family:var(--cond); font-weight:700; font-size:14px; letter-spacing:0.02em; }
.lg-cards { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:2px; background:var(--border); border:1px solid var(--border); }
.lg-card { background:var(--s1); padding:20px 22px; }
.lg-card-t { font-family:var(--cond); font-weight:800; font-size:20px; text-transform:uppercase; margin-bottom:4px; }
.lg-card-s { font-family:var(--mono); font-size:9px; letter-spacing:0.14em; text-transform:uppercase; color:var(--red); margin-bottom:10px; }
.lg-card p { font-size:12.5px; color:var(--t2); line-height:1.65; }
.lg-card a, .lg-a { color:var(--cyan); text-decoration:none; font-family:var(--mono); font-size:10px; letter-spacing:0.1em; text-transform:uppercase; }
.fc-tier { margin-bottom:18px; }
.fc-tier h3 { font-family:var(--cond); font-weight:900; font-size:18px; letter-spacing:0.1em; margin-bottom:8px; }
.fc-names { display:flex; flex-wrap:wrap; gap:6px; }
.fc-names span { font-size:12.5px; color:var(--t1); padding:6px 10px; background:var(--s1); border:1px solid var(--border); }
.ld-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(270px,1fr)); gap:12px; }
.ld-box { background:var(--s1); border:1px solid var(--border); padding:14px 16px; }
.ld-box h4 { font-family:var(--mono); font-size:9px; letter-spacing:0.16em; text-transform:uppercase; color:var(--red); margin-bottom:8px; }
.ld-item { display:flex; justify-content:space-between; gap:10px; font-size:12.5px; padding:4px 0; border-bottom:1px solid var(--border); }
.ld-item:last-child { border-bottom:0; }
.ld-item b { font-family:var(--num); font-weight:400; }
.ld-note { font-family:var(--mono); font-size:9px; letter-spacing:0.1em; color:var(--t3); margin-top:12px; line-height:1.7; }
.score-cols-4 { grid-template-columns:repeat(4,1fr) !important; }
.faq-list { display:grid; gap:6px; max-width:900px; }
.faq { background:var(--s1); border:1px solid var(--border); border-left:3px solid var(--red); padding:0; }
.faq summary { cursor:pointer; list-style:none; padding:14px 18px; font-family:var(--cond); font-weight:800; font-size:17px; letter-spacing:0.03em; text-transform:uppercase; }
.faq summary::-webkit-details-marker { display:none; }
.faq summary::after { content:'+'; float:right; color:var(--red); font-family:var(--num); }
.faq[open] summary::after { content:'–'; }
.faq p { padding:0 18px 16px; font-size:13px; color:var(--t2); line-height:1.7; }
.footer-social { display:flex; gap:8px; margin-top:12px; flex-wrap:wrap; }
.footer-social a { font-family:var(--mono); font-size:9px; letter-spacing:0.12em; text-transform:uppercase; color:var(--t2); text-decoration:none; padding:5px 9px; border:1px solid var(--border2); }
.footer-social a:hover { color:#fff; border-color:var(--red); }
a.footer-lnk { display:block; text-decoration:none; }
.nav-cta { text-decoration:none; }
@media (max-width: 900px) {
  .score-cols-4 { grid-template-columns:1fr 1fr !important; }
  .ta-box { grid-template-columns:1fr !important; }
}
@media (max-width: 600px) { .score-cols-4 { grid-template-columns:1fr !important; } }
.sc-home { position:relative; overflow:hidden; display:flex; flex-wrap:wrap; align-items:center; gap:22px; padding:22px 26px; background:var(--s1); border:1px solid var(--border); border-left:3px solid var(--red); cursor:pointer; }
.sc-home:hover { border-color:var(--red); }

/* Star Classic v2: athlete-profile style bouts, gallery */
.sc-hero-cut { position:absolute; right:0; bottom:0; height:92%; max-width:52%; object-fit:contain; object-position:right bottom; opacity:0.35; pointer-events:none; -webkit-mask-image:linear-gradient(to left,#000 40%,transparent); mask-image:linear-gradient(to left,#000 40%,transparent); }
#sc-results { display:grid; gap:12px; }
.sc-bout { border:1px solid var(--border); border-radius:6px; overflow:hidden; background:#0a1420; }
.sc-bout-top { display:flex; align-items:stretch; gap:0; border-bottom:1px solid var(--border); background:var(--s1); }
.sc-mu-img { width:180px; height:auto; max-height:110px; object-fit:cover; display:block; border-right:1px solid var(--border); }
.sc-bout-meta { flex:1; display:flex; align-items:center; justify-content:flex-end; gap:16px; padding:10px 16px; font-family:var(--mono); font-size:10px; letter-spacing:0.14em; color:var(--t3); }
.sc-bout-meta span:first-child { margin-right:auto; }
.sc-bout .bout-card { display:grid; grid-template-columns:1fr 120px 1fr; align-items:center; padding:16px 20px; border-bottom:1px solid var(--border); }
.sc-bout .bc-side { display:flex; flex-direction:column; gap:5px; }
.sc-bout .bc-left { align-items:flex-start; }
.sc-bout .bc-right { align-items:flex-end; text-align:right; }
.sc-bout .bc-center { display:flex; flex-direction:column; align-items:center; gap:3px; border-left:1px solid var(--border); border-right:1px solid var(--border); padding:0 14px; }
.sc-bout .bc-wt-lbl { font-family:var(--mono); font-size:9px; color:var(--t3); letter-spacing:.1em; text-transform:uppercase; }
.sc-bout .bc-rounds { font-family:var(--num); font-size:30px; color:#fff; line-height:1; }
.sc-bout .bc-wl { font-family:var(--mono); font-size:10px; font-weight:800; letter-spacing:.1em; }
.sc-bout .bc-wlbl-w { color:#00d97e; } .sc-bout .bc-wlbl-l { color:#888; } .sc-bout .bc-wl-dash { color:var(--t3); }
.sc-bout .bc-rt { font-family:var(--mono); font-size:9px; color:var(--t3); letter-spacing:.08em; text-transform:uppercase; }
.sc-bout .bc-name { font-family:var(--cond); font-weight:800; letter-spacing:.05em; text-transform:uppercase; line-height:1; }
.sc-bout .bc-score-w { font-family:var(--num); font-size:13px; color:#fff; } .sc-bout .bc-score-l { font-family:var(--num); font-size:13px; color:var(--t3); }
.sc-bout .bc-tp { display:flex; align-items:baseline; gap:3px; font-family:var(--num); line-height:1; }
.sc-bout .bc-tp-w { font-size:26px; color:#00d97e; } .sc-bout .bc-tp-l { font-size:20px; color:var(--t3); }
.sc-bout .bc-tp-lbl { font-family:var(--mono); font-size:9px; letter-spacing:.1em; opacity:.7; }
.sc-side-lbl { font-family:var(--mono); font-size:9px; letter-spacing:0.14em; text-transform:uppercase; }
.sc-s1 { font-family:var(--mono); font-size:8.5px; letter-spacing:0.12em; color:var(--t3); text-transform:uppercase; }
.sc-perfs { display:grid; grid-template-columns:1fr 1fr; }
.sc-perf { padding:14px 20px; }
.sc-perf + .sc-perf { border-left:1px solid var(--border); }
.sc-gallery { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:6px; }
.sc-gallery img { width:100%; aspect-ratio:3/2; object-fit:cover; display:block; border:1px solid var(--border); transition:transform .2s; }
.sc-gallery a:hover img { transform:scale(1.02); border-color:var(--red); }
.sc-box-img { width:100%; height:170px; object-fit:cover; display:block; margin:-20px -22px 14px; width:calc(100% + 44px); border-bottom:1px solid var(--border); background:#000; }
.cw-pending { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); gap:22px; align-items:center; background:var(--s1); border:1px solid var(--border); padding:18px; }
.cw-pending > img { width:100%; display:block; border:1px solid var(--border); }
.cw-pending p { font-size:12.5px; color:var(--t2); line-height:1.7; }
@media (max-width: 900px) {
  .sc-perfs { grid-template-columns:1fr; } .sc-perf + .sc-perf { border-left:0; border-top:1px solid var(--border); }
  .sc-bout .bout-card { grid-template-columns:minmax(0,1fr) 84px minmax(0,1fr); padding:12px 10px; gap:6px; }
  .sc-mu-img { width:120px; }
  .cw-pending { grid-template-columns:1fr; }
  .sc-hero-cut { display:none; }
}
.mascot-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:14px; }
.mascot-card { background:var(--s1); border:1px solid var(--border); border-top:3px solid var(--red); overflow:hidden; }
.mascot-img { aspect-ratio:4/3; background:#000; overflow:hidden; }
.mascot-img img { width:100%; height:100%; object-fit:cover; display:block; }
.mascot-img.contain img { object-fit:contain; padding:18px; }
.mascot-body { padding:16px 18px; }
.mascot-body p { font-size:12.5px; color:var(--t2); line-height:1.65; }
.sp-logo { height:84px; display:flex; align-items:center; justify-content:center; background:#fff; margin:-20px -22px 14px; padding:10px; border-bottom:1px solid var(--border); }
.sp-logo img { max-height:64px; max-width:90%; object-fit:contain; }
.lg-banner { width:100%; max-width:760px; display:block; margin-bottom:18px; border:1px solid var(--border); }
.sponsor-chip { display:inline-flex; align-items:center; justify-content:center; height:46px; padding:6px 12px; background:#fff; border-radius:3px; }
.sponsor-chip img { max-height:34px; max-width:130px; object-fit:contain; display:block; }
.sponsor-logos { flex-wrap:wrap; gap:10px; }

/* ── Star Classic: zoom lightbox, all-star cards, CLAW Wars champs (r21) ── */
img[data-zoom] { cursor:zoom-in; }
.sc-gal-item { padding:0; border:0; background:none; cursor:zoom-in; display:block; overflow:hidden; }
.sc-gal-item:hover img { transform:scale(1.02); border-color:var(--red); }
#sc-lightbox { position:fixed; inset:0; z-index:9999; display:none; align-items:center; justify-content:center; background:rgba(2,5,10,0.94); backdrop-filter:blur(4px); }
#sc-lightbox.open { display:flex; }
#sc-lightbox figure { margin:0; max-width:94vw; max-height:92vh; display:flex; flex-direction:column; align-items:center; overflow:auto; }
#sc-lightbox img { max-width:94vw; max-height:86vh; object-fit:contain; display:block; cursor:zoom-in; box-shadow:0 20px 80px rgba(0,0,0,0.8); transition:transform .2s; }
#sc-lightbox img.lb-zoomed { max-width:none; max-height:none; width:auto; cursor:zoom-out; transform:none; }
#sc-lightbox figcaption { font-family:var(--mono); font-size:10px; letter-spacing:0.16em; text-transform:uppercase; color:var(--t3); margin-top:10px; }
#sc-lightbox button { position:absolute; background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.15); color:#fff; cursor:pointer; font-size:34px; line-height:1; width:52px; height:52px; border-radius:50%; }
#sc-lightbox button:hover { background:var(--red); border-color:var(--red); }
#sc-lightbox .lb-x { top:18px; right:18px; font-size:30px; }
#sc-lightbox .lb-prev { left:18px; top:50%; transform:translateY(-50%); }
#sc-lightbox .lb-next { right:18px; top:50%; transform:translateY(-50%); }
.card-row { display:flex; flex-wrap:wrap; gap:26px; justify-content:center; padding:10px 0 26px; }
.sc-card-wrap { flex:0 0 auto; }
.sc-card-head { display:flex; align-items:baseline; gap:14px; border-bottom:3px solid var(--c); padding-bottom:10px; margin:10px 0 18px; }
.sc-card-head span { font-family:var(--display); font-size:34px; letter-spacing:0.03em; color:var(--c); }
.sc-card-head small { font-family:var(--mono); font-size:9px; letter-spacing:0.16em; text-transform:uppercase; color:var(--t3); }
.cw-nophoto .photo-layer { bottom:150px !important; height:220px !important; opacity:0.55; }
.cw-results { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(340px,100%),1fr)); gap:12px; margin-top:6px; }
.cw-res-card { background:var(--s1); border:1px solid var(--border); border-top:2px solid #f5c542; padding:14px 16px; }
.cw-res-head { display:flex; align-items:baseline; gap:10px; margin-bottom:10px; flex-wrap:wrap; }
.cw-res-wt { font-family:var(--num); font-size:26px; color:#f5c542; }
.cw-res-name { font-family:'Russo One',sans-serif; font-size:18px; text-transform:uppercase; color:#fff; }
.cw-res-rec { font-family:var(--mono); font-size:9px; letter-spacing:0.14em; text-transform:uppercase; color:var(--t3); margin-left:auto; }
.cw-bout { display:grid; grid-template-columns:62px 18px 1fr auto 34px; gap:8px; align-items:center; font-size:12.5px; padding:5px 0; border-top:1px solid var(--border); }
.cw-rd { font-family:var(--mono); font-size:9px; letter-spacing:0.1em; color:var(--t3); text-transform:uppercase; }
.cw-wl { font-family:var(--num); font-size:14px; }
.cw-bout.w .cw-wl { color:#00d97e; } .cw-bout.l .cw-wl { color:var(--red); }
.cw-opp { color:var(--t1); }
.cw-res { font-family:var(--mono); font-size:10px; color:var(--t2); }
.cw-ovr { font-family:var(--num); font-size:17px; text-align:right; }
.cw-also { font-size:11.5px; color:var(--t2); line-height:1.6; margin-top:8px; }
.cw-note { font-family:var(--mono); font-size:9px; letter-spacing:0.12em; color:var(--t3); margin-top:12px; line-height:1.7; }
.cw-note a { color:var(--t2); }
@media (max-width:700px) { .card-row { gap:16px; } .sc-card-wrap { transform:scale(0.92); } }
.sc-card-wrap .logo-row span { white-space:nowrap; }
.cw-res-ovr { font-family:var(--num); font-size:26px; margin-left:auto; }
.cw-res-head .cw-res-rec { display:none; }
.cw-res-card > .cw-res-rec { margin:-4px 0 10px; display:block; }
.cw-bout-d { border-top:1px solid var(--border); }
.cw-bout-d > summary { list-style:none; cursor:pointer; border-top:0; }
.cw-bout-d > summary::-webkit-details-marker { display:none; }
.cw-bout-d[open] > summary { background:rgba(245,197,66,0.06); }
.cw-perf { padding:10px 4px 14px; }
.cw-career { margin:4px 0 12px; padding:10px 12px; background:rgba(245,197,66,0.05); border:1px solid rgba(245,197,66,0.18); }
.cw-notes { margin-top:10px; font-size:12px; line-height:1.55; color:var(--t2); }
.cw-notes-h { font-family:var(--mono); font-size:9px; letter-spacing:0.16em; color:var(--t3); margin-bottom:6px; }
.cw-nofilm { font-size:11.5px; color:#f0b933; margin-bottom:8px; }
.cw-tag { font-family:var(--mono); font-size:8px; letter-spacing:0.12em; padding:1px 5px; margin-left:6px; vertical-align:1px; }
.cw-tag.film { color:#00d97e; border:1px solid rgba(0,217,126,0.4); }
.cw-tag.nofilm { color:#f0b933; border:1px solid rgba(240,185,51,0.4); }
.cw-vid { display:inline-block; margin-top:10px; font-family:var(--mono); font-size:10px; letter-spacing:0.12em; color:var(--t1); text-decoration:none; border:1px solid var(--border); padding:5px 10px; }
.cw-vid:hover { border-color:var(--red); }
.sc-card-wrap .strip-line { display:none; }
/* card cleanup (r29): no strip line over the team label, photos lower so heads sit centered, record badge */
.sc-card-wrap .strip-line { display:none !important; }
.sc-card-wrap .photo-layer { height:332px !important; bottom:90px !important; }
.sc-card-wrap .photo-base img { object-position:center top !important; }
.ovr-rec { display:inline-block; margin-top:7px; font-family:'Orbitron',sans-serif; font-size:10px; font-weight:800; letter-spacing:0.12em; color:#fff; padding:2px 7px; border:1px solid rgba(255,255,255,0.35); background:rgba(0,0,0,0.5); }
.sc-card-wrap .photo-layer img { -webkit-mask-image:linear-gradient(to bottom,#000 76%,transparent 99%); mask-image:linear-gradient(to bottom,#000 76%,transparent 99%); }

/* ── Event athletes (Star Classic + Open champs) on the Athletes tab and their landing pages ── */
.ev-group-head { margin: 40px 0 22px; padding-top: 26px; border-top: 1px solid var(--border); }
.ev-group-head:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.ev-group-sub { font-family: var(--mono); font-size: 10px; letter-spacing: 0.16em; color: var(--t3); text-transform: uppercase; margin-top: 8px; }
.ev-match { display: flex; align-items: center; gap: 12px; padding: 12px 14px; background: #0a1420; border: 1px solid var(--border); border-radius: 6px; }
.ev-wl { font-family: var(--display); font-size: 18px; width: 26px; text-align: center; }
.ev-wl.w { color: #00d97e; } .ev-wl.l { color: #ff5252; }
.ev-opp { flex: 1; font-family: var(--cond); font-size: 17px; font-weight: 700; color: #fff; }
.ev-opp small { display: block; font-family: var(--mono); font-size: 9px; letter-spacing: 0.14em; color: var(--t3); font-weight: 400; text-transform: uppercase; margin-top: 2px; }
.ev-res { font-family: var(--mono); font-size: 11px; letter-spacing: 0.08em; color: var(--t2); }
.ev-oppovr { font-family: var(--num); font-size: 22px; font-weight: 800; min-width: 32px; text-align: right; }
.ev-note { font-size: 12px; line-height: 1.55; color: var(--t3); margin: 10px 2px 0; }
.ev-links { display: flex; flex-wrap: wrap; gap: 18px; margin-top: 14px; }
.ev-links a { font-family: var(--mono); font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--red); cursor: pointer; text-decoration: none; }
.ev-links a:hover { text-decoration: underline; }