/* Reforços mobile - Android, iOS e qualquer viewport (app 100% celular) */
html.mobile-app .screen.active{width:100%;max-width:100%;min-width:0}
html.mobile-app .card:not(.gan-hub){padding:var(--space-md);border-radius:var(--radius-md)}
html.mobile-app .gan-hero,
html.mobile-app .home-hero{padding:var(--space-lg) var(--space-md) var(--space-md)}
html.mobile-app .gan-headline,
html.mobile-app .home-headline{font-size:22px}
html.mobile-app .gan-body,
html.mobile-app .home-actions{padding:var(--space-sm) var(--space-md) var(--space-md)}
html.mobile-app .home-actions{padding-top:0}
html.mobile-app .result-hub .gan-body{padding:var(--space-md)}
html.mobile-app .gan-result-hero .gan-headline{font-size:20px}
html.mobile-app .grid-metrics .metric{padding:14px}
html.mobile-app .grid-metrics .metric strong{font-size:22px}
html.mobile-app .painel-smart-strip--leader{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
html.mobile-app .painel-smart-strip--leader .kpi-body strong{font-size:20px}
html.mobile-app .painel-smart-strip--leader .kpi-card{padding:10px 6px;min-height:72px}
html.mobile-app .painel-smart-strip--leader .kpi-body small{
  font-size:11px;
  line-height:1.25;
  white-space:normal;
}
html.mobile-app .field-error{font-size:13px}
html.mobile-app .home-stat{font-size:11px;padding:5px 10px}
html.mobile-app .login-screen{padding:0;padding-top:var(--safe-top)}
html.mobile-app .login-card.gan-hub{border-radius:0;box-shadow:none}
html.mobile-app .login-body{padding:12px 14px 0;gap:10px}
html.mobile-app .login-pledge{font-size:14px;padding:12px}
html.mobile-app .login-pledge input{width:24px;height:24px}
html.mobile-app .login-privacy-list{font-size:12px}
html.mobile-app .login-privacy-list li{padding:9px 10px 9px 26px}
html.mobile-app .login-privacy-label{font-size:11px}
html.mobile-app .login-privacy-desc{font-size:12px}
html.mobile-app .login-privacy-title{font-size:12px}
html.mobile-app .login-privacy-btn{font-size:11px;padding:10px 8px}
html.mobile-app .checkin-datetime-row{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 108px!important;
  column-gap:8px!important;
  align-items:start!important;
  width:100%!important;min-width:0!important;
}
html.mobile-app .checkin-datetime-row .field{
  min-width:0!important;margin:0!important;
}
html.mobile-app #checkinDateWrap{
  width:100%!important;max-width:100%!important;min-width:0!important;
}
html.mobile-app #checkinTimeWrap{
  width:108px!important;max-width:108px!important;min-width:108px!important;
  justify-self:end!important;
}
html.mobile-app .checkin-datetime-row input[type="date"],
html.mobile-app .checkin-datetime-row input[type="time"],
html.mobile-app #checkinTime{
  width:100%!important;max-width:100%!important;min-width:0!important;
  min-height:44px!important;height:44px!important;box-sizing:border-box!important;
}
html.mobile-app #checkinTime{
  max-width:108px!important;padding-left:4px!important;padding-right:4px!important;
  text-align:center!important;
}

/* Só iOS: @supports WebKit também casa no Chrome Android e já quebrou scroll. */
html.ios-device.mobile-app .main { min-height: -webkit-fill-available; }
html.ios-device.mobile-app input,
html.ios-device.mobile-app textarea,
html.ios-device.mobile-app select { font-size: 16px !important; }

@media(max-width:380px){
  html.mobile-app .mobile-tab small{display:none}
  html.mobile-app .mobile-tab{font-size:10px}
  html.mobile-app .pillar-severity-legend{
    font-size:11px;
  }
}

@media (display-mode: standalone){
  html.mobile-app .app-header{padding-top:calc(10px + var(--safe-top))}
}