/* Ajustes para celular (domínio + subdomínio). Carregar por último. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
button,a,label,.slot,.hcard,.tool,select,input[type=checkbox],input[type=radio]{touch-action:manipulation}

@media (max-width:900px){
  /* o iOS dá zoom automático em qualquer campo com fonte menor que 16px */
  input,textarea,select,.field,.sel,.ta,#txt,#coCode,#coAll{font-size:16px!important}
  /* rolagem: não "prende" o dedo dentro de painéis internos */
  .chat,#side,.side,.modal-box,.vm-box,.fee,.lkbox,.sd{overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
  .modal-box,.vm-box{max-height:calc(100dvh - 24px)}
  .fee{height:100dvh}
  .hero-wrap{min-height:calc(100dvh - 34px)}
}

@media (max-width:760px){
  /* decoração que cobre o conteúdo */
  #floaters,.floaters{display:none!important}

  /* topo e navegação */
  .appbar{padding-left:10px;padding-right:10px}
  .appbar .tag.hide-m{display:none}
  .side,#side{width:min(84vw,320px)}

  /* tela de envio (substituir pessoa em vídeo) */
  .chat{padding:0 12px 6px}
  #hero.studio{padding:16px 0 8px}
  #hero.studio h2{font-size:clamp(24px,7.4vw,30px)}
  #hero.studio .st-sub{font-size:14.5px;margin-bottom:16px}
  #hero.studio .slots{gap:10px}
  #hero.studio .slot{min-height:clamp(190px,30vh,260px)!important;border-radius:18px!important}
  #hero.studio .slot b{font-size:14px;line-height:1.2}
  #hero.studio .slot small{font-size:11.5px}
  #hero.studio .slot .th:empty::before{width:50px;height:50px;font-size:28px;margin-bottom:38px}
  #hero.studio .chips{flex-wrap:nowrap;overflow-x:auto;margin:6px -12px 0;padding:2px 12px 6px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  #hero.studio .chips::-webkit-scrollbar{display:none}
  #hero.studio .chips button{flex:none;white-space:nowrap}

  /* campo de digitação: texto em cima, botões embaixo */
  .comp{padding:6px 10px calc(8px + env(safe-area-inset-bottom))}
  .comp .row2{display:flex;flex-wrap:wrap;gap:8px;align-items:stretch}
  .comp .row2 #txt{flex:1 1 100%;min-height:48px;max-height:120px}
  .comp .row2 #gen{flex:1 1 0;min-height:46px}
  .comp .row2 #send{flex:0 0 auto;min-height:46px}

  /* conversa */
  .msg .b,.msg .bubble{max-width:92%}

  /* pop-ups */
  .modal,.vm{padding:10px}
  .vm-box{padding:20px 14px 16px;border-radius:20px}
  .vm h3{font-size:21px}
  .vm-gen{grid-template-columns:96px 1fr;gap:12px}
  .vm-top{grid-template-columns:78px 1fr;gap:12px}
  .vm-warn{padding:12px}
  .vm-warn strong{font-size:14px}
  .vm-cta{font-size:16px;padding:15px 14px}
  .fee-in{padding:22px 14px 160px}
  .fee h2{font-size:25px}
  .fee-foot button{font-size:15.5px;padding:15px 14px}

  /* cartões / carrossel */
  .hgrid{gap:12px}
  .cd-track>.cd-card{flex-basis:78%!important}

  /* subdomínio premium */
  .wrap{padding-left:14px;padding-right:14px}
  main h1{font-size:clamp(24px,7vw,30px)}
  .top .wrap{gap:8px}
  .chip.hm{display:none}
  .two{grid-template-columns:1fr!important}
  .drop{min-height:150px}
  .btn{min-height:46px}
  .tk-ov .tk-x{top:calc(10px + env(safe-area-inset-top))}
}

@media (max-width:380px){
  #hero.studio .slot b{font-size:13px}
  .appbar .mini-logo .sticker{font-size:15px}
}

/* ===== ajustes finos de celular (v2) ===== */
@media(max-width:640px){
  #co .co-box,.tk-box{width:calc(100vw - 20px);max-width:none;margin:0 auto;padding:18px 14px}
  #co .modal-box{max-height:calc(100dvh - 20px)}
  .co-bump{flex-wrap:wrap;gap:8px 12px;padding:12px}
  .co-bump .co-bump-body{flex:1 1 calc(100% - 56px)}
  .co-bump .co-bump-price{flex:0 0 100%;margin:0 0 0 54px;font-size:13.5px}
  .co-bump-body b{font-size:14px}
  .co-hero{padding:10px}.co-title{font-size:21px}
  .home-ban{flex-direction:column;align-items:stretch;gap:10px;text-align:left}.home-ban button{width:100%}
  .tok-box{flex-wrap:wrap}
  #planCards.plans.two{padding:18px 4px 0}
  .view-in{padding-left:14px;padding-right:14px}
  body{overflow-x:hidden}
}
