/* ============================================================
   Cartomante FC — Prováveis do Brasileirão
   Reutiliza o design system do Delivery de Dicas
   ============================================================ */

/* ===== CSS CUSTOM PROPERTIES ===== */
:root {
  --color-bg:          #FFFFFF;
  --color-surface:     #F3F0FF;
  --color-alt:         #F8FAFC;
  --color-primary:     #4D52AF;
  --color-primary-d:   #3D4290;
  --color-accent:      #F5921A;
  --color-dark:        #0F172A;
  --color-dark-purple: #2D2E6E;
  --color-text:        #1E293B;
  --color-muted:       #64748B;
  --color-border:      #E2E8F0;
  --color-white:       #FFFFFF;

  --color-pitch-1:     #2F8F3D;
  --color-pitch-2:     #266F31;
  --color-pitch-line:  rgba(255,255,255,.7);

  --color-win:         #16A34A;
  --color-draw:        #94A3B8;
  --color-loss:        #DC2626;

  --font:              'Inter', -apple-system, BlinkMacSystemFont, sans-serif;

  --section-py:        96px;
  --container-w:       1200px;
  --container-px:      24px;

  --radius-sm:         8px;
  --radius-md:         14px;
  --radius-lg:         20px;
  --radius-xl:         32px;
  --radius-full:       9999px;

  --shadow-xs:         0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
  --shadow-sm:         0 4px 6px -1px rgba(0,0,0,0.07), 0 2px 4px -1px rgba(0,0,0,0.04);
  --shadow-md:         0 10px 25px -5px rgba(0,0,0,0.08), 0 4px 10px -3px rgba(0,0,0,0.04);
  --shadow-lg:         0 20px 40px -8px rgba(0,0,0,0.12), 0 8px 16px -4px rgba(0,0,0,0.06);
  --shadow-primary:    0 8px 32px -4px rgba(77,82,175,0.30);

  --transition:        0.22s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ===== RESET ===== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; scroll-padding-top: 90px; }
body {
  font-family: var(--font);
  font-size: 16px;
  line-height: 1.6;
  color: var(--color-text);
  background: var(--color-bg);
  -webkit-font-smoothing: antialiased;
}
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }
button { font-family: inherit; cursor: pointer; border: none; background: none; }

/* ===== LAYOUT ===== */
.container {
  max-width: var(--container-w);
  margin-inline: auto;
  padding-inline: var(--container-px);
}

/* ===== BUTTONS ===== */
.btn[hidden] { display: none; }
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-family: var(--font);
  font-size: 15px;
  font-weight: 600;
  line-height: 1;
  padding: 13px 26px;
  border-radius: var(--radius-sm);
  border: 2px solid transparent;
  transition: all var(--transition);
  white-space: nowrap;
  cursor: pointer;
  text-decoration: none;
}
.btn--sm  { font-size: 13px; padding: 9px 18px; }
.btn--lg  { font-size: 17px; padding: 16px 34px; }

.btn--primary {
  background: var(--color-primary);
  color: #fff;
  border-color: var(--color-primary);
  box-shadow: 0 4px 14px rgba(77,82,175,.35);
}
.btn--primary:hover {
  background: var(--color-primary-d);
  border-color: var(--color-primary-d);
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(77,82,175,.40);
}
.btn--accent {
  background: var(--color-accent);
  color: #fff;
  border-color: var(--color-accent);
  box-shadow: 0 4px 14px rgba(245,146,26,.35);
}
.btn--accent:hover {
  filter: brightness(1.08);
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(245,146,26,.45);
}
.btn--outline {
  background: transparent;
  color: var(--color-primary);
  border-color: var(--color-primary);
}
.btn--outline:hover {
  background: var(--color-surface);
  transform: translateY(-2px);
}
.btn--white {
  background: #fff;
  color: var(--color-primary);
  border-color: #fff;
}
.btn--white:hover {
  background: #e8eaff;
  border-color: #e8eaff;
  transform: translateY(-2px);
}

/* ===== BOTÃO PUSH ===== */
.push-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--font);
  font-size: 12px;
  font-weight: 700;
  color: rgba(255,255,255,.7);
  background: rgba(255,255,255,.08);
  border: 1.5px solid rgba(255,255,255,.18);
  border-radius: var(--radius-full);
  padding: 6px 12px;
  cursor: pointer;
  transition: all var(--transition);
  white-space: nowrap;
}
.push-btn:hover { background: rgba(255,255,255,.14); color: #fff; border-color: rgba(255,255,255,.35); }
.push-btn--active {
  color: #fff;
  background: rgba(245,146,26,.18);
  border-color: rgba(245,146,26,.55);
}
.push-btn--active:hover { background: rgba(245,146,26,.28); }
.push-btn__icon { font-size: 14px; line-height: 1; }
/* botão do hero: só aparece no mobile */
.hero__push-btn { display: none !important; }
.push-btn--hidden { display: none !important; }

/* ===== HEADER ===== */
.header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: var(--color-dark-purple);
  border-bottom: 1px solid rgba(255,255,255,.08);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
.header__inner {
  display: flex;
  align-items: center;
  height: 70px;
  gap: 24px;
}
.header__logo {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}
.header__logo-img {
  height: 42px;
  width: auto;
  display: block;
}
.header__actions {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-left: auto;
}

/* ===== SECTION HEADER ===== */
.section__header {
  text-align: center;
  max-width: 640px;
  margin-inline: auto;
  margin-bottom: 56px;
}
.section__tag {
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--color-primary);
  background: rgba(77,82,175,0.10);
  padding: 5px 14px;
  border-radius: var(--radius-full);
  margin-bottom: 16px;
}
.section__tag--light {
  color: var(--color-accent);
  background: rgba(245,146,26,.15);
}
.section__title {
  font-size: clamp(28px, 4vw, 44px);
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -.02em;
  color: var(--color-dark);
  margin-bottom: 16px;
}
.section__desc {
  font-size: 18px;
  color: var(--color-muted);
  line-height: 1.7;
}

/* ============================================================
   HERO
   ============================================================ */
.hero {
  position: relative;
  overflow: hidden;
  background: var(--color-bg);
  padding-block: 80px 64px;
  min-height: 70vh;
  display: flex;
  align-items: center;
}
.hero__blob {
  position: absolute;
  top: -10%;
  right: -8%;
  width: 55%;
  aspect-ratio: 1;
  background: radial-gradient(
    ellipse at center,
    color-mix(in srgb, var(--color-accent) 15%, transparent) 0%,
    color-mix(in srgb, var(--color-surface) 55%, transparent) 50%,
    transparent 75%
  );
  border-radius: 50% 60% 40% 70% / 50% 40% 60% 50%;
  pointer-events: none;
  animation: blobFloat 8s ease-in-out infinite;
}
@keyframes blobFloat {
  0%,100% { transform: translate(0, 0) rotate(0deg); }
  33%      { transform: translate(16px, -24px) rotate(8deg); }
  66%      { transform: translate(-12px, 12px) rotate(-5deg); }
}
.hero__inner {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 48px;
  align-items: center;
  text-align: left;
}
.hero__content {
  display: flex;
  flex-direction: column;
  gap: 28px;
  align-items: flex-start;
  max-width: 680px;
}
.hero__visual {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.hero__visual-logo {
  height: 280px;
  width: auto;
  opacity: .92;
  filter: drop-shadow(0 8px 32px rgba(77,82,175,.35));
}
.hero__badge {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  font-weight: 600;
  color: var(--color-primary-d);
  background: var(--color-surface);
  border: 1px solid #BBF7D0;
  padding: 8px 16px;
  border-radius: var(--radius-full);
  width: fit-content;
}
.hero__badge--fechado {
  border-color: #CBD5E1;
  color: #64748B;
}
.hero__badge-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #16D465;
  animation: pulse 2s infinite;
}
.hero__badge--fechado .hero__badge-dot {
  background: #94A3B8;
  animation: none;
}
@keyframes pulse {
  0%,100% { opacity: 1; transform: scale(1); }
  50%     { opacity: 0.6; transform: scale(0.85); }
}
.hero__title {
  font-size: clamp(18px, 2.5vw, 32px);
  font-weight: 900;
  line-height: 1.05;
  letter-spacing: -.02em;
  color: var(--color-dark);
}
.hero__title-accent { color: var(--color-primary); }

#openAppBanner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 16px;
  background: var(--color-accent);
  color: #fff;
  text-decoration: none;
  font-size: 14px;
  font-weight: 600;
}
#openAppBanner .open-app__text { flex: 1; }
#openAppBanner .open-app__text strong { font-weight: 800; }
#openAppBanner .open-app__cta {
  background: rgba(0,0,0,.15);
  padding: 6px 14px;
  border-radius: 20px;
  font-weight: 700;
  font-size: 13px;
}
.hero__seo {
  font-size: 12px;
  color: #6B7280;
  line-height: 1.5;
  max-width: 680px;
  margin-bottom: 4px;
}
.hero__sub {
  font-size: 18px;
  color: var(--color-muted);
  line-height: 1.65;
  max-width: 600px;
}
.hero__meta {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  width: 100%;
  align-items: stretch;
  max-width: 720px;
  margin-block: 8px;
}
.hero-stat {
  background: var(--color-alt);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: 14px 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: center;
}
.hero-stat__value {
  font-size: clamp(26px, 3.5vw, 42px);
  font-weight: 900;
  color: var(--color-primary);
  line-height: 1;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  text-align: center;
}
.hero-stat__label {
  font-size: 11px;
  color: var(--color-muted);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .04em;
  text-align: center;
  width: 100%;
}
.hero__ctas {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  justify-content: flex-start;
}

/* ============================================================
   FAIXA DE CLUBES
   ============================================================ */
.clubes-bar {
  padding-block: var(--section-py);
  background: var(--color-surface);
}
.clubes-bar__scroll {
  margin-inline: calc(var(--container-px) * -1);
  padding-inline: var(--container-px);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.clubes-bar__scroll::-webkit-scrollbar { display: none; }
.clubes-bar__list {
  display: grid;
  grid-template-columns: repeat(10, minmax(96px, 1fr));
  gap: 12px;
  min-width: max-content;
  margin-inline: auto;
  max-width: var(--container-w);
}
.clubes-bar__loading {
  grid-column: 1 / -1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  padding: 32px 0;
  color: var(--color-muted);
  font-size: 14px;
}

.club-chip {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 14px 8px;
  background: var(--color-white);
  border: 1.5px solid var(--color-border);
  border-radius: var(--radius-md);
  cursor: pointer;
  transition: all var(--transition);
  text-align: center;
  font-family: inherit;
}
.club-chip:hover {
  border-color: var(--color-primary);
  transform: translateY(-3px);
  box-shadow: var(--shadow-md);
}
.club-chip:active {
  transform: translateY(-1px);
}
.club-chip__shield {
  width: 52px;
  height: 52px;
  object-fit: contain;
  filter: drop-shadow(0 2px 4px rgba(0,0,0,.08));
  transition: transform var(--transition);
}
.club-chip:hover .club-chip__shield {
  transform: scale(1.06);
}
.club-chip__abbr {
  font-size: 11px;
  font-weight: 800;
  color: var(--color-text);
  letter-spacing: .04em;
}

/* ============================================================
   CONFRONTOS — section
   ============================================================ */
.confrontos {
  padding-block: var(--section-py);
  background: linear-gradient(135deg, var(--color-dark) 0%, var(--color-dark-purple) 50%, var(--color-dark) 100%);
}
.confrontos .section__title { color: #fff; }
.confrontos .section__desc { color: rgba(255,255,255,.65); }

.confrontos__loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  padding: 64px 0;
  color: rgba(255,255,255,.55);
}
.confrontos__error {
  text-align: center;
  padding: 64px 0;
  color: rgba(255,255,255,.7);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}
.confrontos__error p { font-size: 16px; }
.confrontos__error .btn--outline {
  color: rgba(255,255,255,.85);
  border-color: rgba(255,255,255,.3);
}
.confrontos__error .btn--outline:hover {
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.5);
}

.catalogo__spinner {
  width: 32px;
  height: 32px;
  border: 3px solid rgba(15,23,42,.15);
  border-top-color: var(--color-primary);
  border-radius: 50%;
  animation: spin .8s linear infinite;
}
.catalogo__spinner--light {
  border: 3px solid rgba(255,255,255,.15);
  border-top-color: #8B93FF;
}
@keyframes spin { to { transform: rotate(360deg); } }

.confrontos__list {
  display: flex;
  flex-direction: column;
  gap: 32px;
}

/* ===== CONFRONTO CARD ===== */
.confronto {
  background: rgba(15,23,42,.55);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: var(--radius-lg);
  overflow: hidden;
  scroll-margin-top: 90px;
  transition: border-color var(--transition), box-shadow var(--transition);
}
.confronto.is-target {
  border-color: rgba(245,146,26,.6);
  box-shadow: 0 0 0 3px rgba(245,146,26,.18), 0 16px 40px rgba(0,0,0,.3);
}

/* ===== CABEÇALHO DO CONFRONTO ===== */
.confronto__header {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  grid-template-rows: auto auto;
  grid-template-areas:
    "rodada center date"
    "rodada center local";
  gap: 2px 24px;
  padding: 14px 24px;
  background: rgba(255,255,255,.04);
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.confronto__header-rodada {
  grid-area: rodada;
  display: flex;
  align-items: center;
  align-self: center;
  gap: 8px;
}
.confronto__header-center {
  grid-area: center;
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: center;
}
.confronto__header-date {
  grid-area: date;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  align-self: end;
  gap: 6px;
  font-size: 12px;
  font-weight: 500;
  color: rgba(255,255,255,.6);
}
.confronto__header-local {
  grid-area: local;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  align-self: start;
  gap: 6px;
  font-size: 12px;
  font-weight: 500;
  color: rgba(255,255,255,.6);
}
.confronto__header-date svg,
.confronto__header-local svg {
  color: rgba(255,255,255,.4);
  flex-shrink: 0;
}
.confronto__score {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 32px;
  font-weight: 900;
  color: #fff;
  letter-spacing: -0.02em;
  line-height: 1;
  white-space: nowrap;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 14px;
  padding: 6px 20px;
}
.confronto__score--live {
  color: #FF6B6B;
  background: rgba(220,38,38,.15);
  border-color: rgba(220,38,38,.4);
}
.confronto__rodada-tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--color-accent);
  background: rgba(245,146,26,.12);
  padding: 4px 10px;
  border-radius: var(--radius-full);
}
.confronto__transmissao {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: rgba(255,255,255,.85);
  font-weight: 600;
}

/* ===== CORPO: CAMPINHOS LADO A LADO ===== */
.confronto__pitches {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 12px;
  padding: 24px;
  align-items: stretch;
}
.confronto__live-tracker {
  display: none;
}
.confronto__live-tracker.is-visible {
  display: block;
}

/* ===== Botão AO VIVO no header ===== */
.btn-live-tracker {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: #DC2626;
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .05em;
  padding: 3px 10px 3px 7px;
  border-radius: 20px;
  border: none;
  cursor: pointer;
  transition: background .15s;
  line-height: 1;
}
.btn-live-tracker:hover { background: #B91C1C; }
.btn-live-tracker.is-active { background: #1D4ED8; }
.btn-live-tracker.is-active:hover { background: #1E40AF; }

/* ===== Score inline (live dot) ===== */
.confronto__score .confronto__live-dot {
  width: 10px;
  height: 10px;
}

/* ===== Score no campinho ===== */
.pitch-player__pts {
  display: none;
  font-size: 10px;
  font-weight: 800;
  line-height: 1.3;
  color: #fff;
}
.confronto__pitches.has-pts .pitch-player__pts--loaded {
  display: inline-block;
  background: rgba(0,0,0,.8);
  border: 1px solid rgba(255,255,255,.25);
  border-radius: 5px;
  padding: 2px 6px;
  font-size: 20px;
}
.pitch-player__pts--neg {
  color: #FCA5A5;
  background: rgba(220,38,38,.35) !important;
  border-color: rgba(220,38,38,.5) !important;
}

/* ── Scout icons ao vivo (gol, assist, cartões) ────────────────────────── */
.pitch-player__slive {
  position: absolute;
  top: -10px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 1px;
  z-index: 4;
  pointer-events: none;
  background: rgba(0,0,0,.72);
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 6px;
  padding: 2px 4px;
  white-space: nowrap;
}
.slive {
  font-size: 12px;
  line-height: 1;
}

/* ── Tooltip de scouts ao vivo ───────────────────────────────────────────── */
.pitch-scout-tip {
  position: fixed;
  z-index: 9999;
  background: #1e1e2e;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 10px;
  padding: 10px 12px;
  min-width: 170px;
  max-width: 230px;
  box-shadow: 0 8px 24px rgba(0,0,0,.5);
  pointer-events: none;
  opacity: 0;
  transform: translateY(4px);
  transition: opacity .12s, transform .12s;
}
.pitch-scout-tip.is-visible {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.pitch-scout-tip__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
  padding-bottom: 6px;
  border-bottom: 1px solid rgba(255,255,255,.1);
}
.pitch-scout-tip__nome-head {
  font-size: 12px;
  font-weight: 700;
  color: #fff;
}
.pitch-scout-tip__pts {
  font-size: 12px;
  font-weight: 800;
  color: #4ade80;
}
.pitch-scout-tip__pts--neg { color: #fca5a5; }
.pitch-scout-tip__list { display: flex; flex-direction: column; gap: 4px; }
.pitch-scout-tip__row {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: rgba(255,255,255,.85);
}
.pitch-scout-tip__icon { font-size: 13px; line-height: 1; flex-shrink: 0; }
.pitch-scout-tip__nome { flex: 1; }
.pitch-scout-tip__cnt {
  font-weight: 700;
  color: #fff;
  flex-shrink: 0;
}
.pitch-scout-tip__empty {
  font-size: 11px;
  color: rgba(255,255,255,.45);
  margin: 0;
  text-align: center;
}
/* Botão Scouts Check no popup — mesmo estilo do "Mais informações" do team-detail */
.pitch-scout-tip__check-btn {
  margin-top: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-family: inherit;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .5px;
  color: rgba(255,255,255,.9);
  background: rgba(77,82,175,.18);
  border: 1.5px solid rgba(77,82,175,.35);
  border-radius: var(--radius-sm);
  padding: 9px 14px;
  text-decoration: none;
  cursor: pointer;
  transition: all var(--transition);
}
.pitch-scout-tip__check-btn:hover {
  background: var(--color-primary);
  border-color: var(--color-primary);
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(77,82,175,.35);
}
.pitch-scout-tip__check-btn svg { color: rgba(255,255,255,.7); }
.pitch-scout-tip__check-btn:hover svg { color: #fff; }

/* Quando jogo em andamento/encerrado: ocultar badges estáticos de ranking */
.confronto__pitches.has-pts .pitch-player__escalado,
.confronto__pitches.has-pts .pitch-player__thermo-wrap,
.confronto__pitches.has-pts .pitch-player__medal-wrap,
.confronto__pitches.has-pts .pitch-player__valorizar-wrap,
.confronto__pitches.has-pts .pitch-player__alert {
  display: none;
}

/* Quando há entraram em campo, ocultar análise pré-jogo */
.team-detail.has-entraram .team-detail__sources,
.team-detail.has-entraram .team-detail__sources--empty,
.team-detail.has-entraram .team-detail__just,
.team-detail.has-entraram .team-detail__violacoes,
.team-detail.has-entraram .team-detail__more-btn { display: none; }

/* ===== Jogadores que entraram em campo ===== */
.team-detail__entraram {
  border-top: 1px solid rgba(255,255,255,.07);
  padding-top: 12px;
}
.team-detail__entraram-label {
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: rgba(255,255,255,.35);
  margin-bottom: 8px;
}
.team-detail__entraram-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.entraram-player {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  text-align: center;
  cursor: default;
}
.entraram-player__avatar-wrap {
  position: relative;
  display: inline-flex;
}
.entraram-player__avatar-wrap .pitch-player__slive {
  top: -8px;
  font-size: 11px;
  padding: 1px 3px;
}
.entraram-player__avatar-wrap .slive { font-size: 11px; }
.entraram-player__photo {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  object-fit: cover;
  background: rgba(255,255,255,.85);
  border: 2px solid rgba(255,255,255,.15);
  display: block;
}
.entraram-player__photo--placeholder {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: 800;
  color: var(--color-primary-d);
}
.entraram-player__name {
  font-size: 10px;
  font-weight: 700;
  color: rgba(255,255,255,.75);
  max-width: 58px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  line-height: 1.1;
}
.entraram-player__pts {
  font-size: 20px;
  font-weight: 800;
  color: #fff;
  background: rgba(0,0,0,.55);
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 4px;
  padding: 2px 6px;
  line-height: 1.3;
}
.entraram-player__pts--neg {
  color: #FCA5A5;
  background: rgba(220,38,38,.35);
  border-color: rgba(220,38,38,.4);
}

/* ===== Live badge no header ===== */
.confronto__live-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #DC2626;
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  padding: 2px 10px 2px 8px;
  border-radius: 20px;
}
.confronto__live-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #fff;
  animation: livePulse 1.2s ease-in-out infinite;
}
@keyframes livePulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%       { opacity: .4; transform: scale(.7); }
}

/* ===== Live Tracker ===== */
.live-tracker {
  background: #0f172a;
  border-radius: 0 0 12px 12px;
  overflow: hidden;
}
.live-tracker__iframe {
  display: block;
  width: 100%;
  height: 580px;
  border: none;
  background: #0f172a;
}

/* ===== Hero live link ===== */
.hero-live-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #EF4444;
  font-size: clamp(14px, 2.5vw, 20px);
  font-weight: 800;
  text-decoration: none;
  animation: livePulse 1.4s ease-in-out infinite;
}
.hero-live-link:hover { color: #DC2626; }

.confronto__vs {
  position: relative;
  align-self: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 0 12px;
}
.confronto__vs-label {
  font-size: 11px;
  font-weight: 800;
  color: rgba(255,255,255,.5);
  letter-spacing: .08em;
  text-transform: uppercase;
}
.confronto__vs-x {
  font-size: 28px;
  font-weight: 900;
  color: rgba(255,255,255,.85);
  line-height: 1;
}

/* ===== Modo desenho ===== */
.draw-toggle {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  margin-top: 4px;
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 50%;
  color: rgba(255,255,255,.7);
  cursor: pointer;
  transition: all .15s ease;
}
.draw-toggle:hover {
  background: rgba(255,255,255,.18);
  color: #fff;
}
.draw-toggle.is-active {
  background: var(--color-accent);
  border-color: var(--color-accent);
  color: #fff;
}
.draw-popup {
  position: absolute;
  top: 36px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 100;
  display: none;
  flex-direction: column;
  gap: 10px;
  padding: 12px;
  background: #1a1b3a;
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0,0,0,.4);
  min-width: 180px;
}
.draw-popup.is-open { display: flex; }
.draw-popup__row {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: rgba(255,255,255,.85);
}
.draw-popup__row label { flex: 0 0 auto; min-width: 50px; }
.draw-popup__row input[type="color"] {
  width: 36px;
  height: 28px;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 6px;
  background: transparent;
  cursor: pointer;
  padding: 0;
}
.draw-popup__row input[type="range"] { flex: 1; }
.draw-popup__width-preview {
  display: inline-block;
  width: 24px;
  text-align: right;
  font-weight: 700;
}
.draw-popup__btn {
  padding: 6px 10px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 6px;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}
.draw-popup__btn:hover { background: rgba(255,255,255,.15); }
.draw-popup__btn--danger { background: rgba(220,38,38,.2); border-color: rgba(220,38,38,.4); }
.draw-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 30;
  cursor: crosshair;
  pointer-events: none;
}
.confronto__pitches.is-drawing-mode .draw-canvas { pointer-events: auto; }

/* ===== TIME SIDE (cabeçalho do clube + campinho) ===== */
.team-side {
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
}
.team-side__header {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--radius-md);
}
.team-side__header--away { flex-direction: row-reverse; text-align: right; }

/* ──── Histórico do confronto (botão + painel expansível) ──── */
.confronto__history-btn {
  margin-left: auto;
  width: 30px; height: 30px;
  display: inline-flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 8px;
  color: rgba(255,255,255,.7);
  cursor: pointer;
  flex-shrink: 0;
  transition: background .15s, color .15s, border-color .15s;
}
.team-side__header--away .confronto__history-btn { margin-left: 0; margin-right: auto; }
.confronto__history-btn:hover { background: rgba(245,146,26,.18); color: var(--color-accent); border-color: var(--color-accent); }

.team-side__history {
  margin: 10px 0 4px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.confronto__header-history {
  grid-column: 1 / -1;
  margin-top: 10px;
}
.confronto__history-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}
@media (max-width: 720px) { .confronto__history-grid { grid-template-columns: 1fr; } }
.confronto__history-card {
  background: rgba(0,0,0,.18);
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 8px;
  padding: 12px;
}
.confronto__history-h {
  font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em;
  color: rgba(255,255,255,.55); margin: 0 0 10px;
}
.confronto__history-bar {
  display: flex; height: 28px; border-radius: 6px; overflow: hidden;
  background: rgba(255,255,255,.06);
}
.confronto__history-bar-seg {
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-size: 12px; font-weight: 700;
  min-width: 28px;
}
.confronto__history-bar-seg--m { background: #6D5BFF; }
.confronto__history-bar-seg--e { background: #6B7280; }
.confronto__history-bar-seg--v { background: var(--color-accent); }
.confronto__history-legend {
  display: flex; gap: 12px; font-size: 11px; color: rgba(255,255,255,.6);
  margin-top: 8px; flex-wrap: wrap;
}
.confronto__history-legend i {
  display: inline-block; width: 10px; height: 10px; border-radius: 2px;
  vertical-align: middle; margin-right: 4px;
}
.confronto__history-dot--m { background: #6D5BFF; }
.confronto__history-dot--e { background: #6B7280; }
.confronto__history-dot--v { background: var(--color-accent); }

.confronto__history-games { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 6px; }
.confronto__history-game {
  display: grid;
  grid-template-columns: 56px 22px auto 22px;
  justify-content: start;
  align-items: center; gap: 6px;
  font-size: 12px;
}
.confronto__history-game-rdd { color: rgba(255,255,255,.5); font-weight: 600; }
.confronto__history-game-shield { width: 22px; height: 22px; object-fit: contain; }
.confronto__history-game-placar { color: #fff; font-weight: 700; text-align: center; }
.confronto__history-games-split { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.confronto__history-col-h {
  font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em;
  color: rgba(255,255,255,.5); text-align: center; margin-bottom: 8px;
}
@media (max-width: 480px) {
  .confronto__history-games-split { grid-template-columns: 1fr; gap: 8px; }
}

.confronto__history-loading,
.confronto__history-error,
.confronto__history-empty {
  text-align: center; padding: 18px; color: rgba(255,255,255,.55); font-size: 13px;
}
.confronto__history-error { color: #fca5a5; }
.confronto__history-retry {
  margin-left: 8px; padding: 4px 10px; font-size: 12px; font-weight: 700;
  background: rgba(245,146,26,.18); color: var(--color-accent);
  border: 1px solid var(--color-accent); border-radius: 6px; cursor: pointer;
}
.team-side__total-pts {
  margin-left: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 8px;
  padding: 5px 10px;
  flex-shrink: 0;
}
.team-side__total-pts__value {
  font-size: 20px;
  font-weight: 900;
  color: #fff;
  line-height: 1;
  letter-spacing: -.02em;
}
.team-side__total-pts__label {
  font-size: 9px;
  font-weight: 700;
  color: rgba(255,255,255,.45);
  text-transform: uppercase;
  letter-spacing: .06em;
  line-height: 1;
}
.team-side__shield-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 4px;
  border-radius: 50%;
  background: rgba(255,255,255,.04);
  border: 1.5px solid rgba(245,146,26,.35);
  transition: background .18s, border-color .18s, transform .18s, box-shadow .18s;
  cursor: pointer;
  flex-shrink: 0;
  text-decoration: none;
}
.team-side__shield-link:hover {
  background: rgba(245,146,26,.18);
  border-color: var(--color-accent);
  transform: scale(1.08);
  box-shadow: 0 0 12px rgba(245,146,26,.45);
}
.team-side__shield-link:active { transform: scale(0.98); }
body.is-copa .team-side__shield-link { border-color: rgba(200,40,52,.45); }
body.is-copa .team-side__shield-link:hover { background: rgba(200,40,52,.18); border-color: var(--copa-red); box-shadow: 0 0 12px rgba(200,40,52,.5); }
.team-side__shield {
  width: 44px;
  height: 44px;
  object-fit: contain;
  flex-shrink: 0;
}
.team-side__info {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  flex: 1;
}
.team-side__name {
  font-size: 15px;
  font-weight: 800;
  color: #fff;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.team-side__sub {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  color: rgba(255,255,255,.55);
  flex-wrap: wrap;
}
.team-side__header--away .team-side__sub { justify-content: flex-end; }
.team-side__pos {
  font-weight: 700;
  color: rgba(255,255,255,.75);
}
.team-side__form {
  display: inline-flex;
  gap: 3px;
}
.form-dot {
  width: 14px;
  height: 14px;
  border-radius: 4px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 9px;
  font-weight: 800;
  color: #fff;
  text-transform: uppercase;
}
.form-dot--v { background: var(--color-win); }
.form-dot--e { background: var(--color-draw); }
.form-dot--d { background: var(--color-loss); }

/* ============================================================
   TOGGLE DO CAMPINHO
   ============================================================ */
.pitch-wrap {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.pitch-toggle-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 4px;
}
.pitch-toggle {
  display: flex;
  align-self: center;
  background: rgba(0, 0, 0, 0.18);
  border-radius: 20px;
  padding: 3px;
  gap: 2px;
}
.pitch-mirror-btn {
  background: rgba(0,0,0,0.18);
  border: none;
  border-radius: 50%;
  color: rgba(255,255,255,0.6);
  cursor: pointer;
  font-size: 1rem;
  width: 28px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.15s, color 0.15s;
  flex-shrink: 0;
}
.pitch-mirror-btn:hover { color: #fff; }
.pitch-mirror-btn--active {
  background: var(--color-accent);
  color: #fff;
}

.pitch-toggle__btn {
  background: transparent;
  border: none;
  border-radius: 16px;
  color: rgba(255, 255, 255, 0.6);
  cursor: pointer;
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.03em;
  padding: 3px 10px;
  transition: background 0.15s, color 0.15s;
}

.pitch-toggle__btn:hover {
  color: rgba(255, 255, 255, 0.9);
}

.pitch-toggle__btn--active {
  background: var(--color-accent);
  color: #fff;
}

/* ============================================================
   CAMPINHO (PITCH)
   ============================================================ */
.pitch {
  position: relative;
  aspect-ratio: 68 / 105;
  width: 100%;
  max-width: 440px;
  margin-inline: auto;
  background: linear-gradient(180deg,
      var(--color-pitch-1) 0%,
      var(--color-pitch-2) 50%,
      var(--color-pitch-1) 100%);
  border-radius: var(--radius-md);
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.18), 0 12px 32px rgba(0,0,0,.35);
}
.pitch::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    repeating-linear-gradient(
      0deg,
      transparent 0,
      transparent calc(100% / 12),
      rgba(255,255,255,.04) calc(100% / 12),
      rgba(255,255,255,.04) calc(200% / 12)
    );
  pointer-events: none;
}
.pitch__lines {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.pitch__esquema {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 2;
  font-size: 10px;
  font-weight: 800;
  color: #fff;
  background: rgba(0,0,0,.5);
  padding: 3px 8px;
  border-radius: var(--radius-full);
  letter-spacing: .04em;
}
.pitch__rows {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 12px 8px 42px;
  z-index: 1;
}
.pitch__row {
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  gap: 4px;
}

.pitch-player {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  flex: 0 0 auto;
  max-width: 22%;
  text-align: center;
  cursor: grab;
  user-select: none;
}
.pitch-player.is-dragging {
  opacity: 0.25;
  cursor: grabbing;
}
.pitch-player.is-dragging-free {
  cursor: grabbing;
  z-index: 50;
  filter: drop-shadow(0 6px 12px rgba(0,0,0,.5));
  transform: scale(1.08);
  transition: transform 0.12s ease;
}
.pitch-player.is-drop-target .pitch-player__photo {
  outline: 2.5px dashed rgba(255,255,255,0.9);
  outline-offset: 3px;
  transform: scale(1.15);
  transition: transform 0.12s ease;
}

/* ── Modo Scouts ─────────────────────────────────────────────── */
.pitch--scouts .pitch__scouts-layer,
.pitch--ia .pitch__ia-layer {
  position: absolute;
  inset: 0;
}
/* Heatmap overlay (só na aba IA) — mesma escala do _renderCampinhoConquistado em jogador-html.js */
.pitch--ia .pitch__ia-heatmap {
  position: absolute;
  inset: 0;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  grid-template-rows: repeat(6, 1fr);
  pointer-events: none;
  opacity: 0;
  transition: opacity .15s ease;
  z-index: 5;
}
.pitch--ia .pitch__ia-heatmap.is-visible { opacity: 1; }
.pitch--ia .pitch__ia-heatmap-cell {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 800;
  color: #fff;
  text-shadow: 0 1px 2px rgba(0,0,0,.6);
  border: 1px solid rgba(255,255,255,.04);
}
.pitch-player--scouts,
.pitch-player--ia {
  position: absolute;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  text-align: center;
  max-width: none;
  flex: none;
  z-index: 10;
}
.pitch--scouts .pitch-player__photo {
  width: 48px;
  height: 48px;
}
.pitch--scouts .pitch-player__photo--placeholder {
  font-size: 14px;
}
.pitch--scouts .pitch-player__name {
  font-size: 11px;
  max-width: 64px;
}
/* IA usa os mesmos tamanhos do default (.pitch-player__photo etc.) — sem overrides aqui
   pra mobile reduzir junto com as outras abas via @media. */
.pitch-player__avatar-wrap {
  position: relative;
  display: inline-flex;
  transition: transform .18s ease, filter .18s ease;
}
.pitch-player.is-pinned { z-index: 6; }
.pitch-player.is-pinned .pitch-player__avatar-wrap {
  transform: scale(1.18);
  filter: drop-shadow(0 0 6px rgba(245,146,26,.95)) drop-shadow(0 0 14px rgba(245,146,26,.7));
}
.pitch-player.is-pinned .pitch-player__name {
  color: #F5921A;
  font-weight: 800;
  text-shadow: 0 0 6px rgba(0,0,0,.8);
}
body.is-copa .pitch-player.is-pinned .pitch-player__avatar-wrap {
  filter: drop-shadow(0 0 6px rgba(200,40,52,.95)) drop-shadow(0 0 14px rgba(200,40,52,.7));
}
body.is-copa .pitch-player.is-pinned .pitch-player__name { color: var(--copa-red); }
.pitch-player__escalado {
  position: absolute;
  bottom: -4px;
  left: -4px;
  font-size: 11px;
  line-height: 1;
  z-index: 2;
  cursor: default;
  filter: drop-shadow(0 1px 1px rgba(0,0,0,.5));
}
.player-card__escalado {
  position: static;
  font-size: 13px;
  cursor: default;
  filter: none;
  vertical-align: middle;
}
.pitch-player__medal-wrap {
  position: absolute;
  top: -4px;
  left: -4px;
  cursor: default;
  z-index: 2;
  line-height: 1;
  filter: drop-shadow(0 1px 2px rgba(0,0,0,.6));
}
.pitch-player__medal { display: block; }
.player-card__medal-wrap {
  position: static;
  display: inline-flex;
  vertical-align: middle;
  cursor: default;
  margin-left: 2px;
}
.src-tooltip--medal .src-tooltip__badge { color: #1e1e2e; background: var(--medal-color, #FFD700); }
.src-tooltip--medal .src-tooltip__body strong { color: var(--medal-color, #FFD700); }
.pitch-player__valorizar-wrap {
  position: absolute;
  top: -4px;
  right: -4px;
  cursor: default;
  z-index: 2;
  line-height: 1;
  filter: drop-shadow(0 1px 2px rgba(0,0,0,.6));
}
.pitch-player__valorizar { display: block; }
.src-tooltip--valorizar .src-tooltip__badge { color: #1e1e2e; background: var(--valorizar-color, #FFD700); }
.src-tooltip--valorizar .src-tooltip__body strong { color: var(--valorizar-color, #FFD700); }
.pitch-player__thermo-wrap {
  position: absolute;
  bottom: -4px;
  right: -4px;
  cursor: default;
  z-index: 2;
  line-height: 1;
  filter: drop-shadow(0 1px 1px rgba(0,0,0,.5));
}
.pitch-player__thermo { display: block; }
.player-card__thermo-wrap {
  position: static;
  display: inline-flex;
  vertical-align: middle;
  cursor: default;
  filter: none;
  margin-left: 2px;
}
.pitch-player__alert {
  position: absolute;
  top: -8px;
  left: 50%;
  transform: translateX(-50%);
  width: 17px;
  height: 17px;
  background: #F59E0B;
  border: 2px solid rgba(0,0,0,.45);
  border-radius: 50%;
  font-size: 11px;
  font-weight: 900;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  z-index: 3;
  cursor: default;
}

.pitch-player__photo {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: rgba(255,255,255,.85);
  border: 2px solid #fff;
  object-fit: cover;
  box-shadow: 0 3px 8px rgba(0,0,0,.3);
}
.pitch-player__photo--placeholder {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  font-weight: 800;
  color: var(--color-primary-d);
}
.pitch-player__name {
  font-size: 12px;
  font-weight: 700;
  color: #fff;
  line-height: 1.1;
  text-shadow: 0 1px 3px rgba(0,0,0,.7);
  max-width: 96px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* ===== CARD DETALHE (abaixo dos campinhos) ===== */
.confronto__details {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  padding: 0 24px 24px;
}
.team-detail {
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--radius-md);
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.team-detail__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
}
.team-detail__title {
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: rgba(255,255,255,.55);
}
.team-detail__analise-em {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  font-weight: 500;
  color: rgba(255,255,255,.38);
  margin-left: auto;
  white-space: nowrap;
}
.team-detail__analise-em svg {
  flex-shrink: 0;
  opacity: .7;
}
.team-detail__esquema {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 700;
  color: var(--color-accent);
  background: rgba(245,146,26,.1);
  padding: 4px 10px;
  border-radius: var(--radius-full);
  width: fit-content;
}

/* Linha 1: top 3 fontes */
.team-detail__sources {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}
.team-detail__sources--empty {
  font-size: 12px;
  color: rgba(255,255,255,.45);
  padding: 10px 12px;
  background: rgba(255,255,255,.03);
  border: 1px dashed rgba(255,255,255,.12);
  border-radius: 8px;
  text-align: center;
}
.source-thumb {
  display: flex;
  flex-direction: column;
  gap: 0;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px;
  overflow: hidden;
  color: inherit;
  text-decoration: none;
  transition: transform var(--transition), border-color var(--transition), background var(--transition);
}
.source-thumb:hover {
  transform: translateY(-2px);
  background: rgba(255,255,255,.07);
  border-color: rgba(139,147,255,.45);
}
.source-thumb__img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  background: rgba(0,0,0,.4);
  display: block;
}
.source-thumb__img--placeholder {
  background: linear-gradient(135deg, rgba(77,82,175,.35), rgba(245,146,26,.25));
}
.source-thumb__body {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 8px 10px 10px;
}
.source-thumb__source {
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--color-accent);
}
.source-thumb__title {
  font-size: 11px;
  font-weight: 600;
  color: rgba(255,255,255,.85);
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Linha 2: justificativa */
.team-detail__just {
  font-size: 12.5px;
  color: rgba(255,255,255,.72);
  line-height: 1.55;
  padding: 10px 12px;
  background: rgba(77,82,175,.08);
  border-left: 3px solid rgba(139,147,255,.5);
  border-radius: 4px 8px 8px 4px;
}
.team-detail__just--empty {
  color: rgba(255,255,255,.4);
  font-style: italic;
  border-left-color: rgba(255,255,255,.15);
  background: rgba(255,255,255,.03);
}

/* Linha 3: violações */
.team-detail__violacoes {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.violacao {
  display: flex;
  gap: 6px;
  font-size: 11.5px;
  color: #FBBF24;
  background: rgba(251,191,36,.08);
  border: 1px solid rgba(251,191,36,.18);
  padding: 8px 10px;
  border-radius: 6px;
  line-height: 1.4;
}
.violacao::before {
  content: '⚠';
  flex-shrink: 0;
}
.violacao--ok {
  color: #16D465;
  background: rgba(22,212,101,.06);
  border-color: rgba(22,212,101,.18);
}
.violacao--ok::before { content: '✓'; }

/* Linha 4: botão mais informações */
.team-detail__more-btn {
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-family: inherit;
  font-size: 13px;
  font-weight: 700;
  color: rgba(255,255,255,.9);
  background: rgba(77,82,175,.18);
  border: 1.5px solid rgba(77,82,175,.35);
  border-radius: var(--radius-sm);
  padding: 11px 16px;
  cursor: pointer;
  transition: all var(--transition);
}
.team-detail__more-btn:hover {
  background: var(--color-primary);
  border-color: var(--color-primary);
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(77,82,175,.35);
}
.team-detail__more-btn svg { color: rgba(255,255,255,.7); }
.team-detail__more-btn:hover svg { color: #fff; }

/* ============================================================
   MODAL — detalhes por jogador
   ============================================================ */
.modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,0);
  backdrop-filter: blur(0px);
  -webkit-backdrop-filter: blur(0px);
  transition: background .3s ease, backdrop-filter .3s ease;
  padding: 24px;
}
.modal-overlay.is-visible {
  background: rgba(0,0,0,.7);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.modal-box {
  position: relative;
  width: 100%;
  max-width: 720px;
  max-height: calc(100vh - 48px);
  display: flex;
  flex-direction: column;
  background: var(--color-dark);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: var(--radius-lg);
  overflow: hidden;
  opacity: 0;
  transform: translateY(24px) scale(.96);
  transition: opacity .3s ease, transform .3s ease;
  box-shadow: 0 32px 80px rgba(0,0,0,.55);
}
.modal-overlay.is-visible .modal-box {
  opacity: 1;
  transform: translateY(0) scale(1);
}
.modal-box__close {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: rgba(255,255,255,.55);
  background: rgba(255,255,255,.06);
  border: none;
  border-radius: 50%;
  cursor: pointer;
  transition: all var(--transition);
}
.modal-box__close:hover {
  color: #fff;
  background: rgba(255,255,255,.14);
}
.modal-box__head {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 20px 60px 18px 22px;
  background: linear-gradient(135deg, var(--color-dark-purple), rgba(15,23,42,.9));
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.modal-box__shield {
  width: 48px;
  height: 48px;
  object-fit: contain;
  flex-shrink: 0;
}
.modal-box__title {
  font-size: 20px;
  font-weight: 800;
  color: #fff;
  line-height: 1.2;
}
.modal-box__subtitle {
  font-size: 12px;
  color: rgba(255,255,255,.6);
  margin-top: 2px;
}
.modal-box__subtitle strong { color: var(--color-accent); font-weight: 700; }

.modal-box__body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  padding: 18px 22px 22px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.2) transparent;
}
.modal-box__head { flex-shrink: 0; }
.modal-box__body::-webkit-scrollbar { width: 8px; }
.modal-box__body::-webkit-scrollbar-thumb {
  background: rgba(255,255,255,.14);
  border-radius: 4px;
}
.modal-box__empty {
  color: rgba(255,255,255,.5);
  font-size: 14px;
  padding: 20px;
  text-align: center;
}
.modal-box__notice {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 14px;
  background: rgba(245,146,26,.08);
  border: 1px solid rgba(245,146,26,.25);
  border-radius: var(--radius-md);
  font-size: 13px;
  line-height: 1.5;
  color: rgba(255,255,255,.85);
}
.modal-box__notice svg {
  color: var(--color-accent);
  flex-shrink: 0;
  margin-top: 1px;
}

.player-card {
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--radius-md);
  flex-shrink: 0;
}
.player-card__head {
  display: flex;
  align-items: center;
  gap: 12px;
  overflow: hidden; /* clip da foto nas bordas arredondadas */
  border-radius: var(--radius-md) var(--radius-md) 0 0;
  padding: 12px 14px;
  background: rgba(255,255,255,.04);
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.player-card__photo-wrap {
  flex-shrink: 0;
}
.player-card__photo {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  object-fit: cover;
  background: rgba(255,255,255,.9);
  border: 2px solid rgba(255,255,255,.2);
}
.player-card__photo--placeholder {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 800;
  color: var(--color-primary-d);
}
.player-card__info {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.player-card__pos {
  font-size: 10px;
  font-weight: 800;
  color: rgba(139,147,255,.95);
  background: rgba(77,82,175,.2);
  padding: 2px 7px;
  border-radius: 4px;
  width: fit-content;
  letter-spacing: .04em;
}
.player-card__apelido {
  font-size: 15px;
  font-weight: 800;
  color: #fff;
  line-height: 1.2;
}
.player-card__nome {
  font-size: 12px;
  color: rgba(255,255,255,.5);
  line-height: 1.3;
}

/* Tags de fonte no rodapé do jogador */
.player-card__sources {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 10px 14px;
  background: rgba(0,0,0,.3);
  border-top: 1px solid rgba(255,255,255,.06);
}
.player-card__card-btn {
  display: block;
  padding: 10px 14px;
  background: var(--color-accent, #F5921A);
  color: #1e1e2e;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  text-align: center;
  text-decoration: none;
  border-top: 1px solid rgba(0,0,0,.2);
  transition: background .15s;
}
.player-card__card-btn:hover { background: #fb9a1c; }
.player-card__card-btn:active { background: #d97a08; }
.player-source-tag {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  padding: 4px 10px;
  border-radius: var(--radius-full);
  border: 1px solid;
  text-decoration: none;
  white-space: nowrap;
  transition: all var(--transition);
  cursor: default;
  line-height: 1.2;
}
.player-source-tag::before {
  content: '';
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
}
a.player-source-tag { cursor: pointer; }
a.player-source-tag:hover {
  filter: brightness(1.15);
  transform: translateY(-1px);
  text-decoration: none;
}
.player-source-tag--confirmado {
  color: #fff;
  background: #1D4ED8;
  border-color: #3B82F6;
}
.player-source-tag--confirmado::before { background: #BFDBFE; }
.player-source-tag--certeza {
  color: #fff;
  background: #16A34A;
  border-color: #22C55E;
}
.player-source-tag--certeza::before { background: #BBF7D0; }
.player-source-tag--duvida {
  color: #fff;
  background: #D97706;
  border-color: #F59E0B;
}
.player-source-tag--duvida::before { background: #FED7AA; }
.player-source-tag--neutra {
  color: rgba(255,255,255,.85);
  background: #475569;
  border-color: #64748B;
}
.player-source-tag--neutra::before { background: #CBD5E1; }

/* Modal seletor de clube */
.club-picker-box {
  max-width: 760px;
  max-height: 80vh;
  display: flex;
  flex-direction: column;
}
.club-picker-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
  gap: 12px;
  padding: 20px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.2) transparent;
}
.club-picker-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 14px 8px;
  border-radius: var(--radius-md);
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  text-decoration: none;
  transition: background var(--transition), transform var(--transition), border-color var(--transition);
  cursor: pointer;
}
.club-picker-item:hover {
  background: rgba(255,255,255,.1);
  border-color: rgba(255,255,255,.22);
  transform: translateY(-2px);
  text-decoration: none;
}
.club-picker-item__shield {
  width: 52px;
  height: 52px;
  object-fit: contain;
}
.club-picker-item__name {
  font-size: 11px;
  font-weight: 600;
  color: rgba(255,255,255,.8);
  text-align: center;
  line-height: 1.3;
}

/* Tooltip flutuante (renderizado no body) */
.src-tooltip {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10000;
  max-width: 320px;
  min-width: 200px;
  padding: 12px 14px;
  background: #0B1120;
  color: #fff;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: var(--radius-md);
  box-shadow: 0 16px 40px rgba(0,0,0,.6);
  opacity: 0;
  pointer-events: none;
  transform: translateY(4px);
  transition: opacity .18s ease, transform .18s ease;
  font-family: var(--font);
  text-transform: none;
  letter-spacing: normal;
}
.src-tooltip.is-visible {
  opacity: 1;
  transform: translateY(0);
}
.src-tooltip::after {
  content: '';
  position: absolute;
  left: var(--src-tooltip-arrow-x, 50%);
  width: 10px;
  height: 10px;
  background: inherit;
  border: inherit;
  border-color: rgba(255,255,255,.12);
  transform: translateX(-50%) rotate(45deg);
}
.src-tooltip[data-arrow="down"]::after {
  bottom: -6px;
  border-top: none;
  border-left: none;
}
.src-tooltip[data-arrow="up"]::after {
  top: -6px;
  border-bottom: none;
  border-right: none;
}
.src-tooltip__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 6px;
}
.src-tooltip__fonte {
  font-size: 11.5px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: #fff;
}
.src-tooltip__badge {
  font-size: 9.5px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .06em;
  padding: 2px 7px;
  border-radius: var(--radius-full);
}
.src-tooltip--confirmado .src-tooltip__badge { color: #60A5FA; background: rgba(59,130,246,.18); }
.src-tooltip--certeza    .src-tooltip__badge { color: #16D465; background: rgba(22,212,101,.15); }
.src-tooltip--duvida     .src-tooltip__badge { color: #F5921A; background: rgba(245,146,26,.15); }
.src-tooltip--neutra     .src-tooltip__badge { color: rgba(255,255,255,.55); background: rgba(255,255,255,.08); }
.src-tooltip--alerta     .src-tooltip__badge { color: #fff; background: #F59E0B; }
.src-tooltip--escalado   .src-tooltip__badge { color: #fff; background: #EA580C; }
.src-tooltip--escalado   .src-tooltip__body strong { color: #FB923C; }
.src-tooltip--indicado   .src-tooltip__badge { color: #fff; background: var(--indicado-color, #3B82F6); }
.src-tooltip--indicado   .src-tooltip__body strong { color: var(--indicado-color, #3B82F6); }

/* ── Tooltip de alternativas por posição (campinho) ── */
.pitch-alt-tip {
  position: fixed;
  z-index: 9998;
  background: #1a1b3a;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 10px;
  padding: 10px 14px;
  min-width: 170px;
  max-width: 250px;
  pointer-events: none;
  box-shadow: 0 8px 28px rgba(0,0,0,.55);
  opacity: 0;
  transform: translateY(4px);
  transition: opacity .14s ease, transform .14s ease;
}
.pitch-alt-tip.is-visible {
  pointer-events: auto;
  opacity: 1;
  transform: translateY(0);
}
.pitch-alt-tip__head {
  font-size: 10px;
  font-weight: 800;
  color: rgba(255,255,255,.45);
  letter-spacing: .07em;
  text-transform: uppercase;
  margin-bottom: 8px;
}
.pitch-alt-tip__list { display: flex; flex-direction: column; gap: 6px; }
.pitch-alt-tip__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.pitch-alt-tip__name {
  font-size: 13px;
  font-weight: 600;
  color: #fff;
  white-space: nowrap;
  flex-shrink: 0;
}
.pitch-alt-tip__tags { display: flex; gap: 4px; flex-wrap: wrap; justify-content: flex-end; }
.pitch-alt-tip__tag {
  font-size: 10px;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 999px;
  white-space: nowrap;
}
.pitch-alt-tip__tag--cert { background: rgba(22,163,74,.22); color: #4ade80; }
.pitch-alt-tip__tag--duv  { background: rgba(217,119,6,.22);  color: #fbbf24; }
.pitch-alt-tip__btn {
  display: block;
  margin-top: 10px;
  padding: 8px 12px;
  background: var(--color-accent, #F5921A);
  color: #1e1e2e;
  font-size: 11.5px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
  text-align: center;
  text-decoration: none;
  border-radius: 6px;
  transition: background .15s;
}
.pitch-alt-tip__btn:hover  { background: #fb9a1c; }
.pitch-alt-tip__btn:active { background: #d97a08; }
.src-tooltip__body {
  font-size: 12.5px;
  font-weight: 500;
  line-height: 1.5;
  color: rgba(255,255,255,.88);
  white-space: normal;
}

/* ============================================================
   SEO SECTION (partidas + destaques, indexável)
   ============================================================ */
.seo-section {
  background: var(--color-alt);
  padding-block: 32px 28px;
  border-top: 1px solid var(--color-border);
}
.seo-section__title {
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .6px;
  color: var(--color-muted);
  margin: 0 0 14px;
}
.seo-section__title:not(:first-child) { margin-top: 28px; }
.seo-section__list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 6px 32px;
  margin: 0 0 6px;
  padding: 0;
  list-style: none;
  font-size: 13px;
  color: var(--color-text);
  line-height: 1.55;
}
.seo-section__list a {
  color: var(--color-primary);
  text-decoration: none;
  font-weight: 600;
}
.seo-section__list a:hover { text-decoration: underline; }
.seo-section__list--cols {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 4px 16px;
}
.seo-section__list--cols li {
  font-size: 12px;
  color: var(--color-muted);
}
.seo-section__list--cols a { font-weight: 500; }

/* ============================================================
   FOOTER
   ============================================================ */
.footer {
  background: var(--color-dark);
  padding-block: 40px;
}
.footer__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.footer__brand {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.footer__tagline {
  font-size: 13px;
  color: rgba(255,255,255,.40);
}
.footer__copy {
  font-size: 13px;
  color: rgba(255,255,255,.30);
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 1024px) {
  :root { --section-py: 72px; }

  .clubes-bar__list {
    grid-template-columns: repeat(20, minmax(86px, 1fr));
  }

  .confronto__pitches {
    gap: 8px;
    padding: 18px;
  }
  .pitch-player__name { font-size: 10px; max-width: 80px; }
}

@media (max-width: 768px) {
  :root { --section-py: 56px; --container-px: 16px; }

  .header__inner { height: 60px; gap: 8px; }
  .header__logo-img { height: 30px; }
  .header__actions { gap: 6px; }
  .header__actions .btn--sm { font-size: 12px; padding: 7px 10px; gap: 5px; }
  .header__actions .btn--sm svg { width: 13px; height: 13px; }
  /* no mobile: esconde botão push do header e habilita o do hero */
  #btnPush { display: none !important; }
  .hero__push-btn {
    display: inline-flex !important;
    align-self: center;
    margin-bottom: 12px;
    font-size: 14px;
    padding: 10px 20px;
    color: #1a1a2e;
    background: #F5921A;
    border-color: #F5921A;
    border-width: 2px;
    gap: 8px;
  }
  .push-btn--hidden { display: none !important; }

  .hero {
    min-height: auto;
    padding-block: 32px;
  }
  .hero__inner {
    grid-template-columns: 1fr;
    text-align: center;
  }
  .hero__content { align-items: center; margin-inline: auto; }
  .hero__visual { display: none; }
  .hero__title { font-size: clamp(15px, 4.5vw, 22px); }
  .hero__sub { font-size: 16px; }
  .hero__meta {
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
  }
  .hero__ctas .btn { flex: 1; }

  .clubes-bar__list {
    grid-template-columns: repeat(20, 84px);
    gap: 10px;
  }
  .club-chip { padding: 10px 6px; }
  .club-chip__shield { width: 44px; height: 44px; }

  .confronto__header {
    grid-template-columns: auto 1fr;
    grid-template-rows: auto auto auto;
    grid-template-areas:
      "rodada date"
      "rodada center"
      "rodada local";
    padding: 12px 16px;
    gap: 4px 14px;
    align-items: center;
  }
  .confronto__header-rodada {
    grid-area: rodada;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    border-right: 1px solid rgba(255,255,255,.1);
    padding-right: 14px;
    align-self: stretch;
    justify-content: center;
  }
  .confronto__header-date {
    grid-area: date;
    font-size: 11px;
  }
  .confronto__header-center {
    grid-area: center;
    justify-content: flex-start;
  }
  .confronto__header-local {
    grid-area: local;
    justify-content: flex-end;
    font-size: 11px;
  }
  .confronto__score { font-size: 22px; padding: 4px 12px; }

  .confronto__pitches {
    grid-template-columns: 1fr;
    gap: 14px;
    padding: 14px;
  }
  .confronto__vs { display: none; }

  .pitch {
    max-width: 100%;
    aspect-ratio: 68 / 95;
  }
  .pitch__rows { padding: 8px 4px 26px; }

  .team-side__header {
    padding: 8px 10px;
    gap: 8px;
  }
  .team-side__shield { width: 34px; height: 34px; }
  .team-side__name { font-size: 13px; }

  .pitch-player { gap: 2px; max-width: 20%; }
  .pitch-player__photo { width: 44px; height: 44px; }
  .pitch-player__photo--placeholder { font-size: 12px; }
  .pitch-player__name { font-size: 9px; max-width: 70px; }
  .confronto__pitches.has-pts .pitch-player__pts--loaded { font-size: 13px; padding: 1px 4px; }

  .entraram-player__photo { width: 36px; height: 36px; }
  .entraram-player__name { font-size: 9px; max-width: 48px; }
  .entraram-player__pts { font-size: 13px; padding: 1px 4px; }

  .confronto__details {
    grid-template-columns: 1fr;
    padding: 0 16px 16px;
  }
  .team-detail__sources {
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
  }
  .source-thumb__body { padding: 6px 8px 8px; }
  .source-thumb__source { font-size: 9px; }
  .source-thumb__title { font-size: 10px; }

  .modal-overlay { padding: 0; align-items: flex-end; }
  .modal-box {
    max-height: 90vh;
    border-radius: var(--radius-lg) var(--radius-lg) 0 0;
    transform: translateY(40px);
  }
  .modal-overlay.is-visible .modal-box { transform: translateY(0); }
  .modal-box__head { padding: 16px 56px 14px 16px; }
  .modal-box__title { font-size: 17px; }
  .modal-box__body { padding: 14px 14px 22px; }
  .player-card__head { padding: 10px 12px; gap: 10px; }
  .player-card__photo { width: 42px; height: 42px; }

  .footer__inner { flex-direction: column; text-align: center; }
}

@media (max-width: 420px) {
  .pitch-player__name { font-size: 9px; max-width: 68px; }
  .clubes-bar__list { grid-template-columns: repeat(20, 76px); }
  .club-chip__shield { width: 40px; height: 40px; }
}

/* ============================================================
   Copa — abas (Confrontos / Válidos por Grupo / Tabela)
   Estética inspirada nas tabs internas dos clubes (cp-tabs).
   ============================================================ */
.copa-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-bottom: 24px;
  border-bottom: 1px solid rgba(255,255,255,.14);
}
.copa-tab {
  background: transparent;
  border: none;
  font-family: inherit;
  font-size: 16px;
  font-weight: 700;
  color: rgba(255,255,255,.55);
  padding: 14px 22px;
  cursor: pointer;
  border-bottom: 3px solid transparent;
  margin-bottom: -1px;
  white-space: nowrap;
  transition: color .15s, border-color .15s;
}
.copa-tab:hover { color: rgba(255,255,255,.85); }
.copa-tab--active { color: #fff; border-bottom-color: var(--copa-red); }
.copa-pane[hidden] { display: none; }

/* ── Mobile: tabs vira bottom navigation bar fixa (estilo app nativo) ──────── */
@media (max-width: 700px) {
  #brTabs.copa-tabs, #copaTabs.copa-tabs {
    position: fixed;
    bottom: 0; left: 0; right: 0;
    margin: 0;
    background: #1f2151;
    border-top: 1px solid rgba(255,255,255,.12);
    border-bottom: none;
    box-shadow: 0 -4px 16px rgba(0,0,0,.4);
    padding: 6px 4px;
    padding-bottom: calc(6px + env(safe-area-inset-bottom));
    z-index: 100;
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    gap: 2px;
  }
  #brTabs.copa-tabs::-webkit-scrollbar, #copaTabs.copa-tabs::-webkit-scrollbar { display: none; }
  #brTabs .copa-tab, #copaTabs .copa-tab {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    min-width: 64px;
    padding: 6px 10px;
    border-bottom: none;
    border-radius: 8px;
    font-size: 0;             /* esconde o label original */
    color: rgba(255,255,255,.6);
    transition: background .15s, color .15s;
    white-space: nowrap;
    margin: 0;
  }
  /* Ícone (emoji) acima */
  #brTabs .copa-tab::before, #copaTabs .copa-tab::before {
    content: attr(data-icon);
    font-size: 20px;
    line-height: 1;
    display: block;
  }
  /* Label curto abaixo (data-short) */
  #brTabs .copa-tab::after, #copaTabs .copa-tab::after {
    content: attr(data-short);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .02em;
    line-height: 1.2;
  }
  /* Estado ativo: highlight laranja */
  #brTabs .copa-tab--active, #copaTabs .copa-tab--active {
    background: rgba(245,146,26,.18);
    color: #F5921A;
    border-bottom: none;
  }
  /* Reserva espaço pro bottom bar no body pra não esconder o conteúdo final */
  body { padding-bottom: calc(70px + env(safe-area-inset-bottom)); }
}

/* Tab 2 — Válidos por Grupo (2 grupos por linha em desktop) */
#validosGrupoContent {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 18px;
}
@media (max-width: 700px) { #validosGrupoContent { grid-template-columns: 1fr; } }
.copa-validos-grupo {
  margin-bottom: 0;
  --grupo-color: var(--copa-red);
  background: #F8FAFC;
  border: 1px solid #E2E8F0;
  border-top: 3px solid var(--grupo-color);
  border-radius: 10px;
  padding: 14px 14px 16px;
  box-shadow: 0 2px 12px rgba(0,0,0,.18);
}
.copa-validos-grupo__title {
  font-size: 15px;
  font-weight: 800;
  color: #1E293B;
  margin: 0 0 12px;
  padding: 6px 12px;
  background: color-mix(in srgb, var(--grupo-color) 14%, transparent);
  border-left: 4px solid var(--grupo-color);
  border-radius: 4px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.copa-validos-grupo__title::before {
  content: '';
  display: inline-block;
  width: 10px; height: 10px;
  border-radius: 50%;
  background: var(--grupo-color);
  box-shadow: 0 0 8px color-mix(in srgb, var(--grupo-color) 70%, transparent);
}
.copa-validos-grupo__list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.copa-validos-card {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 13px;
  background: #fff;
  border: 1px solid #E2E8F0;
  border-left: 3px solid color-mix(in srgb, var(--grupo-color) 60%, transparent);
  border-radius: 6px;
  cursor: pointer;
  text-align: left;
  transition: background .15s, border-color .15s, transform .15s;
  font-family: inherit;
  width: 100%;
}
.copa-validos-card:hover {
  background: color-mix(in srgb, var(--grupo-color) 8%, #fff);
  border-color: var(--grupo-color);
  transform: translateX(2px);
}
.copa-validos-card__teams { display: flex; align-items: center; gap: 8px; flex: 1; font-size: 13px; font-weight: 600; color: #1E293B; }
.copa-validos-card__escudo { width: 22px; height: 22px; object-fit: contain; flex-shrink: 0; }
.copa-validos-card__vs { color: #94A3B8; font-size: 11px; font-weight: 700; padding: 0 4px; }
.copa-validos-card__meta { font-size: 11px; color: #64748B; white-space: nowrap; }

/* Rotação de 6 cores nos grupos (cobre A-L: 12 grupos = 2 ciclos completos) */
.copa-validos-grupo:nth-child(6n+1) { --grupo-color: var(--copa-red); }
.copa-validos-grupo:nth-child(6n+2) { --grupo-color: var(--copa-orange); }
.copa-validos-grupo:nth-child(6n+3) { --grupo-color: var(--copa-gold); }
.copa-validos-grupo:nth-child(6n+4) { --grupo-color: var(--copa-lime); }
.copa-validos-grupo:nth-child(6n+5) { --grupo-color: var(--copa-blue); }
.copa-validos-grupo:nth-child(6n)   { --grupo-color: var(--copa-purple); }

/* Tab 3 — Tabela dos grupos */
.copa-tabela-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
}
@media (max-width: 700px) { .copa-tabela-grid { grid-template-columns: 1fr; } }
.copa-grupo-card {
  --grupo-color: var(--copa-red);
  background: #F8FAFC;
  border: 1px solid #E2E8F0;
  border-top: 3px solid var(--grupo-color);
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 2px 12px rgba(0,0,0,.18);
}
.copa-grupo-card__head {
  padding: 12px 14px;
  background: linear-gradient(135deg, var(--grupo-color), color-mix(in srgb, var(--grupo-color) 55%, #000));
  color: #fff;
  font-weight: 800;
  font-size: 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  letter-spacing: .5px;
  text-transform: uppercase;
}
.copa-grupo-card__table { width: 100%; border-collapse: collapse; font-size: 12px; color: #1E293B; }
.copa-grupo-card__table th { font-weight: 700; color: #64748B; padding: 8px 4px; text-align: center; font-size: 10px; border-bottom: 1px solid #E2E8F0; text-transform: uppercase; letter-spacing: .3px; }
.copa-grupo-card__table th:first-child, .copa-grupo-card__table td:first-child { text-align: left; padding-left: 14px; }
.copa-grupo-card__table td { padding: 9px 4px; text-align: center; border-bottom: 1px solid #EEF2F7; }
.copa-grupo-card__table tr:last-child td { border-bottom: none; }
.copa-grupo-card__table tbody tr:hover { background: color-mix(in srgb, var(--grupo-color) 6%, transparent); }
.copa-grupo-card__pos { display: inline-block; width: 20px; height: 20px; line-height: 20px; border-radius: 4px; background: #E2E8F0; font-weight: 800; color: #475569; margin-right: 10px; font-size: 11px; text-align: center; }
.copa-grupo-card__table tbody tr:nth-child(1) .copa-grupo-card__pos,
.copa-grupo-card__table tbody tr:nth-child(2) .copa-grupo-card__pos { background: var(--grupo-color); color: #fff; }
.copa-grupo-card__time { font-weight: 600; }
.copa-grupo-card__pts { font-weight: 800; color: var(--grupo-color); font-size: 13px; }
.copa-grupo-card__placeholder { padding: 30px 20px; text-align: center; color: rgba(255,255,255,.55); font-size: 13px; }

.copa-tabela-grid .copa-grupo-card:nth-child(6n+1) { --grupo-color: var(--copa-red); }
.copa-tabela-grid .copa-grupo-card:nth-child(6n+2) { --grupo-color: var(--copa-orange); }
.copa-tabela-grid .copa-grupo-card:nth-child(6n+3) { --grupo-color: var(--copa-gold); }
.copa-tabela-grid .copa-grupo-card:nth-child(6n+4) { --grupo-color: var(--copa-lime); }
.copa-tabela-grid .copa-grupo-card:nth-child(6n+5) { --grupo-color: var(--copa-blue); }
.copa-tabela-grid .copa-grupo-card:nth-child(6n)   { --grupo-color: var(--copa-purple); }

/* Background mais clean e claro pra Copa */
body.is-copa .confrontos {
  background:
    radial-gradient(ellipse at top left,  color-mix(in srgb, var(--copa-red) 10%, transparent), transparent 55%),
    radial-gradient(ellipse at bottom right, color-mix(in srgb, var(--copa-blue) 10%, transparent), transparent 55%),
    #2A2D3A;
}

/* ============================================================
   Copa do Mundo — confrontos colapsáveis (24 jogos por rodada)
   Render padrão: só header com escudos + data. Click expande.
   Ativado pelo script.js quando location.hostname === 'copa.provaveis.com.br'.
   ============================================================ */
.confronto__teaser {
  display: none;
  align-items: center;
  gap: 10px;
}
.confronto__teaser-escudo {
  width: 32px; height: 32px;
  object-fit: contain;
}
.confronto__teaser-vs {
  font-size: 14px;
  font-weight: 700;
  color: rgba(255,255,255,.55);
}
.confronto__teaser-nome {
  font-size: 13px;
  font-weight: 600;
  color: rgba(255,255,255,.9);
  white-space: nowrap;
  max-width: 110px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.confronto__teaser-nome--right { text-align: right; }
.confronto__teaser-nome--left  { text-align: left; }
@media (max-width: 640px) {
  .confronto__teaser-nome { display: none; }
}
.confronto__expand-icon {
  display: none;
  color: rgba(255,255,255,.55);
  margin-left: 8px;
  transition: transform .2s ease;
}
[data-toggle-confronto] {
  cursor: pointer;
  user-select: none;
}
[data-toggle-confronto] .confronto__teaser,
[data-toggle-confronto] .confronto__expand-icon {
  display: inline-flex;
}
[data-toggle-confronto]:hover {
  background: rgba(255,255,255,.07);
}
.confronto:not(.confronto--collapsed) .confronto__expand-icon {
  transform: rotate(180deg);
}
.confronto--collapsed .confronto__pitches,
.confronto--collapsed .confronto__details {
  display: none;
}

/* ============================================================
   Letreiro rolante — últimas alterações de titulares
   ============================================================ */
/* Faixa fixa no rodapé da página, full-width */
.ticker-bar {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 90;
  background: #15162B;
  border-top: 1px solid rgba(255,255,255,.08);
  padding: 8px 0 0;          /* sem padding embaixo: gruda no fim da tela */
  box-shadow: 0 -6px 20px rgba(0,0,0,.25);
}
/* Reserva espaço no fim da página quando o letreiro estiver visível */
body:has(#tickerAlteracoes:not([hidden])) { padding-bottom: 64px; }
.ticker {
  display: flex;
  align-items: stretch;
  max-width: var(--container-w);
  margin-inline: auto;
  width: calc(100% - var(--container-px) * 2);
  background: linear-gradient(90deg, #1F2142, #181A33);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 10px;
  overflow: hidden;
}
.ticker__label {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 44px;
  color: #fff;
  background: var(--color-accent);
  z-index: 2;
}
.ticker__label svg { display: block; }
body.is-copa .ticker__label { background: var(--copa-red); }
.ticker__viewport {
  position: relative;
  flex: 1;
  overflow: hidden;
}
.ticker__viewport::before,
.ticker__viewport::after {
  content: '';
  position: absolute;
  top: 0; bottom: 0;
  width: 40px;
  z-index: 1;
  pointer-events: none;
}
.ticker__viewport::before { left: 0;  background: linear-gradient(90deg, #15162B, transparent); }
.ticker__viewport::after  { right: 0; background: linear-gradient(270deg, #15162B, transparent); }
.ticker__track {
  display: inline-flex;
  align-items: center;
  gap: 0;
  white-space: nowrap;
  will-change: transform;
  animation: ticker-scroll var(--ticker-dur, 40s) linear infinite;
}
.ticker:hover .ticker__track { animation-play-state: paused; }
@keyframes ticker-scroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
.ticker-item {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 7px 16px;
  border-right: 1px solid rgba(255,255,255,.06);
}
.ticker-item__foto {
  width: 34px; height: 34px;
  border-radius: 50%;
  object-fit: cover;
  background: rgba(255,255,255,.08);
  border: 1.5px solid rgba(255,255,255,.15);
  flex-shrink: 0;
}
.ticker-item__body {
  display: flex;
  flex-direction: column;
  gap: 2px;
  line-height: 1.2;
}
.ticker-item__l1 { display: flex; align-items: center; gap: 6px; }
.ticker-item__name { color: #fff; font-weight: 700; font-size: 13px; white-space: nowrap; }
.ticker-item__arrow { font-size: 10px; line-height: 1; }
.ticker-item__arrow--entrou { color: #4ade80; }
.ticker-item__arrow--saiu   { color: #f87171; }
.ticker-item__l2 { display: flex; align-items: center; gap: 5px; }
.ticker-item__escudo { width: 14px; height: 14px; object-fit: contain; flex-shrink: 0; }
.ticker-item__time { color: rgba(255,255,255,.45); font-size: 11px; white-space: nowrap; }

/* ============================================================
   BR — Mais Escalados (Tab 2 do index Brasileirão)
   ============================================================ */
/* 3 abas no topo da aba Mais Escalados: Campinho / Lista / Posição */
.me-views__tabs {
  display: flex;
  gap: 6px;
  margin-bottom: 18px;
  padding: 4px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 999px;
  width: fit-content;
  margin-inline: auto;
}
.me-views__tab {
  background: transparent;
  border: none;
  font-family: inherit;
  font-size: 13px;
  font-weight: 700;
  color: rgba(255,255,255,.6);
  padding: 8px 18px;
  border-radius: 999px;
  cursor: pointer;
  transition: background .15s, color .15s;
  white-space: nowrap;
}
.me-views__tab:hover { color: #fff; }
.me-views__tab--active {
  background: var(--color-accent);
  color: #fff;
  box-shadow: 0 2px 8px rgba(245,146,26,.35);
}
.me-views__pane[hidden] { display: none; }

/* Pane "Posição": cards por posição */
.br-escalados-pos {
  margin-bottom: 18px;
}
.br-escalados-pos h4 {
  margin: 0 0 10px;
  color: #fff;
  font-size: 14px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .5px;
  padding: 6px 12px;
  background: rgba(245,146,26,.18);
  border-left: 4px solid var(--color-accent);
  border-radius: 4px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.br-escalados-pos h4 span {
  background: rgba(255,255,255,.12);
  color: rgba(255,255,255,.85);
  padding: 1px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
}
.br-escalados-pos__list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
}
@media (max-width: 700px) { .br-escalados-pos__list { grid-template-columns: 1fr; } }

.br-escalados-pitch {
  margin-bottom: 24px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 12px;
  overflow: hidden;
}
.br-escalados-pitch__head { padding: 14px 18px 0; }
.br-escalados-pitch__head h3 {
  margin: 0 0 4px;
  color: #fff;
  font-size: 17px;
  font-weight: 800;
  letter-spacing: .3px;
}
.br-escalados-pitch__head h3 span { color: var(--color-accent); font-weight: 700; font-size: 14px; }
.br-escalados-pitch__head p {
  margin: 0;
  color: rgba(255,255,255,.55);
  font-size: 12px;
}
.br-escalados-pitch__wrap {
  max-width: 460px;
  margin: 12px auto 18px;
  padding: 0 14px;
  position: relative;
}
.br-escalados-pitch__wrap .pitch { position: relative; }
.br-escalados-pitch__tag {
  display: inline-block;
  margin-top: 3px;
  padding: 2px 9px;
  background: rgba(15,23,42,.92);
  color: #fff;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 999px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .3px;
  line-height: 1.3;
  white-space: nowrap;
  box-shadow: 0 1px 3px rgba(0,0,0,.4);
}
.br-escalados-pitch__tec {
  position: absolute;
  bottom: 6px;
  right: 6px;
  z-index: 5;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}
.br-escalados-pitch__tec-label {
  font-size: 9px;
  font-weight: 800;
  color: rgba(255,255,255,.65);
  letter-spacing: .5px;
  text-transform: uppercase;
  text-shadow: 0 1px 2px rgba(0,0,0,.6);
}
.br-escalados-pitch__tec .pitch-player { max-width: none; }
.br-escalados-pitch__tec .pitch-player__photo { width: 38px; height: 38px; }
.br-escalados-pitch__tec .pitch-player__name { font-size: 11px; }

.br-escalados-banco {
  margin: 16px 0 4px;
  padding: 0 14px;
}
.br-escalados-banco h4 {
  margin: 0 0 10px;
  text-align: center;
  color: rgba(255,255,255,.8);
  font-size: 14px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .5px;
}
.br-escalados-banco__list {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 8px;
}
@media (max-width: 600px) { .br-escalados-banco__list { grid-template-columns: repeat(5, 1fr); gap: 4px; } }
.br-escalados-banco__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}
.br-escalados-banco__esc {
  font-size: 10px;
  font-weight: 800;
  color: #fff;
  background: rgba(15,23,42,.92);
  border: 1px solid rgba(255,255,255,.18);
  padding: 2px 7px;
  border-radius: 999px;
}
.br-escalados-banco__avatar { position: relative; }
.br-escalados-banco__foto {
  width: 60px; height: 60px; border-radius: 50%;
  object-fit: cover;
  background: rgba(255,255,255,.08);
  border: 1.5px solid rgba(255,255,255,.18);
}
.br-escalados-banco__foto--placeholder {
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 16px; font-weight: 800; color: rgba(255,255,255,.7);
}
.br-escalados-banco__name {
  font-size: 11px; font-weight: 700; color: #fff;
  max-width: 70px; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.br-escalados-banco__pos {
  font-size: 9px; font-weight: 800; color: rgba(255,255,255,.5);
  text-transform: uppercase; letter-spacing: .5px;
}

.br-escalados-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
}
@media (max-width: 700px) { .br-escalados-grid { grid-template-columns: 1fr; } }
.br-escalado-link { text-decoration: none; color: inherit; }
.br-escalado-card {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 8px;
  transition: background .15s, border-color .15s, transform .15s;
}
.br-escalado-link:hover .br-escalado-card {
  background: rgba(245,146,26,.1);
  border-color: rgba(245,146,26,.4);
  transform: translateX(2px);
}
.br-escalado-card__rank {
  font-family: 'Anton', 'Inter', sans-serif;
  font-size: 18px;
  color: var(--color-accent);
  min-width: 28px;
  text-align: center;
}
.br-escalado-card__foto {
  width: 60px; height: 60px; border-radius: 50%;
  object-fit: cover;
  background: rgba(255,255,255,.08);
  border: 1.5px solid rgba(255,255,255,.15);
  flex-shrink: 0;
}
.br-escalado-card__foto--placeholder {
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 16px; font-weight: 800; color: rgba(255,255,255,.7);
}
.br-escalado-card__escudo {
  width: 14px; height: 14px; object-fit: contain;
  vertical-align: middle; margin-right: 4px;
}
.br-escalado-card__info { flex: 1; min-width: 0; }
.br-escalado-card__name { color: #fff; font-weight: 700; font-size: 14px; }
.br-escalado-card__meta {
  display: flex; align-items: center;
  color: rgba(255,255,255,.55); font-size: 11px; font-weight: 600;
  text-transform: uppercase; letter-spacing: .3px;
}
.br-escalado-card__pts { text-align: right; }
.br-escalado-card__pts strong { display: block; color: var(--color-accent); font-weight: 800; font-size: 16px; }
.br-escalado-card__pts span { display: block; color: rgba(255,255,255,.5); font-size: 10px; text-transform: uppercase; letter-spacing: .4px; }

/* ============================================================
   BR — Tabela do Brasileirão (Tab 3)
   ============================================================ */
.br-tabela-wrap {
  background: #F8FAFC;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 2px 12px rgba(0,0,0,.18);
}
/* Toggle Campeonato / G4 Z4 */
.br-tabela-toggle { display:inline-flex; gap:0; margin:0 auto 14px; padding:3px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); border-radius:999px; align-self:center; }
#tabelaBrContent { display:flex; flex-direction:column; align-items:center; }
.br-tabela-toggle__btn { background:transparent; border:none; font-family:inherit; font-size:13px; font-weight:700; color:rgba(255,255,255,.65); padding:8px 18px; border-radius:999px; cursor:pointer; transition:background .15s,color .15s; white-space:nowrap; }
.br-tabela-toggle__btn:hover { color:#fff; }
.br-tabela-toggle__btn.is-active { background:#F5921A; color:#fff; box-shadow:0 2px 8px rgba(245,146,26,.35); }
.br-tabela-sep td { background:#E2E8F0 !important; color:#94A3B8; font-weight:800; letter-spacing:.3em; padding:6px 0 !important; }
/* Dots V/E/D coluna "Últimos 5" (modo G4/Z4) */
.br-tabela-aprov-cell { padding-left:14px !important; padding-right:14px !important; }
.br-tabela-aprov { display:inline-flex; gap:3px; }
.br-tabela-aprov__dot { display:inline-flex; align-items:center; justify-content:center; width:18px; height:18px; border-radius:4px; font-size:10px; font-weight:800; color:#fff; }
.br-tabela-aprov--v { background:#16A34A; }
.br-tabela-aprov--e { background:#94A3B8; }
.br-tabela-aprov--d { background:#DC2626; }

/* ── Análise de Arbitragem (aba BR) ─────────────────────────── */
.br-arb-wrap { background:#F8FAFC; border-radius:10px; overflow-x:auto; box-shadow:0 2px 12px rgba(0,0,0,.18); }
.br-arb { width:100%; border-collapse:collapse; font-size:13px; color:#1E293B; min-width:760px; }
.br-arb thead th {
  background:#2D2E6E; color:#fff; font-weight:700; font-size:11px;
  padding:12px 8px; text-transform:uppercase; letter-spacing:.5px;
  text-align:center; cursor:pointer; user-select:none;
  transition:background .12s;
  white-space:nowrap;
}
.br-arb thead th:hover { background:#3a3b85; }
.br-arb thead th.is-active { background:#F5921A; color:#1E293B; }
.br-arb tbody td { padding:10px 8px; text-align:center; border-bottom:1px solid #EEF2F7; }
.br-arb tbody tr:last-child td { border-bottom:none; }
.br-arb tbody tr:hover { background:rgba(245,146,26,.07); }
.br-arb-conf-cell { text-align:left !important; padding-left:14px !important; min-width:300px; }
/* Grid 5 colunas: nome mandante (1fr, dir) | escudo (auto) | × (auto) | escudo (auto) | nome visitante (1fr, esq).
   Garante escudos verticalmente alinhados entre linhas mesmo com nomes de tamanhos diferentes. */
.br-arb-conf {
  display:grid;
  grid-template-columns: 1fr auto auto auto 1fr;
  align-items:center;
  gap:6px;
}
.br-arb-team-name { font-weight:700; white-space:nowrap; }
.br-arb-team-name:first-child { justify-self:end;   text-align:right; }
.br-arb-team-name:last-child  { justify-self:start; text-align:left;  }
.br-arb-escudo { width:22px; height:22px; object-fit:contain; }
.br-arb-vs { color:#94A3B8; font-weight:700; margin:0 4px; }
.br-arb-arb-cell { text-align:left !important; padding-left:14px !important; min-width:200px; }
.br-arb-sub { font-size:11px; color:#64748B; margin-top:3px; font-weight:400; }
.br-arb-conf-cell .br-arb-sub { text-align:center; }

/* ── Cobradores (aba BR) ──────────────────────────────────────── */
.br-cob-toggle { display:inline-flex; gap:0; margin:0 auto 18px; padding:3px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); border-radius:999px; align-self:center; }
.br-cob-toggle__btn { background:transparent; border:none; font-family:inherit; font-size:13px; font-weight:700; color:rgba(255,255,255,.65); padding:8px 18px; border-radius:999px; cursor:pointer; transition:background .15s,color .15s; white-space:nowrap; }
.br-cob-toggle__btn:hover { color:#fff; }
.br-cob-toggle__btn.is-active { background:#F5921A; color:#fff; box-shadow:0 2px 8px rgba(245,146,26,.35); }
#cobradoresContent { display:flex; flex-direction:column; align-items:center; }
/* 5 clubes por linha em telas grandes; cai pra 4/3/2/1 em telas menores */
.br-cob-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:12px; width:100%; }
@media (max-width:1200px) { .br-cob-grid { grid-template-columns:repeat(4,1fr); } }
@media (max-width:980px)  { .br-cob-grid { grid-template-columns:repeat(3,1fr); } }
@media (max-width:720px)  { .br-cob-grid { grid-template-columns:repeat(2,1fr); } }
@media (max-width:480px)  { .br-cob-grid { grid-template-columns:1fr; } }
.br-cob-card { background:#F8FAFC; border-radius:10px; box-shadow:0 2px 10px rgba(0,0,0,.18); overflow:hidden; display:flex; flex-direction:column; }
.br-cob-card__hd { display:flex; align-items:center; gap:8px; padding:8px 10px; background:#2D2E6E; color:#fff; }
.br-cob-card__hd img { width:24px; height:24px; object-fit:contain; flex-shrink:0; }
.br-cob-card__hd h3 { margin:0; font-size:13px; font-weight:800; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
/* Body: 3 jogadores em 1 linha, cada um numa coluna vertical (foto, nome, posição) */
.br-cob-card__body { padding:10px 6px; display:grid; grid-template-columns:repeat(3,1fr); gap:4px; }
.br-cob-item { display:flex; flex-direction:column; align-items:center; gap:4px; padding:6px 2px; color:inherit; text-decoration:none; min-width:0; }
.br-cob-item--link { cursor:pointer; transition:background .12s, transform .12s; border-radius:8px; }
.br-cob-item--link:hover { background:rgba(245,146,26,.1); }
.br-cob-item--link:active { transform:scale(.96); }
.br-cob-foto { width:56px; height:56px; border-radius:50%; object-fit:cover; background:#E2E8F0; flex-shrink:0; }
.br-cob-foto--ph { background:#E2E8F0; display:inline-flex; align-items:center; justify-content:center; font-weight:800; color:#475569; font-size:14px; }
.br-cob-nome { font-size:12px; font-weight:700; color:#1E293B; text-align:center; line-height:1.2; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; width:100%; }
.br-cob-pos { font-size:10px; color:#94A3B8; text-transform:uppercase; letter-spacing:.04em; text-align:center; }
.br-cob-vazio { grid-column:1/-1; font-size:12px; color:#94A3B8; text-align:center; padding:10px 0; }

/* ── Cruzamento de Scouts (aba BR) ───────────────────────────── */
.br-cz-filtros { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:14px; }
/* Versão COMPACT: 3 dropdowns numa linha, ocupam pouco espaço (combo style) */
.br-cz-filtros--compact { gap:10px; align-items:center; justify-content:center; }
.br-cz-cf { position:relative; display:inline-flex; align-items:center; gap:8px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.14); border-radius:8px; padding:6px 12px; color:#fff; font-size:13px; cursor:pointer; }
.br-cz-cf__lbl { font-weight:700; white-space:nowrap; }
.br-cz-cf__count { font-size:11px; font-weight:700; color:#F5921A; background:rgba(245,146,26,.18); padding:1px 8px; border-radius:999px; }
.br-cz-cf__chev { font-size:10px; opacity:.6; transition:transform .15s; }
.br-cz-cf--drop[open] .br-cz-cf__chev { transform:rotate(180deg); }
.br-cz-cf--drop > summary { list-style:none; display:flex; align-items:center; gap:8px; cursor:pointer; user-select:none; }
.br-cz-cf--drop > summary::-webkit-details-marker { display:none; }
.br-cz-cf__sel { background:rgba(0,0,0,.2); color:#fff; border:1px solid rgba(255,255,255,.18); border-radius:6px; padding:4px 8px; font-family:inherit; font-size:13px; font-weight:700; cursor:pointer; }
.br-cz-cf__sel option { background:#2a2b5e; color:#fff; }
/* Popup flutuante (não empurra o conteúdo abaixo) */
.br-cz-popup { position:absolute; top:calc(100% + 4px); left:0; z-index:50; background:#2a2b5e; border:1px solid rgba(255,255,255,.22); border-radius:8px; padding:8px; box-shadow:0 8px 24px rgba(0,0,0,.6); min-width:220px; max-width:300px; }
.br-cz-filtro { background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); border-radius:10px; padding:8px 12px; flex:1 1 220px; min-width:200px; color:#fff; }
.br-cz-filtro summary { cursor:pointer; font-weight:700; font-size:13px; display:flex; align-items:center; gap:8px; user-select:none; list-style:none; }
.br-cz-filtro summary::-webkit-details-marker { display:none; }
.br-cz-filtro summary::after { content:'▾'; margin-left:auto; opacity:.5; transition:transform .15s; }
.br-cz-filtro[open] summary::after { transform:rotate(180deg); }
.br-cz-filtro__count { font-size:11px; font-weight:700; color:#F5921A; background:rgba(245,146,26,.16); padding:1px 8px; border-radius:999px; }
.br-cz-chips { display:flex; flex-wrap:wrap; gap:4px; margin-top:8px; max-height:160px; overflow-y:auto; }
.br-cz-chip { background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.15); color:rgba(255,255,255,.65); font-size:11px; font-weight:700; padding:4px 9px; border-radius:999px; cursor:pointer; transition:all .12s; font-family:inherit; white-space:nowrap; }
.br-cz-chip:hover { background:rgba(255,255,255,.12); color:#fff; }
.br-cz-chip.is-active { background:#F5921A; border-color:#F5921A; color:#1e1e2e; }
/* Checkbox list (substitui chips) — sem max-height: deixa crescer com o conteúdo */
.br-cz-chklist { display:flex; flex-direction:column; gap:2px; margin-top:8px; padding:4px; background:rgba(0,0,0,.15); border-radius:6px; }
.br-cz-chk { display:flex; align-items:center; gap:8px; padding:5px 8px; border-radius:4px; cursor:pointer; font-size:12px; color:rgba(255,255,255,.85); transition:background .12s; font-weight:500; }
.br-cz-chk:hover { background:rgba(255,255,255,.06); }
.br-cz-chk input[type=checkbox] { width:14px; height:14px; accent-color:#F5921A; cursor:pointer; }
.br-cz-chk span { flex:1; }
.br-cz-acts { display:flex; gap:6px; margin-top:6px; }
.br-cz-acts button { background:transparent; border:1px solid rgba(255,255,255,.15); color:rgba(255,255,255,.6); font-size:11px; font-weight:600; padding:3px 9px; border-radius:6px; cursor:pointer; font-family:inherit; transition:all .12s; }
.br-cz-acts button:hover { background:rgba(255,255,255,.08); color:#fff; }
/* Filtro Rodadas: 3 botões radio (Últimas 8 / Últimas 16 / Todos) */
.br-cz-filtro--radio { display:flex; flex-direction:column; gap:8px; }
.br-cz-filtro__hd { font-weight:700; font-size:13px; color:#fff; display:flex; align-items:center; gap:6px; }
.br-cz-radio { display:flex; gap:0; background:rgba(0,0,0,.2); border:1px solid rgba(255,255,255,.12); border-radius:8px; padding:3px; }
.br-cz-rbtn { flex:1; background:transparent; border:none; font-family:inherit; font-size:12px; font-weight:700; color:rgba(255,255,255,.65); padding:7px 8px; border-radius:6px; cursor:pointer; transition:all .12s; }
.br-cz-rbtn:hover { color:#fff; }
.br-cz-rbtn.is-active { background:#F5921A; color:#1e1e2e; box-shadow:0 1px 3px rgba(0,0,0,.25); }

.br-cz-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
@media (max-width:980px) { .br-cz-grid { grid-template-columns:1fr; } }
.br-cz-side { background:#F8FAFC; border-radius:10px; box-shadow:0 2px 12px rgba(0,0,0,.18); overflow:hidden; }
.br-cz-h { margin:0; background:#2D2E6E; color:#fff; font-size:14px; font-weight:800; padding:10px 14px; text-align:center; text-transform:uppercase; letter-spacing:.05em; }
.br-cz-tbl { width:100%; border-collapse:collapse; font-size:12px; color:#1E293B; }
.br-cz-tbl thead th { background:#E2E8F0; font-weight:700; font-size:10px; text-transform:uppercase; letter-spacing:.04em; color:#475569; padding:6px 4px; text-align:center; }
.br-cz-tbl thead th.br-cz-sortable { cursor:pointer; user-select:none; transition:background .12s, color .12s; }
.br-cz-tbl thead th.br-cz-sortable:hover { background:#CBD5E1; color:#1E293B; }
.br-cz-tbl thead th.br-cz-sortable.is-sorted { background:#F5921A; color:#1E293B; }
.br-cz-tbl tbody td { padding:8px 4px; text-align:center; border-bottom:1px solid #EEF2F7; vertical-align:middle; }
.br-cz-tbl tbody tr:last-child td { border-bottom:none; }
.br-cz-row--click { cursor:pointer; }
.br-cz-row--click:hover td { filter:brightness(.96); }
.br-cz-row--verde    td { background:#DCFCE7; }
.br-cz-row--amarelo  td { background:#FEF9C3; }
.br-cz-row--vermelho td { background:#FEE2E2; }
.br-cz-row--neutro   td { background:#fff; }
/* TDs continuam como células normais (preenchem altura da linha, bg do TR cobre 100%) */
.br-cz-clube, .br-cz-adv { vertical-align:middle; font-weight:700; font-size:11px; }
/* Layout flex vai num wrapper interno pra não quebrar table-cell */
.br-cz-clube__inner { display:flex; flex-direction:column; align-items:center; gap:3px; }
.br-cz-clube__inner img { width:26px; height:26px; object-fit:contain; }
.br-cz-num { font-weight:700; font-size:13px; color:#2D2E6E; }
.br-cz-x { font-weight:800; color:#94A3B8; font-size:11px; }
.br-cz-heat { padding:4px !important; }

/* Mini-pitch SVG horizontal (1 por clube, Defesa esq + Ataque dir) */
.br-cz-pitchwrap { display:inline-flex; flex-direction:column; align-items:center; gap:3px; }
.br-cz-mini { display:block; width:140px; height:78px; border:1px solid rgba(255,255,255,.25); border-radius:4px; overflow:hidden; }
.br-cz-pitchlbls { display:flex; justify-content:space-between; width:140px; padding:0 8px; box-sizing:border-box; }
.br-cz-pitchlbl { font-size:9px; font-weight:800; color:#64748B; text-transform:uppercase; letter-spacing:.05em; }
.br-cz-heat { padding:6px !important; }

.br-cz-leg { text-align:center; color:rgba(255,255,255,.7); font-size:12px; margin-top:14px; }

/* ── Mobile: cada confronto vira card de 2 linhas em grid 3 colunas ─────────────
   Linha 1: Clube     · Heatmap próprio · Pontuação
   Linha 2: Cedido    · Heatmap adv    · Adversário                              */
@media (max-width: 700px) {
  .br-cz-grid { grid-template-columns: 1fr; }
  .br-cz-tbl, .br-cz-tbl thead, .br-cz-tbl tbody, .br-cz-tbl tr, .br-cz-tbl td, .br-cz-tbl th { display:block; }
  .br-cz-tbl thead { display:none; }
  .br-cz-tbl tbody tr {
    display:grid;
    grid-template-columns: 70px 1fr 90px;
    grid-template-areas:
      "clube heatMeu pont"
      "cedi  heatAdv adv";
    column-gap:8px;
    row-gap:6px;
    padding:10px;
    border-bottom:1px solid #EEF2F7;
    align-items:center;
  }
  .br-cz-tbl tbody tr:last-child { border-bottom:none; }
  .br-cz-clube       { grid-area:clube;   text-align:center; }
  .br-cz-heat--meu   { grid-area:heatMeu; padding:0 !important; }
  .br-cz-num--pont   { grid-area:pont;    text-align:center; }
  .br-cz-num--cedi   { grid-area:cedi;    text-align:center; }
  .br-cz-heat--adv   { grid-area:heatAdv; padding:0 !important; }
  .br-cz-adv         { grid-area:adv;     text-align:center; }
  .br-cz-x           { display:none; }
  /* Labels acima dos números pra deixar claro o que é cada um */
  .br-cz-num--pont::before { content:"PONTUAÇÃO"; display:block; font-size:9px; font-weight:700; color:#64748B; letter-spacing:.05em; margin-bottom:2px; }
  .br-cz-num--cedi::before { content:"CEDIDO";    display:block; font-size:9px; font-weight:700; color:#64748B; letter-spacing:.05em; margin-bottom:2px; }
  /* Mini-pitches ocupam toda largura da coluna central */
  .br-cz-mini { width:100%; height:60px; }
  .br-cz-pitchwrap { width:100%; }
  .br-cz-pitchlbls { width:100%; }
}
.br-cz-aviso { background:rgba(234,179,8,.14); border:1px solid rgba(234,179,8,.45); color:#FEF3C7; padding:10px 14px; border-radius:8px; font-size:13px; margin-bottom:14px; line-height:1.45; }

/* Toggle Campinhos / Gráfico */
.br-cz-vtoggle { display:flex; gap:0; padding:3px; background:rgba(0,0,0,.25); border:1px solid rgba(255,255,255,.12); border-radius:999px; width:fit-content; margin:0 auto 14px; }
.br-cz-vtbtn { background:transparent; border:none; font-family:inherit; font-size:13px; font-weight:700; color:rgba(255,255,255,.65); padding:8px 18px; border-radius:999px; cursor:pointer; transition:all .15s; white-space:nowrap; }
.br-cz-vtbtn:hover { color:#fff; }
.br-cz-vtbtn.is-active { background:#F5921A; color:#1e1e2e; box-shadow:0 2px 8px rgba(245,146,26,.35); }

/* Gráfico de barras + linha esperado */
.br-cz-grafico { background:#1a1b3a; border:1px solid rgba(255,255,255,.12); border-radius:10px; padding:14px; }
.br-cz-grafico svg { width:100%; height:auto; display:block; }
.br-cz-grafico__leg { display:flex; gap:18px; justify-content:center; margin-top:10px; padding-top:10px; border-top:1px solid rgba(255,255,255,.08); }
.br-cz-grafico__legi { display:inline-flex; align-items:center; gap:6px; font-size:12px; color:rgba(255,255,255,.78); font-weight:600; }
.br-cz-grafico__legi i { display:inline-block; width:14px; height:10px; }
@media (max-width:700px) { .br-arb thead th { font-size:10px; padding:10px 4px; } .br-arb tbody td { padding:8px 4px; } }
.br-tabela { width: 100%; border-collapse: collapse; font-size: 13px; color: #1E293B; }
.br-tabela thead th {
  background: #2D2E6E;
  color: #fff;
  font-weight: 700;
  font-size: 11px;
  padding: 12px 6px;
  text-transform: uppercase;
  letter-spacing: .5px;
  text-align: center;
}
.br-tabela thead th.br-tabela-time { text-align: left; padding-left: 14px; }
.br-tabela tbody td {
  padding: 10px 6px;
  text-align: center;
  border-bottom: 1px solid #EEF2F7;
}
.br-tabela tbody tr:last-child td { border-bottom: none; }
.br-tabela tbody tr:hover { background: rgba(245,146,26,.07); }
.br-tabela-pos {
  display: inline-block;
  width: 22px; height: 22px; line-height: 22px;
  border-radius: 4px;
  background: #E2E8F0;
  color: #475569;
  font-weight: 800;
  font-size: 12px;
}
.br-tabela-row--lib   .br-tabela-pos { background: #16A34A; color: #fff; }
.br-tabela-row--preli .br-tabela-pos { background: #65A30D; color: #fff; }
.br-tabela-row--sula  .br-tabela-pos { background: #2563EB; color: #fff; }
.br-tabela-row--rebai .br-tabela-pos { background: #DC2626; color: #fff; }
/* Highlight de fundo dos 4 primeiros (verde claro) e 4 últimos (vermelho claro) */
.br-tabela-row--lib   td { background: #DCFCE7; }
.br-tabela-row--rebai td { background: #FEE2E2; }
.br-tabela-row--lib:hover   td { background: #BBF7D0; }
.br-tabela-row--rebai:hover td { background: #FECACA; }
/* Linha clicável → página do clube */
.br-tabela-row--clickable { cursor: pointer; }
.br-tabela-row--clickable:hover td { background: rgba(245,146,26,.10); }
.br-tabela-row--lib.br-tabela-row--clickable:hover   td { background: #BBF7D0; }
.br-tabela-row--rebai.br-tabela-row--clickable:hover td { background: #FECACA; }

/* Desktop: mostra nome completo; esconde sigla curta */
.br-tabela-time__short { display: none; }

/* ── Mobile: tabela compacta + só sigla no Time ───────────────── */
@media (max-width: 700px) {
  #tabelaBrContent { width: 100%; align-items: stretch; }
  .br-tabela-wrap { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .br-tabela { font-size: 11px; min-width: 100%; }
  .br-tabela thead th { padding: 8px 4px; font-size: 9px; letter-spacing: .3px; }
  .br-tabela thead th.br-tabela-time { padding-left: 6px; }
  .br-tabela tbody td { padding: 8px 3px; }
  .br-tabela td.br-tabela-time { padding-left: 6px; gap: 4px; }
  .br-tabela td.br-tabela-time img { width: 18px; height: 18px; }
  .br-tabela-time__full { display: none; }
  .br-tabela-time__short { display: inline; font-size: 10px; font-weight: 700; }
  .br-tabela-pos { width: 20px; height: 20px; line-height: 20px; font-size: 11px; }
  .br-tabela-aprov__dot { width: 14px; height: 14px; font-size: 9px; }
  .br-tabela-aprov-cell { padding-left: 4px !important; padding-right: 4px !important; }

  /* ── Análise de Arbitragem: oculta sigla/nome dos clubes; mantém só escudos ── */
  .br-arb-team-name { display: none; }
  .br-arb-conf { grid-template-columns: auto auto auto; gap: 4px; justify-content: start; }
  .br-arb-escudo { width: 22px; height: 22px; }
  .br-arb-conf-cell { min-width: 100px; padding-left: 8px !important; }
  .br-arb-arb-cell { min-width: auto; padding-left: 6px !important; }
  .br-arb { font-size: 11px; }
  .br-arb thead th { font-size: 9px; padding: 8px 3px; }
  .br-arb tbody td { padding: 8px 3px; }
}
.br-tabela td.br-tabela-time {
  text-align: left; padding-left: 14px;
  display: flex; align-items: center; gap: 8px;
  font-weight: 600;
}
.br-tabela td.br-tabela-time img { width: 22px; height: 22px; object-fit: contain; }
.br-tabela td:nth-child(3) strong { color: var(--color-accent); font-weight: 800; font-size: 14px; }
.br-tabela-legend {
  padding: 14px 18px;
  background: #fff;
  border-top: 1px solid #E2E8F0;
  display: flex; flex-wrap: wrap; gap: 16px;
  font-size: 12px; color: #475569;
}
.br-tabela-dot {
  display: inline-block; width: 12px; height: 12px; border-radius: 3px;
  margin-right: 6px; vertical-align: middle;
}
.br-tabela-dot--lib   { background: #16A34A; }
.br-tabela-dot--preli { background: #65A30D; }
.br-tabela-dot--sula  { background: #2563EB; }
.br-tabela-dot--rebai { background: #DC2626; }

/* ============================================================
   COPA CTA — banner promocional no index do Brasileirão
   Usa a paleta Copa pra "convidar" o usuário pra copa.provaveis
   ============================================================ */
.copa-cta {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(ellipse at top left,  rgba(245,182,26,.25), transparent 55%),
    radial-gradient(ellipse at bottom right, rgba(45,79,184,.28), transparent 55%),
    linear-gradient(135deg, #0E2A6C 0%, #1A1F4A 50%, #4A1F8C 100%);
  padding: 40px 0 44px;
  color: #fff;
  border-block: 3px solid transparent;
  border-image: linear-gradient(90deg, #C82834, #F37A1F, #F5B61A, #A8D60C, #2D4FB8, #4A1F8C) 1;
}
.copa-cta__ribbon {
  position: absolute;
  inset: 0 0 auto 0;
  height: 6px;
  background: linear-gradient(90deg,
    #C82834 0%, #C82834 16.6%,
    #F37A1F 16.6%, #F37A1F 33.2%,
    #F5B61A 33.2%, #F5B61A 49.8%,
    #A8D60C 49.8%, #A8D60C 66.4%,
    #2D4FB8 66.4%, #2D4FB8 83%,
    #4A1F8C 83%, #4A1F8C 100%);
}
.copa-cta__container {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 32px;
  align-items: center;
}
.copa-cta__badge {
  display: inline-block;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 1.2px;
  padding: 5px 12px;
  background: rgba(245,182,26,.18);
  border: 1px solid rgba(245,182,26,.4);
  border-radius: 999px;
  margin-bottom: 14px;
  color: #F5B61A;
}
.copa-cta__title {
  font-family: 'Anton', 'Inter', sans-serif;
  font-weight: 400;
  font-size: clamp(28px, 4.5vw, 44px);
  line-height: 1.05;
  letter-spacing: .5px;
  text-transform: uppercase;
  margin: 0 0 10px;
}
.copa-cta__title span {
  color: #F5B61A;
  display: inline-block;
}
.copa-cta__desc {
  font-size: 15px;
  color: rgba(255,255,255,.78);
  margin: 0 0 22px;
  max-width: 640px;
}
.copa-cta__countdown {
  display: flex;
  gap: 10px;
  margin-bottom: 22px;
}
.copa-cta__cd-cell {
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 8px;
  padding: 8px 14px;
  text-align: center;
  min-width: 64px;
  backdrop-filter: blur(4px);
}
.copa-cta__cd-num {
  display: block;
  font-family: 'Anton', 'Inter', sans-serif;
  font-size: 26px;
  font-weight: 400;
  color: #F5B61A;
  line-height: 1;
  letter-spacing: .5px;
}
.copa-cta__cd-lbl {
  font-size: 10px;
  font-weight: 700;
  color: rgba(255,255,255,.6);
  text-transform: uppercase;
  letter-spacing: .8px;
  margin-top: 2px;
  display: block;
}
.copa-cta__btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 28px;
  background: linear-gradient(135deg, #C82834, #F37A1F);
  color: #fff;
  border-radius: 999px;
  font-weight: 800;
  font-size: 15px;
  text-decoration: none;
  letter-spacing: .3px;
  box-shadow: 0 6px 22px rgba(200,40,52,.45);
  transition: transform .15s, box-shadow .15s;
}
.copa-cta__btn:hover {
  transform: translateY(-2px) scale(1.02);
  box-shadow: 0 10px 28px rgba(243,122,31,.55);
}
.copa-cta__flags {
  display: grid;
  grid-template-columns: repeat(3, 56px);
  gap: 10px;
  align-content: center;
}
.copa-cta__flags img {
  width: 56px;
  height: 56px;
  object-fit: contain;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 50%;
  padding: 6px;
  transition: transform .25s;
}
.copa-cta__flags img:hover { transform: scale(1.15); }
@media (max-width: 700px) {
  .copa-cta { padding: 28px 0 32px; }
  .copa-cta__container { grid-template-columns: 1fr; gap: 22px; }
  .copa-cta__flags { grid-template-columns: repeat(6, 1fr); justify-items: center; }
  .copa-cta__flags img { width: 44px; height: 44px; padding: 4px; }
  .copa-cta__countdown { flex-wrap: wrap; }
  .copa-cta__cd-cell { min-width: 54px; padding: 6px 10px; }
  .copa-cta__cd-num { font-size: 22px; }
  .copa-cta__btn { width: 100%; justify-content: center; }
}

/* ============================================================
   Copa do Mundo — paleta + tipografia inspiradas no guideline
   FIFA 2026 (sem usar assets proprietários: logo/PWC26/patterns).
   ============================================================ */
:root {
  --copa-red:        #C82834;
  --copa-red-dark:   #7B1E2E;
  --copa-blue:       #2D4FB8;
  --copa-blue-dark:  #0E2A6C;
  --copa-green:      #1B5E40;
  --copa-lime:       #A8D60C;
  --copa-orange:     #F37A1F;
  --copa-gold:       #F5B61A;
  --copa-purple:     #4A1F8C;
  --copa-pink:       #F4A6C0;
}

/* Hero: H1 com fonte Anton (substitui Inter pra evocar PWC26) */
body.is-copa .hero__title {
  font-family: 'Anton', 'Inter', sans-serif;
  font-weight: 400;            /* Anton só vem em um peso */
  letter-spacing: .5px;
  text-transform: uppercase;
  line-height: 1.05;
}
body.is-copa .section__title {
  font-family: 'Anton', 'Inter', sans-serif;
  font-weight: 400;
  letter-spacing: .8px;
  text-transform: uppercase;
}

/* Ribbon multicolorido no rodapé do hero (faixa fina com 6 cores Copa) */
body.is-copa .hero {
  position: relative;
}
body.is-copa .hero::after {
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 4px;
  background: linear-gradient(90deg,
    var(--copa-red)    0%, var(--copa-red)    16.6%,
    var(--copa-orange) 16.6%, var(--copa-orange) 33.2%,
    var(--copa-gold)   33.2%, var(--copa-gold)   49.8%,
    var(--copa-lime)   49.8%, var(--copa-lime)   66.4%,
    var(--copa-blue)   66.4%, var(--copa-blue)   83%,
    var(--copa-purple) 83%,   var(--copa-purple) 100%);
  pointer-events: none;
}

/* Faixa de seleções: hover acende a cor "Copa" do chip,
   ciclando pelas 6 cores via :nth-child para dar a vibe multicolorida. */
body.is-copa .club-chip {
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
  border: 2px solid transparent;
  border-radius: 12px;
}
body.is-copa .club-chip__abbr {
  font-size: 10px;
  letter-spacing: .02em;
  text-align: center;
  line-height: 1.15;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
/* Copa: 48 seleções com nome completo — 8 colunas (6 linhas) e remove o min-width que força overflow */
body.is-copa .clubes-bar__list {
  grid-template-columns: repeat(8, minmax(0, 1fr));
  min-width: 0;
}
@media (max-width: 900px) {
  body.is-copa .clubes-bar__list { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  body.is-copa .clubes-bar__list { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
body.is-copa .club-chip:hover,
body.is-copa .club-chip:focus {
  transform: translateY(-2px);
  box-shadow: 0 4px 14px rgba(0,0,0,.12);
}
body.is-copa .club-chip:nth-child(6n+1):hover { border-color: var(--copa-red); }
body.is-copa .club-chip:nth-child(6n+2):hover { border-color: var(--copa-orange); }
body.is-copa .club-chip:nth-child(6n+3):hover { border-color: var(--copa-gold); }
body.is-copa .club-chip:nth-child(6n+4):hover { border-color: var(--copa-lime); }
body.is-copa .club-chip:nth-child(6n+5):hover { border-color: var(--copa-blue); }
body.is-copa .club-chip:nth-child(6n):hover   { border-color: var(--copa-purple); }

/* Header do confronto colapsado: borda inferior multicolorida quando expandido */
body.is-copa .confronto:not(.confronto--collapsed) .confronto__header {
  border-bottom: 2px solid transparent;
  border-image: linear-gradient(90deg,
    var(--copa-red), var(--copa-orange), var(--copa-gold),
    var(--copa-lime), var(--copa-blue), var(--copa-purple)) 1;
}

/* Ribbon multicolorido no topo do header (espelha o do rodapé do hero).
   Cobre `.header` (index) e `.cp-header` (páginas de clube/jogador). */
body.is-copa .header,
body.is-copa .cp-header {
  position: relative;
}
body.is-copa .header::before,
body.is-copa .cp-header::before {
  content: '';
  position: absolute;
  left: 0; right: 0; top: 0;
  height: 3px;
  background: linear-gradient(90deg,
    var(--copa-red)    0%,    var(--copa-red)    16.6%,
    var(--copa-orange) 16.6%, var(--copa-orange) 33.2%,
    var(--copa-gold)   33.2%, var(--copa-gold)   49.8%,
    var(--copa-lime)   49.8%, var(--copa-lime)   66.4%,
    var(--copa-blue)   66.4%, var(--copa-blue)   83%,
    var(--copa-purple) 83%,   var(--copa-purple) 100%);
  pointer-events: none;
  z-index: 2;
}

/* Hero stats: borda superior colorida em cada um (6 cores ciclando) */
body.is-copa .hero-stat {
  border-top: 3px solid var(--copa-blue);
  padding-top: 10px;
}
body.is-copa .hero-stat:nth-child(4n+1) { border-top-color: var(--copa-red); }
body.is-copa .hero-stat:nth-child(4n+2) { border-top-color: var(--copa-gold); }
body.is-copa .hero-stat:nth-child(4n+3) { border-top-color: var(--copa-lime); }
body.is-copa .hero-stat:nth-child(4n)   { border-top-color: var(--copa-purple); }

/* Hero badge: gradient Copa sutil */
body.is-copa .hero__badge {
  background: linear-gradient(90deg, var(--copa-red), var(--copa-orange));
  color: #fff;
  border: none;
}
body.is-copa .hero__badge-dot {
  background: #fff;
}

/* Section tags (tags "Clique na bandeira", "Confrontos da rodada"): rotação de cores */
body.is-copa .section__tag {
  background: var(--copa-red);
  color: #fff;
  border: none;
}
body.is-copa #clubes .section__tag       { background: var(--copa-blue); }
body.is-copa #confrontos .section__tag   { background: var(--copa-orange); }
body.is-copa .section__tag--light        { background: var(--copa-lime); color: #1a1a1a; }

/* Botão accent: usa a paleta Copa (laranja vibrante já está coerente; mas hover muda pra gold) */
body.is-copa .btn--accent {
  background: var(--copa-orange);
  border-color: var(--copa-orange);
}
body.is-copa .btn--accent:hover {
  background: var(--copa-gold);
  border-color: var(--copa-gold);
}

/* Confrontos: barra lateral esquerda colorida (varia por nº do card) */
body.is-copa .confronto {
  border-left: 4px solid transparent;
  transition: border-left-color .2s ease;
}
body.is-copa .confronto:nth-child(6n+1) { border-left-color: var(--copa-red); }
body.is-copa .confronto:nth-child(6n+2) { border-left-color: var(--copa-orange); }
body.is-copa .confronto:nth-child(6n+3) { border-left-color: var(--copa-gold); }
body.is-copa .confronto:nth-child(6n+4) { border-left-color: var(--copa-lime); }
body.is-copa .confronto:nth-child(6n+5) { border-left-color: var(--copa-blue); }
body.is-copa .confronto:nth-child(6n)   { border-left-color: var(--copa-purple); }

/* Tag de rodada (no header do confronto) com fundo escuro Copa */
body.is-copa .confronto__rodada-tag {
  background: var(--copa-blue-dark);
  color: #fff;
}

/* Footer com ribbon no topo (espelha o do hero) */
body.is-copa .footer {
  position: relative;
}
body.is-copa .footer::before {
  content: '';
  position: absolute;
  left: 0; right: 0; top: 0;
  height: 3px;
  background: linear-gradient(90deg,
    var(--copa-purple) 0%,   var(--copa-purple) 16.6%,
    var(--copa-blue)   16.6%, var(--copa-blue)   33.2%,
    var(--copa-lime)   33.2%, var(--copa-lime)   49.8%,
    var(--copa-gold)   49.8%, var(--copa-gold)   66.4%,
    var(--copa-orange) 66.4%, var(--copa-orange) 83%,
    var(--copa-red)    83%,   var(--copa-red)    100%);
  pointer-events: none;
}

/* Página de clube — _gerarHtmlClube usa .cp-* */
body.is-copa .cp-club-head h1 {
  font-family: 'Anton', 'Inter', sans-serif;
  font-weight: 400;
  letter-spacing: .8px;
  text-transform: uppercase;
}
body.is-copa .cp-sec-label {
  color: var(--copa-blue-dark);
}
/* Painel escuro de jogadores titulares: label precisa de cor clara, não azul-escuro */
body.is-copa .cp-players-col .cp-sec-label {
  color: rgba(255, 255, 255, .65);
}
/* Botão toggle (Cartola/Sofa) — repinta com vermelho Copa quando ativo */
body.is-copa .pitch-toggle--above .pitch-toggle__btn--active {
  background: var(--copa-red);
}
body.is-copa .cp-toggle-btn {
  color: var(--copa-orange);
  border-color: var(--copa-orange);
  background: rgba(243,122,31,.12);
}
body.is-copa .cp-toggle-btn:hover {
  background: rgba(243,122,31,.25);
  border-color: var(--copa-gold);
  color: var(--copa-gold);
}