:root{--ca:#2f6bff;--cb:#e11d2e;--gold1:#fff3a6;--gold2:#ffc928;--gold3:#e08a00;--ink:#071126}
*{box-sizing:border-box}html,body{margin:0;height:100%;background:#000;overflow:hidden;font-family:Inter,system-ui,sans-serif}
#stage{position:fixed;left:50%;top:50%;width:1080px;height:1920px;transform-origin:center;overflow:hidden;color:#fff;background:#0b1736;-webkit-font-smoothing:antialiased}
.room{position:absolute;inset:0}
.room .wall{position:absolute;inset:0;background:linear-gradient(180deg,#07122e 0%,#0f2150 30%,#26304f 58%,#3b3a46 74%,#2a2018 100%)}
.room .spot{position:absolute;left:-10%;right:-10%;top:-8%;height:60%;background:radial-gradient(ellipse at 50% 0,rgba(120,160,255,.42),transparent 62%);z-index:1}
.room .table{position:absolute;left:0;right:0;top:1120px;bottom:0;background:linear-gradient(180deg,#a8763c 0,#8a5a2c 6%,#6d4520 40%,#3d2410 100%);box-shadow:0 -10px 30px rgba(0,0,0,.55)}
.room .table:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,rgba(0,0,0,.14) 0 3px,transparent 3px 120px),repeating-linear-gradient(0deg,rgba(255,255,255,.04) 0 2px,transparent 2px 14px)}
.room .table:after{content:"";position:absolute;left:0;right:0;top:0;height:10px;background:linear-gradient(180deg,rgba(255,225,170,.7),transparent)}

/* topo e logotipo */
.top{position:absolute;left:0;right:0;top:92px;height:300px;z-index:3;text-align:center}
.live-tag{position:absolute;right:44px;top:-22px;display:flex;align-items:center;gap:8px;border:3px solid #2ee59d;color:#2ee59d;background:rgba(5,25,20,.6);font:800 26px "Barlow Condensed";font-style:italic;letter-spacing:.06em;padding:4px 16px;border-radius:999px}
.live-tag i{width:14px;height:14px;border-radius:50%;background:#ff3b4a;box-shadow:0 0 14px #ff3b4a;animation:pulse 1.2s infinite}
.logo{position:relative;margin:0 auto;width:900px}
.ribbon{position:absolute;top:10px;width:360px;height:112px;filter:drop-shadow(0 12px 14px rgba(0,0,0,.5))}
.ribbon.rl{left:-10px;background:linear-gradient(100deg,#1d62ff 0 38%,#ffd400 38% 58%,#00a859 58%);clip-path:polygon(0 30%,100% 0,100% 74%,0 100%);transform:skewY(-4deg)}
.ribbon.rr{right:-10px;background:linear-gradient(80deg,#00a859 0 38%,#ffd400 38% 58%,#1d62ff 58%);clip-path:polygon(0 0,100% 30%,100% 100%,0 74%);transform:skewY(4deg)}
h1{position:relative;margin:0;font:400 190px/0.95 Anton,Impact,sans-serif;letter-spacing:.01em;background:linear-gradient(180deg,#fffbd0 0,#ffe46a 28%,#ffb81c 55%,#ff9a00 56%,#ffd24a 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-stroke:10px #1b43c9;paint-order:stroke fill;filter:drop-shadow(0 10px 0 #0c2a8e) drop-shadow(0 22px 22px rgba(0,0,0,.55))}
.sub{position:relative;display:inline-block;margin-top:-8px;padding:6px 54px 8px;border-radius:999px;background:linear-gradient(180deg,#3d8bff,#1747d8 55%,#0f35aa);border:5px solid #fff;box-shadow:0 0 0 4px #0b2a8e,0 14px 22px rgba(0,0,0,.5),inset 0 4px 6px rgba(255,255,255,.5);font:800 58px "Barlow Condensed";font-style:italic;letter-spacing:.02em;text-shadow:0 4px 0 #0a2478}

/* faixa do meio: rosas + cronômetro */
.mid{position:absolute;left:0;right:0;top:404px;height:230px;z-index:3;display:grid;grid-template-columns:1fr 380px 1fr;align-items:center;padding:0 30px}
.badge-team{position:relative;height:230px}
.badge-team .rose{position:absolute;left:50%;top:-14px;width:210px;height:210px;transform:translateX(-50%);filter:drop-shadow(0 10px 12px rgba(0,0,0,.5));animation:float 3.2s ease-in-out infinite}
.badge-team[data-t=b] .rose{animation-delay:-1.4s}
.badge-team .tag{position:absolute;left:50%;bottom:0;transform:translateX(-50%) rotate(-3deg);min-width:260px;padding:6px 26px 8px 62px;border-radius:18px;background:linear-gradient(180deg,var(--tc),var(--tcd));border:5px solid #fff;box-shadow:0 10px 18px rgba(0,0,0,.45),0 0 0 3px var(--tcd);text-align:center;line-height:.86}
.badge-team .tag svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:44px;height:44px;background:#17a34a;border:3px solid #fff;border-radius:10px;padding:4px}
.badge-team[data-t=b] .tag{transform:translateX(-50%) rotate(3deg)}
.tag .l1{display:block;font:800 30px "Barlow Condensed";font-style:italic;color:#fff;text-shadow:0 2px 0 rgba(0,0,0,.4)}.tag .l2{display:block;font:800 52px "Barlow Condensed";font-style:italic;color:#fff;text-shadow:0 3px 0 rgba(0,0,0,.45)}
[data-t=a]{--tc:var(--ca);--tcd:var(--caD);--tcl:var(--caL);--tca22:var(--caA22);--tca30:var(--caA30)}[data-t=b]{--tc:var(--cb);--tcd:var(--cbD);--tcl:var(--cbL);--tca22:var(--cbA22);--tca30:var(--cbA30)}
.timer{height:190px;border-radius:30px;background:linear-gradient(180deg,#171a22,#05060a);border:4px solid #3a4050;box-shadow:0 14px 26px rgba(0,0,0,.6),inset 0 0 0 3px #000,inset 0 6px 10px rgba(255,255,255,.08);display:grid;place-items:center}
.timer span{font:400 138px/1 Anton;letter-spacing:.03em;text-shadow:0 0 22px rgba(255,255,255,.35)}
.timer.low span{color:#ff4b5c;text-shadow:0 0 26px rgba(255,60,80,.8)}.timer.low{animation:throb .6s infinite}

/* resumo */
.summary{position:absolute;left:36px;right:36px;top:656px;height:88px;z-index:3;display:grid;grid-template-columns:1fr 1fr 1.25fr;border-radius:46px;background:linear-gradient(180deg,#10162a,#050914);border:3px solid #2a3350;box-shadow:0 12px 22px rgba(0,0,0,.5);overflow:hidden}
.cell{display:flex;flex-direction:column;align-items:center;justify-content:center;border-right:2px solid rgba(255,255,255,.08)}
.cell small{font:800 22px "Barlow Condensed";font-style:italic;letter-spacing:.2em;color:#aab6d8;margin-bottom:-2px}.cell b{font:400 52px/1 Anton}
.lead-pill{display:grid;place-items:center;font:800 56px "Barlow Condensed";font-style:italic;text-transform:uppercase;background:linear-gradient(180deg,#5aa0ff,#1c57e6);margin:6px;border-radius:40px;box-shadow:inset 0 4px 6px rgba(255,255,255,.45),0 4px 10px rgba(0,0,0,.4);text-shadow:0 3px 0 rgba(0,0,0,.35);transition:background .4s}
.lead-pill.a{background:linear-gradient(180deg,var(--caL),var(--ca))}.lead-pill.b{background:linear-gradient(180deg,var(--cbL),var(--cb))}.lead-pill.tie{background:linear-gradient(180deg,#767f99,#444b63)}

/* cartões de pontos */
.cards{position:absolute;left:36px;right:36px;top:764px;height:372px;z-index:3;display:grid;grid-template-columns:1fr 1fr;gap:26px}
.card{position:relative;border-radius:26px;padding:0 24px 18px;background:linear-gradient(180deg,#0e1a3d,#070d22);border:5px solid var(--tc);box-shadow:0 14px 26px rgba(0,0,0,.55),0 0 0 3px #000,inset 0 0 40px var(--tca22);overflow:hidden;transition:box-shadow .4s,transform .3s}
.card.lead{box-shadow:0 14px 26px rgba(0,0,0,.55),0 0 0 3px #000,0 0 50px var(--tc),inset 0 0 40px var(--tca30);transform:translateY(-6px)}
.card .head{display:flex;align-items:center;justify-content:space-between;margin:0 -24px;padding:8px 20px 8px 22px;background:linear-gradient(180deg,var(--tcl),var(--tc) 55%,var(--tcd));box-shadow:inset 0 -3px 0 rgba(0,0,0,.25)}
.card .num{font:400 58px/1 Anton;text-shadow:0 4px 0 rgba(0,0,0,.35)}
.crown{display:none;align-items:center;gap:6px;background:linear-gradient(180deg,#ffe36a,#ffb01e);color:#6b4a00;font:800 28px "Barlow Condensed";font-style:italic;padding:4px 14px 4px 8px;border-radius:12px;box-shadow:0 3px 0 #a86a00}.crown svg{width:30px;height:30px}
.card.lead .crown{display:inline-flex;animation:pop .6s}
.card .pts{font:400 128px/1 Anton;text-align:center;margin-top:4px;text-shadow:0 6px 0 rgba(0,0,0,.45);font-variant-numeric:tabular-nums}
.card .lbl{text-align:center;font:800 26px "Barlow Condensed";font-style:italic;letter-spacing:.5em;color:#aab6d8;margin-top:-6px}
.bar{height:18px;border-radius:10px;background:#2a3252;margin:12px 0 6px;overflow:hidden;box-shadow:inset 0 2px 4px rgba(0,0,0,.6)}.bar i{display:block;height:100%;width:50%;background:linear-gradient(90deg,var(--tc),var(--tcl));border-radius:10px;transition:width .5s cubic-bezier(.2,.9,.3,1)}
.foot{display:flex;align-items:center;justify-content:space-between}.foot>b{font:400 40px Anton}.gifts{display:flex;align-items:center;gap:8px;font:800 24px "Barlow Condensed";font-style:italic;color:#d9e2ff;letter-spacing:.04em}.gifts svg{width:28px;height:28px}.gifts b{font:400 30px Anton}

/* urnas */
.urnas{position:absolute;left:0;right:0;top:1170px;height:320px;z-index:3;perspective:1200px}
.urna{position:absolute;top:0;width:480px;height:280px;display:grid;grid-template-columns:1.25fr 1fr;gap:12px;padding:16px;border-radius:14px 14px 6px 6px;background:linear-gradient(180deg,#d9dbe0,#aeb2bd);border:3px solid #7e8391;box-shadow:0 26px 30px rgba(0,0,0,.55),inset 0 4px 6px rgba(255,255,255,.7);transform:rotateX(14deg);transform-origin:50% 100%}
.urna[data-t=a]{left:34px}.urna[data-t=b]{right:34px}
.urna .screen{border-radius:8px;background:linear-gradient(180deg,#fbf0f0,#e7d9d9);border:4px solid #5a5d68;box-shadow:inset 0 0 16px rgba(0,0,0,.25);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;transition:background .25s}
.urna[data-t=a] .screen{background:linear-gradient(180deg,#eaf1ff,#cfdcff)}.urna[data-t=b] .screen{background:linear-gradient(180deg,#fff0f1,#ffd0d4)}
.digits{display:flex;gap:10px}.digits i{width:62px;height:86px;border:4px solid #20242f;background:#fff;display:grid;place-items:center;font:400 64px Anton;color:#111;font-style:normal;box-shadow:inset 0 0 8px rgba(0,0,0,.2)}
.screen small{font:700 17px Inter;color:#4a4f5f;text-align:center}
.urna.vote .screen{background:#fff;animation:blink .35s}
.pad{display:flex;flex-direction:column;gap:8px}.keys{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;background:#14161c;padding:9px;border-radius:8px;flex:1}
.keys i{display:grid;place-items:center;font:800 24px Inter;font-style:normal;color:#fff;background:linear-gradient(180deg,#444a5a,#20232d);border-radius:6px;box-shadow:0 3px 0 #0a0b10;transition:transform .08s,filter .08s}
.keys i.press,.act i.press{transform:translateY(3px);filter:brightness(2.2);background:linear-gradient(180deg,var(--tc),var(--tcd));box-shadow:0 0 14px var(--tc)}
.act{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.act i{font:800 11px Inter;font-style:normal;text-align:center;padding:12px 2px;border-radius:5px;color:#222;box-shadow:0 3px 0 rgba(0,0,0,.35)}.act .w{background:#f6f6f6}.act .o{background:#f08a1a}.act .g{background:#27b24a;color:#fff}.act i.press{transform:translateY(3px);filter:brightness(1.5);box-shadow:0 0 14px #27b24a}
/*HAND*/.hand{position:absolute;width:290px;height:1432px;left:700px;top:330px;z-index:4;transition:left .2s cubic-bezier(.3,.9,.3,1),top .2s cubic-bezier(.3,.9,.3,1);filter:drop-shadow(0 22px 20px rgba(0,0,0,.55));pointer-events:none;transform-origin:21% 1%}
.hand img{width:100%;height:100%;display:block}.hand.press{animation:press .38s}
.screen{position:relative}.fim{position:absolute;inset:0;display:none;place-items:center;background:#fff;font:400 120px Anton;color:#111;letter-spacing:.06em}.fim.show{display:grid;animation:blink .3s}
.digits i.new{animation:pop .22s}.urna{cursor:pointer}

/* presentes */

/* efeitos */
#fx{position:absolute;inset:0;width:100%;height:100%;z-index:11;pointer-events:none}
.flash{position:absolute;left:0;right:0;top:700px;z-index:9;text-align:center;font:400 120px/1 Anton;pointer-events:none;opacity:0;text-shadow:0 8px 0 rgba(0,0,0,.5);white-space:nowrap}
.flash.show{animation:flashIn 1.7s cubic-bezier(.2,.9,.3,1.1) forwards}
.rose-fall{position:absolute;top:-120px;z-index:7;pointer-events:none;animation:fall linear forwards}
.result{position:absolute;inset:0;z-index:10;display:none;place-items:center;background:radial-gradient(circle at 50% 45%,rgba(10,20,60,.82),rgba(0,0,0,.92))}
.result.show{display:grid;animation:fadeIn .5s}
.rc{text-align:center;transform:translateY(-60px)}.trophy{width:320px;height:320px;margin:0 auto;filter:drop-shadow(0 0 40px var(--tc,#ffd24a));animation:float 2.4s ease-in-out infinite}
.rt{font:400 150px/1 Anton;margin-top:10px;color:var(--tc,#ffd24a);text-shadow:0 8px 0 rgba(0,0,0,.6),0 0 50px var(--tc,#ffd24a)}
.rs{font:800 56px "Barlow Condensed";font-style:italic;color:#e2e9ff;margin-top:14px;letter-spacing:.06em}.rn{font:700 36px Inter;color:#9fb0d8;margin-top:40px}
@keyframes pulse{50%{opacity:.35}}@keyframes float{50%{transform:translateX(-50%) translateY(-12px)}}.trophy{animation-name:floatT}@keyframes floatT{50%{transform:translateY(-14px)}}
@keyframes throb{50%{transform:scale(1.04)}}@keyframes pop{0%{transform:scale(.5)}70%{transform:scale(1.2)}100%{transform:scale(1)}}
@keyframes blink{0%{filter:brightness(1.8)}100%{filter:none}}@keyframes press{50%{transform:translateY(16px) scale(.97)}}
@keyframes slideIn{from{opacity:0;transform:translateX(-60px) scale(.9)}to{opacity:1;transform:none}}@keyframes slideOut{to{opacity:0;transform:translateX(-60px)}}
@keyframes fall{to{transform:translateY(2100px) rotate(540deg)}}@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes flashIn{0%{opacity:0;transform:scale(.4) rotate(-4deg)}18%{opacity:1;transform:scale(1.15) rotate(2deg)}30%{transform:scale(1)}80%{opacity:1}100%{opacity:0;transform:scale(1.1)}}

/* foto do candidato/time na tela da urna */
.screen .ph{display:none;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:4px}
.screen.has-photo .ph{display:block}
.screen.has-photo{justify-content:flex-end;padding-bottom:8px;gap:6px}
.screen.has-photo:after{content:"";position:absolute;left:0;right:0;bottom:0;height:46%;background:linear-gradient(180deg,transparent,rgba(5,10,25,.82));pointer-events:none}
.screen.has-photo .digits{position:relative;z-index:2;gap:7px}
.screen.has-photo .digits i{width:44px;height:62px;font-size:46px;border-width:3px;background:rgba(255,255,255,.96)}
.screen.has-photo small{position:relative;z-index:2;color:#fff;font-size:15px;text-shadow:0 1px 3px #000}
.screen .fim{z-index:5}

/* selo em imagem (substitui rosa + etiqueta) */
.badge-team .seal{display:none;position:absolute;left:50%;top:-30px;width:306px;transform:translateX(-50%);filter:drop-shadow(0 12px 14px rgba(0,0,0,.55));animation:float 3.2s ease-in-out infinite}
.badge-team.has-seal .seal{display:block}.badge-team.has-seal .rose,.badge-team.has-seal .tag{display:none}

/* quem enviou: faixa com o nome embaixo do cartão do time */
.sender{position:absolute;top:350px;height:58px;z-index:6;display:flex;align-items:center;gap:12px;padding:0 20px 0 6px;border-radius:30px;background:linear-gradient(90deg,rgba(6,12,30,.96),rgba(12,22,52,.9));border:3px solid var(--tc);box-shadow:0 10px 18px rgba(0,0,0,.55),0 0 22px var(--tc);opacity:0;transform:translateY(16px) scale(.96);transition:opacity .25s,transform .3s cubic-bezier(.2,.9,.3,1.2);pointer-events:none;max-width:calc(50% - 40px);left:0}
#senderB{left:auto;right:0}#senderA{left:14px}#senderB{right:14px}
.sender.show{opacity:1;transform:none}
.sender .av{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font:800 24px Inter;background:hsl(var(--h) 55% 38%);border:2px solid #fff;flex-shrink:0}
.sender .nm{font:800 28px Inter;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:190px}
.sender .wh{font:700 22px "Barlow Condensed";font-style:italic;letter-spacing:.04em;color:#cfd9f7;white-space:nowrap}
.sender .pl{margin-left:auto;font:400 34px Anton;color:#ffd24a;text-shadow:0 2px 0 rgba(0,0,0,.5);white-space:nowrap}

.logo-img{display:block;position:relative;margin:-8px auto 0;width:760px;filter:drop-shadow(0 14px 16px rgba(0,0,0,.55));animation:logoFloat 4.5s ease-in-out infinite}
@keyframes logoFloat{50%{transform:translateY(-6px) scale(1.01)}}

/* faixa do remetente em duas linhas: nome em cima, presente embaixo */
.sender{top:344px;height:68px;gap:12px}
.sender .tx{display:flex;flex-direction:column;min-width:0;line-height:1.02}
.sender .nm{max-width:300px;font-size:30px}.sender .wh{font-size:23px;margin-top:1px}
.sender .av{width:50px;height:50px}

/* faixa de chamada dinâmica */
@property --ang{syntax:"<angle>";initial-value:0deg;inherits:false}
@keyframes spin{to{--ang:360deg}}
.cta{position:absolute;left:30px;right:30px;top:1504px;height:112px;z-index:6;display:grid;grid-template-columns:132px minmax(0,1fr) 132px;align-items:center;gap:14px;padding:0 12px;border-radius:30px;border:5px solid transparent;
 background:linear-gradient(180deg,#101a40,#070c24) padding-box,conic-gradient(from var(--ang),var(--ca),var(--cb),var(--ca),var(--cb),var(--ca)) border-box;
 box-shadow:0 14px 26px rgba(0,0,0,.55),-12px 0 34px var(--caA30),12px 0 34px var(--cbA30);animation:spin 3.6s linear infinite;overflow:hidden}
.cta-btn{position:relative;height:86px;border-radius:22px;display:flex;flex-direction:column;align-items:center;justify-content:center;border:4px solid #fff;color:#fff;box-shadow:0 8px 14px rgba(0,0,0,.5),inset 0 -6px 0 rgba(0,0,0,.22),inset 0 6px 8px rgba(255,255,255,.45)}
.cta-btn small{font:800 19px "Barlow Condensed";font-style:italic;letter-spacing:.16em;margin-bottom:-4px;text-shadow:0 2px 0 rgba(0,0,0,.45)}
.cta-btn b{font:400 56px/1 Anton;text-shadow:0 4px 0 rgba(0,0,0,.4)}
.cta-btn.a{background:linear-gradient(180deg,var(--caL),var(--ca) 55%,var(--caD));animation:boing 2.4s ease-in-out infinite}
.cta-btn.b{background:linear-gradient(180deg,var(--cbL),var(--cb) 55%,var(--cbD));animation:boing 2.4s ease-in-out infinite;animation-delay:1.2s}
@keyframes boing{0%,70%,100%{transform:none}78%{transform:translateY(-10px) scale(1.12) rotate(-3deg)}88%{transform:translateY(0) scale(.96)}94%{transform:scale(1.04)}}
.cta-mid{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:6px;text-align:center;min-width:0;height:100%;overflow:hidden;line-height:1}
.cta-text{font:800 52px "Barlow Condensed";font-style:italic;letter-spacing:.02em;color:#fff;text-shadow:0 3px 0 #0a1230;white-space:nowrap;max-width:100%;overflow:hidden}
.cta-sub{max-width:100%;overflow:hidden;white-space:nowrap;font:700 24px "Barlow Condensed";font-style:italic;letter-spacing:.1em;color:#ffe08a;text-transform:uppercase}
.cta-text.pop,.cta-sub.pop{animation:ctaPop .55s cubic-bezier(.2,.9,.3,1.3)}
@keyframes ctaPop{0%{opacity:0;transform:translateY(22px) scale(.8)}100%{opacity:1;transform:none}}
.shine{position:absolute;top:0;bottom:0;width:120px;left:-160px;background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);transform:skewX(-20deg);animation:shineMove 3.4s ease-in-out infinite;pointer-events:none}
@keyframes shineMove{0%,55%{left:-160px}100%{left:1100px}}
.spark{position:absolute;width:12px;height:12px;background:#fff;clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%);opacity:0;animation:twinkle 2.2s infinite;pointer-events:none}
.spark.s1{left:158px;top:10px}.spark.s2{left:520px;bottom:8px;animation-delay:.7s}.spark.s3{right:170px;top:12px;animation-delay:1.3s}.spark.s4{left:320px;bottom:10px;animation-delay:1.8s}
@keyframes twinkle{0%,100%{opacity:0;transform:scale(.3) rotate(0)}50%{opacity:1;transform:scale(1.4) rotate(90deg)}}
.cta.urgent{animation:spin 1.1s linear infinite,shake .35s infinite;box-shadow:0 14px 26px rgba(0,0,0,.55),0 0 40px var(--cbA30),0 0 40px var(--cbA30)}
.cta.urgent .cta-text{color:#ff6b78;text-shadow:0 3px 0 #2a0610}
@keyframes shake{25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}
.tally{position:absolute;left:30px;right:30px;top:1634px;z-index:6;display:flex;align-items:center;justify-content:center;gap:12px}
.tally .tl,.tally .rd{display:inline-flex;align-items:center;gap:10px;height:46px;padding:0 18px;border-radius:24px;font:800 26px "Barlow Condensed";font-style:italic;letter-spacing:.08em;color:#fff;border:3px solid #fff;box-shadow:0 6px 10px rgba(0,0,0,.45)}
.tally .tl.a{background:linear-gradient(180deg,var(--caL),var(--ca))}.tally .tl.b{background:linear-gradient(180deg,var(--cbL),var(--cb))}
.tally .tl b{font:400 32px Anton;font-style:normal;background:#fff;color:#111;border-radius:10px;padding:0 10px;line-height:36px}
.tally .rd{background:linear-gradient(180deg,#2a3150,#10142a);border-color:rgba(255,255,255,.5)}

/* nomes compridos: nunca estouram o espaço */
.tally .tl>span:not(.x){display:inline-block;max-width:250px;overflow:hidden;white-space:nowrap}
.cta-text{overflow:hidden}

/* voto de chat (discreto) x presente (dourado, grande, brilhante) */
.sender .av{position:relative;overflow:visible}
.sender .kic{position:absolute;right:-8px;bottom:-6px;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-style:normal}
.sender .kic svg{width:15px;height:15px}
.sender.chat{height:58px;top:352px;border:2px solid rgba(255,255,255,.3);background:rgba(8,14,34,.8);box-shadow:0 8px 14px rgba(0,0,0,.45);animation:chatIn .35s ease-out}
.sender.chat .kic{background:#3a4468;color:#cfe0ff;border:2px solid #0b1230}
.sender.chat .nm{font-size:26px}.sender.chat .wh{font-size:20px;color:#9fb0d8}.sender.chat .pl{font-size:28px;color:#cfe0ff}
.sender.chat .av{width:42px;height:42px;font-size:22px}
.sender.gift{height:82px;top:336px;gap:14px;padding:0 24px 0 8px;border:4px solid transparent;overflow:hidden;
 background:linear-gradient(90deg,#1c1234,#2c1a44) padding-box,linear-gradient(120deg,#fff3a6,#ffb01e,#fff3a6,#e08a00,#fff3a6) border-box;
 box-shadow:0 14px 24px rgba(0,0,0,.6),0 0 34px rgba(255,190,50,.6),0 0 60px var(--tc);animation:giftIn .7s cubic-bezier(.2,1.4,.3,1)}
.sender.gift .av{width:58px;height:58px;border-color:#ffd24a;box-shadow:0 0 16px #ffd24a;font-size:28px}
.sender.gift .kic{background:linear-gradient(180deg,#fff3a6,#ffb01e);color:#6b4a00;width:28px;height:28px;border:2px solid #fff}
.sender.gift .kic svg{width:17px;height:17px}
.sender.gift .nm{font-size:32px;color:#fff3c4;text-shadow:0 2px 0 rgba(0,0,0,.5)}
.sender.gift .wh{font-size:24px;color:#ffe08a}
.sender.gift .pl{font-size:52px;color:#ffe36a;text-shadow:0 3px 0 #7a4a00,0 0 18px rgba(255,200,60,.9);animation:pop .5s .2s both}
.sender .kind{position:absolute;left:78px;top:-1px;font:800 15px "Barlow Condensed";font-style:italic;letter-spacing:.18em;color:#5a3a00;background:linear-gradient(180deg,#fff3a6,#ffb01e);padding:0 12px;border-radius:0 0 10px 10px}
.sender .gshine{position:absolute;top:0;bottom:0;width:90px;left:-120px;background:linear-gradient(100deg,transparent,rgba(255,255,255,.5),transparent);transform:skewX(-20deg);animation:gshine 2.4s ease-in-out infinite;pointer-events:none}
@keyframes gshine{0%,45%{left:-120px}100%{left:110%}}
@keyframes giftIn{0%{opacity:0;transform:translateY(30px) scale(.5)}60%{transform:translateY(-6px) scale(1.08)}100%{opacity:1;transform:none}}
@keyframes chatIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.sender.gift.show,.sender.chat.show{opacity:1;transform:none}
.sender.gift{height:90px;top:330px}
.sender.gift .tx{padding-top:10px}

/* faixa do remetente: sempre da largura do card; o nome se ajusta ao espaço */
.sender{width:calc(50% - 28px);max-width:none;box-sizing:border-box}
#senderA{left:14px}#senderB{right:14px}
.sender .tx{flex:1;min-width:0}
.sender .nm,.sender .wh{max-width:100%;overflow:hidden;white-space:nowrap}
.sender .pl{margin-left:0;flex-shrink:0}

#soundHint{position:absolute;left:50%;top:26px;transform:translateX(-50%);z-index:20;padding:8px 22px;border-radius:20px;background:rgba(0,0,0,.65);border:2px solid rgba(255,255,255,.35);font:800 22px "Barlow Condensed";font-style:italic;letter-spacing:.14em;color:#fff;animation:pulse 1.4s infinite;pointer-events:none}

.tally .tl{min-width:74px;justify-content:center;padding:0 12px}

/* aviso de virada: selo na cor do time, em duas linhas, sempre dentro da tela */
.flash{display:flex;justify-content:center;top:660px;padding:0 40px;font:inherit;text-shadow:none;white-space:normal;opacity:1}
.flash.show{animation:none}
.flash .fi{max-width:960px;min-width:420px;padding:16px 44px 18px;border-radius:32px;border:6px solid #fff;text-align:center;line-height:1;opacity:0;
 background:linear-gradient(180deg,var(--tcl),var(--tc) 55%,var(--tcd));box-shadow:0 16px 30px rgba(0,0,0,.6),0 0 50px var(--tc)}
.flash .fi b{display:block;font:400 112px/1 Anton;color:#fff;text-shadow:0 6px 0 rgba(0,0,0,.4);letter-spacing:.02em}
.flash .fi span{display:block;max-width:100%;overflow:hidden;white-space:nowrap;font:800 60px "Barlow Condensed";font-style:italic;color:#fff;text-shadow:0 4px 0 rgba(0,0,0,.4);margin-top:4px}
.flash.show .fi{animation:flashIn 2.1s cubic-bezier(.2,.9,.3,1.1) forwards}

/* modo leve (servidor): sem animações de enfeite contínuas nem sombras filtradas; mantém mão, urnas, rosas e confete */
.leve .logo-img,.leve .seal,.leve .rose,.leve .cta,.leve .cta-btn,.leve .shine,.leve .spark,.leve .live-tag i,.leve .gshine,.leve .tan{animation:none!important}
.leve .hand,.leve .logo-img,.leve .seal,.leve .rose{filter:none!important}
.leve .spark,.leve .shine,.leve #soundHint{display:none!important}
.leve .cta{box-shadow:none!important}
