/* Clubinho da Palavra: claro, alegre e "fofinho". Mobile-first (390px). */
:root{
  --fundo:#FFF5E4; --fundo2:#FFFFFF; --linha:#F0E2CB; --tinta:#2D2257; --tinta2:#6E6596;
  --sol:#FFC233; --laranja:#FF8A3D; --coral:#FF5E7E; --menta:#22C993; --ceu:#36A9FF; --uva:#8C6BFF; --rosa:#FF8FCB; --noite:#5B4BC4;
  --raio:22px; --abas:76px; --sombra:0 10px 24px -12px rgba(45,34,87,.28); --sombra-dura:0 5px 0 rgba(45,34,87,.12);
  --fonte-titulo:"Baloo 2",system-ui,sans-serif; --fonte:"Nunito",system-ui,sans-serif;
}
[hidden]{display:none!important}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html{background:var(--fundo)}
body{min-height:100dvh;color:var(--tinta);font-family:var(--fonte);font-weight:700;overflow-x:hidden;
  padding-bottom:calc(var(--abas) + 22px + env(safe-area-inset-bottom));
  background:radial-gradient(circle at 0% 0%,#FFE3EC 0,transparent 34%),radial-gradient(circle at 100% 18%,#DDF1FF 0,transparent 30%),radial-gradient(circle at 10% 70%,#E2FBEF 0,transparent 30%),var(--fundo);
  background-attachment:fixed}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
input{font:inherit;color:inherit}
svg.i{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round;flex:none}
svg.i.cheia{fill:currentColor;stroke-width:1.6}
h1,h2,h3{font-family:var(--fonte-titulo);font-weight:800;line-height:1.08;letter-spacing:-.01em}
:focus-visible{outline:3px solid var(--ceu);outline-offset:3px;border-radius:12px}

/* ---------- topo ---------- */
.topo{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:8px;
  padding:calc(10px + env(safe-area-inset-top)) 16px 10px;background:linear-gradient(var(--fundo) 72%,rgba(255,245,228,0))}
.marca{display:flex;align-items:center;gap:8px;font-family:var(--fonte-titulo);font-size:1.15rem;font-weight:800;white-space:nowrap}
.marca img{width:34px;height:34px}
.quem:empty{display:none}
.quem:not(:empty)~.marca{display:none}
.quem{display:flex;align-items:center;gap:8px;min-width:0;background:#fff;border-radius:99px;padding:4px 12px 4px 4px;box-shadow:var(--sombra-dura)}
.ola-nome{font-family:var(--fonte-titulo);font-size:1.05rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:110px}
.topo-direita{margin-left:auto;display:flex;align-items:center;gap:6px}
.pilula{display:inline-flex;align-items:center;gap:5px;background:#fff;border-radius:99px;padding:6px 11px 6px 8px;box-shadow:var(--sombra-dura);font-family:var(--fonte-titulo);font-size:1.05rem}
.pilula svg.i{width:20px;height:20px}
.estrela-pil svg{color:var(--sol)} .fogo-pil svg{color:var(--laranja)}
.pilula.pula{animation:pula .6s cubic-bezier(.3,1.6,.5,1)}
.pais-btn{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#fff;box-shadow:var(--sombra-dura);color:var(--tinta2)}
.pais-btn svg.i{width:19px;height:19px}
.offline{display:flex;white-space:nowrap;align-items:center;gap:6px;background:var(--tinta);color:#fff;border-radius:99px;padding:5px 11px;font-size:.78rem}
.offline svg.i{width:15px;height:15px}

/* avatares */
.avatar{--t:40px;width:var(--t);height:var(--t);border-radius:50%;flex:none;display:grid;place-items:center;overflow:hidden;
  background:radial-gradient(circle at 30% 25%,#fff8 0,transparent 45%),var(--av);box-shadow:inset 0 0 0 3px var(--av2)}
.avatar svg{width:92%;height:92%;margin-top:6%}
.avatar.mini-av{--t:34px}
.avatar.grande{--t:96px;box-shadow:inset 0 0 0 5px var(--av2),var(--sombra)}
.avatar.enorme{--t:120px;box-shadow:inset 0 0 0 6px var(--av2),var(--sombra)}
.avatar.vazio{background:#fff;box-shadow:inset 0 0 0 4px var(--linha);color:var(--tinta2);border:3px dashed var(--linha)}
.avatar.vazio svg.i{width:40px;height:40px;margin:0}
.olho{transform-box:fill-box;transform-origin:center;animation:pisca 4.6s infinite}

/* ---------- abas (flutuante) ---------- */
.abas{position:fixed;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));z-index:30;display:grid;grid-template-columns:repeat(5,1fr);
  height:var(--abas);background:#fff;border-radius:28px;box-shadow:0 14px 34px -10px rgba(45,34,87,.35),0 0 0 1px rgba(45,34,87,.04);padding:6px}
.abas a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:.72rem;color:var(--tinta2);border-radius:22px;transition:color .2s}
.aba-ic{width:44px;height:34px;border-radius:14px;display:grid;place-items:center;transition:transform .25s cubic-bezier(.3,1.6,.5,1),background .2s}
.abas a.ativa{color:var(--tinta)}
.abas a.ativa .aba-ic{background:var(--c);color:#fff;transform:translateY(-3px) scale(1.06);box-shadow:0 6px 14px -6px var(--c)}
.abas a:active .aba-ic{transform:scale(.88)}
body.sem-abas .abas,body.sem-abas .topo{display:none}
body.sem-abas{padding-bottom:24px}

/* ---------- botões ---------- */
.botoes{display:flex;gap:10px;margin-top:8px;flex-wrap:wrap}
.botoes.centro{justify-content:center}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;padding:0 22px;border-radius:99px;
  background:var(--sol);color:#3A2600;font-weight:900;font-size:1.02rem;box-shadow:0 5px 0 #E09D00;transition:transform .12s,box-shadow .12s}
.btn:active{transform:translateY(4px);box-shadow:0 1px 0 #E09D00}
.btn.sec{background:#fff;color:var(--tinta);box-shadow:0 5px 0 var(--linha),0 0 0 2px var(--linha) inset}
.btn.sec:active{box-shadow:0 1px 0 var(--linha),0 0 0 2px var(--linha) inset}
.btn.verde{background:var(--menta);color:#fff;box-shadow:0 5px 0 #14A276}
.btn.uva{background:var(--uva);color:#fff;box-shadow:0 5px 0 #6B4CDB}
.btn.lua-btn{background:var(--sol)}
.btn.peq{min-height:42px;padding:0 16px;font-size:.9rem}
.btn:disabled{opacity:.75}
.redondo{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:#fff;flex:none;box-shadow:var(--sombra-dura);color:var(--tinta)}
.redondo.ok{background:var(--menta);color:#fff}
.redondo.cheio{background:var(--c,var(--coral));color:#fff}
.redondo.baixando{animation:gira 1s linear infinite;background:var(--linha)}
.redondo.confirma{width:auto;padding:0 12px;border-radius:99px;background:var(--coral);color:#fff;font-size:.82rem}
.voltar{display:inline-flex;align-items:center;gap:6px;color:var(--tinta)}

/* ---------- início ---------- */
.ola{display:flex;align-items:flex-end;gap:4px;padding:2px 16px 4px}
.ola-pipo{width:96px;flex:none;margin-bottom:-6px}
.balao{position:relative;background:#fff;border-radius:22px 22px 22px 6px;padding:11px 14px;box-shadow:var(--sombra);flex:1;min-width:0;margin-bottom:22px;animation:entra .5s cubic-bezier(.3,1.5,.5,1) both}
.balao b{display:block;font-family:var(--fonte-titulo);font-size:1.25rem;line-height:1.1}
.balao span{font-size:.92rem;color:var(--tinta2);font-weight:700}
.balao span b{display:inline;font-family:var(--fonte);font-size:inherit;color:var(--tinta)}

.carrossel{margin:0 0 6px;position:relative}
.slides.arrastando{scroll-snap-type:none;cursor:grabbing;user-select:none}
.slides{cursor:grab}
.seta-car{position:absolute;top:calc(50% - 40px);z-index:3;width:44px;height:44px;border-radius:50%;background:#fff;color:var(--tinta);display:grid;place-items:center;box-shadow:0 4px 0 rgba(0,0,0,.12),0 6px 16px rgba(0,0,0,.12)}
.seta-car.esq{left:6px}.seta-car.dir{right:6px}.seta-car.dir svg.i{transform:rotate(180deg)}
.seta-car:active{transform:scale(.92)}
.slides{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.slides::-webkit-scrollbar{display:none}
.slide{flex:0 0 100%;scroll-snap-align:center;padding:4px 16px 8px}
.slide-img{position:relative;display:block;border-radius:26px 26px 0 0;overflow:hidden;aspect-ratio:16/8.6;background:var(--c)}
.slide-img img{width:100%;height:100%;object-fit:cover}
.selo{position:absolute;left:12px;top:12px;background:#fff;color:var(--tinta);border-radius:99px;padding:4px 11px;font-size:.7rem;font-weight:900;letter-spacing:.04em;box-shadow:var(--sombra-dura)}
.slide-info{display:flex;align-items:center;gap:12px;justify-content:space-between;background:var(--c);color:#fff;border-radius:0 0 26px 26px;padding:12px 12px 12px 18px;box-shadow:var(--sombra)}
.slide-info h2{font-size:1.45rem;text-shadow:0 2px 0 rgba(0,0,0,.08)}
.slide-info small{font-size:.82rem;opacity:.92}
.play-grande{width:58px;height:58px;min-height:0;padding:0;border-radius:50%;flex:none;background:#fff;color:var(--tinta);box-shadow:0 5px 0 rgba(0,0,0,.15)}
.play-grande svg.i{width:26px;height:26px;fill:currentColor;margin-left:3px}
.play-grande:active{box-shadow:0 1px 0 rgba(0,0,0,.15)}
.pontos{display:flex;justify-content:center;gap:6px;margin-top:2px}
.pontos button{width:10px;height:10px;border-radius:9px;background:#E6D6BC;transition:width .3s,background .3s;padding:0}
.pontos button.on{width:26px;background:var(--coral)}
.pontos{padding:4px 0}

.atalhos{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;padding:14px 12px 4px}
.atalhos a{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:.78rem}
.atalhos span{width:56px;height:56px;border-radius:20px;display:grid;place-items:center;background:var(--c);color:#fff;box-shadow:0 5px 0 rgba(45,34,87,.14);transition:transform .15s}
.atalhos span svg.i{width:27px;height:27px}
.atalhos a:active span{transform:translateY(3px) scale(.94)}

.secao{margin:20px 0 4px}
.secao-topo{display:flex;align-items:center;justify-content:space-between;padding:0 16px 10px;gap:8px}
.secao h2{font-size:1.3rem;display:flex;align-items:center;gap:9px}
.secao h2 .bola{width:32px;height:32px;border-radius:11px;display:grid;place-items:center;background:var(--c);color:#fff;transform:rotate(-6deg)}
.secao h2 .bola svg.i{width:18px;height:18px}
.ver{color:var(--tinta2);font-size:.86rem;background:#fff;border-radius:99px;padding:5px 12px;box-shadow:var(--sombra-dura);white-space:nowrap}
.trilho{display:flex;gap:14px;overflow-x:auto;padding:2px 16px 10px;scroll-snap-type:x mandatory;scrollbar-width:none;scroll-padding:0 16px}
.trilho::-webkit-scrollbar{display:none}

.card{flex:none;scroll-snap-align:start;width:min(64vw,250px);transition:transform .15s;text-align:left}
.card:active{transform:scale(.96)}
.card .img{position:relative;border-radius:var(--raio);overflow:hidden;aspect-ratio:16/9;background:#EADCC6;box-shadow:var(--sombra)}
.card .img img{width:100%;height:100%;object-fit:cover}
.card h3{font-size:1.02rem;margin-top:8px}
.card small{color:var(--tinta2);font-size:.8rem}
.card.vert{width:min(36vw,150px)}
.card.vert .img{aspect-ratio:9/15}
.card.quad{width:min(40vw,160px)}
.card.quad .img{aspect-ratio:1}
.serie-card{background:#fff;border-radius:24px;padding:6px 6px 0;box-shadow:var(--sombra);border-bottom:5px solid var(--c)}
.serie-card .img{border-radius:19px;box-shadow:none}
.card-txt{padding:2px 8px 10px}
.bolinhas{display:flex;align-items:center;gap:4px;margin-top:6px}
.bolinhas i{width:16px;height:6px;border-radius:9px;background:var(--linha)}
.bolinhas i.on{background:var(--c)}
.bolinhas span{font-size:.72rem;color:var(--tinta2);margin-left:4px}
.etq{position:absolute;left:8px;bottom:8px;background:rgba(255,255,255,.95);color:var(--tinta);border-radius:99px;padding:3px 9px;font-size:.72rem;display:flex;align-items:center;gap:4px}
.etq svg.i{width:13px;height:13px}
.lua-etq{background:var(--noite);color:#fff}
.ok-baixado{position:absolute;right:8px;top:8px;background:var(--menta);color:#fff;border-radius:99px;width:26px;height:26px;display:grid;place-items:center;box-shadow:0 2px 0 rgba(0,0,0,.12)}
.ok-baixado svg.i{width:15px;height:15px}
.play-redondo{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.92);color:var(--tinta);display:grid;place-items:center;box-shadow:0 4px 14px rgba(0,0,0,.25)}
.play-redondo svg.i{width:20px;height:20px;fill:currentColor;margin-left:2px}
.visto{position:absolute;right:8px;top:8px;width:28px;height:28px;border-radius:50%;background:var(--sol);color:#fff;display:grid;place-items:center}
.visto svg.i{width:16px;height:16px}
.barra-img{position:absolute;left:10px;right:10px;bottom:10px;height:6px;border-radius:9px;background:rgba(255,255,255,.55);overflow:hidden}
.barra-img i{display:block;height:100%;background:var(--coral)}
.musica-card .ondas{position:absolute;right:10px;bottom:10px}

/* cartões de jogo (trilho do início) */
.jogo{flex:none;scroll-snap-align:start;width:min(46vw,180px);min-height:150px;border-radius:24px;padding:14px;display:flex;flex-direction:column;gap:8px;
  background:var(--c);color:#fff;box-shadow:0 6px 0 rgba(45,34,87,.15);position:relative;overflow:hidden;transition:transform .15s}
.jogo::after{content:"";position:absolute;right:-30px;top:-30px;width:100px;height:100px;border-radius:50%;background:rgba(255,255,255,.18)}
.jogo:active{transform:translateY(3px)}
.jogo .ic{width:50px;height:50px;border-radius:16px;background:rgba(255,255,255,.3);display:grid;place-items:center}
.jogo .ic svg.i{width:28px;height:28px}
.jogo h3{font-size:1.12rem;text-shadow:0 2px 0 rgba(0,0,0,.08)}
.jogo small{font-size:.8rem;opacity:.9}
.jogo-pe{margin-top:auto;display:inline-flex;align-items:center;gap:4px;background:rgba(255,255,255,.95);color:var(--tinta);border-radius:99px;padding:3px 9px;font-size:.78rem;align-self:flex-start}
.jogo-pe svg.i{width:14px;height:14px;color:var(--sol)}

/* cabeçalho de página */
.cabeca-pag{display:flex;align-items:center;gap:10px;padding:4px 16px 14px}
.cabeca-pag h1{font-size:1.9rem;flex:1}
.cabeca-pag .voltar{width:44px;height:44px;border-radius:50%;background:#fff;justify-content:center;box-shadow:var(--sombra-dura)}
.grade-series{display:grid;grid-template-columns:1fr;gap:16px;padding:0 16px}
.grade-series .card{width:auto}

/* ---------- página de série ---------- */
.serie-topo{position:relative;padding:0 16px}
.voltar.flutua{position:absolute;left:26px;top:10px;z-index:2;width:44px;height:44px;border-radius:50%;background:#fff;justify-content:center;box-shadow:var(--sombra-dura)}
.capa-serie{border-radius:28px;overflow:hidden;aspect-ratio:16/9;box-shadow:0 0 0 5px #fff,var(--sombra);background:var(--c)}
.capa-serie img{width:100%;height:100%;object-fit:cover}
.info{padding:16px 16px 8px}
.ref-pil{display:inline-flex;align-items:center;gap:5px;background:var(--c,#fff);color:#fff;border-radius:99px;padding:4px 11px;font-size:.78rem}
.ref-pil svg.i{width:14px;height:14px}
.info h1{font-size:2rem;margin-top:8px}
.info p{color:var(--tinta2);margin-top:6px;line-height:1.45;font-weight:600}
.dica-estrela{display:flex;align-items:center;gap:8px;margin-top:14px;background:#FFF0C2;border-radius:16px;padding:10px 12px;font-size:.88rem;color:#7A5600}
.dica-estrela svg.i{color:var(--sol);width:20px;height:20px}
.eps{padding:6px 16px 16px;display:flex;flex-direction:column;gap:10px}
.ep{display:flex;align-items:center;gap:12px;background:#fff;border-radius:20px;padding:10px;box-shadow:var(--sombra)}
.ep .num{width:88px;height:56px;border-radius:14px;overflow:hidden;position:relative;flex:none}
.ep .num img{width:100%;height:100%;object-fit:cover}
.ep .num span{position:absolute;inset:0;display:grid;place-items:center;background:rgba(45,34,87,.28);color:#fff}
.ep .num span svg.i{fill:#fff}
.ep .num em{position:absolute;left:5px;top:5px;background:#fff;color:var(--tinta);font-style:normal;font-size:.72rem;border-radius:8px;padding:0 6px}
.ep .txt{flex:1;min-width:0}
.ep .txt b{display:block;font-family:var(--fonte-titulo);font-size:1.08rem}
.ep .txt small{color:var(--tinta2);display:flex;align-items:center;gap:3px}
.ep .txt small svg.i{width:13px;height:13px;color:var(--sol)}
.ep .barra{height:6px;border-radius:9px;background:var(--linha);margin-top:6px;overflow:hidden}
.ep .barra i{display:block;height:100%;background:var(--coral);border-radius:9px}
.ep.visto{box-shadow:0 0 0 2px #FFE08A,var(--sombra)}

/* ---------- player ---------- */
.player{position:fixed;inset:0;z-index:60;background:#000;display:flex;align-items:center;justify-content:center}
.player video{width:100%;height:100%;object-fit:contain;background:#000}
.player .fechar{position:absolute;top:calc(12px + env(safe-area-inset-top));left:12px;z-index:2}
.player .titulo-player{position:absolute;top:calc(14px + env(safe-area-inset-top));left:68px;right:16px;color:#fff;text-shadow:0 2px 6px #000;line-height:1.15}
.titulo-player b{display:block;font-family:var(--fonte-titulo);font-size:1.1rem}
.titulo-player small{opacity:.85}
.proximo{position:absolute;right:16px;bottom:calc(24px + env(safe-area-inset-bottom));background:#fff;color:var(--tinta);border-radius:24px;padding:14px;width:min(340px,calc(100% - 32px));display:grid;grid-template-columns:auto 1fr;align-items:center;gap:10px 12px;box-shadow:0 18px 40px rgba(0,0,0,.4);animation:entra .4s cubic-bezier(.3,1.5,.5,1)}
.proximo .botoes{grid-column:1/-1;margin:0}
.proximo small{display:block;color:var(--tinta2);font-size:.8rem}
.proximo b{font-family:var(--fonte-titulo);font-size:1.15rem}
.contagem{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--coral) calc(var(--p)*360deg),var(--linha) 0)}
.contagem span{width:40px;height:40px;border-radius:50%;background:#fff;display:grid;place-items:center;font-family:var(--fonte-titulo);font-size:1.3rem}
.prox-pipo{width:70px}

/* ---------- reels ---------- */
.reels{position:fixed;inset:0;z-index:25;overflow-y:auto;scroll-snap-type:y mandatory;background:#000;scrollbar-width:none;
  bottom:calc(var(--abas) + 20px + env(safe-area-inset-bottom))}
body.em-reels{background:#000}
body.em-reels .topo{display:none}
body.em-reels .abas{background:#17122E;box-shadow:none}
body.em-reels .abas a{color:#B8B0D9}
body.em-reels .abas a.ativa{color:#fff}
.reels::-webkit-scrollbar{display:none}
.reel{position:relative;height:100%;scroll-snap-align:start;scroll-snap-stop:always;display:flex;align-items:center;justify-content:center;overflow:hidden}
.reel video{width:100%;height:100%;object-fit:cover}
.reel::after{content:"";position:absolute;inset:auto 0 0;height:45%;background:linear-gradient(transparent,rgba(0,0,0,.6));pointer-events:none}
.reel-barra{position:absolute;left:12px;right:12px;top:calc(12px + env(safe-area-inset-top));height:4px;border-radius:9px;background:rgba(255,255,255,.3);overflow:hidden;z-index:2}
.reel-barra i{display:block;height:100%;width:0;background:#fff;border-radius:9px}
.reel .lado{position:absolute;right:10px;bottom:28px;display:flex;flex-direction:column;gap:14px;align-items:center;z-index:2;color:#fff}
.reel .lado>*{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:.74rem;text-shadow:0 1px 4px #000}
.reel .lado .redondo{background:rgba(255,255,255,.18);backdrop-filter:blur(6px);width:52px;height:52px;color:#fff;box-shadow:none}
.reel .lado .curtido .redondo{background:var(--coral)}
.reel .lado .curtido svg.i{fill:#fff}
.reel .lado .bate .redondo{animation:pula .5s cubic-bezier(.3,1.8,.5,1)}
.reel-estrela svg.i{color:#fff}
.reel-estrela.on .redondo{background:var(--sol)}
.reel .legenda{position:absolute;left:14px;right:84px;bottom:28px;color:#fff;text-shadow:0 2px 8px #000;z-index:2}
.reel .legenda h3{font-size:1.4rem;margin-top:6px}
.reel .legenda .ref-pil{background:rgba(255,255,255,.2);backdrop-filter:blur(6px);text-shadow:none}
.reel .pausa{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;color:#fff;z-index:2}
.reel .pausa svg.i{width:84px;height:84px;fill:rgba(255,255,255,.85);stroke:none}
.coracao-voa{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none;color:var(--coral);opacity:0;z-index:3}
.coracao-voa svg.i{width:120px;height:120px;fill:var(--coral);stroke:#fff;stroke-width:1.2}
.coracao-voa.voa{animation:coracao .9s ease-out}
.reels-topo{position:fixed;top:calc(26px + env(safe-area-inset-top));left:16px;z-index:26;color:#fff;pointer-events:none;text-shadow:0 2px 6px #000}
.reels-topo span{display:flex;align-items:center;gap:6px;font-family:var(--fonte-titulo);font-size:1.35rem}
.reels-topo small{font-size:.74rem;opacity:.8}

/* ---------- jogos ---------- */
.cabeca-pag .pilula svg.i{color:var(--sol)}
.jogos-lista{display:flex;flex-direction:column;gap:14px;padding:0 16px}
.jogo-grande{display:flex;gap:14px;align-items:flex-start;background:var(--c);color:#fff;border-radius:28px;padding:16px;box-shadow:0 7px 0 rgba(45,34,87,.15);position:relative;overflow:hidden;transition:transform .15s}
.jogo-grande::after{content:"";position:absolute;right:-40px;bottom:-50px;width:150px;height:150px;border-radius:50%;background:rgba(255,255,255,.16)}
.jogo-grande:active{transform:translateY(4px)}
.jogo-grande .ic{width:68px;height:68px;border-radius:22px;background:rgba(255,255,255,.3);display:grid;place-items:center;flex:none;transform:rotate(-6deg)}
.jogo-grande .ic svg.i{width:38px;height:38px}
.jg-txt{flex:1;min-width:0;position:relative;z-index:1}
.jg-txt h3{font-size:1.4rem;text-shadow:0 2px 0 rgba(0,0,0,.08)}
.jg-txt small{opacity:.92}
.niveis{display:flex;gap:6px;margin-top:10px;flex-wrap:wrap}
.nivel{background:#fff;color:var(--tinta);border-radius:14px;padding:5px 8px;display:flex;flex-direction:column;align-items:center;gap:1px;min-width:72px}
.nivel em{font-style:normal;font-size:.72rem}
.nivel.trancado{background:rgba(255,255,255,.35);color:#fff}
.nivel.trancado em svg.i{width:14px;height:14px}
.tres{display:inline-flex;gap:1px;color:var(--sol)}
.tres svg.i{width:22px;height:22px}
.tres.peq svg.i{width:14px;height:14px}
.tres svg.i.vazia{color:#E3D6C0;fill:#E3D6C0;stroke:#E3D6C0}
.nivel.trancado .tres svg.i.vazia{color:rgba(255,255,255,.5);fill:rgba(255,255,255,.5);stroke:none}

.jogo-tela{padding:0 16px 20px;max-width:560px;margin:0 auto}
.jogo-topo{display:flex;align-items:center;gap:10px}
.jogo-topo h1{font-size:1.6rem}
.nivel-abas{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:12px 0 4px}
.nivel-abas a{background:#fff;border-radius:16px;padding:7px 4px;text-align:center;box-shadow:var(--sombra-dura);display:flex;flex-direction:column;align-items:center;line-height:1.15}
.nivel-abas a b{font-family:var(--fonte-titulo);font-size:.98rem}
.nivel-abas a small{font-size:.7rem;color:var(--tinta2)}
.nivel-abas a.on{background:var(--c);color:#fff}
.nivel-abas a.on small{color:#fff}
.nivel-abas a.trancado{opacity:.55}
.nivel-abas a.trancado svg.i{width:14px;height:14px}
.placar{display:flex;gap:8px;margin:10px 0 14px;flex-wrap:wrap}
.placar span{background:#fff;border-radius:99px;padding:6px 12px;font-size:.88rem;display:flex;gap:6px;align-items:center;box-shadow:var(--sombra-dura)}
.placar svg.i{width:18px;height:18px;color:var(--sol)}
.memoria{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;max-width:440px;margin:0 auto}
.carta{aspect-ratio:3/4;perspective:700px}
.memoria.n8 .carta{aspect-ratio:1}
.carta .dentro{position:relative;width:100%;height:100%;transition:transform .45s cubic-bezier(.3,1.3,.5,1);transform-style:preserve-3d}
.carta.virada .dentro,.carta.par .dentro{transform:rotateY(180deg)}
.carta .f,.carta .v{position:absolute;inset:0;border-radius:16px;backface-visibility:hidden;overflow:hidden}
.carta .f{background:radial-gradient(circle at 50% 50%,rgba(255,255,255,.25) 0 22%,transparent 23%),linear-gradient(135deg,var(--uva),var(--ceu));display:grid;place-items:center;box-shadow:0 4px 0 #5B44C9}
.carta .f svg.i{width:34px;height:34px;color:#fff;fill:#fff}
.carta .v{transform:rotateY(180deg);background:#fff;box-shadow:0 4px 0 var(--linha)}
.carta .v img{width:100%;height:100%;object-fit:cover}
.carta.par .v{box-shadow:0 0 0 4px var(--menta),0 4px 0 #14A276}
.carta.par{animation:pula .5s cubic-bezier(.3,1.8,.5,1)}
.carta.treme{animation:treme .4s}
.pergunta{background:#fff;border-radius:26px;padding:18px;box-shadow:var(--sombra);position:relative}
.q-pipo{width:84px;margin:-6px auto 2px}
.pergunta h2{font-size:1.4rem;margin-bottom:14px;text-align:center}
.opcoes{display:flex;flex-direction:column;gap:10px}
.opcoes button{min-height:60px;border-radius:18px;background:#F7F1FF;font-size:1.12rem;text-align:left;padding:0 14px;display:flex;align-items:center;gap:12px;box-shadow:0 4px 0 #E2D7FA;transition:transform .12s}
.opcoes button:active{transform:translateY(3px)}
.opcoes button em{width:34px;height:34px;border-radius:12px;background:#fff;display:grid;place-items:center;font-style:normal;color:var(--uva);flex:none}
.opcoes button svg.i{margin-left:auto}
.opcoes button.certa{background:var(--menta);color:#fff;box-shadow:0 4px 0 #14A276;animation:pula .45s cubic-bezier(.3,1.8,.5,1)}
.opcoes button.errada{background:var(--coral);color:#fff;box-shadow:0 4px 0 #D63B5B;animation:treme .4s}
.progresso{height:12px;border-radius:9px;background:#fff;overflow:hidden;margin-bottom:14px;box-shadow:inset 0 0 0 2px var(--linha)}
.progresso i{display:block;height:100%;background:linear-gradient(90deg,var(--menta),var(--ceu));transition:width .4s;border-radius:9px}
.quebra-box{display:flex;flex-direction:column;align-items:center;gap:12px}
.quebra{display:grid;grid-template-columns:repeat(var(--lado),1fr);gap:4px;width:100%;max-width:360px;aspect-ratio:1;background:#fff;border-radius:22px;overflow:hidden;padding:6px;box-shadow:var(--sombra)}
.peca{background-repeat:no-repeat;border-radius:10px;transition:transform .15s}
.peca.sel{outline:4px solid var(--sol);outline-offset:-4px;transform:scale(.92)}
.modelo{display:flex;align-items:center;gap:8px;color:var(--tinta2);font-size:.8rem}
.modelo img{width:56px;height:56px;border-radius:12px;object-fit:cover;box-shadow:var(--sombra-dura)}
.festa{text-align:center;padding:10px 8px 24px;display:flex;flex-direction:column;align-items:center;gap:8px}
.festa-pipo{width:140px;animation:pula-sem-fim 1.2s ease-in-out infinite}
.estrelas-festa{display:flex;gap:4px;color:var(--sol)}
.estrelas-festa span{animation:estrela-pop .6s cubic-bezier(.3,1.8,.5,1) both}
.estrelas-festa span:nth-child(2){transform:translateY(-12px)}
.estrelas-festa svg.i{width:58px;height:58px}
.estrelas-festa svg.i.vazia{fill:#EADCC6;color:#EADCC6}
.festa h2{font-size:1.8rem}
.ganhou{color:#C98A00;font-size:1.05rem}
.ganhou.fraco{color:var(--tinta2)}

/* ---------- músicas ---------- */
.musicas-topo{margin:4px 16px 14px;border-radius:28px;padding:20px;background:linear-gradient(135deg,var(--uva),#B26BFF);color:#fff;display:flex;align-items:center;justify-content:space-between;box-shadow:0 7px 0 #6B4CDB}
.musicas-topo h1{font-size:2rem}
.musicas-topo p{opacity:.9}
.disco{width:76px;height:76px;border-radius:50%;background:radial-gradient(circle,#fff 0 14%,#2D2257 15% 20%,#3B2F70 21% 100%);display:grid;place-items:center;animation:gira 6s linear infinite;box-shadow:0 0 0 5px rgba(255,255,255,.3)}
.disco svg.i{display:none}
.lista{display:flex;flex-direction:column;gap:10px;padding:0 16px 16px}
.faixa{display:flex;align-items:center;gap:12px;background:#fff;border-radius:20px;padding:10px;box-shadow:var(--sombra)}
.faixa>img{width:58px;height:58px;border-radius:15px;object-fit:cover}
.faixa .txt{flex:1;min-width:0}
.faixa .txt b{font-family:var(--fonte-titulo);font-size:1.05rem}
.faixa .txt small{display:flex;align-items:center;gap:4px;color:var(--tinta2)}
.faixa .txt small svg.i{width:14px;height:14px;color:var(--menta)}
.faixa.tocando{box-shadow:0 0 0 3px var(--c,var(--uva)),var(--sombra)}
.ondas{display:none;align-items:flex-end;gap:3px;height:20px}
.ondas i{width:4px;border-radius:3px;background:var(--c,var(--uva));animation:onda .8s ease-in-out infinite}
.ondas i:nth-child(2){animation-delay:.2s}.ondas i:nth-child(3){animation-delay:.4s}
.tocando .ondas{display:flex}
.musica-card .ondas i{background:#fff}
.mini{position:fixed;left:14px;right:14px;bottom:calc(var(--abas) + 18px + env(safe-area-inset-bottom));z-index:29;background:var(--tinta);color:#fff;border-radius:22px;padding:8px;display:flex;align-items:center;gap:8px;box-shadow:0 12px 28px -8px rgba(45,34,87,.55);animation:entra .35s cubic-bezier(.3,1.5,.5,1)}
.mini img{width:44px;height:44px;border-radius:13px;object-fit:cover}
.mini .txt{flex:1;min-width:0;font-size:.9rem}
.mini .txt b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mini .txt small{display:block;opacity:.75;font-size:.75rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mini .redondo{width:38px;height:38px;background:rgba(255,255,255,.14);color:#fff;box-shadow:none}
.mini .redondo.cheio{background:var(--sol);color:var(--tinta)}
.mini .redondo svg.i{width:20px;height:20px}
.mini .tempo{position:absolute;left:20px;right:20px;bottom:3px;height:3px;border-radius:9px;background:rgba(255,255,255,.2);overflow:hidden}
.mini .tempo i{display:block;height:100%;background:var(--sol)}
body.com-mini{padding-bottom:calc(var(--abas) + 96px + env(safe-area-inset-bottom))}
body.sem-abas .mini{bottom:calc(14px + env(safe-area-inset-bottom))}

/* ---------- hora de dormir (tema noite) ---------- */
body.noite{color:#fff;background:radial-gradient(1px 1px at 20% 12%,#fff 50%,transparent 51%),radial-gradient(1.5px 1.5px at 70% 8%,#fff 50%,transparent 51%),radial-gradient(1px 1px at 85% 30%,#fff 50%,transparent 51%),radial-gradient(1.5px 1.5px at 35% 26%,#fffc 50%,transparent 51%),radial-gradient(1px 1px at 55% 40%,#fff9 50%,transparent 51%),linear-gradient(180deg,#2B1F6B 0%,#4A33A8 60%,#6A4BC9 100%);background-attachment:fixed}
body.noite .topo{background:linear-gradient(#2B1F6B 70%,transparent)}
body.noite .quem,body.noite .pilula,body.noite .pais-btn{background:rgba(255,255,255,.14);color:#fff;box-shadow:none}
body.noite .card small,body.noite .card h3{color:#fff}
.noite-topo{display:flex;align-items:center;gap:10px;padding:0 16px 16px}
.noite-topo h1{font-size:1.9rem}
.noite-topo p{opacity:.85;font-weight:600}
.noite-pipo{width:110px;flex:none;animation:boia 3s ease-in-out infinite}
.grade-dormir{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;padding:0 16px}
.grade-dormir .card{width:auto}
.historia{padding:0 16px 24px;max-width:640px;margin:0 auto;position:relative}
.historia .voltar{position:absolute;left:16px;top:0;background:rgba(255,255,255,.16);color:#fff;box-shadow:none;z-index:2}
.historia .capa{border-radius:30px;overflow:hidden;aspect-ratio:1;max-width:260px;margin:0 auto 14px;box-shadow:0 0 0 6px rgba(255,255,255,.14),0 20px 50px -10px rgba(0,0,0,.5)}
.historia .capa img{width:100%;height:100%;object-fit:cover}
.historia h1{text-align:center;font-size:1.75rem}
.historia .ref{text-align:center;color:#FFD97A;margin-top:4px;font-size:.88rem}
.historia .btn.sec{background:rgba(255,255,255,.14);color:#fff;box-shadow:0 5px 0 rgba(0,0,0,.18)}
.historia .texto{margin-top:18px;font-size:1.14rem;line-height:1.75;font-weight:600;color:#EEE9FF;white-space:pre-line;background:rgba(255,255,255,.08);border-radius:24px;padding:18px}
.timer{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:14px}
.timer button{border-radius:99px;padding:8px 14px;background:rgba(255,255,255,.12);font-size:.85rem;display:flex;align-items:center;gap:5px}
.timer button svg.i{width:15px;height:15px}
.timer button.on{background:#FFD97A;color:#2B1F6B}

/* ---------- álbum ---------- */
.album-topo{display:flex;align-items:center;gap:14px;padding:4px 16px 14px}
.album-topo .avatar.grande{--t:76px}
.album-topo h1{font-size:1.6rem}
.album-topo p{color:var(--tinta2)}
.placas{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:0 16px}
.placa{border-radius:22px;padding:12px 8px;display:flex;flex-direction:column;align-items:center;color:#fff;box-shadow:0 5px 0 rgba(45,34,87,.15)}
.placa svg.i{width:26px;height:26px}
.placa b{font-family:var(--fonte-titulo);font-size:1.8rem;line-height:1}
.placa small{font-size:.74rem;opacity:.95;text-align:center}
.placa.sol{background:var(--sol);color:#5A3E00}.placa.fogo{background:var(--laranja)}.placa.roxo{background:var(--uva)}
.semana{display:flex;justify-content:space-between;margin:14px 16px 0;background:#fff;border-radius:22px;padding:12px 14px;box-shadow:var(--sombra)}
.semana span{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:.74rem;color:var(--tinta2)}
.semana i{width:34px;height:34px;border-radius:50%;background:#F6EEDF;display:grid;place-items:center}
.semana span.on i{background:#FFE3D1;color:var(--laranja)}
.semana span.hoje i{box-shadow:0 0 0 3px var(--laranja)}
.semana svg.i{width:18px;height:18px}
.album-barra{height:12px;border-radius:9px;background:#fff;margin:16px 16px 4px;overflow:hidden;box-shadow:inset 0 0 0 2px var(--linha)}
.album-barra i{display:block;height:100%;border-radius:9px;background:linear-gradient(90deg,var(--coral),var(--sol),var(--menta),var(--ceu),var(--uva))}
.adesivos{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:12px 16px}
.adesivo{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;background:#fff;border-radius:22px;padding:12px 6px;box-shadow:var(--sombra)}
.adesivo .selo-ad{width:62px;height:62px;border-radius:50%;display:grid;place-items:center;background:var(--c);color:#fff;box-shadow:0 0 0 4px #fff,0 0 0 6px var(--c),0 6px 12px -4px var(--c);transform:rotate(-8deg)}
.adesivo .selo-ad svg.i{width:30px;height:30px}
.adesivo b{font-family:var(--fonte-titulo);font-size:.92rem;line-height:1.1}
.adesivo small{font-size:.7rem;color:var(--tinta2);line-height:1.2}
.adesivo.falta .selo-ad{background:#EFE6D6;color:#B7A88E;box-shadow:0 0 0 4px #fff,0 0 0 6px #EFE6D6;border:2px dashed #D9CBB2}
.adesivo.falta b{color:var(--tinta2)}
.adesivo.grande{box-shadow:none;padding:6px}
.adesivo.grande .selo-ad{width:110px;height:110px;animation:estrela-pop .7s cubic-bezier(.3,1.8,.5,1) both}
.adesivo.grande .selo-ad svg.i{width:54px;height:54px}
.adesivo.grande b{font-size:1.3rem}

/* ---------- perfis ---------- */
.perfis{min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:32px 20px;text-align:center;gap:10px}
.perfis-pipo{width:150px;animation:boia 3s ease-in-out infinite}
.perfis h1{font-size:2.1rem}
.perfis-grade{display:flex;flex-wrap:wrap;justify-content:center;gap:18px 20px;margin:14px 0 6px;max-width:460px}
.perfil-bt{display:flex;flex-direction:column;align-items:center;gap:8px;width:104px;transition:transform .2s cubic-bezier(.3,1.6,.5,1)}
.perfil-bt:hover,.perfil-bt:focus-visible{transform:translateY(-4px) scale(1.04)}
.perfil-bt:active{transform:scale(.94)}
.perfil-bt b{font-family:var(--fonte-titulo);font-size:1.15rem}
.perfil-bt.novo b{color:var(--tinta2)}
.perfis-dica{color:var(--tinta2);max-width:300px;font-weight:600}
.link-pais{display:inline-flex;align-items:center;gap:6px;color:var(--tinta2);background:#fff;border-radius:99px;padding:8px 14px;box-shadow:var(--sombra-dura);margin-top:8px}
.link-pais svg.i{width:18px;height:18px}
.folha-fundo{position:fixed;inset:0;z-index:70;background:rgba(45,34,87,.45);display:flex;align-items:flex-end;justify-content:center;animation:aparece .2s}
.folha{background:var(--fundo);width:100%;max-width:520px;border-radius:30px 30px 0 0;padding:20px 18px calc(20px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:12px;animation:sobe .35s cubic-bezier(.3,1.3,.5,1);max-height:94dvh;overflow:auto}
.folha h2{font-size:1.6rem;text-align:center}
.fp-av{display:flex;justify-content:center}
.campo{display:flex;flex-direction:column;gap:6px}
.campo span,.campo-t{font-size:.88rem;color:var(--tinta2)}
.campo input{min-height:54px;border-radius:18px;border:2px solid var(--linha);background:#fff;padding:0 16px;font-size:1.15rem;font-weight:800}
.campo input:focus{outline:none;border-color:var(--ceu)}
.bichos{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.bicho{display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 4px;border-radius:18px;background:#fff;box-shadow:var(--sombra-dura);transition:transform .15s}
.bicho .avatar{--t:58px}
.bicho small{font-size:.76rem}
.bicho.on{box-shadow:0 0 0 3px var(--ceu),var(--sombra-dura);transform:translateY(-2px)}

/* ---------- área dos pais ---------- */
.portao{min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:24px;text-align:center}
.grande-ic{width:56px!important;height:56px!important;color:var(--uva)}
.portao h1{font-size:1.9rem}
.portao p{color:var(--tinta2);font-size:1.1rem}
.portao p b{color:var(--tinta);font-size:1.3rem}
.portao-ops{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;width:100%;max-width:300px;margin:6px 0 10px}
.portao-ops .btn{font-size:1.3rem}
.pais{max-width:720px;margin:0 auto;padding-top:calc(10px + env(safe-area-inset-top))}
.pais-topo{display:flex;align-items:center;gap:10px;padding:0 16px 12px}
.pais-topo h1{font-size:1.7rem}
.sub-abas{display:flex;gap:8px;overflow-x:auto;padding:0 16px 14px;scrollbar-width:none}
.sub-abas::-webkit-scrollbar{display:none}
.sub-abas a{display:flex;align-items:center;gap:6px;white-space:nowrap;background:#fff;border-radius:99px;padding:9px 14px;font-size:.88rem;box-shadow:var(--sombra-dura);color:var(--tinta2)}
.sub-abas a svg.i{width:18px;height:18px}
.sub-abas a.on{background:var(--tinta);color:#fff}
.pais-corpo .lista{padding:0 16px 12px}
.pais-dica{color:var(--tinta2);padding:0 16px 12px;font-weight:600;line-height:1.4}
.caixa{background:#fff;border-radius:22px;padding:14px;margin:0 16px 12px;box-shadow:var(--sombra);display:flex;flex-direction:column;gap:10px}
.caixa-topo{display:flex;align-items:center;gap:12px}
.caixa-topo>div{flex:1;min-width:0}
.caixa-topo b{display:block;font-family:var(--fonte-titulo);font-size:1.1rem}
.caixa-topo small{color:var(--tinta2);font-size:.82rem;font-weight:600}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{border-radius:99px;padding:7px 12px;background:#F6EEDF;font-size:.84rem}
.chip.on{background:var(--uva);color:#fff}
.chave{width:54px;height:32px;border-radius:99px;background:#E5DACA;position:relative;flex:none;transition:background .2s}
.chave i{position:absolute;left:4px;top:4px;width:24px;height:24px;border-radius:50%;background:#fff;transition:transform .2s;box-shadow:0 2px 4px rgba(0,0,0,.15)}
.chave.on{background:var(--menta)}
.chave.on i{transform:translateX(22px)}
.viagem{margin:0 16px 8px;border-radius:28px;padding:20px;background:linear-gradient(135deg,var(--ceu),var(--uva));color:#fff;display:flex;flex-direction:column;gap:10px;box-shadow:0 7px 0 #5B44C9;position:relative;overflow:hidden}
.viagem-ic{width:56px;height:56px;border-radius:18px;background:rgba(255,255,255,.25);display:grid;place-items:center}
.viagem-ic svg.i{width:30px;height:30px}
.viagem h2{font-size:1.6rem}
.viagem p{font-weight:600;opacity:.95;line-height:1.4}
.viagem .btn{align-self:flex-start}
.espaco{height:10px;border-radius:9px;background:#F6EEDF;overflow:hidden}
.espaco.claro{background:rgba(255,255,255,.3)}
.espaco i{display:block;height:100%;background:var(--sol);border-radius:9px}
.pais .secao-topo{padding-top:12px}
.pais .secao-topo h2{font-size:1.2rem}
.vazio{padding:20px 16px;color:var(--tinta2);text-align:center;font-weight:600}

/* ---------- descanso, pop de adesivo, aviso, confete ---------- */
.descanso,.pop-adesivo{position:fixed;inset:0;z-index:90;background:rgba(45,34,87,.55);display:grid;place-items:center;padding:20px;animation:aparece .25s}
.descanso{background:linear-gradient(180deg,#2B1F6B,#6A4BC9)}
.descanso-caixa,.pop-caixa{background:#fff;color:var(--tinta);border-radius:32px;padding:22px 20px;max-width:360px;width:100%;text-align:center;display:flex;flex-direction:column;align-items:center;gap:10px;animation:entra .45s cubic-bezier(.3,1.5,.5,1)}
.descanso-pipo{width:150px}
.descanso-caixa h2,.pop-titulo{font-family:var(--fonte-titulo);font-size:1.7rem;font-weight:800}
.descanso-caixa p{color:var(--tinta2);font-weight:600}
.pop-pipo{width:110px;margin-top:-70px;animation:pula-sem-fim 1.2s ease-in-out infinite}
.aviso{position:fixed;left:50%;bottom:calc(var(--abas) + 34px);transform:translateX(-50%);z-index:95;background:var(--tinta);color:#fff;border-radius:99px;padding:10px 18px;font-size:.92rem;box-shadow:0 10px 24px rgba(45,34,87,.35);max-width:calc(100% - 32px);text-align:center;display:flex;align-items:center;gap:6px;animation:aviso 2.8s ease both;white-space:nowrap}
.aviso.ganho{background:var(--sol);color:#3A2600;font-weight:900}
.aviso svg.i{width:20px;height:20px}
.confete{position:fixed;inset:0;pointer-events:none;z-index:96;overflow:hidden}
.confete i{position:absolute;top:-20px;width:9px;height:14px;border-radius:3px;animation:cai linear forwards}

/* ---------- mascote ---------- */
.pipo{display:block;overflow:visible}
.pipo-corpo{animation:boia 2.6s ease-in-out infinite}
.pipo-asa{transform-box:fill-box;transform-origin:20% 30%;animation:asa 1.4s ease-in-out infinite}
.pipo.dormindo .pipo-asa{animation:none}
.zzz text{animation:zzz 2.4s ease-in-out infinite}
.zzz text:nth-child(2){animation-delay:.8s}

/* ---------- animações ---------- */
@keyframes pisca{0%,92%,100%{transform:scaleY(1)}95%{transform:scaleY(.1)}}
@keyframes boia{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@keyframes asa{0%,100%{transform:rotate(0)}50%{transform:rotate(-14deg)}}
@keyframes zzz{0%{opacity:0;transform:translateY(4px)}50%{opacity:1}100%{opacity:0;transform:translateY(-8px)}}
@keyframes pula{0%{transform:scale(1)}40%{transform:scale(1.22)}100%{transform:scale(1)}}
@keyframes pula-sem-fim{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-10px) rotate(2deg)}}
@keyframes treme{0%,100%{transform:translateX(0)}25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}
@keyframes entra{from{opacity:0;transform:translateY(14px) scale(.96)}to{opacity:1;transform:none}}
@keyframes aparece{from{opacity:0}to{opacity:1}}
@keyframes sobe{from{transform:translateY(100%)}to{transform:none}}
@keyframes gira{to{transform:rotate(360deg)}}
@keyframes onda{0%,100%{height:5px}50%{height:20px}}
@keyframes estrela-pop{0%{opacity:0;transform:scale(0) rotate(-40deg)}100%{opacity:1;transform:scale(1) rotate(0)}}
@keyframes coracao{0%{opacity:0;transform:scale(.3)}25%{opacity:1;transform:scale(1.15)}70%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1.3) translateY(-40px)}}
@keyframes aviso{0%{opacity:0;transform:translate(-50%,16px) scale(.9)}10%,85%{opacity:1;transform:translate(-50%,0) scale(1)}100%{opacity:0;transform:translate(-50%,-10px)}}
@keyframes cai{to{transform:translate(var(--vai),105vh) rotate(var(--gira))}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition:none!important}}

/* ---------- telas maiores ---------- */
@media (min-width:700px){
  #tela{max-width:1100px;margin-left:auto;margin-right:auto}
  .topo{padding-left:max(16px,calc((100vw - 1100px)/2 + 16px));padding-right:max(16px,calc((100vw - 1100px)/2 + 16px))}
  .quem:not(:empty)~.marca{display:flex;margin-left:8px}
  .abas{left:50%;right:auto;transform:translateX(-50%);width:520px}
  .mini{left:50%;right:auto;transform:translateX(-50%);width:520px}
  .reels{max-width:480px;margin:0 auto;border-radius:0 0 24px 24px}
  .ola-pipo{width:120px}
  .slide{flex-basis:78%;scroll-snap-align:start}
  .slide-img{aspect-ratio:16/7.4}
  .atalhos{max-width:600px;margin:0 auto}
  .card{width:270px}.card.vert{width:180px}.card.quad{width:190px}.jogo{width:210px}
  .grade-series{grid-template-columns:repeat(2,1fr)}
  .grade-dormir{grid-template-columns:repeat(3,1fr)}
  .adesivos{grid-template-columns:repeat(4,1fr)}
  .jogos-lista{display:grid;grid-template-columns:repeat(3,1fr)}
  .serie-topo,.info,.eps{max-width:820px;margin-left:auto;margin-right:auto}
}
@media (min-width:1100px){.adesivos{grid-template-columns:repeat(6,1fr)}}

/* próximo episódio estilo Netflix, grande pra mão de criança */
.proximo-nf{position:absolute;right:16px;bottom:calc(72px + env(safe-area-inset-bottom));z-index:3;width:min(380px,calc(100% - 32px));background:#fff;color:var(--tinta);border-radius:26px;overflow:hidden;box-shadow:0 18px 44px rgba(0,0,0,.5);cursor:pointer;animation:entra .4s cubic-bezier(.3,1.5,.5,1);outline:4px solid var(--sol);outline-offset:0}
.proximo-nf:active{transform:scale(.97)}
.pnf-img{position:relative;aspect-ratio:16/9;background:#222}
.pnf-img img{width:100%;height:100%;object-fit:cover}
.pnf-play{position:absolute;inset:0;display:grid;place-items:center;background:rgba(0,0,0,.25)}
.pnf-play svg{position:absolute;width:104px;height:104px;transform:rotate(-90deg)}
.pnf-play .trilha{fill:rgba(255,255,255,.95);stroke:rgba(0,0,0,.12);stroke-width:7}
.pnf-play .anel{fill:none;stroke:var(--coral);stroke-width:7;stroke-linecap:round;transition:stroke-dashoffset .25s linear}
.pnf-play span{position:relative;color:var(--coral);display:grid;place-items:center}
.pnf-play span svg.i{width:44px;height:44px;fill:currentColor;margin-left:5px;transform:none;position:static}
.pnf-play em{position:absolute;right:calc(50% - 64px);top:calc(50% - 64px);background:var(--sol);color:#2b2000;font-style:normal;font-family:var(--fonte-titulo);font-size:1.2rem;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;box-shadow:0 3px 0 rgba(0,0,0,.15)}
.pnf-txt{padding:12px 16px 14px}
.pnf-txt small{display:block;color:var(--tinta2);font-size:.85rem;font-weight:800}
.pnf-txt b{font-family:var(--fonte-titulo);font-size:1.3rem;line-height:1.1}
.pnf-x{position:absolute;top:8px;right:8px;width:34px;height:34px;border-radius:50%;background:rgba(0,0,0,.55);color:#fff;display:grid;place-items:center}
.pnf-x svg.i{width:18px;height:18px}
@media (max-width:600px){.proximo-nf{right:12px;left:12px;width:auto;bottom:calc(64px + env(safe-area-inset-bottom))}}

/* setas das fileiras */
.trilho-caixa{position:relative}
.trilho.arrastando{scroll-snap-type:none;cursor:grabbing;user-select:none}
.seta-trilho{position:absolute;top:calc(50% - 40px);z-index:4;width:44px;height:44px;border-radius:50%;background:#fff;color:var(--tinta);display:grid;place-items:center;box-shadow:0 4px 0 rgba(0,0,0,.12),0 6px 16px rgba(0,0,0,.14)}
.seta-trilho.esq{left:6px}.seta-trilho.dir{right:6px}.seta-trilho.dir svg.i{transform:rotate(180deg)}
.seta-trilho:active{transform:scale(.92)}

/* filtro Pra você / Assistidos */
.filtros{display:flex;gap:8px;padding:0 16px 14px;flex-wrap:wrap}
.filtros button{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 16px;border-radius:99px;background:#fff;color:var(--tinta);font-weight:900;box-shadow:0 3px 0 rgba(0,0,0,.08)}
.filtros button svg.i{width:18px;height:18px}
.filtros button.on{background:var(--c);color:#fff}
.reels-topo .filtros{padding:8px 0 0;pointer-events:auto}
.reels-topo .filtros button{min-height:38px;background:rgba(255,255,255,.92)}
.reels-topo .filtros button.on{background:var(--c);color:#fff}
.reels-vazio{position:fixed;inset:0;display:grid;place-items:center;z-index:24;background:#14123a;color:#fff;padding:24px}

/* ---------- Aventura da Arca (jogo em 5 fases) ---------- */
.aj{position:fixed;inset:0;z-index:25;background:#bfe6ff;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none;overscroll-behavior:none}
.aj-palco{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}
.aj-palco .aj-pega{cursor:grab}
.aj-barra{position:absolute;left:0;right:0;top:0;z-index:3;display:flex;align-items:center;gap:10px;padding:calc(8px + env(safe-area-inset-top)) 10px 0;pointer-events:none}
.aj-barra>*{pointer-events:auto}
.aj-voltar{width:46px;height:46px}
.aj-fases{display:flex;gap:6px;margin:0 auto;padding-right:46px}
.aj-bola{width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.82);display:grid;place-items:center;font-family:var(--fonte-titulo);font-weight:800;color:var(--tinta2);box-shadow:var(--sombra-dura);transition:transform .3s}
.aj-bola.on{background:var(--coral);color:#fff;transform:scale(1.14)}
.aj-bola.ok{background:var(--sol);color:#fff}
.aj-bola.on.ok{background:var(--sol)}
.aj-bola svg.i{width:20px;height:20px}
.aj-fala{position:absolute;z-index:3;left:8px;right:8px;top:calc(60px + env(safe-area-inset-top));display:flex;align-items:flex-start;gap:4px;pointer-events:none}
.aj-pipo-bt{pointer-events:auto;flex:none;margin-top:2px;padding:0;border-radius:50%}
.aj-pipo{width:60px;display:block}
.aj-pipo-bt:active .aj-pipo{transform:scale(.92)}
.aj-falar{pointer-events:auto;flex:none;width:56px;height:56px;border-radius:50%;background:var(--ceu);color:#fff;display:grid;place-items:center;box-shadow:0 4px 0 #1E86D6;align-self:center}
.aj-falar svg.i{width:30px;height:30px}
.aj-falar:active{transform:translateY(3px);box-shadow:0 1px 0 #1E86D6}
.aj-balao{position:relative;background:#fff;border-radius:18px;padding:8px 12px 7px;font-size:.88rem;line-height:1.22;box-shadow:var(--sombra);min-height:66px;flex:1;display:flex;flex-direction:column;justify-content:center;gap:5px}
.aj-balao:before{content:"";position:absolute;left:-7px;top:22px;border:8px solid transparent;border-right-color:#fff;border-left:0}
.aj-balao.pop{animation:entra .35s cubic-bezier(.3,1.6,.5,1)}
.aj-contas{display:flex;flex-wrap:wrap;gap:4px}
.aj-contas:empty{display:none}
.aj-contas i{width:10px;height:10px;border-radius:50%;background:var(--linha)}
.aj-contas i.ok{background:var(--menta);box-shadow:0 0 0 2px #C9F5E6}
@media (min-width:720px){
  .aj-fala{left:auto;right:12px;top:calc(8px + env(safe-area-inset-top));width:min(430px,36vw)}
  .aj-balao{min-height:56px;font-size:.92rem}
  .aj-fases{padding-right:0}
}
.aj-pular{position:absolute;right:14px;bottom:calc(16px + env(safe-area-inset-bottom));z-index:4;width:62px;height:62px;border-radius:50%;background:#fff;color:var(--tinta);display:grid;place-items:center;box-shadow:0 5px 0 rgba(45,34,87,.15),var(--sombra);animation:pula-sem-fim 1.6s ease-in-out infinite}
.aj-pular svg.i{width:28px;height:28px;fill:currentColor}
.aj-brilha{animation:aj-brilha 1s ease-in-out infinite}
@keyframes aj-brilha{50%{filter:drop-shadow(0 0 8px #fff6a0) drop-shadow(0 0 16px #FFD23F)}}
.aj-escolhida{filter:drop-shadow(0 0 6px #fff) drop-shadow(0 0 12px #FFD23F)}
.aj-mao{pointer-events:none}
.aj-fim{position:absolute;inset:0;z-index:5;background:rgba(45,34,87,.38);display:grid;place-items:center;padding:16px;animation:entra .3s ease}
.aj-caixa{background:#fff;border-radius:30px;padding:16px 18px 20px;width:min(360px,100%);text-align:center;box-shadow:0 20px 50px -10px rgba(45,34,87,.5);display:flex;flex-direction:column;align-items:center;gap:6px;animation:entra .45s cubic-bezier(.3,1.6,.5,1)}
.aj-fim-pipo{width:110px;animation:pula-sem-fim 1.2s ease-in-out infinite}
.aj-estrelona{color:var(--sol);animation:aj-gira-estrela 1s cubic-bezier(.3,1.6,.5,1) both}
.aj-estrelona svg.i{width:84px;height:84px;filter:drop-shadow(0 4px 0 #E09A00)}
@keyframes aj-gira-estrela{from{transform:scale(0) rotate(-180deg)}to{transform:scale(1) rotate(0)}}
.aj-caixa h2{font-size:1.7rem}
.aj-caixa p{color:var(--tinta2);font-size:.95rem}
.aj-botoes{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:8px;flex-wrap:wrap}
.aj-btn-prox{width:84px;height:84px;border-radius:50%;background:var(--menta);color:#fff;display:grid;place-items:center;box-shadow:0 6px 0 #14A276}
.aj-btn-prox svg.i{width:40px;height:40px;fill:currentColor}
.aj-chama{animation:pula-sem-fim 1s ease-in-out infinite}
.aj-botoes .redondo{width:54px;height:54px}

/* mapa das fases */
.aj-mapa{max-width:880px}
.aj-heroi{position:relative;margin:12px 0 10px;border-radius:26px;overflow:hidden;background:linear-gradient(#8FD3FF,#E4F5FF 70%,#B5E39A 70%);box-shadow:var(--sombra)}
.aj-heroi>svg{display:block;width:100%;height:auto;max-height:300px}
.aj-heroi-fala{position:absolute;left:10px;top:10px;display:flex;align-items:center;gap:4px;max-width:70%}
.aj-heroi-pipo{width:54px;flex:none}
.aj-heroi-fala span{background:#fff;border-radius:16px;padding:6px 10px;font-size:.86rem;line-height:1.2;box-shadow:var(--sombra-dura)}
.aj-jogar{width:100%;min-height:58px;font-size:1.15rem;background:var(--menta);color:#fff;box-shadow:0 5px 0 #14A276}
.aj-jogar svg.i{fill:currentColor}
.aj-trilha{display:grid;gap:10px;margin-top:14px}
@media (min-width:720px){.aj-trilha{grid-template-columns:repeat(5,1fr)}.aj-fase{flex-direction:column;text-align:center}.aj-fase-arte{width:100%!important;height:96px!important}}
.aj-fase{position:relative;display:flex;align-items:center;gap:12px;background:#fff;border-radius:22px;padding:10px;box-shadow:var(--sombra-dura);border:3px solid transparent}
.aj-fase.feita{border-color:var(--sol)}
.aj-fase.trancada{opacity:.6}
.aj-fase-arte{width:86px;height:70px;flex:none;border-radius:16px;background:color-mix(in srgb,var(--c) 22%,#fff);display:grid;place-items:center;overflow:hidden}
.aj-fase-arte svg{width:100%;height:100%}
.aj-fase-txt{display:flex;flex-direction:column;gap:1px;min-width:0;flex:1}
.aj-fase-txt small{font-size:.75rem;color:var(--c);font-weight:900;text-transform:uppercase;letter-spacing:.04em}
.aj-fase-txt b{font-family:var(--fonte-titulo);font-size:1.08rem;line-height:1.1}
.aj-fase-txt em{font-style:normal;font-size:.75rem;color:var(--tinta2)}
.aj-fase-selo{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--c);color:#fff;flex:none}
.aj-fase.feita .aj-fase-selo{background:var(--sol)}
.aj-fase-selo svg.i{width:20px;height:20px}
.aj-fase-selo svg.i:not(.cheia){fill:currentColor}
.aj-fase.trancada .aj-fase-selo{background:var(--linha);color:var(--tinta2)}
.aj-fase.trancada .aj-fase-selo svg.i{fill:none}
@media (min-width:720px){.aj-fase-selo{position:absolute;right:8px;top:8px;width:32px;height:32px}}
/* bolinhas das fases no card do hub de jogos */
.fases-arca{display:flex;gap:5px;margin-top:6px;flex-wrap:wrap}
.fase-arca{width:28px;height:28px;border-radius:50%;background:rgba(255,255,255,.85);color:var(--tinta);display:grid;place-items:center;font-family:var(--fonte-titulo);font-weight:800;font-size:.9rem}
.fase-arca.ok{background:var(--sol);color:#fff}
.fase-arca.trancado{opacity:.6}
.fase-arca svg.i{width:16px;height:16px}

/* hub de jogos: Aventuras da Bíblia (capa desenhada) + Jogos rápidos */
.jogos-sec{display:flex;align-items:center;gap:8px;font-size:1.25rem;margin:18px 0 10px}
.jogos-sec .bola{width:34px;height:34px;border-radius:50%;background:var(--c);color:#fff;display:grid;place-items:center}
.jogos-sec .bola svg.i{width:19px;height:19px}
.aventuras{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px;margin:0 16px}
.jogos-sec{margin-left:16px!important;margin-right:16px!important}
@media (min-width:720px){.aventuras{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}}
.aventura{display:flex;flex-direction:column;background:#fff;border-radius:24px;overflow:hidden;box-shadow:var(--sombra);border:3px solid color-mix(in srgb,var(--c) 35%,#fff);transition:transform .2s}
.aventura:active{transform:scale(.97)}
.av-capa{display:block;aspect-ratio:16/8;background:linear-gradient(#8FD3FF,#E4F5FF 68%,#B5E39A 68%)}
.av-capa svg{width:100%;height:100%;display:block}
.av-txt{padding:8px 10px 12px;display:flex;flex-direction:column;gap:2px}
.av-txt h3{font-size:1.05rem;line-height:1.1}
.av-txt small{color:var(--tinta2);font-size:.85rem}
.av-txt .fase-arca{background:color-mix(in srgb,var(--c) 18%,#fff)}
.av-txt .fase-arca.ok{background:var(--sol)}

.av-txt .fases-arca{gap:4px}
.av-txt .fase-arca{width:24px;height:24px;font-size:.8rem}
.av-txt .fase-arca svg.i{width:13px;height:13px}

/* tela cheia do player */
.player .tela-cheia{position:absolute;top:calc(12px + env(safe-area-inset-top));right:12px;z-index:3}
.player:fullscreen{background:#000}
.player:fullscreen video{width:100vw;height:100vh}
.player .titulo-player{right:72px}

.toque-pausa{position:absolute;left:50%;top:50%;width:110px;height:110px;margin:-55px 0 0 -55px;border-radius:50%;background:rgba(0,0,0,.45);color:#fff;display:grid;place-items:center;pointer-events:none;z-index:2}
.toque-pausa svg.i{width:56px;height:56px;fill:currentColor}
.toque-pausa.pisca{animation:pisca-pausa .8s ease forwards}
@keyframes pisca-pausa{0%{opacity:0;transform:scale(.7)}20%{opacity:1;transform:scale(1)}70%{opacity:1}100%{opacity:0;transform:scale(1.15)}}

.toque-area{position:absolute;left:0;right:0;top:0;bottom:calc(70px + env(safe-area-inset-bottom));z-index:1;cursor:pointer;-webkit-tap-highlight-color:transparent}
.player .fechar,.player .tela-cheia{z-index:4}.player .titulo-player{z-index:3;pointer-events:none}
.player .proximo-nf,.player .proximo{z-index:5}

.player .vol-player{position:absolute;top:calc(12px + env(safe-area-inset-top));right:68px;z-index:4}
.player .titulo-player{right:128px}
.vol-faixa{width:100%;margin-top:12px;accent-color:var(--coral);height:28px}
.vol-num{text-align:right;font-weight:900;color:var(--tinta2)}

/* série <-> jogo */
.jogar-grande{grid-column:1/-1;min-height:60px;font-size:1.15rem;background:var(--menta);color:#053}
.fim-jogo .botoes{grid-column:1/-1}
.atalho-jogo{display:flex;align-items:center;gap:12px;margin-top:12px;padding:12px 14px;border-radius:20px;background:var(--c);color:#fff;box-shadow:0 5px 0 rgba(0,0,0,.12)}
.atalho-jogo .atj-ic{width:46px;height:46px;border-radius:14px;background:rgba(255,255,255,.3);display:grid;place-items:center;flex:none}
.atalho-jogo b{display:block;font-family:var(--fonte-titulo);font-size:1.15rem}
.atalho-jogo small{opacity:.92}
.atalho-jogo .seta-dir{margin-left:auto;transform:rotate(180deg)}

/* botão de silenciar a voz dos jogos (ao lado do alto-falante) */
.aj-mudo{pointer-events:auto;flex:none;width:56px;height:56px;border-radius:50%;background:#fff;color:var(--tinta);display:grid;place-items:center;box-shadow:0 4px 0 rgba(45,34,87,.15);align-self:center}
.aj-mudo svg.i{width:30px;height:30px}
.aj-mudo.desligada{background:#FFE3E8;color:#D63B5B}
.aj-mudo .aj-risco{stroke:#D63B5B;stroke-width:3}
.aj-mudo:active{transform:translateY(3px)}
@media (max-width:719px){.aj-falar,.aj-mudo{width:50px;height:50px}.aj-falar svg.i,.aj-mudo svg.i{width:26px;height:26px}}

/* quebra-cabeça: formato da cena (16:9), peça certa marcada, modelo grande */
.quebra{aspect-ratio:16/9;max-width:560px}
.peca{position:relative}
.peca.certa{box-shadow:inset 0 0 0 3px var(--menta)}
.peca.certa::after{content:"";position:absolute;right:4px;bottom:4px;width:16px;height:16px;border-radius:50%;background:var(--menta) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/12px no-repeat}
.modelo{flex-direction:column;gap:6px;width:100%;max-width:560px}
.modelo img{width:100%;max-width:340px;height:auto;aspect-ratio:16/9;border-radius:16px}
.modelo small{font-weight:900;font-size:.9rem}

.em-breve{margin:10px 16px;padding:24px 18px;border-radius:24px;background:#fff;text-align:center;display:flex;flex-direction:column;align-items:center;gap:6px;box-shadow:var(--sombra)}
.em-breve b{font-family:var(--fonte-titulo);font-size:1.5rem}
.em-breve svg{max-width:110px}

/* logo redondo e adesivos ilustrados */
.marca img{border-radius:50%}
.selo-ad.img{position:relative;background:none!important;box-shadow:none!important;width:92px;height:92px}
.selo-ad.img img{width:100%;height:100%;filter:drop-shadow(0 4px 6px rgba(0,0,0,.15))}
.adesivo.falta .selo-ad.img img{filter:grayscale(1) opacity(.45)}
.selo-ad.img .cad{position:absolute;right:-2px;bottom:-2px;width:32px;height:32px;border-radius:50%;background:#fff;display:grid;place-items:center;color:var(--tinta2);box-shadow:var(--sombra-dura)}
.selo-ad.img .cad svg.i{width:18px;height:18px}
.adesivo.grande .selo-ad.img{width:150px;height:150px}

/* baixar o app */
.faixa-instalar{display:flex;align-items:center;gap:12px;margin:4px 16px 10px;padding:12px 12px 12px 14px;border-radius:22px;background:#fff;box-shadow:var(--sombra)}
.faixa-instalar img{width:48px;height:48px;border-radius:50%;flex:none}
.faixa-instalar div{flex:1;min-width:0}
.faixa-instalar b{display:block;font-family:var(--fonte-titulo);font-size:1.1rem;line-height:1.1}
.faixa-instalar small{color:var(--tinta2);font-size:.82rem}
.faixa-instalar .btn{min-height:46px;padding:0 16px}
.pop-instalar{position:fixed;inset:0;z-index:90;background:rgba(20,16,50,.55);display:grid;place-items:center;padding:16px}
.pi-caixa{position:relative;background:#fff;color:var(--tinta);border-radius:28px;padding:22px 18px 18px;width:min(420px,100%);text-align:center;display:flex;flex-direction:column;align-items:center;gap:8px;animation:entra .4s cubic-bezier(.3,1.5,.5,1)}
.pi-x{position:absolute;top:10px;right:10px}
.pi-logo{width:76px;height:76px;border-radius:50%}
.pi-caixa h2{font-size:1.4rem}
.pi-caixa ol{list-style:none;display:flex;flex-direction:column;gap:10px;width:100%;margin:6px 0 8px;text-align:left}
.pi-caixa li{display:flex;align-items:center;gap:10px;background:var(--fundo2,#FFF5E4);border-radius:16px;padding:10px}
.pi-n{width:28px;height:28px;border-radius:50%;background:var(--coral);color:#fff;display:grid;place-items:center;font-weight:900;flex:none}
.pi-ic{width:40px;height:40px;border-radius:12px;background:#fff;display:grid;place-items:center;flex:none;color:#1a73e8}
.pi-aviso{background:#FFF3C4;border-radius:12px;padding:8px 10px;font-size:.9rem}

/* modo viagem: apagar vários */
.sel-barra{display:flex;gap:8px;flex-wrap:wrap;padding:0 16px 12px}
.btn.perigo{color:#C2334B}
.btn.perigo:disabled{opacity:.45}
.sel-item{cursor:pointer;position:relative}
.sel-cx{position:absolute;opacity:0;pointer-events:none}
.sel-marca{width:28px;height:28px;border-radius:9px;border:2.5px solid #D9C9AE;display:grid;place-items:center;flex:none;color:transparent;background:#fff}
.sel-marca svg.i{width:18px;height:18px}
.sel-item.marcado{outline:3px solid var(--coral)}
.sel-item.marcado .sel-marca{background:var(--coral);border-color:var(--coral);color:#fff}

/* ---------- acesso (acesso.js): entrar com link/código e aviso do plano Completo ---------- */
.acesso{max-width:440px;margin:0 auto;padding:36px 20px 40px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px}
.acesso-logo{width:96px;height:96px;border-radius:50%;box-shadow:var(--sombra)}
.acesso h1{font-family:var(--fonte-titulo);font-size:1.7rem;margin:4px 0 0}
.acesso-txt{color:var(--tinta2);font-weight:700;line-height:1.45;margin:0}
.acesso-form{width:100%;display:flex;flex-direction:column;gap:12px;text-align:left;margin-top:6px}
.acesso-form .btn{width:100%}
.acesso-cod{letter-spacing:.5em;text-align:center;font-size:1.6rem!important}
.acesso-erro{margin:0;padding:10px 14px;border-radius:14px;background:#fde4df;color:#b2382a;font-weight:800;font-size:.95rem}
.acesso-pe{font-size:.9rem;color:var(--tinta2);margin:8px 0 0}
.acesso-pe a{color:var(--coral);font-weight:800}
.aba-ic{position:relative}
.aba-cad{position:absolute;right:-8px;top:-6px;width:18px;height:18px;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 1px 3px rgba(0,0,0,.2)}
.aba-cad .i{width:12px;height:12px}
.acesso-senha{position:relative;display:block}
.acesso-senha input{width:100%;padding-right:54px}
.acesso-olho{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:42px;height:42px;border:0;background:transparent;border-radius:12px;color:var(--tinta2);display:grid;place-items:center;cursor:pointer}
.acesso-olho .i{width:22px;height:22px}
.portao .acesso-form{max-width:360px;margin:6px auto 0}
/* plano Básico: o que é do Completo aparece com cadeado (acesso.js marcar) */
.trancado{position:relative}
.trancado .img img,.trancado.jogo .ic,.trancado.aventura .av-capa,.trancado.jogo-grande{filter:grayscale(.55) brightness(.92)}
.cad-tranca{position:absolute;top:8px;right:8px;width:32px;height:32px;border-radius:50%;background:#fff;color:var(--uva);display:grid;place-items:center;box-shadow:0 2px 6px rgba(0,0,0,.18);z-index:2;pointer-events:none}
.cad-tranca .i{width:17px;height:17px}
.selo-completo{display:inline-flex;align-items:center;gap:4px;margin-left:8px;padding:3px 10px;border-radius:99px;background:var(--uva);color:#fff;font-size:.72rem;font-family:var(--fonte-texto,inherit);vertical-align:middle;white-space:nowrap}
.selo-completo .i{width:12px;height:12px}