/* Site público dos campeonatos — TV Matapastu's. Cada campeonato pinta a página com as cores dele (--c1, --c2). */
:root {
  --c1: #ff5900; --c2: #6d0eaa;
  --fundo: #0f0a18; --card: #1a1326; --card2: #22192f; --linha: rgba(255,255,255,.08);
  --texto: #f6f2fb; --sutil: #a99db9; --verde: #2fd47a; --amarelo: #ffc53d; --vermelho: #ff4757;
  --raio: 18px; --sombra: 0 14px 40px rgba(0,0,0,.35);
  --titulo: "Barlow Condensed", "Arial Narrow", system-ui, sans-serif;
  --corpo: "Barlow", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; }
body { background: var(--fundo); color: var(--texto); font: 15px/1.45 var(--corpo); min-height: 100vh; padding-bottom: env(safe-area-inset-bottom);
  background-image: radial-gradient(1100px 600px at 100% -10%, color-mix(in srgb, var(--c2) 26%, transparent), transparent 60%),
                    radial-gradient(900px 500px at -10% 10%, color-mix(in srgb, var(--c1) 14%, transparent), transparent 60%);
  background-attachment: fixed; }
a { color: inherit; }
img { max-width: 100%; }
button { font: inherit; color: inherit; cursor: pointer; }

/* ---------- barra do topo */
.barra { position: sticky; top: 0; z-index: 20; display: flex; align-items: center; gap: 10px; padding: calc(10px + env(safe-area-inset-top)) 16px 10px;
  background: rgba(15,10,24,.82); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border-bottom: 1px solid var(--linha); }
.barra-marca { display: flex; align-items: center; gap: 10px; text-decoration: none; min-width: 0; flex: 1; }
.barra-marca img { width: 36px; height: 36px; border-radius: 10px; object-fit: contain; flex-shrink: 0; }
.barra-marca span { font: 800 20px/1 var(--titulo); letter-spacing: .5px; text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.barra-camps { display: flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 999px; border: 1px solid var(--linha); background: var(--card);
  font: 700 14px var(--corpo); flex-shrink: 0; }
.barra-camps i { font-style: normal; opacity: .7; }
@media (max-width: 440px) { .barra-camps span { display: none; } .barra-camps::before { content: "🏆"; } }
.menu-camps { position: fixed; z-index: 30; top: calc(62px + env(safe-area-inset-top)); right: 12px; left: 12px; max-width: 420px; margin-left: auto;
  background: var(--card2); border: 1px solid var(--linha); border-radius: var(--raio); box-shadow: var(--sombra); padding: 8px; max-height: 70vh; overflow: auto; }
.menu-camps a { display: flex; align-items: center; gap: 12px; padding: 10px; border-radius: 12px; text-decoration: none; }
.menu-camps a:hover, .menu-camps a.sel { background: rgba(255,255,255,.06); }
.menu-camps .mlogo { width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center; overflow: hidden; flex-shrink: 0; }
.menu-camps .mlogo img { width: 100%; height: 100%; object-fit: contain; }
.menu-camps b { display: block; font: 800 17px/1.1 var(--titulo); text-transform: uppercase; } .menu-camps small { color: var(--sutil); }

main { max-width: 1100px; margin: 0 auto; padding: 0 0 30px; }
.carregando { display: grid; place-items: center; gap: 12px; padding: 90px 20px; color: var(--sutil); }
.carregando span { width: 34px; height: 34px; border-radius: 50%; border: 3px solid var(--linha); border-top-color: var(--c1); animation: gira 1s linear infinite; }
@keyframes gira { to { transform: rotate(360deg); } }
.aviso, .vazio { text-align: center; color: var(--sutil); padding: 36px 16px; }
.secao { padding: 0 14px; margin-top: 22px; }
.secao > h2, .rotulo { font: 800 14px var(--titulo); text-transform: uppercase; letter-spacing: 2px; color: var(--sutil); margin: 0 4px 10px; display: flex; align-items: center; gap: 8px; }
.rotulo::before { content: ""; width: 4px; height: 14px; border-radius: 2px; background: var(--c1); }

/* ---------- página inicial */
.hero-home { padding: 34px 18px 10px; }
.hero-home h1 { font: 900 clamp(34px, 9vw, 64px)/.95 var(--titulo); text-transform: uppercase; letter-spacing: .5px; }
.hero-home h1 em { font-style: normal; background: linear-gradient(90deg, var(--c1), color-mix(in srgb, var(--c1) 40%, var(--c2))); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hero-home p { color: var(--sutil); max-width: 560px; margin-top: 10px; font-size: 16px; }
.grade-camps { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 14px; }
.camp-card { position: relative; display: block; text-decoration: none; border-radius: 22px; overflow: hidden; min-height: 210px; isolation: isolate;
  background: linear-gradient(135deg, var(--k1), var(--k2)); box-shadow: var(--sombra); transition: transform .2s; }
.camp-card:active { transform: scale(.985); } @media (hover: hover) { .camp-card:hover { transform: translateY(-3px); } }
.camp-card .cc-fundo { position: absolute; inset: 0; z-index: -2; background-size: cover; background-position: center; }
.camp-card::after { content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(180deg, rgba(10,6,16,calc(var(--esc) * .55)) 0%, rgba(10,6,16,calc(var(--esc) * .9 + .1)) 100%),
              linear-gradient(120deg, color-mix(in srgb, var(--k1) 45%, transparent), transparent 70%); }
.cc-topo { display: flex; justify-content: space-between; align-items: flex-start; padding: 16px; }
.cc-logo { width: 74px; height: 74px; border-radius: 18px; background: rgba(255,255,255,.12); display: grid; place-items: center; overflow: hidden; backdrop-filter: blur(6px); }
.cc-logo img { max-width: 86%; max-height: 86%; width: auto; height: auto; object-fit: contain; filter: drop-shadow(0 4px 10px rgba(0,0,0,.35)); }
.cc-logo b { font: 900 26px var(--titulo); }
.cc-corpo { padding: 0 16px 16px; }
.cc-corpo h3 { font: 900 30px/.98 var(--titulo); text-transform: uppercase; letter-spacing: .3px; text-shadow: 0 2px 12px rgba(0,0,0,.4); }
.cc-corpo .cc-sub { color: rgba(255,255,255,.82); font-size: 14px; margin-top: 4px; }
.cc-prog { height: 5px; border-radius: 3px; background: rgba(255,255,255,.2); margin-top: 12px; overflow: hidden; }
.cc-prog i { display: block; height: 100%; background: #fff; border-radius: 3px; }
.cc-prox { margin-top: 10px; font-size: 13px; color: rgba(255,255,255,.88); }
.cc-vivo { margin-top: 10px; display: inline-flex; align-items: center; gap: 10px; padding: 7px 12px; border-radius: 12px; background: rgba(0,0,0,.4); font: 800 18px var(--titulo); }
.chip { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 999px; font: 800 12px var(--corpo); letter-spacing: .8px; text-transform: uppercase;
  background: rgba(0,0,0,.35); color: #fff; backdrop-filter: blur(6px); white-space: nowrap; }
.chip.vivo { background: var(--vermelho); } .chip.vivo::before, .ponto::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #fff; animation: pisca 1.2s infinite; }
.chip.encerrado { background: rgba(255,255,255,.18); } .chip.em_breve { background: color-mix(in srgb, var(--amarelo) 85%, #000); color: #1b1300; }
@keyframes pisca { 50% { opacity: .25; } }
.sobre-site { background: var(--card); border-radius: var(--raio); padding: 18px; color: var(--sutil); white-space: pre-line; }
.contatos { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 12px; }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 16px; border-radius: 14px; border: 0; text-decoration: none; font: 700 15px var(--corpo);
  background: var(--card2); color: var(--texto); border: 1px solid var(--linha); }
.btn.forte { background: var(--c1); color: #fff; border-color: transparent; }
.btn.yt { background: #ff0033; color: #fff; border-color: transparent; } .btn.zap { background: #1faa59; color: #fff; border-color: transparent; }
.chamada { margin: 26px 14px 0; padding: 18px; border-radius: var(--raio); background: linear-gradient(120deg, color-mix(in srgb, var(--c1) 22%, var(--card)), var(--card));
  border: 1px solid var(--linha); display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between; }
.chamada p { font: 700 17px var(--corpo); max-width: 560px; }

/* ---------- capa do campeonato */
.capa { position: relative; isolation: isolate; overflow: hidden; padding: 26px 18px 22px; min-height: 230px; display: flex; flex-direction: column; justify-content: flex-end;
  background: linear-gradient(135deg, var(--c1), var(--c2)); }
@media (min-width: 760px) { .capa { border-radius: 0 0 28px 28px; min-height: 300px; padding: 40px 34px 30px; } }
.capa-fundo { position: absolute; inset: 0; z-index: -2; background-size: cover; background-position: center; transform: scale(1.03); }
.capa::after { content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(180deg, rgba(12,7,20,calc(var(--esc) * .45)) 0%, rgba(12,7,20,calc(var(--esc) * .85 + .15)) 100%),
              linear-gradient(110deg, color-mix(in srgb, var(--c1) 55%, transparent) 0%, transparent 55%); }
.capa-linha { display: flex; align-items: center; gap: 16px; }
.capa-logo { width: 96px; height: 96px; border-radius: 24px; background: rgba(255,255,255,.12); display: grid; place-items: center; overflow: hidden; flex-shrink: 0;
  box-shadow: 0 10px 30px rgba(0,0,0,.35); backdrop-filter: blur(6px); }
.capa-logo img { max-width: 86%; max-height: 86%; width: auto; height: auto; object-fit: contain; } .capa-logo b { font: 900 36px var(--titulo); }
.capa-logo, .cc-logo { display: flex; align-items: center; justify-content: center; }   /* logo em pé (escudo) não estoura a caixa */
@media (min-width: 760px) { .capa-logo { width: 130px; height: 130px; border-radius: 30px; } }
.capa h1 { font: 900 clamp(32px, 8vw, 62px)/.92 var(--titulo); text-transform: uppercase; text-shadow: 0 3px 18px rgba(0,0,0,.45); }
.capa .temp { font: 800 16px var(--titulo); letter-spacing: 3px; color: rgba(255,255,255,.85); margin-top: 6px; text-transform: uppercase; }
.capa-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.capa-acoes { position: absolute; top: 14px; right: 14px; display: flex; gap: 8px; }
.capa-acoes button { width: 40px; height: 40px; border-radius: 50%; border: 0; background: rgba(0,0,0,.35); backdrop-filter: blur(6px); display: grid; place-items: center; font-size: 18px; }

/* ---------- abas */
.abas { position: sticky; top: calc(56px + env(safe-area-inset-top)); z-index: 10; display: flex; gap: 6px; overflow-x: auto; padding: 10px 14px; scrollbar-width: none;
  background: linear-gradient(var(--fundo) 70%, transparent); }
.abas::-webkit-scrollbar { display: none; }
.abas button { flex: 0 0 auto; padding: 9px 16px; border-radius: 999px; border: 1px solid var(--linha); background: var(--card); color: var(--sutil); font: 700 14px var(--corpo); }
.abas button.sel { background: var(--c1); border-color: transparent; color: #fff; box-shadow: 0 6px 18px color-mix(in srgb, var(--c1) 40%, transparent); }

/* ---------- ao vivo */
.av { margin: 16px 14px 0; border-radius: 22px; padding: 16px; background: linear-gradient(140deg, color-mix(in srgb, var(--c2) 55%, #160c22), #1a0d18);
  border: 1px solid rgba(255,71,87,.45); box-shadow: 0 14px 40px color-mix(in srgb, var(--c1) 22%, transparent); }
.av-topo { display: flex; justify-content: space-between; align-items: center; gap: 10px; font-size: 13px; color: var(--sutil); margin-bottom: 12px; }
.av-placar { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 8px; text-align: center; }
.av-placar b { display: block; font: 800 16px/1.1 var(--titulo); margin-top: 8px; text-transform: uppercase; }
.av-placar .n { font: 900 52px/1 var(--titulo); letter-spacing: 2px; white-space: nowrap; }
.av-tempo { text-align: center; color: var(--amarelo); font: 800 16px var(--titulo); letter-spacing: 1px; margin-top: 4px; }
.av-gols { margin-top: 12px; display: grid; grid-template-columns: 1fr 1fr; gap: 4px 14px; font-size: 13px; color: var(--sutil); } .av-gols div:nth-child(even) { text-align: right; }
.av .btn { width: 100%; margin-top: 14px; }
.esc { width: 28px; height: 28px; object-fit: contain; flex-shrink: 0; display: inline-block; }
.esc.g { width: 64px; height: 64px; } .esc.m { width: 44px; height: 44px; }
.esc-ini { display: inline-grid; place-items: center; border-radius: 50%; background: var(--card2); font: 800 11px var(--titulo); color: var(--sutil); }
.esc-ini.g { font-size: 22px; } .esc-ini.m { font-size: 16px; }

/* ---------- destaque do próximo jogo */
.prox { margin: 16px 14px 0; border-radius: var(--raio); padding: 14px 16px; background: var(--card); border: 1px solid var(--linha); display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 10px; text-align: center; }
.prox .r { grid-column: 1 / -1; font: 800 12px var(--titulo); letter-spacing: 2px; color: var(--c1); text-transform: uppercase; }
.prox b { display: block; font: 800 16px var(--titulo); text-transform: uppercase; margin-top: 6px; } .prox .x { font: 800 14px var(--corpo); color: var(--sutil); }

/* ---------- jogos */
.jogo { display: grid; grid-template-columns: 1fr auto 1fr; gap: 8px; align-items: center; padding: 12px 14px; border-radius: 16px; background: var(--card); margin-bottom: 8px; border: 1px solid transparent; }
.jogo .t { display: flex; align-items: center; gap: 9px; font-weight: 700; min-width: 0; } .jogo .t span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.jogo .t.f { justify-content: flex-end; text-align: right; } .jogo .t.perd span { color: var(--sutil); font-weight: 600; }
.jogo .m { text-align: center; min-width: 80px; } .jogo .m .pl { font: 900 24px var(--titulo); letter-spacing: 1px; } .jogo .m small { display: block; color: var(--sutil); font-size: 11px; }
.jogo .m .ag { font: 700 13px var(--corpo); color: var(--sutil); } .jogo.vivo-j { border-color: rgba(255,71,87,.6); }
.jogo .num { display: none; }
@media (min-width: 760px) { .lista-jogos { display: grid; grid-template-columns: 1fr 1fr; gap: 0 10px; } }

/* ---------- tabela */
.tab-wrap { background: var(--card); border-radius: var(--raio); overflow: hidden; margin-bottom: 12px; }
.tab { width: 100%; border-collapse: collapse; }
.tab th { font: 700 11px var(--corpo); color: var(--sutil); padding: 10px 4px; text-align: center; letter-spacing: .5px; } .tab th:nth-child(2) { text-align: left; }
.tab td { padding: 9px 4px; border-top: 1px solid var(--linha); text-align: center; font-variant-numeric: tabular-nums; }
.tab td.time { text-align: left; } .tab td.time div { display: flex; align-items: center; gap: 9px; font-weight: 700; }
.tab td.pos { width: 34px; font: 800 15px var(--titulo); color: var(--sutil); } .tab tr.cl td.pos { color: var(--verde); box-shadow: inset 3px 0 0 var(--verde); }
.tab td.pts { font: 900 17px var(--titulo); } .tab .av-tag { font-size: 10px; color: var(--vermelho); font-weight: 800; margin-left: 4px; }
.tab tr[data-time] { cursor: pointer; } .tab .col-x { display: none; } .tab .nm-l { display: none; }
@media (min-width: 560px) { .tab .col-x { display: table-cell; } }
@media (min-width: 700px) { .tab .nm-c { display: none; } .tab .nm-l { display: inline; } }
.ult { display: inline-flex; gap: 3px; } .ult i { width: 9px; height: 9px; border-radius: 50%; display: inline-block; } .ult .V { background: var(--verde); } .ult .E { background: #8a8394; } .ult .D { background: var(--vermelho); }
.legenda { font-size: 12px; color: var(--sutil); margin: 4px 4px 0; }

/* ---------- listas (artilharia, cartões) */
.lista { background: var(--card); border-radius: var(--raio); overflow: hidden; }
.item { display: grid; grid-template-columns: 32px 30px 1fr auto; gap: 10px; align-items: center; padding: 11px 14px; border-top: 1px solid var(--linha); }
.item:first-child { border-top: 0; } .item .p { font: 800 16px var(--titulo); color: var(--sutil); text-align: center; } .item .q { font: 900 24px var(--titulo); color: var(--c1); }
.item small { color: var(--sutil); display: block; font-size: 12px; }
.item.top1 { background: linear-gradient(90deg, color-mix(in srgb, var(--c1) 18%, transparent), transparent); } .item.top1 .p { color: var(--amarelo); }
.dupla { display: grid; gap: 18px; } @media (min-width: 760px) { .dupla { grid-template-columns: 1fr 1fr; } }

/* ---------- chave */
.chave { display: flex; gap: 12px; overflow-x: auto; padding-bottom: 8px; } .fase { min-width: 240px; flex: 1; }
.fase h3 { font: 800 13px var(--titulo); text-transform: uppercase; letter-spacing: 1.5px; color: var(--sutil); margin: 0 0 8px 4px; }
.bx { background: var(--card); border-radius: 14px; padding: 9px 12px; margin-bottom: 10px; border-left: 3px solid var(--c1); }
.bx .l { display: flex; align-items: center; gap: 9px; padding: 4px 0; font-weight: 700; } .bx .l span:nth-child(2) { flex: 1; } .bx .l b { font: 900 18px var(--titulo); }
.bx .l.perd { color: var(--sutil); font-weight: 600; } .bx small { color: var(--sutil); font-size: 11px; }

/* ---------- sobre o campeonato */
.info-grade { display: grid; gap: 10px; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.info { background: var(--card); border-radius: 16px; padding: 14px 16px; }
.info span { display: block; font: 800 11px var(--corpo); letter-spacing: 1.5px; text-transform: uppercase; color: var(--c1); margin-bottom: 4px; }
.info p { white-space: pre-line; }
.texto-longo { background: var(--card); border-radius: var(--raio); padding: 16px 18px; white-space: pre-line; color: #e7e0ef; }
.patro { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 10px; }
.patro a, .patro div { background: #fff; border-radius: 14px; height: 74px; display: flex; align-items: center; justify-content: center; padding: 10px; overflow: hidden;
  text-decoration: none; color: #222; font: 700 13px var(--corpo); text-align: center; }
.patro img { max-width: 100%; max-height: 100%; width: auto; height: 100%; object-fit: contain; }
.faixa-patro { margin: 26px 14px 0; }

/* ---------- folha do time (abre por baixo) */
.folha-fundo { position: fixed; inset: 0; z-index: 40; background: rgba(0,0,0,.66); }
.folha { position: fixed; z-index: 41; left: 0; right: 0; bottom: 0; max-height: 86vh; overflow: auto; background: var(--card2); border-radius: 24px 24px 0 0;
  padding: 10px 16px calc(24px + env(safe-area-inset-bottom)); box-shadow: 0 -20px 50px rgba(0,0,0,.5); animation: sobe .28s cubic-bezier(.2,.9,.3,1); }
@media (min-width: 760px) { .folha { left: 50%; right: auto; width: 620px; transform: translateX(-50%); bottom: 24px; border-radius: 24px; animation: none; } }
@keyframes sobe { from { transform: translateY(40%); opacity: 0; } }
.folha .puxa { width: 44px; height: 5px; border-radius: 3px; background: rgba(255,255,255,.25); margin: 0 auto 12px; }
.folha-topo { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; } .folha-topo h2 { font: 900 28px/1 var(--titulo); text-transform: uppercase; }
.folha-topo small { color: var(--sutil); } .folha .fechar { margin-left: auto; width: 38px; height: 38px; border-radius: 50%; border: 0; background: rgba(255,255,255,.08); font-size: 20px; }
.numeros { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-bottom: 14px; }
.numeros div { background: var(--card); border-radius: 14px; padding: 10px 6px; text-align: center; } .numeros b { display: block; font: 900 24px var(--titulo); } .numeros span { font-size: 11px; color: var(--sutil); text-transform: uppercase; letter-spacing: 1px; }

/* ---------- rodapé */
.rodape { text-align: center; padding: 26px 16px 34px; color: var(--sutil); font-size: 13px; }
.rodape a { color: var(--texto); font-weight: 700; text-decoration: none; } .rodape .redes { display: flex; justify-content: center; gap: 16px; margin: 8px 0; flex-wrap: wrap; }
.sutil { font-size: 12px; margin-top: 6px; opacity: .8; }

/* =====================================================================================
   5.1 — peças novas (todos os modelos) + modelos de site por campeonato:
   data-tema="padrao" (o de sempre), "estadio" (noite de jogo: azul e dourado) e "claro" (jornal).
   As cores vêm do campeonato (--c1 destaque, --c2 base); o modelo só muda o jeito de mostrar.
   ===================================================================================== */
.cc-prem { margin-top: 8px; display: inline-block; padding: 4px 10px; border-radius: 8px; background: rgba(0,0,0,.35); font: 800 14px var(--titulo); letter-spacing: .5px; text-transform: uppercase; }
.capa-txt { min-width: 0; }
.capa .slogan { margin-top: 8px; font: italic 700 18px var(--corpo); color: rgba(255,255,255,.9); }
.capa-premio { align-self: flex-start; margin-top: 14px; display: inline-flex; align-items: baseline; gap: 8px; padding: 7px 14px; border-radius: 12px; text-decoration: none;
  background: rgba(0,0,0,.38); backdrop-filter: blur(6px); font: 800 16px var(--titulo); letter-spacing: .5px; text-transform: uppercase; }
.capa-premio b { font-weight: 900; } .capa-premio span { margin-left: 6px; }
.chip .cont, .cont { font-weight: 800; }
.jogo { position: relative; }
.jogo .gr { position: absolute; top: 4px; left: 50%; transform: translateX(-50%); font: 700 10px var(--corpo); letter-spacing: 1px; text-transform: uppercase; color: var(--sutil); opacity: .8; }
.jogo:not(.jx) .m { padding-top: 8px; }
.jogo .pl.wo, .bx .l b { letter-spacing: 1px; }
.jogo .pl.wo { color: var(--amarelo); font-size: 20px; }
.jogo.wo-j { border-style: dashed; border-color: color-mix(in srgb, var(--amarelo) 45%, transparent); }
.jogo .m small { max-width: 130px; margin: 0 auto; }
.titulo-res { margin-top: 26px !important; }
.rodada + .rodada { margin-top: 14px; }
.leg-cl { color: var(--verde); }
/* times por grupo */
.grupo-times + .grupo-times { margin-top: 18px; }
.gt-cartao { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 10px; }
.gt-time { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 14px 8px; border-radius: 16px; border: 1px solid var(--linha); background: var(--card); text-align: center; }
.gt-time b { font: 800 15px/1.1 var(--titulo); text-transform: uppercase; }
/* premiação */
.ico { width: 26px; height: 26px; flex-shrink: 0; }
.premios { background: var(--card); border-radius: var(--raio); padding: 16px; }
.pr-chamada { text-align: center; font: 900 30px/1 var(--titulo); text-transform: uppercase; margin-bottom: 14px; }
.pr-chamada span { display: block; font-size: 18px; letter-spacing: 2px; color: var(--sutil); margin-top: 4px; }
.pr-colunas { display: grid; gap: 8px 24px; } @media (min-width: 640px) { .pr-colunas { grid-template-columns: 1fr 1.2fr; } }
.pr-col { display: grid; gap: 8px; align-content: start; }
.pr-item { display: grid; grid-template-columns: 28px 1fr auto; gap: 10px; align-items: center; padding: 8px 10px; border-radius: 12px; background: var(--card2); }
.pr-item span { font: 700 15px var(--corpo); text-transform: uppercase; letter-spacing: .4px; }
.pr-item b { font: 900 18px var(--titulo); color: var(--c1); white-space: nowrap; }
.pr-trofeu .ico { color: #f2c14e; } .pr-prata .ico { color: #cfd6e0; } .pr-bronze .ico { color: #d08a4a; } .pr-item:not(.pr-trofeu):not(.pr-prata):not(.pr-bronze) .ico { color: var(--c1); }
/* rodapé do campeonato: apoio e realização */
.rodape-camp { margin: 26px 14px 0; display: grid; gap: 18px; }
.rodape-camp .faixa-patro { margin: 0; }
.patro .so-nome { font: 800 15px/1.1 var(--titulo); text-transform: uppercase; color: #1d2340; }
.patro.real a, .patro.real div { height: 84px; }

/* ===================================================================== modelo ESTÁDIO */
:root[data-tema="estadio"] {
  --fundo: color-mix(in srgb, var(--c2) 20%, #030714); --card: color-mix(in srgb, var(--c2) 26%, #060d22); --card2: color-mix(in srgb, var(--c2) 36%, #081129);
  --linha: rgba(255,255,255,.1); --texto: #f3f6ff; --sutil: #a6b2d8;
  --ouro: color-mix(in srgb, var(--c1) 80%, #fff);
  --ouro-g: linear-gradient(180deg, #fff6d2 0%, color-mix(in srgb, var(--c1) 55%, #fff) 28%, var(--c1) 60%, color-mix(in srgb, var(--c1) 72%, #000) 100%);
  --ouro-f: linear-gradient(180deg, color-mix(in srgb, var(--c1) 45%, #fff) 0%, var(--c1) 55%, color-mix(in srgb, var(--c1) 82%, #000) 100%);
}
[data-tema="estadio"] body { background-color: var(--fundo);
  background-image: radial-gradient(380px 240px at 6% -60px, rgba(255,255,255,.2), transparent 70%), radial-gradient(380px 240px at 94% -60px, rgba(255,255,255,.16), transparent 70%),
    radial-gradient(1100px 620px at 50% -14%, color-mix(in srgb, var(--c2) 60%, transparent), transparent 70%), linear-gradient(180deg, transparent 55%, rgba(0,0,0,.4)); }
[data-tema="estadio"] .barra { background: color-mix(in srgb, var(--fundo) 82%, transparent); border-bottom: 2px solid transparent;
  border-image: linear-gradient(90deg, transparent, var(--c1), transparent) 1; }
[data-tema="estadio"] .capa { background: transparent; min-height: 360px; padding: 40px 18px 26px; align-items: center; text-align: center; justify-content: center; overflow: hidden; }
[data-tema="estadio"] .capa::after { background: linear-gradient(180deg, rgba(3,7,20,calc(var(--esc) * .35)) 0%, rgba(3,7,20,calc(var(--esc) * .8 + .2)) 100%); }
[data-tema="estadio"] .capa::before { content: ""; position: absolute; z-index: 0; right: -40px; bottom: -30px; width: 260px; height: 120px; pointer-events: none;
  background: linear-gradient(160deg, transparent 0 38%, var(--c1) 38% 44%, transparent 44% 56%, color-mix(in srgb, var(--c1) 70%, #fff) 56% 59%, transparent 59%); opacity: .85; }
.capa-luzes { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.capa-luzes i { position: absolute; top: -120px; width: 360px; height: 520px; background: conic-gradient(from 160deg at 50% 0, transparent 0deg, rgba(255,255,255,.16) 18deg, transparent 40deg);
  filter: blur(6px); opacity: .9; animation: luz 7s ease-in-out infinite alternate; }
.capa-luzes i:first-child { left: -120px; transform: rotate(-18deg); } .capa-luzes i:last-child { right: -120px; transform: rotate(18deg); animation-delay: -3s; }
@keyframes luz { from { opacity: .55; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .capa-luzes i { animation: none; } }
[data-tema="estadio"] .capa-linha { flex-direction: column; gap: 14px; position: relative; z-index: 1; }
[data-tema="estadio"] .capa-logo { width: 170px; height: 170px; border-radius: 0; background: none; box-shadow: none; backdrop-filter: none; overflow: visible; }
[data-tema="estadio"] .capa-logo img { max-width: 100%; max-height: 100%; filter: drop-shadow(0 14px 30px rgba(0,0,0,.55)); }
[data-tema="estadio"] .capa h1 { font: italic 900 clamp(34px, 9.5vw, 66px)/.9 var(--titulo); letter-spacing: .3px; text-shadow: 0 4px 0 rgba(0,0,0,.25), 0 8px 26px rgba(0,0,0,.5); }
[data-tema="estadio"] .capa .temp { display: inline-block; margin-top: 10px; padding: 3px 14px 2px; font: italic 900 18px var(--titulo); letter-spacing: 3px; color: #0b1430;
  background: var(--ouro-f); clip-path: polygon(4% 0, 100% 0, 96% 100%, 0 100%); }
[data-tema="estadio"] .capa .slogan { margin-top: 12px; font: 400 clamp(22px, 6vw, 30px)/1.1 "Kaushan Script", cursive; color: var(--ouro); transform: rotate(-4deg); text-shadow: 0 3px 12px rgba(0,0,0,.5); }
[data-tema="estadio"] .capa-premio { align-self: center; position: relative; z-index: 1; flex-direction: column; align-items: center; gap: 0; margin-top: 22px; padding: 10px 26px 0; border-radius: 0;
  background: #071230; clip-path: polygon(2% 6%, 30% 0, 70% 3%, 98% 0, 100% 50%, 97% 100%, 60% 96%, 25% 100%, 0 95%, 3% 50%); backdrop-filter: none; }
[data-tema="estadio"] .capa-premio b { font: italic 900 clamp(40px, 12vw, 70px)/.95 var(--titulo); background: var(--ouro-g); -webkit-background-clip: text; background-clip: text; color: transparent; padding: 0 6px; }
[data-tema="estadio"] .capa-premio span { margin: 2px 0 12px; padding: 4px 18px; font: 900 clamp(15px, 4.4vw, 22px) var(--titulo); letter-spacing: .6px; color: #0b1430; background: var(--ouro-f);
  clip-path: polygon(3% 0, 100% 0, 97% 100%, 0 100%); }
[data-tema="estadio"] .capa-chips { justify-content: center; position: relative; z-index: 1; }
.capa-chips .chip { max-width: 100%; white-space: normal; text-align: center; line-height: 1.25; }
[data-tema="estadio"] .chip { background: rgba(6,14,38,.7); border: 1px solid rgba(255,255,255,.12); }
[data-tema="estadio"] .chip .cont { color: var(--ouro); }
@media (min-width: 760px) {
  [data-tema="estadio"] .capa { border-radius: 0 0 28px 28px; padding: 50px 40px 34px; }
  [data-tema="estadio"] .capa-linha { flex-direction: row; text-align: left; gap: 28px; }
  [data-tema="estadio"] .capa-logo { width: 190px; height: 190px; }
}
[data-tema="estadio"] .abas { background: linear-gradient(var(--fundo) 70%, transparent); }
[data-tema="estadio"] .abas button { background: var(--card); border-color: rgba(255,255,255,.12); color: #d7def5; font-family: var(--titulo); font-size: 16px; font-weight: 800; letter-spacing: .5px; text-transform: uppercase; }
[data-tema="estadio"] .abas button.sel { background: var(--ouro-f); color: #0b1430; box-shadow: 0 6px 18px color-mix(in srgb, var(--c1) 35%, transparent); }
[data-tema="estadio"] .rotulo, [data-tema="estadio"] .secao > h2 { justify-content: center; margin: 0 0 8px; padding: 9px 14px; border-radius: 6px; color: #fff; font: 800 17px var(--titulo); letter-spacing: 1.5px;
  background: linear-gradient(90deg, color-mix(in srgb, var(--c2) 75%, #000), var(--c2) 30%, var(--c2) 70%, color-mix(in srgb, var(--c2) 75%, #000)); box-shadow: inset 0 -2px 0 color-mix(in srgb, var(--c1) 70%, transparent); }
[data-tema="estadio"] .rotulo::before { display: none; }
[data-tema="estadio"] .titulo-res { background: none !important; box-shadow: none !important; color: var(--ouro) !important; font: italic 900 26px var(--titulo) !important; }
[data-tema="estadio"] .res .rotulo { opacity: .85; }
/* jogos no estilo do cartaz */
.jogo.jx { display: grid; grid-template-columns: 58px minmax(0, 1fr); padding: 0; gap: 0; overflow: hidden; border-radius: 10px; background: color-mix(in srgb, var(--card) 85%, #fff 0%); border: 1px solid var(--linha); }
.jx-dia { grid-row: 1 / span 2; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; padding: 8px 4px;
  background: linear-gradient(180deg, color-mix(in srgb, var(--c2) 70%, #000), color-mix(in srgb, var(--c2) 45%, #000)); border-right: 1px solid rgba(255,255,255,.08); }
.jx-dia b { font: italic 900 20px/1 var(--titulo); letter-spacing: .5px; } .jx-dia span { font: 800 14px/1 var(--titulo); color: var(--ouro); }
.jx-par { display: grid; grid-template-columns: minmax(0, 1fr) 46px minmax(0, 1fr); align-items: center; gap: 6px; padding: 10px 10px 4px; }
.jx .t { gap: 6px; } .jx .t .esc { width: 30px; height: 30px; }
.jx .faixa { flex: 1; min-width: 0; padding: 5px 9px 4px; border-radius: 999px; text-align: center; color: #0b1430; background: var(--ouro-f);
  font: italic 800 13px/1.05 var(--titulo); text-transform: uppercase; letter-spacing: .3px; box-shadow: inset 0 1px 0 rgba(255,255,255,.55), 0 2px 6px rgba(0,0,0,.35);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; white-space: normal; }
.jx .faixa .nm-c { display: none; }
.jogo.jx .t .faixa span { white-space: normal; overflow: visible; text-overflow: clip; }
.jx .m { min-width: 0; padding: 0; } .jx .vs { font: italic 900 24px/1 var(--titulo); background: var(--ouro-g); -webkit-background-clip: text; background-clip: text; color: transparent; }
.jx .pl { font: italic 900 22px/1 var(--titulo); white-space: nowrap; } .jx .pl i { font-style: normal; color: var(--ouro); margin: 0 3px; }
.jx .pl.wo { font-size: 17px; color: var(--amarelo); }
.jx .t.perd .faixa { filter: saturate(.3) brightness(.78); }
.jx .t.aus .faixa { background: transparent; color: var(--sutil); box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.22); text-decoration: line-through; }
.jx .t.aus .esc { opacity: .45; filter: grayscale(1); }
.jx-pe { grid-column: 2; display: flex; justify-content: space-between; gap: 8px; padding: 0 12px 7px; font: 700 10.5px var(--corpo); color: var(--sutil); text-transform: uppercase; letter-spacing: 1px; }
.jx-pe .gr { position: static; transform: none; color: var(--ouro); opacity: 1; font-size: 10.5px; }
.jx-pe .vivo-tx { color: var(--vermelho); font-weight: 800; }
.jogo.jx.vivo-j { border-color: rgba(255,71,87,.7); box-shadow: 0 0 0 1px rgba(255,71,87,.4); }
.jogo.jx.wo-j { border-style: dashed; }
@media (min-width: 420px) { .jx .faixa { font-size: 14px; } .jx .t .esc { width: 34px; height: 34px; } .jogo.jx { grid-template-columns: 66px minmax(0, 1fr); } .jx-dia b { font-size: 22px; } }
[data-tema="estadio"] .jogo:not(.jx) { background: var(--card); }
[data-tema="estadio"] .prox { background: linear-gradient(180deg, var(--card2), var(--card)); border-top: 3px solid var(--c1); }
[data-tema="estadio"] .prox .r { color: var(--ouro); } [data-tema="estadio"] .prox .x { font: italic 900 22px var(--titulo); color: var(--ouro); }
/* tabela, listas e chave */
[data-tema="estadio"] .tab-wrap, [data-tema="estadio"] .lista { border: 1px solid var(--linha); }
[data-tema="estadio"] .tab th { background: color-mix(in srgb, var(--c2) 55%, #000); color: #dfe6ff; }
[data-tema="estadio"] .tab tr.cl td.pos { color: var(--ouro); box-shadow: inset 3px 0 0 var(--c1); }
[data-tema="estadio"] .tab td.pts { color: var(--ouro); }
[data-tema="estadio"] .leg-cl { color: var(--c1); }
[data-tema="estadio"] .item .q { color: var(--ouro); } [data-tema="estadio"] .item.top1 { background: linear-gradient(90deg, color-mix(in srgb, var(--c1) 22%, transparent), transparent); }
[data-tema="estadio"] .bx { border-left-color: var(--c1); }
/* times: o quadro dos grupos (faixa azul + cartão prateado) */
[data-tema="estadio"] .grupo-times .rotulo { width: max-content; min-width: min(70%, 320px); margin: 0 auto; padding: 10px 40px 8px; border-radius: 0; font: 900 24px var(--titulo); letter-spacing: 1px;
  clip-path: polygon(7% 0, 93% 0, 100% 100%, 0 100%); box-shadow: none; background: var(--c2); }
[data-tema="estadio"] .gt-cartao { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; padding: 14px 8px; border-radius: 16px;
  background: linear-gradient(115deg, #f5f6f8 0%, #c3c8d1 38%, #f1f2f5 55%, #aeb4bf 100%); box-shadow: 0 14px 30px rgba(0,0,0,.45), inset 0 1px 0 #fff; }
[data-tema="estadio"] .gt-time { background: none; border: 0; padding: 6px 2px; gap: 6px; }
[data-tema="estadio"] .gt-time .esc.g { width: 60px; height: 60px; filter: drop-shadow(0 6px 8px rgba(0,0,0,.3)); }
[data-tema="estadio"] .gt-time b { color: #0b1430; font-size: 12.5px; }
@media (min-width: 640px) { [data-tema="estadio"] .gt-time .esc.g { width: 88px; height: 88px; } [data-tema="estadio"] .gt-time b { font-size: 15px; } }
/* premiação no estilo do cartaz */
[data-tema="estadio"] .premios { background: linear-gradient(180deg, color-mix(in srgb, var(--c2) 35%, #050b1f), #050b1f); border: 1px solid var(--linha); }
[data-tema="estadio"] .pr-chamada b { font: italic 900 clamp(46px, 13vw, 76px)/.95 var(--titulo); background: var(--ouro-g); -webkit-background-clip: text; background-clip: text; color: transparent; }
[data-tema="estadio"] .pr-chamada span { display: inline-block; margin-top: 2px; padding: 4px 18px; color: #0b1430; background: var(--ouro-f); font: 900 20px var(--titulo); letter-spacing: .5px;
  clip-path: polygon(3% 0, 100% 0, 97% 100%, 0 100%); }
[data-tema="estadio"] .pr-item { background: transparent; padding: 6px 4px; border-bottom: 1px solid rgba(255,255,255,.06); border-radius: 0; }
[data-tema="estadio"] .pr-item b { color: var(--ouro); }
[data-tema="estadio"] .pr-item:not(.pr-trofeu):not(.pr-prata):not(.pr-bronze) .ico, [data-tema="estadio"] .pr-trofeu .ico { color: var(--ouro); }
@media (min-width: 640px) { [data-tema="estadio"] .pr-colunas { grid-template-columns: 1fr 1.25fr; } [data-tema="estadio"] .pr-col + .pr-col { border-left: 2px solid color-mix(in srgb, var(--c1) 70%, transparent); padding-left: 22px; } }
[data-tema="estadio"] .rodape-camp .rotulo { background: none; box-shadow: none; color: var(--sutil); font-size: 14px; }
[data-tema="estadio"] .patro.real a, [data-tema="estadio"] .patro.real div { background: rgba(255,255,255,.06); border: 1px solid var(--linha); }
[data-tema="estadio"] .patro.real .so-nome { color: #fff; font-size: 17px; }
[data-tema="estadio"] .camp-card, .camp-card.t-estadio { box-shadow: 0 14px 40px rgba(0,0,0,.45), inset 0 0 0 2px color-mix(in srgb, var(--k1) 65%, transparent); }
.camp-card.t-estadio h3 { font-style: italic; }
.camp-card.t-estadio { background: radial-gradient(70% 55% at 12% -10%, rgba(255,255,255,.22), transparent 70%), radial-gradient(70% 55% at 88% -10%, rgba(255,255,255,.16), transparent 70%),
  linear-gradient(170deg, color-mix(in srgb, var(--k2) 80%, #000), #050916 85%); }
.camp-card.t-estadio .cc-logo { background: none; backdrop-filter: none; }
.camp-card.t-estadio .cc-prem { background: linear-gradient(180deg, color-mix(in srgb, var(--k1) 45%, #fff), var(--k1)); color: #0b1430; }
.camp-card.t-claro { background: linear-gradient(135deg, #fbfaf7, #ece8df); color: #17131f; }
.camp-card.t-claro::after { background: linear-gradient(180deg, transparent, rgba(255,255,255,.35)); }
.camp-card.t-claro .cc-corpo h3 { text-shadow: none; } .camp-card.t-claro .cc-sub, .camp-card.t-claro .cc-prox { color: #4b4558; }
.camp-card.t-claro .cc-prog { background: rgba(0,0,0,.1); } .camp-card.t-claro .cc-prog i { background: var(--k2); }
.camp-card.t-claro .cc-logo { background: #fff; } .camp-card.t-claro .cc-prem { background: var(--k2); color: #fff; }

/* ===================================================================== modelo CLARO (jornal) */
:root[data-tema="claro"] { --fundo: #f3f1ec; --card: #ffffff; --card2: #f7f5f1; --linha: rgba(20,16,30,.09); --texto: #17131f; --sutil: #625b70; --sombra: 0 10px 28px rgba(20,16,30,.08); }
[data-tema="claro"] body { background: var(--fundo); }
[data-tema="claro"] .barra { background: rgba(255,255,255,.88); }
[data-tema="claro"] .barra-camps { background: #fff; }
[data-tema="claro"] .menu-camps { background: #fff; } [data-tema="claro"] .menu-camps a:hover, [data-tema="claro"] .menu-camps a.sel { background: rgba(0,0,0,.05); }
[data-tema="claro"] .capa { color: #fff; }
[data-tema="claro"] .abas { background: linear-gradient(var(--fundo) 70%, transparent); }
[data-tema="claro"] .abas button { background: #fff; }
[data-tema="claro"] .abas button.sel { background: var(--c2); color: #fff; }
[data-tema="claro"] .jogo, [data-tema="claro"] .tab-wrap, [data-tema="claro"] .lista, [data-tema="claro"] .info, [data-tema="claro"] .texto-longo, [data-tema="claro"] .bx,
[data-tema="claro"] .prox, [data-tema="claro"] .gt-time, [data-tema="claro"] .premios, [data-tema="claro"] .sobre-site { box-shadow: var(--sombra); border: 1px solid var(--linha); }
[data-tema="claro"] .texto-longo { color: #2a2433; }
[data-tema="claro"] .rotulo::before { background: var(--c2); }
[data-tema="claro"] .item .q { color: var(--c2); } [data-tema="claro"] .pr-item b { color: var(--c2); }
[data-tema="claro"] .esc-ini { background: #ece9e3; }
[data-tema="claro"] .folha { background: #fff; } [data-tema="claro"] .folha .puxa { background: rgba(0,0,0,.18); } [data-tema="claro"] .folha .fechar { background: rgba(0,0,0,.06); }
[data-tema="claro"] .numeros div { background: var(--card2); }
[data-tema="claro"] .chip.encerrado { background: rgba(0,0,0,.45); }
[data-tema="claro"] .rodape a { color: var(--texto); }
[data-tema="claro"] .av { color: #fff; }

.bx .l.vaga span:nth-child(2) { color: var(--sutil); font-weight: 600; font-style: italic; }
.bx .l span:nth-child(2) { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* 5.9 — página do jogo, atleta, ao vivo com player, créditos da TV */
[data-jogo] { cursor: pointer; } [data-jog] { cursor: pointer; }
.yt-player { position: relative; width: 100%; aspect-ratio: 16 / 9; border-radius: 16px; overflow: hidden; background: #000; margin: 12px 0; }
.yt-player iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.av-video { margin-top: 12px; } .av-lances-t { font: 800 13px var(--corpo); letter-spacing: 1px; text-transform: uppercase; color: var(--sutil); margin: 12px 0 6px; }
.fj-placar { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 10px; text-align: center; margin: 6px 0 4px; }
.fj-placar > div { display: flex; flex-direction: column; align-items: center; gap: 6px; cursor: pointer; } .fj-placar b { font: 900 18px/1.05 var(--titulo); text-transform: uppercase; }
.fj-placar .n { font: 900 46px/1 var(--titulo); cursor: default; }
.fj-pen { text-align: center; color: var(--sutil); font-weight: 700; font-size: 13px; margin-bottom: 6px; }
.lances { display: flex; flex-direction: column; gap: 6px; }
.lance { display: grid; grid-template-columns: 38px 24px 1fr auto; align-items: center; gap: 8px; padding: 9px 12px; border-radius: 12px; background: rgba(255,255,255,.05); }
.lance .min { font: 800 14px var(--titulo); color: var(--sutil); } .lance .tx small { color: var(--sutil); margin-left: 4px; } .lance .lt { font: 800 12px var(--corpo); color: var(--sutil); }
.ct { display: inline-block; width: 12px; height: 16px; border-radius: 2px; vertical-align: middle; } .ct.am { background: var(--amarelo); } .ct.vm { background: var(--vermelho); }
.fa-foto { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; object-position: center 20%; flex: none; background: linear-gradient(135deg, var(--c1), var(--c2));
  display: inline-grid; place-items: center; font: 900 26px var(--titulo); color: #fff; }
.lk { text-decoration: underline; cursor: pointer; }
.elenco { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 8px; }
.el-jog { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 10px 8px; border-radius: 14px; border: 0; background: rgba(255,255,255,.06); color: inherit; text-align: center; }
.el-jog b { font: 800 14px/1.1 var(--corpo); } .el-jog small { color: var(--sutil); font-size: 12px; }
.el-foto { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; object-position: center 20%; background: linear-gradient(135deg, var(--c1), var(--c2)); display: inline-grid; place-items: center; font: 900 18px var(--titulo); color: #fff; }
.creditos-tv { display: block; margin: 18px auto 0; border: 0; background: none; color: var(--sutil); font: 600 13px var(--corpo); cursor: pointer; }
.creditos-tv b { color: var(--texto); }
.tv-lista { margin: 0 0 6px 18px; line-height: 1.6; color: var(--texto); }

/* 6.1: craque do jogo votado no site */
.voto-card { margin-top: 12px; padding: 12px 14px; border-radius: 16px; background: rgba(255,255,255,.08); display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.voto-card .btn { background: var(--c1); color: #fff; border: 0; } .voto-card small { color: var(--sutil); }
.voto-lista { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; margin-bottom: 14px; }
.voto-op { text-align: left; padding: 10px 12px; border-radius: 12px; border: 1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.05); color: inherit; font: inherit; cursor: pointer; display: flex; flex-direction: column; }
.voto-op small { color: var(--sutil); } .voto-op:disabled { opacity: .45; cursor: default; } .voto-op.meu { opacity: 1; border-color: var(--c1); background: color-mix(in srgb, var(--c1) 25%, transparent); }
.voto-ok { padding: 10px 12px; border-radius: 12px; background: color-mix(in srgb, #1fa855 25%, transparent); }
[data-tema="claro"] .voto-op { border-color: rgba(0,0,0,.14); background: rgba(0,0,0,.03); }

/* 6.2: votações do campeonato */
.votos-faixa { margin: 16px 14px 0; display: grid; gap: 10px; }
.voto-card.votacao { width: 100%; text-align: left; border: 1px solid color-mix(in srgb, var(--c1) 60%, transparent); background: color-mix(in srgb, var(--c1) 16%, var(--card2, #1b1230)); color: inherit; font: inherit; cursor: pointer; margin-top: 0; }
.voto-card.votacao span { color: var(--sutil); font-size: 14px; }

/* 6.3: destaques do jogador (craque da partida, craque da rodada, seleção da rodada) */
.numeros.destaques { margin-top: 8px; }
.numeros.destaques b { font-size: 20px; white-space: nowrap; }
.el-jog .el-dest { display: block; font-size: 12px; margin-top: 2px; }
.fj-craque { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 10px 0; padding: 10px 12px; border-radius: 12px; background: linear-gradient(90deg, rgba(255,89,0,.22), rgba(109,14,170,.22)); border: 1px solid rgba(255,255,255,.14); cursor: pointer; }
.fj-craque span { opacity: .8; font-size: 13px; text-transform: uppercase; letter-spacing: .5px; } .fj-craque b { font-size: 17px; } .fj-craque small { opacity: .7; }

/* 6.4.1: com a votação (ou o craque) aberta, a capa para de animar — celular simples não engasga */
.com-folha .capa-luzes i, .com-folha .chip.vivo::before, .com-folha .ponto::before { animation: none; }

/* 6.4.4: números do jogador no elenco (sempre visíveis; zero fica mais apagado) */
.el-num { display: flex; flex-direction: column; gap: 3px; width: 100%; margin-top: 4px; }
.el-l { display: flex; justify-content: center; gap: 4px; flex-wrap: wrap; }
.el-l > span { display: inline-flex; align-items: center; gap: 2px; font-size: 11px; line-height: 1; padding: 3px 5px; border-radius: 8px; background: rgba(255,255,255,.07); }
.el-l > span b { font: 800 12px var(--corpo); }
.el-l > span.zero, .numeros .zero { opacity: .55; }
.el-leg { margin-top: 8px; }
[data-tema="claro"] .el-l > span { background: rgba(0,0,0,.06); }
.numeros.destaques { grid-template-columns: repeat(3, 1fr); }

/* 6.6.8: aba Destaques (craque da galera, craque e seleção da rodada) */
.dst-rods{display:flex;gap:8px;overflow-x:auto;padding:2px 0 12px;scrollbar-width:none}
.dst-rods button{flex:none;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.06);color:inherit;border-radius:999px;padding:9px 16px;font:inherit;font-weight:700;cursor:pointer}
.dst-rods button.sel{background:var(--c1,#ff5900);border-color:var(--c1,#ff5900);color:#fff}
.dst-grade{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px;margin-bottom:8px}
.dst-jogo{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:10px}
.dst-jogo-t{display:flex;align-items:center;gap:6px;justify-content:center;width:100%;background:none;border:0;color:inherit;font:inherit;font-weight:700;font-size:13px;opacity:.85;margin-bottom:8px;cursor:pointer}
.dst-card{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:rgba(0,0,0,.25);border:1px solid rgba(255,255,255,.12);border-radius:12px;padding:8px 10px;color:inherit;font:inherit;cursor:pointer}
.dst-card .dst-foto{width:52px;height:52px;border-radius:50%;object-fit:cover;flex:none;background:rgba(255,255,255,.1);display:grid;place-items:center;font-weight:800}
.dst-card .dst-txt{display:flex;flex-direction:column;min-width:0}.dst-card b{font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dst-card small{display:flex;align-items:center;gap:5px;opacity:.8;font-size:12.5px}.dst-card .esc.mini,.dst-jogo-t .esc.mini{width:20px;height:20px}
.dst-cr .dst-card.grande{padding:14px;background:linear-gradient(120deg,var(--c1,#ff5900),var(--c2,#6d0eaa));border:0}
.dst-cr .dst-card.grande .dst-foto{width:86px;height:86px;border:3px solid #fff}.dst-cr .dst-card.grande b{font-size:24px}
.sel-campo{position:relative;border-radius:18px;padding:14px 6px;margin:6px 0 8px;background:repeating-linear-gradient(0deg,#1f7a3a 0 46px,#238a42 46px 92px);border:2px solid rgba(255,255,255,.5);display:flex;flex-direction:column;gap:12px}
.sel-campo:before{content:"";position:absolute;left:8%;right:8%;top:50%;border-top:2px solid rgba(255,255,255,.45)}
.sel-linha{display:flex;justify-content:space-evenly;gap:6px;position:relative}
.sel-jog{flex:1 1 0;max-width:120px;min-width:0}
.sel-jog .dst-card{flex-direction:column;gap:4px;padding:6px 4px;text-align:center;background:rgba(0,0,0,.45)}
.sel-jog .dst-card .dst-foto{width:46px;height:46px;border:2px solid #fff}.sel-jog .dst-card b{font-size:12.5px;max-width:100%}
.sel-jog .dst-card small{justify-content:center;font-size:11px}
.dst-card .dst-foto.esc-ini{font-size:17px;color:#fff}.dst-cr .dst-card.grande .dst-foto.esc-ini{font-size:30px}

/* 6.6.9: lembrete, suspensos, raio-x, palpites, história */
.prox-acoes{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:8px}
.btn.mini{padding:8px 14px;font-size:14px;border-radius:999px}.btn.wa{background:#1fa855;color:#fff;border-color:#1fa855}
.jogo-sus{margin-top:10px;padding:8px 12px;border-radius:12px;background:rgba(0,0,0,.25);font-size:13px;text-align:left;display:flex;flex-direction:column;gap:4px}
.jogo-sus span{margin-right:8px;white-space:nowrap}.jogo-sus small{opacity:.7}
.disc-bloco{border-radius:14px;padding:12px;margin:0 0 12px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12)}
.disc-bloco.sus{border-color:rgba(255,80,80,.5)}.disc-bloco.pen{border-color:rgba(255,200,40,.45)}
.disc-bloco h3{margin:0 0 8px;font-size:16px}.disc-bloco h3 small{opacity:.7}
.disc-chips{display:flex;flex-wrap:wrap;gap:6px}.disc-chip{display:flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;background:rgba(0,0,0,.3);font-size:13px}.disc-chip .esc.mini{width:20px;height:20px}
.rx-forma{display:flex;align-items:center;gap:6px;margin-bottom:10px}.rx-forma small{opacity:.7;margin-left:6px}
.rx-r{width:34px;height:34px;border-radius:8px;border:0;font-weight:900;color:#fff;cursor:pointer}.rx-r.V{background:#22a35a}.rx-r.E{background:#8a8a99}.rx-r.D{background:#d23a3a}
.pp-regra{display:flex;flex-direction:column;gap:4px;padding:12px 14px;border-radius:14px;background:linear-gradient(120deg,rgba(255,89,0,.22),rgba(109,14,170,.25));border:1px solid rgba(255,255,255,.14);margin-bottom:12px}
.pp-regra small{opacity:.8}.pp-apelido{margin-bottom:6px}.pp-apelido label{display:block;font-size:13px;opacity:.8;margin-bottom:4px}
.pp-apelido input{width:100%;padding:12px 14px;border-radius:12px;border:1px solid rgba(255,255,255,.2);background:rgba(0,0,0,.3);color:inherit;font:inherit;font-weight:700;text-transform:uppercase}
.pp-jogo{padding:12px;border-radius:14px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);margin-bottom:10px}
.pp-info{font-size:12.5px;opacity:.75;text-align:center;margin-bottom:8px}
.pp-linha{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:6px}.pp-t{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:14px}
.pp-placar{display:flex;align-items:center;gap:6px}.pp-x{font-weight:900;opacity:.7}
.pp-n{display:flex;flex-direction:column;align-items:center;gap:2px}.pp-n b{font-size:30px;min-width:38px;text-align:center}
.pp-n button{width:44px;height:36px;border-radius:10px;border:0;background:rgba(255,255,255,.14);color:inherit;font-size:20px;font-weight:800;cursor:pointer}
.pp-meu{font-size:30px;font-weight:900}.pp-ok{text-align:center;color:#5fe39a;font-size:13px;margin:8px 0 0}
.pp-enviar{width:100%;margin-top:10px}
.pp-rk{display:grid;grid-template-columns:40px 1fr auto;grid-template-rows:auto auto;column-gap:8px;padding:8px 10px;border-bottom:1px solid rgba(255,255,255,.08)}
.pp-rk .p{grid-row:1/3;font-weight:900;align-self:center}.pp-rk small{opacity:.7;font-size:12px}.pp-rk .q{grid-row:1/3;grid-column:3;align-self:center;font-weight:900;font-size:20px}
.pp-rk.eu{background:rgba(255,89,0,.18);border-radius:10px}.pp-rk-sep{text-align:center;opacity:.6}
.hist-ed{display:grid;grid-template-columns:78px 1fr;gap:12px;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.1)}
.hist-ano{font-size:26px;font-weight:900;opacity:.9}.hist-camp{font-size:18px}.hist-camp small{display:block;opacity:.75;font-size:13px}
.hist-chips{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0}.hist-chips span{padding:4px 10px;border-radius:999px;background:rgba(255,255,255,.08);font-size:13px}
.hist-c p{margin:4px 0}
.pp-feito{display:flex;align-items:center;gap:12px}.pp-feito>div{flex:1;min-width:0}.pp-feito b{display:block}.pp-feito .p{font-weight:900;min-width:36px}
.hist-rank>div{display:flex;align-items:center;gap:12px;padding:10px 12px;border-bottom:1px solid rgba(255,255,255,.08)}.hist-rank b{flex:1;font-size:17px}.hist-rank .p{font-weight:900;min-width:30px;opacity:.8}.hist-rank .q{font-weight:800}