*{box-sizing:border-box}html,body,#root{height:100%;margin:0;font-family:Inter,system-ui,-apple-system,sans-serif;background:#082f49;color:#f4f6f8;-webkit-text-size-adjust:100%}.app{display:grid;grid-template-columns:1fr;grid-template-rows:1fr;height:100%;min-height:0;position:relative;overflow:hidden}@media (min-width: 769px){.app.panel-open{grid-template-columns:1fr 380px}}.map-pane{position:relative;min-height:0;display:flex;flex-direction:column;overflow:hidden}.map-container{position:relative;flex:1;width:100%;min-height:0;height:100%}.loading-bar-track{position:absolute;top:0;left:0;right:0;height:4px;background:#ffffff1a;overflow:hidden;pointer-events:none}.loading-bar-top{position:absolute;top:0;left:0;right:0;height:4px;z-index:1;pointer-events:none}.loading-bar-fill{height:100%;background:linear-gradient(90deg,#0ea5e9,#38bdf8);border-radius:0 2px 2px 0;transition:width .25s ease-out}.loading-bar-indeterminate{width:30%!important;animation:indeterminate-slide 1.4s ease-in-out infinite}@keyframes indeterminate-slide{0%{transform:translate(-100%)}to{transform:translate(430%)}}.spinner{width:36px;height:36px;border-radius:50%;border:3px solid rgba(255,255,255,.2);border-top-color:#38bdf8;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.header{position:absolute;top:12px;left:12px;background:#082f49d9;padding:8px 12px;border-radius:10px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.08);z-index:20;max-width:calc(100% - 72px);display:flex;align-items:center;gap:10px}.header-logo{width:28px;height:28px;border-radius:6px;flex-shrink:0}.header-text h1{margin:0;font-size:14px;font-weight:700;letter-spacing:-.01em}.header-text h1 .brand-accent{color:#38bdf8}.header .small{display:none}@media (min-width: 769px){.header{padding:10px 14px}.header-logo{width:32px;height:32px}.header-text h1{font-size:16px;margin-bottom:2px}.header .small{display:block}}.panel-toggle-btn{position:absolute;top:12px;right:12px;z-index:50;width:44px;height:44px;border-radius:12px;border:1px solid rgba(255,255,255,.1);background:#082f49d9;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:#e0f2fe;font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 12px #0000004d;transition:background .15s,transform .15s;-webkit-tap-highlight-color:transparent}.panel-toggle-btn:hover{background:#0c4a6ef2}.panel-toggle-btn:active{transform:scale(.94)}.panel-backdrop{display:none}.panel-backdrop.visible{display:block;position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;z-index:99;animation:fadeIn .2s ease;-webkit-tap-highlight-color:transparent}@media (min-width: 769px){.panel-backdrop.visible{display:none}}.side-panel{background:#0c4a6e;padding:0;display:flex;flex-direction:column;gap:0;overflow:hidden;border-left:1px solid rgba(255,255,255,.05);position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;transform:translate(100%);transition:transform .3s cubic-bezier(.32,.72,0,1);-webkit-overflow-scrolling:touch}.side-panel.open{transform:translate(0)}.side-panel-header{display:flex;align-items:center;justify-content:space-between;padding:16px 16px 12px;border-bottom:1px solid rgba(255,255,255,.05);flex-shrink:0;background:#0c4a6e}.side-panel-header h2{margin:0;font-size:17px;font-weight:700;color:#e0f2fe}.side-panel-close{width:40px;height:40px;border-radius:10px;border:1px solid rgba(255,255,255,.1);background:#075985;color:#bae6fd;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent;transition:background .15s}.side-panel-close:hover,.side-panel-close:active{background:#0284c7;color:#e0f2fe}.side-panel-body{flex:1;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;padding:12px 16px 40px;display:flex;flex-direction:column;gap:12px}@media (min-width: 769px){.side-panel{position:relative;top:auto;right:auto;bottom:auto;left:auto;z-index:auto;transform:none;transition:none;display:none}.app.panel-open .side-panel{display:flex}.side-panel-header{display:none}.side-panel-body{padding:16px;gap:16px}}.panel-card{background:#ffffff08;border-radius:12px;padding:12px;border:1px solid rgba(255,255,255,.05)}.panel-title{font-size:11px;font-weight:700;color:#38bdf8;margin-bottom:8px;text-transform:uppercase;letter-spacing:.1em}.controls{display:flex;gap:8px;flex-wrap:wrap}.control-btn{padding:10px 14px;border-radius:10px;border:1px solid rgba(255,255,255,.1);background:#075985;color:#e0f2fe;cursor:pointer;font-size:13px;min-height:44px;-webkit-tap-highlight-color:transparent;transition:background .15s}.control-btn:active{background:#0284c7}.control-btn.active{background:#0284c7;border-color:#0ea5e9}.station-list{display:grid;gap:2px}.station-row{display:flex;justify-content:space-between;align-items:center;gap:10px}.station-row[role=button]{cursor:pointer}.station-list .station-row{padding:12px;border-radius:10px;margin:0 -4px;-webkit-tap-highlight-color:transparent;transition:background .12s}.station-row[role=button]:hover{background:#ffffff0f}.station-row[role=button]:active{background:#ffffff1a}.station-row[role=button].selected{background:#0ea5e926;border:1px solid rgba(14,165,233,.3)}.station-row.staleness-fresh{opacity:1}.station-row.staleness-old .small,.station-row.staleness-old .badge{opacity:.85;color:#7dd3fc}.station-row.staleness-stale .small,.station-row.staleness-stale .badge{opacity:.65;color:#bae6fd}.station-row.staleness-missing .small,.station-row.staleness-missing .badge{opacity:.5;color:#7dd3fc}.badge{background:#0ea5e926;padding:5px 10px;border-radius:999px;font-size:13px;font-weight:600;white-space:nowrap;flex-shrink:0}.metric-tabs{display:flex;gap:6px;flex-wrap:wrap}.metric-tab{padding:8px 12px;border-radius:8px;border:1px solid rgba(255,255,255,.1);background:transparent;color:#e0f2fe;cursor:pointer;font-size:13px;min-height:40px;-webkit-tap-highlight-color:transparent;transition:background .12s}.metric-tab:active,.metric-tab.active{background:#0284c7}.history-controls{margin-top:10px;display:flex;flex-direction:column;gap:8px}.date-input{background:#ffffff08;border:1px solid rgba(255,255,255,.1);color:#e0f2fe;border-radius:8px;padding:6px 8px;font-size:12px}.station-link{color:#38bdf8;font-size:13px;text-decoration:none}.station-link:hover{text-decoration:underline}.chart{margin-top:10px;background:#ffffff08;border-radius:10px;border:1px solid rgba(255,255,255,.08);padding:8px;height:140px}.chart-rain-buckets{position:relative}.rain-bar-tooltip{position:absolute;bottom:100%;left:50%;transform:translate(-50%);margin-bottom:8px;background:#075985;border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:8px 12px;box-shadow:0 4px 12px #0006;font-size:12px;color:#e0f2fe;white-space:nowrap;z-index:10;pointer-events:none}.rain-bar-tooltip-time{display:block;font-weight:600;margin-bottom:2px}.rain-bar-tooltip-value{color:#38bdf8;font-weight:600}.chart-bars{display:flex;align-items:flex-end;height:100%;gap:2px}.chart-bar{flex:1;background:#10b981;border-radius:4px 4px 0 0;opacity:.85}.chart-bar:hover{opacity:1}.measurement-list{display:grid;gap:6px;font-size:12px;color:#bae6fd;margin-top:8px;max-height:200px;overflow:auto}.small{font-size:12px;color:#7dd3fc;overflow:hidden;text-overflow:ellipsis}.station-modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;background:#00000080;display:flex;align-items:flex-end;justify-content:center;padding:0;animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.station-modal{background:#0c4a6e;border-radius:16px 16px 0 0;border:1px solid rgba(255,255,255,.08);border-bottom:none;box-shadow:0 -8px 40px #0006;width:100%;max-height:85vh;overflow:hidden;display:flex;flex-direction:column;animation:slideUp .3s cubic-bezier(.32,.72,0,1)}@keyframes slideUp{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}.station-modal-header{padding:16px 20px;border-bottom:1px solid rgba(255,255,255,.08);display:flex;justify-content:space-between;align-items:center;flex-shrink:0}.station-modal-title{margin:0;font-size:1.1rem;font-weight:600;color:#e0f2fe}.station-modal-close{padding:8px 14px;border:1px solid rgba(255,255,255,.1);border-radius:8px;background:#075985;color:#e0f2fe;cursor:pointer;font-size:14px;min-height:40px;-webkit-tap-highlight-color:transparent}.station-modal-close:hover{background:#0284c7}.station-modal-body{padding:16px;overflow:auto;flex:1;min-height:0;-webkit-overflow-scrolling:touch}.station-modal-body .panel-card{border:none;padding:0;background:transparent}@media (min-width: 769px){.station-modal-backdrop{align-items:center;padding:24px}.station-modal{max-width:560px;max-height:90vh;border-radius:16px;border-bottom:1px solid rgba(255,255,255,.08)}@keyframes slideUp{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}}.modal{position:fixed;right:24px;bottom:24px;width:320px;background:#0c4a6e;border-radius:12px;border:1px solid rgba(255,255,255,.08);padding:12px;z-index:5}.modal textarea{width:100%;min-height:120px;background:#ffffff08;border:1px solid rgba(255,255,255,.1);color:#e0f2fe;border-radius:8px;padding:8px}.empty{color:#fb923c;font-size:12px}.error{color:#fb923c}.layer-bar{position:absolute;bottom:20px;left:50%;transform:translate(-50%);z-index:10;display:flex;gap:4px;padding:6px 10px;background:#082f49e6;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-radius:14px;border:1px solid rgba(255,255,255,.08);box-shadow:0 4px 20px #00000059}.layer-btn{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 12px;border:none;border-radius:10px;background:transparent;cursor:pointer;font-size:11px;color:#7dd3fc;transition:background .15s,color .15s;-webkit-tap-highlight-color:transparent;min-height:44px;justify-content:center}.layer-btn:hover{background:#0ea5e926;color:#e0f2fe}.layer-btn:active{background:#0ea5e940}.layer-btn.active{background:#0ea5e933;color:#38bdf8}.layer-btn .layer-btn-icon{font-size:18px;line-height:1}.debug-panel-toggle{width:100%;display:flex;align-items:center;justify-content:space-between;background:none;border:none;color:inherit;cursor:pointer;font:inherit;padding:0;margin-bottom:8px;text-align:left}.debug-panel-chevron{font-size:10px;color:#7dd3fc}.debug-summary{margin-bottom:4px}.debug-entries{margin-top:12px;padding-top:12px;border-top:1px solid rgba(255,255,255,.08)}.debug-entries-title{margin-bottom:8px;text-transform:uppercase;letter-spacing:.06em}.debug-list{list-style:none;margin:0;padding:0;font-size:11px;font-family:ui-monospace,monospace;max-height:200px;overflow:auto}.debug-entry{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:4px 0;border-bottom:1px solid rgba(255,255,255,.05)}.debug-status{min-width:28px;font-weight:600}.debug-status.ok{color:#34d399}.debug-status.error{color:#fb923c}.debug-method{color:#38bdf8}.debug-url{color:#7dd3fc;overflow:hidden;text-overflow:ellipsis;max-width:180px}.debug-duration{color:#bae6fd}.debug-error{color:#fb923c;font-size:10px;flex:1 1 100%}.chart-legend{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:8px;font-size:12px;color:#bae6fd}.chart-legend span{display:inline-flex;align-items:center;gap:4px}.chart-legend .dot{width:8px;height:8px;border-radius:50%}.station-detail-badges{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.station-detail-units{font-size:12px;font-weight:600;color:#38bdf8;margin-top:6px;margin-bottom:4px}.chart-tooltip{background:#075985;border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:10px 12px;box-shadow:0 4px 12px #0006;min-width:160px}.chart-tooltip-time{font-weight:600;color:#e0f2fe;margin-bottom:8px;font-size:12px}.chart-tooltip-row{display:flex;justify-content:space-between;gap:16px;font-size:12px;color:#bae6fd}.chart-tooltip-value{font-weight:600;color:#f4f6f8}.chart-container-recharts{height:220px;margin-top:8px;background:#ffffff08;border-radius:8px;border:1px solid rgba(255,255,255,.08)}.desktop-only{display:none}@media (min-width: 769px){.desktop-only{display:block}.layer-bar{bottom:auto;top:12px}}.admin-loading{display:flex;align-items:center;justify-content:center;height:100vh;color:#7dd3fc;font-size:16px}.admin-login-wrapper{display:flex;align-items:center;justify-content:center;min-height:100vh;background:linear-gradient(135deg,#041c2c,#082f49,#0c3d5f);padding:24px}.admin-login-form{background:#0c4a6e99;border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:40px 36px;width:100%;max-width:380px;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:0 8px 40px #0000004d}.admin-login-form h1{margin:0 0 4px;font-size:24px;font-weight:700;color:#e0f2fe}.admin-login-subtitle{margin:0 0 24px;font-size:14px;color:#7dd3fc}.admin-login-error{background:#ef444426;border:1px solid rgba(239,68,68,.3);color:#fca5a5;padding:10px 14px;border-radius:8px;font-size:13px;margin-bottom:16px}.admin-login-form label{display:block;font-size:13px;font-weight:600;color:#bae6fd;margin-bottom:16px}.admin-login-form input{display:block;width:100%;margin-top:6px;padding:10px 14px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:#ffffff0d;color:#e0f2fe;font-size:15px;outline:none;transition:border-color .15s}.admin-login-form input:focus{border-color:#38bdf8}.admin-login-form button{width:100%;padding:12px;border-radius:10px;border:none;background:#0284c7;color:#e0f2fe;font-size:15px;font-weight:600;cursor:pointer;transition:background .15s;margin-top:8px}.admin-login-form button:hover{background:#0ea5e9}.admin-login-form button:disabled{opacity:.6;cursor:not-allowed}.admin-dashboard{height:100%;min-height:100vh;background:#041c2c;color:#e0f2fe;overflow-y:auto;overflow-x:hidden}.admin-header{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;background:#082f49cc;border-bottom:1px solid rgba(255,255,255,.06);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);position:sticky;top:0;z-index:50}.admin-header-left{display:flex;align-items:center;gap:12px}.admin-header-left h1{margin:0;font-size:18px;font-weight:700}.admin-header-badge{background:#0ea5e933;color:#38bdf8;padding:3px 10px;border-radius:999px;font-size:12px;font-weight:600}.admin-header-right{display:flex;gap:8px}.admin-refresh-btn,.admin-logout-btn{padding:8px 16px;border-radius:8px;border:1px solid rgba(255,255,255,.1);background:#075985;color:#e0f2fe;font-size:13px;font-weight:500;cursor:pointer;transition:background .15s}.admin-refresh-btn:hover,.admin-logout-btn:hover{background:#0284c7}.admin-error-banner{background:#ef44441f;border-bottom:1px solid rgba(239,68,68,.25);color:#fca5a5;padding:10px 24px;font-size:13px}.admin-tabs{display:flex;gap:2px;padding:0 24px;background:#082f49d9;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid rgba(255,255,255,.06);overflow-x:auto;position:sticky;top:57px;z-index:49}.admin-tab{padding:12px 20px;border:none;background:transparent;color:#7dd3fc;font-size:14px;font-weight:500;cursor:pointer;border-bottom:2px solid transparent;transition:color .15s,border-color .15s;white-space:nowrap}.admin-tab:hover{color:#e0f2fe}.admin-tab.active{color:#38bdf8;border-bottom-color:#38bdf8}.admin-main{padding:24px;max-width:1200px;margin:0 auto}.admin-section{scroll-margin-top:120px;padding-bottom:8px}.admin-section+.admin-section{padding-top:8px;border-top:1px solid rgba(255,255,255,.04)}.admin-section-title{font-size:18px;font-weight:700;color:#e0f2fe;margin:0 0 16px}.admin-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px;margin-bottom:24px}.admin-card{background:#0c4a6e66;border:1px solid rgba(255,255,255,.06);border-radius:12px;padding:20px 16px;text-align:center;transition:background .15s,border-color .15s,transform .12s}.admin-card-clickable{cursor:pointer}.admin-card-clickable:hover{background:#0c4a6e99;border-color:#38bdf840;transform:translateY(-2px)}.admin-card-clickable:active{transform:translateY(0)}.admin-card-accent{border-color:#0ea5e94d;background:#0ea5e91a}.admin-card-accent.admin-card-clickable:hover{background:#0ea5e92e;border-color:#38bdf866}.admin-card-value{font-size:28px;font-weight:700;color:#e0f2fe;line-height:1.1;margin-bottom:6px}.admin-card-accent .admin-card-value{color:#38bdf8}.admin-card-label{font-size:12px;font-weight:600;color:#7dd3fc;text-transform:uppercase;letter-spacing:.06em}.admin-card-hint{font-size:10px;color:#38bdf8;margin-top:8px;opacity:0;transition:opacity .15s}.admin-card-clickable:hover .admin-card-hint{opacity:1}.admin-chart-section{background:#0c4a6e4d;border:1px solid rgba(255,255,255,.06);border-radius:12px;padding:20px;margin-bottom:24px}.admin-chart-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.admin-chart-header h2{margin:0;font-size:16px;font-weight:600}.admin-chart-controls{display:flex;gap:8px}.admin-chart-controls select{padding:6px 10px;border-radius:8px;border:1px solid rgba(255,255,255,.12);background:#ffffff0d;color:#e0f2fe;font-size:13px;cursor:pointer}.admin-chart-container{width:100%}.admin-two-col{display:grid;grid-template-columns:1fr;gap:16px}@media (min-width: 769px){.admin-two-col{grid-template-columns:1fr 1fr}}.admin-panel{background:#0c4a6e4d;border:1px solid rgba(255,255,255,.06);border-radius:12px;padding:20px}.admin-panel h2,.admin-panel h3{margin:0 0 16px;font-size:15px;font-weight:600;color:#e0f2fe}.admin-panel.admin-full{margin-bottom:24px}.admin-empty{color:#64748b;font-size:14px;text-align:center;padding:32px 0}.admin-station-bars{display:flex;flex-direction:column;gap:8px}.admin-station-bar-row{display:flex;align-items:center;gap:10px}.admin-station-id{font-size:12px;font-family:ui-monospace,monospace;color:#bae6fd;min-width:70px;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.admin-bar-track{flex:1;height:8px;background:#ffffff0f;border-radius:4px;overflow:hidden}.admin-bar-fill{height:100%;background:linear-gradient(90deg,#0ea5e9,#38bdf8);border-radius:4px;transition:width .4s ease}.admin-bar-count{font-size:12px;font-weight:600;color:#7dd3fc;min-width:28px;text-align:right}.admin-table{width:100%;border-collapse:collapse;font-size:13px}.admin-table th{text-align:left;padding:10px 12px;font-size:11px;font-weight:700;color:#38bdf8;text-transform:uppercase;letter-spacing:.06em;border-bottom:1px solid rgba(255,255,255,.08);white-space:nowrap}.admin-table td{padding:10px 12px;border-bottom:1px solid rgba(255,255,255,.04);color:#bae6fd;vertical-align:top}.admin-table tbody tr:hover{background:#ffffff08}.admin-table .mono{font-family:ui-monospace,monospace;font-size:12px}.admin-stations-cell{max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@media (max-width: 768px){.admin-main{padding:16px}.admin-cards{grid-template-columns:repeat(2,1fr)}.admin-header{padding:12px 16px}.admin-header-left h1{font-size:15px}.admin-tabs{padding:0 16px}.admin-panel{overflow-x:auto}}