/* Identidade do Prancheta FC: um cliente de jogo, estádio à noite.
   Tema único e deliberado — a tela é o gramado sob refletor. */
:root{
  color-scheme: dark;
  --noite:#090E0B; --campo:#0F1714; --campo-2:#15201B; --campo-3:#1C2822;
  --linha:#223029; --linha-2:#2E3E36;
  --cal:#EAF2EC; --cal-2:#A6BAAE; --cal-3:#728579;
  --grama:#35C97C; --grama-soft:#35c97c1c;
  --refletor:#F0B43C; --refletor-soft:#f0b43c1c;
  --sangue:#E2563F; --sangue-soft:#e2563f1c;
  --display:"Anton","Arial Narrow",Impact,sans-serif;
  --body:"Archivo","Helvetica Neue",Arial,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,Consolas,monospace;
}
*{box-sizing:border-box}
body{margin:0;background:var(--noite);color:var(--cal);font-family:var(--body);font-size:15px;line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:var(--grama);text-decoration:none}
a:hover{text-decoration:underline}
:focus-visible{outline:2px solid var(--refletor);outline-offset:2px;border-radius:3px}
@media (prefers-reduced-motion: reduce){*{transition-duration:.001ms !important}}

.app{max-width:1240px;margin:0 auto;padding:0 18px 64px}
.topbar{display:flex;align-items:center;gap:16px;padding:16px 0 14px;border-bottom:1px solid var(--linha);flex-wrap:wrap}
.crest{width:42px;height:42px;border-radius:5px;flex:none;display:grid;place-items:center;font-family:var(--display);font-size:17px;border:1px solid rgba(255,255,255,.16)}
.crest.sm{width:26px;height:26px;font-size:11px;border-radius:4px}
.clubid{display:flex;flex-direction:column;min-width:0}
.clubid b{font-family:var(--display);text-transform:uppercase;font-size:21px;line-height:1.05}
.clubid span{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--cal-3)}
.hud{display:flex;gap:22px;margin-left:auto;flex-wrap:wrap}
.hud div{display:flex;flex-direction:column}
.hud b{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--cal-3);font-weight:600}
.hud span{font-family:var(--mono);font-size:15px;font-weight:600;font-variant-numeric:tabular-nums}

nav.abas{display:flex;gap:2px;border-bottom:1px solid var(--linha);overflow-x:auto;scrollbar-width:none}
nav.abas::-webkit-scrollbar{display:none}
nav.abas a{color:var(--cal-3);font-size:13.5px;font-weight:600;padding:13px 16px;white-space:nowrap;border-bottom:2px solid transparent}
nav.abas a:hover{color:var(--cal-2);text-decoration:none}
nav.abas a.ativa{color:var(--cal);border-bottom-color:var(--grama)}

main{padding-top:22px}
.cols{display:grid;grid-template-columns:1fr 340px;gap:20px;align-items:start}
.cols.larga{grid-template-columns:1fr 380px}
@media(max-width:940px){.cols,.cols.larga{grid-template-columns:1fr}}
.stack{display:flex;flex-direction:column;gap:20px}

.block{background:var(--campo);border:1px solid var(--linha);border-radius:7px;overflow:hidden}
.block > h3{margin:0;padding:14px 18px;font-family:var(--mono);font-size:10.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--cal-3);border-bottom:1px solid var(--linha);background:var(--campo-2)}
.block .body{padding:18px}
.note{padding:12px 18px;font-size:13.5px;color:var(--cal-2);background:var(--campo-2);border-top:1px solid var(--linha)}
.acoes{padding:14px 18px;display:flex;gap:9px;flex-wrap:wrap;align-items:center}

.btn{display:inline-block;border-radius:5px;border:1px solid var(--grama);background:var(--grama);color:#04120B;font-family:var(--body);font-weight:700;font-size:14px;padding:11px 20px;cursor:pointer}
.btn:hover{filter:brightness(1.1);text-decoration:none;color:#04120B}
.btn.ghost{background:transparent;color:var(--cal);border-color:var(--linha-2);font-weight:600}
.btn.ghost:hover{color:var(--cal)}
.btn.sm{padding:7px 13px;font-size:13px}
.btn:disabled{opacity:.4;cursor:not-allowed}

.fixture{padding:22px 18px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:14px}
.fixture .side{display:flex;align-items:center;gap:11px;min-width:0}
.fixture .side.away{flex-direction:row-reverse;text-align:right}
.fixture .side b{font-family:var(--display);text-transform:uppercase;font-size:clamp(15px,2.4vw,22px);line-height:1.05}
.fixture .vs{font-family:var(--mono);font-size:10px;letter-spacing:.18em;color:var(--cal-3);text-align:center}
.fixture .vs em{display:block;font-style:normal;font-family:var(--display);font-size:26px;color:var(--cal);font-variant-numeric:tabular-nums}

.pitchwrap{padding:18px;display:flex;justify-content:center}
.pitch{position:relative;width:100%;max-width:400px;aspect-ratio:7/10;border-radius:6px;border:2px solid var(--linha-2);overflow:hidden;
  background:repeating-linear-gradient(180deg,#16241C 0 10%,#132018 10% 20%)}
.pitch .marks{position:absolute;inset:0}
.pitch .marks svg{width:100%;height:100%;display:block}
.tok{position:absolute;transform:translate(-50%,-50%);width:62px;display:flex;flex-direction:column;align-items:center;gap:3px;background:none;border:0;padding:0;cursor:pointer;color:inherit;font:inherit}
.tok .disc{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-family:var(--mono);font-size:13px;font-weight:600;color:#04120B;background:var(--cal);border:2px solid transparent;transition:transform .12s ease}
.tok:hover .disc{transform:scale(1.08)}
.tok.sel .disc{border-color:var(--refletor);box-shadow:0 0 0 4px var(--refletor-soft)}
.tok .nm{font-size:10.5px;font-weight:600;text-shadow:0 1px 3px rgba(0,0,0,.9);white-space:nowrap;max-width:68px;overflow:hidden;text-overflow:ellipsis}
.tok .st{font-family:var(--mono);font-size:9px;color:var(--cal-3)}
.tok.cansado .disc{background:var(--refletor)}
.tok.esgotado .disc{background:var(--sangue);color:#fff}

.plist{display:flex;flex-direction:column}
.pl{display:grid;grid-template-columns:34px 1fr auto auto;gap:11px;align-items:center;padding:9px 18px;border-bottom:1px solid var(--linha);width:100%;text-align:left;color:inherit;font:inherit;background:transparent;border-left:0;border-right:0;border-top:0}
.pl:last-child{border-bottom:none}
button.pl{cursor:pointer}
button.pl:hover{background:var(--campo-2)}
.pl .pos{font-family:var(--mono);font-size:10px;font-weight:600;color:var(--cal-3);border:1px solid var(--linha-2);border-radius:3px;padding:2px 0;text-align:center}
.pl .nome{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px}
.pl .nome small{color:var(--cal-3);font-size:12px;margin-left:6px}
.pl .cond{width:52px;height:5px;border-radius:3px;background:var(--campo-3);overflow:hidden}
.pl .cond i{display:block;height:100%}
.pl .forca{font-family:var(--mono);font-size:14px;font-weight:600;width:26px;text-align:right;font-variant-numeric:tabular-nums}

.scoreboard{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;padding:20px 18px;background:var(--campo-2);border-bottom:1px solid var(--linha)}
.scoreboard .tn{font-family:var(--display);text-transform:uppercase;font-size:clamp(14px,2.2vw,20px);line-height:1.05}
.scoreboard .tn.away{text-align:right}
.scoreboard .mid{text-align:center}
.scoreboard .pl2{font-family:var(--display);font-size:clamp(30px,5vw,44px);line-height:1;font-variant-numeric:tabular-nums}
.scoreboard .pl2 i{font-style:normal;color:var(--cal-3);font-size:.55em;padding:0 8px;vertical-align:middle}
.scoreboard .min{font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.14em;color:var(--cal-3)}

.feed{padding:12px 18px}
.fe{display:grid;grid-template-columns:36px 1fr;gap:10px;padding:4px 0;font-size:14px;align-items:baseline}
.fe .m{font-family:var(--mono);font-size:11px;font-weight:600;color:var(--cal-3);font-variant-numeric:tabular-nums}
.fe .t{color:var(--cal-2)}
.fe.gol .t{color:var(--grama);font-weight:700}
.fe.amarelo .t{color:var(--refletor)}
.fe.vermelho .t{color:var(--sangue);font-weight:700}
.fe.lesao .t{color:var(--sangue)}
.fe.away{grid-template-columns:1fr 36px;text-align:right}
.fe.away .m{order:2;text-align:right}.fe.away .t{order:1}

.tw{overflow-x:auto}
table{border-collapse:collapse;width:100%;font-size:14px;min-width:560px}
th,td{padding:9px 12px;border-bottom:1px solid var(--linha);text-align:left}
th{font-family:var(--mono);font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--cal-3);font-weight:600;background:var(--campo-2)}
td.n{font-family:var(--mono);font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
tr:last-child td{border-bottom:none}
tr.voce td{background:var(--grama-soft)}
tr.voce td:first-child{box-shadow:inset 3px 0 0 var(--grama)}
.dot{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:9px;vertical-align:-1px}
.forma{display:inline-flex;gap:3px}
.forma i{width:16px;height:16px;border-radius:3px;font-style:normal;font-family:var(--mono);font-size:9px;font-weight:600;display:grid;place-items:center;color:#04120B}
.forma i.v{background:var(--grama)}.forma i.e{background:var(--cal-3)}.forma i.d{background:var(--sangue);color:#fff}

.kv{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--linha);font-size:14px}
.kv:last-child{border-bottom:none}
.kv span{color:var(--cal-3)}
.kv b{font-family:var(--mono);font-weight:600;font-variant-numeric:tabular-nums}
.chip{display:inline-block;font-family:var(--mono);font-size:10.5px;font-weight:600;padding:3px 8px;border-radius:3px;background:var(--campo-3);color:var(--cal-2)}
.chip.g{background:var(--grama-soft);color:var(--grama)}
.chip.a{background:var(--refletor-soft);color:var(--refletor)}
.chip.r{background:var(--sangue-soft);color:var(--sangue)}
.muted{color:var(--cal-3);font-size:13.5px}
.field{display:flex;flex-direction:column;gap:5px;margin-bottom:14px}
.field label{font-family:var(--mono);font-size:10px;letter-spacing:.13em;text-transform:uppercase;color:var(--cal-3)}
select,input[type=text]{font-family:var(--body);font-size:14px;padding:8px 10px;border:1px solid var(--linha-2);border-radius:5px;background:var(--campo-2);color:var(--cal);width:100%}
.resultline{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;padding:9px 18px;border-bottom:1px solid var(--linha);font-size:13.5px;align-items:center}
.resultline:last-child{border-bottom:none}
.resultline .a{text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.resultline .b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.resultline .s{font-family:var(--mono);font-weight:600;font-variant-numeric:tabular-nums}
.resultline.voce{background:var(--grama-soft)}
.msg{padding:11px 16px;border-radius:6px;margin-bottom:16px;font-size:14px;background:var(--grama-soft);color:var(--grama);border:1px solid rgba(53,201,124,.3)}
.hero{padding:48px 0 30px}
.hero h1{font-family:var(--display);text-transform:uppercase;font-size:clamp(44px,8vw,86px);line-height:.9;margin:0}
.hero h1 em{font-style:normal;color:var(--grama)}
.hero p{max-width:56ch;color:var(--cal-2);font-size:17px}

/* ---------------------------- Relâmpago ---------------------------- */
.barra-fase{display:flex;align-items:center;gap:14px;padding:14px 18px;background:var(--campo-2);border:1px solid var(--linha);border-radius:7px;margin-bottom:20px;flex-wrap:wrap}
.barra-fase b{font-family:var(--display);text-transform:uppercase;font-size:20px;line-height:1}
.barra-fase .estado{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--cal-3)}
.relogio{margin-left:auto;font-family:var(--mono);font-size:22px;font-weight:600;font-variant-numeric:tabular-nums;color:var(--refletor)}
.relogio.jogo{color:var(--sangue)}
.aviso{padding:10px 18px;font-size:13.5px;color:var(--refletor);background:var(--refletor-soft);border-top:1px solid var(--linha)}
.aviso.ruim{color:var(--sangue);background:var(--sangue-soft)}
.mini{display:grid;grid-template-columns:1fr auto 1fr;gap:8px;padding:9px 18px;border-bottom:1px solid var(--linha);font-size:13.5px;align-items:center}
.mini:last-child{border-bottom:none}
.mini .a{text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mini .b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mini .s{font-family:var(--mono);font-weight:600;font-variant-numeric:tabular-nums;min-width:44px;text-align:center}
.mini.seu{background:var(--grama-soft)}
.mini .rot{grid-column:1/-1;font-family:var(--mono);font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;color:var(--cal-3)}
.grupo-tabela{width:100%;font-size:13.5px;min-width:0}
.grupo-tabela th,.grupo-tabela td{padding:7px 10px}
.desconectado{opacity:.55}
.tok.amarelo .disc{background:var(--refletor)}
.tok.lesao .disc{background:var(--sangue);color:#fff}
.tok.apagado .disc{background:var(--cal-3)}
.podio{display:flex;flex-direction:column;gap:0}
.podio .linha{display:grid;grid-template-columns:38px 1fr auto;gap:12px;padding:12px 18px;border-bottom:1px solid var(--linha);align-items:center}
.podio .linha:last-child{border-bottom:none}
.podio .lugar{font-family:var(--display);font-size:22px;color:var(--cal-3);text-align:center}
.podio .linha.ouro .lugar{color:var(--refletor)}
.podio .linha.ouro{background:var(--refletor-soft)}

/* linhas de elenco no trilho estreito do mercado */
.plist .pl .row{display:flex;gap:8px;flex-wrap:wrap}
.plist .pl .row form{display:inline}