/* Modelo Viral — identidade visual (a mesma do portal e do Personagem Pro).
   Só aparência: carregado por último, não muda estrutura, textos nem comportamento.
   Plum #161823 (contorno), violeta #FE2C55, lima #25F4EE, amarelo #FFC21A; bordas grossas e sombra "pop". */
:root{
  --paper:#F7FEFE;--cream:#E6FCFB;--cream-2:#C6F6F4;--sky:#FFE6EC;
  --plum:#161823;--plum-2:#2A2C3A;--violet:#FE2C55;--violet-d:#D61E44;--violet-l:#FF8FA6;
  --lime:#25F4EE;--lime-2:#8FFAF6;--sun:#FFC21A;--ink:#161823;--muted:#5E6170;--red:#E0245E;
  --pop:0 6px 0 var(--plum);--pop-sm:0 4px 0 var(--plum);
  --f-display:"Shrikhand","Cooper Black",Georgia,serif;
  --f-body:"Bricolage Grotesque",system-ui,-apple-system,"Segoe UI",sans-serif;
  /* variáveis do tema anterior apontando para a nova paleta */
  --bg:var(--paper);--panel:#fff;--panel2:var(--paper);--line:rgba(22,24,35,.16);--line2:rgba(22,24,35,.16);
  --txt:var(--ink);--mut:var(--muted);--lime-ink:var(--plum);--r:16px;
}

html,body{background:var(--paper)!important;color:var(--ink);font-family:var(--f-body)!important}
body{font-size:16px}
.glow{background:radial-gradient(50% 35% at 85% 0%,rgba(254,44,85,.10),transparent 70%),radial-gradient(40% 30% at 0% 100%,rgba(37,244,238,.10),transparent 70%)!important}
h1,h2,h3,h4{color:var(--plum);letter-spacing:-.01em}
h1 em,h2 em,h3 em{font-family:var(--f-display);font-style:normal;font-weight:400;color:var(--violet)}
::selection{background:var(--lime);color:var(--plum)}
:focus-visible{outline:3px solid var(--violet)!important;outline-offset:3px}

/* ---------- Botões ---------- */
.btn,.viral-start{font-family:var(--f-body);font-weight:800;border:3px solid var(--plum)!important;border-radius:999px!important;
  background:var(--lime)!important;color:var(--plum)!important;box-shadow:var(--pop-sm)!important;transition:transform .15s,box-shadow .15s}
.btn:hover,.viral-start:hover{transform:translateY(-2px);box-shadow:var(--pop)!important}
.btn:active,.viral-start:active{transform:translateY(3px);box-shadow:0 1px 0 var(--plum)!important}
.btn[disabled]{opacity:.55;transform:none;box-shadow:var(--pop-sm)!important}
.btn.ghost,.btn.share{background:#fff!important;color:var(--plum)!important}
.btn.sm{padding:8px 14px;font-size:14px}
.header-help,.checkout-back,.text-action,.link{font-family:var(--f-body);font-weight:800;color:var(--plum)!important}
.header-help{border:2.5px solid var(--plum)!important;border-radius:999px!important;background:#fff!important;box-shadow:0 3px 0 var(--plum);padding:7px 14px}
.header-help:hover{background:var(--cream)!important}

/* ---------- Topo e lateral ---------- */
.app-header{background:var(--plum)!important;border-bottom:0!important;color:#fff}
.app-header-caption{color:#C9B8E6!important;font-weight:700}
.app-sidebar{background:#fff!important;border-right:3px solid var(--plum)!important}
.sidebar-label{color:var(--muted)!important;font-weight:800;letter-spacing:.12em}
.sidebar-item{border-radius:14px!important;color:var(--plum)!important;font-weight:800}
.sidebar-item.active,.sidebar-item:hover{background:var(--violet)!important;color:#fff!important;box-shadow:0 3px 0 var(--plum)}
.sidebar-item small{background:var(--lime);color:var(--plum);border:2px solid var(--plum);border-radius:999px;font-weight:800}
.sidebar-bottom{border:2.5px solid var(--plum)!important;border-radius:16px!important;background:var(--cream)!important;box-shadow:0 3px 0 var(--plum)}
.sidebar-status{background:var(--lime)!important;box-shadow:0 0 0 3px rgba(37,244,238,.35)!important}

/* ---------- Abertura ---------- */
.viral-intro{background:#fff!important;border:3px solid var(--plum)!important;border-radius:28px!important;box-shadow:var(--pop)!important;overflow:hidden}
.viral-ticker{background:var(--plum)!important;color:var(--lime)!important;font-weight:800;letter-spacing:.12em;border-bottom:3px solid var(--plum)}
.viral-intro h2{font-family:var(--f-body);font-weight:800;color:var(--plum)!important;line-height:1.05}
.viral-intro h2 em{font-family:var(--f-display)!important;color:var(--violet)!important}
.viral-intro p{color:var(--muted)!important}
.viral-eyebrow{border:2.5px solid var(--plum)!important;background:#fff!important;color:var(--plum)!important;border-radius:999px!important;font-weight:800;box-shadow:0 3px 0 var(--plum)}
.viral-eyebrow i{background:var(--lime)!important;border:2px solid var(--plum)}
.viral-benefits span{border:2.5px solid var(--plum)!important;border-radius:999px!important;background:var(--cream)!important;color:var(--plum)!important;font-weight:800}
.viral-faces img{border:3px solid var(--plum)!important;box-shadow:var(--pop-sm)!important;background:var(--sun)}

/* ---------- Estúdio ---------- */
.workspace-breadcrumb{color:var(--muted)!important;font-weight:700}
.workspace-heading h1{font-family:var(--f-body);font-weight:800;color:var(--plum)!important}
.card,.review-panel{background:#fff!important;border:3px solid var(--plum)!important;border-radius:24px!important;box-shadow:var(--pop)!important}
.card .hint,.hint,.sub,.fine,.price-line,.review-note{color:var(--muted)!important}
.who-h b,.review-heading h2,.card h2{color:var(--plum)!important}
.who-h span,.review-heading span{background:var(--cream);color:var(--plum);border:2px solid var(--plum);border-radius:999px;padding:2px 10px;font-weight:800;font-size:12px}
.slot,.reference-callout,.avatar-upload-slot{border:2.5px dashed var(--plum)!important;border-radius:18px!important;background:var(--paper)!important}
.slot:hover,.reference-callout:hover{background:var(--cream)!important}
.slot.has{border-style:solid!important;background:rgba(37,244,238,.14)!important}
.video-upload-icon,.reference-callout-icon,.num{background:var(--lime)!important;color:var(--plum)!important;border:2.5px solid var(--plum)!important;box-shadow:0 3px 0 var(--plum)}
.tabs{background:var(--cream)!important;border:2.5px solid var(--plum)!important;border-radius:999px!important;padding:4px}
.tabs{display:flex!important;gap:4px}
.tab{flex:1 1 0;display:flex;align-items:center;justify-content:center;min-height:42px;padding:8px 14px!important;border:0!important;border-radius:999px!important;background:transparent!important;color:var(--plum)!important;font-weight:800;line-height:1.2}
.tab.on{background:var(--violet)!important;color:#fff!important;box-shadow:0 3px 0 var(--plum)}
.inp,.search-influencer,.copy .inp{border:2.5px solid var(--plum)!important;border-radius:14px!important;background:var(--paper)!important;color:var(--ink)!important;font-family:var(--f-body)}
.inp:focus,.search-influencer:focus-within{border-color:var(--violet)!important;box-shadow:0 0 0 4px rgba(254,44,85,.22)!important;outline:none}
label.f,.f{color:var(--plum)!important;font-weight:800}
.filter-row button{border:2.5px solid var(--plum)!important;border-radius:999px!important;background:#fff!important;color:var(--plum)!important;font-weight:800}
.filter-row button.on,.filter-row button[aria-pressed="true"]{background:var(--plum)!important;color:var(--lime)!important}
.gal button{border:3px solid var(--plum)!important;border-radius:18px!important;box-shadow:var(--pop-sm)!important;background:#fff!important;overflow:hidden}
.gal button.on{outline:4px solid var(--lime);outline-offset:-2px}
.gal button span{color:var(--plum)!important;font-weight:800}
.card-check,.selected-check{background:var(--lime)!important;color:var(--plum)!important;border:2.5px solid var(--plum)}
.selected-influencer,.review-avatar,.project-result{border:2.5px solid var(--plum)!important;border-radius:18px!important;background:var(--cream)!important}
.review-video{border:2.5px solid var(--plum)!important;border-radius:18px!important;background:var(--paper)!important}
.review-details div{border-bottom:1px dashed var(--line)!important}
.err,.account-error,#paymentError{color:var(--red)!important;font-weight:700}
.workspace-footer{color:var(--muted)!important;font-weight:700;border-top:2px dashed var(--line)}
.legal-links a{color:var(--plum)!important;font-weight:800}

/* ---------- Janela (tutorial, pagamento, conta) ---------- */
.modal{background:rgba(20,8,36,.6)!important;backdrop-filter:blur(4px)}
.modal .box{background:#fff!important;border:3px solid var(--plum)!important;border-radius:28px!important;box-shadow:0 10px 0 var(--plum)!important}
.modal h2{font-family:var(--f-body);font-weight:800;color:var(--plum)!important}
.x{border:2.5px solid var(--plum)!important;border-radius:12px!important;background:#fff!important;color:var(--plum)!important;box-shadow:0 3px 0 var(--plum)}
.tut .n{background:var(--lime)!important;color:var(--plum)!important;border:3px solid var(--plum)!important;box-shadow:0 3px 0 var(--plum);font-family:var(--f-display)}
.tut h3{font-family:var(--f-body);font-weight:800}
.dots i{background:var(--cream-2)!important;border-radius:999px}
.dots i.on{background:var(--violet)!important}
.tut-video .tv-box,.tut-video img,.pv{border:3px solid var(--plum)!important;border-radius:20px!important;box-shadow:var(--pop-sm)!important;overflow:hidden}
.tl-list b{background:var(--lime)!important;color:var(--plum)!important;border:2px solid var(--plum)}
.checkout-eyebrow{color:var(--violet)!important;font-weight:800;letter-spacing:.12em}
.checkout-total{border:2.5px solid var(--plum)!important;border-radius:16px!important;background:var(--cream)!important}
.checkout-total strong,.amt,.price{font-family:var(--f-display);font-weight:400;color:var(--violet)!important}
.unlock-benefits li::before{color:var(--violet)!important}
.qr{border:3px solid var(--plum)!important;border-radius:18px!important;background:#fff!important;box-shadow:var(--pop-sm)}
.bar{background:var(--cream)!important;border:2px solid var(--plum);border-radius:999px;overflow:hidden}
.bar i,#genBar,#tgBar{background:var(--violet)!important}
.spin{border-color:var(--cream-2)!important;border-top-color:var(--violet)!important}
.wait{color:var(--plum)!important;font-weight:700}
.up{border:2.5px solid var(--plum)!important;border-radius:18px!important;background:var(--cream)!important}
.library-item{border:2.5px solid var(--plum)!important;border-radius:16px!important;background:#fff!important;box-shadow:0 3px 0 var(--plum)}
.demo-bar{background:var(--sun)!important;color:var(--plum)!important;border-bottom:3px solid var(--plum)!important}
.reference-callout b,.reference-callout span b{color:var(--plum)!important}
.reference-callout small{color:var(--muted)!important}
.reference-callout i{color:var(--plum)!important}
.price-line b,.configured-price{color:var(--violet)!important;font-weight:800}
.count,#galCount{border:2px solid var(--plum)!important;border-radius:999px!important;background:#fff!important;color:var(--plum)!important;font-weight:800}

/* O tema anterior usava o verde-limão como cor de TEXTO (ilegível no fundo claro).
   Texto de destaque passa a ser violeta; o limão fica só como fundo de botões e selos. */
h1 em,.link:hover,.ficha b,.chipset button.on,.price-line b,.configured-price,.tl-list em,.amt,.text-action,.section-number,
.game-progress-label b,.game-section-title>span,.upload-avatar-symbol,#removeReference,.reference-set-count,
.reference-view-card:first-child .reference-view-top>small,.reference-added,.reference-file-row>button,.adj summary::after,
.app-brand svg,.chips li::before,.project-result button{color:var(--violet)!important}
.price-line b,.configured-price{font-weight:800;font-family:var(--f-body)!important}
.header-help:hover{color:var(--plum)!important}
.gal button.on span{color:var(--plum)!important}
.selected-check,.tl-list li b{color:var(--plum)!important}
.project-result button{border:2.5px solid var(--plum);border-radius:999px;background:#fff;font-weight:800;padding:6px 14px}

/* ---------- Entrar e criar senha: igual aos logins do portal ---------- */
.modal-logo{display:block;width:150px;height:auto;margin:0 auto 6px}
.st[data-s="login"],.st[data-s="account"]{text-align:left}
.st[data-s="login"] h2,.st[data-s="account"] h2,.st[data-s="login"] .sub,.st[data-s="account"] .sub,.st[data-s="account"] .checkout-eyebrow{text-align:center}
.st[data-s="login"] h2,.st[data-s="account"] h2{font-size:clamp(26px,5vw,32px);margin:4px 0 4px}
.st[data-s="login"] h2 em,.st[data-s="account"] h2 em{font-family:var(--f-display)!important;font-weight:400;color:var(--violet)!important}
.st[data-s="login"] .sub,.st[data-s="account"] .sub{margin-bottom:18px}
.st[data-s="login"] form,.st[data-s="account"] form{display:grid;gap:6px;text-align:left}
.st[data-s="login"] label.f,.st[data-s="account"] label.f{display:block;text-align:left;font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--plum)!important;margin-top:6px}
.st[data-s="login"] .inp,.st[data-s="account"] .inp{width:100%;font-size:16px;padding:13px 14px;border-radius:14px!important}
.st[data-s="login"] .btn,.st[data-s="account"] .btn{width:100%;margin-top:12px;font-size:17px;padding:14px 22px}
.st[data-s="account"] .fine{text-align:left}

/* ---------- Prévia e pagamento ---------- */
.checkout-total{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px!important}
.checkout-total span{color:var(--plum)!important;font-weight:800}
.checkout-total strong{font-size:clamp(24px,5vw,30px);line-height:1}
.pv .lock{color:var(--plum)!important;font-weight:800}
.pv .lock span{color:var(--plum)!important;opacity:.85;font-weight:700}
.unlock-benefits li{color:var(--plum)}
.account-error:empty{display:none}
.account-error{margin:6px 0 0}

/* ---------- Janela: cabe na tela sem rolar, X dentro do cartão, botões alinhados ---------- */
.modal{padding:16px!important;align-items:center!important}
.modal .box{position:relative;width:min(460px,100%)!important;max-height:calc(100dvh - 32px)!important;overflow:auto;padding:30px 24px 22px!important;scrollbar-width:thin}
.modal .x{position:absolute!important;top:14px!important;right:14px!important;z-index:3;width:40px;height:40px;display:grid;place-items:center;font-size:18px;line-height:1}
.modal h2{margin:0 44px 6px!important;font-size:clamp(22px,4.5vw,28px);line-height:1.15;text-align:center}
.modal .sub{margin-bottom:12px}

/* Como funciona */
.st[data-s="tut"]{display:none;flex-direction:column;align-items:center;gap:10px;text-align:center}
.st[data-s="tut"].on{display:flex}
.tut,.tut>div{display:flex;flex-direction:column;align-items:center;gap:6px}
.tut .n{width:42px;height:42px;display:grid;place-items:center;border-radius:12px!important;font-size:20px;margin:0!important}
.tut h3{margin:2px 0 0!important;font-size:20px}
.tut p{margin:0!important;color:var(--muted)!important;max-width:34ch}
.dots{display:flex;gap:6px;justify-content:center;margin:2px 0!important}
.dots i{width:28px;height:5px}
.tut-video,.tut-lock{margin:0!important;display:flex;flex-direction:column;align-items:center;gap:6px}
.tut-video .tv-box{height:min(34vh,280px)!important;aspect-ratio:9/16;width:auto!important;margin:0 auto}
.tut-video .tv-box video,.tut-video img{width:100%;height:100%;object-fit:cover;display:block}
.tut-video img{height:min(34vh,280px)!important;width:auto!important;aspect-ratio:3/4}
.tut-video figcaption,.tut-video figcaption+*{font-size:13px;color:var(--muted);white-space:nowrap}
.tut-lock{padding:12px!important;gap:10px!important}
.tut-lock .tl-thumb{height:min(13vh,96px)!important;aspect-ratio:9/16;width:auto!important;margin:0 auto}
.tl-list{gap:6px!important;margin:0!important}
.tl-list li{font-size:14px;line-height:1.3}
.tg-steps{gap:4px!important;margin:0!important}
.st[data-s="tut"] .row{display:grid!important;grid-template-columns:1fr 1fr;gap:10px;width:100%;margin-top:6px}
.st[data-s="tut"] .row .btn{width:100%;margin:0!important}
.st[data-s="tut"] .row:has(#tutPrev[style*="hidden"]){grid-template-columns:1fr}
#tutPrev[style*="hidden"]{display:none!important}

/* Confira seu projeto */
.st[data-s="ready"] .pv{height:min(48vh,400px)!important;margin:6px 0 14px!important}
.st[data-s="ready"] .unlock-benefits h3{font-size:18px;margin:0 0 6px}
.st[data-s="ready"] .unlock-benefits ul{display:flex;flex-wrap:wrap;gap:4px 16px;margin:0 0 12px}
.st[data-s="ready"] .checkout-total{margin:0 0 12px!important}
.st[data-s="ready"] .btn,.st[data-s="payer"] .btn,.st[data-s="pix"] .btn{width:100%}
.st[data-s="ready"] .fine{text-align:center;margin-top:8px}
.st[data-s="ready"] .pv{width:100%!important;max-width:none!important}
/* Pix: código copia e cola + botão Copiar na mesma linha; QR em fundo branco */
.st[data-s="pix"] .copy{display:flex!important;gap:8px;align-items:stretch;margin-bottom:12px}
.st[data-s="pix"] .copy .inp{flex:1 1 auto;min-width:0;font-size:14px;text-overflow:ellipsis}
.st[data-s="pix"] .copy .btn{width:auto!important;flex:none;padding:10px 18px;font-size:15px}
.st[data-s="pix"] .qr{display:grid;place-items:center;padding:14px!important;width:max-content;max-width:100%;margin:6px auto 12px!important;background:#fff!important}
.st[data-s="pix"] .qr *{background:#fff!important}
.st[data-s="pix"] .qr img,.st[data-s="pix"] .qr canvas{display:block;width:min(200px,60vw)!important;height:auto!important}
.st[data-s="pix"] label.f{display:block;text-align:left;font-size:13px;text-transform:uppercase;letter-spacing:.06em}

/* ---------- Pagamento: igual ao Pix do nosso sistema ---------- */
.st[data-s="payer"],.st[data-s="pix"]{text-align:left}
.st[data-s="payer"] h2,.st[data-s="pix"] h2{text-align:left;margin:4px 44px 6px 0!important;font-size:clamp(26px,4vw,34px)}
.st[data-s="payer"] .checkout-eyebrow,.st[data-s="pix"] .checkout-eyebrow{text-align:left;font-size:12px}
.st[data-s="payer"] .sub,.st[data-s="pix"] .sub{text-align:left;color:var(--muted)!important;font-weight:600;margin-bottom:16px}
.st[data-s="payer"] label.f{display:block;font-size:13px;text-transform:uppercase;letter-spacing:.06em;margin:10px 0 6px}
.st[data-s="payer"] .inp{width:100%}
.st[data-s="payer"] .btn{margin-top:14px}
.st[data-s="payer"] .checkout-back,.st[data-s="pix"] .checkout-back{display:block;margin:12px auto 0;background:none;border:0;text-decoration:underline;text-underline-offset:3px}
.st[data-s="payer"] .fine,.st[data-s="pix"] .fine{text-align:center;font-size:13px;margin-top:10px}
.st[data-s="pix"] .qr{width:240px!important;height:240px!important;padding:8px!important;border:3px solid var(--plum)!important;border-radius:18px!important;box-shadow:var(--pop-sm)!important;margin:4px auto 14px!important;overflow:hidden}
.st[data-s="pix"] .qr img,.st[data-s="pix"] .qr canvas{width:100%!important;height:100%!important}
.st[data-s="pix"] .checkout-total{margin:0 0 12px!important}
.st[data-s="pix"] label.f{margin:0 0 6px}
.st[data-s="pix"] .copy{flex-direction:column;gap:10px!important}
.st[data-s="pix"] .copy .inp{width:100%;font-size:13px;color:var(--muted)!important}
.st[data-s="pix"] .copy .btn{width:100%!important;padding:14px 22px;font-size:17px}
.st[data-s="pix"] #checkPaymentBtn{background:#fff!important;color:var(--plum)!important;width:100%}
.st[data-s="pix"] .wait{display:flex;align-items:center;justify-content:center;gap:8px;margin:14px 0 0;font-size:14px;text-align:center}
.st[data-s="pix"] .wait::before{content:"";flex:none;width:10px;height:10px;border-radius:50%;background:var(--lime);border:2px solid var(--plum);animation:pxblink 1.2s ease-in-out infinite}
@keyframes pxblink{50%{opacity:.25}}
@media (prefers-reduced-motion:reduce){.st[data-s="pix"] .wait::before{animation:none}}
.st[data-s="payer"] .sub,.st[data-s="pix"] .sub{margin-left:0!important;margin-right:0!important;max-width:none!important}
.st[data-s="pix"] #checkPaymentBtn{padding:14px 22px;font-size:17px;margin-top:2px}
/* Entrar / criar senha: espaçamento compacto (rótulo colado no campo) */
.st[data-s="login"] form,.st[data-s="account"] form{gap:0!important}
.st[data-s="login"] label.f,.st[data-s="account"] label.f{margin:14px 0 6px!important;line-height:1.2}
.st[data-s="login"] label.f:first-of-type,.st[data-s="account"] label.f:first-of-type{margin-top:0!important}
.st[data-s="login"] .inp,.st[data-s="account"] .inp{margin:0!important;padding:12px 14px!important}
.st[data-s="login"] .sub,.st[data-s="account"] .sub{margin:0 0 16px!important;line-height:1.4}
.st[data-s="login"] h2,.st[data-s="account"] h2{margin:2px 44px 4px!important}
.st[data-s="account"] .checkout-eyebrow{margin:0 0 2px}
.st[data-s="account"] .fine{margin:8px 0 0!important;line-height:1.4}
.st[data-s="login"] .btn,.st[data-s="account"] .btn{margin-top:16px!important}
.modal-logo{margin-bottom:4px}
/* Todos os formulários: rótulo colado no campo, respiro só entre campos */
#payerFields{background:none!important;border:0!important;padding:0!important;margin:0!important}
.st[data-s="payer"] label.f,.delivery-section label.f{display:block;margin:14px 0 6px!important;line-height:1.2;font-size:13px;text-transform:uppercase;letter-spacing:.06em}
.st[data-s="payer"] #payerFields label.f:first-child{margin-top:4px!important}
.st[data-s="payer"] .inp,.delivery-section .inp{margin:0!important;padding:12px 14px!important}
.st[data-s="payer"] #payerFields .fine{text-align:left;margin:8px 0 0!important}
.delivery-section .btn{margin-top:14px!important}
/* Topo: logo à esquerda, botões juntos à direita, mesma altura */
.app-header{display:flex!important;align-items:center!important;gap:10px!important;min-height:64px;padding:8px 20px!important}
.app-header .app-brand{margin-right:auto;display:flex;align-items:center}
.app-header .app-brand img{height:46px;width:auto}
.app-header-caption{margin-right:auto}
.app-header .app-brand + .app-header-caption{margin-left:-6px}
.app-header .header-help{display:inline-flex!important;align-items:center;justify-content:center;gap:6px;height:40px;padding:0 16px!important;margin:0!important;background:#fff!important;color:var(--plum)!important;font-size:14px;white-space:nowrap}
.app-header .header-help:hover{background:var(--lime)!important}
@media (max-width:520px){.app-header{padding:8px 12px!important;gap:6px!important}.app-header .app-brand img{height:38px}.app-header .header-help{height:36px;padding:0 11px!important;font-size:13px}}
.tab::after,.tab.on::after{display:none!important}
/* Topo (tela larga): legenda logo depois do logo, com separador discreto */
.app-header .app-brand{margin-right:0!important}
.app-header-caption{margin:0 auto 0 14px!important;padding:2px 0 2px 14px!important;border-left:2px solid rgba(255,255,255,.18)!important;color:#C9B8E6!important;font-size:14px;line-height:1.2}
.app-header-caption::before,.app-header-caption::after{display:none!important}
/* Lateral: quadro "Um vídeo por vez" com pontinho alinhado ao texto */
.sidebar-bottom{display:flex!important;align-items:center!important;gap:10px!important;padding:12px 14px!important;margin:0 12px 14px!important}
.sidebar-bottom .sidebar-status{flex:none;position:static!important;width:10px!important;height:10px!important;margin:0!important;border-radius:50%;border:2px solid var(--plum);box-shadow:none!important}
.sidebar-bottom b{display:block;color:var(--plum)!important;font-size:14px;line-height:1.25}
.sidebar-bottom p{margin:2px 0 0!important;color:var(--muted)!important;font-size:12.5px;line-height:1.3}
/* Seletor de abas: aba ativa sem sombra vazando (fica toda dentro do seletor) */
.tabs{padding:5px!important;align-items:stretch}
.tab.on{box-shadow:none!important;border:2px solid var(--plum)!important}
.tab{border:2px solid transparent!important}
.sidebar-bottom{margin:auto 12px 14px!important;box-sizing:border-box;max-width:calc(100% - 24px)}
@media (max-width:980px){.sidebar-bottom{display:none!important}}
.app-header-caption{margin-right:0!important}
.app-header #accountBtn{margin-left:auto!important}

/* ---------- Fale com a gente (igual ao Personagem Pro) ---------- */
.help-modal{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:16px;background:rgba(20,8,36,.6);backdrop-filter:blur(4px)}
.help-card{position:relative;width:min(460px,100%);max-height:calc(100dvh - 32px);overflow:auto;background:#fff;border:3px solid var(--plum);border-radius:28px;box-shadow:0 10px 0 var(--plum);padding:clamp(22px,4vw,30px);text-align:left;animation:helpIn .35s cubic-bezier(.34,1.56,.64,1) both}
.help-card h2{font-family:var(--f-body);font-weight:800;font-size:clamp(24px,4vw,30px);color:var(--plum);margin:0 40px 4px 0;line-height:1.1}
.help-card h2 em{font-family:var(--f-display);font-weight:400;font-style:normal;color:var(--violet)}
.help-lead{color:var(--muted);font-weight:600;margin:0 0 16px}
.help-field{display:grid;gap:6px;margin-bottom:12px}
.help-field label,.help-label{font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--plum)}
.help-card .inp{width:100%;margin:0!important;padding:12px 14px!important;font-size:16px}
.help-card textarea.inp{min-height:110px;resize:vertical;font-family:var(--f-body)}
.help-chips{display:flex;flex-wrap:wrap;gap:8px}
.help-chip{position:relative;cursor:pointer}
.help-chip input{position:absolute;opacity:0;pointer-events:none}
.help-chip span{display:inline-block;font-weight:800;font-size:14px;color:var(--plum);background:#fff;border:2.5px solid var(--plum);border-radius:999px;padding:7px 13px;transition:background .15s,transform .15s}
.help-chip:hover span{background:var(--cream)}
.help-chip input:checked + span{background:var(--lime);box-shadow:0 3px 0 var(--plum);transform:translateY(-2px)}
.help-chip input:focus-visible + span{outline:3px solid var(--violet);outline-offset:2px}
.help-err{color:var(--red);font-weight:700;font-size:14px;margin:2px 0 8px}
.help-err:empty{display:none}
.help-card .btn{width:100%;margin-top:6px}
.help-x{position:absolute;right:14px;top:14px;width:40px;height:40px;display:grid;place-items:center;border:2.5px solid var(--plum);border-radius:12px;background:#fff;color:var(--plum);font-size:22px;line-height:1;box-shadow:0 3px 0 var(--plum);cursor:pointer}
.help-trap{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.help-link{display:block;margin:10px auto 0;background:none;border:0;color:var(--violet);font:800 14px var(--f-body);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
@keyframes helpIn{from{opacity:0;transform:translateY(14px) scale(.96)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.help-card{animation:none}}

/* ---------- Tutorial: miniatura do cadeado no nosso estilo ---------- */
.tut-lock .tl-thumb{border:3px solid var(--plum)!important;border-radius:18px!important;background:var(--cream)!important;box-shadow:var(--pop-sm)!important}
.tl-ic span,.tl-ic>*:not(.spin){background:var(--lime)!important;color:var(--plum)!important;border:3px solid var(--plum)!important;border-radius:14px!important;box-shadow:0 3px 0 var(--plum)!important}
.tl-ic svg{stroke:var(--plum)!important;color:var(--plum)!important}
.tut-lock{background:#fff!important;border:2.5px solid var(--plum)!important;border-radius:20px!important}
.help-chip,.help-chip span{text-transform:none!important;letter-spacing:0!important}
.tut-lock .tl-thumb{border:0!important;background:none!important;box-shadow:none!important;height:auto!important;aspect-ratio:auto!important;width:auto!important;padding:4px 0!important}
.tut-lock .tl-thumb video{display:none!important}

/* Foco: campos de texto usam só o destaque da borda (sem contorno duplo); botões e links mantêm o contorno */
input:focus-visible,textarea:focus-visible,select:focus-visible{outline:none!important}
.search-influencer input,.search-influencer input:focus{border:0!important;background:transparent!important;box-shadow:none!important;outline:none!important;padding-left:6px}
.search-influencer:focus-within{border-color:var(--violet)!important;box-shadow:0 0 0 4px rgba(254,44,85,.22)!important}
.inp:focus,.help-card .inp:focus{border-color:var(--violet)!important;box-shadow:0 0 0 4px rgba(254,44,85,.22)!important}
.st[data-s="ready"] h2 em{font-family:var(--f-display);font-weight:400;font-style:normal;color:var(--violet)}
.pv .lock b{display:block;color:var(--plum);font-size:17px;font-weight:800}
/* Tutorial "gerando": respiro entre a lista e a barra */
.tg-body{display:flex;flex-direction:column;gap:12px}
.tg-body .bar{margin:2px 0 0!important;height:12px}
.tg-pc{margin:0!important}

/* ---------- Abertura: celular com os reels à direita ---------- */
.viral-intro{display:grid!important;grid-template-columns:minmax(0,1fr) auto;align-items:center}
.viral-intro .viral-ticker{grid-column:1/-1}
.viral-intro .viral-intro-content{margin:0!important;max-width:none!important}
.viral-reel{margin:0 34px 0 0;display:flex;flex-direction:column;align-items:center;gap:10px}
.viral-reel__phone{width:clamp(180px,20vw,240px);aspect-ratio:9/16;border:4px solid var(--plum);border-radius:30px;overflow:hidden;background:var(--plum);box-shadow:0 8px 0 var(--plum);transform:rotate(2deg)}
.viral-reel__phone video{width:100%;height:100%;object-fit:cover;display:block}
.viral-reel__dots{display:flex;gap:6px}
.viral-reel__dots i{width:22px;height:5px;border-radius:999px;background:var(--cream-2)}
.viral-reel__dots i.on{background:var(--violet)}
@media (max-width:760px){
  .viral-intro{grid-template-columns:minmax(0,1fr)}
  .viral-reel{margin:0 0 24px}
  .viral-reel__phone{width:min(220px,60vw);transform:none}
}

/* ---------- Abertura: leque com 3 celulares ---------- */
.viral-faces{display:none!important}
.viral-fan{margin:0 28px 0 0;display:flex;flex-direction:column;align-items:center;gap:14px;--w:clamp(150px,14vw,196px)}
.viral-fan__stage{position:relative;width:calc(var(--w) * 2.15);height:calc(var(--w) * 16 / 9 + 34px);perspective:900px}
.viral-fan__card{position:absolute;left:50%;top:0;width:var(--w);aspect-ratio:9/16;padding:0;border:4px solid var(--plum);border-radius:26px;overflow:hidden;background:var(--plum);box-shadow:0 7px 0 var(--plum);cursor:pointer;
  transition:transform .65s cubic-bezier(.34,1.4,.64,1),filter .4s ease,box-shadow .4s ease;will-change:transform}
.viral-fan__card video{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none}
.viral-fan__card[data-pos="center"]{z-index:3;transform:translateX(-50%) translateY(0) rotate(0deg) scale(1);cursor:default;box-shadow:0 10px 0 var(--plum)}
.viral-fan__card[data-pos="left"]{z-index:1;transform:translateX(calc(-50% - 52%)) translateY(30px) rotate(-11deg) scale(.84);filter:brightness(.82) saturate(.9)}
.viral-fan__card[data-pos="right"]{z-index:2;transform:translateX(calc(-50% + 52%)) translateY(30px) rotate(11deg) scale(.84);filter:brightness(.82) saturate(.9)}
.viral-fan__card[data-pos="left"]:hover{transform:translateX(calc(-50% - 56%)) translateY(22px) rotate(-12deg) scale(.86);filter:none}
.viral-fan__card[data-pos="right"]:hover{transform:translateX(calc(-50% + 56%)) translateY(22px) rotate(12deg) scale(.86);filter:none}
.viral-fan__card:focus-visible{outline:3px solid var(--lime)!important;outline-offset:3px}
/* O que vem para a frente sobe e assenta */
.viral-fan__card.is-rising{animation:fanRise .7s cubic-bezier(.34,1.3,.64,1)}
@keyframes fanRise{0%{transform:translateX(-50%) translateY(46px) scale(.84)}55%{transform:translateX(-50%) translateY(-22px) scale(1.05)}100%{transform:translateX(-50%) translateY(0) scale(1)}}
.viral-fan__nav{display:flex;align-items:center;gap:10px}
.viral-fan__arrow{width:36px;height:36px;display:grid;place-items:center;border:2.5px solid var(--plum);border-radius:50%;background:#fff;color:var(--plum);font:800 20px/1 var(--f-body);box-shadow:0 3px 0 var(--plum);cursor:pointer;padding:0 0 2px}
.viral-fan__arrow:hover{background:var(--lime)}
.viral-fan__dots{display:flex;gap:6px}
.viral-fan__dots button{width:22px;height:8px;padding:0;border:2px solid var(--plum);border-radius:999px;background:#fff;cursor:pointer;transition:width .3s ease,background .3s ease}
.viral-fan__dots button[aria-pressed="true"]{width:34px;background:var(--violet)}
@media (max-width:760px){
  .viral-fan{margin:0 0 26px;--w:min(160px,40vw)}
  .viral-fan__stage{width:min(100%,calc(var(--w) * 2.15))}
}
@media (prefers-reduced-motion:reduce){.viral-fan__card{transition:none}.viral-fan__card.is-rising{animation:none}}

/* ---------- Estúdio no computador: os dois quadros travam lado a lado, com a altura da tela ----------
   - Rolar de qualquer lugar da tela trava no estúdio (public/studio-scroll.js).
   - O quadro da esquerda rola por dentro: o topo sobe, a busca/filtros do catálogo grudam em cima
     e a etapa 3 (e-mail e botão) gruda embaixo. Quando acaba, a rolagem segue para a página.
   Só com as duas colunas lado a lado e altura suficiente; no celular nada muda. */
@media (min-width:761px) and (min-height:620px){
  .workspace-grid{--studio-h:calc(100vh - 100px)}
  .workspace-grid>.card,.review-panel{height:var(--studio-h);max-height:var(--studio-h)}
  .review-panel{position:sticky;top:84px!important;overflow:auto;scrollbar-width:thin}
  .workspace-grid>.card{overflow-y:auto;overscroll-behavior-y:auto;padding-bottom:0!important;scrollbar-width:thin;scrollbar-color:var(--violet) var(--cream)}
  .workspace-grid>.card::-webkit-scrollbar{width:8px}
  .workspace-grid>.card::-webkit-scrollbar-thumb{background:var(--violet);border-radius:999px}
  #paneGal .gal{max-height:none!important;overflow:visible!important}
  #paneGal .gal-tools{position:sticky;top:-24px;z-index:4;background:#fff;margin:0 -8px;padding:12px 8px 10px;border-bottom:2px dashed var(--line)}
  #paneGal .gal-tools .studio-heading{margin-bottom:8px}
  #paneGal .gal-tools .filter-row{margin:10px 0 0}
  #form>.delivery-section{position:sticky;bottom:0;z-index:4;background:#fff;margin:12px -8px 0;padding:10px 8px 12px;border-top:2px dashed var(--line);
    display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:10px;align-items:end}
  #form>.delivery-section>*{grid-column:1/-1}
  #form>.delivery-section>.who-h{margin-bottom:4px}
  #form>.delivery-section>#email{grid-column:1}
  #form>.delivery-section>#go{grid-column:2;width:auto!important;margin:0!important;white-space:nowrap;padding:12px 20px}
  #form>.delivery-section>.price-line{margin:8px 0 0;font-size:13px}
}



/* ---------- Página Meus vídeos ---------- */
body.page-videos .viral-intro,body.page-videos .workspace-heading,body.page-videos .workspace-grid{display:none!important}
.my-videos{padding:8px 0 32px}
.my-videos__head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:22px}
.my-videos__head h1{font-family:var(--f-body);font-weight:800;font-size:clamp(30px,4vw,42px);color:var(--plum);line-height:1.05;margin:2px 0 4px}
.my-videos__head h1 em{font-family:var(--f-display);font-weight:400;font-style:normal;color:var(--violet)}
.my-videos__email{color:var(--muted);font-weight:700;margin:0}
.my-videos__actions{display:flex;gap:10px;flex-wrap:wrap}
.my-videos__actions .btn{padding:11px 20px;font-size:15px}
.my-videos__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:18px}
.vcard{background:#fff;border:3px solid var(--plum);border-radius:22px;box-shadow:var(--pop);overflow:hidden;display:flex;flex-direction:column}
.vcard__media{aspect-ratio:9/12;background:var(--cream);display:grid;place-items:center;border-bottom:3px solid var(--plum);overflow:hidden}
.vcard__media video{width:100%;height:100%;object-fit:cover;display:block}
.vcard__icon{width:58px;height:58px;display:grid;place-items:center;border-radius:16px;background:#fff;border:3px solid var(--plum);box-shadow:0 3px 0 var(--plum);font-size:26px;font-weight:800;color:var(--plum)}
.vcard__body{padding:14px;display:grid;gap:8px}
.vcard__pill{justify-self:start;font-weight:800;font-size:12px;border:2px solid var(--plum);border-radius:999px;padding:3px 10px;color:var(--plum);background:var(--cream)}
.vcard__pill.is-ready{background:var(--lime)}
.vcard__pill.is-failed{background:#FFD6E3;color:var(--red);border-color:var(--red)}
.vcard__pill.is-expired{background:#eee;color:var(--muted);border-color:var(--muted)}
.vcard__date{color:var(--muted);font-weight:700}
.vcard__bar{height:8px;border-radius:999px;background:var(--cream);border:2px solid var(--plum);overflow:hidden}
.vcard__bar i{display:block;height:100%;background:var(--violet)}
.vcard__actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:2px}
.vcard__actions .btn{flex:1;padding:10px 12px;font-size:14px;text-align:center;justify-content:center}
.vcard__note{color:var(--muted);font-size:13px;margin:0}
.my-videos__empty{grid-column:1/-1;background:#fff;border:3px dashed var(--plum);border-radius:24px;padding:28px;display:grid;justify-items:start;gap:8px}
.my-videos__empty b{font-size:20px;color:var(--plum)}
.my-videos__empty p{color:var(--muted);margin:0 0 6px}
@media (max-width:520px){.my-videos__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.vcard__actions .btn{flex:1 1 100%}}
/* Página Meus vídeos: só "Meus vídeos" fica marcado no menu da esquerda */
body.page-videos .sidebar-item[data-nav]{background:none!important;color:var(--plum)!important;box-shadow:none!important}
body.page-videos .sidebar-item[data-nav]:hover{background:var(--cream)!important}
.sidebar-item svg{flex:none}
/* Meus vídeos: "Criar novo vídeo" e "Sair" na mesma linha */
.my-videos__actions{flex-wrap:nowrap!important;align-items:center}
.my-videos__actions .btn{width:auto!important;flex:none;white-space:nowrap;margin:0!important}
@media (max-width:420px){.my-videos__actions{width:100%}.my-videos__actions .btn:first-child{flex:1}}

/* ---------- Player nos lugares do site ---------- */
#donePlayer.vp{height:min(58vh,600px);aspect-ratio:9/16;width:auto;max-width:100%;margin:6px auto 14px;border:3px solid var(--plum)!important;border-radius:20px!important;box-shadow:var(--pop-sm)!important}
#workspacePlayer.vp{position:absolute;inset:0;width:100%;height:100%;border-radius:14px}
.vp video::-webkit-media-controls-enclosure{display:none!important}

/* ---------- Compartilhar (janela no estilo do TikTok) ---------- */
.share-modal{position:fixed;inset:0;z-index:210;display:grid;place-items:end center;background:rgba(20,8,36,.6);backdrop-filter:blur(4px);padding:0}
@media (min-width:600px){.share-modal{place-items:center;padding:16px}}
.share-card{position:relative;width:min(520px,100%);background:#fff;border:3px solid var(--plum);border-radius:28px 28px 0 0;box-shadow:0 -6px 0 var(--plum);padding:22px 20px calc(18px + env(safe-area-inset-bottom));animation:helpIn .3s cubic-bezier(.34,1.56,.64,1) both}
@media (min-width:600px){.share-card{border-radius:28px;box-shadow:0 10px 0 var(--plum)}}
.share-card h2{font-family:var(--f-body);font-weight:800;font-size:22px;color:var(--plum);margin:0 44px 4px 0}
.share-card h2 em{font-family:var(--f-display);font-weight:400;font-style:normal;color:var(--violet)}
.share-lead{color:var(--muted);font-weight:600;font-size:14px;margin:0 0 14px}
.share-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px 8px;margin-bottom:14px}
.share-app{display:flex;flex-direction:column;align-items:center;gap:6px;background:none;border:0;padding:4px 0;cursor:pointer;color:var(--plum);font:700 12.5px var(--f-body);text-decoration:none}
.share-app i{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;border:2.5px solid var(--plum);box-shadow:0 3px 0 var(--plum);transition:transform .15s}
.share-app:hover i{transform:translateY(-2px)}
.share-app svg{width:26px;height:26px}
.share-app--tiktok i{background:#000;color:#fff}
.share-app--instagram i{background:radial-gradient(circle at 30% 107%,#fdf497 0%,#fd5949 45%,#d6249f 60%,#285AEB 90%);color:#fff}
.share-app--whatsapp i{background:#25D366;color:#fff}
.share-app--telegram i{background:#229ED9;color:#fff}
.share-app--x i{background:#000;color:#fff}
.share-app--facebook i{background:#1877F2;color:#fff}
.share-app--copy i,.share-app--more i{background:var(--cream);color:var(--plum)}
.share-caption{background:var(--paper);border:2px dashed var(--line);border-radius:14px;padding:10px 12px;font-size:14px;color:var(--ink);margin:0 0 12px;white-space:pre-wrap}
.share-note{font-size:12.5px;color:var(--muted);margin:0;min-height:1em}
.share-card .help-x{top:16px;right:16px}
/* Antes do script principal: o endereço /meus-videos já mostra a página certa (sem pular o estúdio) */
html[data-page="videos"] .viral-intro,html[data-page="videos"] .workspace-heading,html[data-page="videos"] .workspace-grid{display:none!important}
html[data-page="videos"] #myVideos{display:block!important}
.my-videos__loading{grid-column:1/-1;color:var(--muted);font-weight:700;margin:6px 0}

/* ---------- Fotos do avatar por ângulo ---------- */
#referenceCards{margin-top:18px}
.reference-set-heading h4{font-size:17px!important;font-weight:800!important;color:var(--plum)!important;margin-bottom:6px}
.reference-set-heading>p{font-size:13px!important;line-height:1.6!important;color:var(--muted)!important}
.reference-set-heading>p b{color:var(--plum)!important;font-weight:800!important}
.reference-set-count{display:inline-flex!important;align-items:center;font-size:12px!important;font-weight:800;color:var(--plum)!important;
  background:var(--sun)!important;border:2px solid var(--plum)!important;border-radius:999px!important;padding:5px 12px!important;margin:12px 0 16px!important}
.reference-set-count.is-ok{background:var(--lime)!important}
.reference-view-grid{gap:14px!important}
.reference-view-card{background:#fff!important;border:2.5px solid var(--plum)!important;border-radius:18px!important;padding:12px!important;box-shadow:var(--pop-sm)!important}
.reference-view-card.has-reference{background:var(--cream)!important}
.reference-view-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px!important}
.reference-view-top>span{font-family:var(--f-display);font-size:20px!important;line-height:1;color:var(--violet)!important}
.reference-view-top>small{font-size:11px!important;font-weight:800!important;color:var(--plum)!important;background:#fff!important;
  border:2px solid var(--plum);border-radius:999px!important;padding:2px 9px!important}
.reference-view-card:first-child .reference-view-top>small{background:var(--lime)!important;color:var(--plum)!important}
.reference-view-pick{height:132px!important;border:2.5px dashed var(--plum)!important;border-radius:14px!important;background:var(--paper)!important;color:var(--plum)!important}
.reference-view-pick:hover{background:var(--cream)!important;border-color:var(--violet)!important}
.reference-empty-plus{width:36px!important;height:36px!important;background:var(--lime)!important;border:2.5px solid var(--plum)!important;
  box-shadow:0 3px 0 var(--plum);color:var(--plum)!important;font-weight:800!important;font-size:22px!important}
.reference-view-pick .reference-add{font-size:12px!important;font-weight:800!important;color:var(--plum)!important;background:none!important}
.needs-photo .reference-add{background:var(--lime)!important;border:2px solid var(--plum);border-radius:999px;padding:3px 10px!important;white-space:nowrap;font-size:11px!important}
.reference-empty-format{font-size:10px!important;color:var(--muted)!important}
.reference-view-pick>img{border-radius:12px!important;background:var(--cream)!important}
.reference-added{background:var(--lime)!important;color:var(--plum)!important;border:2px solid var(--plum);border-radius:999px;font-weight:800}
.reference-view-card h5{font-size:14px!important;font-weight:800!important;color:var(--plum)!important;margin:12px 0 4px!important}
.reference-view-card>p:not(.reference-upload-error){font-size:12px!important;line-height:1.5!important;color:var(--muted)!important}
.reference-file-row{font-size:12px;color:var(--muted)}
.reference-file-row>button{font-weight:800}
.reference-set-tips{background:var(--cream)!important;border:2.5px solid var(--plum)!important;border-radius:16px!important;padding:14px 16px!important;
  margin-top:18px!important;gap:6px!important;font-size:13px!important;color:var(--ink)!important}
.reference-set-tips>b{font-size:14px!important;font-weight:800!important;color:var(--plum)!important}
.reference-set-tips small{font-size:11px!important;color:var(--muted)!important}

/* ---------- Seu projeto (quadro da direita) ---------- */
.review-heading{margin-bottom:14px!important}
.review-heading h2{font-size:18px!important;font-weight:800!important;white-space:nowrap}
.review-heading h2 em{font-family:var(--f-display);font-weight:400;color:var(--violet)}
.review-heading>span{background:var(--sun)!important;font-size:11px!important}
.review-video{background:var(--cream)!important;border-style:dashed!important}
#workspaceVideoEmpty{display:grid;justify-items:center;gap:6px;text-align:center;padding:16px}
#workspaceVideoEmpty svg{width:52px;height:52px;padding:10px;border-radius:50%;background:var(--lime);border:2.5px solid var(--plum);box-shadow:0 3px 0 var(--plum);
  fill:none;stroke:var(--plum);stroke-width:3.5;stroke-linejoin:round}
#workspaceVideoEmpty svg path{fill:var(--plum)}
#workspaceVideoEmpty p{font-size:14px!important;font-weight:800;color:var(--plum)!important;margin-top:4px}
#workspaceVideoEmpty small{font-size:12px!important;color:var(--muted)!important}
.review-video-label{border-bottom:2px dashed var(--line)!important;padding:12px 2px 14px!important}
.review-video-label>span,.review-video-label>small{white-space:nowrap}
.review-video-label>span{font-size:13px!important;font-weight:800!important;color:var(--plum)!important}
.review-video-label>small{font-size:11px!important;color:var(--muted)!important}
.review-video-label b{font-weight:800!important;color:var(--plum)}
.review-details{gap:0!important;padding-top:4px!important}
.review-details>div{font-size:12px!important;padding:9px 2px}
.review-details span{color:var(--muted)!important}
.review-details b{color:var(--plum)!important;font-weight:800!important}
.review-avatar img{border-radius:8px!important;border:2px solid var(--plum)}
.review-avatar b{font-size:13px!important;color:var(--plum)!important;font-weight:800!important}
.review-avatar p{font-size:12px!important;color:var(--muted)!important}
.review-note{border-top:0!important;background:var(--cream);border:2px solid var(--plum)!important;border-radius:14px;padding:10px 12px!important;
  margin-top:14px!important;font-size:12px!important;line-height:1.5!important;color:var(--plum)!important;font-weight:600}

/* Pix: lembrar nome e CPF neste aparelho */
.remember-payer{display:flex;align-items:center;gap:10px;margin:14px 0 4px;font-size:13px;font-weight:700;color:var(--plum);cursor:pointer}
.remember-payer input{appearance:none;flex:none;width:22px;height:22px;margin:0;border:2.5px solid var(--plum);border-radius:7px;background:#fff;display:grid;place-items:center;cursor:pointer}
.remember-payer input:checked{background:var(--lime)}
.remember-payer input:checked::after{content:"";width:6px;height:11px;border:solid var(--plum);border-width:0 3px 3px 0;transform:translateY(-1px) rotate(45deg)}

/* Meus vídeos: botões sempre no rodapé do cartão (alinhados entre cartões) e prévia animada em preparação */
.vcard__body{flex:1;display:flex!important;flex-direction:column;align-items:stretch}
.vcard__body>.vcard__pill{align-self:flex-start}
.vcard__actions{margin-top:auto!important;padding-top:6px}
.vcard__media.is-running{background:linear-gradient(110deg,var(--cream) 30%,#fff 50%,var(--cream) 70%) 0 0/250% 100%;animation:vcard-shine 1.8s linear infinite}
.vcard__spin{width:52px;height:52px;border-radius:50%;border:5px solid #fff;border-top-color:var(--violet);box-shadow:0 0 0 3px var(--plum);animation:vcard-spin 1s linear infinite}
@keyframes vcard-shine{to{background-position:-250% 0}}
@keyframes vcard-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.vcard__media.is-running,.vcard__spin{animation:none}}
.vcard__info{list-style:none;margin:2px 0 0;padding:0;display:grid;gap:6px}
.vcard__info li{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:700;color:var(--plum)}
.vcard__info li::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;background:var(--violet);border:2px solid var(--plum)}
.vcard__info li.is-keep::before{background:var(--sun)}

/* Conta no topo: bolinha com a inicial e menu (igual ao curso do Personagem Pro) */
.user-me{position:relative;flex:none}
.user-me[hidden]{display:none}
.user-avatar{width:42px;height:42px;border-radius:50%;border:3px solid #fff;background:var(--lime);color:var(--plum);font:800 17px var(--f-body);cursor:pointer;
  display:grid;place-items:center;box-shadow:0 3px 0 rgba(0,0,0,.35);transition:transform .15s}
.user-avatar:hover{transform:translateY(-1px)}
.user-avatar[aria-expanded="true"]{background:var(--sun)}
.user-menu{position:absolute;right:0;top:calc(100% + 12px);min-width:230px;max-width:calc(100vw - 24px);background:#fff;border:3px solid var(--plum);border-radius:18px;padding:6px;box-shadow:var(--pop);z-index:60}
.user-menu p{margin:0;padding:10px 12px 8px;color:var(--muted);font-size:13px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-bottom:2px dashed var(--line);margin-bottom:4px}
.user-menu button{display:block;width:100%;text-align:left;background:none;border:0;border-radius:12px;padding:10px 12px;font:700 15px var(--f-body);color:var(--plum);cursor:pointer}
.user-menu button:hover,.user-menu button:focus-visible{background:var(--cream)}
#umLogout{color:var(--red)}
@media (max-width:520px){.user-avatar{width:36px;height:36px;font-size:15px}}
.app-header .header-help[hidden]{display:none!important}
.app-header>.header-help:not([hidden]){margin-left:auto!important}
.app-header>.header-help:not([hidden])~.header-help{margin-left:0!important}

/* Validade do Pix */
.pix-timer{margin:10px 0 0;font-weight:800;color:var(--plum);text-align:center}
#pixRenew{margin-top:10px;width:100%}
#pixRenew[hidden]{display:none!important}

/* Botão principal da abertura: seta junto do texto */
.viral-start{gap:10px!important;justify-content:center}

/* Ícone Meus vídeos: play centralizado, no mesmo traço dos outros ícones */
.nav-play{fill:none!important;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round}

/* Favoritas e Minhas modelos (Modelo Viral) */
.gal button{position:relative}
.fav-btn{position:absolute;top:8px;right:8px;z-index:2;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#fff;border:2.5px solid var(--plum);color:var(--muted);font-size:16px;line-height:1;cursor:pointer;box-shadow:0 2px 0 var(--plum);transition:transform .15s}
.fav-btn:hover{transform:scale(1.08)}
.fav-btn.on{background:var(--violet);color:#fff}
.my-models{margin:4px 0 22px;padding-bottom:20px;border-bottom:2px dashed var(--line)}
.my-models h3{font-size:16px;font-weight:800;color:var(--plum);margin:0 0 10px}
.fav-strip{display:flex;gap:10px;overflow-x:auto;padding:2px 2px 8px;scrollbar-width:thin}
.fav-item{flex:none;width:96px;display:grid;gap:4px;padding:0;border:2.5px solid var(--plum);border-radius:14px;background:#fff;overflow:hidden;cursor:pointer;text-align:left;box-shadow:0 3px 0 var(--plum)}
.fav-item img{width:100%;aspect-ratio:3/4;object-fit:cover;display:block}
.fav-item span{font-size:12px;font-weight:800;color:var(--plum);padding:0 8px 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fav-empty{margin:0;color:var(--muted);font-weight:700;font-size:13px}
.create-soon{display:flex;align-items:center;gap:12px;margin-top:12px;padding:12px 14px;border:2.5px dashed var(--plum);border-radius:16px;background:var(--paper);opacity:.85;cursor:not-allowed}
.create-soon__icon{display:grid;place-items:center;flex:none;width:36px;height:36px;border-radius:12px;background:var(--cream);border:2.5px solid var(--plum);font-weight:800;font-size:20px;color:var(--plum)}
.create-soon>span:nth-child(2){flex:1;display:grid;gap:2px}
.create-soon b{color:var(--plum);font-size:14px}
.create-soon small{color:var(--muted);font-size:12px}
.soon-pill{flex:none;font-size:11px;font-weight:800;color:var(--plum);background:var(--sun);border:2px solid var(--plum);border-radius:999px;padding:3px 10px}