/* City exploration: a quiet reading canvas, with persistent topic navigation. */
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
[hidden] { display:none !important; }
:is(.city-page,.compare-page) { --explorer-green:#14665f; --explorer-border:#dce3dc; --explorer-muted:#61716d; }
:is(.city-page,.compare-page) :focus-visible { outline:3px solid #b77a28; outline-offset:4px; }
.city-page { max-width:1440px; padding:0 38px 70px; margin:auto; }
.city-identity { padding:24px 0 30px; border-bottom:1px solid var(--explorer-border); }
.city-identity .breadcrumbs { margin:0 0 22px; font-size:12px; }
.city-identity-row { display:flex; justify-content:space-between; gap:24px; align-items:center; }
.city-identity .section-kicker { margin:0 0 8px; font-size:10px; letter-spacing:.14em; }
.city-identity h1 { display:flex; flex-wrap:wrap; gap:16px; align-items:center; margin:0; font-size:clamp(32px,4vw,52px); line-height:1.1; letter-spacing:-.04em; }
.city-code { font-size:13px; font-weight:500; letter-spacing:.06em; padding:7px 10px; border:1px solid #d3ddd6; border-radius:6px; color:var(--explorer-muted); }
.city-identity-meta { margin:11px 0 0; font-size:13px; color:var(--explorer-muted); }
.city-identity-meta span { margin-left:16px; color:#79847d; }
.city-workspace { display:grid; grid-template-columns:225px minmax(0,1fr); gap:32px; align-items:start; padding-top:30px; }
.city-page .city-section-nav { position:sticky; top:94px; padding:0 16px 12px 0; margin:0; border:0; border-right:1px solid var(--explorer-border); border-radius:0; background:transparent; box-shadow:none; max-height:calc(100vh - 106px); overflow-y:auto; scrollbar-width:thin; z-index:5; }
.city-nav-search { display:block; padding:0 0 14px; }
.city-nav-search input { width:100%; border:1px solid var(--explorer-border); background:#fff9; border-radius:7px; min-height:38px; padding:8px 10px; font-size:11px; }
.city-page .city-tab-grid { display:flex; flex-direction:column; gap:3px; }
.city-nav-group { padding:17px 10px 8px; color:#72817a; font-size:9px; letter-spacing:.14em; font-weight:750; text-transform:uppercase; }
.city-nav-group:first-child { padding-top:4px; }
.city-page .city-tab-grid button { display:flex; gap:9px; justify-content:flex-start; align-items:center; min-height:40px; width:100%; padding:9px 10px; text-align:left; color:#526660; background:transparent; border:1px solid transparent; box-shadow:none; border-radius:7px; font-size:11px; line-height:1.3; font-weight:550; }
.city-page .city-tab-grid button svg { flex-shrink:0; width:17px; height:17px; opacity:.75; }
.city-page .city-tab-grid button { flex:0 0 auto; }
.city-page .city-tab-grid button span { min-width:0; }
.city-page .city-tab-grid button small { margin-left:auto; padding:2px 5px; color:inherit; background:#ffffff80; font-size:9px; }
.city-page .city-tab-grid button:hover { background:#e9eee7; transform:none; }
.city-page .city-tab-grid button[aria-selected="true"] { color:#fff; background:var(--explorer-green); border-color:var(--explorer-green); box-shadow:0 3px 8px #14665f13; }
.city-page .city-tab-grid button[aria-selected="true"] svg { opacity:1; }
.city-page .city-tab-grid button[aria-selected="true"] small { background:#ffffff26; }
.city-page .city-layout { display:block; margin:0; padding:0; min-width:0; }
.city-page .dashboard-main { min-width:0; gap:24px; }
.city-page .city-tab-panel { min-width:0; }
.city-page .city-tab-compact { display:none; }
.city-page .dashboard-section { border-radius:12px; box-shadow:0 3px 14px #173b3110; }
.explorer-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:24px; margin-bottom:26px; }
.explorer-heading .section-kicker { font-size:9px; letter-spacing:.16em; margin:0 0 10px; }
.explorer-heading h2 { font-size:clamp(25px,2.7vw,36px); font-weight:650; letter-spacing:-.035em; line-height:1.14; margin:0; }
.explorer-heading p:not(.section-kicker) { color:var(--explorer-muted); font-size:13px; line-height:1.6; margin:10px 0 0; }
.coverage-pill { display:inline-flex; flex-shrink:0; align-items:center; gap:7px; margin-top:5px; border:1px solid #d5dfd4; padding:7px 10px; border-radius:20px; color:#537161; font-size:10px; font-weight:600; background:#edf2e8; white-space:nowrap; }
.coverage-pill::before { content:""; width:5px; height:5px; border-radius:100%; background:#6c8a54; }
.overview-bento { display:grid; grid-template-columns:1.12fr 1fr 1fr; gap:14px; }
.overview-feature { position:relative; grid-row:span 2; padding:26px; background:#154f48; color:#fff9ed; border-radius:14px; overflow:hidden; }
.overview-feature::after { content:""; position:absolute; width:250px; height:250px; border:1px solid #d8e8b81f; border-radius:50%; right:-160px; top:12px; box-shadow:0 0 0 35px #d8e8b809,0 0 0 70px #d8e8b806; pointer-events:none; }
.feature-icon { display:inline-flex; width:42px; height:42px; align-items:center; justify-content:center; background:#ffffff13; border:1px solid #ffffff20; border-radius:11px; margin-bottom:28px; }
.overview-feature .section-kicker { color:#c1d2ba; font-size:9px; letter-spacing:.15em; margin:0 0 12px; }
.overview-feature h3 { font-size:clamp(24px,2.3vw,33px); font-weight:550; line-height:1.15; letter-spacing:-.035em; margin:0 0 18px; }
.overview-feature h3 { color:#fff9ed; }
.overview-feature > p:not(.section-kicker) { color:#c9dbcf; font-size:12px; line-height:1.75; margin-bottom:22px; }
.explorer-button { display:inline-flex; align-items:center; justify-content:center; gap:14px; min-height:43px; padding:11px 16px; border:1px solid var(--explorer-green); border-radius:7px; background:var(--explorer-green); color:white; font-size:12px; font-weight:650; cursor:pointer; text-decoration:none; }
.explorer-button:hover { filter:brightness(.96); }
.explorer-button:disabled { opacity:.5; cursor:default; }
.explorer-button.secondary { background:#fafbf6; color:var(--explorer-green); border-color:#cedbd1; }
.overview-feature .explorer-button { background:#e7edce; border-color:#e7edce; color:#184f44; width:100%; justify-content:space-between; }
.overview-place-count { border-top:1px solid #ffffff26; margin-top:32px; padding-top:20px; color:#d3decf; font-size:10px; line-height:1.6; }
.overview-place-count strong { display:block; color:#fff; font-size:31px; font-weight:550; letter-spacing:-.03em; }
.overview-place-count small { display:block; opacity:.7; margin-top:5px; font-size:9px; }
.overview-fact { display:flex; flex-direction:column; min-width:0; padding:22px; border:1px solid #e2e5da; border-radius:13px; background:#fdfdf7; box-shadow:0 3px 8px #173b3103; }
.fact-top { display:flex; align-items:center; gap:9px; color:#5f736c; margin-bottom:23px; font-size:10px; }
.fact-top svg { color:#527a6b; width:18px; }
.overview-fact > strong { display:block; font-weight:600; font-size:clamp(25px,2.6vw,35px); color:#1d443b; letter-spacing:-.04em; line-height:1.1; }
.overview-fact > strong small { font-size:11px; letter-spacing:0; font-weight:500; }
.overview-fact h3 { font-size:11px; font-weight:650; line-height:1.5; margin:12px 0 7px; }
.overview-fact p { color:#738078; font-size:10px; line-height:1.6; margin:0 0 18px; }
.overview-fact .text-link { font-size:10px; margin-top:auto; line-height:1.6; text-align:left; color:#276c5a; }
.overview-bottom { display:grid; grid-template-columns:1.1fr 1fr; gap:14px; margin-top:14px; }
.overview-bottom article { min-width:0; padding:24px; border:1px solid #dce4da; border-radius:13px; background:#fafbf5; }
.overview-bottom .section-kicker { font-size:9px; margin:0 0 10px; }
.overview-bottom h3 { font-weight:600; font-size:18px; letter-spacing:-.025em; margin:0 0 15px; }
.population-range { display:flex; gap:22px; align-items:center; font-size:24px; margin:15px 0 0; }
.population-range strong { font-weight:600; }
.population-range small { display:block; font-size:10px; color:#78837b; font-weight:400; margin-top:4px; }
.population-range > span { color:#a4b4a4; }
.mini-trend { width:100%; height:75px; display:block; margin:6px 0 12px; }
.overview-population .text-link,.overview-trust .text-link { font-size:11px; }
.overview-trust .feature-icon { margin-bottom:17px; color:#537761; background:#e9efe2; border-color:#dae4d4; width:36px; height:36px; }
.overview-trust p { color:var(--explorer-muted); font-size:12px; line-height:1.8; }
.overview-trust > div { display:flex; flex-direction:column; gap:12px; align-items:flex-start; margin-top:22px; }
.source-disclosure { background:#fafbf6; border:1px solid var(--explorer-border); border-radius:9px; margin-top:22px; padding:15px 18px; font-size:12px; line-height:1.7; color:var(--explorer-muted); }
.source-disclosure summary { color:#36544a; font-size:12px; font-weight:600; cursor:pointer; }
.source-disclosure a { text-decoration:underline; text-underline-offset:3px; }
.overview-profile .city-profile { margin-top:16px; }
.explorer-section { min-width:0; }
.place-filters,.fuel-toolbar,.data-explorer-toolbar { display:flex; gap:14px; align-items:flex-end; flex-wrap:wrap; padding:18px; border:1px solid var(--explorer-border); border-radius:11px; background:#fafbf6; }
:is(.place-filters,.fuel-toolbar,.data-explorer-toolbar,.comparison-toolbar) label { display:block; font-size:11px; }
:is(.place-filters,.fuel-toolbar,.data-explorer-toolbar,.comparison-toolbar) label > span { display:block; margin-bottom:8px; color:#536b60; font-weight:600; }
:is(.place-filters,.fuel-toolbar,.data-explorer-toolbar,.comparison-toolbar) :is(input[type="search"],select) { min-height:43px; width:100%; padding:9px 12px; border:1px solid #ced9ce; border-radius:7px; background:white; color:#2a493f; font-size:12px; }
.search-field { flex:1; min-width:160px; }
.place-filters label.check-filter { display:flex; align-items:center; gap:8px; min-height:43px; white-space:nowrap; }
.place-filters .check-filter span { margin:0; }
.check-filter input { width:17px; height:17px; accent-color:var(--explorer-green); }
.place-categories { display:flex; flex-wrap:wrap; gap:7px; margin:18px 0; }
.place-categories button { display:inline-flex; gap:8px; align-items:center; border:1px solid #d6dfd4; background:#fafaf3; border-radius:20px; padding:8px 12px; font-size:10px; color:#52675b; cursor:pointer; }
.place-categories button span { opacity:.65; font-size:9px; }
.place-categories button[aria-pressed="true"] { background:#e0ebdf; border-color:#89a98f; color:#205139; font-weight:650; }
.place-workspace { display:grid; grid-template-columns:minmax(260px,.95fr) minmax(0,1.1fr); gap:16px; align-items:start; }
.place-list-area { min-width:0; }
.result-summary { font-size:11px; color:#63776a; line-height:1.5; margin:14px 0; }
.place-list-area > .result-summary { margin:0 0 12px; min-height:16px; }
.place-results { max-height:600px; overflow-y:auto; padding-right:6px; scrollbar-width:thin; }
.place-card { margin-bottom:10px; background:#fffef8; border:1px solid #dee3d8; border-radius:10px; padding:16px; }
.place-card-top { display:flex; gap:10px; align-items:flex-start; }
.place-pin { flex-shrink:0; width:29px; height:29px; border:0; border-radius:50%; background:#e3ecdc; color:#285d42; font-size:11px; font-weight:700; cursor:pointer; }
.place-type { display:block; color:#738171; font-size:9px; margin-bottom:5px; }
.place-card h3 { font-size:14px; font-weight:650; margin:0; line-height:1.4; }
.place-card p { color:#65776a; font-size:11px; line-height:1.6; margin:10px 0; }
.place-hours strong { display:block; font-size:10px; }
.place-links { display:flex; gap:13px; flex-wrap:wrap; margin-top:14px; font-size:10px; color:#206e51; }
.place-links button { padding:0; border:0; background:transparent; font-size:inherit; cursor:pointer; text-decoration:underline; text-underline-offset:3px; }
.place-provenance { margin-top:12px; border-top:1px solid #e8eadd; padding-top:10px; font-size:9px; color:#7a8474; }
.place-provenance summary { cursor:pointer; }
.place-provenance p { font-size:10px; margin:5px 0; }
.verified-badge { display:inline-block; border:1px solid #c8dcc9; background:#edf5e8; border-radius:5px; padding:5px 7px; color:#3b6f39; font-size:9px; margin:9px 0 2px; }
.place-map-area { position:sticky; top:98px; padding-top:28px; min-width:0; }
.place-map { height:565px; border:1px solid #d4ded2; border-radius:11px; background:#e9ede1; z-index:1; }
.place-map .leaflet-control-attribution { font-size:10px; }
.number-map-pin span { display:flex; align-items:center; justify-content:center; width:30px; height:30px; border:2px solid white; border-radius:50%; background:#14665f; color:white; box-shadow:0 2px 6px #123e4055; font-size:11px; font-weight:700; }
.number-map-pin::after { content:""; position:absolute; left:11px; top:28px; border:4px solid transparent; border-top-color:#14665f; }
.map-caption-small { font-size:9px; line-height:1.6; color:#6d7a6c; margin:9px 3px; }
.map-caption-small a { text-decoration:underline; }
.explorer-pagination { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:15px; font-size:11px; }
.explorer-pagination button { min-height:37px; padding:8px 12px; border:1px solid #d3ddcf; border-radius:6px; background:#fafbf5; font-size:11px; cursor:pointer; }
.explorer-pagination button:disabled { opacity:.4; cursor:default; }
.compare-search { position:relative; flex:1; min-width:220px; }
.suggestions { position:absolute; top:100%; left:0; right:0; z-index:20; background:#fffef8; border-radius:7px; box-shadow:0 12px 28px #163b3026; overflow:hidden; }
.suggestions:empty { display:none; }
.suggestions button { display:block; width:100%; padding:13px; background:transparent; border:0; border-bottom:1px solid #ebede3; text-align:left; cursor:pointer; font-size:12px; }
.suggestions button:hover,.suggestions button:focus { background:#e9f0e2; }
.suggestions small { display:block; font-size:10px; margin-top:4px; color:#7b8475; }
.suggestions p { padding:8px 15px; font-size:12px; }
.comparison-chips { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:18px 0 23px; font-size:10px; }
.comparison-chips button,.comparison-home { border:1px solid #c6d7c8; border-radius:20px; padding:7px 12px; background:#e7f0e2; font-size:11px; color:#225938; }
.comparison-chips button { cursor:pointer; background:#f7f2e7; border-color:#ded3b9; color:#825c33; }
.comparison-national { margin-left:auto; color:#738274; }
.fuel-summary-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin-bottom:26px; }
.fuel-summary-grid article { display:flex; flex-direction:column; min-width:0; padding:20px; border-radius:10px; background:#fdfdf7; border:1px solid var(--explorer-border); }
.fuel-summary-grid span { font-size:10px; color:#67806b; margin-bottom:14px; }
.fuel-summary-grid strong { font-size:25px; font-weight:600; letter-spacing:-.04em; }
.fuel-summary-grid small { font-size:10px; line-height:1.6; color:#7a8677; margin-top:9px; }
.fuel-trend-panel { padding:22px; border:1px solid var(--explorer-border); border-radius:12px; background:#fffef9; }
.subsection-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; }
.subsection-heading h3 { margin:0; font-size:18px; font-weight:600; letter-spacing:-.025em; }
.subsection-heading p { margin:8px 0 12px; color:#738070; font-size:11px; line-height:1.65; }
.subsection-heading .text-link { flex-shrink:0; font-size:10px; }
.fuel-chart { margin:15px 0; }
.fuel-chart svg { width:100%; height:auto; display:block; overflow:visible; }
.fuel-chart text { font-family:inherit; font-size:10px; fill:#738174; }
.fuel-chart circle { cursor:crosshair; }
.fuel-chart circle:hover { r:5; }
.chart-legend { display:flex; flex-wrap:wrap; justify-content:center; gap:12px 22px; margin-top:6px; font-size:10px; }
.chart-legend span { display:flex; align-items:center; gap:7px; }
.chart-legend i { display:block; width:19px; height:3px; border-radius:3px; }
.small-note { color:#738070; font-size:10px; line-height:1.7; }
.station-heading { margin-top:30px; }
.table-scroll { width:100%; overflow-x:auto; border:1px solid var(--explorer-border); border-radius:9px; background:#fffef9; }
.explorer-table { width:100%; border-collapse:collapse; font-size:12px; text-align:left; }
.explorer-table th,.explorer-table td { padding:14px 16px; border-bottom:1px solid #e5e9df; vertical-align:top; line-height:1.5; }
.explorer-table thead th { background:#eef2e7; color:#62765e; font-size:10px; font-weight:600; white-space:nowrap; }
.explorer-table tbody th { font-weight:550; color:#365544; }
.explorer-table td { color:#576d54; }
.explorer-table small { display:block; font-size:9px; font-weight:400; color:#7a8875; margin:3px 0; }
.explorer-table tbody tr:last-child :is(th,td) { border-bottom:0; }
.explorer-table tbody tr:hover { background:#f8faf2; }
.explorer-table a { text-decoration:underline; text-underline-offset:3px; font-size:10px; }
.explorer-table td:nth-child(2) { font-variant-numeric:tabular-nums; }
.explorer-table .stale-label { color:#9a6827; }
.explorer-empty,.explorer-error { padding:26px 20px; border:1px dashed #d2ddca; background:#f9fbf1; border-radius:10px; font-size:12px; line-height:1.7; }
.explorer-empty h3 { font-size:17px; margin:0 0 8px; }
.explorer-empty p { margin:0; color:#7a8671; }
.explorer-error { color:#a34931; border-color:#dcb7a7; }
.explorer-loading { padding:35px; font-size:13px; color:#72816b; }
[aria-busy="true"] { opacity:.65; }
.data-explorer-toolbar select { max-width:300px; }
.data-explorer-toolbar .explorer-button { font-size:11px; }
.compare-page { max-width:1240px; margin:auto; padding:0 40px 60px; }
.compare-hero { padding:56px 0 36px; border-bottom:1px solid var(--explorer-border); }
.compare-hero h1 { font-size:clamp(42px,5.7vw,76px); line-height:1.02; letter-spacing:-.055em; font-weight:650; margin:18px 0; }
.compare-hero h1 em { color:#608268; font-style:normal; }
.compare-hero > p:not(.section-kicker) { color:#6b7c6a; font-size:14px; line-height:1.75; }
.compare-workspace { padding-top:30px; }
.comparison-toolbar { display:flex; align-items:flex-end; gap:30px; justify-content:space-between; }
.comparison-toolbar .compare-search { max-width:460px; }
[data-comparison-status] { min-height:20px; margin:15px 0; color:#648063; font-size:11px; }
.compare-city-cards { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin:20px 0 30px; }
.compare-city-cards article { position:relative; background:#fffef7; border:1px solid #d5dfd0; padding:23px 20px; border-radius:12px; min-width:0; }
.compare-city-cards .section-kicker { font-size:9px; }
.compare-city-cards h2 { font-size:23px; letter-spacing:-.035em; font-weight:600; margin:16px 0 7px; overflow-wrap:anywhere; }
.compare-city-cards p { font-size:11px; color:#75836e; margin:0 0 23px; }
.compare-city-cards .text-link { font-size:11px; }
.remove-city { position:absolute; right:8px; top:8px; width:26px; height:26px; border:0; border-radius:50%; background:#eff1e6; color:#70846b; cursor:pointer; font-size:18px; }
.compare-add { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; min-height:185px; border:1px dashed #b9cdb3; background:#edf3e8; color:#608554; border-radius:12px; padding:20px; cursor:pointer; }
.compare-add strong { font-size:12px; }
.compare-add span { font-size:10px; }
.comparison-actions { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; margin-bottom:14px; font-size:11px; }
.comparison-actions .text-link { font-size:11px; }
.comparison-table { min-width:600px; }
.comparison-table td { min-width:150px; font-weight:600; font-size:14px; }
.comparison-table thead th { font-size:13px; padding:20px 16px; }
.comparison-table th:first-child { min-width:220px; }
.comparison-table .comparison-family th { padding:12px 16px; background:#eaf0e0; color:#5b7850; font-size:10px; letter-spacing:.08em; text-transform:uppercase; }
.comparison-table small { font-size:10px; margin-top:5px; }
.comparison-notes { max-width:800px; padding:30px 0; color:#6c7e62; }
.comparison-notes h2 { font-size:18px; color:#33532d; font-weight:600; }
.comparison-notes p { font-size:12px; line-height:1.8; }
.comparison-notes a { font-size:11px; text-decoration:underline; text-underline-offset:4px; }
.comparison-empty { padding:45px 26px; background:#e7eddd; border-radius:12px; text-align:center; color:#5c7354; }
.comparison-empty p { font-size:12px; }
.comparison-empty strong { display:block; max-width:500px; margin:auto; font-size:24px; font-weight:550; letter-spacing:-.025em; line-height:1.5; }
@media(min-width:1440px) { .city-page { padding-left:50px; padding-right:50px; } }
@media(max-width:1190px) {
  .city-page { padding-left:24px; padding-right:24px; }
  .city-workspace { grid-template-columns:198px minmax(0,1fr); gap:24px; }
  .overview-bento { grid-template-columns:1fr 1fr; }
  .overview-feature { grid-column:1 / -1; grid-row:auto; display:grid; grid-template-columns:1fr 1fr; gap:0 30px; }
  .overview-feature .feature-icon { display:none; }
  .overview-feature h3 { grid-column:1; grid-row:2 / 4; }
  .overview-feature > .section-kicker { grid-column:1; }
  .overview-feature > p:not(.section-kicker) { grid-column:2; grid-row:1 / 3; margin-top:0; }
  .overview-feature .explorer-button { grid-column:2; grid-row:3; }
  .overview-place-count { grid-column:1 / -1; margin-top:20px; padding-top:12px; }
  .overview-place-count strong { display:inline; font-size:22px; margin-right:7px; }
  .overview-place-count small { display:inline; margin-left:8px; }
  .place-workspace { grid-template-columns:minmax(240px,1fr) 1fr; }
  .fuel-summary-grid strong { font-size:22px; }
}
@media(max-width:999px) {
  .city-workspace { display:block; padding-top:0; }
  .city-page .city-section-nav { position:sticky; top:75px; padding:12px 0; border:0; background:#f4f0e8f5; backdrop-filter:blur(12px); max-height:none; overflow:visible; z-index:15; }
  .city-page .city-tab-grid,.city-nav-search { display:none; }
  .city-page .city-tab-compact { display:flex; align-items:center; gap:20px; }
  .city-tab-compact > span { font-size:10px; text-transform:uppercase; letter-spacing:.08em; color:#76826e; }
  .city-tab-compact select { min-width:0; flex:1; height:42px; border:1px solid #c5d4bc; border-radius:8px; padding:0 13px; background:#fcfdf7; font-size:12px; }
  .city-page .city-layout { padding-top:18px; }
  .overview-bento { grid-template-columns:1fr 1fr 1fr; }
  .overview-feature { display:block; grid-column:auto; grid-row:span 2; }
  .overview-feature .feature-icon { display:inline-flex; }
  .overview-feature > p:not(.section-kicker) { margin-top:16px; }
  .overview-place-count { margin-top:24px; }
  .overview-place-count strong,.overview-place-count small { display:block; margin-left:0; }
  .place-map-area { top:143px; }
  .compare-city-cards { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:700px) {
  .city-page { padding:0 16px 40px; }
  .city-identity { padding-top:18px; padding-bottom:22px; }
  .city-identity-row { align-items:flex-start; flex-direction:column; gap:18px; }
  .city-identity .breadcrumbs { font-size:10px; margin-bottom:21px; flex-wrap:wrap; }
  .city-identity h1 { font-size:36px; gap:10px; }
  .city-identity-meta { font-size:11px; }
  .city-identity-meta span { display:block; margin:5px 0 0; font-size:10px; }
  .city-identity-row > .explorer-button { min-height:37px; padding:7px 12px; font-size:11px; }
  .city-page .city-section-nav { top:72px; }
  .city-page .city-tab-compact { gap:12px; }
  .city-tab-compact > span { font-size:9px; max-width:60px; }
  .explorer-heading { gap:12px; flex-direction:column; margin-bottom:20px; }
  .explorer-heading h2 { font-size:28px; }
  .explorer-heading p:not(.section-kicker) { font-size:12px; }
  .coverage-pill { font-size:9px; padding:6px 9px; }
  .overview-bento { grid-template-columns:1fr 1fr; gap:10px; }
  .overview-feature { grid-column:1 / -1; grid-row:auto; padding:24px; }
  .overview-feature .feature-icon { margin-bottom:20px; }
  .overview-feature h3 { font-size:30px; max-width:300px; }
  .overview-feature > p:not(.section-kicker) { max-width:450px; }
  .overview-feature .explorer-button { max-width:300px; }
  .overview-place-count { margin-top:20px; padding-top:16px; }
  .overview-place-count strong { display:inline; margin-right:5px; }
  .overview-fact { padding:17px 14px; }
  .fact-top { font-size:9px; margin-bottom:20px; gap:6px; }
  .overview-fact > strong { font-size:25px; }
  .overview-fact > strong small { display:block; margin-top:5px; font-size:10px; }
  .overview-fact h3 { font-size:10px; }
  .overview-fact p,.overview-fact .text-link { font-size:10px; }
  .overview-bottom { grid-template-columns:1fr; }
  .place-filters,.fuel-toolbar,.data-explorer-toolbar { padding:14px; gap:12px; }
  .place-filters > .search-field,.data-explorer-toolbar > label { flex-basis:100%; }
  .place-filters > label:not(.search-field) { flex:1; }
  .place-filters label.check-filter { white-space:normal; }
  .place-workspace { display:flex; flex-direction:column; }
  .place-map-area { position:static; order:-1; width:100%; padding-top:0; }
  .place-map { height:280px; }
  .place-list-area { width:100%; }
  .place-results { max-height:none; padding:0; }
  .place-categories { gap:6px; }
  .place-categories button { padding:7px 9px; font-size:9px; }
  .fuel-toolbar > label { flex:1; }
  .fuel-toolbar .compare-search { flex-basis:100%; }
  .comparison-national { flex-basis:100%; margin-top:6px; }
  .fuel-summary-grid { gap:8px; grid-template-columns:1fr; }
  .fuel-summary-grid article { display:grid; grid-template-columns:1fr 1fr; padding:15px; }
  .fuel-summary-grid span { margin:0; line-height:1.5; align-self:center; padding-right:12px; }
  .fuel-summary-grid strong { text-align:right; font-size:23px; }
  .fuel-summary-grid small { grid-column:1 / -1; }
  .fuel-trend-panel { padding:15px 10px; }
  .subsection-heading { flex-direction:column; gap:4px; }
  .subsection-heading h3 { font-size:18px; }
  .subsection-heading .text-link { margin-bottom:8px; }
  .fuel-chart svg { min-height:0; }
  .fuel-chart text { font-size:20px; }
  .fuel-chart .chart-quarter-tick { display:none; }
  .chart-legend { gap:9px 13px; font-size:9px; }
  .explorer-table th,.explorer-table td { padding:12px; font-size:11px; }
  .station-table { min-width:560px; }
  [data-metric-rows] th { min-width:210px; }
  .data-explorer-toolbar select { max-width:none; }
  .compare-page { padding:0 18px 40px; }
  .compare-hero { padding:35px 0 26px; }
  .compare-hero h1 { font-size:52px; }
  .compare-hero > p:not(.section-kicker) { font-size:12px; }
  .comparison-toolbar { align-items:stretch; flex-direction:column; gap:12px; }
  .comparison-toolbar .compare-search { max-width:none; }
  .comparison-toolbar > button { align-self:flex-start; }
  .compare-city-cards { gap:10px; }
  .compare-city-cards article { padding:20px 14px; }
  .compare-city-cards h2 { font-size:22px; }
  .compare-add { padding:15px 10px; }
  .compare-add span { font-size:9px; }
  .comparison-table th:first-child { min-width:190px; }
  .comparison-empty { padding:30px 20px; }
  .comparison-empty strong { font-size:21px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }