/* A MESMA fonte do sistema (Plus Jakarta Sans, servida do próprio servidor em
   /fonts/*.woff2 — é o que o css/base.css usa em todas as telas). Aqui só as
   espessuras desta página, pra não baixar a família inteira numa landing. */
@font-face{font-family:"Plus Jakarta Sans";font-style:normal;font-weight:400;font-display:optional;src:url("/fonts/jakarta-400-latin.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:"Plus Jakarta Sans";font-style:normal;font-weight:400;font-display:optional;src:url("/fonts/jakarta-400-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:"Plus Jakarta Sans";font-style:normal;font-weight:600;font-display:optional;src:url("/fonts/jakarta-400-latin.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:"Plus Jakarta Sans";font-style:normal;font-weight:600;font-display:optional;src:url("/fonts/jakarta-400-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:"Plus Jakarta Sans";font-style:normal;font-weight:700;font-display:optional;src:url("/fonts/jakarta-400-latin.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:"Plus Jakarta Sans";font-style:normal;font-weight:700;font-display:optional;src:url("/fonts/jakarta-400-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
@font-face{font-family:"Plus Jakarta Sans";font-style:normal;font-weight:800;font-display:optional;src:url("/fonts/jakarta-400-latin.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:"Plus Jakarta Sans";font-style:normal;font-weight:800;font-display:optional;src:url("/fonts/jakarta-400-latin-ext.woff2") format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}
:root{
  --bg:#0b0614; --bg2:#140b22; --card:#170e26; --card2:#1e1330;
  --linha:rgba(255,255,255,.09); --txt:#f6f2fb; --txt2:#c3b7d6; --txt3:#8d80a6;
  --roxo:#9925D3; --roxo2:#c084fc; --amarelo:#ffd400; --verde:#22c55e;
}
/* font-display:optional + preload (27/09): a Jakarta entra no 1º quadro ou fica o fallback abaixo até o fim (nunca troca na frente da pessoa).
   Fallback com as MESMAS medidas da Jakarta (27/09/2026, medido no Chrome: largura 400 +5,1%, 800 +2,2%;
   ascent 104, descent 22): se a fonte atrasar, o título quebra igual e nada pula quando ela chega. */
@font-face{font-family:"PJS Fallback";src:local("Arial"),local("ArialMT"),local("Liberation Sans"),local("Helvetica");font-weight:100 600;size-adjust:105.06%;ascent-override:98.99%;descent-override:20.94%;line-gap-override:0%}
@font-face{font-family:"PJS Fallback";src:local("Arial Bold"),local("Arial-BoldMT"),local("Liberation Sans Bold"),local("Helvetica Bold");font-weight:601 900;size-adjust:102.24%;ascent-override:101.72%;descent-override:21.52%;line-gap-override:0%}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--txt);font-family:'Plus Jakarta Sans','PJS Fallback',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;line-height:1.55;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
.wrap{max-width:1180px;margin:0 auto;padding:0 16px}
a{color:inherit}

/* ---------- topo ---------- */
.topo{position:sticky;top:0;z-index:40;background:rgba(11,6,20,.86);backdrop-filter:blur(12px);border-bottom:1px solid var(--linha)}
.topo .wrap{display:flex;align-items:center;gap:12px;height:58px}
.marca{display:flex;align-items:center;gap:9px;font-weight:800;font-size:16px;text-decoration:none;color:inherit}
.marca img{width:26px;height:26px}
.topo .dir{margin-left:auto;display:flex;gap:8px;align-items:center}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:12px;padding:11px 18px;font:inherit;font-weight:700;font-size:14px;cursor:pointer;text-decoration:none;transition:transform .12s,filter .12s;white-space:nowrap}
.btn:active{transform:scale(.97)}
.btn-p{background:linear-gradient(135deg,var(--roxo),#6d28d9);color:#fff;box-shadow:0 6px 20px rgba(153,37,211,.35)}
.btn-p:hover{filter:brightness(1.08)}
.btn-g{background:rgba(255,255,255,.08);color:var(--txt);border:1px solid var(--linha)}
.btn-peq{padding:8px 13px;font-size:13px;border-radius:10px}

/* ---------- herói ---------- */
.hero{position:relative;overflow:hidden;padding:54px 0 36px}
.hero::before{content:"";position:absolute;inset:-200px 0 auto;height:520px;background:radial-gradient(60% 60% at 50% 0%,rgba(153,37,211,.35),transparent 70%);pointer-events:none}
.hero .grid{position:relative;display:grid;grid-template-columns:1.1fr .9fr;gap:34px;align-items:center}
.selo{display:inline-flex;align-items:center;gap:7px;background:rgba(153,37,211,.18);border:1px solid rgba(192,132,252,.35);color:#e9d5ff;border-radius:99px;padding:5px 13px;font-size:12.5px;font-weight:700;margin-bottom:16px}
h1{font-size:clamp(28px,5vw,46px);line-height:1.1;letter-spacing:-.02em;font-weight:800}
h1 span{background:linear-gradient(120deg,var(--roxo2),var(--amarelo));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p.sub{color:var(--txt2);font-size:16px;margin-top:16px;max-width:560px}
.hero .acoes{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}
.numeros{display:flex;gap:26px;flex-wrap:wrap;margin-top:26px}
.numeros b{display:block;font-size:24px;font-weight:800;line-height:1.1}
.numeros span{font-size:12.5px;color:var(--txt3)}
.hero-fig{position:relative}
.hero-fig img{border-radius:18px;border:1px solid var(--linha);box-shadow:0 30px 70px rgba(0,0,0,.55)}
.hero-fig .tag{position:absolute;left:14px;bottom:14px;background:rgba(11,6,20,.82);border:1px solid var(--linha);border-radius:12px;padding:8px 12px;font-size:12px;color:var(--txt2);backdrop-filter:blur(6px)}
.hero-fig .tag b{color:var(--txt)}

/* ---------- como funciona ---------- */
.passos{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:10px 0 30px}
.passo{background:var(--card);border:1px solid var(--linha);border-radius:16px;padding:16px}
.passo i{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:rgba(153,37,211,.18);color:var(--roxo2);font-style:normal;font-weight:800;margin-bottom:10px}
.passo b{font-size:14.5px;display:block;margin-bottom:3px}
.passo span{font-size:13px;color:var(--txt2)}

/* ---------- barra de filtros ---------- */
.filtros{position:sticky;top:58px;z-index:30;background:rgba(11,6,20,.92);backdrop-filter:blur(10px);border-top:1px solid var(--linha);border-bottom:1px solid var(--linha);padding:12px 0}
.filtros .linha{display:flex;gap:9px;flex-wrap:wrap;align-items:center}
.campo{flex:1 1 220px;min-width:0;position:relative}
.campo i{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--txt3);font-size:14px;font-style:normal}
input,select,textarea{font:inherit;color:var(--txt);background:var(--card2);border:1px solid var(--linha);border-radius:12px;padding:11px 13px;width:100%;outline:0}
input:focus,select:focus{border-color:var(--roxo2)}
.campo input{padding-left:34px}
select{max-width:210px;cursor:pointer}
option{background:#1e1330}
.contagem{font-size:12.5px;color:var(--txt3);margin-top:8px}

/* ---------- grade ---------- */
.grade{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px;padding:22px 0 10px}
.card{background:var(--card);border:1px solid var(--linha);border-radius:18px;overflow:hidden;display:flex;flex-direction:column;min-width:0;transition:transform .14s,border-color .14s;text-decoration:none;color:inherit}
.card:hover{transform:translateY(-3px);border-color:rgba(192,132,252,.4)}
.capa{aspect-ratio:4/5;background:linear-gradient(140deg,#2a1442,#160c24);display:grid;place-items:center;position:relative;overflow:hidden}
.capa img{width:100%;height:100%;object-fit:cover}
.capa .ico{font-size:40px;opacity:.5}
.capa .fita{position:absolute;top:10px;left:10px;display:flex;gap:6px;flex-wrap:wrap}
.chip{font-size:10.5px;font-weight:800;letter-spacing:.02em;border-radius:99px;padding:3px 9px;background:rgba(11,6,20,.72);border:1px solid var(--linha);color:var(--txt2);backdrop-filter:blur(4px)}
.chip.img{color:#a5f3fc;border-color:rgba(165,243,252,.3)}
.chip.vid{color:#fda4af;border-color:rgba(253,164,175,.3)}
.chip.car{color:#fde68a;border-color:rgba(253,230,138,.3)}
.chip.txt{color:#f9a8d4;border-color:rgba(249,168,212,.3)}
.chip.livre{color:#86efac;border-color:rgba(134,239,172,.35)}
.card .corpo{padding:13px 14px 15px;display:flex;flex-direction:column;gap:7px;flex:1}
.card h3{font-size:14.5px;font-weight:700;line-height:1.3}
.card .nicho{font-size:11.5px;color:var(--txt3);display:flex;align-items:center;gap:6px}
.card .prev{font-size:12.5px;color:var(--txt2);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.card .anexo{font-size:11.5px;color:#fcd34d;display:flex;gap:6px;align-items:flex-start}
.card .pe{margin-top:auto;padding-top:10px}
.card .pe .btn{width:100%}

/* ---------- modal (legado: as telas agora são páginas próprias) ---------- */
.ov{position:fixed;inset:0;background:rgba(5,2,10,.78);backdrop-filter:blur(4px);z-index:60;display:flex;align-items:center;justify-content:center;padding:14px}
.modal{background:var(--card);border:1px solid var(--linha);border-radius:20px;max-width:760px;width:100%;max-height:calc(100dvh - 28px);overflow:auto}
.modal .cab{position:sticky;top:0;background:var(--card);border-bottom:1px solid var(--linha);padding:16px 18px;display:flex;gap:12px;align-items:flex-start;z-index:2}
.modal .cab h2{font-size:18px;line-height:1.25;flex:1;min-width:0}
.fechar{background:rgba(255,255,255,.07);border:1px solid var(--linha);color:var(--txt);border-radius:10px;width:34px;height:34px;cursor:pointer;flex:none;font-size:16px}
.modal .corpo{padding:16px 18px 20px;display:flex;flex-direction:column;gap:14px}
.bloco{background:var(--card2);border:1px solid var(--linha);border-radius:14px;padding:12px 14px}
.bloco .rot{font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--txt3);margin-bottom:5px}
.bloco.anexar{border-color:rgba(252,211,77,.3)}
.bloco.anexar .rot{color:#fcd34d}
pre.prompt{white-space:pre-wrap;word-break:break-word;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12.8px;line-height:1.6;color:#e8e0f5;background:#100a1c;border:1px solid var(--linha);border-radius:14px;padding:14px;max-height:46vh;overflow:auto}
.modal .exemplo img{border-radius:14px;border:1px solid var(--linha)}
.linha-btn{display:flex;gap:9px;flex-wrap:wrap}
.cadeado{text-align:center;padding:26px 18px;background:linear-gradient(180deg,rgba(153,37,211,.12),transparent);border:1px dashed rgba(192,132,252,.4);border-radius:16px}
.cadeado .lk{font-size:30px;margin-bottom:8px}
.cadeado p{color:var(--txt2);font-size:13.5px;margin:6px 0 14px}
label.campo-rot{display:block;font-size:12.5px;font-weight:700;color:var(--txt2);margin:12px 0 5px}
.aceite{display:flex;gap:9px;align-items:flex-start;font-size:12.5px;color:var(--txt2);margin-top:14px}
.aceite input{width:17px;height:17px;flex:none;margin-top:2px;accent-color:var(--roxo)}
.erro{color:#fda4af;font-size:13px;margin-top:10px}
.ok{color:#86efac;font-size:13px;margin-top:10px}

/* ---------- pagamento ---------- */
.preco{display:flex;align-items:baseline;gap:8px;justify-content:center;margin:2px 0 6px}
.preco b{font-size:38px;font-weight:800;letter-spacing:-.02em}
.preco span{color:var(--txt3);font-size:13px}
.pix-qr{background:#fff;border-radius:16px;padding:12px;width:230px;margin:0 auto}
.pix-qr img{width:100%;display:block}
.pix-cod{display:flex;gap:8px;align-items:center;background:#100a1c;border:1px solid var(--linha);border-radius:12px;padding:10px 12px;font-family:ui-monospace,Menlo,monospace;font-size:11.5px;color:var(--txt2);word-break:break-all}
.aguarda{display:flex;gap:9px;align-items:center;justify-content:center;color:var(--txt2);font-size:13px}
.ponto{width:9px;height:9px;border-radius:50%;background:var(--amarelo);animation:pisca 1.1s infinite}
@keyframes pisca{0%,100%{opacity:.25}50%{opacity:1}}
.vantagens{display:grid;gap:7px;margin:8px 0 2px;text-align:left}
.vantagens div{display:flex;gap:9px;align-items:flex-start;font-size:13.5px;color:var(--txt2)}
.vantagens i{color:var(--verde);margin-top:3px}

/* ---------- rodapé ---------- */
.cta{background:linear-gradient(135deg,rgba(153,37,211,.22),rgba(255,212,0,.08));border:1px solid var(--linha);border-radius:22px;padding:28px;margin:34px 0;text-align:center}
.cta h2{font-size:clamp(20px,3.4vw,28px);line-height:1.2;margin-bottom:10px}
.cta p{color:var(--txt2);max-width:620px;margin:0 auto 18px;font-size:14.5px}
footer{border-top:1px solid var(--linha);padding:22px 0 40px;color:var(--txt3);font-size:12.5px;text-align:center}
.carregar{display:flex;justify-content:center;padding:14px 0 40px}
.vazio{padding:40px 16px;text-align:center;color:var(--txt3)}
@media (max-width:860px){
  .hero .grid{grid-template-columns:1fr;gap:22px}
  .hero-fig{order:-1;max-width:330px;margin:0 auto}
  .passos{grid-template-columns:1fr}
  .filtros{top:58px}
  select{max-width:none;flex:1 1 140px}
}

/* Celular: a barra de cima tem 3 coisas e 360px de largura — o nome da marca sai e
   o balão deixa de flutuar sobre a mascote (viraria uma coluna de 3 letras). */
@media (max-width:600px){
  .marca span,.marca{font-size:0}
  .marca img{width:28px;height:28px}
  .topo .dir .btn{padding:8px 11px;font-size:12.5px}
  .numeros{gap:16px 22px}
  .passos{gap:10px}
}

/* ============================================================== 20/09/2026
   Cada prompt virou PÁGINA (nada de modal), com header animado e a mascote de
   meio corpo. O CSS saiu do HTML porque o HTML é servido no-store: inline, ele
   voltava a baixar a cada F5 (ver a decisão em `assets-externalizados`).
   ========================================================================= */

/* ---------- header animado ---------- */
.hdr{position:relative;overflow:hidden;border-bottom:1px solid var(--linha);background:linear-gradient(160deg,#150a24,#0b0614 60%)}
.hdr .wrap{position:relative;z-index:2;display:grid;grid-template-columns:1.15fr .85fr;gap:26px;align-items:end;padding-top:26px}
.hdr.curto .wrap{padding-top:18px;align-items:center}
.hdr .txt{padding-bottom:26px;min-width:0}
.hdr .mascote{align-self:end;justify-self:center;position:relative;width:100%;max-width:400px}
.hdr .mascote img{width:100%;height:270px;object-fit:cover;object-position:top center;display:block;filter:drop-shadow(0 18px 34px rgba(0,0,0,.5))}
.hdr.curto .mascote img{height:180px}
.hdr .mascote img{position:relative;z-index:1}
/* O balão fica POR CIMA da mascote: sem isto o desenho cobria o meio da frase. */
.hdr .balao{position:absolute;z-index:3;top:2px;left:0;right:38%;background:#fff;color:#1c1c1e;border-radius:16px 16px 16px 4px;padding:9px 12px;font-size:12.5px;font-weight:600;line-height:1.35;box-shadow:0 10px 26px rgba(0,0,0,.35);animation:balaoEntra .5s ease-out both .35s}
@keyframes balaoEntra{from{opacity:0;transform:translateY(8px) scale(.96)}to{opacity:1;transform:none}}
.trilha{display:flex;gap:7px;align-items:center;flex-wrap:wrap;font-size:12.5px;color:var(--txt3);margin-bottom:12px}
.trilha a{color:var(--txt2);text-decoration:none}
.trilha a:hover{color:var(--txt)}
@media (prefers-reduced-motion:reduce){.hdr .balao{animation:none}}

/* ---------- página do prompt ---------- */
.det{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:22px;padding:26px 0 10px;align-items:start}
.painel{background:var(--card);border:1px solid var(--linha);border-radius:20px;padding:18px}
.painel + .painel{margin-top:14px}
.painel h2{font-size:17px;margin-bottom:10px;display:flex;align-items:center;gap:9px}
.lado{position:sticky;top:76px;display:flex;flex-direction:column;gap:14px}
.lado img.exemplo{width:100%;border-radius:18px;border:1px solid var(--linha);display:block}
.legenda{font-size:12px;color:var(--txt3);text-align:center;margin-top:7px}
.relacionados{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;padding:6px 0 30px}
.rel{background:var(--card);border:1px solid var(--linha);border-radius:14px;overflow:hidden;text-decoration:none;display:block}
.rel img{width:100%;aspect-ratio:4/5;object-fit:cover;display:block}
.rel b{display:block;padding:9px 10px;font-size:12.5px;font-weight:700;line-height:1.3}
@media (max-width:900px){ .det{grid-template-columns:1fr} .lado{position:static} }

/* ---------- páginas de cadastro e pagamento ---------- */
.caixa{max-width:520px;margin:26px auto 40px;background:var(--card);border:1px solid var(--linha);border-radius:22px;padding:22px}
.caixa h1{font-size:23px;margin-bottom:6px}
.caixa .sub{color:var(--txt2);font-size:14px;margin-bottom:16px}
.voltar{display:inline-flex;align-items:center;gap:7px;color:var(--txt2);text-decoration:none;font-size:13px;margin-top:14px}
.voltar:hover{color:var(--txt)}

/* ---------- responsivo do header (POR ÚLTIMO de propósito) ----------
 * Regra fora de media query que vem depois vence a de dentro, mesmo com a tela
 * pequena. Foi o que aconteceu aqui em 20/09: o balão continuava flutuando no
 * celular porque a regra base estava escrita abaixo dos @media. */
@media (max-width:860px){
  .hdr .wrap{grid-template-columns:1fr;gap:6px}
  .hdr .txt{padding-bottom:6px}
  .hdr .mascote{max-width:none;justify-self:stretch}
  .hdr .mascote img{height:190px;object-position:top center}
  .hdr.curto .mascote img{height:150px}
  .hdr .balao{right:40%;top:6px}
}
@media (max-width:600px){
  .hdr .balao{position:static;right:auto;left:auto;margin:0 0 10px;text-align:center;border-radius:14px}
  .hdr .mascote img{height:170px}
  .hdr.curto .mascote img{height:140px}
}

/* ============================================================== 21/09/2026
   Header da biblioteca com respiro (pedido do Ramon: "o header está tudo
   espremido… o balão está em cima da mascote, aumente a altura e o tamanho da
   mascote"). Causa do aperto: as margens do texto estavam escritas pra `.hero`,
   e o header é `.hdr` — título, parágrafo, botões e números saíam colados.
   O balão deixou de flutuar sobre o desenho: ele fica ACIMA da mascote, com a
   ponta apontando pra ela, então não cobre o rosto em nenhuma largura.
   ========================================================================= */
.topo .wrap{height:64px}
.filtros{top:64px}
.marca span{font-size:16px}
.btn-grande{padding:14px 22px;font-size:15px;border-radius:14px}
.hdr .selo{margin-bottom:18px}
.hdr h1{font-size:clamp(30px,4.6vw,50px);line-height:1.08}
.hdr p.sub{color:var(--txt2);font-size:16.5px;line-height:1.6;margin-top:18px;max-width:560px}
.hdr .acoes{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
.hdr .numeros{margin-top:30px;padding-top:22px;border-top:1px solid var(--linha);gap:30px}
.nota-gratis{margin-top:16px;font-size:13.5px;color:var(--txt2)}
.nota-gratis i{color:var(--amarelo);margin-right:4px}
.nota-gratis a{color:var(--roxo2);font-weight:700}
.oferta{margin-top:22px;display:flex;gap:18px;align-items:center;flex-wrap:wrap;background:rgba(255,255,255,.04);border:1px solid rgba(192,132,252,.28);border-radius:16px;padding:14px 18px;max-width:600px}
.oferta.ok{border-color:rgba(134,239,172,.35);background:rgba(34,197,94,.06)}
.oferta-preco{display:flex;align-items:baseline;gap:7px;flex:none}
.oferta-preco b{font-size:30px;font-weight:800;letter-spacing:-.02em;line-height:1}
.oferta.ok .oferta-preco b{font-size:18px;color:#86efac}
.oferta-preco span{font-size:13px;color:var(--txt3)}
.oferta-preco span b{font-size:13px;color:var(--txt2);letter-spacing:0}
.oferta ul{list-style:none;display:grid;gap:5px;flex:1 1 260px;min-width:0}
.oferta li{font-size:13.5px;color:var(--txt2);display:flex;gap:9px;align-items:flex-start}
.oferta li i{color:var(--verde);margin-top:4px;font-size:12px;flex:none}
.aviso-venc{margin-top:18px;background:rgba(255,212,0,.08);border:1px solid rgba(255,212,0,.35);color:#fde68a;border-radius:12px;padding:10px 14px;font-size:13.5px;max-width:600px}
.aviso-venc i{margin-right:6px}

.hdr-home .wrap{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:40px;align-items:end;padding-top:46px}
.hdr-home .txt{padding-bottom:44px}
.hdr .mascote{display:flex;flex-direction:column;align-items:center;max-width:470px}
.hdr .balao{position:relative;top:auto;left:auto;right:auto;align-self:flex-start;margin:0 0 14px 4%;max-width:300px;border-radius:18px;padding:11px 15px;font-size:13.5px}
.hdr .balao::after{content:"";position:absolute;left:62%;bottom:-9px;width:18px;height:18px;background:#fff;transform:rotate(45deg);border-radius:0 0 4px 0}
.hdr-home .mascote img{height:430px;width:100%}
/* 26/09/2026: no computador a mascote sobe e ocupa a altura da hero (sobrava espaço em cima). */
@media (min-width:861px){.hdr-home .mascote{max-width:580px}.hdr-home .mascote img{height:600px}.hdr-home .wrap{padding-top:24px}}
.hdr.curto .mascote{max-width:340px}
.hdr.curto .mascote img{height:220px}

/* cards: diz o que anexar em vez do começo cru do prompt */
.card .anexo{font-size:12.5px;color:var(--txt2);line-height:1.45}
.card .anexo i{color:#fcd34d;margin-top:3px}
.card .anexo b{color:#fcd34d;font-weight:700}
.card .anexo span{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.card .anexo.sem i{color:#86efac}
.card .ferr{font-size:11.5px;color:var(--txt3);display:flex;gap:6px;align-items:center}
.card h3{font-size:15px}
.capa-tag{position:absolute;right:10px;bottom:10px;font-size:10.5px;font-weight:800;border-radius:99px;padding:3px 9px;background:rgba(11,6,20,.72);color:#e9d5ff;border:1px solid rgba(192,132,252,.35);backdrop-filter:blur(4px)}

/* bloco da assinatura no fim da lista */
.plano-box{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:30px;align-items:center;background:linear-gradient(135deg,rgba(153,37,211,.22),rgba(255,212,0,.07));border:1px solid rgba(192,132,252,.3);border-radius:24px;padding:32px;margin:40px 0 10px}
.plano-box h2{font-size:clamp(22px,3.2vw,30px);line-height:1.2;margin-bottom:10px}
.plano-box h2 span{color:var(--amarelo)}
.plano-box p{color:var(--txt2);font-size:15px;margin-bottom:18px}
.como{list-style:none;counter-reset:c;display:grid;gap:10px;margin-bottom:22px}
.como li{counter-increment:c;display:grid;grid-template-columns:30px 1fr;column-gap:12px;align-items:start}
.como li::before{content:counter(c);grid-row:span 2;width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:rgba(153,37,211,.3);color:#fff;font-weight:800;font-size:14px}
.como b{font-size:14.5px}
.como span{font-size:13px;color:var(--txt2)}
.plano-lista{list-style:none;display:grid;gap:12px;background:rgba(11,6,20,.45);border:1px solid var(--linha);border-radius:18px;padding:20px}
.plano-lista li{display:flex;gap:10px;font-size:14px;color:var(--txt2);align-items:flex-start}
.plano-lista li i{color:var(--verde);margin-top:4px;flex:none}
.plano-lista li i.fa-circle-info{color:var(--roxo2)}
.plano-lista a{color:var(--roxo2);font-weight:700}

@media (max-width:860px){
  .hdr-home .wrap{grid-template-columns:1fr;gap:4px;padding-top:28px}
  .hdr-home .txt{padding-bottom:10px}
  .hdr .mascote{max-width:420px;justify-self:center;margin:0 auto}
  .hdr .balao{margin:10px auto 14px;align-self:center;text-align:center}
  .hdr .balao::after{left:calc(50% - 9px)}
  .hdr-home .mascote img{height:340px}
  .plano-box{grid-template-columns:1fr;padding:22px}
}
@media (max-width:600px){
  .marca span{font-size:0}
  .hdr p.sub{font-size:15px}
  .hdr .acoes .btn{flex:1 1 100%}
  .oferta{padding:13px 14px;gap:10px}
  .hdr .numeros{gap:14px 22px}
  .hdr .balao{position:relative;max-width:88%;font-size:13px}
  .hdr-home .mascote img{height:300px}
  .hdr.curto .mascote img{height:170px}
}
/* item com <b>/<a> no meio: bloco com o ícone pendurado (flex quebrava o texto em pedaços) */
.oferta li{display:block;position:relative;padding-left:21px}
.oferta li i{position:absolute;left:0;top:1px}

/* Promoção da assinatura (21/09/2026): "de" riscado + chamada de vagas limitadas */
.preco-de{color:var(--txt3);font-size:15px;font-weight:600;text-decoration:line-through;margin-right:2px}
.promo{display:inline-flex;align-items:center;gap:7px;margin-top:14px;background:rgba(255,212,0,.12);border:1px solid rgba(255,212,0,.45);color:#fde68a;border-radius:99px;padding:6px 13px;font-size:13px;font-weight:700;width:max-content;max-width:100%}
.promo i{color:#fbbf24}
.promo[hidden]{display:none}
.ck-plano .promo{margin-top:6px}

/* ============================================================== 22/09/2026
   Número fixo (#916), carrossel "Acabaram de entrar" e botão de voltar ao topo.
   A grade sai embaralhada a cada visita; quem mostra o que é novo é o carrossel.
   ========================================================================= */
.capa .num{position:absolute;top:10px;right:10px;font-size:11px;font-weight:800;border-radius:99px;padding:3px 9px;background:rgba(11,6,20,.78);color:var(--amarelo);border:1px solid rgba(255,212,0,.35);backdrop-filter:blur(4px);font-variant-numeric:tabular-nums}
.recentes{padding:22px 0 4px}
.recentes .cab{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.recentes h2{font-size:18px;font-weight:800;display:flex;align-items:center;gap:9px}
.recentes h2 i{color:var(--amarelo)}
.recentes .setas{display:flex;gap:8px}
.recentes .setas button{width:38px;height:38px;border-radius:50%;border:1px solid var(--linha);background:var(--card);color:var(--txt);cursor:pointer;display:grid;place-items:center}
.recentes .setas button:hover{border-color:rgba(192,132,252,.5)}
.trilho{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding-bottom:8px;scrollbar-width:none}
.trilho::-webkit-scrollbar{display:none}
.trilho .card{flex:0 0 210px;scroll-snap-align:start}
.trilho .card h3{font-size:13.5px}
.trilho .card .corpo{padding:11px 12px 13px}
.trilho .quando{font-size:11px;color:var(--txt3)}
.b-topo{position:fixed;right:18px;bottom:18px;z-index:50;width:48px;height:48px;border-radius:50%;border:0;cursor:pointer;display:grid;place-items:center;font-size:18px;color:#fff;background:linear-gradient(135deg,var(--roxo),#6d28d9);box-shadow:0 8px 24px rgba(153,37,211,.45);opacity:0;transform:translateY(12px);pointer-events:none;transition:opacity .2s,transform .2s}
.b-topo.on{opacity:1;transform:none;pointer-events:auto}
@media (max-width:600px){
  .trilho .card{flex-basis:165px}
  .recentes .setas{display:none}
  .b-topo{right:14px;bottom:14px;width:44px;height:44px}
}
.chip.num-chip{color:var(--amarelo);border-color:rgba(255,212,0,.35);font-variant-numeric:tabular-nums}
/* PageSpeed (22/09): o desfoque atrás de cada etiqueta custava caro com 24+ cards na
   tela (Style & Layout 1,2s no celular). Fundo quase opaco dá o mesmo efeito. E os
   cards fora da tela não passam por layout até chegar perto (content-visibility). */
.card .chip,.card .capa-tag,.capa .num{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(11,6,20,.86)}
.grade .card{content-visibility:auto;contain-intrinsic-size:auto 520px}
.card .capa img{aspect-ratio:4/5;height:auto}
/* PageSpeed celular (22/09): desfoque atrás das barras fixas repinta a tela toda a cada
   quadro; fundo sólido fica igual no olho. A sombra desfocada da mascote também sai. */
.topo{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(11,6,20,.97)}
.filtros{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(11,6,20,.98)}
@media (max-width:900px){.hdr .mascote img{filter:none}}
/* App da biblioteca (PWA + aviso de prompt novo) */
.app-barra{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:14px 0 4px}
.app-barra .btn i{margin-right:4px}
.app-dica{font-size:12.5px;color:var(--txt3);display:inline-flex;gap:6px;align-items:center}
/* App: faixa própria, separada dos botões de compra (no celular o .btn vira 100% e
   o "Avisar" colava no "Abrir os prompts"). Aqui os botões são pílulas do tamanho do texto. */
.app-barra{margin:24px 0 6px;padding-top:16px;border-top:1px solid var(--linha);gap:10px}
.app-barra .btn{flex:0 0 auto;width:auto;border-radius:99px;padding:9px 16px;font-size:13px;gap:8px}
.app-barra .btn i{margin-right:0}
/* Duas formas de usar a biblioteca (22/09) */
.caminhos{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:26px 0 8px}
.caminho{background:var(--card);border:1px solid var(--linha);border-radius:18px;padding:16px 18px}
.caminho.zia-cam{border-color:rgba(192,132,252,.4);background:linear-gradient(160deg,rgba(153,37,211,.16),var(--card) 60%)}
.cam-rot{display:inline-flex;gap:8px;align-items:center;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--roxo2);margin-bottom:10px}
.caminho ol{padding-left:20px;display:flex;flex-direction:column;gap:6px;color:var(--txt2);font-size:14px}
.caminho ol b{color:var(--txt)}
.caminho p{color:var(--txt2);font-size:14px;margin-bottom:12px}
.caminho p b{color:var(--txt)}
@media (max-width:760px){.caminhos{grid-template-columns:1fr}.caminho .btn{width:auto;flex:0 0 auto}}
/* Selo do marketplace no card (Mercado Livre / Shopee) */
.capa .selo-mkt{position:absolute;left:10px;bottom:10px;width:34px;height:34px;border-radius:10px;background:#fff;display:grid;place-items:center;box-shadow:0 4px 14px rgba(0,0,0,.35)}
.capa .selo-mkt img{width:22px;height:22px;object-fit:contain}
.chip.selo-chip{display:inline-flex;gap:6px;align-items:center;background:#fff;color:#1c1c1e;border-color:#fff}
.chip.selo-chip img{width:16px;height:16px;object-fit:contain}
/* Largura total (22/09, pedido do Ramon): a biblioteca ocupa a tela toda, com respiro
   lateral que cresce com a tela. Blocos de leitura (créditos, textos) seguram a própria largura. */
.wrap{max-width:none;padding-left:clamp(16px,3vw,40px);padding-right:clamp(16px,3vw,40px)}
.hdr .txt{max-width:760px}
/* Mais cards por linha na tela larga (são 2 mil prompts): 6–7 colunas em 1600px. */
@media (min-width:1100px){ .grade{grid-template-columns:repeat(auto-fill,minmax(205px,1fr));gap:14px} .card h3{font-size:14px} }
/* Nome de quem está logado no topo (todas as páginas da biblioteca). */
.topo .quem{margin-left:auto;display:inline-flex;gap:7px;align-items:center;font-size:13px;color:var(--txt2);white-space:nowrap;max-width:32vw;overflow:hidden;text-overflow:ellipsis}
.topo .quem i{color:var(--roxo2)}
.topo .quem + .dir{margin-left:10px}
@media (max-width:600px){ .topo .quem span{display:none} }
/* 22/09/2026 (noite), pedido do Ramon: "no mobile mostre os cards em duas colunas e mostre a
   capa completa sem corte". A capa deixa de ser recortada em 4:5 (object-fit:cover cortava as
   peças 2:3 e 9:16): no celular ela fica na proporção da própria imagem. `auto 4/5` segura o
   espaço até a imagem chegar, sem pulo de layout. */
@media (max-width:600px){
  .grade{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding-top:16px}
  .grade .card{contain-intrinsic-size:auto 380px;border-radius:14px}
  .grade .capa{aspect-ratio:auto}
  .grade .card .capa img{aspect-ratio:auto 4/5;height:auto;object-fit:contain}
  .grade .card .corpo{padding:10px 10px 12px;gap:6px}
  .grade .card h3{font-size:13px;line-height:1.28}
  .grade .card .prev,.grade .card .anexo span{-webkit-line-clamp:2}
  .grade .card .anexo,.grade .card .nicho{font-size:12px}
  .grade .card .ferr{display:none}   /* PageSpeed pede texto ≥ 12px: a linha de ferramentas sai no celular */
  .grade .card .pe .btn{padding:8px 6px;font-size:12px}
  .grade .card .chip,.grade .card .capa-tag,.grade .capa .num{font-size:10px;padding:3px 7px}
}
/* Paginação (400 por página) */
.paginas{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;align-items:center;margin-top:18px}
.paginas .btn{flex:0 0 auto;width:auto}
.paginas .btn[disabled]{opacity:.4;cursor:default}
.paginas .pag-n{min-width:42px}
.pag-gap{color:var(--txt3);padding:0 2px}
.pag-info{text-align:center;color:var(--txt3);font-size:12.5px;margin-top:8px}
/* Cards dos carrosséis fora da vista também não passam por layout na abertura. */
.trilho .card{content-visibility:auto;contain-intrinsic-size:auto 360px}
/* Barra do app com altura reservada: os botões aparecem depois do load sem empurrar a página. */
.app-barra{min-height:38px}
.app-barra.app-vazia{visibility:hidden}
/* 22/09/2026: kits corporativos — as fotos dos produtos do kit pra baixar e anexar junto com o logo. */
.kit-fotos{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:10px;margin-top:14px}
.kit-fotos a{position:relative;display:flex;flex-direction:column;gap:6px;background:#fff;border-radius:12px;padding:8px;text-decoration:none;color:#1f1330;font-size:11.5px;line-height:1.25;border:1px solid var(--linha)}
.kit-fotos img{width:100%;height:auto;aspect-ratio:1;object-fit:contain;display:block}
.kit-fotos span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.5em}
.kit-fotos i{position:absolute;top:6px;right:6px;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:var(--roxo);color:#fff;font-size:11px}
/* 22/09/2026: pílulas de categoria no card — clicar filtra pela categoria (ramo ou grupo). */
.pilulas{display:flex;flex-wrap:wrap;gap:6px}
.pil{display:inline-flex;align-items:center;gap:5px;max-width:100%;font-size:12px;font-weight:600;line-height:1.2;padding:4px 10px;border-radius:99px;background:rgba(153,37,211,.16);border:1px solid rgba(192,132,252,.35);color:#e9d5ff;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:background .15s,border-color .15s}
.pil:hover,.pil:focus-visible{background:rgba(153,37,211,.34);border-color:rgba(192,132,252,.7);outline:none}
.pil i{font-size:11px;color:#c084fc}
.pil-g{background:rgba(255,212,0,.1);border-color:rgba(255,212,0,.35);color:#fde68a}
.pil-g:hover,.pil-g:focus-visible{background:rgba(255,212,0,.22);border-color:rgba(255,212,0,.7)}
@media (max-width:600px){ .pil{font-size:12px;padding:4px 8px} }
/* 22/09/2026: código (SKU) do produto do catálogo nos brindes e kits — pedido do Ramon, "pra saber de qual produto". */
.card .sku{font-size:12px;font-weight:700;color:#fcd34d;letter-spacing:.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kit-fotos small{font-size:11px;font-weight:700;color:#7c3aed}
.sku-det{margin-top:10px;font-size:13px;font-weight:700;color:#fcd34d}

/* Exemplo de resposta dos prompts de texto (Instagram, 23/09/2026) */
.painel.rsp h2{display:flex;align-items:center;gap:9px}
.painel.rsp h2 i{color:#f9a8d4}
.rsp-corpo{max-height:560px;overflow:auto;font-size:14px;line-height:1.6;color:var(--txt2);padding-right:6px;overflow-wrap:anywhere}
.rsp-corpo h4{color:var(--txt);font-size:15px;margin:14px 0 6px}
.rsp-corpo h4:first-child{margin-top:0}
.rsp-corpo p{margin:0 0 8px}
.rsp-corpo ul,.rsp-corpo ol{margin:0 0 10px;padding-left:20px}
.rsp-corpo li{margin-bottom:4px}
.rsp-corpo b{color:var(--txt)}
.rsp-corpo hr{border:0;border-top:1px solid var(--linha);margin:12px 0}
.rsp-tab{overflow-x:auto;margin:6px 0 12px}
.rsp-tab table{border-collapse:collapse;font-size:12.5px;min-width:100%}
.rsp-tab th,.rsp-tab td{border:1px solid var(--linha);padding:6px 8px;text-align:left;vertical-align:top}
.rsp-tab th{color:var(--txt);background:var(--card2)}
.painel.rsp .legenda{margin-top:10px;font-size:12px;color:var(--txt3)}

/* Aviso da capa (26/09/2026): a IA pode errar; baixe a capa e mande como referência */
.aviso-ia { border: 1.5px solid #f59e0b; background: linear-gradient(180deg, rgba(245,158,11,.16), rgba(245,158,11,.06)); }
.aviso-ia h2 { color: #fcd34d; }
.aviso-ia h2 i { color: #f59e0b; }
.aviso-ia > div { color: var(--txt2); font-size: 14.5px; line-height: 1.55; }
.aviso-passos { margin-top: 10px; }
.aviso-passos ol { margin: 6px 0 0; padding-left: 20px; display: grid; gap: 4px; }
.anexo-capa { margin-top: 10px; display: flex; gap: 8px; align-items: flex-start; padding: 10px 12px; border-radius: 10px; background: rgba(245,158,11,.12); color: var(--txt2); font-size: 14px; line-height: 1.5; }
.anexo-capa i { color: #fcd34d; margin-top: 3px; }

/* A fala do vídeo (26/09/2026) */
.fala-painel { border: 1.5px solid var(--roxo2, #a855f7); }
.fala-painel h2 i { color: var(--roxo2, #a855f7); }
.fala-dica { color: var(--txt2); font-size: 14px; line-height: 1.5; margin-bottom: 10px; }
.fala-rot { display: block; font-size: 13px; font-weight: 700; margin: 10px 0 6px; color: var(--txt); }
.fala-rot span { font-weight: 500; color: var(--txt3); }
.fala-in { width: 100%; box-sizing: border-box; border-radius: 10px; border: 1px solid rgba(255,255,255,.18); background: rgba(255,255,255,.06); color: var(--txt); font: inherit; font-size: 15px; padding: 10px 12px; resize: vertical; }
.fala-in:focus { outline: 2px solid var(--roxo2, #a855f7); outline-offset: 1px; }
.fala-cont { font-size: 12px; color: var(--txt3); margin-top: 4px; text-align: right; }
.fala-cont.muito { color: #fcd34d; }
.fala-aviso { margin-top: 10px; color: #fca5a5; font-size: 13.5px; font-weight: 600; }

/* Hero em vídeo (26/09/2026): computador só; a mascote em imagem dá lugar à do vídeo. */
.hero-video{display:none}
@media (min-width:861px){
  .hdr-home .hero-video{display:block;position:absolute;inset:0;z-index:0;overflow:hidden;opacity:0;transition:opacity .6s ease}
  .hdr-home.com-video .hero-video{opacity:1}
  /* Altura inteira, encostado à direita: 'cover' cortava a cabeça em tela larga (hero ~2,7:1 × vídeo 16:9). */
  .hdr-home .hero-video video{position:absolute;top:0;right:0;height:100%;width:auto;max-width:none;display:block;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 22%);mask-image:linear-gradient(90deg,transparent 0,#000 22%)}
  .hdr-home .hero-video::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,6,20,.92) 0%,rgba(11,6,20,.78) 38%,rgba(11,6,20,.15) 62%,rgba(11,6,20,0) 75%)}
  /* visibility junto: só opacity deixava um "fantasma" da mascote por cima do vídeo (26/09, visto no Chrome). */
  .hdr-home.com-video .mascote img{opacity:0;visibility:hidden;transition:opacity .4s ease,visibility 0s linear .4s}
  .hdr-home.com-video .balao{display:none}
}
@media (prefers-reduced-motion:reduce){.hdr-home .hero-video{display:none!important}}

/* Casos reais (26/09/2026): print do chat na IA → resultado. */
.casos{margin:22px 0 8px;background:var(--card);border:1px solid var(--linha);border-radius:18px;padding:18px}
.casos h2{margin:0 0 14px;font-size:22px}
.caso{display:grid;grid-template-columns:minmax(0,.8fr) auto minmax(0,1.4fr);gap:16px;align-items:center}
.caso-lado{margin:0;min-width:0}
.caso-lado img,.caso-video{display:block;width:100%;border-radius:14px;border:1px solid var(--linha);background:#000}
.caso-lado img{max-height:340px;object-fit:contain}
.caso-lado figcaption{margin-top:8px;font-size:13px;color:var(--tx2,#a9a3b8)}
.caso-seta{font-size:22px;color:var(--roxo2)}
.caso-txt{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:12px 18px;align-items:center;justify-content:space-between}
.caso-txt p{margin:0;flex:1 1 380px}
@media (max-width:760px){.caso{grid-template-columns:1fr}.caso-seta{transform:rotate(90deg);justify-self:center}}
/* Depoimento em vídeo (em pé): vídeo estreito à esquerda, texto ao lado */
.caso-depo{grid-template-columns:minmax(0,300px) minmax(0,1fr);margin-top:22px;padding-top:22px;border-top:1px solid var(--linha)}
.caso-depo video{display:block;width:100%;height:auto;aspect-ratio:9/16;border-radius:14px;border:1px solid var(--linha);background:#000}
.caso-depo .caso-txt{grid-column:auto;flex-direction:column;align-items:flex-start;justify-content:center}
.caso-depo .caso-txt p{flex:0 0 auto}
.caso-depo h3{margin:0;font-size:19px}
@media (max-width:760px){.caso-depo{grid-template-columns:1fr}.caso-depo .caso-lado{max-width:300px;justify-self:center;width:100%}}
/* Kit grátis (26/09/2026): chamada "Leve 100 prompts grátis" e a janela de saída. */
.nota-gratis a.kit-cta{display:inline-flex;align-items:center;gap:6px;background:rgba(250,204,21,.12);border:1px solid rgba(250,204,21,.45);color:#fde68a;border-radius:99px;padding:4px 12px;text-decoration:none}
.nota-gratis a.kit-cta:hover{background:rgba(250,204,21,.2)}
.kit-saida{position:fixed;inset:0;z-index:200;background:rgba(6,3,12,.72);display:flex;align-items:center;justify-content:center;padding:16px;animation:kitIn .18s ease-out}
.kit-saida-c{position:relative;max-width:420px;width:100%;background:#150c24;border:1px solid var(--linha);border-radius:20px;padding:26px 22px 18px;text-align:center;box-shadow:0 30px 80px rgba(0,0,0,.5)}
.kit-saida-c h2{font-size:21px;line-height:1.25;margin:6px 0 8px}
.kit-saida-c p{color:var(--txt2);font-size:14px;margin-bottom:16px}
.kit-saida-c .btn{width:100%;justify-content:center}
.kit-saida-ico{font-size:38px;color:var(--amarelo,#facc15)}
.kit-saida-x{position:absolute;top:10px;right:10px;width:34px;height:34px;border-radius:50%;border:0;background:rgba(255,255,255,.08);color:var(--txt2);font-size:15px;cursor:pointer}
.kit-saida-nao{margin-top:10px;background:none;border:0;color:var(--txt3);font-size:13px;cursor:pointer;padding:6px}
@keyframes kitIn{from{opacity:0}to{opacity:1}}

/* 27/09/2026: topo do assinante no celular — botões só com ícone (o texto fica no title). */
@media (max-width:600px){.topo .dir{min-width:0;gap:6px}.topo .dir .btn .t{display:none}.topo .dir .chip{font-size:11px;white-space:nowrap;line-height:1.15;max-width:none;flex:none}.topo .dir{flex-wrap:nowrap}.topo .dir .chip.livre{padding-left:8px;padding-right:8px}.topo .dir .chip.livre .t{display:none}.topo .dir .btn-peq{flex:none;min-width:34px;justify-content:center}}

/* 1º quadro = quadro final (27/09/2026). html.hv (vídeo no computador) e html.assinante (cache) vêm do
   script do <head>, antes da primeira pintura. */
.hdr-home .hero-video video,.hdr-home .hero-video .hv-poster{aspect-ratio:16/9}
@media (min-width:861px){
  html.hv .hdr-home .hero-video{opacity:1;transition:none}
  .hdr-home .hero-video .hv-poster{position:absolute;top:0;right:0;height:100%;width:auto;max-width:none;display:block;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 22%);mask-image:linear-gradient(90deg,transparent 0,#000 22%)}
  html.hv .hdr-home .mascote img{visibility:hidden}
  html.hv .hdr-home .balao{display:none}
}
html.assinante #cta-compra,html.assinante #nota-gratis{display:none}
/* Instalar o app / Avisar prompt novo entram depois do load: a linha já nasce com a altura dos botões. */
.app-barra{min-height:56px}

/* Prova social real + desejo + selo (27/09/2026). Tudo sai do servidor (sem pulo de layout). */
.prova-linha{display:flex;flex-wrap:wrap;gap:6px 14px;margin:10px 0 0;color:var(--txt2);font-size:13px}
.prova-linha span{display:inline-flex;align-items:center;gap:6px}
.prova-linha i{color:#c084fc}
.desejo{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:18px;align-items:center;margin:8px 0 26px;padding:18px;border-radius:18px;background:linear-gradient(135deg,rgba(124,58,237,.18),rgba(234,88,12,.12));border:1px solid rgba(192,132,252,.25)}
.desejo h2{font-size:22px;line-height:1.2;margin:0 0 8px}
.desejo p{color:var(--txt2);margin:0 0 14px;font-size:14.5px;line-height:1.5}
.desejo-fotos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.desejo-fotos img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:12px;display:block}
html.assinante .desejo{display:none}
.chip.selo-st{background:rgba(192,132,252,.16);color:#e9d5ff;border:1px solid rgba(192,132,252,.35)}
.chip.selo-st.fund{background:linear-gradient(90deg,#f59e0b,#eab308);color:#1f1300;border-color:transparent;font-weight:800}
@media (max-width:760px){.desejo{grid-template-columns:1fr}.desejo-fotos{grid-template-columns:repeat(4,minmax(0,1fr))}.desejo h2{font-size:19px}}
/* 27/09/2026: a chamada do fundador é mais longa — a pílula quebra linha e não estica a coluna (rolagem lateral no celular). */
.plano-txt{min-width:0}
.promo{width:auto;max-width:100%;white-space:normal;align-items:flex-start;line-height:1.35}
.promo{border-radius:14px}

/* 27/09/2026: imagem quebrada não mostra o alt por cima do card */
img{color:transparent}

/* 27/09/2026 — auditoria no celular: textos e alvos de toque maiores. */
.aceite input{width:22px;height:22px}
.aceite{min-height:44px;align-items:center}
@media (max-width:600px){
  .topo .dir .btn-peq{min-height:44px}
  #t-chips .chip{font-size:12.5px;padding:4px 10px}
  .bloco .rot{font-size:12.5px}
}
/* Exemplos reais logo abaixo do título (27/09/2026). Altura reservada: não pula. */
.hx{display:flex;gap:10px;margin:14px 0 4px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;height:112px}
.hx::-webkit-scrollbar{display:none}
.hx-i{flex:0 0 112px;height:112px;border-radius:16px;overflow:hidden;scroll-snap-align:start;border:1px solid var(--linha);background:rgba(255,255,255,.05)}
.hx-i img{width:100%;height:100%;object-fit:cover;display:block;color:transparent}
@media (max-width:600px){.hx{height:92px;gap:8px}.hx-i{flex-basis:92px;height:92px;border-radius:14px}}
/* 27/09/2026: no celular os 2 botões do app quebravam em 2 linhas depois de desenhar (a página pulava 50 px). */
.app-barra .app-c{display:none}
@media (max-width:600px){
  .app-barra{flex-wrap:nowrap}
  .app-barra .btn{flex:1 1 0;min-width:0;justify-content:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:9px 10px;font-size:12.5px}
  .app-barra .app-l{display:none}
  .app-barra .app-c{display:inline}
}

/* Convite do AutoZap — faixa do ASSINANTE (27/09/2026). Fixa no rodapé, fora do fluxo (CLS 0). */
#cvz-faixa{position:fixed;left:12px;right:84px;bottom:14px;z-index:55;display:flex;align-items:center;gap:6px;max-width:560px;padding:8px 8px 8px 14px;border-radius:14px;background:rgba(20,14,34,.96);border:1px solid rgba(167,139,250,.4);box-shadow:0 10px 30px rgba(0,0,0,.45);animation:cvzin .4s ease-out both}
#cvz-faixa a{flex:1;min-width:0;display:flex;align-items:center;gap:10px;color:#ece8ff;text-decoration:none;font-size:13px;line-height:1.35}
#cvz-faixa a i{color:#4ade80;font-size:17px;flex:none}
#cvz-faixa a b{color:#c4b5fd;white-space:nowrap}
#cvz-faixa button{flex:none;width:36px;height:36px;border:0;border-radius:10px;background:transparent;color:#a39cbd;font-size:16px;cursor:pointer}
@media (prefers-reduced-motion:reduce){#cvz-faixa{animation:none}}
@keyframes cvzin{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
/* 27/09/2026: topo do assinante no celular estreito — 7 itens não cabiam em 360 (layout de 379 px abria com zoom afastado). */
@media (max-width:400px){.topo .wrap{gap:6px}.topo .dir{gap:4px}.topo .dir .btn-peq{padding:8px 9px}.topo .dir .chip{padding-left:7px;padding-right:7px}}
#cvz-faixa[hidden]{display:none}

/* ===== Hero com SIMULADOR (27/09/2026) — saíram vídeo, mascote e a faixa de exemplos.
   A coluna de texto vira "contents" pra o simulador ficar logo abaixo do título no celular
   e na coluna da direita no computador. Espaço sempre reservado (CLS 0). ===== */
.hdr-home .wrap{display:block;position:relative;padding-top:34px;padding-bottom:40px}
.hdr-home .txt{width:54%;max-width:640px;padding-bottom:0}
.hdr-home .sim{position:absolute;right:0;top:40px;width:42%;max-width:500px}
.sim{--sim-d:12s;width:100%;max-width:500px;margin:0 auto}
.sim-palco{position:relative;height:430px;border-radius:24px;background:linear-gradient(160deg,rgba(146,72,255,.18),rgba(255,255,255,.03));border:1px solid var(--linha);overflow:hidden;animation:simRoda var(--sim-d) linear infinite}
@keyframes simRoda{to{outline-color:transparent}}
.sim-card,.sim-chat,.sim-res{position:absolute;inset:22px;display:flex;flex-direction:column;opacity:0}
.sim-card{justify-content:center;gap:14px;animation:simP1 var(--sim-d) infinite}
.sim-card{background:none}
.sim-thumb{width:100%;height:210px;object-fit:cover;border-radius:18px;display:block;color:transparent;background:rgba(255,255,255,.05)}
.sim-ct b{display:block;font-size:17px;line-height:1.25;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sim-prev{margin:6px 0 0;font-size:13px;line-height:1.45;color:var(--txt2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sim-btn{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;padding:11px 18px;border-radius:12px;background:linear-gradient(135deg,#9d4dff,#6d28d9);color:#fff;font-weight:700;font-size:14px;animation:simClick var(--sim-d) infinite}
.sim-btn .sim-a{animation:simA var(--sim-d) infinite}
.sim-btn .sim-b{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:6px;opacity:0;animation:simB var(--sim-d) infinite}
.sim-btn{position:relative}
.sim-chat{background:#15101f;border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:14px;gap:12px;animation:simP2 var(--sim-d) infinite}
.sim-cab{font-size:13px;font-weight:700;color:#d8c2ff;display:flex;align-items:center;gap:7px}
.sim-msg{margin-top:auto;align-self:flex-end;max-width:92%;background:#2a1d45;border-radius:16px 16px 4px 16px;padding:10px 12px}
.sim-anexo{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:#fde68a;background:rgba(0,0,0,.25);border-radius:8px;padding:4px 8px;margin-bottom:6px}
.sim-anexo[hidden]{display:none}
.sim-txt{margin:0;font-size:13px;line-height:1.45;color:#eee;clip-path:inset(0 100% 0 0);animation:simTxt var(--sim-d) infinite}
.sim-in{display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.06);border-radius:12px;padding:10px 12px;font-size:13px;color:var(--txt2)}
.sim-in span{flex:1}
.sim-in .fa-paper-plane{color:#c4a1ff}
.sim-res{align-items:center;justify-content:center;gap:10px;animation:simP3 var(--sim-d) infinite}
.sim-ger{font-size:14px;color:#d8c2ff;animation:simGer var(--sim-d) infinite}
.sim-ger i{animation:fa-spin 1s linear infinite;margin-right:6px}
.sim-img{position:absolute;inset:0;margin:auto;width:auto;height:calc(100% - 48px);max-width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:18px;color:transparent;opacity:0;transform:scale(.92);animation:simImg var(--sim-d) infinite}
.sim-ok{position:absolute;bottom:0;left:50%;transform:translateX(-50%);display:inline-flex;align-items:center;gap:6px;background:#16a34a;color:#fff;font-weight:700;font-size:13px;padding:6px 12px;border-radius:99px;opacity:0;animation:simOk var(--sim-d) infinite}
.sim-cursor{position:absolute;font-size:24px;color:#fff;filter:drop-shadow(0 2px 4px rgba(0,0,0,.6));left:78%;top:80%;opacity:0;animation:simCur var(--sim-d) infinite}
.sim-passos{list-style:none;display:flex;justify-content:center;gap:8px;margin:12px 0 0;padding:0}
.sim-passos li{display:flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--txt2);padding:6px 10px;border-radius:99px;border:1px solid var(--linha)}
.sim-passos b{width:20px;height:20px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:11px;background:rgba(255,255,255,.1);color:#fff}
.sim-passos li:nth-child(1){animation:simL1 var(--sim-d) infinite}
.sim-passos li:nth-child(2){animation:simL2 var(--sim-d) infinite}
.sim-passos li:nth-child(3){animation:simL3 var(--sim-d) infinite}
@keyframes simP1{0%,31%{opacity:1;transform:none}35%,99%{opacity:0;transform:translateY(-8px)}100%{opacity:1;transform:none}}
.sim-card{opacity:1}
@keyframes simP2{0%,34%{opacity:0;transform:translateY(8px)}38%,63%{opacity:1;transform:none}67%,100%{opacity:0}}
@keyframes simP3{0%,65%{opacity:0}68%,97%{opacity:1}100%{opacity:0}}
@keyframes simCur{0%,4%{opacity:0;left:80%;top:84%}8%{opacity:1}20%{left:18%;top:calc(100% - 64px)}22%{transform:scale(.8)}24%{transform:scale(1)}29%{opacity:1}32%,100%{opacity:0;left:18%;top:calc(100% - 64px)}}
@keyframes simClick{0%,21%{transform:none}22%{transform:scale(.95)}24%,100%{transform:none}}
@keyframes simA{0%,22%{opacity:1}23%,100%{opacity:0}}
@keyframes simB{0%,22%{opacity:0}23%,100%{opacity:1}}
@keyframes simTxt{0%,40%{clip-path:inset(0 100% 0 0)}54%,100%{clip-path:inset(0 0 0 0)}}
@keyframes simGer{0%,66%{opacity:0}68%,77%{opacity:1}79%,100%{opacity:0}}
@keyframes simImg{0%,77%{opacity:0;transform:scale(.92)}81%,96%{opacity:1;transform:none}100%{opacity:0}}
@keyframes simOk{0%,81%{opacity:0}84%,96%{opacity:1}100%{opacity:0}}
@keyframes simL1{0%,33%{background:rgba(157,77,255,.25);color:#fff;border-color:#9d4dff}34%,100%{background:none;color:var(--txt2);border-color:var(--linha)}}
@keyframes simL2{0%,34%{background:none;color:var(--txt2);border-color:var(--linha)}36%,66%{background:rgba(157,77,255,.25);color:#fff;border-color:#9d4dff}67%,100%{background:none;color:var(--txt2);border-color:var(--linha)}}
@keyframes simL3{0%,66%{background:none;color:var(--txt2);border-color:var(--linha)}68%,99%{background:rgba(22,163,74,.25);color:#fff;border-color:#16a34a}100%{background:none;color:var(--txt2);border-color:var(--linha)}}
@media (max-width:860px){
  .hdr-home .wrap{padding-top:22px;padding-bottom:24px}
  .hdr-home .txt{width:auto;max-width:none}
  .hdr-home .sim{position:static;width:100%;max-width:none;margin:14px 0 6px}
  .sim-palco{height:300px;border-radius:20px}
  .sim-card,.sim-chat,.sim-res{inset:14px}
  .sim-thumb{height:136px}
  .sim-ct b{font-size:15px}
  .sim-passos li{font-size:12px;padding:5px 8px}
}
@media (prefers-reduced-motion:reduce){
  .sim-palco,.sim-card,.sim-chat,.sim-res,.sim-cursor,.sim-btn,.sim-txt,.sim-ger,.sim-img,.sim-ok,.sim-passos li,.sim-btn span{animation:none!important}
  .sim-card,.sim-chat,.sim-cursor,.sim-ger{opacity:0}
  .sim-res,.sim-img,.sim-ok{opacity:1;transform:none}
  .sim-passos li:nth-child(3){background:rgba(22,163,74,.25);color:#fff;border-color:#16a34a}
}
.numeros .n-extra b{font-size:inherit}
.numeros .n-extra span{opacity:.75}

/* 27/09/2026 — "Entrar grátis" e paywall do Premium (js/pg/prompts-entrar.js). Fecha só por X/Esc. */
html.pze-aberto{overflow:hidden}
.pze-fundo{position:fixed;inset:0;z-index:200;background:rgba(5,2,10,.72);display:flex;align-items:center;justify-content:center;padding:16px;backdrop-filter:blur(3px)}
.pze{position:relative;width:100%;max-width:380px;max-height:calc(100dvh - 32px);overflow:auto;background:var(--card);border:1px solid var(--linha);border-radius:20px;padding:22px 20px 18px;box-shadow:0 24px 60px rgba(0,0,0,.5)}
.pze-x{position:absolute;top:10px;right:10px;width:36px;height:36px;border-radius:10px;border:0;background:transparent;color:var(--txt2);font-size:24px;line-height:1;cursor:pointer}
.pze-t{font-size:20px;font-weight:800;margin:0 36px 4px 0;display:flex;gap:8px;align-items:center}
.pze-s{color:var(--txt2);font-size:14px;margin:0 0 14px}
.pze-rot{display:block;font-size:13px;font-weight:700;color:var(--txt2);margin:10px 0 6px}
.pze-rot span{font-weight:500;color:var(--txt3)}
.pze-in{width:100%;box-sizing:border-box;height:48px;border-radius:12px;border:1px solid var(--linha);background:var(--bg2);color:var(--txt);padding:0 14px;font:inherit;font-size:16px}
.pze-in:focus{outline:2px solid #a855f7;outline-offset:1px}
.pze-ok{display:flex;gap:10px;align-items:center;margin:14px 0 4px;font-size:13.5px;color:var(--txt2);min-height:44px;cursor:pointer}
.pze-ok input{width:22px;height:22px;flex:none;accent-color:#a855f7}
.pze-erro{color:#fca5a5;font-size:13.5px;margin:8px 0 0}
.pze-b{width:100%;justify-content:center;margin-top:14px}
.pze-mini{font-size:12px;color:var(--txt3);text-align:center;margin:10px 0 0;line-height:1.4}
.pze-mini a,.pze-alt a{color:var(--txt2)}
.pze-alt{text-align:center;font-size:14px;margin:12px 0 0}
.pze-img{display:block;width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:14px;margin:-4px 0 14px}
.pze-lib{font-size:17px;font-weight:800;margin:6px 0 4px}
.pze-preco{color:var(--txt2);font-size:13.5px;margin:0}
.pze-preco b{color:var(--txt);font-size:18px}
.chip.prem{color:#fcd34d;border-color:rgba(252,211,77,.35)}
/* Vitrine simples: visitante vê "Entrar grátis"; quem já entrou (lead ou sessão) vê "Ver os prompts". */
#b-ver{display:none}
html.lead #b-ver,html.logado:not(.assinante) #b-ver{display:inline-flex}
html.lead #b-cta,html.logado:not(.assinante) #b-cta[data-entrar]{display:none}
.hero-div{color:var(--txt3);font-size:13px;margin:10px 0 0}


/* ===== Vitrine de FOTOS (27/09/2026, Ramon: "o principal é ele ver as FOTOS dos prompts e criar desejo").
   Sem hero: título pequeno, busca, impactantes grandes e a grade. O card é só a foto + selo + título. ===== */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.hdr-mini{background:none;border-bottom:0}
.hdr-mini .wrap{display:block;padding-top:16px;padding-bottom:8px}
.hdr-mini h1{font-size:22px;line-height:1.25;font-weight:800;max-width:none;margin:0}
.hdr-mini h1 #n-total{color:var(--amarelo)}
.hdr-mini .hero-div{font-size:13px;color:var(--txt2);margin:4px 0 0}
.hdr-mini .hero-div b{color:var(--txt)}
.hdr-mini .app-barra{margin:8px 0 0;padding:0;border:0;min-height:0}
.hdr-mini .app-barra.app-vazia{display:none}
html:not(.lead):not(.logado) .hdr-mini .app-barra{display:none}
#hdr-avisos:empty{display:none}
#hdr-avisos .aviso-venc{margin-top:8px}
.filtros{top:58px;padding:8px 0}
.cf{position:relative;background:none;border:0;border-radius:14px;overflow:visible}
.cf .capa{border-radius:14px;overflow:hidden;background:#1a1128}
.cf:hover{transform:none}
.cf:hover .capa img{transform:scale(1.03)}
.cf .capa img{transition:transform .25s}
.cf h3{font-size:13px;font-weight:600;line-height:1.3;color:var(--txt2);margin:6px 2px 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cf-sel{position:absolute;top:8px;right:8px;z-index:2;display:inline-flex;align-items:center;justify-content:center;border-radius:99px;font-size:11px;font-weight:800;line-height:1}
.cf-sel.g{background:#15803d;color:#fff;padding:5px 8px}
.cf-sel.p{width:26px;height:26px;background:rgba(11,6,20,.78);color:#fde68a;font-size:11px}
.cf-vid{position:absolute;top:8px;left:8px;z-index:2;width:26px;height:26px;border-radius:50%;background:rgba(11,6,20,.78);color:#fff;display:grid;place-items:center;font-size:10px}
.grade{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px}
.grade .cf{content-visibility:auto;contain-intrinsic-size:auto 300px}
#impacto{padding-top:14px}
#impacto .trilho{gap:12px}
#impacto .trilho .cf{flex:0 0 240px;content-visibility:visible}
@media (min-width:1100px){.grade{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media (max-width:600px){
  .hdr-mini .wrap{padding-top:12px;padding-bottom:6px}
  .hdr-mini h1{font-size:19px}
  .hdr-mini .hero-div{font-size:12.5px}
  .filtros{position:static;padding:8px 0}
  .filtros .linha{gap:8px}
  .filtros .campo{flex:0 0 100%}
  .filtros select{flex:1 1 calc(50% - 4px);max-width:none;padding:9px 10px;font-size:14px}
  .filtros #f-anexo,.filtros #f-ordem{display:none}
  .contagem{margin-top:6px}
  #impacto{padding-top:10px}
  #impacto .cab{margin-bottom:8px}
  #impacto h2{font-size:16px}
  #impacto .trilho .cf{flex-basis:64vw;max-width:260px}
  .grade{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding-top:12px}
  .grade .cf{contain-intrinsic-size:auto 260px}
  .cf h3{font-size:12.5px}
}
/* 27/09/2026 (Ramon): o topo da vitrine CENTRALIZADO — título, linha pequena, busca e filtros, com largura máxima. */
.hdr-mini .wrap{text-align:center}
.hdr-mini h1{max-width:720px;margin:0 auto}
.hdr-mini .hero-div{max-width:720px;margin-left:auto;margin-right:auto}
.hdr-mini .app-barra{justify-content:center}
.filtros .linha{justify-content:center;max-width:1040px;margin:0 auto}
.filtros .contagem{text-align:center}
@media (max-width:600px){.hdr-mini h1{max-width:340px}}
/* 27/09/2026 (Ramon): o h1 visível é só "Mais de 5.000 prompts de IA", numa linha também no celular. */
.hdr-mini h1{white-space:nowrap;font-size:26px}
@media (max-width:600px){.hdr-mini h1{font-size:clamp(18px,6vw,22px);max-width:none}}

/* ===== Página do prompt (27/09/2026, Ramon: "a capa no celular está lá embaixo… diminua as letras"):
   a FOTO primeiro e grande; depois título compacto e centralizado, o botão principal e o texto. ===== */
.pz-det{grid-template-columns:minmax(0,460px) minmax(0,1fr);gap:28px;padding-top:20px}
.pz-det .lado{top:76px}
.pz-det .lado img.exemplo{width:100%;height:auto;aspect-ratio:auto 1/1;border-radius:18px}
.pz-cab{background:none;border:0;overflow:visible;text-align:center;padding:0}
.pz-cab .trilha{justify-content:center;margin-bottom:6px}
.pz-cab h1{font-size:26px;line-height:1.2;max-width:640px;margin:0 auto}
.pz-chips{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;margin-top:10px}
.pz-cab .app-barra{justify-content:center;margin:8px 0 0;padding:0;border:0;min-height:0}
.pz-cab .app-barra.app-vazia{display:none}
.pz-acao{display:flex;justify-content:center;margin:14px 0 16px;min-height:52px}
.pz-acao .btn{min-width:260px;justify-content:center}
.pz-onde{margin-top:12px}
@media (max-width:900px){
  .pz-det{grid-template-columns:1fr;gap:12px;padding-top:12px}
  .pz-det .lado{position:static}
  .pz-det .lado img.exemplo{max-width:520px;margin:0 auto}
}
@media (max-width:600px){
  .pz-det{padding-top:0}
  .pz-det .lado{margin:0 -16px}
  .pz-det .lado img.exemplo{border-radius:0;border-left:0;border-right:0;max-width:none}
  .pz-det .lado .legenda{padding:0 16px;font-size:12px}
  .pz-det .lado .linha-btn{padding:0 16px}
  .pz-cab .trilha{font-size:12px}
  .pz-cab h1{font-size:21px}
  .pz-chips .chip{font-size:11.5px}
  .pz-acao{margin:12px 0}
  .pz-acao .btn{width:100%;min-width:0;font-size:15px;padding:13px 16px}
  .pz-det .painel{padding:14px;border-radius:16px}
  .pz-det .painel + .painel{margin-top:10px}
  .pz-det .painel h2{font-size:15.5px;margin-bottom:8px}
  .pz-det .painel,.pz-det .painel div,.pz-det .fala-dica{font-size:14px}
  .pz-det pre.prompt{font-size:13px}
  .pz-det .rot,.pz-det .fala-rot{font-size:12px}
  .pz-det .btn{font-size:15px}
  .pz-det .cadeado{padding:18px 14px}
  .pz-det .aviso-ia ol{font-size:14px}
}
.contagem:empty{display:none}
@media (max-width:900px){.pz-det .lado img.exemplo{max-height:60vh;object-fit:contain;background:#0e0818}}
.pze-cab{display:flex;gap:12px;align-items:center;margin-bottom:12px;padding-right:34px;text-align:left}
.pze-cab .pze-t{margin:0}
.pze-cab .pze-s{margin:2px 0 0}
.pze-mini-img{width:64px;height:80px;object-fit:cover;border-radius:10px;flex:none}
.pz-cab .app-barra{display:none!important}
@media (max-width:900px){.pz-det #col-dir .linha-btn{display:none}}
@media (max-width:600px){.filtros select{flex:1 1 0;min-width:0;padding:9px 6px;font-size:13px}}
/* O texto que o servidor manda (pro Google) fica invisível até o script desenhar o de quem está vendo: sem pulo. */
html.js .pz-esq-ssr{visibility:hidden}
/* 27/09/2026 (Ramon): Premium = COROA dourada (era cadeado). */
.cf-sel.p{width:auto;height:auto;padding:5px 8px;gap:4px;background:rgba(11,6,20,.78);color:#fcd34d;font-size:11px}
.cf-sel.p i{color:#fbbf24}
.pz-coroa{color:#fbbf24}
/* 27/09/2026 (Ramon): sem "Instalar o app"/"Avisar prompt novo" na tela (aviso de prompt novo é pelo e-mail semanal).
   O elemento continua na página porque é por ele que o PromptsUI.app() registra o service worker e o manifest. */
.hdr-mini .app-barra,.pz-cab .app-barra{display:none!important}
html.lead #pz-acao:not(.pronto) > *,html.logado #pz-acao:not(.pronto) > *{visibility:hidden}
/* Senha com olho na janela "Entrar grátis" (27/09/2026). */
.pze-senha{position:relative}
.pze-senha .pze-in{padding-right:52px}
.pze-olho{position:absolute;right:2px;top:2px;width:44px;height:44px;border:0;background:none;color:var(--txt2);cursor:pointer;display:grid;place-items:center;font-size:16px}
.pze-okmsg{color:#86efac;font-size:13.5px;margin-top:8px}

/* Menu do usuário no topo (27/09/2026, Ramon: "mostre a foto do perfil e o nome do usuário logado e troque
   o nome Assinante por ícone apenas"). Um botão (foto/iniciais + coroa de quem assina + primeiro nome) que
   abre o menu. No celular só a foto e a coroa. */
.topo .dir.u-on{gap:0}
.u-wrap{position:relative}
.u-btn{display:inline-flex;align-items:center;gap:8px;height:44px;padding:4px 10px 4px 4px;border-radius:99px;border:1px solid var(--linha);background:var(--card);color:var(--txt);font-family:inherit;font-weight:600;font-size:14px;line-height:1;cursor:pointer}
.u-btn:hover,.u-btn[aria-expanded="true"]{background:var(--card2)}
.u-btn:focus-visible{outline:2px solid var(--roxo2);outline-offset:2px}
.u-av{width:34px;height:34px;border-radius:50%;overflow:hidden;flex:none;display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#7c3aed,#c026d3)}
.u-av img{width:34px;height:34px;object-fit:cover;border-radius:50%}
.u-ini{font-size:13px;font-weight:800;color:#fff;letter-spacing:.02em}
.u-av-w{position:relative;flex:none;display:inline-flex}
.u-selo{position:absolute;right:-4px;bottom:-4px;height:18px;min-width:18px;border-radius:99px;border:2px solid var(--card);display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;line-height:1}
.u-selo-p{background:#1a1029;color:#fbbf24;font-size:9px}
.u-selo-f{background:#16a34a;color:#fff;font-size:8.5px;font-weight:800;letter-spacing:.02em;padding:0 4px;right:-10px}
.u-nome{max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.u-seta{font-size:11px;color:var(--txt3)}
.u-menu{position:absolute;right:0;top:calc(100% + 8px);min-width:236px;background:#1a1029;border:1px solid var(--linha);border-radius:14px;padding:6px;box-shadow:0 18px 40px rgba(0,0,0,.45);z-index:80}
.u-menu[hidden]{display:none}
.u-cab{padding:8px 10px 10px;border-bottom:1px solid var(--linha);margin-bottom:4px;display:flex;flex-direction:column;gap:2px;min-width:0}
.u-cab b{font-size:14px}
.u-cab small{font-size:12px;color:var(--txt3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.u-it{display:flex;align-items:center;gap:10px;width:100%;min-height:44px;padding:8px 10px;border-radius:10px;color:var(--txt);text-decoration:none;font-family:inherit;font-weight:500;font-size:14px;line-height:1.2;background:none;border:0;cursor:pointer;text-align:left}
.u-it i{width:18px;text-align:center;color:var(--roxo2);flex:none}
.u-it span{display:flex;flex-direction:column;gap:2px}
.u-it small{font-size:11.5px;color:var(--txt3)}
.u-it:hover,.u-it:focus-visible{background:rgba(255,255,255,.07);outline:none}
.u-it.u-dest i{color:#fbbf24}
.u-sep{border:0;border-top:1px solid var(--linha);margin:4px 6px}
.u-it[aria-current="page"]{background:rgba(153,37,211,.16)}
/* Celular (27/09, Ramon): o primeiro nome continua visível — "logo … [foto] Ramon ▾" cabe no 360. */
@media (max-width:600px){.u-btn{height:40px;padding:3px 8px 3px 3px;gap:6px;font-size:13px}.u-av,.u-av img{width:32px;height:32px}.u-nome{max-width:84px}.u-seta{font-size:10px}.u-menu{min-width:224px;max-width:calc(100vw - 32px)}}
/* O menu fica acima do aviso flutuante de prova social (.pv-toast, z 70), que ficava por cima dele no computador. */
.topo:has(.u-menu:not([hidden])){z-index:75}
/* Chips de plataforma (27/09/2026): logo ou ícone da marca, rola na horizontal no celular. Altura fixa = sem CLS. */
.plats{display:flex;gap:8px;margin-top:10px;height:36px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.plats::-webkit-scrollbar{display:none}
.plats:empty{display:none}
.plat{flex:none;display:inline-flex;align-items:center;gap:7px;height:36px;padding:0 13px 0 9px;border-radius:99px;border:1px solid var(--linha);background:var(--card);color:var(--txt2);font-family:inherit;font-weight:600;font-size:13px;line-height:1;cursor:pointer;white-space:nowrap}
.plat img{width:18px;height:18px;border-radius:4px;flex:none}
.plat i{font-size:17px;width:18px;text-align:center}
.plat .fa-instagram{color:#e4405f}.plat .fa-youtube{color:#ff0033}.plat .fa-whatsapp{color:#25d366}.plat .fa-tiktok{color:#fff}.plat .fa-amazon{color:#ff9900}
.plat:hover{background:var(--card2)}
.plat[aria-pressed="true"]{background:rgba(153,37,211,.28);border-color:var(--roxo2);color:#fff}
.plat:focus-visible{outline:2px solid var(--roxo2);outline-offset:2px}
@media (max-width:600px){.plats{margin-top:8px;margin-right:-16px;padding-right:16px}}
.plat:first-child{margin-left:auto}.plat:last-child{margin-right:auto}   /* centra como os filtros; com rolagem, não corta o 1º */
/* Logado (27/09/2026): nenhum "Entrar"/"Já tenho conta" em página nenhuma — a classe vem do prompts-topo.js. */
.pz-logado [data-entrar="conta"],.pz-logado .so-deslogado{display:none!important}
/* Grade em MOSAICO (27/09/2026, Ramon: "estilo Pinterest"). As colunas são montadas pelo script logo depois da
   grade (prompts.html, __mosaico): cada card na coluna mais baixa. A foto mostra a proporção REAL (width/height do
   <img> vêm da medida do servidor), então nada pula quando ela carrega. O carrossel dos impactantes segue 4:5. */
.grade.mosaico{display:flex;align-items:flex-start;gap:14px}
.grade.mosaico .mcol{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:14px}
.grade.mosaico .capa{aspect-ratio:auto}
.grade.mosaico .card .capa img{aspect-ratio:auto;width:100%;height:auto;object-fit:cover;display:block}
.grade.mosaico .cf{content-visibility:visible}
.grade .cf h3{white-space:normal;text-overflow:clip;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-align:center;font-size:13.5px;line-height:1.3;height:2.6em;margin:7px 4px 0}
@media (max-width:600px){.grade.mosaico,.grade.mosaico .mcol{gap:10px}.grade .cf h3{font-size:13px}}

/* 27/09/2026: topo e filtros SÓLIDOS — o conteúdo aparecia por trás ao rolar (Meu perfil). */
.topo{background:#0b0614!important}
.filtros{background:#0b0614!important}

/* Favoritas (27/09/2026): coração em cima da foto do card, chip "Favoritas" e o aviso rápido. Só logado:
   o coração só nasce pelo script (PromptsUI.fav) e o chip some pro visitante. */
html:not(.pz-logado) .plat-fav{display:none}
.plat-fav i{color:#fb7185}
.plat-vest i{color:#60a5fa}   /* Vestuário (27/09/2026) */
.plat-n{min-width:20px;height:20px;padding:0 6px;border-radius:99px;background:rgba(251,113,133,.18);color:#fecdd3;font-size:11.5px;font-weight:800;display:inline-grid;place-items:center}
.plat-n:empty{display:none}
.cf .capa,.card .capa{position:relative}
.cf-fav{position:absolute;right:8px;bottom:8px;z-index:3;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:rgba(11,6,20,.62);color:#fff;font-size:15px;cursor:pointer;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);transition:transform .15s,background .15s}
.cf-fav:hover{transform:scale(1.08);background:rgba(11,6,20,.82)}
.cf-fav:focus-visible{outline:2px solid #fb7185;outline-offset:2px}
.cf-fav.on{color:#fb7185;background:rgba(255,255,255,.92)}
.cf-fav.on i{animation:favPulo .35s ease}
@keyframes favPulo{0%{transform:scale(.6)}60%{transform:scale(1.25)}100%{transform:scale(1)}}
@media (prefers-reduced-motion:reduce){.cf-fav.on i{animation:none}}
@media (max-width:600px){.cf-fav{width:30px;height:30px;font-size:13.5px;right:6px;bottom:6px}}
.fav-vazio{display:flex;flex-direction:column;align-items:center;gap:8px;grid-column:1/-1}
.fav-vazio > i{font-size:34px;color:#fb7185}
.fav-vazio b{color:var(--txt);font-size:16px}
.pz-fav-btn i{color:#fb7185}
.pz-toast{position:fixed;left:50%;bottom:22px;z-index:9999;transform:translate(-50%,20px);opacity:0;pointer-events:none;display:flex;align-items:center;gap:10px;max-width:calc(100vw - 32px);padding:11px 16px;border-radius:99px;background:#1a1128;border:1px solid rgba(255,255,255,.12);color:#fff;font-size:14px;font-weight:600;box-shadow:0 10px 30px rgba(0,0,0,.45);transition:opacity .2s,transform .2s}
.pz-toast.on{opacity:1;transform:translate(-50%,0);pointer-events:auto}
.pz-toast i{color:#fb7185}
.pz-toast a{color:#f0abfc;text-decoration:underline}
.pz-acao{flex-wrap:wrap;gap:10px}
.pz-acao .pz-fav-btn{min-width:0}
.pz-fav-btn[aria-pressed="true"]{border-color:rgba(251,113,133,.55);background:rgba(251,113,133,.12)}
.fav-pag{padding-top:22px;padding-bottom:40px}
.fav-cab h1{display:flex;align-items:center;gap:10px;font-size:26px;margin:0}
.fav-cab h1 i{color:#fb7185}
.fav-sub{color:var(--txt3);margin:6px 0 0;font-size:14.5px}
.fav-barra[hidden]{display:none}
.fav-barra{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:16px}
.fav-barra .campo{flex:1;min-width:220px;display:flex;align-items:center;gap:10px;height:42px;padding:0 14px;border-radius:12px;border:1px solid var(--linha);background:var(--card)}
.fav-barra .campo i{color:var(--txt3);flex:none}
.fav-barra .campo input{flex:1;min-width:0;height:100%;border:0;background:none;color:var(--txt);font:inherit;outline:none}
.fav-grade .cf{content-visibility:visible}
.fav-grade .cf h3{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-align:center;height:2.6em;margin:7px 4px 0}
.fav-grade .capa img{display:block;width:100%;height:auto}
.fav-vazio span{max-width:440px;line-height:1.5}
.fav-vazio .btn{margin-top:8px}
/* Galeria de artes reais do prompt (27/09/2026) */
.gal{margin:22px 0 6px}
.gal h2{display:flex;align-items:center;gap:9px;font-size:17px;margin:0 0 12px}
.gal h2 i{color:#c084fc}
.gal-grade{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.gal-it{padding:0;border:0;background:#1a1228;border-radius:12px;overflow:hidden;cursor:zoom-in;aspect-ratio:1;display:block}
.gal-it img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .25s}
.gal-it:hover img{transform:scale(1.05)}
.gal-vis{position:fixed;inset:0;z-index:9999;background:rgba(8,5,14,.94);display:flex;align-items:center;justify-content:center;padding:56px 64px}
.gal-vis[hidden]{display:none}
.gal-vis img{max-width:100%;max-height:100%;object-fit:contain;border-radius:10px;box-shadow:0 20px 60px rgba(0,0,0,.6)}
.gal-x,.gal-seta{position:absolute;display:grid;place-items:center;border:0;border-radius:50%;background:rgba(255,255,255,.12);color:#fff;cursor:pointer;width:44px;height:44px;font-size:18px}
.gal-x:hover,.gal-seta:hover{background:rgba(255,255,255,.22)}
.gal-x{top:12px;right:12px}
.gal-seta{top:50%;transform:translateY(-50%)}
.gal-seta.ant{left:12px}.gal-seta.prox{right:12px}
.gal-cont{position:absolute;bottom:16px;left:50%;transform:translateX(-50%);color:#e9dcff;font-size:13px;font-weight:600;background:rgba(0,0,0,.35);padding:4px 12px;border-radius:999px}
@media(max-width:900px){.gal-grade{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:560px){.gal-grade{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.gal-vis{padding:56px 8px}.gal-seta{width:38px;height:38px;background:rgba(0,0,0,.45)}}
/* Ferramentas visíveis, travadas pra quem não assina (28/09/2026). Menu: selo "Premium" com cadeado. */
.u-cad{display:inline-flex;align-items:center;gap:5px;font-style:normal;font-size:11px;font-weight:700;color:#fcd34d;letter-spacing:.02em}
.u-cad i{width:auto!important;color:inherit!important;font-size:10px}
.u-it.u-trava{opacity:.92}
/* Ateliê de design na biblioteca: só logado; o cadeado some pro assinante (html.assinante / .pz-premium). */
.atelie{display:none;margin:18px 0 4px;padding:12px 14px;border-radius:16px;background:linear-gradient(135deg,rgba(153,37,211,.14),rgba(109,40,217,.06));border:1px solid rgba(192,132,252,.28)}
.pz-logado .atelie{display:block}
.atelie-cab{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.atelie-cab b{display:inline-flex;align-items:center;gap:8px;font-size:14.5px}
.atelie-cab b i{color:var(--roxo2)}
.atelie-sel{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:#fcd34d}
.atelie-lista{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 -2px;padding:0 2px 2px}
.atelie-lista::-webkit-scrollbar{display:none}
.atelie-it{flex:none;display:inline-flex;align-items:center;gap:8px;padding:9px 12px;border-radius:12px;background:var(--card);border:1px solid var(--linha);color:var(--txt);text-decoration:none;font-size:13px;font-weight:600;white-space:nowrap;transition:border-color .15s}
.atelie-it:hover{border-color:rgba(192,132,252,.5)}
.atelie-it>i:first-child{color:var(--roxo2)}
.atelie-it .cad{font-size:11px;color:#fcd34d}
html.assinante .atelie-sel,html.assinante .atelie-it .cad,.pz-premium .atelie-sel,.pz-premium .atelie-it .cad{display:none}
/* Cadeado do logado grátis (28/09/2026): preço por mês + "Quero ser Premium" + grátis parecidos */
.cadeado.cad-lead{background:linear-gradient(180deg,rgba(255,210,63,.13),rgba(153,37,211,.08) 60%,transparent);border-color:rgba(255,210,63,.45)}
.cadeado.cad-lead .pz-coroa{color:#ffd23f}
.cadeado.cad-lead p{font-size:14.5px}
.cadeado .cad-preco{color:#ffd23f;font-size:16px}
.cadeado .cad-bt{display:inline-flex;align-items:center;gap:8px;background:#ffd23f;color:#3d0a5c;border-color:#ffd23f}
.cadeado .cad-bt:hover{filter:brightness(1.05)}
.cad-gratis{margin-top:18px;text-align:left}
.cad-gratis-t{font-size:13px;color:var(--txt2);margin-bottom:8px;text-align:center}
.cad-gratis-l{display:grid;gap:8px}
.cad-gratis-l a{display:flex;align-items:center;gap:10px;padding:7px 10px 7px 7px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);color:inherit;text-decoration:none;min-width:0}
.cad-gratis-l a:hover{border-color:rgba(134,239,172,.45)}
.cad-gratis-l img{width:48px;height:48px;border-radius:9px;object-fit:cover;flex:none}
.cad-gratis-l span{flex:1;min-width:0;font-size:13.5px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.cad-gratis-l .chip{flex:none;font-style:normal}
/* "Comece por aqui" (28/09/2026): janela de boas-vindas depois do cadastro (js/pg/prompts-comece.js) */
.pzc-bg{position:fixed;inset:0;z-index:1000;background:rgba(6,3,12,.72);display:flex;align-items:center;justify-content:center;padding:16px;animation:pzcIn .2s ease}
.pzc{position:relative;width:min(760px,100%);max-height:calc(100vh - 32px);overflow:auto;background:#150d24;border:1px solid rgba(192,132,252,.3);border-radius:20px;padding:22px 20px 18px;box-shadow:0 24px 70px rgba(0,0,0,.55)}
.pzc-x{position:absolute;top:14px;right:14px;width:34px;height:34px;border-radius:50%;border:0;background:rgba(255,255,255,.1);color:#fff;cursor:pointer;display:grid;place-items:center}
.pzc h2{margin:0 44px 4px 0;font-size:21px;line-height:1.25}
.pzc h2 b{color:#ffd23f}
.pzc-sub{color:var(--txt2);font-size:14px;margin:0 0 16px}
.pzc-grade{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.pzc-card{display:flex;flex-direction:column;min-width:0;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:14px;overflow:hidden}
.pzc-card img{width:100%;aspect-ratio:1;object-fit:cover;display:block;background:#221533}
.pzc-card .t{font-size:13px;font-weight:600;padding:8px 10px 6px;line-height:1.3;min-height:3.9em;overflow:hidden;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}
.pzc-card .b{display:flex;gap:6px;padding:0 8px 10px;margin-top:auto}
.pzc-card .b .btn{flex:1 1 0;min-width:0;justify-content:center;padding:8px 6px;font-size:12.5px;display:inline-flex;align-items:center;gap:6px}
/* "Ver" no tamanho do conteúdo; o botão principal ("Personalizar" é longo) encolhe com reticências (28/09/2026). */
.pzc-card .b .btn + .btn{flex:0 0 auto;padding:8px 10px}
.pzc-card .b .btn span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pzc-rod{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:16px}
.pzc-rod small{color:var(--txt2);font-size:13px;display:inline-flex;align-items:center;gap:6px}
.pzc-rod small i{color:#f472b6}
@keyframes pzcIn{from{opacity:0}to{opacity:1}}
@media (max-width:700px){.pzc-grade{grid-template-columns:repeat(2,minmax(0,1fr))}.pzc-card .b{flex-direction:column}.pzc{padding:18px 14px 14px}.pzc h2{font-size:18px}.pzc-rod .btn{width:100%;justify-content:center}}
@media (prefers-reduced-motion:reduce){.pzc-bg{animation:none}}