@import url('https://fonts.googleapis.com/css2?family=Anton&family=Barlow+Condensed:wght@400;500;600;700&family=Barlow+Semi+Condensed:wght@400;500;600&display=swap');

:root{
  --bg:        #07090f;
  --panel:     #10131c;
  --panel-2:   #161b27;
  --line:      #232a3a;
  --txt:       #eef1f7;
  --muted:     #8b93a7;
  --gold:      #e7b73c;
  --gold-soft: #f3d27a;
  --arsenal:   #e02029;
  --arsenal-d: #8e0d12;
  --chelsea:   #2f6bff;
  --chelsea-d: #143a8f;
  --t5a:#6b4e12; --t5b:#241a06; --t5txt:#f3d27a;
  --t4a:#13346e; --t4b:#0a1a36; --t4txt:#8fb6ff;
  --t3a:#10532b; --t3b:#082818; --t3txt:#7fe0a3;
  --t0a:#2a2f3d; --t0b:#161a24; --t0txt:#c4cad8;
}

*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{
  font-family:'Barlow Semi Condensed',system-ui,sans-serif;
  color:var(--txt);
  background:
    radial-gradient(120% 90% at 0% 0%,   rgba(224,32,41,.22) 0%, transparent 42%),
    radial-gradient(120% 90% at 100% 0%, rgba(47,107,255,.22) 0%, transparent 42%),
    var(--bg);
  background-attachment:fixed;
  min-height:100vh;
  padding:0 0 64px;
}

/* ---------- Topbar ---------- */
.topbar{
  display:flex;align-items:center;justify-content:space-between;
  gap:14px;padding:14px 18px;
  border-bottom:1px solid var(--line);
  background:linear-gradient(90deg,rgba(142,13,18,.35),rgba(0,0,0,.2) 45%,rgba(20,58,143,.35));
  backdrop-filter:blur(6px);
  position:sticky;top:0;z-index:20;
}
.topbar .brand{display:flex;align-items:center;gap:10px;font-family:'Anton';letter-spacing:.5px;font-size:20px}
.topbar .brand .dot{width:11px;height:11px;border-radius:50%;background:var(--gold);box-shadow:0 0 12px var(--gold)}
.topbar .who{font-size:14px;color:var(--muted)}
.topbar .who b{color:var(--gold-soft);font-weight:600}
.nav{display:flex;align-items:center;gap:8px}
.nav a,.btn-link{
  font-family:'Barlow Condensed';text-transform:uppercase;letter-spacing:.6px;
  font-size:14px;font-weight:600;text-decoration:none;color:var(--txt);
  padding:8px 14px;border-radius:8px;border:1px solid var(--line);
  background:var(--panel-2);transition:.15s;cursor:pointer
}
.nav a:hover,.btn-link:hover{border-color:var(--gold);color:var(--gold-soft)}
.nav a.active{border-color:var(--gold);color:#1a1305;background:linear-gradient(180deg,var(--gold-soft),var(--gold))}

/* ---------- Layout ---------- */
.wrap{max-width:1080px;margin:0 auto;padding:22px 16px 0}
.headline{text-align:center;margin:8px 0 22px}
.headline h1{
  font-family:'Anton';font-size:clamp(34px,7vw,60px);line-height:.92;
  letter-spacing:1px;
  background:linear-gradient(180deg,#fff 0%,#cfd6e6 38%,#9aa3b8 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 3px 0 rgba(0,0,0,.35));
}
.headline h1 em{
  display:block;font-style:italic;
  background:linear-gradient(180deg,var(--gold-soft),var(--gold) 60%,#9c7616);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.headline .sub{font-family:'Barlow Condensed';letter-spacing:3px;text-transform:uppercase;color:var(--muted);font-size:14px;margin-top:6px}
.matchup{
  display:inline-flex;align-items:center;gap:14px;margin-top:14px;
  padding:8px 18px;border:1px solid var(--line);border-radius:999px;background:var(--panel)
}
.matchup .team{font-family:'Anton';letter-spacing:.5px;font-size:18px}
.matchup .arsenal{color:#ff5a60}.matchup .chelsea{color:#79a4ff}
.matchup .vs{font-family:'Anton';color:var(--gold);font-size:15px;
  width:30px;height:30px;display:grid;place-items:center;border-radius:50%;
  border:1px solid var(--gold);box-shadow:0 0 14px rgba(231,183,60,.4)}

.grid{display:grid;grid-template-columns:1fr 340px;gap:18px;align-items:start}
@media(max-width:860px){.grid{grid-template-columns:1fr}}

/* ---------- Panels ---------- */
.panel{background:linear-gradient(180deg,var(--panel),#0c0f17);border:1px solid var(--line);border-radius:16px;overflow:hidden}
.panel-head{
  display:flex;align-items:center;gap:10px;padding:14px 18px;
  border-bottom:1px solid var(--line);
  font-family:'Anton';letter-spacing:.6px;font-size:18px;text-transform:uppercase
}
.panel-head .ico{font-size:20px}
.panel-head small{font-family:'Barlow Condensed';color:var(--muted);font-weight:500;letter-spacing:1px;font-size:12px}

/* ---------- Tabela de ranking ---------- */
.tablehead,.row{
  display:grid;grid-template-columns:64px 1fr 96px;align-items:center;
}
.tablehead{
  padding:10px 16px;color:var(--muted);font-family:'Barlow Condensed';
  text-transform:uppercase;letter-spacing:1.4px;font-size:12px;border-bottom:1px solid var(--line)
}
.tablehead .r{text-align:right}
.rows{padding:8px}
.row{
  margin:6px 0;padding:10px 12px;border-radius:11px;
  background:linear-gradient(90deg,var(--rb,#161a24),var(--ra,#2a2f3d) 240%);
  border:1px solid rgba(255,255,255,.05);position:relative;overflow:hidden
}
.row::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--accent,#3a4150)}
.row .pos{display:flex;align-items:center;gap:8px;font-family:'Anton';font-size:18px}
.row .medal{font-size:20px;line-height:1}
.row .nome{font-family:'Barlow Condensed';font-weight:700;font-size:20px;letter-spacing:.4px;text-transform:uppercase}
.row .pts{text-align:right;font-family:'Anton';font-size:22px;color:var(--ptxt,#fff)}
.row .pts small{font-family:'Barlow Condensed';font-size:11px;color:var(--muted);letter-spacing:1px;margin-left:3px;vertical-align:middle}

/* faixas por pontuação */
.t5{--ra:var(--t5a);--rb:var(--t5b);--ptxt:var(--t5txt);--accent:var(--gold)}
.t4{--ra:var(--t4a);--rb:var(--t4b);--ptxt:var(--t4txt);--accent:var(--chelsea)}
.t3{--ra:var(--t3a);--rb:var(--t3b);--ptxt:var(--t3txt);--accent:#28a565}
.t0{--ra:var(--t0a);--rb:var(--t0b);--ptxt:var(--t0txt);--accent:#3a4150}

/* ---------- Goleiros ---------- */
.gk .row{grid-template-columns:54px 1fr 80px}
.gk .nome{font-size:18px}

/* ---------- Regras ---------- */
.rules{margin-top:18px}
.rule{display:flex;align-items:center;justify-content:space-between;padding:11px 16px;border-bottom:1px solid var(--line)}
.rule:last-child{border-bottom:none}
.rule .lbl{font-family:'Barlow Condensed';font-weight:600;text-transform:uppercase;letter-spacing:.6px;display:flex;align-items:center;gap:9px}
.rule .val{font-family:'Anton';color:var(--gold);font-size:20px}
.rule .val span{font-family:'Barlow Condensed';font-size:11px;color:var(--muted);margin-left:4px;letter-spacing:1px}

.footer-strip{margin-top:26px;text-align:center;color:var(--muted);font-family:'Barlow Condensed';letter-spacing:2px;text-transform:uppercase;font-size:13px}
.footer-strip b{color:var(--gold-soft)}

/* ---------- Login ---------- */
.login-wrap{min-height:calc(100vh - 64px);display:grid;place-items:center;padding:24px}
.card-login{width:100%;max-width:400px;background:linear-gradient(180deg,var(--panel),#0a0d15);border:1px solid var(--line);border-radius:18px;padding:30px 26px;box-shadow:0 30px 80px rgba(0,0,0,.5)}
.card-login h1{font-family:'Anton';text-align:center;font-size:30px;letter-spacing:1px;margin-bottom:4px}
.card-login h1 em{font-style:italic;color:var(--gold)}
.card-login .tag{text-align:center;color:var(--muted);font-family:'Barlow Condensed';letter-spacing:2px;text-transform:uppercase;font-size:12px;margin-bottom:22px}
label{display:block;font-family:'Barlow Condensed';text-transform:uppercase;letter-spacing:1px;font-size:12px;color:var(--muted);margin:14px 0 6px}
input,select{
  width:100%;padding:12px 13px;border-radius:10px;border:1px solid var(--line);
  background:#0b0e16;color:var(--txt);font-family:'Barlow Semi Condensed';font-size:16px;outline:none;transition:.15s
}
input:focus,select:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(231,183,60,.15)}
.btn{
  width:100%;margin-top:20px;padding:13px;border:none;border-radius:11px;cursor:pointer;
  font-family:'Anton';letter-spacing:1px;font-size:16px;text-transform:uppercase;
  background:linear-gradient(180deg,var(--gold-soft),var(--gold));color:#1a1305;transition:.15s
}
.btn:hover{filter:brightness(1.07)}
.btn.sm{width:auto;margin:0;padding:8px 14px;font-size:13px;border-radius:8px}
.btn.ghost{background:var(--panel-2);color:var(--txt);border:1px solid var(--line)}
.btn.ghost:hover{border-color:var(--gold);color:var(--gold-soft)}
.btn.danger{background:linear-gradient(180deg,#e0555c,#b3242c);color:#fff}

.flash{padding:11px 14px;border-radius:10px;margin-bottom:14px;font-family:'Barlow Condensed';font-weight:600;letter-spacing:.4px}
.flash.erro{background:rgba(224,32,41,.12);border:1px solid rgba(224,32,41,.5);color:#ff9aa0}
.flash.ok{background:rgba(40,165,101,.12);border:1px solid rgba(40,165,101,.5);color:#86e4ad}
.hint{margin-top:18px;padding:12px;border:1px dashed var(--line);border-radius:10px;font-family:'Barlow Condensed';font-size:13px;color:var(--muted);line-height:1.5}
.hint b{color:var(--gold-soft)}

/* ---------- Admin ---------- */
.adm-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start}
@media(max-width:860px){.adm-grid{grid-template-columns:1fr}}
.adm-row{display:grid;grid-template-columns:34px 1fr auto;gap:8px;align-items:center;padding:8px;border-radius:10px;background:var(--panel-2);margin:7px 0;border:1px solid rgba(255,255,255,.04)}
.adm-row .p{font-family:'Anton';color:var(--muted);text-align:center}
.adm-row .nm{display:flex;gap:6px;align-items:center}
.adm-row .nm input.name{flex:1;padding:8px}
.adm-row .nm input.pt{width:62px;padding:8px;text-align:center;font-family:'Anton'}
.adm-row .acts{display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end}
.chip{border:none;cursor:pointer;border-radius:7px;padding:6px 9px;font-family:'Barlow Condensed';font-weight:700;font-size:13px;letter-spacing:.4px}
.chip.plus{background:rgba(40,165,101,.18);color:#86e4ad;border:1px solid rgba(40,165,101,.4)}
.chip.minus{background:rgba(224,32,41,.16);color:#ff9aa0;border:1px solid rgba(224,32,41,.4)}
.chip.save{background:linear-gradient(180deg,var(--gold-soft),var(--gold));color:#1a1305}
.chip.del{background:transparent;color:#ff7a80;border:1px solid rgba(224,32,41,.45)}
.adm-section h3{font-family:'Anton';letter-spacing:.6px;margin:6px 0 10px;font-size:17px;text-transform:uppercase}
.addform{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-end}
.addform .fld{flex:1;min-width:120px}
.addform label{margin-top:0}
.scoring-quick{font-family:'Barlow Condensed';color:var(--muted);font-size:12px;letter-spacing:.5px;margin-top:6px}
.divider{height:1px;background:var(--line);margin:18px 0}

/* ================= v2: skins por time, fotos, mascotes ================= */
.mascots{display:flex;align-items:center;justify-content:center;gap:10px;margin:6px 0 2px}
.mascots img{height:120px;width:auto;filter:drop-shadow(0 8px 16px rgba(0,0,0,.45))}
@media(max-width:520px){.mascots img{height:84px}}

.viewnav{display:flex;justify-content:center;gap:8px;margin:14px 0 4px}
.viewnav a{font-family:'Barlow Condensed';text-transform:uppercase;letter-spacing:1px;font-size:13px;
  text-decoration:none;color:var(--muted);border:1px solid var(--line);padding:7px 16px;border-radius:999px;background:var(--panel)}
.viewnav a.active{color:#1a1305;background:linear-gradient(180deg,var(--gold-soft),var(--gold));border-color:var(--gold)}

/* linha com foto/skin */
.row{grid-template-columns:60px 58px 1fr 92px}
.gk .row{grid-template-columns:50px 1fr 80px}
.row .skin{
  width:54px;height:84px;border-radius:9px;overflow:hidden;align-self:center;
  border:2px solid var(--accent,#3a4150);background:#0b0e16;
  box-shadow:0 4px 14px rgba(0,0,0,.4)
}
.row .skin img{width:100%;height:100%;object-fit:cover;object-position:center 18%;display:block}
.row .skin.empty{display:flex;align-items:center;justify-content:center;font-family:'Anton';color:var(--muted);font-size:24px}
.row .nome small{display:block;font-family:'Barlow Condensed';font-weight:600;font-size:11px;letter-spacing:1.4px;
  text-transform:uppercase;margin-top:2px}

/* skins por time sobrepõem a faixa por pontos */
.row.arsenal{--ra:#5b1116;--rb:#230708;--accent:var(--arsenal);--ptxt:#ff8f95}
.row.chelsea{--ra:#102a63;--rb:#081634;--accent:var(--chelsea);--ptxt:#8fb6ff}
.row .badge-time{display:inline-block;font-family:'Barlow Condensed';font-weight:700;font-size:10px;
  letter-spacing:1.2px;padding:1px 7px;border-radius:5px;margin-top:3px}
.badge-time.arsenal{background:rgba(224,32,41,.2);color:#ff9aa0;border:1px solid rgba(224,32,41,.5)}
.badge-time.chelsea{background:rgba(47,107,255,.2);color:#9dc0ff;border:1px solid rgba(47,107,255,.5)}
.badge-time.none{background:rgba(255,255,255,.06);color:var(--muted);border:1px solid var(--line)}

/* galeria de cartas */
.cartas-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:16px;margin-top:18px}
.carta{position:relative;border-radius:14px;overflow:hidden;border:2px solid var(--accent,#3a4150);
  background:#0b0e16;box-shadow:0 10px 26px rgba(0,0,0,.45);aspect-ratio:9/16}
.carta.arsenal{--accent:var(--arsenal);box-shadow:0 0 0 1px rgba(224,32,41,.3),0 12px 30px rgba(120,10,14,.4)}
.carta.chelsea{--accent:var(--chelsea);box-shadow:0 0 0 1px rgba(47,107,255,.3),0 12px 30px rgba(10,30,80,.4)}
.carta img{width:100%;height:100%;object-fit:cover;display:block}
.carta .cap{position:absolute;left:0;right:0;bottom:0;padding:18px 10px 8px;
  background:linear-gradient(180deg,transparent,rgba(0,0,0,.85));
  display:flex;align-items:flex-end;justify-content:space-between;gap:6px}
.carta .cap .n{font-family:'Barlow Condensed';font-weight:700;text-transform:uppercase;font-size:15px;line-height:1}
.carta .cap .pt{font-family:'Anton';color:var(--gold-soft);font-size:18px}
.carta .posbadge{position:absolute;top:8px;left:8px;width:30px;height:30px;border-radius:8px;
  display:grid;place-items:center;font-family:'Anton';font-size:15px;
  background:rgba(0,0,0,.55);border:1px solid var(--accent);backdrop-filter:blur(2px)}

/* admin: foto + time */
.adm-row{grid-template-columns:34px 46px 1fr auto}
.adm-row .thumb{width:40px;height:58px;border-radius:7px;overflow:hidden;border:1px solid var(--line);background:#0b0e16}
.adm-row .thumb img{width:100%;height:100%;object-fit:cover;object-position:center 18%}
.adm-row .thumb.empty{display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:18px;font-family:'Anton'}
.adm-row select.time{padding:7px;border-radius:7px;background:#0b0e16;border:1px solid var(--line);color:var(--txt);font-family:'Barlow Semi Condensed'}
.adm-row .uploadbtn{font-family:'Barlow Condensed';font-weight:700;font-size:12px;letter-spacing:.4px;
  background:var(--panel-2);border:1px solid var(--line);color:var(--gold-soft);border-radius:7px;padding:6px 9px;cursor:pointer}
.adm-row input[type=file]{display:none}

/* ===================== v3: REDESIGN (arena look) ===================== */

body{
  background:
    radial-gradient(80% 55% at 50% -8%, rgba(231,183,60,.10), transparent 60%),
    radial-gradient(120% 95% at 0% 0%,  rgba(224,32,41,.30) 0%, transparent 46%),
    radial-gradient(120% 95% at 100% 0%, rgba(47,107,255,.30) 0%, transparent 46%),
    radial-gradient(100% 70% at 50% 120%, rgba(12,40,24,.55), transparent 60%),
    var(--bg);
}

/* ---------- Topbar refinada ---------- */
.topbar{
  background:linear-gradient(90deg,rgba(142,13,18,.55),rgba(8,9,15,.55) 48%,rgba(20,58,143,.55));
  border-bottom:1px solid transparent;
  border-image:linear-gradient(90deg,var(--arsenal),var(--gold),var(--chelsea)) 1;
  box-shadow:0 8px 30px rgba(0,0,0,.5);
}
.topbar .brand{text-shadow:0 2px 10px rgba(0,0,0,.6)}
.topbar .brand .dot{background:radial-gradient(circle at 35% 30%,#fff,var(--gold));box-shadow:0 0 16px var(--gold)}

/* ---------- HERO ---------- */
.hero{position:relative;padding:30px 12px 26px;overflow:hidden;border-radius:0 0 26px 26px}
.hero>*:not(.hero-fx){position:relative;z-index:2}
.hero-fx{position:absolute;inset:-10% -5% 0;z-index:0;pointer-events:none}
.hero-fx .beam{position:absolute;top:-30%;width:60%;height:170%;filter:blur(38px);opacity:.55;animation:beamPulse 6s ease-in-out infinite}
.hero-fx .beam-red{left:-14%;background:conic-gradient(from 200deg at 60% 40%,transparent,rgba(224,32,41,.9),transparent 55%)}
.hero-fx .beam-blue{right:-14%;background:conic-gradient(from -20deg at 40% 40%,transparent,rgba(47,107,255,.9),transparent 55%);animation-delay:-3s}
.hero-fx .halo{position:absolute;left:50%;top:34%;width:520px;height:520px;transform:translate(-50%,-50%);
  background:radial-gradient(circle,rgba(231,183,60,.28),rgba(231,183,60,.06) 45%,transparent 65%)}
.hero-fx .grain{position:absolute;inset:0;opacity:.05;mix-blend-mode:overlay;
  background-image:radial-gradient(rgba(255,255,255,.6) .5px,transparent .6px);background-size:3px 3px}
@keyframes beamPulse{0%,100%{opacity:.4;transform:scaleY(1)}50%{opacity:.7;transform:scaleY(1.06)}}

/* mascotes emoldurados */
.mascots{margin:0 0 6px;animation:rise .7s ease both}
.mascots img{
  height:152px;border-radius:18px;padding:0;background:#0b0e16;
  border:2px solid rgba(231,183,60,.55);
  box-shadow:0 0 0 4px rgba(0,0,0,.35),0 18px 50px rgba(0,0,0,.6),0 0 40px rgba(231,183,60,.25);
}
@media(max-width:560px){.mascots img{height:104px}}

/* título com brilho + animação */
.headline h1{filter:drop-shadow(0 4px 14px rgba(0,0,0,.5)) drop-shadow(0 0 22px rgba(231,183,60,.25));animation:rise .7s .05s ease both}
.headline h1 em{filter:drop-shadow(0 0 18px rgba(231,183,60,.45))}
.headline .sub{animation:rise .7s .12s ease both}
.headline .sub::before,.headline .sub::after{content:"●";color:var(--gold);font-size:7px;vertical-align:middle;margin:0 10px;opacity:.7}

/* placar de times com brilho */
.matchup{
  margin-top:16px;animation:rise .7s .18s ease both;
  background:linear-gradient(180deg,rgba(16,19,28,.9),rgba(8,10,16,.9));
  border:1px solid transparent;border-image:linear-gradient(90deg,var(--arsenal),var(--gold),var(--chelsea)) 1;
  box-shadow:0 12px 34px rgba(0,0,0,.5)
}
.matchup .arsenal{text-shadow:0 0 16px rgba(224,32,41,.7)}
.matchup .chelsea{text-shadow:0 0 16px rgba(47,107,255,.7)}
.matchup .vs{background:radial-gradient(circle at 50% 40%,rgba(231,183,60,.18),transparent);
  box-shadow:0 0 18px rgba(231,183,60,.5),inset 0 0 8px rgba(231,183,60,.3)}

/* viewnav (Ranking / Cartas) */
.viewnav a{transition:.18s}
.viewnav a.active{box-shadow:0 6px 18px rgba(231,183,60,.35)}
.viewnav a:not(.active):hover{color:var(--gold-soft);border-color:var(--gold)}

/* ---------- Painéis ---------- */
.panel{box-shadow:0 18px 44px rgba(0,0,0,.45);animation:rise .6s .1s ease both}
.panel-head{position:relative;background:linear-gradient(180deg,rgba(231,183,60,.06),transparent)}
.panel-head::after{content:"";position:absolute;left:0;bottom:-1px;height:2px;width:100%;
  background:linear-gradient(90deg,var(--gold),transparent 60%)}
.panel-head .ico{filter:drop-shadow(0 0 10px rgba(231,183,60,.5))}

/* ---------- Linhas com brilho/hover ---------- */
.rows .row{transition:transform .15s ease,box-shadow .15s ease;will-change:transform}
.rows .row::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.06) 50%,transparent 60%)}
.rows .row:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(0,0,0,.45)}
.row .skin img{transition:transform .25s ease}
.row:hover .skin img{transform:scale(1.06)}
.row.arsenal .skin{box-shadow:0 4px 16px rgba(224,32,41,.4)}
.row.chelsea .skin{box-shadow:0 4px 16px rgba(47,107,255,.4)}
.row .pts{text-shadow:0 0 14px rgba(0,0,0,.5)}

/* medalhas com leve brilho */
.row .medal{filter:drop-shadow(0 2px 4px rgba(0,0,0,.5))}

/* galeria de cartas: brilho ao passar */
.carta{transition:transform .18s ease,box-shadow .18s ease}
.carta:hover{transform:translateY(-4px) scale(1.015)}
.carta.arsenal:hover{box-shadow:0 0 0 1px rgba(224,32,41,.6),0 18px 40px rgba(120,10,14,.6)}
.carta.chelsea:hover{box-shadow:0 0 0 1px rgba(47,107,255,.6),0 18px 40px rgba(10,30,80,.6)}

/* rodapé */
.footer-strip{padding-top:6px}
.footer-strip b{text-shadow:0 0 14px rgba(231,183,60,.4)}

@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){*{animation:none!important}}

/* ===================== v4: votação ===================== */
.vote-cat{margin-bottom:16px}
.vote-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;padding:12px}
.vote-opt{cursor:pointer;display:block}
.vote-opt input{position:absolute;opacity:0;pointer-events:none}
.opt-body{display:flex;flex-direction:column;align-items:center;gap:7px;padding:10px 8px;border-radius:12px;
  border:1px solid var(--line);background:var(--panel-2);transition:.15s;text-align:center;height:100%}
.vote-opt:hover .opt-body{border-color:var(--gold);transform:translateY(-2px)}
.vote-opt input:checked + .opt-body{border-color:var(--gold);background:linear-gradient(180deg,rgba(231,183,60,.16),rgba(231,183,60,.04));
  box-shadow:0 0 0 1px var(--gold),0 8px 20px rgba(231,183,60,.25)}
.vote-opt input:focus-visible + .opt-body{outline:2px solid var(--gold)}
.opt-skin{width:58px;height:84px;border-radius:9px;overflow:hidden;border:2px solid var(--accent,#3a4150);background:#0b0e16;display:block}
.opt-skin.arsenal{--accent:var(--arsenal)}.opt-skin.chelsea{--accent:var(--chelsea)}
.opt-skin img{width:100%;height:100%;object-fit:cover;object-position:center 18%}
.opt-skin.empty{display:flex;align-items:center;justify-content:center;font-family:'Anton';color:var(--muted);font-size:22px}
.opt-nome{font-family:'Barlow Condensed';font-weight:700;text-transform:uppercase;font-size:14px;letter-spacing:.3px;line-height:1.05}
.vote-opt input:checked + .opt-body .opt-nome{color:var(--gold-soft)}

/* resultados */
.res-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;margin-top:6px}
.res-cat{border:1px solid var(--line);border-radius:14px;padding:12px;background:var(--panel-2)}
.res-cat h4{font-family:'Anton';text-transform:uppercase;letter-spacing:.5px;font-size:15px;margin-bottom:10px}
.res-winner{display:flex;align-items:center;gap:12px;padding:8px;border-radius:11px;
  background:linear-gradient(90deg,var(--rb,#161a24),var(--ra,#2a2f3d) 260%);border:1px solid rgba(231,183,60,.4)}
.res-winner.arsenal{--ra:#5b1116;--rb:#230708}.res-winner.chelsea{--ra:#102a63;--rb:#081634}
.res-winner .opt-skin{width:46px;height:66px;border-width:2px}
.rw-info{display:flex;flex-direction:column}
.rw-nome{font-family:'Barlow Condensed';font-weight:700;text-transform:uppercase;font-size:17px}
.rw-votos{font-family:'Barlow Condensed';color:var(--gold-soft);font-size:13px;letter-spacing:.5px}
.res-resto{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.res-chip{font-family:'Barlow Condensed';font-size:12px;color:var(--muted);background:var(--panel);border:1px solid var(--line);
  padding:3px 9px;border-radius:999px;letter-spacing:.3px}
.res-vazio{font-family:'Barlow Condensed';color:var(--muted);font-size:14px}

/* ---------- Crédito do desenvolvedor ---------- */
.site-credit{display:flex;flex-direction:column;align-items:center;gap:9px;padding:34px 16px 40px;text-align:center}
.site-credit .cap{font-family:'Barlow Condensed';text-transform:uppercase;letter-spacing:3px;font-size:11px;color:var(--muted)}
.site-credit img{height:74px;max-width:92%;border-radius:13px;box-shadow:0 12px 34px rgba(0,0,0,.55);border:1px solid rgba(231,183,60,.2);transition:.2s}
.site-credit a:hover img{transform:translateY(-2px);box-shadow:0 16px 40px rgba(231,183,60,.25)}
@media(max-width:520px){.site-credit img{height:54px}}