/* JSHOW • tema "SG" • 17/10/2026.
   Identidade visual do app SGJOGO (pedido do Jonas): só a cara, a organização da página é a mesma.
   As cinco cores principais continuam vindo do painel:
   --bg-outer (fundo), --bg-inner (caixas), --btn-bg (cartões), --btn-border (verde de ação), --text. */
:root{
  --green:var(--btn-border);
  --green-ink:#10140f;
  --yellow:#f7d24a;
  --yellow-2:#f2b33a;
  --hero:#17703b;
  --hero-2:#2c9a52;
  --muted:#a3a7ae;
  --line:#ffffff14;
  --ink:#ffffff;
  --radius:20px;
}
*,*::before,*::after{box-sizing:border-box}
html{min-height:100%;color-scheme:dark}
body{
  margin:0;min-height:100vh;
  font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  color:var(--text);background:var(--bg-outer);
  background-image:radial-gradient(ellipse 90% 40% at 50% -8%,#7ee07a1f,transparent 70%);
  -webkit-font-smoothing:antialiased;
}
button,a{-webkit-tap-highlight-color:transparent}
a,button{touch-action:manipulation}
a:focus-visible,button:focus-visible{outline:3px solid var(--green);outline-offset:4px}
.wrap{
  position:relative;width:100%;max-width:532px;margin:auto;
  padding:18px 16px calc(184px + env(safe-area-inset-bottom));
}
body:has(#cookie[hidden]) .wrap{padding-bottom:48px}

/* topo: marca em itálico pesado, como o logo do SGJOGO */
.hero{position:relative;margin-bottom:22px}
.hero-top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:4px 2px 0}
.brand-word{margin:0;color:var(--text);font-size:38px;line-height:1.05;font-weight:900;font-style:italic;letter-spacing:-1.5px;text-shadow:0 2px 0 #0006}
.brand-word span{color:var(--yellow);background:linear-gradient(180deg,var(--yellow),var(--yellow-2));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-shadow:none;filter:drop-shadow(0 2px 0 #0006)}
.brand-signal{display:flex;align-items:flex-end;gap:4px;height:24px;padding:0 2px}
.brand-signal i{display:block;width:5px;height:10px;background:var(--green);border-radius:3px}
.brand-signal i:nth-child(2){height:16px}
.brand-signal i:nth-child(3){height:24px}
.hero-rule{display:none}

/* "bem-vindo": cartão grafite (sem o fundo verde, pedido do Jonas 17/10) com uma luz verde que passeia */
.hero-stage{
  position:relative;overflow:hidden;margin-top:16px;
  display:grid;grid-template-columns:minmax(0,1fr) 112px;gap:16px;align-items:center;
  padding:22px 18px;border-radius:var(--radius);
  background:var(--btn-bg);border:1px solid var(--line);
  box-shadow:0 10px 26px #0005;
}
.hero-stage::before{content:"";position:absolute;left:-60px;top:-70px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,#7ee07a26,transparent 65%);pointer-events:none;animation:glow-drift 9s ease-in-out infinite alternate}
.hero-stage::after{content:"";position:absolute;left:18px;right:18px;bottom:0;height:2px;border-radius:2px;background:linear-gradient(90deg,transparent,var(--green),transparent);background-size:200% 100%;animation:line-run 3.5s linear infinite;pointer-events:none}
.hero-stage.no-banner{grid-template-columns:minmax(0,1fr)}
.hero-copy{position:relative;min-width:0}
h1{font-size:clamp(28px,8vw,40px);font-weight:900;line-height:1.05;letter-spacing:-1.2px;margin:0;color:#fff;overflow-wrap:anywhere}
.hero-copy h1::after{content:"";display:block;width:64px;height:10px;margin-top:14px;border-radius:999px;background:linear-gradient(110deg,var(--yellow-2) 0%,var(--yellow) 40%,#fff4c2 50%,var(--yellow) 60%,var(--yellow-2) 100%);background-size:250% 100%;box-shadow:0 3px 0 #b8861b;animation:bar-shimmer 3s ease-in-out infinite}
.banner{position:relative;display:block;width:112px;height:112px;aspect-ratio:1;object-fit:cover;border-radius:18px;box-shadow:0 8px 18px #0006;animation:float 5s ease-in-out infinite}

/* redes: círculos grafite */
.socials{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.hero-copy .socials{gap:8px;margin-top:18px}
.hero-copy .socials a{width:42px;height:42px}
.hero-copy .socials svg{width:20px;height:20px}
/* Faixa AO VIVO AGORA (em cima do bem-vindo; só aparece quando o Jonas liga no painel) */
.live-now{position:relative;display:grid;grid-template-columns:22px minmax(0,1fr) 40px;align-items:center;gap:12px;margin-top:16px;padding:12px 14px 12px 16px;border-radius:16px;
  background:linear-gradient(110deg,#e0242b,#ff4b3e 55%,#e0242b);background-size:200% 100%;color:#fff;text-decoration:none;
  box-shadow:0 0 0 3px #ff4b3e33,0 8px 22px #e0242b55;animation:live-sweep 3s linear infinite}
.ln-dot{width:14px;height:14px;border-radius:50%;background:#fff;box-shadow:0 0 0 0 #fff9;animation:ping 1.4s ease-out infinite}
.ln-txt{display:flex;flex-direction:column;min-width:0}
.ln-txt b{font-size:17px;font-weight:900;letter-spacing:.5px;line-height:1.1}
.ln-txt small{font-size:12px;opacity:.92}
.ln-go{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#fff;color:#e0242b;font-size:15px;padding-left:3px}
.live-now:focus-visible{outline:3px solid #fff;outline-offset:3px}
@keyframes live-sweep{0%{background-position:0 0}100%{background-position:200% 0}}
.live-now[hidden]{display:none}
.socials a{display:grid;place-items:center;width:46px;height:46px;background:var(--bg-inner);color:var(--text);border:1px solid var(--line);border-radius:50%;transition:background .18s,border-color .18s,transform .18s}
.socials svg{display:block;width:22px;height:22px}

/* caixa do aviso de live: o estado fica óbvio (ATIVADO verde, DESATIVADO cinza, BLOQUEADO laranja) */
.live-box{display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:12px;margin-top:14px;padding:14px;border-radius:18px;border:1px solid var(--line);background:var(--bg-inner);animation:rise .5s cubic-bezier(.2,.8,.2,1) .45s backwards;transition:background .25s,border-color .25s}
.live-box[hidden]{display:none!important}
.lb-icon{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:#ffffff10;font-size:20px}
.lb-txt{display:flex;flex-direction:column;gap:3px;min-width:0}
.lb-title{font-size:14px;font-weight:800;line-height:1.25}
.lb-sub{font-size:12px;line-height:1.45;color:var(--muted)}
.lb-btn{min-height:44px;min-width:96px;padding:10px 14px;border:0;border-radius:12px;font:800 13px/1.2 Inter,system-ui,sans-serif;cursor:pointer;background:var(--green);color:var(--green-ink);box-shadow:0 3px 0 #3f9a3c}
.lb-btn:disabled{opacity:.6;cursor:default}
.live-box[data-state=on]{border:2px solid var(--green);background:#7ee07a14}
.live-box[data-state=on] .lb-icon{background:var(--green)}
.live-box[data-state=on] .lb-title{color:#bff5bc}
.live-box[data-state=on] .lb-sub{color:#d6f5d4}
.live-box[data-state=on] .lb-btn{background:#33363c;color:#fff;box-shadow:none;border:1px solid #ffffff26}
.live-box[data-state=off] .lb-title{color:#e6e7ea}
.live-box[data-state=blocked]{border:2px solid #ff9f43;background:#ff9f4314}
.live-box[data-state=blocked] .lb-title{color:#ffc58a}
.live-box[data-state=blocked] .lb-sub{color:#ffe1c2}
.live-box[data-state=blocked] .lb-btn{background:#ff9f43;color:#2b1600;box-shadow:0 3px 0 #b86a1f}
.live-box[data-state=app] .lb-btn{background:var(--yellow);color:#2a1d02;box-shadow:0 3px 0 #b8861b}
@media(max-width:360px){.live-box{grid-template-columns:36px minmax(0,1fr)}.lb-btn{grid-column:1/-1;width:100%}}

/* sorteio ao vivo (só para quem tem o app): mesmo jeito da caixa do aviso de live, com borda amarela de destaque */
.sg-box{margin-top:14px;padding:16px;border-radius:18px;border:2px solid var(--yellow);background:linear-gradient(180deg,#f7d24a14,#f7d24a05 60%),var(--bg-inner);box-shadow:0 0 0 4px #f7d24a12;animation:rise .5s cubic-bezier(.2,.8,.2,1) .2s backwards}
.sg-box[hidden]{display:none!important}
.sg-head{display:flex;align-items:center;gap:12px}
.sg-icon{display:grid;place-items:center;flex:0 0 40px;width:40px;height:40px;border-radius:12px;background:linear-gradient(180deg,var(--yellow),var(--yellow-2));font-size:20px;box-shadow:0 3px 0 #b8861b}
.sg-title{margin:0;font-size:18px;font-weight:900;line-height:1.2;letter-spacing:-.2px;color:#fff}
.sg-lead{margin:12px 0 0;font-size:15px;font-weight:600;line-height:1.45;color:#e6e7ea}
.sg-timer{display:inline-block;margin:10px 0 0;padding:6px 12px;border-radius:999px;background:#f7d24a1f;border:1px solid #f7d24a59;color:#f9dd78;font-size:14px;font-weight:800;line-height:1.3;font-variant-numeric:tabular-nums}
.sg-form{display:flex;flex-direction:column;gap:12px;margin-top:14px}
.sg-field{display:flex;flex-direction:column;gap:6px}
.sg-field label{font-size:14px;font-weight:700;color:#fff}
.sg-field input{width:100%;min-height:48px;padding:11px 14px;border:1.5px solid #ffffff33;border-radius:12px;background:#17181b;color:#fff;font:600 16px/1.3 Inter,system-ui,sans-serif;transition:border-color .18s,box-shadow .18s}
.sg-field input::placeholder{color:#8b9097;font-weight:500}
.sg-field input:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px #7ee07a40}
.sg-field.sg-bad input{border-color:#ff6b6b;box-shadow:0 0 0 3px #ff6b6b33}
.sg-field.sg-bad input:focus-visible{outline-color:#ff6b6b}
.sg-err{margin:0;color:#ff9b93;font-size:13px;font-weight:700;line-height:1.4}
.sg-err-geral{padding:9px 12px;border-radius:12px;background:#ff6b6b1a;border:1px solid #ff6b6b4d}
.sg-btn{width:100%;min-height:52px;padding:14px 18px;border:0;border-radius:16px;background:var(--green);color:var(--green-ink);font:800 16px/1.2 Inter,system-ui,sans-serif;cursor:pointer;box-shadow:0 4px 0 #3f9a3c;transition:background .18s,transform .18s,box-shadow .18s}
.sg-btn:active{transform:translateY(2px);box-shadow:0 2px 0 #3f9a3c}
.sg-btn:disabled{background:#3a3d43;color:#c9ccd1;box-shadow:none;cursor:not-allowed;transform:none}
.sg-btn-app{margin-top:14px;background:var(--yellow);color:#2a1d02;box-shadow:0 4px 0 #b8861b}
.sg-priv{margin:0;font-size:12px;line-height:1.5;color:var(--muted)}
.sg-ok{display:flex;flex-direction:column;gap:4px;margin-top:12px;padding:12px 14px;border-radius:14px;border:2px solid var(--green);background:#7ee07a14}
.sg-ok b{font-size:16px;font-weight:800;line-height:1.4;color:#bff5bc;overflow-wrap:anywhere}
.sg-ok span{font-size:14px;line-height:1.45;color:#d6f5d4;overflow-wrap:anywhere}
.sg-box[data-view=fim] .sg-ok{border-color:var(--yellow);background:#f7d24a14}
.sg-box[data-view=fim] .sg-ok b{color:#f9dd78}
.sg-dupla{margin:12px 0 0;padding:10px 12px;border-radius:12px;background:#ffffff0a;border:1px solid var(--line);font-size:13px;font-weight:600;line-height:1.5;color:#e6e7ea}
.sg-dupla.on{background:#7ee07a14;border-color:#7ee07a59;color:#bff5bc;font-weight:800}
.sg-dupla a{display:inline-block;padding:4px 0;color:var(--yellow);font-weight:800;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.sg-dupla a:focus-visible,.sg-field input:focus-visible{outline:3px solid var(--green);outline-offset:2px}
.live-box.sg-chama{animation:sg-chama 1.2s ease-in-out 2}
@keyframes sg-chama{50%{box-shadow:0 0 0 4px var(--yellow),0 0 24px #f7d24a80}}
@media(hover:hover) and (pointer:fine){.sg-btn:not(:disabled):hover{filter:brightness(1.06)}}

/* ---------- Sorteio Diário: roxo e dourado do banner (só neste bloco), caixas grandes ---------- */
.links+.dr-box{margin-top:16px}
.dr-box{--dr-gold:#f7d24a;--dr-gold-2:#e9a92a;--dr-ink:#2a0b52;--dr-txt:#f1eaff;--dr-soft:#d9c8f5;
  margin-top:14px;overflow:hidden;border-radius:22px;border:2px solid var(--dr-gold);
  background:radial-gradient(120% 50% at 50% 0%,#6a22c766,transparent 70%),linear-gradient(180deg,#3a0f74 0%,#25094a 45%,#1b0736 100%);
  box-shadow:0 0 0 4px #f7d24a1a,0 0 30px #8a3ff033,0 14px 34px #0007;color:var(--dr-txt);
  animation:rise .5s cubic-bezier(.2,.8,.2,1) .15s backwards}
.dr-banner{display:block;width:100%;height:auto;aspect-ratio:3/1;object-fit:cover;border-bottom:2px solid #f7d24a80;background:#3a0f74}
.dr-body{padding:16px 16px 18px}
.dr-title{margin:0;text-align:center;font-size:22px;font-weight:900;line-height:1.2;letter-spacing:.4px;color:#ffe27a;text-shadow:0 2px 0 #6b3d00,0 0 18px #f7d24a55}
.dr-premios{position:relative;overflow:hidden;margin-top:14px;padding:10px 10px 12px;border-radius:18px;background:linear-gradient(160deg,#ffe788 0%,#f7c63a 55%,var(--dr-gold-2) 100%);box-shadow:0 4px 0 #a8730f,inset 0 1px 0 #fff9}
.dr-premios::after{content:"";position:absolute;top:0;bottom:0;left:-40%;width:28%;background:linear-gradient(90deg,transparent,#fff8,transparent);transform:skewX(-20deg);animation:shine 3.6s ease-in-out 1s infinite;pointer-events:none}
.dr-premios-t{margin:0 0 8px;text-align:center;font-size:12px;font-weight:900;letter-spacing:1.6px;text-transform:uppercase;color:#3d1475}
.dr-premios-g{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:6px}
.dr-premio{display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 6px 11px;border-radius:14px;background:linear-gradient(180deg,#3a0f74,var(--dr-ink));box-shadow:inset 0 0 0 1px #ffffff1f;text-align:center}
.dr-qtd{font-size:36px;font-weight:900;line-height:1;color:#ffd84d;text-shadow:0 2px 0 #00000059}
.dr-qtd::after{content:"×";margin-left:1px;font-size:22px}
.dr-tipo{font-size:13px;font-weight:700;line-height:1.25;color:var(--dr-soft)}
.dr-valor{font-size:20px;font-weight:900;line-height:1.15;color:#fff;white-space:nowrap}
.dr-mais{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--dr-ink);color:#ffd84d;font-size:20px;font-weight:900;line-height:1}
.dr-lead{margin:16px 0 0;text-align:center;font-size:16px;font-weight:700;line-height:1.5;color:var(--dr-txt)}
.dr-total{display:block;width:max-content;max-width:100%;margin:12px auto 0;padding:7px 14px;border-radius:999px;background:#f7d24a1f;border:1px solid #f7d24a66;color:#ffe27a;font-size:14px;font-weight:800;line-height:1.35;text-align:center}
.dr-form{display:flex;flex-direction:column;gap:14px;margin-top:16px}
.dr-regras{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.dr-regras li{display:grid;grid-template-columns:36px minmax(0,1fr);gap:12px;align-items:center;padding:10px 12px;border-radius:14px;background:#ffffff0d;border:1px solid #ffffff1c;font-size:14px;line-height:1.45;color:var(--dr-txt)}
.dr-regras b{color:#fff;font-weight:800}
.dr-ico{display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:linear-gradient(180deg,#ffe27a,var(--dr-gold-2));color:var(--dr-ink);box-shadow:0 2px 0 #a8730f}
.dr-ico svg{width:20px;height:20px}
.dr-regras .dr-r-forte{border:1.5px solid var(--dr-gold);background:#f7d24a17}
.dr-regras .dr-r-forte b{display:block;margin-bottom:2px;color:#ffe27a}
.dr-regras .dr-r-aviso{border-color:#ff8a8066;background:#ff6b6b14}
.dr-r-aviso .dr-ico{background:#ff8a80;color:#3a0505;box-shadow:0 2px 0 #b3433a}
.dr-r-live .dr-ico{background:#ff4d5e;color:#fff;box-shadow:0 2px 0 #a3202d}
.dr-r-live .dr-ico svg{animation:dr-pulso 1.6s ease-in-out infinite}
.dr-r-sorte .dr-ico{background:#5fcb7a;color:#0b2a14;box-shadow:0 2px 0 #2f8a4a}
.dr-field{display:flex;flex-direction:column;gap:6px}
.dr-field label{font-size:15px;font-weight:800;color:#fff}
.dr-field input{width:100%;min-height:52px;padding:12px 14px;border:1.5px solid #ffffff40;border-radius:14px;background:#150626;color:#fff;font:600 16px/1.3 Inter,system-ui,sans-serif;transition:border-color .18s,box-shadow .18s}
.dr-field input::placeholder{color:#9a8bb5;font-weight:500}
.dr-field input:focus{outline:none;border-color:var(--dr-gold);box-shadow:0 0 0 3px #f7d24a59}
.dr-field.dr-bad input{border-color:#ff6b6b;box-shadow:0 0 0 3px #ff6b6b33}
.dr-err{margin:0;color:#ffaaa3;font-size:14px;font-weight:700;line-height:1.4}
.dr-err-regras{margin-top:-6px;color:#ffe27a}
.dr-err-geral{padding:10px 12px;border-radius:12px;background:#ff6b6b1f;border:1px solid #ff6b6b59}
.dr-check{position:relative;display:grid;grid-template-columns:30px minmax(0,1fr);gap:12px;align-items:center;min-height:56px;padding:12px 14px;border:1.5px solid #ffffff40;border-radius:14px;background:#ffffff0a;cursor:pointer;transition:border-color .18s,background .18s}
.dr-check input{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.dr-check-box{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;border:2px solid var(--dr-gold);color:transparent;transition:background .18s,color .18s}
.dr-check-box svg{width:20px;height:20px}
.dr-check input:checked+.dr-check-box{background:var(--dr-gold);color:var(--dr-ink)}
.dr-check input:focus-visible+.dr-check-box{outline:3px solid #fff;outline-offset:3px}
.dr-check:has(input:checked){border-color:var(--dr-gold);background:#f7d24a17}
.dr-check.dr-falta{border-color:var(--dr-gold);animation:dr-chama 1.4s ease-in-out 2}
.dr-check.dr-bad{border-color:#ff6b6b}
.dr-check-t{font-size:15px;font-weight:700;line-height:1.4;color:#fff}
.dr-btn{position:relative;overflow:hidden;width:100%;min-height:56px;padding:15px 18px;border:0;border-radius:16px;background:linear-gradient(180deg,#ffe27a,#f7c63a 60%,var(--dr-gold-2));color:var(--dr-ink);font:900 17px/1.2 Inter,system-ui,sans-serif;cursor:pointer;box-shadow:0 4px 0 #a8730f;transition:transform .18s,box-shadow .18s,filter .18s}
.dr-btn:not(:disabled)::after{content:"";position:absolute;top:0;bottom:0;left:-40%;width:30%;background:linear-gradient(90deg,transparent,#fffa,transparent);transform:skewX(-20deg);animation:shine 2.8s ease-in-out 1s infinite}
.dr-btn:active{transform:translateY(2px);box-shadow:0 2px 0 #a8730f}
.dr-btn:disabled{background:#3d2a5c;color:#cbbde6;box-shadow:none;cursor:not-allowed;transform:none}
.dr-btn:focus-visible{outline:3px solid #fff;outline-offset:3px}
.dr-btn-app{margin-top:16px}
/* Sorteio diário: "Não é você? Trocar os dados" (20/10/2026) */
.dr-outro{margin:-4px 0 -6px}
.dr-link{min-height:44px;padding:0 2px;border:0;background:none;color:var(--dr-soft);font:700 14px/1.3 Inter,system-ui,sans-serif;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.dr-link:hover{color:#fff}
.dr-link:focus-visible{outline:3px solid var(--dr-gold);outline-offset:2px;border-radius:6px}
.dr-priv{margin:0;font-size:12px;line-height:1.5;color:var(--dr-soft)}
.dr-ok{display:flex;flex-direction:column;gap:6px;margin-top:16px;padding:14px 16px;border-radius:16px;border:2px solid #7ee07a;background:#7ee07a1f}
.dr-ok b{font-size:17px;font-weight:800;line-height:1.4;color:#c8f7c5;overflow-wrap:anywhere}
.dr-ok span{font-size:14px;line-height:1.5;color:#e3f8e1;overflow-wrap:anywhere}
.dr-box[data-view=fim] .dr-ok{border-color:var(--dr-gold);background:#f7d24a17}
.dr-box[data-view=fim] .dr-ok b{color:#ffe27a}
.dr-box[data-view=fim] .dr-ok span{color:var(--dr-txt)}
@keyframes dr-pulso{50%{opacity:.55}}
@keyframes dr-chama{50%{box-shadow:0 0 0 4px #f7d24a66,0 0 22px #f7d24a66}}
@media(hover:hover) and (pointer:fine){.dr-btn:not(:disabled):hover{filter:brightness(1.06)}.dr-check:hover{border-color:#f7d24aa6}}
@media(max-width:370px){.dr-body{padding:14px 12px 16px}.dr-title{font-size:20px}.dr-qtd{font-size:32px}.dr-valor{font-size:18px}.dr-regras li{grid-template-columns:32px minmax(0,1fr);gap:10px;padding:9px 10px}.dr-ico{width:32px;height:32px}.dr-ico svg{width:18px;height:18px}}
/* página eujota.com/sorteio */
.pg-sorteio{background-image:radial-gradient(ellipse 90% 40% at 50% -8%,#8a3ff040,transparent 70%)}
.dr-top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:4px 2px 0}
.dr-top+.dr-box{margin-top:16px}
a.brand-word{text-decoration:none;border-radius:8px}
.dr-voltar{margin:18px 0 0;text-align:center}
.dr-voltar a{display:inline-flex;align-items:center;min-height:44px;padding:8px 12px;color:var(--green);font-size:15px;font-weight:800;text-decoration:underline;text-underline-offset:4px}

/* faixa de prova social: pílula amarela, como o cartão "Prêmios" */
.social-proof{margin:0 0 14px;padding:11px 16px;border-radius:16px;background:linear-gradient(180deg,var(--yellow),var(--yellow-2));color:#2a1d02;font-size:13px;font-weight:800;line-height:1.4;text-align:center;box-shadow:0 4px 0 #b8861b;animation:proof-in .4s ease-out}

/* selos dentro dos botões */
.btn .proof{grid-column:1/-1;grid-row:3;display:flex;flex-direction:column;gap:7px;margin-top:12px;padding:9px 12px;border-radius:12px;background:#7ee07a14;border:1px solid #7ee07a33;color:#a8f0a4;font-size:12px;font-weight:700;line-height:1.4;animation:proof-in .4s ease-out}
.btn .proof[hidden],.proof-bar[hidden]{display:none!important}
.proof-bar{display:block;height:7px;border-radius:999px;background:#ffffff14;overflow:hidden}
.proof-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--green),var(--yellow));border-radius:999px;transition:width .8s ease-out}

/* caixa "Instale o app" */
.install{position:fixed;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));z-index:11;max-width:510px;margin:0 auto;display:grid;grid-template-columns:72px minmax(0,1fr) 40px;grid-template-areas:"ico txt x" "go go go";align-items:center;gap:14px 14px;padding:20px 18px 18px;background:linear-gradient(160deg,#2b2e33,#1d1f23 65%);color:var(--ink);border:2px solid var(--green);border-radius:22px;box-shadow:0 0 0 4px #7ee07a1f,0 0 28px #7ee07a40,0 12px 34px #000b;animation:install-up .35s ease-out,install-glow 2.4s ease-in-out .4s infinite}
.install[hidden],.howto[hidden]{display:none!important}
.install img{grid-area:ico;width:72px;height:72px;border-radius:18px;box-shadow:0 0 0 1px var(--line)}
.install-txt{grid-area:txt;display:flex;flex-direction:column;gap:5px;min-width:0}
.install-txt b{font-size:19px;font-weight:800;line-height:1.25;color:var(--ink)}
.install-txt span{font-size:14px;line-height:1.45;color:var(--muted)}
.install-go{grid-area:go;position:relative;overflow:hidden;min-height:56px;padding:14px 18px;border:0;border-radius:16px;background:var(--green);color:var(--green-ink);font:800 17px/1 Inter,system-ui,sans-serif;cursor:pointer;box-shadow:0 4px 0 #3f9a3c}
.install-go::after{content:"";position:absolute;top:0;bottom:0;left:-40%;width:30%;background:linear-gradient(90deg,transparent,#fff9,transparent);transform:skewX(-20deg);animation:shine 2.8s ease-in-out 1s infinite}
.install-go:active{transform:translateY(2px);box-shadow:0 2px 0 #3f9a3c}
@keyframes install-glow{50%{box-shadow:0 0 0 6px #7ee07a2e,0 0 40px #7ee07a66,0 12px 34px #000b}}
@keyframes shine{0%,55%{left:-40%}100%{left:130%}}
.install .install-x{grid-area:x;align-self:start}
.install-x{width:40px;height:40px;border:0;border-radius:50%;background:#ffffff10;color:var(--ink);font-size:18px;cursor:pointer}
.howto{position:fixed;inset:0;z-index:12;display:flex;align-items:flex-end;justify-content:center;padding:12px 12px calc(12px + env(safe-area-inset-bottom));background:#000b}
.howto-card{position:relative;width:100%;max-width:496px;padding:22px 18px 14px;background:#222428;color:var(--ink);border:1px solid var(--line);border-radius:22px;animation:install-up .3s ease-out}
.howto-card>b{display:block;font-size:17px;font-weight:800;margin:0 40px 14px 0}
.howto-card .install-x{position:absolute;top:12px;right:12px}
.howto-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.howto-steps li{display:grid;grid-template-columns:38px 1fr;gap:12px;align-items:center;padding:11px;border-radius:14px;border:1px solid transparent;font-size:13px;line-height:1.45;opacity:.55;transition:all .3s}
.howto-steps li.on{opacity:1;border-color:var(--green);background:#7ee07a12}
.howto-steps .ico{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:var(--green);color:var(--green-ink);font-weight:800}
.howto-steps .ico svg{width:20px;height:20px}
.howto-arrow{text-align:center;font-size:26px;color:var(--green);margin-top:6px;animation:bob 1s ease-in-out infinite}
.howto-dev{margin:-6px 40px 12px 0;font-size:12px;color:#aeb3ba}
.howto-note{margin:10px 2px 0;padding:10px 12px;border-radius:12px;background:#f7d24a14;border:1px solid #f7d24a40;color:#f3dc8a;font-size:12px;line-height:1.45}
.howto[data-pos=bc],.howto[data-pos=br]{align-items:flex-start;padding-top:calc(12px + env(safe-area-inset-top))}
.howto[data-pos=tr]{padding-top:76px}
.howto[data-pos] .howto-arrow{display:none}
.howto-point{position:fixed;z-index:13;display:grid;place-items:center;width:58px;height:58px;border-radius:50%;background:var(--green);color:var(--green-ink);font-size:30px;box-shadow:0 0 0 6px #7ee07a40,0 0 26px #7ee07a99;opacity:.35;transition:opacity .3s}
.howto-point[hidden]{display:none}
.howto.p1 .howto-point{opacity:1;animation:point-up 1s ease-in-out infinite}
.howto[data-pos=tr] .howto-point{top:calc(6px + env(safe-area-inset-top));right:10px}
.howto[data-pos=br] .howto-point{bottom:calc(6px + env(safe-area-inset-bottom));right:10px}
.howto[data-pos=bc] .howto-point{bottom:calc(6px + env(safe-area-inset-bottom));left:calc(50% - 29px)}
.howto[data-pos=br] .howto-point span,.howto[data-pos=bc] .howto-point span{display:inline-block;transform:rotate(180deg)}
.howto.p1[data-pos=br] .howto-point,.howto.p1[data-pos=bc] .howto-point{animation-name:point-down}
@keyframes point-up{0%,100%{translate:0 0}50%{translate:0 -6px}}
@keyframes point-down{0%,100%{translate:0 0}50%{translate:0 6px}}
@media (prefers-reduced-motion:reduce){.howto.p1 .howto-point{animation:none}}
@keyframes install-up{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes bob{50%{transform:translateY(5px)}}
@keyframes proof-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}

/* botões: cartões grafite com pílula verde de ação */
.links{display:flex;flex-direction:column;gap:12px;width:100%}
.btn{
  position:relative;display:grid;grid-template-columns:80px minmax(0,1fr) 40px;
  align-items:center;column-gap:14px;min-height:104px;width:100%;
  padding:14px;background:var(--btn-bg);color:var(--text);
  border:1px solid var(--line);border-radius:var(--radius);
  text-decoration:none;text-align:left;box-shadow:0 6px 16px #0004;
  transition:transform .18s,border-color .18s,box-shadow .18s;
}
.btn::before{content:none}
.btn>img,.btn>.noimg{grid-column:1;grid-row:1;width:80px;height:80px;aspect-ratio:1;object-fit:cover;border-radius:16px}
.btn>.noimg{display:block;background:#ffffff0d}
.txt{display:contents}
.txt strong{grid-column:2;grid-row:1;min-width:0;font-size:15px;font-weight:800;line-height:1.3;letter-spacing:-.1px;overflow-wrap:anywhere}
.txt small{grid-column:1/-1;grid-row:2;display:block;margin-top:12px;padding:9px 12px;border-radius:12px;background:#f7d24a14;border:1px solid #f7d24a33;color:#f6dc7a;font-size:12px;font-weight:700;line-height:1.5;overflow-wrap:anywhere}
.spacer{grid-column:3;grid-row:1;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--green);color:var(--green-ink);box-shadow:0 3px 0 #3f9a3c;pointer-events:none}
.spacer svg{width:20px;height:20px;transition:transform .18s}

.page-footer{display:flex;align-items:center;justify-content:center;gap:10px;padding-top:28px;color:var(--muted);font-size:11px;line-height:1.6;text-align:center}
.age-mark{display:inline-grid;place-items:center;flex:0 0 auto;width:36px;height:30px;color:#2a1d02;background:linear-gradient(180deg,var(--yellow),var(--yellow-2));border-radius:9px;font-size:11px;font-weight:900}

/* aviso de cookies */
.cookie{
  position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));
  z-index:10;width:auto;max-width:496px;margin:0 auto;padding:16px;
  color:var(--ink);background:#222428;
  border:1px solid var(--line);border-radius:18px;box-shadow:0 10px 28px #000a;
}
.cookie[hidden],[hidden]{display:none!important}
.cookie p{margin:0;font-size:12px;font-weight:500;line-height:1.6;color:#d6d8dc}
.cookie>div{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
.cookie button{min-width:0;min-height:46px;padding:10px 14px;border:0;border-radius:14px;background:#33363c;color:var(--ink);font:700 13px/1.3 Inter,system-ui,sans-serif;cursor:pointer;transition:background .18s,transform .18s}
.cookie button[data-c=ok]{color:var(--green-ink);background:var(--green);box-shadow:0 3px 0 #3f9a3c}
.cookie button:active{transform:translateY(1px)}

@media(hover:hover) and (pointer:fine){
  .btn:hover{transform:translateY(-2px);border-color:#7ee07a66;box-shadow:0 10px 22px #0006}
  .btn:hover .spacer svg{animation:none;transform:translateX(3px)}
  .socials a:hover{border-color:var(--green);transform:translateY(-2px)}
  .cookie button:hover{background:#3d4047}
  .cookie button[data-c=ok]:hover{filter:brightness(1.06)}
}
.btn:active{transform:translateY(1px)}
@media(min-width:600px){.wrap{padding-top:28px}.hero{margin-bottom:26px}.brand-word{font-size:44px}.hero-stage{padding:26px 24px;grid-template-columns:minmax(0,1fr) 128px}.banner{width:128px;height:128px}}
@media(max-width:380px){.wrap{padding-left:14px;padding-right:14px}.btn{padding:12px;column-gap:10px;grid-template-columns:70px minmax(0,1fr) 36px}.btn>img,.btn>.noimg{width:70px;height:70px}.txt strong{font-size:14px}.spacer{width:36px;height:36px}.brand-word{font-size:34px}.hero-stage{grid-template-columns:minmax(0,1fr) 96px}.banner{width:96px;height:96px}}
/* ---------- animações (pedido do Jonas 17/10: "eu gostava que tinha animação") ---------- */
/* barrinhas ao lado da marca pulam como um equalizador de live */
.brand-signal i{transform-origin:bottom;animation:eq 1.1s ease-in-out infinite}
.brand-signal i:nth-child(2){animation-delay:.18s}
.brand-signal i:nth-child(3){animation-delay:.36s}
/* marca entra deslizando */
.brand-word{animation:slide-in .6s cubic-bezier(.2,.8,.2,1) backwards}
/* cartão do bem-vindo, redes e botões entram um depois do outro */
.hero-stage{animation:rise .55s cubic-bezier(.2,.8,.2,1) .05s backwards}
.socials a{animation:pop .4s cubic-bezier(.2,.9,.3,1.3) backwards}
.socials a:nth-child(1){animation-delay:.25s}.socials a:nth-child(2){animation-delay:.32s}.socials a:nth-child(3){animation-delay:.39s}.socials a:nth-child(4){animation-delay:.46s}.socials a:nth-child(5){animation-delay:.53s}
.links>.btn{animation:rise .5s cubic-bezier(.2,.8,.2,1) backwards}
.links>.btn:nth-child(1){animation-delay:.3s}.links>.btn:nth-child(2){animation-delay:.38s}.links>.btn:nth-child(3){animation-delay:.46s}.links>.btn:nth-child(4){animation-delay:.54s}.links>.btn:nth-child(5){animation-delay:.62s}.links>.btn:nth-child(6){animation-delay:.7s}.links>.btn:nth-child(n+7){animation-delay:.78s}
/* bolinha verde da seta: brilho passando e a seta "chamando" */
.spacer{position:relative;overflow:hidden}
.spacer::after{content:"";position:absolute;top:-20%;bottom:-20%;left:-60%;width:40%;background:linear-gradient(90deg,transparent,#ffffffb3,transparent);transform:skewX(-20deg);animation:shine 3.2s ease-in-out infinite}
.links>.btn:nth-child(2) .spacer::after{animation-delay:.4s}.links>.btn:nth-child(3) .spacer::after{animation-delay:.8s}.links>.btn:nth-child(4) .spacer::after{animation-delay:1.2s}.links>.btn:nth-child(5) .spacer::after{animation-delay:1.6s}
.spacer svg{animation:nudge 1.8s ease-in-out infinite}
/* faixa amarela de prova social com reflexo */
.social-proof{background:linear-gradient(110deg,var(--yellow-2) 0%,var(--yellow) 40%,#fff1b0 50%,var(--yellow) 60%,var(--yellow-2) 100%);background-size:250% 100%;animation:proof-in .4s ease-out,bar-shimmer 3.5s ease-in-out infinite}
/* barrinha da meta com brilho correndo */
.proof-bar i{background:linear-gradient(90deg,var(--green),var(--yellow),var(--green));background-size:200% 100%;animation:line-run 2.5s linear infinite}
/* 18+ */
.age-mark{animation:pop .45s cubic-bezier(.2,.9,.3,1.3) .9s backwards}

@keyframes eq{0%,100%{transform:scaleY(1)}50%{transform:scaleY(.45)}}
@keyframes slide-in{from{opacity:0;transform:translateX(-14px)}to{opacity:1;transform:none}}
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes pop{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}
@keyframes nudge{0%,60%,100%{transform:none}30%{transform:translateX(3px)}}
@keyframes float{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-5px) rotate(-1.5deg)}}
@keyframes glow-drift{from{transform:translate(0,0)}to{transform:translate(170px,60px)}}
@keyframes line-run{from{background-position:200% 0}to{background-position:0 0}}
@keyframes bar-shimmer{0%,40%{background-position:100% 0}100%{background-position:-50% 0}}

@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.btn:hover,.socials a:hover,.btn:hover .spacer svg{transform:none}}

/* Foto da roleta (Sorteio por app): discreta, embaixo do "✅ Pronto" */
.sg-foto{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 12px;align-items:center;margin-top:12px;padding:12px;border:1px dashed var(--line);border-radius:14px}
.sg-foto[hidden],.sg-foto [hidden]{display:none!important}
.sg-foto-img{grid-row:1;width:52px;height:52px;border-radius:50%;object-fit:cover;border:2px solid var(--green)}
.sg-foto-txt{grid-column:1/-1;display:flex;flex-direction:column;align-items:flex-start;gap:6px;font-size:13px;line-height:1.4;color:var(--text)}
.sg-foto-img:not([hidden])+.sg-foto-txt{grid-column:2}
.sg-foto-btn{padding:9px 14px;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--text);font:700 13px/1.2 Inter,system-ui,sans-serif;cursor:pointer}
.sg-foto-btn:hover{border-color:var(--green)}
.sg-foto-priv{grid-column:1/-1;margin:2px 0 0;font-size:11px;opacity:.7}

/* ---------- Parcerias + Facebook com 2 páginas (19/10/2026) ---------- */
/* Parcerias: maleta com selo DOURADO da marca, borda dourada (chama o gerente sem atrapalhar o jogador) */
.socials .soc-parc{color:var(--yellow);border:2px solid var(--yellow);background:#f7d24a14;box-shadow:0 0 0 3px #f7d24a1f}
.socials .soc-parc:hover{border-color:var(--yellow);box-shadow:0 0 0 4px #f7d24a33}
/* Facebook: o "F" continua igual; só a BORDA ganha as cores das 2 páginas (Jshow vermelho, Jota azul) */
:root{--fb-jshow:#e53935;--fb-jota:#1e88e5}
.fb-cor{display:inline-block;flex:0 0 auto;width:12px;height:12px;border-radius:50%}
.fb-jshow{background:var(--fb-jshow)}
.fb-jota{background:var(--fb-jota)}

/* Página /parcerias */
.pg-parcerias .dr-top{display:flex;align-items:center;justify-content:space-between;padding:4px 2px 0}
.pc-selo{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;color:var(--yellow);border:2px solid var(--yellow);background:#f7d24a14}
.pc-selo svg{width:20px;height:20px}
.pc-box{margin-top:18px;padding:22px 18px;border-radius:var(--radius);background:var(--btn-bg);border:1px solid var(--line);box-shadow:0 10px 26px #0005}
.pc-titulo{margin:0 0 8px;font-size:26px;font-weight:900;letter-spacing:-.6px;color:#fff}
.pc-lead{margin:0 0 16px;color:var(--muted,#aeb3ba);font-size:15px;line-height:1.5}
.pc-sub{margin:20px 0 10px;font-size:13px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;color:var(--yellow)}
.pc-form{display:flex;flex-direction:column;gap:8px}
.pc-form label{font-size:14px;font-weight:700;color:var(--text)}
.pc-form input{min-height:52px;padding:12px 14px;border-radius:14px;border:1px solid var(--line);background:#121316;color:#fff;font:800 22px/1.2 Inter,system-ui,sans-serif;letter-spacing:6px;text-align:center}
.pc-form input:focus{outline:3px solid var(--green);outline-offset:2px}
.pc-form input[aria-invalid=true]{border-color:#ff6b6b}
.pc-erro{margin:0;color:#ffb4b4;font-size:13px;font-weight:700}
.pc-btn{display:flex;align-items:center;justify-content:center;min-height:52px;margin-top:6px;padding:12px 16px;border:0;border-radius:14px;background:var(--green);color:var(--green-ink);font:800 16px/1.2 Inter,system-ui,sans-serif;text-decoration:none;cursor:pointer;box-shadow:0 4px 0 #3f9a3c}
.pc-btn-whats{background:transparent;color:var(--text);border:1px solid var(--line);box-shadow:none}
.pc-ou{margin:18px 0 0;text-align:center;color:var(--muted,#aeb3ba);font-size:13px}
.pc-lista{display:flex;flex-direction:column;gap:10px}
.pc-pag{display:flex;align-items:center;gap:12px;min-height:60px;padding:12px 14px;border-radius:14px;background:#ffffff08;border:1px solid var(--line);color:var(--text);text-decoration:none}
.pc-pag span{display:flex;flex-direction:column}
.pc-pag b{font-size:16px}
.pc-pag small{font-size:12px;color:var(--muted,#aeb3ba)}
.pc-pag .fb-cor{width:16px;height:16px}
.pc-seta{margin-left:auto;opacity:.7}
.pc-nota{margin:18px 0 0;font-size:12px;color:var(--muted,#aeb3ba)}
/* os links do menuzinho do Facebook não são círculos (a regra geral das redes vale só para os ícones) */

/* 2 ícones do Facebook (19/10/2026): a capa de cada página aparece dentro do "f" */
.socials .soc-fb svg image{image-rendering:auto}
/* 5 ícones numa linha só no celular */
@media(max-width:430px){.hero-copy .socials{gap:5px}.hero-copy .socials a{width:34px;height:34px}.hero-copy .socials svg{width:18px;height:18px}}
/* Foto dentro do formulário do sorteio (19/10/2026) */
.sg-foto-rot{font-size:14px;font-weight:700}
.sg-foto-rot small{font-weight:600;opacity:.7}
.sg-foto-esc{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:6px}
.sg-foto-esc .sg-foto-img{width:52px;height:52px;border-radius:50%;object-fit:cover;border:2px solid var(--yellow)}
.sg-foto-tirar{min-height:44px;padding:0 12px;border:0;background:none;color:inherit;opacity:.75;font:inherit;font-size:14px;text-decoration:underline;cursor:pointer}
.sg-foto-dica{margin:6px 0 0;font-size:13px;opacity:.8}
.sg-foto-guardada{font-size:14px;font-weight:600;line-height:1.3}
.sg-foto-esc .sg-foto-btn{min-height:44px}
/* Sorteio pelo app: trocar foto e "Não é você?" (20/10/2026) */
.sg-foto-btn{min-height:44px}
.sg-foto-btn:disabled{opacity:.55;cursor:not-allowed}
.sg-outro{margin:-4px 0 0}
.sg-link{min-height:44px;padding:0 2px;border:0;background:none;color:inherit;opacity:.8;font:600 14px/1.3 Inter,system-ui,sans-serif;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.sg-link:hover{opacity:1}
/* Confirmação do nome igual ao Facebook, só na 1ª vez (aparelho sem foto guardada), 20/10/2026 */
.sg-conf{position:fixed;inset:0;z-index:12;display:flex;align-items:flex-end;justify-content:center;padding:12px 12px calc(12px + env(safe-area-inset-bottom));background:#000c}
.sg-conf[hidden]{display:none!important}
.sg-conf-card{width:100%;max-width:496px;max-height:calc(100dvh - 24px);overflow-y:auto;padding:22px 18px 16px;background:#222428;color:var(--ink);border:2px solid var(--yellow);border-radius:22px;box-shadow:0 0 0 4px #f7d24a26,0 12px 40px #000a;animation:install-up .3s ease-out}
.sg-conf-title{display:block;font-size:24px;font-weight:900;letter-spacing:.02em;color:var(--yellow)}
.sg-conf-txt{margin:10px 0 0;font-size:18px;font-weight:600;line-height:1.45;color:#fbe7a1}
.sg-conf-txt b{font-weight:900;color:var(--yellow)}
.sg-conf-rot{margin:16px 0 4px;font-size:14px;color:#c9ccd1}
.sg-conf-nome{margin:0;padding:12px 14px;border-radius:14px;background:#17181b;border:1.5px solid #ffffff33;font-size:22px;font-weight:800;line-height:1.3;color:#fff;overflow-wrap:anywhere}
.sg-conf-btns{display:flex;flex-direction:column;gap:8px;margin-top:16px}
.sg-conf-corrigir{min-height:48px;padding:12px 16px;border:1.5px solid #ffffff40;border-radius:16px;background:transparent;color:#fff;font:700 16px/1.2 Inter,system-ui,sans-serif;cursor:pointer}
.sg-conf-corrigir:hover{border-color:var(--yellow)}
.sg-conf button:focus-visible{outline:3px solid var(--yellow);outline-offset:2px}
@media(min-width:700px){.sg-conf{align-items:center}}
.sg-link:focus-visible{outline:3px solid var(--green);outline-offset:2px;border-radius:6px}
.pc-fb{display:grid;place-items:center;flex:0 0 auto;width:40px;height:40px;border-radius:50%;background:var(--bg-inner);border:1px solid var(--line);color:var(--text)}
.pc-fb svg{width:22px;height:22px}
.pc-como{margin-top:22px;padding:16px;border-radius:14px;background:#f7d24a0d;border:1px solid #f7d24a40}
.pc-como .pc-sub{margin-top:0}
.pc-como p{margin:0 0 6px;color:var(--text);font-size:14px;line-height:1.55}
.sg-opc{font-weight:600;opacity:.7}

/* Botão 📷 na linha das redes (20/10/2026): mesmo círculo dos outros ícones, com o emoji no tamanho do desenho */
.socials a:nth-child(6){animation-delay:.6s}
.socials .soc-foto{font-size:20px;line-height:1;text-decoration:none}
.socials .soc-foto span{display:block;transform:translateY(-1px)}
/* 5 ícones (o 📷 ficou no lugar do e-mail, 20/10/2026): mesmos tamanhos de antes (34px no celular) */
@media(max-width:430px){.socials .soc-foto{font-size:17px}}
/* Caixa do botão 📷: mesmo fundo e cartão da confirmação do nome do sorteio */
.fl .fl-card{position:relative;border-color:var(--line)}
.fl[data-passo="2"] .fl-card{border-color:var(--yellow)}
.fl-x{position:absolute;top:12px;right:12px}
.fl-passo[hidden]{display:none!important}
.fl-title{display:block;margin:0 44px 0 0;font-size:19px;font-weight:800;color:#fff}
.fl-lead{margin:8px 0 0;font-size:14px;line-height:1.5;color:#c9ccd1}
.fl-form{margin-top:16px}
.fl .sg-foto-esc [hidden]{display:none!important}
.fl-pronto{display:flex;flex-direction:column;align-items:center;text-align:center;gap:4px;padding-top:6px}
.fl-pronto .fl-title{margin:8px 0 0}
.fl-pronto .sg-btn{margin-top:16px}
.fl-pronto-img{width:96px;height:96px;border-radius:50%;object-fit:cover;border:3px solid var(--green)}
.fl button:focus-visible{outline:3px solid var(--yellow);outline-offset:2px}

/* ---------- Mensagens aos ganhadores (21/10/2026): faixa no topo e caixa da conversa ---------- */
.msg-faixa{position:fixed;top:calc(8px + env(safe-area-inset-top));left:10px;right:10px;z-index:11;max-width:512px;margin:0 auto;display:grid;grid-template-columns:28px minmax(0,1fr) auto;align-items:center;gap:10px;min-height:56px;padding:10px 12px 10px 14px;border:2px solid var(--yellow);border-radius:18px;background:linear-gradient(160deg,#2b2e33,#1d1f23 70%);color:#fff;font:800 15px/1.3 Inter,system-ui,sans-serif;text-align:left;cursor:pointer;box-shadow:0 0 0 4px #f7d24a26,0 10px 28px #000a;animation:msg-desce .35s ease-out}
.msg-faixa[hidden]{display:none!important}
.msg-faixa-ico{font-size:22px;line-height:1}
.msg-faixa-txt{min-width:0}
.msg-faixa-ver{padding:9px 14px;border-radius:12px;background:linear-gradient(180deg,var(--yellow),var(--yellow-2));color:#2a1d02;font-weight:900;font-size:14px;box-shadow:0 3px 0 #b8861b}
.msg-faixa-nova{animation:msg-desce .35s ease-out,msg-brilho 2.4s ease-in-out .4s infinite}
.msg-faixa:focus-visible{outline:3px solid #fff;outline-offset:3px}
body:has(.msg-faixa:not([hidden])) .wrap{padding-top:86px}
@keyframes msg-desce{from{transform:translateY(-120%);opacity:0}}
@keyframes msg-brilho{50%{box-shadow:0 0 0 4px #f7d24a55,0 0 26px #f7d24a80,0 10px 28px #000a}}
html.msg-aberta{overflow:hidden}
.msg .msg-card{position:relative;display:flex;flex-direction:column;gap:12px;height:min(760px,calc(100dvh - 24px));padding:18px 16px 14px;gap:10px}
.msg-x{position:absolute;top:12px;right:12px}
.msg-title{display:block;margin:2px 48px 0 0;font-size:19px;font-weight:900;line-height:1.3;color:#fff}
.msg-abas{display:flex;flex-wrap:wrap;gap:8px}
.msg-abas[hidden],.msg-premio[hidden],.msg-form[hidden],.msg-sup[hidden],.msg-fim[hidden],.msg-aviso[hidden],.msg-espera[hidden],.msg-sup-btn[hidden]{display:none!important}
.msg-aba{flex:0 0 auto;min-height:40px;padding:8px 12px;border:1.5px solid #ffffff33;border-radius:999px;background:transparent;color:#e6e7ea;font:700 13px/1.2 Inter,system-ui,sans-serif;cursor:pointer;white-space:normal;text-align:left}
.msg-aba[aria-pressed=true]{border-color:var(--yellow);background:#f7d24a1f;color:var(--yellow)}
.msg-premio{flex:0 0 auto;display:flex;flex-direction:column;gap:2px;padding:10px 12px;border-radius:16px;border:1.5px solid var(--yellow);background:linear-gradient(180deg,#f7d24a1a,#f7d24a08)}
.msg-premio-topo{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.msg-premio-rot{font-size:13px;font-weight:700;color:#fbe7a1}
.msg-premio-nome{font-size:18px;font-weight:900;line-height:1.25;color:var(--yellow);overflow-wrap:anywhere}
.msg-pago{padding:4px 10px;border-radius:999px;background:#7ee07a26;border:1px solid var(--green);color:#bff5bc;font-size:12px;font-weight:800}
.msg-codigo{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:6px 10px;margin-top:6px;padding-top:8px;border-top:1px dashed #f7d24a55}
.msg-codigo-rot{grid-column:1/-1;font-size:13px;font-weight:700;color:#e6e7ea}
.msg-codigo-txt{min-width:0;padding:10px 12px;border-radius:12px;background:#17181b;border:1.5px solid #ffffff33;font:800 17px/1.2 ui-monospace,Consolas,monospace;letter-spacing:.04em;color:#fff;overflow-wrap:anywhere;user-select:all}
.msg-copiar{min-height:44px;padding:10px 12px;border:0;border-radius:12px;background:var(--green);color:var(--green-ink);font:800 13px/1.2 Inter,system-ui,sans-serif;cursor:pointer;box-shadow:0 3px 0 #3f9a3c;white-space:nowrap}
.msg-lista{flex:1 1 auto;min-height:120px;overflow-y:auto;display:flex;flex-direction:column;gap:10px;padding:12px 10px;border-radius:16px;background:#17181b;border:1px solid var(--line);overscroll-behavior:contain}
.msg-balao{max-width:86%;padding:9px 12px 7px;border-radius:16px;font-size:15px;line-height:1.45;overflow-wrap:anywhere}
.msg-balao p{margin:0;white-space:pre-wrap}
.msg-eles{align-self:flex-start;background:#2c2f35;border:1px solid #ffffff1a;border-bottom-left-radius:6px;color:#f4f5f6}
.msg-eu{align-self:flex-end;background:#1f5a2c;border:1px solid #7ee07a55;border-bottom-right-radius:6px;color:#eafbe9}
.msg-quem{display:block;margin-bottom:2px;font-size:12px;font-weight:800;color:var(--yellow)}
.msg-eu .msg-quem{color:#bff5bc;text-align:right}
.msg-suporte{border-style:dashed}
.msg-destaque{align-self:center;max-width:94%;padding:10px 14px 8px;border-radius:14px;border:1.5px solid var(--yellow);background:#f7d24a1a;color:#fff3c4;font-weight:700;text-align:center}
.msg-hora{display:block;margin-top:3px;font-size:11px;font-weight:600;color:#a3a7ae;text-align:right}
.msg-destaque .msg-hora{text-align:center}
.msg-vazio{margin:auto;color:var(--muted);font-size:14px}
.msg-aviso{margin:0;padding:10px 12px;border-radius:12px;background:#ff9f4314;border:1.5px solid #ff9f43;color:#ffe1c2;font-size:14px;font-weight:600;line-height:1.45}
.msg-espera{margin:0;font-size:14px;line-height:1.45;color:#c9ccd1;text-align:center}
.msg-form{flex:0 0 auto}
.msg-rot{display:block;margin-bottom:6px;font-size:13px;font-weight:700;color:#c9ccd1}
.msg-linha{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:end}
.msg-linha textarea{width:100%;min-height:48px;max-height:120px;padding:12px 14px;border-radius:14px;border:1.5px solid #ffffff33;background:#17181b;color:#fff;font:500 16px/1.4 Inter,system-ui,sans-serif;resize:none}
.msg-linha textarea:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px #7ee07a40}
.msg-enviar{min-height:48px;padding:12px 16px;border:0;border-radius:14px;background:var(--green);color:var(--green-ink);font:800 15px/1.2 Inter,system-ui,sans-serif;cursor:pointer;box-shadow:0 3px 0 #3f9a3c}
.msg-enviar:disabled,.msg-sup-btn:disabled{opacity:.6;cursor:wait}
.msg-sup{flex:0 0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px}
.msg-sup-btn{min-height:46px;padding:10px 12px;border:1.5px solid #ffffff40;border-radius:14px;background:transparent;color:#fff;font:700 14px/1.25 Inter,system-ui,sans-serif;cursor:pointer}
.msg-sup-btn:hover{border-color:var(--yellow)}
.msg-fim{flex:0 0 auto;margin:0;padding:12px;border-radius:14px;background:#ffffff0d;border:1px solid var(--line);color:#e6e7ea;font-size:15px;font-weight:800;text-align:center}
.msg button:focus-visible,.msg-linha textarea:focus-visible{outline:3px solid var(--yellow);outline-offset:2px}
/* Fase 2 (22/10/2026): foto e vídeo na conversa, recado do JSHOW e aviso festivo de quem ganhou */
.msg-premio-aviso{flex-direction:row;align-items:center;gap:8px}
.msg-premio-aviso .msg-premio-nome{font-size:17px}
.msg-balao-midia{width:min(280px,86%)}
.msg-midia{position:relative;display:block;width:100%;aspect-ratio:4/3;margin:2px 0 6px;padding:0;border:0;border-radius:12px;overflow:hidden;background:#3a3d44;color:#c9ccd1;font:700 13px/1.3 Inter,system-ui,sans-serif}
.msg-midia img,.msg-midia video{display:block;width:100%;height:100%;border:0}
.msg-midia img{object-fit:cover}
.msg-midia video{object-fit:contain;background:#000}
button.msg-midia{cursor:zoom-in}
.msg-midia-carrega{background:linear-gradient(100deg,#3a3d44 30%,#4a4e56 50%,#3a3d44 70%);background-size:250% 100%;animation:msg-carrega 1.4s ease-in-out infinite}
.msg-midia-erro{display:grid;place-items:center;padding:12px;text-align:center;cursor:pointer}
.msg-midia-lupa{position:absolute;right:8px;bottom:8px;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#000a;font-size:15px;pointer-events:none}
.msg-apagado{display:block;margin:0 0 4px;font-size:13px;font-style:italic;color:#c9ccd1}
.msg-txt:empty{display:none}
@keyframes msg-carrega{from{background-position:100% 0}to{background-position:-50% 0}}
.msg-zoom{position:fixed;inset:0;z-index:14;display:grid;place-items:center;padding:56px 12px calc(16px + env(safe-area-inset-bottom));background:#000e}
.msg-zoom[hidden],.msg-festa[hidden]{display:none!important}
.msg-zoom img{max-width:100%;max-height:100%;border-radius:12px;object-fit:contain}
.msg-zoom-x{position:absolute;top:calc(10px + env(safe-area-inset-top));right:12px;background:#ffffff26}
.msg-festa{position:fixed;inset:0;z-index:13;display:flex;align-items:center;justify-content:center;padding:16px 16px calc(16px + env(safe-area-inset-bottom));background:#000c}
.msg-festa-card{position:relative;width:100%;max-width:420px;overflow:hidden;padding:30px 20px 20px;border:2px solid var(--yellow);border-radius:24px;background:radial-gradient(ellipse 90% 60% at 50% 0,#f7d24a33,transparent 70%),linear-gradient(170deg,#2b2e33,#1d1f23 70%);color:#fff;text-align:center;box-shadow:0 0 0 4px #f7d24a26,0 0 40px #f7d24a55,0 14px 40px #000b;animation:msg-festa-entra .45s cubic-bezier(.2,.8,.2,1),msg-festa-brilho 2.6s ease-in-out .5s infinite}
.msg-festa-x{position:absolute;top:12px;right:12px;z-index:2}
.msg-festa-ico{position:relative;z-index:1;font-size:58px;line-height:1;filter:drop-shadow(0 4px 10px #0008);animation:msg-festa-pula 1.6s ease-in-out .5s infinite}
.msg-festa-tit{position:relative;z-index:1;display:block;margin:12px 34px 0;font-size:28px;font-weight:900;line-height:1.2;color:var(--yellow);text-shadow:0 2px 0 #0007;overflow-wrap:anywhere}
.msg-festa-premio{position:relative;z-index:1;display:inline-block;margin:12px 0 0;padding:8px 16px;border-radius:999px;background:linear-gradient(180deg,var(--yellow),var(--yellow-2));color:#2a1d02;font-size:19px;font-weight:900;line-height:1.25;box-shadow:0 3px 0 #b8861b;overflow-wrap:anywhere}
.msg-festa-premio:empty{display:none}
.msg-festa-txt{position:relative;z-index:1;margin:14px 0 0;font-size:16px;font-weight:600;line-height:1.45;color:#fbe7a1}
.msg-festa-ver{position:relative;z-index:1;display:block;width:100%;min-height:56px;margin-top:20px;padding:14px 18px;border:0;border-radius:16px;background:var(--green);color:var(--green-ink);font:900 18px/1.2 Inter,system-ui,sans-serif;cursor:pointer;box-shadow:0 4px 0 #3f9a3c}
.msg-festa-ver:active{transform:translateY(2px);box-shadow:0 2px 0 #3f9a3c}
.msg-festa button:focus-visible{outline:3px solid #fff;outline-offset:3px}
.msg-confete{position:absolute;inset:0;z-index:0;pointer-events:none}
.msg-confete i{position:absolute;top:-14px;left:calc(var(--x) * 1%);width:8px;height:13px;border-radius:2px;background:var(--c);opacity:0;animation:msg-confete var(--t) linear var(--d) infinite}
.msg-confete i:nth-child(3n){width:9px;height:9px;border-radius:50%}
.msg-confete i:nth-child(1){--x:6;--c:var(--yellow);--t:3.4s;--d:.1s}
.msg-confete i:nth-child(2){--x:14;--c:#7ee07a;--t:2.9s;--d:.9s}
.msg-confete i:nth-child(3){--x:21;--c:#fff4c2;--t:3.8s;--d:.4s}
.msg-confete i:nth-child(4){--x:28;--c:var(--yellow-2);--t:3.1s;--d:1.6s}
.msg-confete i:nth-child(5){--x:35;--c:#ff7a6b;--t:3.6s;--d:.2s}
.msg-confete i:nth-child(6){--x:42;--c:var(--yellow);--t:2.8s;--d:1.2s}
.msg-confete i:nth-child(7){--x:49;--c:#7ee07a;--t:3.3s;--d:.6s}
.msg-confete i:nth-child(8){--x:56;--c:#fff4c2;--t:3.9s;--d:1.9s}
.msg-confete i:nth-child(9){--x:62;--c:var(--yellow-2);--t:3s;--d:.3s}
.msg-confete i:nth-child(10){--x:69;--c:#6bb8ff;--t:3.5s;--d:1.4s}
.msg-confete i:nth-child(11){--x:75;--c:var(--yellow);--t:2.7s;--d:.8s}
.msg-confete i:nth-child(12){--x:81;--c:#7ee07a;--t:3.7s;--d:.05s}
.msg-confete i:nth-child(13){--x:87;--c:#fff4c2;--t:3.2s;--d:1.1s}
.msg-confete i:nth-child(14){--x:93;--c:#ff7a6b;--t:3.4s;--d:.5s}
.msg-confete i:nth-child(15){--x:10;--c:var(--yellow-2);--t:4s;--d:2.2s}
.msg-confete i:nth-child(16){--x:46;--c:#6bb8ff;--t:3.6s;--d:2.5s}
.msg-confete i:nth-child(17){--x:66;--c:var(--yellow);--t:3.3s;--d:2.8s}
.msg-confete i:nth-child(18){--x:84;--c:#7ee07a;--t:3.8s;--d:2s}
@keyframes msg-confete{0%{opacity:0;transform:translateY(0) rotate(0)}8%{opacity:1}85%{opacity:1}100%{opacity:0;transform:translateY(480px) translateX(18px) rotate(540deg)}}
@keyframes msg-festa-entra{from{opacity:0;transform:scale(.85) translateY(20px)}}
@keyframes msg-festa-brilho{50%{box-shadow:0 0 0 5px #f7d24a40,0 0 60px #f7d24a88,0 14px 40px #000b}}
@keyframes msg-festa-pula{50%{transform:translateY(-6px) rotate(-6deg)}}
@media(prefers-reduced-motion:reduce){.msg-faixa,.msg-faixa-nova,.msg-festa-card,.msg-festa-ico,.msg-midia-carrega{animation:none}.msg-confete i{animation:none;opacity:.9;top:calc(var(--x) * .22px + 6px);transform:rotate(calc(var(--x) * 9deg))}.msg-confete i:nth-child(n+10){display:none}}

/* ---------- Últimos ganhadores (21/10/2026): botão verde do WhatsApp no canto + painel da lista ---------- */
.gg-fab{position:fixed;right:calc(14px + env(safe-area-inset-right));bottom:calc(14px + env(safe-area-inset-bottom));z-index:9;display:inline-flex;align-items:center;gap:8px;min-height:52px;padding:8px 16px 8px 10px;border:0;border-radius:999px;background:#25d366;color:#06331a;font:800 15px/1 Inter,system-ui,sans-serif;cursor:pointer;box-shadow:0 0 0 3px #25d36633,0 8px 22px #000a;transition:bottom .25s ease,transform .15s}
.gg-fab[hidden]{display:none!important}
.gg-fab-ico{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#06331a;color:#25d366;flex:0 0 auto}
.gg-fab-ico svg{width:24px;height:24px}
.gg-fab:active{transform:translateY(1px) scale(.98)}
.gg-fab:focus-visible{outline:3px solid #fff;outline-offset:3px}
@media(hover:hover) and (pointer:fine){.gg-fab:hover{filter:brightness(1.06)}}
body:has(.gg-fab):has(#cookie[hidden]) .wrap,body:has(.gg-fab):not(:has(#cookie)) .wrap{padding-bottom:calc(86px + env(safe-area-inset-bottom))}
html.gg-aberto,html.gg-aberto body{overflow:hidden}
.gg{position:fixed;inset:0;z-index:13;display:flex;align-items:flex-end;justify-content:center;padding-top:calc(16px + env(safe-area-inset-top));background:#000c}
.gg[hidden]{display:none!important}
.gg-card{display:flex;flex-direction:column;width:100%;max-width:532px;max-height:calc(100dvh - 16px - env(safe-area-inset-top));padding:18px 16px calc(14px + env(safe-area-inset-bottom));background:#222428;color:var(--ink);border:2px solid var(--yellow);border-bottom:0;border-radius:22px 22px 0 0;box-shadow:0 0 0 4px #f7d24a26,0 -8px 40px #000a;animation:install-up .3s ease-out}
.gg-topo{display:flex;align-items:center;justify-content:space-between;gap:12px;flex:0 0 auto}
.gg-titulo{margin:0;font-size:22px;font-weight:900;line-height:1.2;letter-spacing:-.3px;color:var(--yellow)}
.gg-x{flex:0 0 auto;width:44px;height:44px}
.gg-oi{flex:0 0 auto;margin:10px 0 0;font-size:13px;font-weight:500;line-height:1.45;color:#c9ccd1;text-align:left}
.gg-app{flex:0 0 auto;display:flex;align-items:center;gap:6px;width:100%;min-height:42px;margin-top:10px;padding:6px 8px 6px 10px;border:0;border-radius:12px;background:#25d366;color:#06331a;font:800 12.5px/1.3 Inter,system-ui,sans-serif;text-align:left;cursor:pointer;box-shadow:0 2px 0 #179c48}
.gg-app[hidden]{display:none}
.gg-app-ico{flex:0 0 auto;font-size:14px;line-height:1}
.gg-app-txt{flex:1 1 auto;min-width:0}
.gg-app-seta{flex:0 0 auto;font-size:20px;font-weight:900;line-height:1}
.gg-app:active{transform:translateY(1px)}
.gg-filtros{flex:0 0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:12px;padding:4px;border-radius:16px;background:#17181b;border:1px solid var(--line)}
.gg-f{min-height:44px;padding:8px 10px;border:0;border-radius:12px;background:transparent;color:#c9ccd1;font:700 15px/1 Inter,system-ui,sans-serif;cursor:pointer}
.gg-f[aria-pressed=true]{background:var(--yellow);color:#1b1503;box-shadow:0 2px 0 #b8861b}
.gg-cab{flex:0 0 auto;display:flex;justify-content:space-between;gap:12px;margin-top:14px;padding:0 4px 8px;border-bottom:1px solid #ffffff1f;font-size:11px;font-weight:800;letter-spacing:.12em;color:#a3a7ae}
.gg-corpo{flex:1 1 auto;min-height:120px;overflow-y:auto;overscroll-behavior:contain;margin:0 -6px;padding:0 6px}
.gg-lista{list-style:none;margin:0;padding:0}
.gg-item{display:grid;grid-template-columns:minmax(min-content,1fr) auto;align-items:center;gap:12px;padding:12px 4px;border-bottom:1px solid #ffffff12}
.gg-quem{display:flex;flex-direction:column;gap:4px;min-width:0}
.gg-nome{width:0;min-width:100%;font-size:16px;font-weight:800;line-height:1.25;color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gg-tel{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:#c9ccd1;white-space:nowrap}
.gg-tel-ico{width:15px;height:15px;flex:0 0 auto;color:#25d366}
.gg-premio{display:flex;flex-direction:column;align-items:flex-end;gap:4px;text-align:right}
.gg-valor{padding:5px 10px;border-radius:999px;font-size:14px;font-weight:900;line-height:1.1;white-space:nowrap}
.gg-pix{background:#f7d24a1f;color:var(--yellow);border:1px solid #f7d24a59}
.gg-banca{background:#7ee07a1a;color:var(--green);border:1px solid #7ee07a4d}
.gg-data{font-size:12px;font-weight:600;color:#8d9198;white-space:nowrap}
.gg-quando{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:4px 6px}
.gg-marca{padding:2px 7px;border-radius:999px;font-size:11px;font-weight:700;line-height:1.3;white-space:nowrap}
.gg-vivo{background:#ff4d4d1a;color:#ff9a9a;border:1px solid #ff4d4d40}
.gg-fora{background:#8fa3c41a;color:#aab6c9;border:1px solid #8fa3c440}
.gg-link{text-decoration:none;cursor:pointer}
.gg-link:hover{background:#ff4d4d33;color:#ffc2c2}
@media(max-width:389px){.gg-item{row-gap:6px}.gg-premio{display:contents}.gg-valor{justify-self:end}.gg-quando{grid-column:1/-1}}
.gg-estado{margin:0;padding:26px 8px;font-size:15px;font-weight:600;line-height:1.5;color:#c9ccd1;text-align:center}
.gg-estado[hidden]{display:none}
.gg-erro{color:#ffd1a8}
.gg-carregando::before{content:"";display:block;width:26px;height:26px;margin:0 auto 10px;border-radius:50%;border:3px solid #ffffff26;border-top-color:var(--yellow);animation:gg-gira .8s linear infinite}
@keyframes gg-gira{to{transform:rotate(360deg)}}
.gg-mais{display:block;width:100%;min-height:48px;margin:12px 0 4px;padding:10px 16px;border:1.5px solid #ffffff40;border-radius:14px;background:transparent;color:#fff;font:700 15px/1.2 Inter,system-ui,sans-serif;cursor:pointer}
.gg-mais:disabled{opacity:.6;cursor:wait}
.gg-mais:hover{border-color:var(--yellow)}
.gg-com{flex:0 0 auto;display:flex;align-items:center;justify-content:center;gap:10px;min-height:50px;margin-top:12px;padding:10px 16px;border-radius:16px;background:#25d366;color:#06331a;font-size:15px;font-weight:800;text-decoration:none;box-shadow:0 3px 0 #179c48}
.gg-com-ico{display:grid;place-items:center;width:26px;height:26px;flex:0 0 auto}
.gg-com-ico svg{width:24px;height:24px}
.gg button:focus-visible,.gg a:focus-visible{outline:3px solid var(--yellow);outline-offset:2px}
@media(min-width:700px){.gg{align-items:center;padding:24px}.gg-card{max-width:480px;max-height:min(720px,calc(100dvh - 48px));border-bottom:2px solid var(--yellow);border-radius:22px;padding:20px 20px 18px}}
@media(max-width:360px){.gg-fab{padding-right:12px;font-size:14px}.gg-nome{font-size:15px}.gg-tel{font-size:12px}.gg-valor{font-size:13px;padding:4px 8px}.gg-marca{font-size:10.5px;padding:2px 6px}}

/* ---------- Salvar/Editar por campo (21/10/2026): nome, telefone e Pix ---------- */
.cs{display:flex;align-items:stretch;gap:8px}
.cs>input{flex:1 1 0;min-width:0;width:auto}
.cs-btn{flex:0 0 auto;min-width:78px;min-height:48px;padding:0 12px;border:1.5px solid var(--green);border-radius:12px;background:transparent;color:var(--green);font:800 14px/1 Inter,system-ui,sans-serif;cursor:pointer;transition:background .18s,border-color .18s,color .18s}
.cs-btn:hover{background:#7ee07a1a}
.cs-btn:focus-visible{outline:3px solid var(--green);outline-offset:2px}
.cs.cs-on>input{border-color:var(--green);background:#7ee07a17;cursor:default}
.cs.cs-on>input:focus{border-color:var(--green);box-shadow:0 0 0 3px #7ee07a40}
.cs.cs-on .cs-btn{border-color:#ffffff4d;background:#ffffff0f;color:#fff}
.cs.cs-on .cs-btn:hover{border-color:#ffffff80}
.cs-ok{color:var(--green);font-size:13px;font-weight:800;white-space:nowrap}
.dr-field .cs-btn{min-height:52px;border-radius:14px}
.dr-field .cs-ok{font-size:14px}
/* Foto obrigatória no Sorteio diário (23/10/2026): o mesmo jeito do 📷, nas cores do formulário do diário */
.dr-dica{margin:0;font-size:13px;line-height:1.4;color:var(--dr-soft)}
.dr-foto [hidden]{display:none!important}
.dr-foto .sg-foto-rot{font-size:15px;font-weight:800;color:#fff}
.dr-foto .sg-foto-esc{margin-top:2px}
.dr-foto .sg-foto-btn{border:1.5px solid #ffffff40;background:#150626;color:#fff}
.dr-foto .sg-foto-btn:hover{border-color:var(--dr-gold)}
.dr-foto .sg-foto-esc .sg-foto-img{border-color:var(--dr-gold)}
.dr-foto .sg-foto-dica{margin:0;color:var(--dr-soft);opacity:1}
.dr-foto.dr-bad .sg-foto-dica{color:#ffb3b3;font-weight:700}
@media(max-width:360px){.cs{gap:6px}.cs-btn{min-width:70px;padding:0 10px}}

/* ---------- Botão Mensagens (22/10/2026, pedido do Jonas): a área abre nas mensagens; os ganhadores ficam num botão ---------- */
.gg-fab-ico{font-size:20px;line-height:1}
.gg-fab-dot{position:absolute;top:4px;left:36px;width:12px;height:12px;border-radius:50%;background:#ff3b30;box-shadow:0 0 0 2px #25d366}
.gg-fab-dot[hidden]{display:none}
.gg-voltar{flex:0 0 auto;display:none;width:40px;height:40px;margin-right:-4px;border:0;border-radius:12px;background:transparent;color:var(--yellow);font:900 30px/1 Inter,system-ui,sans-serif;cursor:pointer}
.gg-voltar:focus-visible{outline:3px solid #fff;outline-offset:2px}
.gg-card:not(.gg-modo-msg) .gg-voltar{display:block}
.gg-topo .gg-titulo{flex:1 1 auto;min-width:0}
.gg-modo-msg .gg-filtros,.gg-modo-msg .gg-cab,.gg-modo-msg .gg-corpo{display:none}
.gg-card:not(.gg-modo-msg) .gg-msgs{display:none}
.gg-msgs{flex:0 1 auto;display:flex;flex-direction:column;gap:10px;margin-top:12px;min-height:0;overflow-y:auto;overscroll-behavior:contain}
.gg-bal{align-self:flex-start;max-width:92%;padding:9px 12px 10px;border-radius:16px;border-bottom-left-radius:6px;background:#2c2f35;border:1px solid #ffffff1a}
.gg-bal-de{display:block;margin-bottom:3px;font-size:12px;font-weight:800;color:var(--yellow)}
.gg-bal .gg-oi{margin:0;font-size:14px;color:#f4f5f6}
.gg-conversas{display:flex;flex-direction:column;gap:8px}
.gg-conversas[hidden]{display:none}
.gg-conv{display:flex;align-items:center;gap:10px;width:100%;min-height:52px;padding:8px 12px;border:1.5px solid var(--yellow);border-radius:14px;background:#f7d24a14;color:#fff;font:800 15px/1.25 Inter,system-ui,sans-serif;text-align:left;cursor:pointer}
.gg-conv-txt{flex:1 1 auto;min-width:0}
.gg-conv-nova{flex:0 0 auto;padding:3px 8px;border-radius:999px;background:#ff3b30;color:#fff;font-size:12px;font-weight:900}
.gg-conv-seta{flex:0 0 auto;font-size:22px;color:var(--yellow)}
.gg-ver{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:52px;padding:10px 16px;border:0;border-radius:16px;background:linear-gradient(180deg,var(--yellow),var(--yellow-2));color:#2a1d02;font:900 16px/1.2 Inter,system-ui,sans-serif;cursor:pointer;box-shadow:0 3px 0 #b8861b}
.gg-ver-seta{font-size:22px;line-height:1}
.gg-ver:focus-visible,.gg-conv:focus-visible{outline:3px solid #fff;outline-offset:3px}
@media(max-width:420px){.gg-card:not(.gg-modo-msg) .gg-titulo{font-size:19px}}

/* Galeria de avatares e foto obrigatória (22/10/2026, pedido do Jonas) */
.av-aviso{margin:6px 0 0;padding:8px 10px;border-radius:10px;background:#f7d24a1f;border:1px solid #f7d24a55;color:#fbe7a1;font-size:13px;font-weight:600;line-height:1.4}
.av-aviso[hidden]{display:none!important}
.sg-foto.sg-foto-falta{border:1.5px solid var(--yellow);border-style:solid;background:#f7d24a0f}
.sg-foto-txt .sg-foto-esc{margin-top:8px}
.av .av-card{position:relative;display:flex;flex-direction:column;max-height:calc(100dvh - 24px);border-color:var(--yellow)}
.av{z-index:13}
.av-abas{display:flex;gap:6px;margin:14px 0 10px}
.av-aba{flex:1 1 0;min-width:0;min-height:44px;padding:8px 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border:1.5px solid #ffffff33;border-radius:999px;background:transparent;color:#fff;font:700 13px/1.2 Inter,system-ui,sans-serif;cursor:pointer}
.av-aba[aria-selected="true"]{background:var(--yellow);border-color:var(--yellow);color:#2a1d02}
.av-grade{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:8px;min-height:160px;max-height:min(52dvh,430px);overflow-y:auto;padding:2px;overscroll-behavior:contain}
.av-op{position:relative;aspect-ratio:1;padding:0;border:2px solid transparent;border-radius:50%;background:#ffffff10;cursor:pointer;overflow:hidden}
.av-op img{display:block;width:100%;height:100%;border-radius:50%;object-fit:cover}
.av-op:hover,.av-op:focus-visible{border-color:var(--yellow);outline:none}
.av-op.av-carregando{opacity:.5}
.av button:focus-visible{outline:3px solid var(--yellow);outline-offset:2px}
.av .sg-err{margin-top:10px}

/* ---------- Aviso "Cadastre-se" no lugar da caixa do app (23/10/2026, desenho aprovado pelo Jonas) ---------- */
.cad{position:fixed;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));z-index:11;max-width:510px;margin:0 auto;padding:22px 18px 16px;background:linear-gradient(160deg,#2b2e33,#1d1f23 65%);color:var(--ink);border:2px solid var(--green);border-radius:22px;box-shadow:0 0 0 4px #7ee07a1f,0 0 28px #7ee07a40,0 12px 34px #000b;animation:install-up .35s ease-out;font-family:Inter,system-ui,sans-serif}
.cad[hidden],.cad-v[hidden]{display:none!important}
.cad-v{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px}
.cad-ico{font-size:34px;line-height:1}
.cad-tit{display:block;font-size:19px;font-weight:800;line-height:1.3;color:#fff}
.cad-sub{margin:0 0 6px;font-size:14px;line-height:1.5;color:#c9ccd1}
.cad-sub b{color:#fff}
.cad-go{width:100%;min-height:54px;margin-top:6px;padding:14px 18px;border:0;border-radius:16px;background:var(--green);color:var(--green-ink);font:800 17px/1.2 Inter,system-ui,sans-serif;cursor:pointer;box-shadow:0 4px 0 #3f9a3c}
.cad-go:active{transform:translateY(2px);box-shadow:0 2px 0 #3f9a3c}
.cad-nao{width:100%;min-height:48px;margin-top:4px;padding:11px 16px;border:1.5px solid #ffffff59;border-radius:16px;background:transparent;color:#d6d9de;font:700 15px/1.2 Inter,system-ui,sans-serif;cursor:pointer}
.cad-nao:hover{border-color:#ffffffa6;color:#fff}
.cad button:focus-visible{outline:3px solid var(--yellow);outline-offset:3px}
/* "Atualize seu cadastro": tom calmo (borda neutra, sem brilho verde) */
.cad:has(#cadAtual:not([hidden])){border-color:#ffffff33;box-shadow:0 12px 34px #000b}
.cad-v-atual{align-items:stretch;text-align:left}
.cad-linha{display:flex;align-items:center;gap:10px}
.cad-ico-p{font-size:22px;line-height:1}
.cad-falta{margin:2px 0 8px;padding:9px 12px;border:1px solid #ffffff26;border-radius:10px;font-size:13px;line-height:1.45;color:#c9ccd1}
.cad-falta b{color:#fff}
.cad-ja{width:100%;min-height:44px;margin-top:2px;padding:8px 12px;border:0;background:transparent;color:#9fd4ff;font:700 15px/1.2 Inter,system-ui,sans-serif;text-decoration:underline;cursor:pointer}
.cad-tel{width:100%;min-height:52px;margin-top:4px;padding:12px 14px;border:1.5px solid #ffffff59;border-radius:14px;background:#15171a;color:#fff;font:700 18px/1.2 Inter,system-ui,sans-serif;text-align:center}
.cad-ja-msg{min-height:18px;margin:2px 0 0;font-size:14px;line-height:1.4;color:#ffd27a;text-align:center}
.cad-go-calmo{background:#5b8def;color:#fff;box-shadow:0 4px 0 #3a63b8}
.cad-go-calmo:active{box-shadow:0 2px 0 #3a63b8}
/* Caixa "Seu cadastro" */
.fl-falta{margin:12px 0 0}
.fl .sg-field.fl-destaque input{border-color:var(--yellow);box-shadow:0 0 0 3px #f7d24a33}
.fl .sg-field.fl-destaque label{color:#ffe27a}
.fl-regras,.fl-check{--dr-gold:#f7d24a;--dr-gold-2:#e9a92a;--dr-ink:#2a0b52;--dr-txt:#e7e9ec;margin-top:12px}
.fl-regras li{background:#ffffff08}
.fl-check{margin-bottom:12px}
.fl-ouro{color:#ffe27a}
.fl-pronto .fl-baixar{margin-top:16px}
.fl-pronto .sg-conf-corrigir{width:100%;margin-top:10px}
/* Galeria de avatares no navegador do Facebook (23/10/2026, Jonas: "mal dá para ver as escolhas"): os desenhos ficavam
   um por cima do outro. Tamanho fixo de cada desenho e de cada linha, sem depender de aspect-ratio nem de dvh. */
.av .av-card{max-height:calc(100vh - 24px);max-height:calc(100dvh - 24px)}
.av-grade{grid-template-columns:repeat(auto-fill,64px);grid-auto-rows:64px;justify-content:space-between;align-content:start;max-height:52vh;max-height:min(52dvh,430px);flex:0 1 auto}
.av-op{width:64px;height:64px;min-width:64px;min-height:64px;aspect-ratio:auto}
.av-op img{width:60px;height:60px}
/* Link da live dentro do Facebook/Instagram: tela que leva para o Chrome/Safari (24/10/2026) */
/* Tela "Abra no Chrome/Safari" do link da live (visual novo no tema SG, 29/10/2026) */
html.saida-on,html.saida-on body{overflow:hidden}
.saida{position:fixed;inset:0;z-index:60;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:calc(24px + env(safe-area-inset-top)) 20px calc(22px + env(safe-area-inset-bottom));background:radial-gradient(120% 60% at 50% 0%,#2c9a5233 0%,#18191c00 60%),var(--bg-outer,#18191c);color:#fff;text-align:center;overflow-y:auto;font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;animation:saida-entra .35s cubic-bezier(.2,.8,.2,1)}
@keyframes saida-entra{from{opacity:0;transform:translateY(12px)}}
.saida[hidden]{display:none}
.saida-topo{display:flex;flex-direction:column;align-items:center;gap:8px}
.saida-topo img{width:64px;height:64px;border-radius:18px;box-shadow:0 0 0 3px #f7d24a,0 8px 26px #f7d24a44}
.saida-selo{padding:3px 10px;border-radius:999px;background:#f7d24a1f;color:var(--yellow,#f7d24a);font-size:11px;font-weight:900;letter-spacing:.12em}
.saida h2{margin:0;max-width:340px;font-size:26px;font-weight:900;line-height:1.15;letter-spacing:-.01em;color:#fff}
.saida h2 em{font-style:normal;color:var(--green,#7ee07a)}
.saida p{margin:0;max-width:330px;font-size:15px;line-height:1.45;color:var(--muted,#a3a7ae)}
.saida p b{color:#fff}
.saida-bene{list-style:none;width:100%;max-width:340px;margin:2px 0 0;padding:12px 14px;display:flex;flex-direction:column;gap:9px;border-radius:18px;background:var(--bg-inner,#222428);border:1px solid #ffffff14;text-align:left}
.saida-bene li{display:flex;align-items:center;gap:10px;font-size:14.5px;font-weight:600;color:#e9eaec}
.saida-bene li span{display:grid;place-items:center;flex:0 0 30px;height:30px;border-radius:10px;background:#ffffff0d;font-size:16px}
.saida-go{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;max-width:340px;min-height:60px;margin-top:4px;padding:0 20px;border:0;border-radius:999px;background:var(--green,#7ee07a);color:#10140f;font:inherit;font-size:18px;font-weight:900;cursor:pointer;box-shadow:0 4px 0 #3f9a3c,0 10px 30px #7ee07a40;animation:saida-pulsa 1.8s ease-in-out infinite}
.saida-go svg{width:28px;height:28px;flex:0 0 28px}
.saida-go:active{transform:translateY(3px);box-shadow:0 1px 0 #3f9a3c}
@keyframes saida-pulsa{50%{box-shadow:0 4px 0 #3f9a3c,0 10px 40px #7ee07a80}}
.saida-dica{font-size:13.5px!important;color:var(--yellow,#f7d24a)!important}
.saida-fica{width:100%;max-width:340px;min-height:50px;padding:0 20px;border:1.5px solid #ffffff33;border-radius:999px;background:none;color:#d6d8dc;font:inherit;font-size:15px;font-weight:700;cursor:pointer}
.saida-copia{width:100%;max-width:340px;min-height:54px;padding:0 20px;border:0;border-radius:999px;background:var(--green,#7ee07a);color:#10140f;font:inherit;font-size:16px;font-weight:900;cursor:pointer;box-shadow:0 4px 0 #3f9a3c}
.saida-copia.ok{background:var(--yellow,#f7d24a);box-shadow:0 4px 0 #b8861b}
.saida-ios{justify-content:flex-start;padding-top:calc(92px + env(safe-area-inset-top))}
.saida-passos{list-style:none;width:100%;max-width:340px;margin:0;padding:0;display:flex;flex-direction:column;gap:9px;text-align:left}
.saida-passos li{display:grid;grid-template-columns:32px 1fr;gap:12px;align-items:center;padding:12px;border:1.5px solid #ffffff14;border-radius:16px;background:var(--bg-inner,#222428);font-size:15px;line-height:1.4;color:#e9eaec}
.saida-passos li:first-child{border-color:var(--yellow,#f7d24a);background:#f7d24a14}
.saida-passos li>span:first-child{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--green,#7ee07a);color:#10140f;font-weight:900}
.saida-passos li:first-child>span:first-child{background:var(--yellow,#f7d24a)}
.saida-seta{position:fixed;top:calc(8px + env(safe-area-inset-top));right:12px;display:flex;align-items:flex-start;gap:2px;color:var(--yellow,#f7d24a);animation:saida-aponta 1s ease-in-out infinite}
.saida-seta span{margin-top:34px;padding:2px 10px;border:2px solid var(--yellow,#f7d24a);border-radius:12px;font-size:22px;font-weight:800;line-height:1.1}
.saida-seta svg{width:58px;height:58px;filter:drop-shadow(0 0 10px #f7d24a88)}
@keyframes saida-aponta{50%{transform:translate(4px,-4px)}}
@media(max-height:640px){.saida{gap:10px}.saida-bene{display:none}}
@media(prefers-reduced-motion:reduce){.saida,.saida-go,.saida-seta{animation:none}}
/* Cadastro completo para participar (25/10/2026): o que falta fica escrito em cima do botão e o campo fica destacado */
.sg-falta{margin:0;padding:9px 12px;border-radius:12px;background:#f7d24a1a;border:1px solid #f7d24a66;color:#ffe27a;font-size:13.5px;font-weight:800;line-height:1.4}
.sg-field.sg-pede input{border-color:var(--yellow);box-shadow:0 0 0 3px #f7d24a33}
.sg-field.sg-pede label,.sg-field.sg-pede .sg-foto-rot{color:#ffe27a}
.sg-field.sg-pede.sg-bad input{border-color:#ff6b6b;box-shadow:0 0 0 3px #ff6b6b33}
/* "Participar" de um toque (25/10/2026): cadastro completo vê só a foto, o nome e um botão grande */
.sg-form.sg-modo-rapido > :not(#sgRapido):not(.sg-priv){display:none}
.sg-rapido{display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center}
.sg-rapido[hidden]{display:none}
.sg-rapido-foto{width:76px;height:76px;border-radius:50%;object-fit:cover;border:3px solid var(--yellow)}
.sg-rapido-ok{margin:0;font-weight:800;font-size:15px;color:#7ff0a8}
.sg-rapido-nome{margin:-4px 0 0;font-weight:800;font-size:19px;line-height:1.25;word-break:break-word}
.sg-rapido-btn{min-height:64px;font-size:20px;margin-top:4px}
.sg-rapido .sg-err-geral{width:100%;box-sizing:border-box;text-align:left}
.sg-rapido-links{display:flex;flex-wrap:wrap;justify-content:center;column-gap:18px;row-gap:0}
.sg-rapido-links a.sg-link{display:inline-flex;align-items:center}
/* Sorteio diário de um toque (25/10/2026): cadastro completo vê só foto, nome e o botão; incompleto vê só o que falta */
.dr-form.dr-modo-rapido > :not(#drRapido):not(.dr-regras){display:none}
.dr-rapido .dr-rap-campo{width:100%;text-align:left}
.dr-rapido .dr-rap-campo input{border-color:var(--yellow);box-shadow:0 0 0 3px #f7d24a33}
.dr-rapido .sg-rapido-ok.dr-falta-ok{color:#ffe27a}
.dr-rapido .dr-btn:disabled{opacity:.55;cursor:not-allowed}
