/* Tema "Estádio": placar eletrônico. A faixa do placar é sempre escura, com a cor de cada clube
   vindo do seu lado; números em DIN condensada grande; cartões com fio na cor dos dois times. No modo
   claro só o conteúdo fica claro — o placar continua de estádio. */
:root {
  --page: #e8eaee; --surface: #ffffff; --surface-2: #f2f4f7; --ink: #0f1115; --ink-2: #454b55; --muted: #6a717c;
  --grid: #e0e3e8; --axis: #c2c7cf; --ring: rgba(15, 17, 21, 0.08); --raio: 6px;
  --placar: #0b0d10; --placar-ink: #f4f6f8; --placar-ink-2: #a8afb9;
  /* dígitos do placar: branco quente fixo. Não usamos amarelo/âmbar porque clubes amarelos ou dourados
     (Mirassol, Santos dourado no FotMob) confundiriam o número com a cor do time; um neutro nunca colide. */
  --led: #fff2d8; --led-brilho: rgba(255, 236, 200, 0.35); --led-apagado: #8a8478;
}
@media (prefers-color-scheme: dark) {
  :root { --page: #08090b; --surface: #12151a; --surface-2: #1a1e24; --ink: #f2f4f7; --ink-2: #b4bbc5; --muted: #858d98;
    --grid: #232830; --axis: #343b45; --ring: rgba(255, 255, 255, 0.06); --placar: #050608; }
}
.topo-site { background: var(--placar); border: 0; }
.topo-site, .topo-site a, .marca { color: var(--placar-ink); }
.topo-site .contexto { color: var(--placar-ink-2); }

/* ---------- lista: placares de estádio ---------- */
.comp-bt { color: var(--placar-ink-2); font-family: var(--display); font-size: 1.05rem; letter-spacing: 0.02em; padding-top: 14px; }
.comp-bt[aria-pressed="true"] { color: #fff; border-bottom-color: #fff; }
.cab-indice h1 { font-family: var(--display); font-size: 2rem; letter-spacing: 0.01em; font-weight: 700; }
.navegador { background: var(--page); border: 0; }
.nav-sel select, .nav-bt { border-radius: var(--raio); }
.nav-sel select { font-family: var(--display); font-size: 1.15rem; letter-spacing: 0.02em; }
.rodada-tit { font-family: var(--display); font-size: 1.2rem; letter-spacing: 0.02em; }
.jogo {
  position: relative; overflow: hidden; border: 0; border-radius: var(--raio); background: var(--surface); padding: 10px 14px 10px 16px;
  grid-template-columns: 3rem 1fr auto;
}
.jogo::before, .jogo::after { content: ""; position: absolute; left: 0; width: 4px; height: 50%; }
.jogo::before { top: 0; background: var(--cm-claro, var(--axis)); }
.jogo::after { bottom: 0; background: var(--cv-claro, var(--axis)); }
@media (prefers-color-scheme: dark) {
  .jogo { background: linear-gradient(90deg, #14181e, #0f1216); }
  .jogo::before { background: var(--cm-escuro, var(--axis)); }
  .jogo::after { background: var(--cv-escuro, var(--axis)); }
}
.jq { border-right-color: var(--grid); font-family: var(--display); font-size: 0.95rem; letter-spacing: 0.02em; }
.jt { font-size: 0.95rem; gap: 10px; }
.jt .escudo { width: 24px; height: 24px; }
.jg { font-family: var(--display); font-size: 1.45rem; min-width: 1.6ch; text-align: center; background: #000; color: var(--led); border-radius: 3px; padding: 2px 4px 0; line-height: 1.1; }
.jg.perde { color: #8d939b; }
@media (prefers-color-scheme: light) { .jg { background: #0f1115; } }

/* ---------- partida: faixa de placar ---------- */
/* A faixa é escura sempre: a cor de fundo vem separada do brilho, então se as cores dos clubes não
   existirem (clubes.json ausente) o degradê cai para um neutro e o fundo continua escuro. */
:root { --mand-id: #3d4654; --vis-id: #3d4654; }
.hero {
  background-color: var(--placar);
  background-image:
    radial-gradient(120% 140% at 0% 50%, color-mix(in srgb, var(--mand-id) 45%, transparent) 0%, transparent 55%),
    radial-gradient(120% 140% at 100% 50%, color-mix(in srgb, var(--vis-id) 45%, transparent) 0%, transparent 55%);
  color: var(--placar-ink); border: 0;
}
/* texto sobre o brilho: sombra escura curta garante a leitura mesmo sobre cor clara de clube */
.hero .nome, .hero .marcadores, .hero .hero-quando, .hero .int { text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6), 0 0 12px rgba(0, 0, 0, 0.45); }
.hero-int { padding-top: 22px; padding-bottom: 22px; }
.placar-grade { align-items: start; gap: 8px 30px; }
.gols { padding-top: 14px; }
.equipe, .equipe.m { align-items: center; text-align: center; }
.equipe .escudo-wrap { width: 108px; height: 108px; border-radius: 50%; display: grid; place-items: center;
  background: radial-gradient(closest-side, rgba(255,255,255,.18), rgba(255,255,255,.04)); box-shadow: 0 0 0 1px rgba(255,255,255,.12) inset; }
.equipe .escudo { width: 78px; height: 78px; filter: drop-shadow(0 4px 10px rgba(0,0,0,.5)); }
.equipe .nome { font-family: var(--display); font-size: 1.8rem; letter-spacing: 0.02em; margin-top: 10px; color: var(--placar-ink); font-weight: 700; }
.marcadores { color: var(--placar-ink-2); }
.equipe .marcadores li { justify-content: center; flex-direction: row; }
.marcadores .ic circle { fill: var(--placar-ink-2); }
.gols .n { font-size: 6.2rem; color: var(--led); text-shadow: 0 0 18px var(--led-brilho), 0 0 2px rgba(255, 245, 225, 0.8);
  background: #000; border-radius: 10px; padding: 10px 18px 2px; box-shadow: inset 0 0 0 1px rgba(255,255,255,.08); }
.gols .n .x { color: var(--led-apagado); text-shadow: none; }
.gols .int { color: var(--placar-ink-2); margin-top: 10px; }
.hero-quando { color: var(--placar-ink-2); margin-top: 12px; }
@media (max-width: 560px) {
  .equipe .escudo-wrap { width: 72px; height: 72px; } .equipe .escudo { width: 52px; height: 52px; }
  .equipe .nome { font-size: 1.25rem; } .gols .n { font-size: 3.6rem; padding: 8px 10px 0; }
  .placar-grade { gap: 6px 10px; }
}

/* abas grudadas na faixa escura */
.barra-abas { background: var(--placar); border: 0; }
.abas [role="tab"] { color: var(--placar-ink-2); font-family: var(--display); font-size: 1.12rem; letter-spacing: 0.02em; padding-top: 13px; }
.abas [role="tab"]:hover { color: #fff; }
.abas [role="tab"][aria-selected="true"] { color: #fff; border-bottom-color: var(--led); font-weight: 700; }
.mini-volta, .mini-placar { color: var(--placar-ink); }
.mp-gols { background: #000; color: var(--led); }

/* cartões com fio nas duas cores */
.bloco { border: 0; border-radius: var(--raio); position: relative; overflow: hidden; padding-top: 22px; }
.bloco::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 4px; background: linear-gradient(90deg, var(--mand) 0 50%, var(--vis) 50% 100%); }
.bloco h2, .sec-cab h2 { font-family: var(--display); font-size: 1.45rem; letter-spacing: 0.02em; font-weight: 700; }
.narrativa { border-left: 0; }
.narrativa .n1 { font-size: 1.28rem; }
@media (max-width: 560px) { .narrativa .n1 { font-size: 1.1rem; } }
.gl-placar, .lplacar { background: #000; color: var(--led); border-radius: 3px; padding: 3px 6px 1px; }
.gol-linha { border-radius: var(--raio); border: 0; box-shadow: inset 4px 0 0 var(--cor-gol, var(--axis)); }
.lance .lmin { font-family: var(--display); font-size: 0.98rem; }
.est-linha .val { font-family: var(--display); font-size: 1.25rem; }
.nota-badge { border-radius: 3px; }
.seg button[aria-pressed="true"] { background: #000; color: var(--led); }
@media (prefers-color-scheme: dark) { .seg button[aria-pressed="true"] { background: var(--led); color: #000; } }

/* ---------- todas as abas ---------- */
/* gramado: verde escuro de estádio, com faixas de corte discretas; no claro, verde-acinzentado leve */
:root { --gramado: #e4ede5; --linha-campo: #b3c4b6; }
.campo-faixa { fill: rgba(0, 0, 0, 0.025); }
@media (prefers-color-scheme: dark) {
  :root { --gramado: #0f2016; --linha-campo: #2f4a37; }
  .campo-faixa { fill: rgba(255, 255, 255, 0.022); }
}
/* sub-abas na mesma voz das abas: DIN, sublinhado de LED */
.subs-cab { border-bottom-color: var(--grid); }
.sub-abas button { font-family: var(--display); font-size: 1.05rem; letter-spacing: 0.02em; }
.sub-abas button[aria-pressed="true"] { border-bottom-color: var(--ink); }
/* pílulas dos gols e controles da animação */
.gol-chip { border-radius: var(--raio); font-family: var(--display); font-size: 1rem; letter-spacing: 0.02em; }
.gol-chip[aria-pressed="true"] { background: #000; color: var(--led); border-color: #000; }
.gol-cartao h3 .min { color: var(--ink); }
.bt { border-radius: var(--raio); }
.play-grande { background: #000; color: var(--led); }
/* tabelas: cabeçalho em DIN, números alinhados */
th { font-family: var(--display); font-size: 0.92rem; letter-spacing: 0.02em; font-weight: 600; }
.tabela-jog .fixa { background: var(--surface); }
/* escalação e reservas */
.esc h3 { font-family: var(--display); font-size: 1.15rem; letter-spacing: 0.02em; }
.subtitulo { font-family: var(--display); font-size: 1.15rem; letter-spacing: 0.02em; }
/* boca do gol: trave e rede sobre o fundo do cartão */
.bocas .boca-tit { font-family: var(--display); font-size: 1.05rem; letter-spacing: 0.02em; }
/* escudo sem arquivo (clube estrangeiro, divisão inferior): disco com a sigla */
.escudo-sigla { background: var(--surface-2); color: var(--ink-2); box-shadow: inset 0 0 0 1px var(--axis); font-family: var(--display); }
.hero .escudo-sigla { background: rgba(255, 255, 255, 0.1); color: var(--placar-ink); box-shadow: inset 0 0 0 1px rgba(255,255,255,.25); }

/* ---------- lista de copas ---------- */
.grupo-tit { font-family: var(--display); font-size: 1.05rem; letter-spacing: 0.02em; color: var(--ink-2); }
.confronto { background: var(--surface); border: 0; border-radius: var(--raio); position: relative; overflow: hidden; padding-top: 8px; }
.confronto .jogo { background: var(--surface-2); }
@media (prefers-color-scheme: dark) { .confronto { background: #0c0e12; } .confronto .jogo { background: linear-gradient(90deg, #14181e, #0f1216); } }
.agregado { font-family: var(--display); font-size: 1.02rem; letter-spacing: 0.02em; }
.resumo-time { border: 0; border-radius: var(--raio); }
.fm { border-radius: 3px; font-family: var(--display); font-size: 0.85rem; }
.mes-tit { font-family: var(--display); font-size: 1.1rem; letter-spacing: 0.02em; }

/* correções da crítica final */
.hero .escudo-sigla { width: 78px !important; height: 78px !important; font-size: 26px !important; box-shadow: none; background: transparent; }
@media (max-width: 560px) {
  .hero .escudo-sigla { width: 52px !important; height: 52px !important; font-size: 18px !important; }
  .hero .marcadores .ic { display: none; }
  .gols { padding-top: 8px; }
  .comp-bt { font-size: 0.95rem; padding-left: 8px; padding-right: 8px; }
}

/* detalhe e painel no tema estádio */
.dlg-cab h2, .dlg-sec h3 { font-family: var(--display); letter-spacing: 0.02em; font-weight: 700; }
.dlg-cab h2 { font-size: 1.6rem; }
.dlg-sec h3 { font-size: 1.25rem; }
.dlg-cab { background: linear-gradient(90deg, var(--mand) 0 50%, var(--vis) 50% 100%) top / 100% 4px no-repeat, var(--surface); padding-top: 22px; }
.dlg-pesos tr.fam th { font-family: var(--display); font-size: 1rem; letter-spacing: 0.02em; }
