/* Daily national map only. Shared maps and station views keep their own styles. */
.national-observation-page .national-observation-ranking-row > i small { display:block; margin-top:3px; color:#718d93; font-size:.52rem; line-height:1.3; }
.national-observation-page .national-observation-header h1 { font-size:clamp(32px,3.5vw,54px); line-height:1.1; letter-spacing:-.045em; }
.national-observation-page .national-observation-map-head { grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); }
.national-observation-page .national-observation-map { height:clamp(700px,80vh,960px); background:#dce9e8; }
.national-observation-page .national-observation-value-icon span {
  box-sizing:border-box; width:var(--label-width); height:var(--label-height);
  display:flex; align-items:center; justify-content:center;
  font-size:var(--label-size); font-weight:800; line-height:1;
  font-variant-numeric:tabular-nums; letter-spacing:-.035em;
  color:color-mix(in srgb,var(--value-color) 65%,#102a36);
  background:rgba(255,255,255,.97); border:1px solid #b7c8c3;
  border-bottom:4px solid var(--value-color); border-radius:6px;
  text-shadow:none; box-shadow:0 1px 4px #294e4826;
}
.national-observation-page .national-observation-value-icon:hover span,
.national-observation-page .national-observation-value-icon:focus-visible span { font-size:var(--label-size); filter:none; outline:2px solid #233e48; outline-offset:2px; }
.national-observation-page .leaflet-control-zoom a { color:#24454c; background:#fff; border-color:#bfceca; }
.national-observation-page .national-observation-legend { grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px 12px; max-width:280px; }
.national-observation-page .national-observation-legend > p,
.national-observation-page .national-observation-legend > small { grid-column:1/-1; }
.national-observation-page .national-observation-legend > div { grid-template-columns:14px 1fr; font-size:11px; }
.national-observation-page .national-observation-legend i { width:14px; height:14px; box-shadow:none; }
.national-observation-page .national-observation-legend small { max-width:250px; color:#b7c9ca; font-size:10px; }
.national-map-options { display:flex; justify-content:flex-end; margin:0 0 12px; color:#dbe8e5; font-size:13px; }
.national-map-options label { display:flex; align-items:center; gap:9px; cursor:pointer; padding:9px 12px; border:1px solid #47605f; border-radius:7px; }
.national-map-options input { width:17px; height:17px; margin:0; accent-color:#ed8c4d; cursor:pointer; }
.national-fullscreen-toggle { display:block; margin:0 0 12px auto; padding:10px 14px; border:1px solid #ffad72; border-radius:8px; background:#f47b35; color:#24160e; font-family:inherit; font-size:13px; font-weight:800; line-height:1.3; cursor:pointer; box-shadow:0 4px 14px #f47b3547; }
.national-fullscreen-toggle:hover { background:#ff944f; }
.national-fullscreen-toggle:focus-visible { outline:2px solid #ffab70; outline-offset:3px; }
body.national-map-fullscreen { overflow:hidden; }
#nationalMapStage.is-fullscreen { position:fixed; inset:0; z-index:2100; height:100dvh; box-sizing:border-box; display:flex; flex-direction:column; padding:10px; background:#10272d; isolation:isolate; }
#nationalMapStage.is-fullscreen .national-fullscreen-toggle { flex:none; margin-bottom:8px; }
#nationalMapStage.is-fullscreen .national-observation-map-panel { display:flex; flex-direction:column; flex:1; min-height:0; padding:0; margin:0; border:0; }
#nationalMapStage.is-fullscreen .national-observation-map-head { padding:0 0 8px; gap:12px; }
#nationalMapStage.is-fullscreen .national-observation-map-heading { padding:0; }
#nationalMapStage.is-fullscreen .national-observation-map-heading h2 { margin:0; font-size:16px; }
#nationalMapStage.is-fullscreen .national-observation-map-heading .lightviz-eyebrow,
#nationalMapStage.is-fullscreen .normal-reference,
#nationalMapStage.is-fullscreen .water-national-date,
#nationalMapStage.is-fullscreen .national-observation-map-note { display:none; }
#nationalMapStage.is-fullscreen .national-map-options { position:absolute; top:10px; left:10px; margin:0; }
#nationalMapStage.is-fullscreen .national-map-options label { padding:8px; font-size:12px; }
#nationalMapStage.is-fullscreen .national-observation-map-wrap { flex:1; min-height:0; }
#nationalMapStage.is-fullscreen .national-observation-map { width:100%; height:100%; }
@media (max-width:1100px) {
  .national-observation-page .national-observation-map-head { grid-template-columns:1fr; }
}
@media (max-width:700px) {
  .national-observation-page .national-observation-map { height:740px; }
  .national-observation-page .national-observation-legend { position:static; max-width:none; grid-template-columns:repeat(3,minmax(0,1fr)); border-radius:0; }
  .national-observation-page .national-observation-legend > div { font-size:10px; }
  #nationalMapStage.is-fullscreen { padding:8px; }
  #nationalMapStage.is-fullscreen .national-observation-map-head { display:block; }
  #nationalMapStage.is-fullscreen .national-observation-map-heading { margin:0 0 6px; }
  #nationalMapStage.is-fullscreen .national-observation-map-heading h2 { font-size:13px; }
  #nationalMapStage.is-fullscreen .national-observation-compact-controls { padding:6px; gap:6px; }
  #nationalMapStage.is-fullscreen .national-observation-date-control { grid-template-columns:minmax(0,1fr) 125px; gap:6px; }
  #nationalMapStage.is-fullscreen .national-observation-date-summary { display:none; }
  #nationalMapStage.is-fullscreen .national-observation-date-input span { display:none; }
  #nationalMapStage.is-fullscreen .national-observation-map-wrap { display:flex; flex-direction:column; }
  #nationalMapStage.is-fullscreen .national-observation-map { flex:1; min-height:0; }
  #nationalMapStage.is-fullscreen .national-observation-legend { flex:none; padding:7px; gap:4px; max-height:22vh; overflow:auto; }
  #nationalMapStage.is-fullscreen .national-observation-legend small { display:none; }
  #nationalMapStage.is-fullscreen .national-fullscreen-toggle { padding:9px; font-size:11px; }
}
