@import "https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;600;700&display=swap";:root{--color-text:#102a43;--color-text-muted:#6b7c76;--color-text-subtle:#758880;--color-text-secondary:#496056;--color-text-inverse:#f5fbf8;--color-text-inverse-muted:#a6ccc0;--color-surface-page:#f3f7f5;--color-surface:#ffffffb3;--color-surface-raised:#ffffffd1;--color-surface-solid:#fff;--color-surface-error:#fff0eb;--color-surface-brand:#123c3a;--color-border:#d8e6df;--color-border-strong:#b9d3c8;--color-brand:#17735f;--color-success:#178f68;--color-warning:#aab8b1;--color-error:#c65a43;--color-error-text:#8d3d2e;--font-family-base:"Roboto", sans-serif;--font-size-xs:.75rem;--font-size-sm:.875rem;--font-size-md:1rem;--font-size-lg:1.25rem;--font-size-xl:1.5rem;--font-size-2xl:clamp(1.6rem, 4vw, 2.5rem);--font-size-3xl:clamp(1.6rem, 4vw, 3rem);--font-size-value:clamp(2rem, 5vw, 3.1rem);--font-weight-regular:400;--font-weight-medium:500;--font-weight-semibold:600;--line-height-tight:1;--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-7:1.75rem;--space-8:2rem;--space-12:3rem;--space-16:4rem;--size-content-max:67.5rem;--size-content-gutter:2.5rem;--size-mobile-content-max:32.5rem;--size-control-min:8.75rem;--size-card-min-height:10.375rem;--size-card-min-height-mobile:8.75rem;--size-status-dot:.5625rem;--size-chart-height:15rem;--radius-control:.25rem;--radius-card:.375rem;--radius-panel:.4375rem;--border-width-thin:.0625rem;--border-width-accent:.25rem;--shadow-tooltip:0 .3125rem 1rem #123c3a1f;--breakpoint-tablet:43.75rem;--breakpoint-small:24.375rem;font-family:var(--font-family-base);color:var(--color-text);background:var(--color-surface-page);font-synthesis:none;text-rendering:optimizelegibility}*{box-sizing:border-box}html,body,#root{height:100%}body{min-width:20rem;min-height:100vh;margin:0;overflow-y:auto}.app-shell{width:min(var(--size-content-max), calc(100% - var(--size-content-gutter)));min-height:100vh;padding:var(--space-6) 0 var(--space-4);margin:0 auto}.app-shell--viewport{min-height:100vh}.live-dashboard{min-height:calc(100vh - var(--space-6) - var(--space-4));flex-direction:column;display:flex}.connection{cursor:help;align-items:center;margin-left:auto;display:flex}.station-label-row{justify-content:space-between;align-items:center;gap:var(--space-4);margin-bottom:var(--space-2);flex-wrap:wrap;display:flex}.connection-dot{width:var(--size-status-dot);height:var(--size-status-dot);background:var(--color-warning);border-radius:50%}.connection-connected .connection-dot{background:var(--color-success)}.connection-disconnected .connection-dot{background:var(--color-error)}.hero-panel{justify-content:space-between;align-items:flex-end;gap:var(--space-6);padding:var(--space-6) var(--space-7);color:var(--color-text-inverse);background:var(--color-surface-brand);border-radius:var(--radius-panel);display:flex}.panel-label{color:var(--color-text-inverse-muted);font-size:var(--font-size-sm);text-transform:uppercase;margin:0}.station-name{font-size:var(--font-size-xl);font-weight:var(--font-weight-medium);margin:0}.update-meta{gap:var(--space-2);text-align:right;color:var(--color-text-inverse);font-size:var(--font-size-sm);display:grid}.update-meta-row{justify-content:flex-end;align-items:baseline;gap:var(--space-1);color:inherit;flex-wrap:nowrap;display:inline-flex}.update-meta strong{color:inherit;font-size:inherit;font-weight:400}.update-meta .countdown{color:inherit;font-size:inherit;font-weight:500}.feedback-message{margin:var(--space-6) 0 0;padding:var(--space-6);color:var(--color-text-secondary);background:var(--color-surface);border:var(--border-width-thin) dashed var(--color-border-strong);font-size:var(--font-size-sm)}.feedback-message--error{color:var(--color-error-text);border-color:var(--color-error);background:var(--color-surface-error)}.live-overview-grid{gap:var(--space-3);min-height:0;margin-top:var(--space-8);flex:1;grid-template-columns:minmax(0,2fr) minmax(0,1fr);display:grid}.measurement-grid{gap:var(--space-3);grid-template-rows:repeat(3,minmax(0,1fr));grid-template-columns:repeat(2,minmax(0,1fr));min-width:0;min-height:0;display:grid}.measurement{min-height:0;padding:var(--space-5);background:var(--color-surface);border:var(--border-width-thin) solid var(--color-border);border-radius:var(--radius-card)}.measurement-daylight{border-top:var(--border-width-accent) solid var(--daylight-color,var(--color-border-strong))}.measurement-air-quality{border-top:var(--border-width-accent) solid var(--air-quality-color,var(--color-border-strong))}.station-location-section{min-width:0;min-height:0;padding:var(--space-5);background:var(--color-surface);border:var(--border-width-thin) solid var(--color-border);border-radius:var(--radius-card);flex-direction:column;display:flex}.station-location-heading{margin:0 0 var(--space-3)}.station-location-map{border-radius:var(--radius-control);flex:1;min-height:0;overflow:hidden}.station-location-map .leaflet-container{width:100%;height:100%}.station-map-loading{width:100%;height:100%;color:var(--color-text-secondary);background:var(--color-surface-page);place-items:center;display:grid}.station-location-coordinates,.station-location-pending{margin:var(--space-3) 0 0;color:var(--color-text-secondary);font-size:var(--font-size-sm)}.measurement-heading{align-items:center;gap:var(--space-2);color:var(--color-text-muted);font-size:var(--font-size-sm);font-weight:var(--font-weight-regular);text-transform:uppercase;display:flex}.measurement-value{margin:var(--space-4) 0 0;color:var(--color-surface-brand);font-size:var(--font-size-value);line-height:var(--line-height-tight);font-weight:var(--font-weight-medium)}.measurement-value small{margin-left:var(--space-3);color:var(--color-text-muted);font-size:var(--font-size-sm)}.history-section{margin-top:var(--space-16)}.history-header{justify-content:space-between;align-items:flex-end;gap:var(--space-5);margin-bottom:var(--space-5);display:flex}.history-header h2{color:var(--color-surface-brand);font-size:var(--font-size-2xl);margin:0}.range-control{gap:var(--space-2);color:var(--color-text-muted);font-size:var(--font-size-xs);text-transform:uppercase;display:grid}.range-control select{min-width:var(--size-control-min);padding:var(--space-2) var(--space-3);color:var(--color-surface-brand);background:var(--color-surface-solid);border:var(--border-width-thin) solid var(--color-border-strong);border-radius:var(--radius-control);font:inherit;text-transform:none}.history-grid{gap:var(--space-3);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.history-chart{min-width:0;padding:var(--space-4);background:var(--color-surface-raised);border:var(--border-width-thin) solid var(--color-border);border-radius:var(--radius-card)}.history-chart-heading h3{color:var(--color-surface-brand);font-size:var(--font-size-md);margin:0}.history-chart-heading p{margin:var(--space-1) 0 0;color:var(--color-text-muted);font-size:var(--font-size-xs)}.chart-tooltip{gap:var(--space-1);padding:var(--space-2) var(--space-3);color:var(--color-surface-brand);background:var(--color-surface-solid);border:var(--border-width-thin) solid var(--color-border-strong);border-radius:var(--radius-control);box-shadow:var(--shadow-tooltip);font-size:var(--font-size-sm);display:grid}.chart-tooltip span{color:var(--color-text-muted);font-size:var(--font-size-xs)}.daylight-chart{border-top:var(--border-width-accent) solid var(--daylight-color,var(--color-border-strong))}.history-chart-body{width:100%;height:var(--size-chart-height);margin-top:var(--space-3)}@media (width<=43.75rem){.app-shell{width:min(calc(100% - var(--space-7)), var(--size-mobile-content-max));padding-top:var(--space-8)}.live-dashboard{min-height:0}.hero-panel{padding:var(--space-5);flex-direction:column;align-items:flex-start}.update-meta{text-align:left}.measurement-grid{gap:var(--space-2);grid-template-rows:none}.live-overview-grid{gap:var(--space-2);flex:initial;margin-top:var(--space-6);grid-template-columns:1fr}.measurement{min-height:var(--size-card-min-height-mobile);padding:var(--space-4)}.station-location-section{min-height:25rem;padding:var(--space-4)}.station-location-map{min-height:20rem}.measurement-value{margin-top:var(--space-4)}.history-header{flex-direction:column;align-items:flex-start}.history-grid{grid-template-columns:1fr}}@media (width<=24.375rem){.measurement-grid{grid-template-columns:1fr}}