/* ==========================================================================
   fix-cel — 30/10, revisão do celular. Só acabamento de toque e leitura:
   área mínima de 44 px, texto real a partir de 11 px, sem linha com uma
   palavra sobrando e os planos sem ocupar cinco telas seguidas.
   ========================================================================== */
.lead, .bcard-p { text-wrap: pretty; }

/* em tela grande o botão não existe: a lista aparece inteira */
.pl-mais { display: none; }

@media (max-width: 899px) {
    /* planos: abre a lista quem quiser; o mais escolhido já vem aberto */
    #planos .plan.pl-fecha .plan-list li:nth-child(n + 6) { display: none; }
    #planos .plan.pl-fecha .plan-list li.sep { display: none; }
    #planos .pl-mais {
        display: flex; align-items: center; justify-content: center; gap: 7px; width: 100%; min-height: 44px; margin-top: 12px;
        padding: 0; border: 0; border-top: 1px solid rgba(255, 255, 255, .08); background: none;
        font: inherit; font-size: 13.5px; font-weight: 600; color: var(--brand); cursor: pointer;
    }
    #planos .pl-mais::after {
        content: ''; width: 7px; height: 7px; margin-top: -3px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor;
        transform: rotate(45deg); transition: transform .2s var(--ease);
    }
    #planos .plan:not(.pl-fecha) .pl-mais::after { margin-top: 3px; transform: rotate(225deg); }

    /* toque */
    #planos .pt-abas button { min-height: 44px; }
    .foot-links a { display: inline-flex; align-items: center; min-height: 44px; }
    .foot-links { gap: 0 20px; }
    #planos .pt-det summary { min-height: 46px; box-sizing: border-box; }

    /* letra de conteúdo, não de enfeite da demonstração */
    #analytics .rx-tab b { font-size: 11px; }
    #analytics .rv-l p { font-size: 11px; }
    #teste-ab .abv li small { font-size: 11px; }
    #gerenciador .bcard-live small { font-size: 11px; }
}

/* celular baixo: a dobra travada também tem que caber (o app.js ainda ajusta o zoom) */
@media (max-width: 760px) and (max-height: 720px) {
    #analytics .rx-cola { padding: 64px 0 8px; }
    #analytics .sect-head .h2 { font-size: 21px; }
    #analytics .tela { margin-top: 10px; }
    #analytics .rx-tab { padding: 6px 3px 7px; }
    #analytics .rx-ico { width: 26px; height: 26px; }
    #analytics .rx-p { padding: 10px; }
    #analytics .rx-sv { max-height: 19vh; }
    #analytics .rx-aviso { margin-top: 8px; padding: 7px 10px; font-size: 12.5px; }
    #analytics .rf-b.m, #analytics .rd small { display: none; }
    #analytics .rf svg { max-height: 22px; margin: 3px 0; }
    #analytics .rf p { font-size: 13px; margin-top: 4px; }
}
@media (max-width: 760px) and (max-height: 800px) {
    #analytics .sect-head .lead { display: none; }
}
@media (max-width: 340px) {
    #analytics .rv-l { grid-template-columns: 44px minmax(0, 1fr); column-gap: 5px; }
    #analytics .rv-l b { font-size: 12.5px; white-space: nowrap; }
}