/* Crosser Care v0.2.2 — densidade refinada a partir da referência aprovada.
   Ajustes apenas de apresentação; os handlers e a semântica de navegação permanecem intactos.
   Os controles de ação mantêm pelo menos 44px de área vertical clicável sempre que possível. */
@media (max-width: 700px) {
  .app-shell { padding: 7px 11px calc(73px + env(safe-area-inset-bottom)); }
  .topbar.cc-topbar { min-height: 40px; margin-bottom: 4px; }
  .cc-topbar .mobile-brand { gap: 6px; }
  .cc-topbar .mobile-brand .brand-mark { width: 27px; min-width: 27px; height: 28px; }
  .cc-topbar .mobile-brand .brand-mark .icon { width: 27px; height: 27px; }
  .cc-topbar .mobile-brand strong { font-size: 16.8px; line-height: 1.1; }
  .cc-topbar .mobile-brand .eyebrow { font-size: 9.8px; line-height: 1.25; }
  .cc-topbar .icon-button { min-width: 40px; min-height: 40px; }

  .cc-owner-line { gap: 8px; margin: 0 0 7px; }
  .cc-avatar { width: 34px; height: 34px; }
  .cc-avatar .icon { width: 19px; height: 19px; }
  .cc-owner-title h1 { font-size: 14.3px; line-height: 1.18; }
  .cc-owner-title p { font-size: 10px; line-height: 1.22; margin-top: 1px; }
  .cc-odometer { min-height: 39px; min-width: 96px; padding: 4px 7px; gap: 5px; border-radius: 12px; }
  .cc-odometer>.icon { width: 17px; height: 17px; }
  .cc-odometer small { font-size: 9.4px; }
  .cc-odometer strong { font-size: 13px; line-height: 1.16; }

  .cc-hero { min-height: 148px; padding: 9px 10px 8px; border-radius: 17px; }
  .cc-hero-upper { min-height: 65px; gap: 7px; }
  .cc-hero-symbol { width: 34px; height: 34px; }
  .cc-hero-symbol .icon { width: 19px; height: 19px; }
  .cc-hero-copy { max-width: 64%; }
  .cc-hero-copy h2 { font-size: 14.3px; line-height: 1.16; }
  .cc-hero-copy p { font-size: 9.8px; line-height: 1.22; margin-top: 3px; }
  .cc-moto-image { width: 197px; max-width: 57%; height: 90px; right: -34px; bottom: -5px; }
  .cc-hero-link { width: 28px; height: 28px; }
  .cc-hero-progress { margin-top: 4px; padding: 6px 9px; border-radius: 10px; }
  .cc-hero-line { font-size: 10px; line-height: 1.25; }
  .cc-hero-line strong { font-size: 10px; }
  .cc-hero-line>span { font-size: 9.4px; }
  .cc-hero-line.small { margin-top: 3px; }
  .cc-track { height: 5px; margin-top: 5px; }

  .cc-section-head { margin: 10px 2px 5px; gap: 7px; }
  .cc-section-head h2 { font-size: 15.5px; line-height: 1.16; }
  .cc-more { min-height: 30px; font-size: 9.8px; padding: 3px 8px; }
  .cc-more .icon { width: 13px; height: 13px; }
  .cc-quick-grid { gap: 6px; }
  .cc-quick-card { min-height: 82px; padding: 7px 7px 6px; border-radius: 12px; }
  .cc-card-top { min-height: 27px; gap: 4px; }
  .cc-card-top .cc-item-icon { width: 16px; height: 16px; }
  .cc-card-top strong { font-size: 10px; line-height: 1.15; font-weight: 690; }
  .cc-chip { min-height: 18px; font-size: 8.5px; padding: 3px 4px; line-height: 1.1; }
  .cc-dual-axis { margin-top: 4px; }
  .cc-axis { gap: 3px; }
  .cc-axis+.cc-axis { padding-left: 6px; }
  .cc-axis>.icon { width: 12px; height: 12px; }
  .cc-axis b { font-size: 10.1px; line-height: 1.25; }
  .cc-axis small { font-size: 8.9px; line-height: 1.2; }

  .cc-action-row { gap: 6px; }
  .cc-action { min-height: 54px; padding: 6px 2px; gap: 4px; border-radius: 12px; }
  .cc-action .icon { width: 19px; height: 19px; }
  .cc-action span { font-size: 9.1px; }
  .cc-alert-panel { border-radius: 13px; }
  .cc-alert-row { min-height: 44px; padding: 6px 8px; gap: 6px; }
  .cc-alert-dot { width: 7px; height: 7px; }
  .cc-alert-ico { width: 16px; height: 16px; }
  .cc-alert-copy { gap: 1px; }
  .cc-alert-copy strong { font-size: 10.2px; }
  .cc-alert-copy small { font-size: 9.2px; }
  .cc-alert-row .cc-chip { font-size: 8.4px; }

  .bottom-nav { padding: 0 7px calc(3px + env(safe-area-inset-bottom)); }
  .bottom-btn { min-height: 51px; height: 51px; gap: 2px; }
  .bottom-btn .icon { width: 20px; height: 20px; }
  .bottom-btn span { font-size: 9.2px; }

  /* Densidade das demais abas: menos espaço em branco, sem comprimir formulários. */
  .main>.section-heading { margin-top: 2px; margin-bottom: 9px; }
  .main>.section-heading h1 { font-size: 20px; }
  .main>.section-heading p { font-size: 11.5px; line-height: 1.35; margin-top: 3px; }
  .main>.section-title { margin: 12px 0 7px; }
  .main .card { padding: 12px; border-radius: 14px; }
  .main .grid { gap: 8px; }
  .main .stack-md { gap: 8px; }
  .main .stat-card { padding: 9px; }
  .main .action-tile { padding: 10px; min-height: 76px; }
  .main .timeline-item { padding: 9px; }
  .main .care-row { padding: 8px 0; }
  .main .list-row { min-height: 46px; padding: 6px 3px; }
  .main .guide-list-item { min-height: 54px; padding: 8px 10px; }
  .cc-detail-metrics { gap: 7px; }
  .cc-detail-metrics>div { padding: 10px; }
  .cc-detail-title h1 { font-size: 20px; margin-bottom: 6px; }
  .cc-back { margin-bottom: 5px; }
}
@media (max-width: 365px) {
  .app-shell { padding-left: 9px; padding-right: 9px; }
  .cc-owner-title h1 { font-size: 13px; }
  .cc-owner-title p { font-size: 9.5px; }
  .cc-odometer { min-width: 90px; }
  .cc-quick-grid { gap: 5px; }
  .cc-quick-card { min-height: 84px; padding: 7px 5px 6px; }
  .cc-card-top strong { font-size: 9.3px; }
  .cc-chip { font-size: 8px; padding: 2px 3px; }
  .cc-axis { gap: 2px; }
  .cc-axis+.cc-axis { padding-left: 4px; }
  .cc-axis>.icon { width: 11px; height: 11px; }
  .cc-axis b { font-size: 9.6px; }
  .cc-axis small { font-size: 8.3px; }
  .cc-action span { font-size: 8.8px; }
}
@media (prefers-reduced-motion: reduce) {
  .cc-quick-card, .cc-action, .cc-track>div { transition:none !important; }
}