/* ═══════════════════════════════════════════════════
   SCOUT CLUBS — 06-broadcast.css  ·  v1.19
   PELE BROADCAST (protótipo aprovado) — camada sobre a base.
   Carregado por último: sobrescreve fontes, inclina display,
   lower-thirds nas partidas. Cores do clube via --g1/--g2
   (aplicadas pelo 07-gate.js/applyClubColors).
   ═══════════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Anton&family=Chakra+Petch:wght@500;600;700&family=Archivo:wght@400;500;600;700&family=Oswald:wght@500;600;700&display=swap');

/* ── Tipografia broadcast ── */
:root{--club1:var(--g1);--club2:var(--g2);
  --fd:'Anton',sans-serif;
  --fc:'Chakra Petch',monospace;
  --fb:'Archivo',sans-serif;
  --bg:#0A0C10;--bg2:#12151C;--bg3:#181C25;
  --bdr:rgba(255,255,255,.07);
}
/* Inclinação de placar de TV nos elementos display */
.name-big,.section-title,.hero-main-wr,.hero-main-ved,.hero-main-tot,
.pd-val,.streak-val,.mc-goals,.mvp-stat-val,.mm-score-hero,.pcard-rating,
.mm-mvp-stat-v,.pcard-fut-stat-v,.cmp-val{
  transform:skewX(-6deg);display:inline-block;letter-spacing:.02em;
}
.section-title{font-family:var(--fd);font-size:22px;color:var(--t1)}
.section-title::after{content:'';display:block;height:2px;width:44px;background:var(--g1);margin-top:6px;transform:skewX(-6deg)}

/* ── HERO do clube (club-bar-v2) ── */
.club-bar-v2{background:linear-gradient(120deg,color-mix(in srgb,var(--club1) 16%,var(--bg2)),var(--bg2) 65%)!important;border:1px solid color-mix(in srgb,var(--club1) 35%,var(--bdr))!important;border-radius:16px!important;position:relative;overflow:hidden;clip-path:polygon(0 0,100% 0,calc(100% - 16px) 100%,0 100%)}
.club-bar-v2::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 15% 0%,color-mix(in srgb,var(--club1) 22%,transparent),transparent 60%);pointer-events:none}
.name-big{font-family:var(--fd)!important;font-size:clamp(30px,6vw,52px)!important;line-height:.95!important;color:var(--t1)!important}
.crest-big{border-radius:0!important;border:none!important;background:none!important;object-fit:contain!important;box-shadow:none!important;filter:drop-shadow(0 4px 16px rgba(0,0,0,.45))!important}
.sub-meta{font-family:var(--fc)!important;font-size:10px!important;letter-spacing:.2em!important;text-transform:uppercase;color:var(--t2)!important}
.badge{font-family:var(--fc)!important;font-size:9px!important;letter-spacing:.12em;clip-path:polygon(5px 0,100% 0,calc(100% - 5px) 100%,0 100%);border-radius:3px!important}

/* ── Números do hero de stats ── */
.hero-main-wr{font-family:var(--fd)!important;font-size:56px!important;color:var(--g1)!important}
.hero-main-ved{font-family:var(--fd)!important;font-size:26px!important}
.hero-main-tot{font-family:var(--fd)!important;font-size:34px!important}
.hero-main-lbl,.hero-main-wr-lbl{font-family:var(--fc)!important;font-size:9px!important;letter-spacing:.24em!important}
.pd-val{font-family:var(--fd)!important}

/* ── PARTIDAS como lower-thirds ── */
.mc-body{background:var(--bg2);border:1px solid var(--bdr);border-radius:10px;clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%);transition:transform .2s,border-color .2s;position:relative}
.mc-body:hover{transform:translateX(4px);border-color:color-mix(in srgb,var(--club1) 40%,var(--bdr))}
.mc-team-name{font-family:var(--fc)!important;font-size:13px!important;letter-spacing:.03em}
.mc-goals{font-family:var(--fd)!important;font-size:24px!important}
.mc-date{font-family:var(--fc)!important;letter-spacing:.1em}

/* ── Cards/valores diversos ── */
.pcard-rating,.mvp-stat-val,.streak-val{font-family:var(--fd)!important;color:var(--g1)!important}
.btn,.btn-ghost{font-family:var(--fc)!important;letter-spacing:.12em!important}
.modal{border:1px solid color-mix(in srgb,var(--club1) 25%,var(--bdr))!important;border-radius:16px!important}

/* Scrollbar e seleção nas cores do clube */
::selection{background:color-mix(in srgb,var(--club1) 30%,transparent)}
::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--club1) 50%,var(--bg3))}


/* ── v1.22: FAIXA DE LÍDER nos rankings ── */
.rank-row.leader{background:linear-gradient(100deg,color-mix(in srgb,var(--g1) 16%,var(--bg2)),var(--bg2) 70%);border:1px solid color-mix(in srgb,var(--g1) 40%,var(--bdr));border-radius:12px;padding:14px 14px!important;margin:-4px -6px 8px;position:relative;overflow:hidden;clip-path:polygon(0 0,100% 0,calc(100% - 12px) 100%,0 100%)}
.rank-row.leader::after{content:'LÍDER';position:absolute;right:8px;top:6px;font-family:var(--fd);font-size:34px;color:color-mix(in srgb,var(--g1) 12%,transparent);transform:skewX(-6deg);pointer-events:none}
.rank-row.leader .rank-pos{color:var(--g1)!important;font-size:26px}
.rank-row.leader .rank-name{font-size:15px;font-weight:700}
.rank-row.leader .rank-val{font-size:30px;color:var(--g1)!important}
.rank-title{font-family:var(--fc)!important}
.rank-val,.rank-pos{font-family:var(--fd)!important}

/* Escalação ideal — jogadores em cores do padrão, tokens broadcast */
.period-btn{font-family:var(--fc)!important;letter-spacing:.08em}

/* ── v1.23: TICKER HORIZONTAL no topo (só jogos do time) ── */
body.has-top-ticker{padding-top:44px}
#top-ticker{position:fixed;top:0;left:0;right:0;height:40px;z-index:60;display:flex;align-items:stretch;background:linear-gradient(180deg,var(--bg2),color-mix(in srgb,var(--bg2) 92%,#000));border-bottom:1px solid var(--bdr);backdrop-filter:blur(8px)}
.ttk-label{display:flex;align-items:center;padding:0 16px;font-family:var(--fc);font-size:9px;letter-spacing:.16em;color:var(--t3);background:var(--bg);border-right:1px solid var(--bdr);white-space:nowrap;flex:none;clip-path:polygon(0 0,100% 0,calc(100% - 10px) 100%,0 100%)}
.ttk-mask{flex:1;overflow:hidden;position:relative;-webkit-mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent);mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent)}
.ttk-track{display:inline-flex;align-items:center;height:100%;white-space:nowrap;animation:ttkScroll 46s linear infinite}
#top-ticker:hover .ttk-track{animation-play-state:paused}
@keyframes ttkScroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.ttk-item{display:inline-flex;align-items:center;gap:7px;padding:0 20px;position:relative;font-family:var(--fc);font-size:11px}
.ttk-item::after{content:'';position:absolute;right:0;top:50%;transform:translateY(-50%);width:1px;height:14px;background:var(--bdr)}
.ttk-res{font-family:var(--fd);font-size:13px;transform:skewX(-6deg)}
.ttk-item.w .ttk-res{color:var(--win)}.ttk-item.l .ttk-res{color:var(--loss)}.ttk-item.d .ttk-res{color:var(--draw)}
.ttk-me{color:var(--t2);font-weight:600}
.ttk-sc{font-family:var(--fd);font-size:14px;letter-spacing:.04em;transform:skewX(-6deg);color:var(--t1)}
.ttk-opp{color:var(--t2);font-weight:600}
@media(max-width:639px){.ttk-me{display:none}.ttk-item{gap:6px;padding:0 14px}}

/* ═══ v1.23: POLIMENTO GERAL DE LAYOUT ═══ */

/* Cartões de stat (gols pró/contra/saldo) — respiro e hover */
.hero-card{border-radius:14px!important;transition:transform .2s,border-color .2s}
.hero-card:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--g1) 30%,var(--bdr))}
.hero-val{font-family:var(--fd)!important;letter-spacing:.02em}
.hero-lbl{font-family:var(--fc)!important;font-size:8.5px!important;letter-spacing:.18em!important}

/* Abas — pílula mais definida, aba ativa com acento */
.tab{font-family:var(--fc)!important;letter-spacing:.08em;transition:.2s}
.tab.active{position:relative}
.tab.active::after{content:'';position:absolute;left:20%;right:20%;bottom:6px;height:2px;background:var(--g1);border-radius:2px}

/* Filtros de período (Todos/Últ 5/Últ 10) — chips broadcast */
.period-btn{font-family:var(--fc)!important;letter-spacing:.06em;border-radius:8px!important;transition:.2s}
.period-btn.active{background:var(--g1)!important;color:#06080B!important;font-weight:700}

/* Gráficos circulares — anel mais grosso e limpo já vem do base; só a fonte central */
.ring-val{font-family:var(--fd)!important}
.ring-lbl{font-family:var(--fc)!important;font-size:8px!important;letter-spacing:.14em}

/* Escalação: campo mais "gramado", tokens com brilho e nome legível */
.xi-field{background:linear-gradient(180deg,#0d1712,#0a130e 55%,#0d1712)!important;border-radius:16px!important;border:1px solid var(--bdr)!important}
.xi-player .xi-badge,.xi-token{box-shadow:0 6px 16px -6px rgba(0,0,0,.7)}
.xi-name{font-family:var(--fc)!important;font-size:8.5px!important;letter-spacing:.02em;background:rgba(10,12,16,.82)!important;border-radius:4px;padding:3px 6px!important}
.xi-rating{font-family:var(--fd)!important}

/* Cartões de jogador (elenco) */
.pcard{border-radius:14px!important;transition:transform .25s,border-color .25s}
.pcard:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--g1) 40%,var(--bdr))}
.pcard-name{font-family:var(--fd)!important;transform:skewX(-6deg);letter-spacing:.02em}
.pcard-pos{font-family:var(--fc)!important;letter-spacing:.14em}

/* Troféus — leve destaque no hover */
.trophy-card{transition:transform .2s,border-color .2s}
.trophy-card:hover{transform:translateY(-3px)}

/* Modais — cabeçalho mais broadcast */
.modal-title,.md-section-title{font-family:var(--fc)!important;letter-spacing:.1em}

/* Botão de export flutuante — nas cores da marca */
.export-btn{background:var(--g1)!important;color:#06080B!important;box-shadow:0 10px 30px -8px color-mix(in srgb,var(--g1) 55%,transparent)!important}

/* Badges/pills do hero (VERTICAL·TRANSIÇÃO etc.) já inclinados; ajuste fino de peso */
.badge{font-weight:600}

/* Espaçamento das seções pra dar respiro vertical */
.section-title{margin-bottom:14px}

/* ═══ v1.24: IDENTIDADE EQUILIBRADA (mock aprovado) ═══ */
/* HERO veste a cor do time (forte), com V/E/D universais no resto */
.club-bar-v2{border:1px solid color-mix(in srgb,var(--club1) 50%,var(--bdr))!important;
  clip-path:polygon(0 0,100% 0,calc(100% - 20px) 100%,0 100%)}
.club-bar-v2::before{background:linear-gradient(115deg,color-mix(in srgb,var(--club1) 34%,#0b0f18) 0%,color-mix(in srgb,var(--club1) 8%,#0b0f18) 45%,#0b0f18 100%)!important}
.club-bar-v2::after{background:radial-gradient(circle,color-mix(in srgb,var(--club1) 40%,transparent),transparent 60%)!important}
.club-bar-v2 .crest-big{background:none!important;border:none!important;color:var(--club-ink,#fff)!important;box-shadow:none!important;object-fit:contain!important}
.club-bar-v2 .name-big{background:linear-gradient(100deg,var(--t1) 60%,var(--club2));-webkit-background-clip:text;background-clip:text;color:transparent!important;text-shadow:none!important}
.club-bar-v2-accent{background:linear-gradient(90deg,var(--club1),var(--club2))!important;opacity:1!important}
.club-bar-v2 .badge.win{background:color-mix(in srgb,var(--club1) 18%,transparent)!important;border:1px solid color-mix(in srgb,var(--club1) 40%,transparent)!important;color:var(--club2)!important}

/* ABAS ativas na cor do time */
.tab.active,.tab.on{border-color:color-mix(in srgb,var(--club1) 55%,var(--bdr))!important;background:linear-gradient(180deg,color-mix(in srgb,var(--club1) 14%,var(--bg2)),var(--bg2))!important}
.tab.active::after{background:var(--club1)!important}

/* CARDS DE ELENCO — rótulo de tier discreto (não pinta o card).
   Neutraliza qualquer fundo dourado/prata herdado. */
.pcard{background:var(--bg2)!important}
.pcard-rating{color:var(--g1)!important}
.pcard-rating.mid{color:var(--draw)!important}.pcard-rating.low{color:var(--loss)!important}
.pcard-pos{background:color-mix(in srgb,var(--club1) 10%,transparent)!important;color:var(--club2)!important}
.pcard::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--club1),var(--club2))}

/* Faixa de líder e valores de ranking na cor do time */
.rank-row.leader{background:linear-gradient(100deg,color-mix(in srgb,var(--club1) 20%,var(--bg2)),var(--bg2) 65%)!important;border-color:color-mix(in srgb,var(--club1) 45%,var(--bdr))!important}
.rank-row.leader::after{color:color-mix(in srgb,var(--club1) 12%,transparent)!important}

/* Filtro de período ativo e botão export na cor do time */
.period-btn.active{background:var(--club1)!important;color:var(--club-ink,#06080B)!important}
.export-btn{background:var(--club1)!important;color:var(--club-ink,#06080B)!important;box-shadow:0 10px 30px -8px color-mix(in srgb,var(--club1) 55%,transparent)!important}

/* Stat cards: número segue universal (verde/vermelho), hover na cor do time */
.hero-card:hover{border-color:color-mix(in srgb,var(--club1) 40%,var(--bdr))!important}



/* v1.28: ocultar exportar imagem por enquanto */
.export-btn{display:none!important}

/* v1.28: abas todas na horizontal */
.tab-groups{grid-template-columns:repeat(4,1fr)!important}
@media(max-width:639px){.tab-groups{grid-template-columns:repeat(4,1fr)!important;gap:4px}.tab-group{padding:10px 4px!important}.tab-group-label{font-size:8px!important}}