/* Celular (PWA): blocos encaixados na largura da tela. Carregado por último em todas as páginas.
   Regras só até 600px; tablets e computadores ficam como estão. */
.btn-menu,.menu-mob,.menu-mob-fundo{display:none}

@media (max-width:600px){
  html,body{max-width:100%;overflow-x:hidden}
  body{-webkit-text-size-adjust:100%}

  /* ---------- barra do topo: marca + tema + sino + menu ---------- */
  .topbar{gap:8px;padding:8px 12px;padding-top:max(8px,env(safe-area-inset-top));padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}
  .topbar .brand{flex:1 1 auto;min-width:0;gap:8px}
  .topbar .brand>div{min-width:0}
  .topbar .brand b,.topbar .brand span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .topbar .brand b{font-size:15px}.topbar .brand span{font-size:12px}
  .topbar .brand-mark{width:34px;height:34px;flex:none}
  .top-acoes{flex:none;gap:6px}
  .top-acoes>.btn-ghost,.top-acoes>a.btn-ghost{min-height:40px;min-width:40px;padding:0 10px;font-size:14px}
  .top-acoes>.btn-tema,.top-acoes>.btn-sino,.top-acoes>.btn-menu{width:40px;padding:0;justify-content:center}
  .btn-menu{display:inline-flex;align-items:center;justify-content:center}
  .btn-menu svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
  .menu-mob-fundo{position:fixed;inset:0;z-index:60;background:rgba(0,0,0,.4)}
  .menu-mob{position:fixed;left:0;right:0;bottom:0;z-index:61;flex-direction:column;gap:6px;max-height:80vh;overflow:auto;
    padding:10px 12px max(14px,env(safe-area-inset-bottom));border-radius:20px 20px 0 0;background:var(--card);border-top:1px solid var(--line);
    box-shadow:0 -12px 40px rgba(0,0,0,.25);animation:sl-sobe .22s ease}
  .menu-mob-fundo:not([hidden]),.menu-mob:not([hidden]){display:flex}
  .menu-mob-fundo[hidden],.menu-mob[hidden]{display:none!important}
  .menu-mob::before{content:'';align-self:center;width:40px;height:4px;margin:2px 0 6px;border-radius:2px;background:var(--line)}
  .menu-mob-tit{margin:0 4px 4px;font-size:13px;font-weight:700;color:var(--mut)}
  .menu-mob>.btn-ghost:not([hidden]),.menu-mob>a.btn-ghost:not([hidden]){display:flex!important;align-items:center;width:100%;min-height:48px;justify-content:flex-start;padding:0 16px;font-size:16px;border-radius:12px}
  .menu-mob>[hidden]{display:none!important}
  .menu-mob .so-desk:not([hidden]){display:flex!important}

  /* ---------- área de conteúdo ---------- */
  .wrap,#app .wrap{max-width:none;padding:12px;padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right));gap:12px}
  .card{padding:14px;border-radius:16px;min-width:0}
  .card h2{font-size:16px}
  .card-hd{flex-direction:column;align-items:flex-start;gap:2px;margin-bottom:10px}
  .card-hd .mut{font-size:12px}
  .bloco-hd{gap:10px}.bloco-hd h2{font-size:16px}

  /* ---------- resumo (nota) ---------- */
  .hero{padding:16px 14px;gap:14px}
  .hero-top{flex-direction:column;align-items:stretch;gap:12px}
  .saudacao{font-size:21px}
  .periodo{flex:1 1 auto;max-width:none;width:100%}
  .pd-modo{align-self:stretch;display:flex}.pd-modo button{flex:1;min-height:40px}
  .pd-nav .btn-icon{width:40px;height:44px;flex:none}
  .pd-botao{min-width:0}
  .hero-body{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 14px;align-items:center}
  .hero-txt{display:contents}
  .hero .ring,#app .hero .ring{width:104px;height:104px;grid-row:1 / 3;grid-column:1}
  .hero .ring>div,#app .hero .ring>div{width:82px;height:82px}
  .hero .ring b,#app .hero .ring b{font-size:30px}
  .hero .faixa{grid-column:2;align-self:end;justify-self:start}
  .hero .frase{grid-column:2;align-self:start;font-size:15px;line-height:1.4}
  .hero .chips{grid-column:1 / -1;gap:6px}
  .chip{font-size:12px;padding:5px 10px}
  .nota-esp{font-size:13px}
  html[data-layout=minimal] .hero-body{grid-template-columns:minmax(0,1fr)}
  html[data-layout=minimal] .hero .ring,html[data-layout=minimal] .hero .faixa,html[data-layout=minimal] .hero .frase{grid-column:1;grid-row:auto}
  html[data-layout=minimal] .hero .ring{width:auto;height:auto;justify-self:start}
  html[data-layout=minimal] .ring b{font-size:64px!important}

  /* ---------- gestor ---------- */
  .gestor-bar{padding:10px}
  .gb-links{justify-content:stretch;gap:8px}
  .gb-links a{flex:1 1 0;justify-content:center;min-height:40px;padding:0 8px;border:1px solid var(--line);border-radius:10px;text-align:center}

  /* ---------- pontos fortes / o que melhorar ---------- */
  .pf-om{grid-template-columns:minmax(0,1fr)}
  .lista-pf>li,.lista-om>li{padding:12px}
  .lista-om>li.om{padding-left:44px}.lista-om>li.om::before{left:12px}

  /* ---------- destaques ---------- */
  .destaques{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .dest{padding:12px;min-width:0}

  /* ---------- semana dia a dia ---------- */
  .sem-metricas{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;overflow:visible;margin:0;padding:0 0 4px}
  .sm-btn{min-width:0;min-height:40px;padding:0 6px;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .dia-det{padding:12px}
  .dd-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .dd-item{padding:10px;min-width:0}
  .dd-top{flex-wrap:wrap;gap:2px 6px}.dd-top b{font-size:16px}

  /* ---------- tabelas e formulários ---------- */
  .tabela-wrap,.tblwrap{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
  input,select,textarea{font-size:16px} /* evita o zoom automático do iPhone */
  .linha-btn{display:flex;flex-wrap:wrap;gap:8px}
  .linha-btn>.btn-primary,.linha-btn>.btn-ghost{flex:1 1 140px}
  .campo-inline{flex-wrap:wrap}
  .painel-alertas{max-width:100vw}
}

@media (max-width:360px){
  .topbar .brand span{display:none}
  .hero .ring,#app .hero .ring{width:92px;height:92px}.hero .ring>div,#app .hero .ring>div{width:72px;height:72px}.hero .ring b,#app .hero .ring b{font-size:26px}
  .sem-metricas{grid-template-columns:repeat(2,minmax(0,1fr))}
  .destaques{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
}

/* ---------- Painel geral no celular ---------- */
@media (max-width:600px){
  .pg-status,.pg-carga{padding-left:12px;padding-right:12px}
  .pg-carga{width:auto;margin:10px 12px 0}
  .pg .wrap{padding:12px;gap:14px}
  .pg h1{font-size:20px}
  .pg .seg{display:flex;width:100%}.pg .seg button{flex:1;min-height:40px}
  .pg select,.pg input[type=number]{min-height:42px}
  .pg .filters{padding:12px;gap:12px}
  .pg .fld{width:100%}
  .pg .tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .pg .tile{padding:10px 12px}.pg .tile .v{font-size:19px}
  .pg section.card{padding:14px}
  .pg table.crt{display:block;max-width:100%;overflow-x:auto}
  .pg .profile{gap:10px 18px}.pg .profile .big{font-size:32px}
  .pg .presbtn{width:100%;justify-content:center;min-height:44px}
  .pg .more>summary{padding:12px 14px;flex-wrap:wrap}.pg .more>summary .note{margin-left:0;width:100%}
  .pg .more>.in{padding:0 12px 14px}
}

/* ---------- tabelas que viram cartões no celular ---------- */
@media (max-width:600px){
  /* Ajustes: alertas da semana (analista e nota em cima, alertas embaixo) */
  .tab-alertas,.tab-alertas tbody{display:block}
  .tab-alertas thead{display:none}
  .tab-alertas tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 10px;padding:12px 0;border-bottom:1px solid var(--line)}
  .tab-alertas td{display:block;padding:0;border:0}
  .tab-alertas td:nth-child(1){font-weight:700}
  .tab-alertas td:nth-child(2){text-align:right;font-weight:800}
  .tab-alertas td:nth-child(3){grid-column:1 / -1}
  /* Ajustes: prévia e histórico das notificações, acessos */
  .tab-push,.tab-push tbody,#tbPushLog,#tbPushLog tr,#tbAcessos,#tbAcessos tr{display:block}
  .tab-push thead,.tab-push+thead{display:none}
  .tab-push tr,#tbPushLog tr{display:flex;flex-direction:column;gap:4px;padding:10px 0;border-bottom:1px solid var(--line)}
  .tab-push td,#tbPushLog td{display:block;padding:0;border:0}
  #tbPushLog td:first-child,.tab-push td:last-child{font-size:12px;color:var(--mut)}
  table:has(#tbPushLog) thead,table:has(#tbAcessos) thead{display:none}
  table:has(#tbPushLog),table:has(#tbAcessos){display:block}
  #tbAcessos tr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:8px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}
  #tbAcessos td{display:block;padding:0;border:0;min-width:0}
  #tbAcessos td:first-child{grid-column:1 / -1;font-weight:700;overflow-wrap:anywhere}
  #tbAcessos select{width:100%;min-width:0}

  /* Painel geral: ranking em cartões (posição, nome, nota; situação e variação; ponto forte e a melhorar) */
  .pg #rankS,.pg #rankS tbody{display:block;width:100%}
  .pg #rankS thead{display:none}
  .pg #rankS tr.grprow{display:block}.pg #rankS tr.grprow td{display:block;padding:14px 4px 6px;white-space:normal}
  .pg #rankS tr[data-a]{display:grid;grid-template-columns:26px minmax(0,1fr) auto;gap:4px 8px;align-items:center;padding:10px 6px;border-bottom:1px solid var(--line)}
  .pg #rankS tr[data-a] td{display:block;padding:0;border:0;white-space:normal;text-align:left}
  .pg #rankS tr[data-a] td:nth-child(1){grid-row:1 / span 2;align-self:start;color:var(--muted)}
  .pg #rankS tr[data-a] td:nth-child(2){grid-column:2;font-weight:600}
  .pg #rankS tr[data-a] td:nth-child(3){grid-column:3;grid-row:1;text-align:right}
  .pg #rankS tr[data-a] td:has(.pill){grid-column:2;grid-row:2}
  .pg #rankS tr[data-a] td.num:not(.l){grid-column:3;grid-row:2;text-align:right}
  .pg #rankS tr[data-a] td.tg{grid-column:2 / -1;font-size:12.5px;min-width:0}
  .pg #rankS tr[data-a] td.tg:nth-last-child(2)::before{content:'Ponto forte: ';color:var(--muted)}
  .pg #rankS tr[data-a] td.tg:last-child::before{content:'A melhorar: ';color:var(--muted)}
  .pg #rankS .scorecell .bar{display:none}
  .pg #rankS .scorecell b{font-size:15px}
}
@media (max-width:600px){
  /* Ajustes: parâmetros dos alertas (indicador e "ativo" em cima, as duas regras embaixo) */
  table.acessos.tab-param,table.acessos.tab-param tbody{display:block}
  table.acessos.tab-param thead{display:none}
  table.acessos.tab-param tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 10px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}
  table.acessos.tab-param td{display:block;padding:0;border:0;min-width:0}
  table.acessos.tab-param td:nth-child(1){font-weight:700}
  table.acessos.tab-param td:nth-child(n+3){grid-column:1 / -1}
}
@media (max-width:600px){
  .pn2{padding:12px;gap:12px}
  .pn2>*,.pn2 .card,.pn2-cmp,.cmp-row,.cmp-top{min-width:0}
  .cmp-top b{min-width:0;overflow-wrap:anywhere}
  .ind-esq{flex:1 1 auto}
}
@media (max-width:380px){
  .ind{flex-direction:column;gap:6px}
  .ind-dir{flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:6px 10px;text-align:left}
  .ind-dir .ind-val{order:-1}
  .tag{white-space:normal}
}
@media (max-width:600px){
  .grupos,.pf-om,.pn2-duo,.ag-grade{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:600px){
  .pg .btn{min-height:40px}
  .pg .period-pill a{display:inline-block;padding:8px 0}
}
@media (max-width:600px){
  .pg-carga{padding:0;margin:0 12px 16px}
  .pg-carga>summary{padding:12px 14px}
  .pg-carga>:not(summary){margin-left:14px;margin-right:14px}
  .pg header.pg-cab{grid-template-columns:minmax(0,1fr)}.pg header.pg-cab .presbtn{grid-row:auto}
}