:root{--bg:#000;--panel:#0d0d0f;--ink:#fff;--mute:#9a9aa3;--red:#e10600;--blue:#0a4fd8;--gold:#ffc400;--line:#26262b;box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--ink);font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
.cond{font-family:Impact,"Arial Narrow Bold","Haettenschweiler",Arial,sans-serif;text-transform:uppercase;letter-spacing:.5px}
.app{display:grid;grid-template-columns:230px 1fr;min-height:100vh;min-height:100dvh}
aside{background:var(--panel);border-right:3px solid var(--red);padding:14px 10px;display:flex;flex-direction:column;gap:6px}
.logo{font-size:24px;line-height:1;margin:0 0 10px 4px}
.logo span{color:var(--red)}
.rounds{display:flex;flex-direction:column;gap:6px}
.rounds a{display:flex;align-items:center;gap:10px;text-align:left;border:0;border-left:5px solid var(--line);background:#16161a;color:var(--ink);padding:10px 12px;cursor:pointer;font:inherit;font-weight:700;font-size:14px;transition:.15s}
.rounds a i{font-style:normal;color:var(--mute);font-size:11px;min-width:22px}
.rounds a:hover{background:#1f1f25}
.rounds a.on{border-left-color:var(--gold);background:var(--gold);color:#000}
.rounds a.on i{color:#000}
main{display:flex;flex-direction:column;min-height:100vh;min-height:100dvh;position:relative}
.top{text-align:center;padding:14px 10px 6px;background:linear-gradient(#000,transparent);position:relative;z-index:5}
.top small{color:var(--gold);letter-spacing:4px;font-weight:800;font-size:12px}
.top h2{margin:2px 0 0;font-size:clamp(30px,5vw,56px);line-height:1}
.hero{flex:1;position:relative;display:grid;grid-template-columns:1fr 1fr;min-height:0}
.side{position:relative;display:flex;flex-direction:column;justify-content:flex-end;gap:12px;padding:20px 8% 24px;overflow:hidden}
.side:before{content:"";position:absolute;inset:0;z-index:0;background:var(--c);opacity:.9}
.side:after{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(to top,#000 5%,rgba(0,0,0,.35) 55%,transparent)}
.side>*{position:relative;z-index:1}
.conteudo{display:flex;flex-direction:column;gap:12px;flex:1}
.r .conteudo{align-items:stretch}
.side .conteudo{position:relative;z-index:1}
.l{--c:var(--red);clip-path:polygon(0 0,100% 0,92% 100%,0 100%);padding-right:12%}
.r{--c:var(--blue);clip-path:polygon(8% 0,100% 0,100% 100%,0 100%);margin-left:-4%;padding-left:12%;text-align:right;align-items:flex-end}
.corner-head{display:flex;flex-direction:column;gap:4px;text-shadow:0 3px 14px rgba(0,0,0,.95)}
.r .corner-head{align-items:flex-end}
.role{font-size:12px;font-weight:800;letter-spacing:3px;opacity:.9}
.name{font-size:clamp(48px,9vw,128px);line-height:.88;margin:0;text-shadow:0 4px 18px rgba(0,0,0,.95)}
.paineis{display:flex;flex-direction:column;gap:12px;margin:auto 0;width:100%}
.proposta-bloco{display:flex;flex-direction:column;gap:10px;width:100%;padding:clamp(14px,2vw,20px);background:linear-gradient(135deg,rgba(0,0,0,.78),rgba(0,0,0,.48));border:1px solid rgba(255,255,255,.28);box-shadow:0 12px 32px rgba(0,0,0,.48);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.l .proposta-bloco{border-left:4px solid var(--red)}
.r .proposta-bloco{border-right:4px solid var(--blue)}
.r .proposta-bloco{align-items:flex-end}
.impactos-bloco{display:grid;grid-template-columns:1fr 1fr;gap:14px;width:100%;padding:clamp(14px,2vw,20px);background:linear-gradient(135deg,rgba(12,12,15,.84),rgba(0,0,0,.56));border:1px solid rgba(255,255,255,.22);box-shadow:0 12px 32px rgba(0,0,0,.48);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.l .impactos-bloco{border-left:4px solid var(--red)}
.r .impactos-bloco{border-right:4px solid var(--blue)}
.impacto-grupo{min-width:0}
.impacto-titulo{margin:0 0 8px;color:var(--gold);font-size:14px;letter-spacing:1px}
.impacto-lista{list-style:none;margin:0;padding:0;display:grid;gap:6px;font-size:clamp(12px,1.15vw,15px);line-height:1.4}
.impacto-lista li:before{content:"•";color:var(--gold);font-weight:900;margin-right:7px}
.pos{margin:0;font-size:clamp(15px,1.5vw,19px);line-height:1.5;max-width:46ch;font-weight:500}
.pos-list{list-style:none;padding:0;display:grid;gap:7px}
.pos-list li:before{content:"•";color:var(--gold);font-weight:900;margin-right:8px}
.pos.pending{color:#d0d0d6;font-style:italic;border:2px dashed rgba(255,255,255,.45);padding:12px}
.src{font-size:12px;color:#d6d6dc}
.like{align-self:stretch;border:3px solid #fff;background:rgba(0,0,0,.35);color:#fff;font:inherit;font-weight:900;font-size:18px;padding:16px;cursor:pointer;text-transform:uppercase;letter-spacing:2px;transition:.15s;clip-path:polygon(4% 0,100% 0,96% 100%,0 100%)}
.like:hover{background:#fff;color:#000}
.like.liked{background:var(--gold);border-color:var(--gold);color:#000}
.pop{animation:pop .35s}
@keyframes pop{50%{transform:scale(1.06) rotate(-1deg)}}
.vs{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) skew(-8deg);z-index:6;background:var(--gold);color:#000;font-size:clamp(34px,5vw,64px);padding:4px 22px;border:4px solid #000;box-shadow:0 0 0 4px var(--gold),0 10px 40px rgba(0,0,0,.8)}
.photo{position:absolute;bottom:0;height:82%;width:55%;z-index:0;background-repeat:no-repeat;background-size:contain;background-position:bottom center;filter:drop-shadow(0 0 30px rgba(0,0,0,.6))}
.l .photo{left:0;right:auto;transform:scaleX(-1);background-position:bottom right}
.r .photo{right:0;left:auto;transform:scaleX(-1);background-position:bottom left}
.photo.duo{filter:grayscale(1) contrast(1.15);mix-blend-mode:luminosity;opacity:.85}
.photo:empty{}
.photo.vazio{display:none}
footer{font-size:12px;color:var(--mute);text-align:center;padding:12px;background:#000;position:relative;z-index:5;border-top:1px solid var(--line);line-height:1.7}
footer a{color:var(--gold);text-decoration:none;font-weight:700}
footer a:hover{text-decoration:underline}
footer .sep{margin:0 8px;color:var(--line)}
@media(max-width:760px){
 .app{grid-template-columns:1fr}
 aside{border-right:0;border-bottom:3px solid var(--red);padding:10px}
 .rounds{flex-direction:row;overflow-x:auto}
 .rounds a{flex:0 0 auto;white-space:nowrap}
 main{min-height:calc(100vh - 110px);min-height:calc(100dvh - 110px)}
 .hero{grid-template-columns:1fr;grid-template-rows:1fr 1fr}
 .l,.r{clip-path:none;margin:0;padding:18px 16px;text-align:left;align-items:stretch}
 .r .conteudo{align-items:stretch}
 .r .corner-head,.r .proposta-bloco{align-items:flex-start}
 .impactos-bloco{grid-template-columns:1fr}
 .name{font-size:clamp(44px,14vw,80px)}
 .vs{top:50%}
 .photo{width:60%;height:70%;top:0;bottom:auto;opacity:.55}
 .l .photo{left:0;right:auto}.r .photo{right:0;left:auto}
}

html{-webkit-text-size-adjust:100%}
.rounds a{text-decoration:none}
a:focus-visible,button:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.lista{max-width:1100px;margin:0 auto;padding:48px 16px 24px}
.lista h2{font-size:clamp(28px,5vw,44px);margin:0 0 6px}
.lista .intro{color:var(--mute);max-width:70ch;margin:0 0 28px;line-height:1.6}
.lista article{border-top:3px solid var(--gold);padding:18px 0 26px}
.lista h3{margin:0 0 14px;font-size:clamp(22px,3.5vw,32px)}
.duelo{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.duelo>div{background:var(--panel);padding:14px 16px;border-top:5px solid var(--c)}
.duelo .e{--c:var(--red)}.duelo .d{--c:var(--blue)}
.duelo h4{margin:0 0 6px;font-size:22px}
.duelo p{margin:0 0 6px;line-height:1.55}
.duelo cite{font-size:12px;color:var(--mute);font-style:normal}
.impactos-resumo{margin-top:16px;padding:12px;background:#09090b;border:1px solid var(--line)}
.impactos-resumo h5{margin:12px 0 7px;color:var(--gold);font-size:14px;letter-spacing:1px}
.impactos-resumo h5:first-child{margin-top:0}
@media(max-width:640px){.duelo{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.kicker{margin:0;color:var(--gold);letter-spacing:4px;font-size:12px}

.placar{display:grid;grid-template-columns:1fr minmax(200px,440px) 1fr;align-items:center;gap:14px;padding:10px 4% 12px;max-width:1200px;margin:0 auto}
.pl{display:flex;flex-direction:column;line-height:1;padding:6px 14px;background:rgba(0,0,0,.55)}
.pl-l{border-left:6px solid var(--red);align-items:flex-start}
.pl-r{border-right:6px solid var(--blue);align-items:flex-end}
.pn{font-size:14px;letter-spacing:3px;color:var(--mute)}
.pv{font-size:clamp(36px,5vw,60px);color:#fff}
.pr{font-size:12px;color:var(--mute);margin-top:2px}
.pl-c{display:flex;flex-direction:column;align-items:stretch;gap:6px}
.pf{font-size:12px;letter-spacing:3px;color:var(--gold)}
.pp{display:flex;justify-content:space-between;font-size:14px;letter-spacing:1px}
.barra{position:relative;height:20px;background:var(--blue);border:2px solid #fff;transform:skew(-12deg);overflow:hidden;box-shadow:0 0 18px rgba(255,255,255,.15)}
.barra .fl{position:absolute;inset:0 auto 0 0;width:var(--p,50%);background:var(--red);transition:width .9s cubic-bezier(.2,.9,.2,1);border-right:3px solid #fff}
.barra:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(45deg,rgba(255,255,255,.2) 0 8px,transparent 8px 16px);background-size:32px 32px;animation:listras 1s linear infinite;pointer-events:none}
@keyframes listras{to{background-position:32px 0}}
.champ{align-self:center;border:0;background:var(--gold);color:#000;font-size:15px;padding:10px 22px;cursor:pointer;letter-spacing:2px;clip-path:polygon(6% 0,100% 0,94% 100%,0 100%);transition:transform .12s}
.champ:hover{transform:scale(1.05)}
dialog{border:3px solid var(--gold);background:#0b0b0d;color:#fff;padding:0;width:calc(100% - 32px);max-width:560px;max-height:calc(100vh - 32px);overflow:auto}
dialog::backdrop{background:rgba(0,0,0,.85)}
.dlg-in{padding:22px 20px;display:flex;flex-direction:column;gap:12px;text-align:center}
.dlg-in h2{margin:0;font-size:clamp(34px,8vw,64px);line-height:1}
.dlg-in .kicker{letter-spacing:4px}
.det{list-style:none;margin:6px 0;padding:0;text-align:left;font-size:14px;display:grid;gap:4px}
.det li{display:flex;justify-content:space-between;gap:10px;padding:6px 10px;background:#16161a;border-left:4px solid var(--line)}
.det li.l{border-left-color:var(--red)}.det li.r{border-left-color:var(--blue)}
.aviso{font-size:12px;color:var(--mute);margin:0;line-height:1.5}
.venceu{animation:pop .6s}
@media(max-width:760px){
 .placar{grid-template-columns:1fr 1fr;gap:10px;padding:8px 12px}
 .pl-c{grid-column:1/-1;order:3}
 .pl-r{align-items:flex-end}
}

.dica{margin:6px auto 0;max-width:62ch;font-size:clamp(12px,1.6vw,14px);color:#e8e8ec;padding:0 12px;line-height:1.4}
.dica .mao{display:inline-block;animation:sobe .9s ease-in-out infinite}
@keyframes sobe{50%{transform:translateY(-5px)}}
.like.call{animation:pulsa 1.4s ease-in-out infinite}
@keyframes pulsa{0%,100%{transform:scale(1);background:rgba(0,0,0,.35);border-color:#fff}50%{transform:scale(1.04);background:rgba(255,196,0,.4);border-color:var(--gold)}}
.like.off{opacity:.8}
.like:disabled{opacity:.5;cursor:not-allowed;animation:none}
.like:disabled:hover{background:rgba(0,0,0,.35);color:#fff}
.rounds a.done:after{content:"✓";margin-left:auto;color:var(--gold);font-weight:900}
.rounds a.on.done:after{color:#000}
.avisos{margin:0;padding-left:18px;text-align:left;font-size:14px;line-height:1.55;display:grid;gap:8px}
.avisos a{color:var(--gold)}
.flut{position:fixed;right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));z-index:20;border:2px solid var(--gold);background:#000;color:var(--gold);padding:10px 16px;font-size:14px;letter-spacing:1px;cursor:pointer;border-radius:999px;box-shadow:0 4px 18px rgba(0,0,0,.7)}
.flut:hover{background:var(--gold);color:#000}