:root{
  --azul-900:#071a2c; --azul-800:#0b2a45; --azul-700:#10385c; --azul-600:#1a4f7c; --azul-500:#2a6aa3;
  --bola:#d6ef3a; --bola-escura:#b7d117; --linha:rgba(255,255,255,.14); --linha-forte:rgba(255,255,255,.28);
  --texto:#eef4fa; --texto-2:#b8c8d9; --texto-3:#7f94aa;
  --ouro:#d4a833; --ouro-claro:#e9cc6a;
  --verde:#39d98a; --vermelho:#ff6b6b; --laranja:#ffb347;
  --card:rgba(255,255,255,.055); --card-2:rgba(255,255,255,.09);
  --raio:14px; --sombra:0 18px 40px rgba(0,0,0,.35);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:"Barlow",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--texto);
  background:radial-gradient(1200px 600px at 50% -10%,#1f5f94 0%,var(--azul-800) 45%,var(--azul-900) 100%) fixed;
  min-height:100vh;display:flex;flex-direction:column;line-height:1.45}
a{color:var(--bola);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4{font-family:"Barlow Condensed","Barlow",sans-serif;letter-spacing:.3px;margin:0 0 .5rem;line-height:1.1}
h1{font-size:2.4rem;font-weight:800;text-transform:uppercase}
h2{font-size:1.6rem;font-weight:700;text-transform:uppercase}
h3{font-size:1.2rem;font-weight:700}
.wrap{width:min(1140px,100% - 32px);margin:0 auto}

/* quadra ao fundo */
.quadra{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.quadra svg{width:100%;height:100%;transform:perspective(900px) rotateX(28deg) scale(1.25);transform-origin:50% 60%}
.quadra::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,26,44,0) 0%,rgba(7,26,44,.55) 100%)}

/* topo */
.topo{position:sticky;top:0;z-index:20;backdrop-filter:blur(14px);background:rgba(7,26,44,.72);border-bottom:1px solid var(--linha)}
.topo .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:66px}
.marca{display:flex;align-items:center;gap:.7rem;color:var(--texto)}
.marca:hover{text-decoration:none}
.marca-ico{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;color:var(--azul-900);
  background:linear-gradient(135deg,var(--bola),var(--bola-escura));box-shadow:0 6px 18px rgba(214,239,58,.35)}
.marca-ico svg{width:30px;height:30px}
.marca-txt{display:flex;flex-direction:column;line-height:1.05}
.marca-txt strong{font-family:"Barlow Condensed";font-size:1.35rem;text-transform:uppercase;letter-spacing:.5px}
.marca-txt small{color:var(--texto-2);font-size:.78rem}
.menu{display:flex;align-items:center;gap:.25rem}
.menu a{padding:.5rem .8rem;border-radius:9px;color:var(--texto-2);font-weight:600;font-size:.95rem;display:inline-flex;align-items:center;gap:.4rem}
.menu a:hover{background:var(--card);text-decoration:none;color:var(--texto)}
.menu a.on{background:var(--card-2);color:var(--bola)}
.menu a.disc{opacity:.55}
.ic{width:18px;height:18px;vertical-align:-3px;fill:currentColor}

main{flex:1;padding:28px 0 48px}

/* herói */
.heroi{display:grid;grid-template-columns:1.3fr 1fr;gap:2rem;align-items:center;margin:.5rem 0 2rem}
.heroi .chamada{font-size:1.05rem;color:var(--texto-2);max-width:48ch}
.heroi .destaque{color:var(--bola)}
.heroi-visual{position:relative;display:grid;place-items:center;min-height:220px}
.bola-grande{width:170px;height:170px;filter:drop-shadow(0 22px 30px rgba(0,0,0,.45));animation:flutua 5s ease-in-out infinite}
.raquete-grande{position:absolute;width:260px;height:260px;color:rgba(255,255,255,.14);transform:rotate(-20deg) translate(30px,10px)}
@keyframes flutua{0%,100%{transform:translateY(0) rotate(-8deg)}50%{transform:translateY(-14px) rotate(6deg)}}
.chips{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem}
.chip{display:inline-flex;align-items:center;gap:.4rem;background:var(--card);border:1px solid var(--linha);padding:.35rem .7rem;border-radius:999px;font-size:.85rem;color:var(--texto-2)}
.chip b{color:var(--texto)}
.chip.bola{background:rgba(214,239,58,.12);border-color:rgba(214,239,58,.35);color:var(--bola)}

/* cards */
.card{background:var(--card);border:1px solid var(--linha);border-radius:var(--raio);padding:1.1rem 1.2rem;backdrop-filter:blur(6px);box-shadow:var(--sombra)}
.card + .card,.card + .kpis,.kpis + .card,.aviso + .card{margin-top:1rem}
.card-cab{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:.8rem}
.card-cab h2,.card-cab h3{margin:0}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,440px),1fr));gap:1.2rem}
.grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem}
.sub{color:var(--texto-2);font-size:.9rem}
.mini{color:var(--texto-3);font-size:.8rem}

/* tabela de classificação */
.tab{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.tab th{font-family:"Barlow Condensed";text-transform:uppercase;letter-spacing:.6px;font-size:.8rem;color:var(--texto-3);text-align:left;padding:.45rem .5rem;border-bottom:1px solid var(--linha-forte);font-weight:600}
.tab td{padding:.55rem .5rem;border-bottom:1px solid var(--linha)}
.tab tr:last-child td{border-bottom:0}
.tab .n{text-align:center}
.tab .pts{font-family:"Barlow Condensed";font-size:1.35rem;font-weight:800;color:var(--bola);text-align:right}
.tab tr.fora td{opacity:.45}
.tab tr.fora .nome{text-decoration:line-through}
.pos{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;font-family:"Barlow Condensed";font-weight:800;font-size:1rem;background:var(--card-2);color:var(--texto-2)}
.pos.p1{background:linear-gradient(135deg,#ffd76a,#d4a833);color:#2b1d00;box-shadow:0 0 0 3px rgba(212,168,51,.25)}
.pos.p2{background:linear-gradient(135deg,#e6e9ee,#aab4c0);color:#1b2430}
.pos.p3{background:linear-gradient(135deg,#e2a06d,#a4623a);color:#2b1300}
.nome{font-weight:600}
.nome small{display:block;color:var(--texto-3);font-weight:400;font-size:.78rem}
.tag{display:inline-block;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px;padding:.15rem .45rem;border-radius:6px;margin-left:.35rem;vertical-align:middle}
.tag.elim{background:rgba(255,107,107,.18);color:var(--vermelho)}
.tag.desist{background:rgba(255,179,71,.18);color:var(--laranja)}
.tag.wo{background:rgba(255,179,71,.18);color:var(--laranja)}
.tag.ok{background:rgba(57,217,138,.16);color:var(--verde)}
.tag.ag{background:rgba(42,106,163,.35);color:#9fc6ec}

/* rodadas e partidas */
.rodada-cab{display:flex;align-items:center;justify-content:space-between;gap:.8rem;flex-wrap:wrap;margin:.2rem 0 .6rem}
.rodada-cab h3{display:flex;align-items:center;gap:.5rem}
.prazo{display:inline-flex;align-items:center;gap:.4rem;font-size:.85rem;color:var(--texto-2);background:var(--card);border:1px solid var(--linha);padding:.3rem .6rem;border-radius:999px}
.prazo.urgente{color:var(--laranja);border-color:rgba(255,179,71,.4)}
.prazo.vencido{color:var(--vermelho);border-color:rgba(255,107,107,.4)}
.prazo.ok{color:var(--verde);border-color:rgba(57,217,138,.35)}
.partidas{display:grid;gap:.5rem}
.partida{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:.6rem;background:var(--card);border:1px solid var(--linha);border-radius:12px;padding:.6rem .8rem}
.partida .lado{font-weight:600;display:flex;align-items:center;gap:.4rem}
.partida .lado.b{justify-content:flex-end;text-align:right}
.partida .lado.venceu{color:var(--bola)}
.partida .lado.venceu::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--bola);box-shadow:0 0 10px var(--bola)}
.partida .lado.b.venceu::before{order:2}
.partida .placar{font-family:"Barlow Condensed";font-weight:800;font-size:1.2rem;text-align:center;min-width:92px;padding:.25rem .5rem;border-radius:8px;background:rgba(0,0,0,.25)}
.partida .placar.pend{color:var(--texto-3);font-weight:600;font-size:.85rem;letter-spacing:.5px}
.partida .placar.wo{color:var(--laranja)}
.partida .placar.ag{color:#9fc6ec;font-size:.8rem}
.partida.folga{grid-template-columns:1fr;color:var(--texto-3);font-style:italic;text-align:center}
.partida.folga .lado{justify-content:center}

/* formulários */
form.inline{display:inline}
label{display:block;font-size:.8rem;color:var(--texto-2);margin:.5rem 0 .2rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px}
input,select,textarea{width:100%;padding:.6rem .7rem;border-radius:9px;border:1px solid var(--linha-forte);background:rgba(0,0,0,.25);color:var(--texto);font:inherit;font-size:1rem}
input:focus,select:focus,textarea:focus{outline:2px solid rgba(214,239,58,.45);border-color:var(--bola)}
select option{color:#000}
.campos{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:.6rem}
.btn{display:inline-flex;align-items:center;gap:.4rem;padding:.55rem .95rem;border-radius:10px;border:1px solid transparent;font:inherit;font-weight:700;font-size:.92rem;cursor:pointer;
  background:linear-gradient(135deg,var(--bola),var(--bola-escura));color:#132000;box-shadow:0 6px 16px rgba(214,239,58,.25);transition:transform .08s}
.btn:hover{transform:translateY(-1px);text-decoration:none}
.btn:active{transform:translateY(0)}
.btn.sec{background:var(--card-2);color:var(--texto);border-color:var(--linha-forte);box-shadow:none}
.btn.perigo{background:rgba(255,107,107,.15);color:var(--vermelho);border-color:rgba(255,107,107,.35);box-shadow:none}
.btn.alerta{background:rgba(255,179,71,.15);color:var(--laranja);border-color:rgba(255,179,71,.35);box-shadow:none}
.btn.ouro{background:linear-gradient(135deg,var(--ouro-claro),var(--ouro));color:#2b1d00;box-shadow:0 6px 16px rgba(212,168,51,.3)}
.btn.p{padding:.35rem .6rem;font-size:.8rem;border-radius:8px}
.btn.whats{background:#25d366;color:#07301a;box-shadow:none}
.acoes{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center}

.aviso{display:flex;align-items:center;gap:.5rem;padding:.7rem .9rem;border-radius:10px;margin-bottom:1rem;font-weight:600}
.aviso.ok{background:rgba(57,217,138,.14);border:1px solid rgba(57,217,138,.35);color:var(--verde)}
.aviso.erro{background:rgba(255,107,107,.14);border:1px solid rgba(255,107,107,.35);color:var(--vermelho)}

/* números grandes */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.8rem;margin:1rem 0 1.2rem}
.kpi{background:var(--card);border:1px solid var(--linha);border-radius:12px;padding:.8rem 1rem}
.kpi b{display:block;font-family:"Barlow Condensed";font-size:2rem;font-weight:800;color:var(--bola);line-height:1}
.kpi span{font-size:.8rem;color:var(--texto-3);text-transform:uppercase;letter-spacing:.5px}
.kpi.ouro b{color:var(--ouro-claro)}
.kpi.alerta b{color:var(--laranja)}

/* regras */
.pontos{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.7rem}
.ponto{background:var(--card);border:1px solid var(--linha);border-radius:12px;padding:.9rem;text-align:center}
.ponto b{display:block;font-family:"Barlow Condensed";font-size:2.2rem;font-weight:800;color:var(--bola)}
.ponto.zero b{color:var(--vermelho)}
.ponto span{font-size:.8rem;color:var(--texto-2);text-transform:uppercase;letter-spacing:.5px}
.lista-regras{list-style:none;padding:0;margin:0;display:grid;gap:.6rem}
.lista-regras li{display:flex;gap:.7rem;align-items:flex-start;background:var(--card);border:1px solid var(--linha);border-radius:10px;padding:.7rem .9rem}
.lista-regras li svg{width:22px;height:22px;flex:none;color:var(--bola);margin-top:2px}

/* área do jogador */
.jogo-card{background:var(--card);border:1px solid var(--linha);border-radius:14px;padding:1rem}
.jogo-card.aberto{border-color:rgba(214,239,58,.45);box-shadow:0 0 0 1px rgba(214,239,58,.2) inset}
.versus{display:flex;align-items:center;gap:.8rem;font-family:"Barlow Condensed";font-size:1.3rem;font-weight:700}
.versus .vs{font-size:.8rem;color:var(--texto-3);background:rgba(0,0,0,.25);padding:.2rem .5rem;border-radius:6px}
.link-caixa{display:flex;gap:.5rem;align-items:center;background:rgba(0,0,0,.25);border:1px dashed var(--linha-forte);border-radius:10px;padding:.5rem .7rem;font-family:ui-monospace,monospace;font-size:.85rem;word-break:break-all}

/* login */
.login{max-width:380px;margin:4rem auto;text-align:center}
.login .marca-ico{margin:0 auto 1rem;width:64px;height:64px}
.login .marca-ico svg{width:42px;height:42px}
.login input{text-align:center;font-size:1.6rem;letter-spacing:.4rem;font-family:"Barlow Condensed"}

/* rodapé / patrocínio */
.rodape{border-top:1px solid var(--linha);background:rgba(4,15,27,.75);backdrop-filter:blur(10px);padding:1.4rem 0 1.2rem;margin-top:auto}
.patro{display:flex;align-items:center;justify-content:center;gap:1rem;flex-wrap:wrap;padding:.4rem 0 .9rem}
.patro-rotulo{font-family:"Barlow Condensed";text-transform:uppercase;letter-spacing:2px;font-size:.78rem;color:var(--texto-3)}
.patro-logo img{height:54px;display:block}
.patro-frase{font-size:.85rem;color:var(--texto-2)}
.patro-frase a{color:var(--ouro-claro)}
.rodape-linha{display:flex;align-items:center;justify-content:center;gap:.5rem;font-size:.8rem;color:var(--texto-3);border-top:1px solid var(--linha);padding-top:.8rem}
.rodape-linha a{color:var(--ouro-claro)}

details.dobra{border:1px solid var(--linha);border-radius:10px;padding:.5rem .8rem;background:rgba(0,0,0,.15)}
details.dobra summary{cursor:pointer;font-weight:700;color:var(--texto-2)}
details.dobra[open]{padding-bottom:.9rem}
hr.sep{border:0;border-top:1px solid var(--linha);margin:1rem 0}
.r{text-align:right}
.c{text-align:center}
code{background:rgba(0,0,0,.3);padding:.1rem .35rem;border-radius:5px;font-size:.9em}

@media (max-width:760px){
  .heroi{grid-template-columns:1fr}
  .heroi-visual{min-height:150px;order:-1}
  .bola-grande{width:110px;height:110px}
  .raquete-grande{width:180px;height:180px}
  h1{font-size:1.9rem}
  .tab .oculta-m{display:none}
  .partida{grid-template-columns:1fr auto 1fr;font-size:.9rem}
  .partida .placar{min-width:70px;font-size:1rem}
  .marca-txt small{display:none}
  .menu a{padding:.45rem .55rem;font-size:.88rem}
  .patro-logo img{height:44px}
}

/* avatares */
.avatar{border-radius:50%;object-fit:cover;flex:none;border:2px solid rgba(255,255,255,.18);background:#0b2a45;display:inline-block;vertical-align:middle}
.avatar.ini{display:inline-grid;place-items:center;font-family:"Barlow Condensed";font-weight:800;color:var(--azul-900);background:linear-gradient(135deg,#e6f58a,var(--bola-escura))}
.jog{display:flex;align-items:center;gap:.55rem}
.jog .nome{line-height:1.1}
.form-linha{display:flex;gap:.4rem;align-items:center;flex-wrap:wrap}
.form-linha input{width:auto;min-width:120px;padding:.35rem .5rem;font-size:.9rem}
.lista-simples{list-style:none;margin:0;padding:0;display:grid;gap:.4rem}
.lista-simples li{display:flex;align-items:center;gap:.6rem;background:var(--card);border:1px solid var(--linha);border-radius:10px;padding:.45rem .7rem;flex-wrap:wrap}
.lista-simples li .cresce{flex:1;min-width:140px}
.partida-admin{display:grid;gap:.35rem;background:var(--card);border:1px solid var(--linha);border-radius:12px;padding:.6rem .8rem}
.partida-admin .partida{border:0;background:transparent;padding:0}
.partida-admin .ferramentas{display:flex;gap:.4rem;flex-wrap:wrap;align-items:center;border-top:1px dashed var(--linha);padding-top:.45rem}
.rod-item{border:1px solid var(--linha);border-radius:12px;padding:.7rem .9rem;background:rgba(0,0,0,.12)}
.rod-item + .rod-item{margin-top:.6rem}
.rod-item.aberta{border-color:rgba(214,239,58,.45)}
.rod-item.prevista{opacity:.75}

/* menu do topo no celular: rola de lado em vez de quebrar linha */
@media (max-width:760px){
  .topo .wrap{flex-wrap:nowrap}
  .menu{overflow-x:auto;white-space:nowrap;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .menu::-webkit-scrollbar{display:none}
  .menu a{flex:none}
}

.sel-torneio{display:flex;gap:.4rem;flex-wrap:wrap;margin:0 0 1rem}

@media (max-width:760px){.so-pc{display:none}}