@media (max-width: 900px) { .metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-areas: "plants inverters" "healthy faulty" "unused unused" "report mail"; }.form-grid-four { grid-template-columns: repeat(3, minmax(0, 1fr)); }.site-header { padding-inline: 20px; }.primary-nav { padding-inline: 20px; } }
@media (max-width: 680px) { .site-header { min-height: auto; align-items: flex-start; gap: 14px; padding: 14px 16px; }.header-title { font-size: 16px; }.header-actions { flex-wrap: wrap; justify-content: flex-end; gap: 8px; }.header-logo { display: none; }.theme-toggle-label { display: none; }.primary-nav { padding-inline: 8px; }.nav-tab { padding: 11px 12px; }.page-shell { padding: 24px 16px 36px; }.page-heading, .page-heading-actions, .section-heading { align-items: flex-start; flex-direction: column; gap: 12px; }.page-heading-controls { align-items: flex-start; flex-wrap: wrap; }.metric-grid { grid-template-columns: 1fr; grid-template-areas: "plants" "inverters" "healthy" "faulty" "unused" "report" "mail"; }.filter-bar { align-items: stretch; flex-direction: column; }.filter-field, .filter-search { width: 100%; }.filter-actions { justify-content: flex-start; }.form-grid-three, .form-grid-four { grid-template-columns: 1fr; }.form-section { padding: 20px 16px; }.form-actions { padding: 16px; }.inline-search { width: 100%; }.inline-search .form-control { min-width: 0; }.mail-status { white-space: normal; } }

@media (max-width: 520px) { .portal-modal { width: calc(100% - 20px); }.modal-header, .modal-body, .modal-actions { padding-inline: 16px; }.mppt-checkbox-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.fault-detail > div { grid-template-columns: 1fr; gap: 3px; } }