/*
 * ASSET V ROADS — ENTERPRISE READABILITY / COMFORTABLE DENSITY
 * References: Microsoft Fluent 2, Atlassian, IBM Carbon, WCAG 2.2.
 * Structural scaling; typography ramp is applied in styles.css/admin-console.css.
 * Intentionally no transform:scale(), zoom, or image enlargement that blurs maps.
 */
:root {
  --sidebar: 300px;
  --av-space-sm: 12px;
  --av-space-md: 16px;
  --av-space-lg: 24px;
  --av-space-xl: 32px;
  --av-control-height: 46px;
  --av-table-row-height: 50px;
}
html { font-size: 16px; text-size-adjust: 100%; -webkit-text-size-adjust: 100%; }
body { line-height: 1.5; }
button, input, select, textarea { line-height: 1.4; }
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, [tabindex]:focus-visible,
input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid #007f91;
  outline-offset: 3px;
}
/* Primary shell and navigation: enough room for complete labels. */
.sidebar { padding: 24px 17px 18px; overflow-y: auto; }
.brand-lockup { gap: 12px; padding: 2px 8px 22px; }
.brand-lockup img { width: 46px; height: 46px; }
.brand-lockup span { white-space: normal; line-height: 1.35; }
.entity-switcher { gap: 12px; padding: 14px 12px; margin-bottom: 16px; }
.entity-mark { width: 42px; height: 42px; }
.entity-copy { min-width: 0; }
.entity-copy strong { white-space: normal; overflow-wrap: anywhere; }
.entity-copy small, .mini-label, .section-kicker,
.nav-group-label, .nav-meta, .sync-chip, .user-copy span { line-height: 1.4; }
.nav-group-label { padding: 19px 12px 8px; }
.primary-nav { gap: 5px; }
.nav-item { min-height: 48px; height: auto; padding: 10px 13px; gap: 13px; }
.nav-item > span:first-child { flex: 0 0 20px; width: 20px; height: 20px; }
.nav-item em { line-height: 1.35; }
.nav-count { min-width: 25px; min-height: 25px; height: auto; padding: 3px 7px; }
.sidebar-foot { padding: 18px 8px 5px; }
.user-card { gap: 11px; }.avatar { width: 42px; height: 42px; }
.ghost-icon { width: 44px; height: 44px; padding: 10px; }
/* Headers and actions */
.global-bar { height: 76px; padding: 0 clamp(20px, 2.6vw, 44px); gap: 16px; }
.command-search { height: 48px; width: min(720px, 52vw); padding: 0 16px; gap: 11px; }
.command-search > span { width: 19px; height: 19px; }
.command-search kbd { padding: 6px 8px; }
.global-actions { gap: 10px; }
.top-icon { width: 46px; height: 46px; padding: 12px; }
.button { min-height: var(--av-control-height); height: auto; padding: 11px 17px; gap: 9px; line-height: 1.25; }
.button > span { width: 17px; height: 17px; }
.button.compact, .button.small { min-height: 42px; height: auto; padding: 9px 13px; }
.role-switcher { min-height: 46px; height: auto; padding: 7px 11px; }
.view { padding: 32px clamp(22px, 2.8vw, 46px) 60px; }
.hero-row, .page-heading { gap: 20px; margin-bottom: 26px; }
.hero-row h1, .page-heading h1 { line-height: 1.16; }
.hero-sub, .page-heading p { line-height: 1.65; max-width: 78ch; }
.hero-actions, .heading-actions, .header-actions { gap: 10px; flex-wrap: wrap; }
/* Spacing and card architecture: Carbon's spacious 48px tables + Fluent 4/8px grid */
.signal-strip { gap: 16px; margin-bottom: 17px; }
.signal-card { padding: 19px 21px; min-width: 0; }
.signal-card > strong { margin: 12px 0 7px; line-height: 1.1; }
.signal-card p { min-height: 0; line-height: 1.5; margin-bottom: 12px; }
.signal-card button, .risk-asset-card, .report-card, .approval-item, .route,
.quality-queue button, .action-feed button, .layer-list label { min-height: 44px; }
.dashboard-grid { gap: 18px; }
.card, .approval-panel, .assurance-score, .assurance-breakdown { padding: 24px; min-width: 0; }
.card-header { gap: 18px; margin-bottom: 20px; flex-wrap: wrap; }
.card-header h2 { line-height: 1.3; }
.card-header p { line-height: 1.55; }
.status-chip { padding: 7px 11px; line-height: 1.25; white-space: normal; }
.executive-ribbon { gap: 15px; margin-bottom: 16px; }
.ribbon-metric, .trend-viz { padding: 17px 19px; }
.campaign-layout { grid-template-columns: minmax(170px, 210px) minmax(0, 1fr); gap: 24px; }
.campaign-numbers, .risk-asset-grid, .spatial-kpis { gap: 13px; }
.campaign-numbers > div, .risk-asset-card, .spatial-kpis div { padding: 15px; }
.site-progress, .risk-reasons { gap: 10px; }
.site-progress > div, .assurance-breakdown > div { grid-template-columns: minmax(110px, 150px) minmax(0, 1fr) 50px; gap: 12px; }
.chart-row { grid-template-columns: minmax(95px, 130px) minmax(0, 1fr) 42px; gap: 12px; }
.action-feed button { padding: 16px 5px; gap: 12px; }
.risk-layout { gap: 18px; }
.risk-asset-card { min-width: 0; }
.risk-overview { grid-template-columns: minmax(170px, 205px) minmax(0, 1fr); gap: 18px; }
.risk-factor { grid-template-columns: minmax(130px, 175px) minmax(0, 1fr) 48px; gap: 12px; padding: 13px 16px; }
/* Registers, filters, scrollable tables and inline actions */
.register-toolbar { gap: 14px; margin-bottom: 14px; flex-wrap: wrap; }
.view-tabs, .workbench-tabs { gap: 7px; }
.view-tabs button, .workbench-tabs button, .admin-nav button { height: auto; min-height: 44px; padding: 10px 14px; }
.table-command { height: auto; min-height: 60px; padding: 10px 18px; gap: 14px; }
.table-search { gap: 10px; }
.table-wrap, .av-table-wrap { overflow-x: auto; max-width: 100%; }
.asset-table { width: 100%; line-height: 1.45; }
.asset-table th { padding: 15px 17px; text-align: left; letter-spacing: .04em; line-height: 1.35; }
.asset-table td { padding: 15px 17px; line-height: 1.5; }
.asset-table tbody tr { min-height: var(--av-table-row-height); }
.table-footer { padding: 14px 18px; gap: 12px; flex-wrap: wrap; }
.table-footer button, .row-more { min-width: 38px; min-height: 38px; height: auto; }
.row-more { padding: 8px; }
.field-layout { gap: 18px; }
.inbox-layout { grid-template-columns: minmax(295px, 360px) minmax(0, 1fr); gap: 18px; }
.approval-filter { padding: 12px; gap: 8px; }
.approval-filter button { min-height: 43px; height: auto; padding: 8px 12px; }
.approval-item { padding: 16px; }
.field-modebar { padding: 14px 17px; gap: 14px; }
.confirm-grid { gap: 12px; }
.confirm-tile { min-height: 52px; padding: 13px; gap: 10px; }
.field-form, .admin-form { gap: 14px; }
.field-form label, .decision-note, .admin-form label { gap: 8px; }
.field-form input, .field-form select, .field-form textarea,
.admin-form input, .admin-form select, .admin-form textarea,
.decision-note textarea, .av-form input, .av-search input,
.palette-search input { min-height: 46px; padding: 11px 13px; max-width: 100%; }
.field-form textarea, .admin-form textarea { min-height: 96px; }
.report-card { padding: 19px; gap: 14px; }
.report-categories { gap: 15px; }
.admin-layout { grid-template-columns: minmax(215px, 255px) minmax(0, 1fr); gap: 16px; }
.admin-nav { padding: 10px; }
.drawer-panel { width: min(890px, 96vw); }
.scan-modal-card, .workflow-modal { padding: 26px; }
.notification-panel { width: min(450px, calc(100vw - 24px)); }
#toast { padding: 13px 17px; max-width: min(460px, 90vw); }
/* GIS controls: resize controls, not geographic scale or map tiles. */
.sa-interactive-map .maplibregl-ctrl-group button { width: 44px; height: 44px; }
.sa-interactive-map .maplibregl-popup-content { padding: 14px 16px; }
.gis-status-strip, .gis-side { gap: 13px; }
.gis-status-strip > div, .coord-inspector div { padding: 15px; }
.layer-list label { padding: 12px 5px; }
.map-attribution { max-width: 260px; line-height: 1.25; }
/* Administration console (separate dark-theme screen). */
.av-admin { grid-template-columns: 300px minmax(0, 1fr); }
.av-admin-nav { min-width: 0; padding: 26px 18px; }
.av-admin-nav nav { gap: 6px; }
.av-admin-navbtn { min-height: 48px; padding: 12px 14px; gap: 14px; line-height: 1.35; }
.av-admin-navbtn svg { width: 20px; height: 20px; flex-shrink: 0; }
.av-admin-main { padding: 36px clamp(22px, 3vw, 48px) 54px; }
.av-admin-top { margin-bottom: 29px; align-items: center; flex-wrap: wrap; }
.av-admin-content { gap: 23px; }
.av-admin-hero { padding: 28px; gap: 24px; }
.av-admin-metrics { gap: 14px; }
.av-admin-metric { padding: 20px; min-width: 0; }
.av-admin-grid, .av-role-grid, .av-health-grid { gap: 18px; }
.av-admin-card, .av-role-card, .av-health-card { padding: 23px; min-width: 0; }
.av-admin-card.flush { padding: 0; }
.av-admin-table th, .av-admin-table td { padding: 16px 19px; line-height: 1.45; }
.av-iconbtn { width: 44px; height: 44px; }
.av-linkbtn { min-height: 44px; padding: 10px 15px; }
.av-search { min-height: 48px; }
.av-form input { min-height: 46px; }
.av-mini { padding: 18px; }
.av-detail-list > div, .av-layer { padding: 14px 0; }
.av-admin :is(.av-admin-metric span,.av-admin-metric small,.av-checkrow small,
.av-admin-toolbar small,.av-usercell small,.av-inline-note,.av-layer span,
.av-detail-list span,.av-activity small,.av-ref-list small,.av-admin-top p) { color: #a3bbc9; }
/* Compact option remains distinct, but never reintroduces 7–9px labels. */
body.compact-mode .card { padding: 18px; }
body.compact-mode .asset-table td { padding: 11px 13px; }
body.compact-mode .signal-card { padding: 14px 15px; }
body.compact-mode .global-bar { height: 66px; }
/* Responsive reflow. Dense grids become 2/1 columns rather than overflowing. */
@media (max-width: 1400px) and (min-width: 1181px) {
  :root { --sidebar: 282px; }
  .exception-overview, .recon-summary { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .av-admin-metrics { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width: 1180px) {
  :root { --sidebar: 82px; }
  .sidebar { padding: 18px 12px; }
  .nav-item { justify-content: center; padding: 12px 4px; }
  .nav-item > span:first-child { flex-basis: 23px; width: 23px; height: 23px; }
  .brand-lockup { justify-content: center; }
  .av-admin { grid-template-columns: 245px minmax(0,1fr); }
  .av-admin-metrics { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .inbox-layout { grid-template-columns: minmax(260px, 320px) minmax(0, 1fr); }
  .risk-overview { grid-template-columns: 1fr; }
  .campaign-layout { grid-template-columns: 1fr; }
}
@media (max-width: 820px) {
  body { padding-bottom: 84px; }
  .sidebar { display: none; }
  .global-bar { top: 0; height: 68px; padding: 0 16px; }
  .view { padding: 24px 18px 110px; }
  .hero-row h1, .page-heading h1 { font-size: 30px; }
  .command-search { width: 100%; min-width: 0; }
  .global-actions { gap: 5px; }
  .signal-strip, .executive-ribbon, .gis-status-strip,
  .exception-overview, .recon-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .campaign-layout, .inbox-layout, .admin-layout, .risk-layout { grid-template-columns: 1fr; }
  .av-admin { grid-template-columns: 1fr; }
  .av-admin-nav { min-height: auto; padding: 16px; }
  .av-admin-nav nav { flex-direction: row; overflow-x: auto; gap: 8px; }
  .av-admin-navbtn { width: auto; flex-shrink: 0; white-space: nowrap; }
  .av-admin-navfoot { display: none; }
  .av-admin-main { padding: 24px 18px 35px; }
  .av-admin-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .av-admin-grid.two, .av-admin-grid.three, .av-role-grid { grid-template-columns: 1fr; }
  .av-admin-toolbar { flex-wrap: wrap; }
  .av-search { min-width: 0; width: 100%; }
  .mobile-bottom-nav { height: 76px; padding: 5px 8px max(8px,env(safe-area-inset-bottom)); }
  .mobile-bottom-nav button { min-height: 48px; font-size: 11px; line-height: 1.15; }
  .mobile-bottom-nav button > span { width: 22px; height: 22px; }
  .offline-dock { bottom: 88px; }
  .table-wrap, .av-table-wrap, .control-matrix { overscroll-behavior-inline: contain; }
  .role-switcher, .heading-actions, .hero-actions { max-width: 100%; }
}
@media (max-width: 520px) {
  .view { padding: 22px 14px 112px; }
  .hero-row h1, .page-heading h1 { font-size: 28px; }
  .signal-strip, .exception-overview, .recon-summary, .report-categories,
  .executive-ribbon, .gis-status-strip, .av-admin-metrics { grid-template-columns: 1fr; }
  .card, .approval-panel, .assurance-score, .assurance-breakdown { padding: 18px; }
  .card-header { margin-bottom: 14px; }
  .global-bar { padding-inline: 10px; }
  .command-search { height: 46px; padding-inline: 12px; }
  .dashboard-grid { gap: 14px; }
  .av-admin-top h1 { font-size: 30px; }
  .av-admin-hero { padding: 18px; flex-direction: column; align-items: stretch; }
  .av-admin-grid, .av-admin-mini-grid, .av-health-grid { grid-template-columns: 1fr; }
  .drawer-panel { width: 100%; }
  .notification-panel { width: calc(100vw - 16px); right: 8px; top: 8px; bottom: 8px; }
  .asset-table th, .asset-table td { padding: 12px 13px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}