/* Source selection stays outside the optional advanced filters. */
.filter-fields,body[data-view=data] .filter-fields{display:grid;grid-template-columns:minmax(250px,330px);align-items:center;gap:12px}
.filter-fields .dataset-field{display:block;grid-column:auto;grid-row:auto;width:100%;margin:0;min-width:0}
.filter-fields label,.filter-fields select{width:100%;min-width:0;max-width:none}
.filters{gap:16px;margin-top:22px;margin-bottom:18px}
.metric-tabs{padding-top:16px;border-top:1px solid var(--line)}
body[data-view=data] .metric-tabs{padding-top:16px;padding-bottom:0;border-top:1px solid var(--line);border-bottom:0}
#export-link[hidden]{display:none!important}
.metric-toolbar{display:flex;align-items:center;gap:16px;min-width:0}
.metric-toolbar .metric-tabs{margin:0;padding:0;border:0;width:auto;flex-wrap:nowrap}
.advanced-filters{min-width:0}
.advanced-filter-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.advanced-filter-toggle{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:8px 12px;border:1px solid #cbdace;border-radius:6px;background:#fff;color:#355f4a;font-size:.875rem;font-weight:600;line-height:1.4;white-space:nowrap}
.advanced-filter-toggle .settings-chevron{display:block;flex:none;width:14px;height:14px}
.advanced-filter-toggle:hover{background:#f0f5ed;border-color:#9ab6a4}
.advanced-filter-toggle[aria-expanded=true]{background:#e8f1e7;border-color:#80a58b;color:#215d43}
.advanced-filter-toggle[aria-expanded=true] .settings-chevron{transform:rotate(180deg)}
.advanced-filter-toggle:focus-visible{outline:2px solid #5c9f88;outline-offset:3px}
.advanced-filter-fields{display:flex;align-items:center;flex-wrap:wrap;gap:12px;padding:8px 0 16px}
.advanced-filter-fields select,.advanced-metric-button{min-height:48px;font-size:var(--text-control);padding:10px 30px 10px 12px;color:#436553;background:#fff;border:1px solid #dce5d9;border-radius:5px;max-width:100%;cursor:pointer}
.advanced-metric-button{padding-right:12px;text-align:left}
.advanced-metric-button>span{font-size:var(--text-caption);padding:2px 6px;border-radius:3px;background:#e5ece2;margin-left:6px}
.advanced-metric-button.active{border-color:#80a58b;background:#edf4e7}
.advanced-filters .compare-controls{margin:0 0 16px}

.map-favorites{padding:18px 24px;background:#f8faf6;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.favorites-heading{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px}
.favorites-heading h3{display:flex;align-items:center;gap:8px;font-size:.9375rem;font-weight:600;line-height:1.5;color:var(--ink)}
.favorites-heading h3>span{font-size:1.25rem;color:var(--green)}
.favorite-save{min-height:40px;padding:8px 12px;border:1px solid #cbdace;border-radius:5px;background:#fff;color:#355f4a;font-size:var(--text-secondary);line-height:1.45}
.favorite-save:hover:not(:disabled){background:#eaf2e6;border-color:#88a68d}
.favorite-save[aria-pressed=true]{color:#215d43;background:#e8f1e3}
.favorite-save:disabled{color:#77857e;background:#f1f4ee;border-color:#dfe5dc;cursor:not-allowed}
.favorite-locations{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.favorite-chip{display:flex;align-items:stretch;max-width:100%;min-width:0;background:#fff;border:1px solid #d4e0d0;border-radius:6px;overflow:hidden}
.favorite-open{display:flex;align-items:center;min-height:40px;padding:7px 10px;text-align:left;color:#294f3b;font-size:var(--text-secondary);font-weight:600;line-height:1.4;min-width:0;overflow-wrap:anywhere}
.favorite-open:hover,.favorite-remove:hover{background:#eaf2e6}
.favorite-remove{flex-shrink:0;width:32px;min-height:40px;font-size:1.125rem;color:#718374;border-left:1px solid #edf1e9}
.favorites-hint{font-size:var(--text-caption);line-height:1.7;color:var(--muted);margin-top:12px}
.sample-favorite-actions{margin:0 0 20px}
.sample-favorite-actions .favorite-save{min-height:44px;font-size:var(--text-control)}
.mobile-map-coverage{display:none}
.map-panel .panel-heading{padding:18px 24px 6px;gap:4px 12px;align-items:end}
.map-panel .panel-heading>div:first-child{grid-column:1;grid-row:1}
.map-panel .panel-heading h2{margin-top:4px}
.map-panel .panel-heading .date-tag{grid-column:2;grid-row:1;align-self:end}
.map-panel .map-topline{padding-bottom:6px;line-height:1.5}
.map-panel .map-explorer{margin-top:6px}
.compact-select{display:none;position:relative}
.compact-select-trigger{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;min-height:48px;padding:10px 12px;border:1px solid #dce5d9;border-radius:5px;background:#fff;color:#355d46;font-size:1rem;text-align:left}
.compact-select-trigger>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.compact-select-trigger>svg{width:16px;height:16px;flex-shrink:0}
.compact-select-options{position:absolute;left:0;right:0;top:calc(100% + 5px);z-index:1200;max-height:min(320px,50dvh);overflow-y:auto;overscroll-behavior:contain;padding:4px;border:1px solid #cbd9cd;border-radius:6px;box-shadow:0 8px 24px #143f3524;background:#fff}
.compact-select-options[hidden]{display:none!important}
.compact-select-options>[role=option]{position:relative;display:block;width:100%;min-height:40px;margin:0;padding:9px 28px 9px 10px;border:0;border-radius:3px;font-size:.9375rem;line-height:22px;text-align:left;color:#355d46;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.compact-select-options>[aria-selected=true]{background:#e8f1e7;color:#195c4e;font-weight:600}
.compact-select-options>[aria-selected=true]::after{content:'✓';position:absolute;right:9px;top:9px}
.compact-select-options>[role=option]:hover,.compact-select-options>[role=option]:focus-visible{background:#f0f5ec;outline:2px solid #69a28a;outline-offset:-2px}
.compact-select-trigger:focus-visible{outline:2px solid #5c9f88;outline-offset:2px}
.map-canvas{position:relative}
.map-locate{position:absolute;left:12px;bottom:16px;z-index:600;display:flex;align-items:center;gap:7px;min-height:48px;padding:10px 12px;background:#fff;color:#264f49;border:1px solid #cfdbd3;border-radius:5px;box-shadow:0 2px 8px #123b1720;font-size:var(--text-control)}
.map-locate svg{width:20px;height:20px;flex-shrink:0}.map-locate:hover{background:#f1f6ef}.map-locate:disabled{color:#72817b;cursor:wait}.map-locate:focus-visible{outline:3px solid #5c9f88;outline-offset:3px}
.user-location-marker{background:none;border:0}.user-location-marker>span{display:block;width:22px;height:22px;border:3px solid #fff;border-radius:50%;background:#2874bf;box-shadow:0 0 0 5px #2874bf35,0 2px 5px #153e3160}

/* On wider screens, metrics lead on the left and the dataset sits on the right. */
@media(min-width:721px){
 .filters,body[data-view=data] .filters{grid-template-columns:max-content minmax(0,330px);column-gap:24px;justify-content:space-between;align-items:center}
 .filter-fields,body[data-view=data] .filter-fields{grid-column:2;grid-row:1;grid-template-columns:minmax(0,1fr)}
 .metric-toolbar{grid-column:1;grid-row:1}
 .metric-tabs,body[data-view=data] .metric-tabs{width:auto;flex-wrap:nowrap;padding:0;margin:0;border:0}
 .advanced-filters{grid-column:1/-1;grid-row:2}
}

@media(max-width:720px){
 #dataset-select{display:none}.compact-select{display:block}
 .filters{display:grid;gap:16px}.metric-tabs{margin-bottom:0}.metric-tab.more{margin-top:4px}
 .filter-fields,body[data-view=data] .filter-fields{grid-template-columns:minmax(0,1fr);gap:8px}
 .filter-fields .dataset-field{grid-column:1/-1}
 .metric-toolbar{gap:8px}
 .metric-toolbar .metric-tabs{display:flex;flex:1;justify-content:space-between;gap:0;min-width:0}
 .metric-toolbar .metric-tab{padding-left:4px;padding-right:4px}
 .metric-toolbar .advanced-filter-toggle{flex:none;padding-left:8px;padding-right:8px;gap:5px;font-size:.8125rem}
 .advanced-filter-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .advanced-filter-fields select,.advanced-metric-button{width:100%;min-width:0;font-size:var(--text-control);padding-left:10px;padding-right:24px}
 .advanced-filter-fields .compare-button{grid-column:1/-1;min-height:48px}
 .map-favorites{padding:16px 20px}.favorites-heading{align-items:flex-start}.favorite-save{font-size:var(--text-secondary)}
 .favorite-open{font-size:var(--text-secondary);min-height:44px}.favorite-chip{width:100%}.favorite-open{flex:1}.favorite-remove{width:44px;min-height:44px}
}

/* Compact mobile rows while retaining readable text and 44px touch targets. */
@media(max-width:720px){
 .content{padding-top:18px}
 .page-title{margin-bottom:10px}.page-title .eyebrow,.page-title p{display:none}
 .filters{margin-top:10px;gap:6px;margin-bottom:10px}
 .filter-fields,body[data-view=data] .filter-fields{gap:8px}
 .compact-select-trigger,.filter-fields select,.filter-fields label:first-child select{min-height:44px;padding-top:8px;padding-bottom:8px;line-height:1.4}
 .metric-tabs,body[data-view=data] .metric-tabs{padding-top:6px}
 .metric-tab{min-height:44px;padding:8px 6px}
 .map-panel .panel-eyebrow,.map-title-context{display:none}
 .map-panel .panel-heading{padding:10px 12px;gap:4px 8px;align-items:center}
 .map-panel .panel-heading>div:first-child{grid-column:1;grid-row:1}
 .map-panel .panel-heading h2{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 6px;font-size:1.125rem;margin-top:0}
 .map-panel .panel-heading .date-tag{grid-column:2;grid-row:1;justify-self:end;align-self:center;font-size:var(--text-caption)}
 .map-panel .panel-heading .date-tag.is-latest,.map-topline{display:none}
 .map-panel .map-explorer{margin-top:0}
 .mobile-map-coverage{display:block;margin-top:6px}
 .map-locate{left:10px;bottom:14px}
}
