/* Appyon — menu de celular (04/11/2026). Só abaixo de 860px. Desligar: tirar as tags mobile-nav.* do index.html. */
.mn-bar,.mn-veil{display:none}
@media (max-width:860px){
  .app{flex-direction:column}
  body.mn-app .app{padding-top:calc(63px + env(safe-area-inset-top,0px))}
  body.mn-app .mn-bar{display:flex}
  .mn-bar{align-items:center;gap:12px;position:fixed;top:0;left:0;right:0;z-index:40;
    padding:10px max(14px,env(safe-area-inset-right,0px)) 10px max(14px,env(safe-area-inset-left,0px));
    padding-top:calc(10px + env(safe-area-inset-top,0px));
    background:var(--surface);border-bottom:1px solid var(--border)}
  .mn-btn{flex:none;width:42px;height:42px;display:grid;place-items:center;border-radius:12px;border:1px solid var(--border);background:var(--surface);color:var(--text);cursor:pointer}
  .mn-btn svg{width:20px;height:20px}
  .mn-brand{min-width:0;line-height:1.15}
  .mn-brand b{display:block;font-size:16px;font-weight:800;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .mn-brand span{display:block;font-size:12px;color:var(--text-2);font-weight:500}
  .mn-page{margin-left:auto;font-size:13px;font-weight:700;color:var(--text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:40vw}

  /* a lateral vira gaveta por cima */
  .app>.sidebar{position:fixed!important;top:0;left:0;bottom:0;z-index:60;width:min(86vw,320px)!important;height:100vh!important;height:100dvh!important;
    border-right:1px solid var(--border)!important;border-bottom:none!important;padding:calc(18px + env(safe-area-inset-top,0px)) 14px calc(16px + env(safe-area-inset-bottom,0px))!important;
    display:flex!important;flex-direction:column;overflow-y:auto;transform:translateX(-105%);transition:transform .28s cubic-bezier(.2,.8,.2,1);
    box-shadow:0 0 0 rgba(0,0,0,0)}
  .app>.sidebar .nav-group{display:block!important;margin-right:0!important}
  .app>.sidebar .nav-item{min-height:44px}
  .app>.sidebar .sidebar-foot{display:flex!important;align-items:center;justify-content:space-between;gap:8px;margin-top:auto;padding-top:12px}
  body.mn-open .app>.sidebar{transform:none;box-shadow:24px 0 60px -20px rgba(0,0,0,.45)}
  body.mn-app .mn-veil{display:block}
  .mn-veil{position:fixed;inset:0;z-index:55;background:rgba(10,14,25,.45);opacity:0;pointer-events:none;transition:opacity .25s}
  body.mn-open .mn-veil{opacity:1;pointer-events:auto}
  body.mn-open{overflow:hidden}

  /* nada passa da largura da tela */
  .main,.content{min-width:0}
  .page-head,.panel-head,.row,.toolbar{flex-wrap:wrap;gap:8px}
  .row>.input,.row>input,.panel-head .input{min-width:0;flex:1 1 160px;width:auto!important;max-width:100%}
  .table-wrap,.tbl-wrap{overflow-x:auto}
  .search-trigger{min-width:0!important;max-width:100%;overflow:hidden}
  .search-trigger .kbd{display:none}
  .page-head .search-trigger{order:3;flex:1 1 100%}
  .table{max-width:none}
  .main{overflow-x:clip}
}
@media (prefers-reduced-motion:reduce){.app>.sidebar,.mn-veil{transition:none}}