/* ARC ONE UI refine, checkpoint 1 (2026-10-15): page chrome and map layout only.
   Colours, logo, marker glyphs/sizes and signal distribution are untouched. */
:root{--rf-line:#1f3746;--rf-radius:6px}

/* ---- Compact header ---- */
.topbar{height:44px}
.topbar .breadcrumb{font-size:13px}
.live-counts{padding-top:6px;padding-bottom:6px;gap:22px}
.live-counts strong{font-size:20px}
.live-counts span{font-size:12px}
.live-counts .fine{font-size:12px}
body:has(#map-view:not([hidden])) main{padding-top:10px}

/* ---- Map panel ---- */
#map-view .map-panel{border-radius:var(--rf-radius);position:relative}
#map-view .map-panel>.panel-heading{padding:8px 12px;min-height:0;border-bottom:1px solid var(--rf-line)}
#map-view .map-panel>.panel-heading p{font-size:13px;margin:0;color:var(--muted)}
#map-view .map-tools{gap:6px}
#map-view .map-tools button,#map-view .map-tools select{height:34px;min-height:34px;font-size:13px}
#map-view .map-tools #zoom-in,#map-view .map-tools #zoom-out{width:34px;padding:0;font-size:18px;line-height:1}
@media(min-width:681px){#map-view .map-layer-source{flex:0 0 auto;min-width:250px}}
@media(min-width:681px){#map-view .map-layer-source select{width:100%}}
#map-view .map-evidence{padding:8px 12px;border-bottom:1px solid var(--rf-line)}
#map-view .compact-map-toolbar{gap:6px}
#map-view .compact-map-toolbar select,#map-view .compact-map-toolbar label,#map-view .map-evidence-toggles label{min-height:34px;font-size:13px}
#evidence-hint{font-size:12px;margin:4px 0 0}
#evidence-hint:empty{display:none}
#map-view #map{height:calc(100dvh - 222px);min-height:420px}

/* Laptop/desktop: layer toolbar (left) and map tools (right) share one row */
@media(min-width:900px){
  #map-view .map-panel{display:grid;grid-template-columns:minmax(0,1fr) auto}
  #map-view .map-panel>*{grid-column:1/-1}
  #map-view .map-panel>.map-evidence{grid-column:1;grid-row:1}
  /* Heading box dissolves: tools join row 1, the count line moves directly under the map */
  #map-view .map-panel>.panel-heading{display:contents}
  #map-view .map-panel>.map-evidence{background:transparent;align-self:stretch;border-top:0}
  #map-view .map-panel>.panel-heading>.map-tools{grid-column:2;grid-row:1;align-self:stretch;display:flex;align-items:center;padding:8px 12px;border-bottom:1px solid var(--rf-line)}
  #map-view .map-panel>.map-canvas{order:-1}
  #map-view .map-panel>.panel-heading>div:first-child{grid-column:1/-1;padding:6px 12px;border-top:1px solid var(--rf-line)}
  #map-view .map-panel>.panel-heading h2{display:none}
  #map-view .map-panel>.panel-heading p{font-size:12px}
}

/* Below the map: legend and display toggles as one quiet strip */
#map-view .map-panel>.legend,#map-view .map-panel>.map-foot{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;padding:8px 12px;margin:0;font-size:12px;color:var(--muted);border-top:1px solid var(--rf-line)}
#map-view .map-panel>.map-foot{border-top:0;padding-top:0}
#evidence-window-controls>summary,#signal-bands>summary{font-size:13px;padding:8px 12px;cursor:pointer}
#basemap-status:empty{display:none}

/* ---- Phones / narrow screens ---- */
@media(max-width:680px){
  /* Main nav: one swipeable row instead of clipped buttons */
  .sidebar nav{flex-wrap:nowrap;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent);mask-image:linear-gradient(90deg,#000 88%,transparent);padding-right:28px}
  .sidebar nav::-webkit-scrollbar{display:none}
  .sidebar nav .nav-item{flex:0 0 auto;scroll-snap-align:start;font-size:13px}
  .live-counts{gap:14px;padding:6px 12px}
  .live-counts .fine{width:auto;margin-left:0}
  /* Map tools float over the top-right of the map instead of taking a row */
  #map-view .map-panel{display:grid;grid-template-columns:minmax(0,1fr)}
  #map-view .map-panel>*{grid-column:1}
  #map-view .map-panel>.map-evidence{grid-row:1}
  #map-view .map-panel>.map-canvas{grid-row:2}
  #map-view .map-panel>.panel-heading{grid-row:2;align-self:start;justify-self:end;z-index:500;border:0;padding:8px;background:none;pointer-events:none}
  #map-view .map-panel>.panel-heading>div:first-child{display:none}
  #map-view .map-panel>.panel-heading .map-tools{pointer-events:auto;display:flex;flex-direction:column;align-items:flex-end;gap:6px}
  #map-view .map-tools button,#map-view .map-tools select{height:40px;min-height:40px;background:rgba(2,6,9,.9);box-shadow:0 2px 8px rgba(0,0,0,.45)}
  #map-view .map-tools #zoom-in,#map-view .map-tools #zoom-out{width:40px;font-size:18px}
  #map-view .map-tools #fit-map,#map-view .map-tools select{width:108px;padding:0 8px}
  #map-view #map{height:calc(100dvh - 300px);min-height:360px}
}

/* ---- Readability floor: nothing operational below 12px (11px for small-caps labels) ---- */
.nav-label,.small-label,.radio-label,.top-actions .pill,#mode-badge{font-size:11px}
#updated,.connection,.sidebar-bottom p,#logout{font-size:12px}
#map-view .map-foot .checkbox,#map-range,#evidence-status,#evidence-window-controls p,#signal-bands p,#map-view .map-note{font-size:12px}
#map-view .signal-row,#map-view .signal-row strong,#map-view .signal-group h3{font-size:12px}
#map-view .signal-row small{font-size:11px}
#map-view .pill,#map-view .count,#phone-total{font-size:11px}
#map-view .recent-card p,#map-view .phone-panel .fine,#what-changed .fine,#what-changed label,#what-changed summary,#what-changed .changes-note{font-size:12px}
#map-view #map .leaflet-control-scale-line{font-size:11px}
/* attribution: an older rule forces 8px with !important on phones */
#map-view #map .leaflet-control-attribution{font-size:10px!important}