/* Phase 1: mobile System Health — summary first, drill into detail on demand. */
@media (max-width: 760px) {
  .diagnostics-category-stack {
    display:grid !important;
    gap:7px !important;
    margin:0 10px 10px !important;
  }

  .diagnostics-category {
    margin:0 !important;
    border:1px solid var(--occ-mobile-line) !important;
    border-radius:11px !important;
    background:white !important;
    box-shadow:var(--occ-mobile-shadow) !important;
    overflow:hidden;
  }

  .diagnostics-category > summary {
    min-height:58px !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center !important;
    gap:8px !important;
    padding:9px 10px !important;
    list-style:none;
    cursor:pointer;
  }
  .diagnostics-category > summary::-webkit-details-marker { display:none; }
  .diagnostics-category > summary > div { min-width:0; display:flex; flex-direction:column; gap:2px; }
  .diagnostics-category > summary strong { font-size:13px !important; line-height:1.2; color:var(--occ-mobile-text); }
  .diagnostics-category > summary span { font-size:10px !important; line-height:1.25; color:var(--occ-mobile-muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .diagnostics-category > summary b {
    min-width:30px;
    max-width:120px;
    padding:4px 7px !important;
    border-radius:999px !important;
    background:#eef4f7 !important;
    color:#345264 !important;
    font-size:10px !important;
    font-weight:800 !important;
    text-align:center;
    white-space:nowrap;
  }
  .diagnostics-category > summary::after {
    content:'›';
    grid-column:2;
    justify-self:end;
    margin-left:4px;
    color:#8a9aa4;
    font-size:20px;
    line-height:1;
    transform:rotate(0deg);
    transition:transform .15s ease;
  }
  .diagnostics-category > summary > b { margin-right:18px; }
  .diagnostics-category[open] > summary::after { transform:rotate(90deg); }
  .diagnostics-category[open] > summary { border-bottom:1px solid #edf1f3; }

  .diagnostics-category-body {
    padding:8px !important;
    background:#fbfcfd;
  }

  /* Compact common health cards. */
  .diagnostics-category-body .fleet-summary,
  .diagnostics-category-body .diagnostics-grid,
  .diagnostics-category-body .diagnostics-charts-row,
  .diagnostics-category-body .diagnostics-charts-row-2col {
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:6px !important;
    margin:0 !important;
  }
  .diagnostics-category-body .chart-card,
  .diagnostics-category-body .fleet-summary-card,
  .diagnostics-category-body .device-tile {
    min-width:0;
    margin:0 !important;
    padding:8px !important;
    border-radius:9px !important;
    box-shadow:none !important;
  }
  .diagnostics-category-body .chart-card-header { margin-bottom:4px !important; }
  .diagnostics-category-body .chart-card-header span { font-size:10px !important; font-weight:750; }

  /* Camera maintenance becomes a dense work queue. */
  .camera-maintenance-toolbar {
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:7px !important;
    margin-bottom:7px !important;
    padding:0 !important;
  }
  .camera-maintenance-toolbar > div:first-child { min-width:0; }
  .camera-maintenance-toolbar > div:first-child strong { display:block; font-size:11px !important; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .camera-maintenance-toolbar > div:first-child span { display:block; margin-top:1px; font-size:9px !important; line-height:1.25; color:var(--occ-mobile-muted); }
  .camera-maintenance-run-actions { display:flex !important; gap:4px !important; }
  .camera-maintenance-run-actions a,
  .camera-maintenance-run-actions button { min-height:30px !important; padding:5px 7px !important; font-size:9px !important; }

  .camera-maintenance-filters {
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:5px !important;
    margin:0 0 7px !important;
  }
  .camera-maintenance-filters label:first-child { grid-column:1 / -1; }
  .camera-maintenance-filters label { gap:2px !important; font-size:9px !important; }
  .camera-maintenance-filters input,
  .camera-maintenance-filters select { min-height:34px !important; padding:6px 7px !important; font-size:11px !important; }

  .camera-maintenance-match-count { margin:5px 0 !important; font-size:9px !important; }
  .camera-maintenance-list { display:grid !important; gap:6px !important; }
  .camera-maintenance-result {
    display:block !important;
    margin:0 !important;
    padding:8px !important;
    border-radius:9px !important;
    box-shadow:none !important;
  }
  .camera-maintenance-title {
    display:grid !important;
    grid-template-columns:auto minmax(0,1fr) auto;
    gap:6px !important;
    align-items:start;
  }
  .camera-maintenance-title > span { font-size:8px !important; padding:2px 5px !important; }
  .camera-maintenance-title strong { font-size:10px !important; }
  .camera-maintenance-title h4 { margin:1px 0 0 !important; font-size:11px !important; line-height:1.2; }
  .camera-maintenance-title > b { font-size:13px !important; }
  .camera-maintenance-result p { margin:5px 0 !important; font-size:10px !important; line-height:1.3; }
  .camera-maintenance-meta { margin:5px 0 !important; gap:3px !important; }
  .camera-maintenance-meta span { padding:2px 5px !important; font-size:8px !important; }
  .camera-maintenance-actions { display:flex !important; gap:4px !important; margin-top:6px !important; }
  .camera-maintenance-actions a,
  .camera-maintenance-actions button { min-height:29px !important; padding:4px 7px !important; font-size:9px !important; }
  .camera-maintenance-result details { margin-top:5px !important; }
  .camera-maintenance-result details > summary { font-size:9px !important; }
  .camera-maintenance-images { grid-template-columns:repeat(3,minmax(0,1fr)) !important; gap:4px !important; }

  /* System detail cards and warnings stay readable without becoming giant blocks. */
  .alert-panel,
  .diagnostics-alert-list { margin:0 !important; }
  .alert-panel article,
  .diagnostics-alert-list article,
  .insight-list article,
  .system-insight-row {
    margin:0 0 5px !important;
    padding:7px 8px !important;
    border-radius:8px !important;
  }
  .alert-panel article strong,
  .diagnostics-alert-list article strong { font-size:10px !important; }
  .alert-panel article p,
  .alert-panel article span,
  .diagnostics-alert-list article p,
  .diagnostics-alert-list article span { font-size:9px !important; line-height:1.3; }

  .inventory-drilldown > details > summary { min-height:38px !important; padding:6px 7px !important; font-size:10px !important; }
  .inventory-drilldown > details > div a { padding:6px 7px !important; }
  .inventory-drilldown > details > div a span,
  .inventory-drilldown > details > div a strong,
  .inventory-drilldown > details > div a small { font-size:9px !important; }
}