:root{--bg:#f0f7fa;--bg-accent:#0077b61a;--card:#fff;--text:#0d2137;--text-secondary:#5a6b7e;--divider:#dce5ed;--water:#0077b6;--water-light:#90e0ef;--safe:#1e7d3a;--caution:#b85200;--danger:#b81a1a;--safe-bg:#1e7d3a1f;--caution-bg:#b852001f;--danger-bg:#b81a1a1f;--speed-line:#00b4d8;--height-line:#f59e0b;--badge-text:#fff;--tab-inactive:#3a4c60;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}[data-theme=dark]{--bg:#0a1628;--bg-accent:#48cae414;--card:#14233a;--text:#e8eff6;--text-secondary:#8b9db0;--divider:#2a3d55;--water:#48cae4;--water-light:#0077b6;--safe:#4ade80;--caution:#fbbf24;--danger:#fb7171;--safe-bg:#4ade8029;--caution-bg:#fbbf2429;--danger-bg:#fb717129;--speed-line:#48cae4;--height-line:#f59e0b;--badge-text:#0a1628;--tab-inactive:#a8bccf;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}@media (prefers-reduced-motion:no-preference){:root{interpolation-colors:oklab}*{transition:background-color .2s,border-color .2s,color .2s}}:root{--font-body:"Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-display:"Manrope", var(--font-body)}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{font-family:var(--font-body);background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;line-height:1.5}#root{background:linear-gradient(to bottom, var(--bg-accent), transparent 320px);min-height:100%}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:none}:focus-visible{outline:2px solid var(--water);outline-offset:2px;border-radius:4px}.app{flex-direction:column;gap:0;max-width:640px;min-height:100%;margin:0 auto;padding:16px;display:flex}.header{margin-bottom:12px}.badge,.grid{margin-bottom:20px}.section-head,.tabs{margin-bottom:12px}.footer{margin-top:28px}.header{justify-content:space-between;align-items:center;gap:12px;display:flex}.header__title{font-family:var(--font-display);letter-spacing:-.015em;white-space:nowrap;font-size:clamp(1rem,4.8vw,1.1875rem);font-weight:700}.header__subtitle{color:var(--text-secondary);font-size:.875rem}.header__actions{gap:8px;display:flex}.icon-btn{border-radius:var(--radius-md);width:44px;height:44px;color:var(--text);place-items:center;font-size:.8rem;font-weight:700;transition:background .15s;display:grid}.icon-btn:hover{background:var(--divider)}.badge{border-radius:var(--radius-lg);width:100%;color:var(--badge-text);text-align:left;border:none;align-items:center;gap:14px;padding:16px 18px;font-weight:700;display:flex}.badge--safe{background:var(--safe)}.badge--caution{background:var(--caution)}.badge--danger{background:var(--danger)}.badge__icon{flex-shrink:0;font-size:1.75rem}.badge__label{text-transform:uppercase;letter-spacing:.04em;font-size:1rem}.badge__desc{opacity:.92;font-size:.8125rem;font-weight:500}.grid{grid-template-columns:1fr 1fr;gap:12px;display:grid}.card{background:var(--card);border:1px solid var(--divider);border-radius:var(--radius-md);padding:16px;position:relative}.card__label{text-transform:uppercase;letter-spacing:.05em;color:var(--text-secondary);align-items:center;gap:6px;font-size:.75rem;font-weight:600;display:flex}.card__value{margin-top:6px;font-size:1.75rem;font-weight:700;line-height:1.1}.card__unit{color:var(--text-secondary);margin-left:4px;font-size:.8125rem;font-weight:500}.card__dot{border-radius:50%;width:12px;height:12px;position:absolute;top:12px;right:12px}.dot--safe{background:var(--safe)}.dot--caution{background:var(--caution)}.dot--danger{background:var(--danger)}.weather-icon{stroke:currentColor;stroke-width:1.8px;fill:none;stroke-linecap:round;stroke-linejoin:round;width:18px;height:18px}.section-head{justify-content:space-between;align-items:baseline;display:flex}.section-head__title{font-family:var(--font-display);font-size:1.125rem;font-weight:700}.updated{color:var(--text-secondary);font-size:.75rem}.tabs{background:var(--divider);border-radius:var(--radius-md);padding:4px;display:flex}.tab{border-radius:calc(var(--radius-md) - 4px);color:var(--tab-inactive);flex:1;padding:12px 10px;font-size:.875rem;font-weight:600;transition:all .15s}.tab--active{background:var(--card);color:var(--text);box-shadow:0 1px 3px #00000014}.chart{background:var(--card);border:1px solid var(--divider);border-radius:var(--radius-md);padding:16px 8px 8px}.chart-legend{color:var(--text-secondary);justify-content:center;gap:16px;margin-bottom:8px;font-size:.8125rem;display:flex}.legend-item{align-items:center;gap:6px;display:flex}.legend-swatch{width:18px;height:3px}.table-wrap{background:var(--card);border:1px solid var(--divider);border-radius:var(--radius-md);overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:.875rem}th{text-align:left;text-transform:uppercase;letter-spacing:.04em;color:var(--text-secondary);border-bottom:1px solid var(--divider);white-space:nowrap;padding:12px;font-size:.75rem;font-weight:600}th.num,td.num{text-align:right;font-variant-numeric:tabular-nums}td{border-bottom:1px solid var(--divider);padding:12px}tr:last-child td{border-bottom:none}.grade-cell{text-align:center;width:44px}.grade-pill{background:var(--safe);width:28px;height:28px;color:var(--badge-text);border-radius:50%;place-items:center;font-size:.85rem;font-weight:800;line-height:1;display:inline-grid}.grade-pill.grade--caution{background:var(--caution)}.grade-pill.grade--danger{background:var(--danger)}.state--loading,.state--error{text-align:center;color:var(--text-secondary);place-items:center;padding:48px 16px;display:grid}.skeleton{flex-direction:column;gap:12px;display:flex}.retry-btn{background:var(--water);color:#fff;border-radius:var(--radius-md);margin-top:12px;padding:10px 20px;font-weight:600}.modal-overlay{z-index:10;background:#00000080;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.modal{background:var(--card);border-radius:var(--radius-lg);width:100%;max-width:420px;padding:24px}.modal h2{font-family:var(--font-display);margin-bottom:12px}.modal li{color:var(--text-secondary);margin:8px 0;font-size:.875rem}.footer{text-align:center;color:var(--text-secondary);padding:8px 0 16px;font-size:.75rem}h2.section-head__title{font-family:var(--font-display);font-size:1.125rem;font-weight:700}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}
