/* Botões de atalho no celular: "Meus jingles" no topo + barra fixa no rodapé.
   Arquivo separado para não mexer no app.css / landing.css. */
.mnav-top,.mnav{display:none}

@media (max-width:860px){
  /* topo: "Meus jingles" em destaque ao lado do Criar */
  .mnav-top{display:inline-flex;align-items:center;gap:6px;margin-left:auto;padding:8px 12px;border-radius:999px;
    background:#fff;color:#1d1a17;border:2px solid #FF4D00;font-weight:800;font-size:13.5px;text-decoration:none;white-space:nowrap;
    box-shadow:0 6px 16px -10px rgba(255,77,0,.8)}
  .mnav-top svg{width:17px;height:17px;color:#FF4D00}
  .mnav-top.on{background:#FF4D00;color:#fff}.mnav-top.on svg{color:#fff}
  .topbar .brand{flex:none}
  .topbar .mnav-top + .btn{display:none}  /* o Criar fica grande na barra de baixo */

  /* barra fixa no rodapé */
  .mnav{display:flex;gap:10px;position:fixed;left:0;right:0;bottom:0;z-index:55;
    padding:10px 12px calc(10px + env(safe-area-inset-bottom));
    background:rgba(255,255,255,.96);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
    border-top:1px solid rgba(0,0,0,.08);box-shadow:0 -10px 30px -12px rgba(0,0,0,.25);animation:mnavUp .35s ease-out}
  .mnav-btn{flex:1 1 0;min-width:0;display:flex;align-items:center;gap:9px;min-height:56px;padding:8px 10px;border-radius:16px;
    font:inherit;text-align:left;text-decoration:none;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:transform .12s}
  .mnav-btn:active{transform:scale(.97)}
  .mnav-ic{flex:none;width:34px;height:34px;border-radius:12px;display:grid;place-items:center}
  .mnav-ic svg{width:19px;height:19px}
  .mnav-tx{display:flex;flex-direction:column;line-height:1.15;min-width:0}
  .mnav-tx b{font-size:15px;font-weight:800;white-space:nowrap}
  .mnav-tx small{font-size:11.5px;opacity:.75;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

  .mnav-my{background:#1d1a17;color:#fff;border:0}
  .mnav-my .mnav-ic{background:rgba(255,255,255,.14);color:#FFB08A}
  .mnav-my.on{outline:3px solid #FF4D00;outline-offset:-3px}
  .mnav-new{background:#FF4D00;color:#fff;border:0;box-shadow:0 10px 24px -10px rgba(255,77,0,.9)}
  .mnav-new .mnav-ic{background:rgba(255,255,255,.2);color:#fff}

  /* espaço para a barra não cobrir o fim da página */
  body{padding-bottom:calc(84px + env(safe-area-inset-bottom))}
  /* sobe o botão de suporte e avisos para cima da barra */
  .support-fab{bottom:calc(92px + env(safe-area-inset-bottom))!important}
  .support-box{bottom:calc(160px + env(safe-area-inset-bottom))!important;height:min(480px,calc(100vh - 230px))!important}
  .toast{bottom:calc(96px + env(safe-area-inset-bottom))!important}
  /* a barra antiga "Criar meu jingle" da home dá lugar à nova */
  .lp-sticky{display:none!important}
  /* com o chat aberto, a barra some */
  body.chat-open .mnav{display:none}
  body.chat-open{padding-bottom:0}
}
@media (max-width:360px){
  .mnav-top span{display:none}.mnav-top{padding:8px 10px}
  .mnav-tx small{display:none}.mnav-tx b{font-size:14.5px}
  .mnav-ic{width:32px;height:32px}
}
@keyframes mnavUp{from{transform:translateY(100%)}to{transform:none}}
@media print{.mnav,.mnav-top{display:none!important}}