/* ═══════════════════════════════════════════════════════
   tst-hub-torneos.css — v7.0
   Alineado al TST Design System v5.0
   Fuentes: DM Sans (headline), Lora (body), DM Mono
   ═══════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;800;900&family=DM+Mono:wght@400;500;700&family=Lora:ital,wght@0,400;0,700;1,400;1,700&display=swap');

/* ── Design Tokens ── */
:root {
  --tst-white:        #FFFFFF;
  --tst-off-white:    #F7F6F2;
  --tst-paper:        #EFEFEA;
  --tst-ink-100:      #1A1A1A;
  --tst-ink-60:       #5C5C5C;
  --tst-ink-30:       #A8A8A8;
  --tst-ink-10:       #E4E3DC;
  --tst-brand:        #305180;
  --tst-brand-dark:   #1E3A5F;
  --tst-brand-light:  #D6E3F0;
  --tst-brand-mid:    #254368;
  --tst-lime:         #E1FA59;
  --tst-lime-dark:    #B8CC30;
  --tst-lime-bg:      #F5FDD0;
  --tst-gold:         #F5B021;
  --tst-gold-dark:    #C8890F;
  --tst-gold-bg:      #FEF3D7;
  --tst-live:         #E63946;
  --tst-wta:          #6A4C93;
  --tst-win:          #2A9D8F;
  --surface-clay:     #C4632A;
  --surface-grass:    #3A7D44;
  --surface-hard:     #2563EB;
  --surface-indoor:   #6B7280;
  --surface-clay-bg:  #FBF0E9;
  --surface-grass-bg: #EAF4EC;
  --surface-hard-bg:  #EBF2FF;
  --surface-indoor-bg:#F3F4F6;
  --font-headline:    "DM Sans", "Helvetica Neue", Arial, sans-serif;
  --font-body:        "Lora", Georgia, serif;
  --font-mono:        "DM Mono", "Courier New", monospace;
  --radius-sm:        4px;
  --radius-md:        8px;
  --radius-lg:        12px;
  --shadow-card:      0 1px 3px rgba(0,0,0,.07), 0 4px 12px rgba(0,0,0,.06);
  --shadow-hover:     0 4px 8px rgba(0,0,0,.09), 0 12px 28px rgba(0,0,0,.10);
  --ease-standard:    cubic-bezier(.4,0,.2,1);
  --ease-spring:      cubic-bezier(.34,1.56,.64,1);
  --tst-transition:   150ms cubic-bezier(.4,0,.2,1);
  --tst-match-w:      196px;
}

/* ── Reset ── */
.tst-hub *, .tst-hub *::before, .tst-hub *::after { box-sizing:border-box; margin:0; padding:0; }
.tst-hub {
  font-family: var(--font-headline);
  color: var(--tst-ink-100);
  background: var(--tst-off-white);
  max-width: 960px; margin: 0 auto;
  padding: 0 0 56px;
  -webkit-font-smoothing: antialiased;
}
.tst-hub *:focus-visible {
  outline: 2px solid var(--tst-gold); outline-offset: 3px; border-radius: var(--radius-sm);
}
.tst-hub *:focus:not(:focus-visible) { outline: none; }

/* ══ SKELETON ══ */
.tst-hub__skeleton { padding: 20px 16px; }
@keyframes tst-pulse { 0%,100%{opacity:1} 50%{opacity:.45} }
.pulse { animation: tst-pulse 1.6s var(--ease-standard) infinite; }
.tst-skeleton-header { display:flex; gap:14px; align-items:flex-start; margin-bottom:18px; }
.tst-skeleton-logo { width:64px; height:64px; border-radius:var(--radius-md); background:rgba(48,81,128,.18); flex-shrink:0; }
.tst-skeleton-info { flex:1; display:flex; flex-direction:column; gap:9px; padding-top:6px; }
.tst-skeleton-line { height:12px; border-radius:6px; background:rgba(48,81,128,.12); }
.tst-skeleton-line--sm { width:28%; } .tst-skeleton-line--md { width:52%; } .tst-skeleton-line--lg { width:78%; height:18px; }
.tst-skeleton-tabs  { height:50px; border-radius:var(--radius-md); background:var(--tst-paper); margin-bottom:14px; }
.tst-skeleton-body  { display:flex; flex-direction:column; gap:10px; }
.tst-skeleton-card  { height:76px; border-radius:var(--radius-md); background:var(--tst-paper); }

/* ══ HEADER ══ */
.tst-hub__header {
  background: var(--tst-brand-dark);
  padding: 20px 16px 18px;
  display: flex; align-items: flex-start; gap: 14px; flex-wrap: wrap;
  position: relative; overflow: hidden;
}
.tst-hub__header::before {
  content:''; position:absolute; top:-50px; right:-50px;
  width:220px; height:220px; border-radius:50%;
  background:rgba(225,250,89,.05); pointer-events:none;
}
.tst-hub__header::after {
  content:''; position:absolute; bottom:-60px; left:-30px;
  width:180px; height:180px; border-radius:50%;
  background:rgba(245,176,33,.04); pointer-events:none;
}
.tst-hub__header-logo-wrap {
  width:60px; height:60px; flex-shrink:0;
  background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.14);
  border-radius:var(--radius-md); display:flex; align-items:center; justify-content:center;
  overflow:hidden; position:relative; z-index:1;
}
.tst-hub__logo { width:54px; height:54px; object-fit:contain; display:none; }
.tst-hub__logo-fb {
  display:none; width:100%; height:100%; align-items:center; justify-content:center;
  font-family:var(--font-headline); font-size:18px; font-weight:900; color:var(--tst-lime);
}
.tst-hub__header-body { flex:1; min-width:160px; position:relative; z-index:1; }
.tst-hub__category {
  display:inline-block; font-family:var(--font-headline);
  font-size:9px; font-weight:800; letter-spacing:.1em; text-transform:uppercase;
  padding:3px 8px; border-radius:var(--radius-sm); margin-bottom:5px;
}
.tst-hub__category--atp { background:rgba(225,250,89,.18); color:var(--tst-lime); }
.tst-hub__category--wta { background:rgba(106,76,147,.3);  color:#D4B8F9; }
.tst-hub__name {
  font-family:var(--font-headline); font-size:21px; font-weight:900;
  color:#fff; line-height:1.1; letter-spacing:-.025em; margin-bottom:4px;
}
.tst-hub__meta {
  font-family:var(--font-headline); font-size:11px; color:rgba(255,255,255,.45); margin-bottom:7px;
}
.tst-hub__surface-badge {
  display:inline-block; font-family:var(--font-headline);
  font-size:9px; font-weight:700; text-transform:uppercase; letter-spacing:.06em;
  padding:3px 8px; border-radius:var(--radius-sm);
}
.tst-hub__surface-badge--clay   { background:var(--surface-clay-bg);   color:var(--surface-clay); }
.tst-hub__surface-badge--hard   { background:var(--surface-hard-bg);   color:var(--surface-hard); }
.tst-hub__surface-badge--grass  { background:var(--surface-grass-bg);  color:var(--surface-grass); }
.tst-hub__surface-badge--indoor { background:var(--surface-indoor-bg); color:var(--surface-indoor); }

/* ══ TABS ══ */
.tst-hub__tabs {
  display:flex; background:var(--tst-white);
  border-bottom:2px solid var(--tst-ink-10);
  position:sticky; top:0; z-index:100;
  overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch;
}
.tst-hub__tabs::-webkit-scrollbar { display:none; }
.tst-hub__tab {
  flex:1; min-width:54px; background:none; border:none;
  padding:9px 4px 7px;
  font-family:var(--font-headline); font-size:9.5px; font-weight:700;
  text-transform:uppercase; letter-spacing:.05em; color:var(--tst-ink-30);
  cursor:pointer; white-space:nowrap; text-align:center;
  border-bottom:2px solid transparent; margin-bottom:-2px;
  display:flex; flex-direction:column; align-items:center; gap:3px;
  transition:color var(--tst-transition), border-color var(--tst-transition);
  touch-action:manipulation; -webkit-tap-highlight-color:transparent;
}
.tst-tab-icon  { font-size:16px; line-height:1; }
.tst-tab-label { display:block; }
.tst-hub__tab:hover { color:var(--tst-brand); }
.tst-hub__tab--active { color:var(--tst-brand); border-bottom-color:var(--tst-live); }

/* ══ PANELS ══ */
.tst-hub__panel { padding:14px; display:none; }
.tst-hub__panel--active { display:block; }

/* ══ DATE NAV ══ */
.tst-hub__date-nav {
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  margin-bottom:12px; background:var(--tst-white);
  border:1px solid var(--tst-ink-10); border-radius:var(--radius-md); padding:9px 12px;
}
.tst-hub__date-btn {
  background:none; border:1px solid var(--tst-ink-10); border-radius:var(--radius-sm);
  min-width:34px; height:34px; cursor:pointer; font-size:18px; color:var(--tst-brand);
  display:flex; align-items:center; justify-content:center;
  transition: background var(--tst-transition), color var(--tst-transition);
  flex-shrink:0; touch-action:manipulation; -webkit-tap-highlight-color:transparent;
}
.tst-hub__date-btn:hover, .tst-hub__date-btn:active {
  background:var(--tst-brand); color:#fff; border-color:var(--tst-brand);
}
.tst-hub__date-label {
  font-family:var(--font-headline); font-size:12px; font-weight:700;
  color:var(--tst-ink-100); text-align:center; flex:1; text-transform:capitalize;
}

/* ══ SCHEDULE FILTER TABS ══ */
#tst-schedule-filter-tabs {
  display:flex; gap:6px; padding:0 0 12px; flex-wrap:wrap;
}
.tst-sched-ftab {
  display:inline-flex; align-items:center; gap:5px;
  padding:5px 12px; border-radius:20px;
  border:1.5px solid var(--tst-ink-10); background:var(--tst-white);
  font-family:var(--font-headline); font-size:11px; font-weight:700;
  color:var(--tst-ink-60); cursor:pointer;
  transition:all var(--tst-transition); white-space:nowrap; letter-spacing:.02em;
}
.tst-sched-ftab span {
  font-size:9px; font-weight:800; font-family:var(--font-mono);
  background:var(--tst-paper); color:var(--tst-ink-30);
  padding:1px 5px; border-radius:10px;
}
.tst-sched-ftab:hover { border-color:var(--tst-brand-light); color:var(--tst-brand); }
.tst-sched-ftab--active { background:var(--tst-brand); border-color:var(--tst-brand); color:#fff; }
.tst-sched-ftab--active span { background:rgba(255,255,255,.22); color:#fff; }

/* ══ MATCH LIST ══ */
.tst-hub__match-list { display:flex; flex-direction:column; gap:8px; }

/* ══ MATCH CARD ══ */
.tst-hub__match-card {
  background:var(--tst-white); border:1px solid var(--tst-ink-10);
  border-radius:var(--radius-md); padding:11px 13px;
  transition:box-shadow var(--tst-transition);
}
.tst-hub__match-card:hover { box-shadow:var(--shadow-card); }
.tst-hub__match-card--live {
  border-left:3px solid var(--tst-live);
  background:rgba(230,57,70,.04);
}
.tst-hub__match-card--finished { opacity:.9; }
.tst-hub__match-card--cancelled { opacity:.65; }
.tst-hub__match-meta {
  display:flex; align-items:center; gap:6px; margin-bottom:8px; flex-wrap:wrap;
}
.tst-hub__status-icon { font-size:12px; line-height:1; }
.tst-hub__match-time {
  font-family:var(--font-headline); font-size:10px; font-weight:800;
  color:var(--tst-ink-60); text-transform:uppercase; letter-spacing:.05em;
}
.tst-hub__match-time--live { color:var(--tst-live); }
.tst-hub__match-round {
  font-family:var(--font-headline); font-size:9px; font-weight:700;
  text-transform:uppercase; letter-spacing:.05em;
  background:var(--tst-paper); color:var(--tst-ink-60);
  padding:2px 7px; border-radius:var(--radius-sm); border:1px solid var(--tst-ink-10);
}
.tst-hub__match-body { display:flex; align-items:center; gap:10px; }
.tst-hub__match-players { flex:1; display:flex; flex-direction:column; gap:6px; }
.tst-hub__player { display:flex; align-items:center; gap:5px; }
.tst-hub__player-name {
  font-family:var(--font-headline); font-size:14px; font-weight:600;
  color:var(--tst-ink-100); line-height:1.2;
}
.tst-hub__player--winner .tst-hub__player-name { font-weight:800; color:var(--tst-brand); }
.tst-hub__player-trophy { font-size:11px; }
.tst-match-stats-btn {
  margin-left:auto; background:none; border:1px solid var(--tst-ink-10);
  border-radius:var(--radius-sm); padding:5px 8px; font-size:12px; cursor:pointer;
  color:var(--tst-ink-30); transition:all var(--tst-transition); flex-shrink:0;
  touch-action:manipulation; -webkit-tap-highlight-color:transparent;
}
.tst-match-stats-btn:hover { border-color:var(--tst-brand); color:var(--tst-brand); background:var(--surface-hard-bg); }

/* Special labels */
.tst-hub__special-label {
  display:inline-block; font-family:var(--font-headline);
  font-size:9px; font-weight:800; text-transform:uppercase; letter-spacing:.05em;
  padding:2px 7px; border-radius:var(--radius-sm); border:1px solid;
}
.tst-hub__special-label--wo     { background:#FFF4E5; color:#B95000; border-color:#FDDCB5; }
.tst-hub__special-label--ret    { background:#FFF1F0; color:var(--tst-live); border-color:#FCC; }
.tst-hub__special-label--cancel { background:var(--tst-paper); color:var(--tst-ink-60); border-color:var(--tst-ink-10); }
.tst-hub__match-card--cancelled .tst-hub__match-time { text-decoration:line-through; opacity:.5; }

/* Score */
.tst-score-cols { display:flex; flex-direction:column; gap:3px; align-items:flex-end; flex-shrink:0; }
.tst-score-row  { display:flex; gap:3px; min-height:22px; align-items:center; }
.tst-set {
  font-family:var(--font-mono); font-size:12px; font-weight:700; font-variant-numeric:tabular-nums;
  min-width:22px; height:22px; border-radius:var(--radius-sm);
  display:flex; align-items:center; justify-content:center; padding:0 3px;
}
.tst-set sup { font-size:8px; vertical-align:super; margin-left:1px; }
.tst-set--won  { background:var(--tst-brand); color:#fff; }
.tst-set--lost { background:var(--tst-paper); color:var(--tst-ink-30); border:1px solid var(--tst-ink-10); }

/* ══ ROUND TABS ══ */
.tst-hub__round-tabs {
  display:flex; flex-wrap:nowrap; gap:6px; margin-bottom:12px;
  overflow-x:auto; scrollbar-width:none; padding-bottom:2px; -webkit-overflow-scrolling:touch;
}
.tst-hub__round-tabs::-webkit-scrollbar { display:none; }
.tst-hub__round-tab {
  background:var(--tst-white); border:1.5px solid var(--tst-ink-10); border-radius:20px;
  padding:5px 14px; font-family:var(--font-headline); font-size:11px; font-weight:700;
  color:var(--tst-ink-60); cursor:pointer; transition:all var(--tst-transition);
  display:flex; align-items:center; gap:5px; white-space:nowrap; flex-shrink:0;
  touch-action:manipulation; letter-spacing:.02em;
}
.tst-hub__round-tab:hover { border-color:var(--tst-brand); color:var(--tst-brand); }
.tst-hub__round-tab--active { background:var(--tst-brand); border-color:var(--tst-brand); color:#fff; }
.tst-hub__round-tab-count {
  font-family:var(--font-mono); font-size:9px; font-weight:800;
  background:rgba(255,255,255,.22); padding:1px 5px; border-radius:10px;
}
.tst-hub__round-tab:not(.tst-hub__round-tab--active) .tst-hub__round-tab-count {
  background:var(--tst-paper); color:var(--tst-ink-30);
}

/* ══ BRACKET ══ */
.tst-draw-tabs { display:flex; gap:8px; margin-bottom:12px; overflow-x:auto; scrollbar-width:none; }
.tst-draw-tabs::-webkit-scrollbar { display:none; }
.tst-draw-tab {
  background:var(--tst-white); border:1.5px solid var(--tst-ink-10); border-radius:20px;
  padding:6px 16px; font-family:var(--font-headline); font-size:11px; font-weight:700;
  color:var(--tst-ink-60); cursor:pointer; transition:all var(--tst-transition);
  white-space:nowrap; flex-shrink:0; touch-action:manipulation; letter-spacing:.03em;
}
.tst-draw-tab:hover { border-color:var(--tst-brand); color:var(--tst-brand); }
.tst-draw-tab--active { background:var(--tst-brand); border-color:var(--tst-brand); color:#fff; }

.tst-hub__draw-wrapper { overflow-x:auto; -webkit-overflow-scrolling:touch; padding-bottom:14px; }
#tst-draw-bracket { min-width:max-content; display:flex; flex-direction:column; gap:24px; }

/* Bracket tree */
.tst-bracket-wrap { display:inline-flex; flex-direction:column; gap:0; }

.tst-bracket-header {
  display:flex; background:var(--tst-brand-dark); overflow:hidden;
  border-radius:var(--radius-md) var(--radius-md) 0 0;
}
.tst-bracket-header__cell {
  min-width:var(--tst-match-w); padding:9px 8px;
  font-family:var(--font-headline); font-size:9px; font-weight:800;
  text-transform:uppercase; letter-spacing:.09em; color:rgba(255,255,255,.65);
  text-align:center; border-right:1px solid rgba(255,255,255,.09);
}
.tst-bracket-header__cell:last-child { border-right:none; }

.tst-bracket-grid {
  display:flex; align-items:stretch;
  background:var(--tst-white); border:1px solid var(--tst-ink-10); border-top:none;
  border-radius:0 0 var(--radius-md) var(--radius-md); padding:10px 4px;
}
.tst-bracket-col {
  min-width:var(--tst-match-w); display:flex; flex-direction:column; padding:0 4px;
}
.tst-bracket-col + .tst-bracket-col { border-left:1px solid var(--tst-ink-10); }

/* Slot — el flex-grow dinámico viene del JS */
.tst-b-slot {
  display:flex; align-items:center; width:100%; min-height:64px; padding:4px 0;
}
.tst-b-slot .tst-b-match { width:100%; }

/* Partido dentro del bracket — estilo Design System */
.tst-b-match {
  background:var(--tst-off-white); border:1px solid var(--tst-ink-10);
  border-radius:var(--radius-sm); overflow:hidden;
  min-width:calc(var(--tst-match-w) - 10px);
  transition:box-shadow var(--tst-transition);
}
.tst-b-match:hover { box-shadow:var(--shadow-card); }
.tst-b-match--final { border-color:var(--tst-gold-dark); box-shadow:0 0 0 2px var(--tst-gold-bg); }

.tst-b-player {
  display:flex; align-items:center; justify-content:space-between;
  padding:5px 7px; min-height:26px; gap:4px;
  border-bottom:.5px solid var(--tst-ink-10);
}
.tst-b-player:last-of-type { border-bottom:none; }
/* Winner — fondo verde agua, como en el Design System */
.tst-b-player--w { background:#EAF7F5; }
.tst-b-player--w .tst-b-player__name { font-weight:800; color:var(--tst-win); }
.tst-b-player--l .tst-b-player__name { color:var(--tst-ink-30); }
.tst-b-player--l .tst-b-score        { color:var(--tst-ink-30); }

.tst-b-player__left  { display:flex; align-items:center; gap:4px; flex:1; min-width:0; overflow:hidden; }
.tst-b-player__right { display:flex; align-items:center; gap:3px; flex-shrink:0; }

.tst-b-player__name {
  font-family:var(--font-headline); font-size:11px; font-weight:600;
  color:var(--tst-ink-100); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.tst-b-seed {
  font-family:var(--font-mono); font-size:8px; font-weight:700; color:var(--tst-ink-30);
  background:var(--tst-white); border:1px solid var(--tst-ink-10);
  border-radius:3px; padding:0 3px; line-height:14px; flex-shrink:0;
}
.tst-b-flag   { width:14px; height:10px; border-radius:1px; flex-shrink:0; object-fit:cover; }
.tst-b-score  { font-family:var(--font-mono); font-size:10px; font-weight:700; color:var(--tst-brand); }
.tst-b-trophy { font-size:10px; flex-shrink:0; }
.tst-b-divider { height:1px; background:var(--tst-ink-10); }

/* Draw empty */
.tst-hub__empty--draw {
  display:flex; flex-direction:column; align-items:center; gap:10px; padding:44px 20px; text-align:center;
}
.tst-draw-pending-icon  { font-size:36px; }
.tst-draw-pending-title { font-family:var(--font-headline); font-size:16px; font-weight:800; color:var(--tst-brand); }
.tst-draw-pending-sub   { font-family:var(--font-headline); font-size:12px; color:var(--tst-ink-60); }

/* ══ COMPETITORS ══ */
.tst-competitors-header-row {
  display:flex; align-items:center; justify-content:space-between;
  gap:10px; margin-bottom:12px; flex-wrap:wrap;
}
.tst-competitors-header-row .tst-comp-tabs { margin-bottom:0; flex:1; }

.tst-competitors-refresh-btn {
  display:inline-flex; align-items:center; gap:6px;
  background:var(--tst-white); border:1.5px solid var(--tst-ink-10);
  border-radius:var(--radius-sm); padding:7px 14px;
  font-family:var(--font-headline); font-size:11px; font-weight:700; color:var(--tst-brand);
  cursor:pointer; transition:all var(--tst-transition);
  white-space:nowrap; flex-shrink:0; touch-action:manipulation; -webkit-tap-highlight-color:transparent;
  letter-spacing:.03em;
}
.tst-competitors-refresh-btn:hover { background:var(--surface-hard-bg); border-color:var(--tst-brand); }
.tst-competitors-refresh-btn:disabled { opacity:.5; cursor:not-allowed; }

.tst-comp-tabs { display:flex; gap:8px; margin-bottom:12px; flex-wrap:wrap; }
.tst-comp-tab {
  background:var(--tst-white); border:1.5px solid var(--tst-ink-10); border-radius:20px;
  padding:6px 16px; font-family:var(--font-headline); font-size:11px; font-weight:700;
  color:var(--tst-ink-60); cursor:pointer; transition:all var(--tst-transition);
  display:flex; align-items:center; gap:6px; touch-action:manipulation; letter-spacing:.02em;
}
.tst-comp-tab:hover { border-color:var(--tst-brand); color:var(--tst-brand); }
.tst-comp-tab--active { background:var(--tst-brand); border-color:var(--tst-brand); color:#fff; }
.tst-comp-tab__count {
  font-family:var(--font-mono); font-size:9px; font-weight:800;
  background:rgba(255,255,255,.22); padding:1px 5px; border-radius:10px;
}
.tst-comp-tab:not(.tst-comp-tab--active) .tst-comp-tab__count {
  background:var(--tst-paper); color:var(--tst-ink-30);
}

/* Grid jugadores */
.tst-hub__competitors-grid {
  display:grid; grid-template-columns:repeat(auto-fill,minmax(126px,1fr)); gap:10px;
}

/* Player card — estilo Design System */
.tst-competitor-card {
  background:var(--tst-white); border:1px solid var(--tst-ink-10); border-radius:var(--radius-lg);
  box-shadow:var(--shadow-card); padding:14px 10px 12px;
  display:flex; flex-direction:column; align-items:center; text-align:center; gap:8px; overflow:hidden;
  transition:box-shadow var(--tst-transition), transform 250ms var(--ease-standard);
}
.tst-competitor-card:hover { box-shadow:var(--shadow-hover); transform:translateY(-2px); }

.tst-competitor-photo-wrap { position:relative; width:60px; height:60px; flex-shrink:0; }
.tst-competitor-photo {
  width:60px; height:60px; border-radius:50%; object-fit:cover; object-position:top center;
  background:var(--surface-hard-bg); border:2px solid var(--tst-ink-10); display:block;
}
/* Avatar initials — gradient azul + lime, como en el Design System */
.tst-competitor-initials {
  width:60px; height:60px; border-radius:50%;
  background:linear-gradient(135deg, var(--tst-brand) 0%, var(--tst-brand-mid) 100%);
  border:2px solid rgba(255,255,255,.15);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-headline); font-size:16px; font-weight:800; color:var(--tst-lime);
}
/* Badge de seed — lime sobre azul oscuro */
.tst-competitor-seed {
  position:absolute; bottom:-2px; right:-4px;
  background:var(--tst-lime); color:var(--tst-brand-dark);
  font-family:var(--font-mono); font-size:8px; font-weight:800;
  width:18px; height:18px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  border:2px solid var(--tst-white);
}
.tst-competitor-info { display:flex; flex-direction:column; align-items:center; gap:4px; width:100%; }
.tst-competitor-name {
  font-family:var(--font-headline); font-size:11px; font-weight:700;
  color:var(--tst-ink-100); line-height:1.2; word-break:break-word;
}
.tst-competitor-meta { display:flex; align-items:center; justify-content:center; gap:4px; }
.tst-competitor-flag { border-radius:2px; vertical-align:middle; }
.tst-competitor-country { font-family:var(--font-headline); font-size:10px; color:var(--tst-ink-60); }
.tst-competitor-ranking {
  font-family:var(--font-mono); font-size:9px; font-weight:700; color:var(--tst-brand);
  background:var(--surface-hard-bg); padding:2px 8px; border-radius:var(--radius-sm);
}
.tst-competitors-refresh-note {
  font-family:var(--font-headline); font-size:10px; color:var(--tst-ink-30);
  text-align:right; padding:4px 0 8px;
}
.tst-competitors-refresh-indicator { display:none !important; }

/* ══ INFO ══ */
.tst-info-section-title {
  font-family:var(--font-headline); font-size:10px; font-weight:800;
  text-transform:uppercase; letter-spacing:.08em; color:var(--tst-ink-30); margin-bottom:10px;
}
.tst-info-grid {
  display:grid; grid-template-columns:repeat(2,1fr); gap:10px; margin-bottom:18px;
}
.tst-info-card {
  background:var(--tst-white); border:1px solid var(--tst-ink-10); border-radius:var(--radius-lg);
  padding:13px 12px; display:flex; flex-direction:column; gap:4px; box-shadow:var(--shadow-card);
}
.tst-info-card__title {
  font-family:var(--font-headline); font-size:9px; font-weight:800;
  text-transform:uppercase; letter-spacing:.08em; color:var(--tst-ink-30);
}
.tst-info-card__value {
  font-family:var(--font-headline); font-size:13px; font-weight:800; color:var(--tst-brand); line-height:1.2;
}
.tst-info-venues { margin-bottom:18px; }
.tst-venues-grid { display:flex; flex-wrap:wrap; gap:7px; }
.tst-venue-chip {
  background:var(--tst-white); border:1px solid var(--tst-ink-10); border-radius:20px;
  padding:5px 12px; display:flex; flex-direction:column; gap:1px;
}
.tst-venue-name { font-family:var(--font-headline); font-size:11px; font-weight:700; color:var(--tst-brand); }
.tst-venue-city { font-family:var(--font-headline); font-size:9px; color:var(--tst-ink-60); }

/* Palmarés */
.tst-info-champions {
  background:var(--tst-white); border:1px solid var(--tst-ink-10); border-radius:var(--radius-lg); overflow:hidden;
}
.tst-info-champions__title {
  font-family:var(--font-headline); font-size:10px; font-weight:800;
  text-transform:uppercase; letter-spacing:.07em;
  padding:11px 18px; background:var(--tst-brand-dark); color:var(--tst-lime);
}
.tst-info-champions__list { padding:4px 0; }
.tst-champion-row {
  display:flex; align-items:center; gap:10px; padding:9px 18px;
  border-bottom:1px solid var(--tst-ink-10); transition:background var(--tst-transition);
}
.tst-champion-row:last-child { border-bottom:none; }
.tst-champion-row:hover { background:var(--tst-off-white); }
.tst-champion-year { font-family:var(--font-mono); font-size:12px; font-weight:700; color:var(--tst-ink-30); min-width:42px; }
.tst-champion-name { font-family:var(--font-headline); flex:1; font-size:12px; font-weight:700; color:var(--tst-brand); }
.tst-champion-badge {
  font-family:var(--font-mono); font-size:9px; font-weight:800;
  background:var(--tst-gold-bg); color:var(--tst-gold-dark); padding:2px 7px; border-radius:var(--radius-sm);
}
.tst-info-multi-champs {
  background:var(--tst-white); border-bottom:1px solid var(--tst-ink-10); padding:13px 16px;
}
.tst-info-multi-champs__title {
  font-family:var(--font-headline); font-size:9px; font-weight:800;
  text-transform:uppercase; letter-spacing:.08em; color:var(--tst-ink-30); margin-bottom:9px;
}
.tst-info-multi-champs__grid { display:flex; flex-wrap:wrap; gap:6px; }
.tst-multi-champ-item {
  display:flex; align-items:center; gap:7px;
  background:var(--tst-off-white); border:1px solid var(--tst-ink-10); border-radius:20px; padding:4px 12px;
}
.tst-multi-champ-name { font-family:var(--font-headline); font-size:11px; font-weight:700; color:var(--tst-brand); }
.tst-multi-champ-count { font-family:var(--font-mono); font-size:11px; font-weight:800; color:var(--surface-clay); }

/* ══ STATS MODAL ══ */
.tst-stats-modal {
  position:fixed; inset:0; z-index:9999; display:flex; align-items:flex-end; justify-content:center;
}
.tst-stats-modal[hidden] { display:none; }
.tst-stats-modal__backdrop { position:absolute; inset:0; background:rgba(0,0,0,.52); cursor:pointer; }
.tst-stats-modal__box {
  position:relative; z-index:1; background:var(--tst-white);
  width:100%; max-width:540px; max-height:88vh; overflow-y:auto;
  border-radius:var(--radius-lg) var(--radius-lg) 0 0;
  padding:0 0 32px; box-shadow:0 -4px 40px rgba(0,0,0,.18); -webkit-overflow-scrolling:touch;
}
.tst-stats-modal__close {
  position:absolute; top:13px; right:13px; background:rgba(255,255,255,.14); border:none;
  width:28px; height:28px; border-radius:50%; cursor:pointer; font-size:13px; color:#fff;
  display:flex; align-items:center; justify-content:center; z-index:2;
  transition:background var(--tst-transition); touch-action:manipulation;
}
.tst-stats-modal__close:hover { background:rgba(255,255,255,.26); }
.tst-stats-modal__header {
  background:var(--tst-brand-dark); padding:14px 16px 12px;
  border-radius:var(--radius-lg) var(--radius-lg) 0 0;
  display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:8px;
}
.tst-stats-modal__title {
  font-family:var(--font-headline); font-size:9px; font-weight:800;
  text-transform:uppercase; letter-spacing:.1em; color:rgba(255,255,255,.4);
  text-align:center; grid-column:1/-1; margin-bottom:6px;
}
.tst-stats-p-name { font-family:var(--font-headline); font-size:13px; font-weight:800; color:#fff; }
.tst-stats-p-name--home { text-align:right; }
.tst-stats-p-name--away { text-align:left; }
.tst-stats-vs {
  font-family:var(--font-headline); font-size:9px; font-weight:900; color:var(--tst-lime);
  background:rgba(255,255,255,.1); padding:3px 8px; border-radius:20px;
}
.tst-stats-modal__content { padding:16px 16px 0; }
.tst-stats-container { display:flex; flex-direction:column; gap:20px; }
.tst-stats-group__title {
  font-family:var(--font-headline); font-size:9px; font-weight:800;
  text-transform:uppercase; letter-spacing:.08em; color:var(--tst-ink-30);
  margin-bottom:10px; padding-bottom:6px; border-bottom:1px solid var(--tst-ink-10);
}
.tst-stat-row { display:grid; grid-template-columns:44px 1fr 44px; align-items:center; gap:6px; margin-bottom:11px; }
.tst-stat-val { font-family:var(--font-mono); font-size:13px; font-weight:800; color:var(--tst-brand); }
.tst-stat-val--home { text-align:right; } .tst-stat-val--away { text-align:left; }
.tst-stat-info { display:flex; flex-direction:column; gap:4px; }
.tst-stat-name { font-family:var(--font-headline); font-size:10px; font-weight:600; color:var(--tst-ink-60); text-align:center; }
.tst-stat-bar { display:flex; height:4px; border-radius:2px; overflow:hidden; background:var(--tst-paper); }
.tst-stat-bar__home { background:var(--tst-brand); }
.tst-stat-bar__away { background:var(--surface-clay); }

/* ══ ESTADOS ══ */
.tst-hub__loading, .tst-hub__empty {
  font-family:var(--font-headline); text-align:center; padding:28px 14px;
  font-size:13px; color:var(--tst-ink-60);
  background:var(--tst-white); border:1px solid var(--tst-ink-10); border-radius:var(--radius-md);
}
.tst-hub__error-banner {
  margin:14px; padding:11px 14px; background:#FFF1F0;
  border:1px solid var(--tst-live); border-radius:var(--radius-md);
  font-family:var(--font-headline); font-size:12px; font-weight:600; color:var(--tst-live);
}

/* Breadcrumb */
.tst-breadcrumb-bar a { color:inherit; text-decoration:none; }
.tst-breadcrumb-bar a:hover { text-decoration:underline; color:var(--tst-brand); }

/* ══ TABLET 600px+ ══ */
@media (min-width:600px) {
  :root { --tst-match-w:210px; }
  .tst-hub__header { padding:22px 24px; }
  .tst-hub__header-logo-wrap { width:72px; height:72px; }
  .tst-hub__logo { width:66px; height:66px; }
  .tst-hub__name { font-size:24px; }
  .tst-hub__tab { padding:10px 8px; font-size:10px; min-width:66px; }
  .tst-tab-icon { font-size:15px; }
  .tst-hub__panel { padding:16px; }
  .tst-info-grid { grid-template-columns:repeat(auto-fill,minmax(155px,1fr)); }
  .tst-hub__competitors-grid { grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); gap:12px; }
  .tst-stats-modal { align-items:center; }
  .tst-stats-modal__box { border-radius:var(--radius-lg); max-height:80vh; }
}

/* ══ DESKTOP 768px+ ══ */
@media (min-width:768px) {
  :root { --tst-match-w:220px; }
  .tst-hub { padding:0 0 64px; }
  .tst-hub__header { padding:26px 32px; border-radius:var(--radius-lg); margin:16px 0 0; }
  .tst-hub__header-logo-wrap { width:80px; height:80px; }
  .tst-hub__logo { width:74px; height:74px; }
  .tst-hub__name { font-size:27px; }
  .tst-hub__tab { flex-direction:row; gap:6px; padding:12px 16px; font-size:11px; }
  .tst-tab-icon { font-size:14px; }
  .tst-hub__panel { padding:20px 18px; }
}

/* ══ DARK MODE ══ */
@media (prefers-color-scheme:dark) {
  :root {
    --tst-off-white: #111827; --tst-white:    #1F2937; --tst-paper:    #18212f;
    --tst-ink-100:  #F3F4F6; --tst-ink-60:   #9CA3AF; --tst-ink-30:   #4B5563; --tst-ink-10:   #374151;
    --tst-brand:    #5A9FE0; --tst-brand-light:#1e3a5f;
    --surface-hard-bg:  rgba(30,58,95,.3);
    --surface-clay-bg:  rgba(196,99,42,.15);
    --surface-grass-bg: rgba(58,125,68,.15);
  }
  .tst-bracket-header { background:#152d4a; }
  .tst-b-player--w { background:rgba(42,157,143,.12); }
}

/* ══ REDUCED MOTION ══ */
@media (prefers-reduced-motion:reduce) {
  .tst-hub *, .tst-hub *::before, .tst-hub *::after {
    animation-duration:.01ms !important; transition-duration:.01ms !important;
  }
}
