:root{--sky-from: #10141f;--sky-to: #2b3345;--accent: #7fd1e8;--ink: #f2f6fa;--ink-muted: rgba(242, 246, 250, .68);--ink-faint: rgba(242, 246, 250, .42);--surface: rgba(255, 255, 255, .07);--surface-strong: rgba(255, 255, 255, .12);--border: rgba(255, 255, 255, .14);--radius: 16px;--radius-sm: 10px;--shadow: 0 10px 30px rgba(0, 0, 0, .28);--good: #4ade80;--fair: #a3e635;--moderate: #facc15;--poor: #fb923c;--very-poor: #f87171;--extreme: #c084fc;color-scheme:dark}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;color:var(--ink);background:linear-gradient(170deg,var(--sky-from) 0%,var(--sky-to) 100%);background-attachment:fixed;min-height:100vh;-webkit-font-smoothing:antialiased;transition:background .6s ease}@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}}a{color:var(--accent)}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.app{max-width:960px;margin:0 auto;padding:16px 16px calc(32px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:14px}.app-header{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.brand{display:flex;align-items:center;gap:9px}.brand-mark{font-size:1.5rem;color:var(--accent);line-height:1}.brand-name{font-size:1.05rem;font-weight:650;letter-spacing:.01em}.unit-toggle{display:flex;gap:8px}.segmented{display:inline-flex;background:var(--surface);border:1px solid var(--border);border-radius:999px;padding:2px}.segment{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:0;background:transparent;color:var(--ink-muted);font:inherit;font-size:.8rem;padding:5px 12px;border-radius:999px;cursor:pointer;transition:background .15s ease,color .15s ease}.segment.is-active{background:var(--surface-strong);color:var(--ink);font-weight:600}.segment:focus-visible,.btn:focus-visible,.chip:focus-visible,.search-input:focus-visible,.hourly:focus-visible,.chip-remove:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;font:inherit;font-size:.85rem;color:var(--ink);background:var(--surface-strong);border:1px solid var(--border);border-radius:var(--radius-sm);padding:9px 14px;cursor:pointer;transition:background .15s ease,opacity .15s ease}.btn:hover:not(:disabled){background:#ffffff2e}.btn:disabled{opacity:.55;cursor:progress}.btn-ghost{background:var(--surface)}.btn-small{font-size:.78rem;padding:6px 11px}.btn-star{font-size:.82rem;white-space:nowrap}.btn-star.is-active{color:var(--accent);border-color:var(--accent)}.search{position:relative}.search-row{display:flex;gap:8px}.search-field{position:relative;flex:1;min-width:0}.search-input{width:100%;font:inherit;font-size:.95rem;color:var(--ink);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);padding:11px 14px}.search-input::placeholder{color:var(--ink-faint)}.search-status{position:absolute;right:12px;top:50%;transform:translateY(-50%);font-size:.75rem;color:var(--ink-faint);pointer-events:none}.search-results{position:absolute;z-index:20;left:0;right:0;top:calc(100% + 6px);background:#131a26;border:1px solid var(--border);border-radius:var(--radius-sm);box-shadow:var(--shadow);overflow:hidden;max-height:300px;overflow-y:auto}.search-results ul{list-style:none;margin:0;padding:4px}.search-option{display:flex;align-items:baseline;gap:8px;padding:9px 11px;border-radius:8px;cursor:pointer}.search-option.is-active{background:var(--surface-strong)}.search-option-name{font-weight:600;font-size:.92rem}.search-option-detail{font-size:.78rem;color:var(--ink-muted)}.search-message{margin:0;padding:14px;font-size:.85rem;color:var(--ink-muted)}.search-message--error{color:#fca5a5}.favorites ul{list-style:none;display:flex;gap:7px;margin:0;padding:2px 0;overflow-x:auto;scrollbar-width:thin}.favorite{display:flex;align-items:stretch;flex:0 0 auto}.chip{-webkit-appearance:none;-moz-appearance:none;appearance:none;font:inherit;font-size:.82rem;color:var(--ink-muted);background:var(--surface);border:1px solid var(--border);border-right:0;border-radius:999px 0 0 999px;padding:6px 6px 6px 13px;cursor:pointer;white-space:nowrap}.chip.is-active{color:var(--ink);background:var(--surface-strong);font-weight:600}.chip-remove{-webkit-appearance:none;-moz-appearance:none;appearance:none;font:inherit;line-height:1;color:var(--ink-faint);background:var(--surface);border:1px solid var(--border);border-radius:0 999px 999px 0;padding:6px 11px 6px 5px;cursor:pointer}.chip-remove:hover{color:#fca5a5}.app-main{display:flex;flex-direction:column;gap:14px}.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:16px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}.panel-title{margin:0 0 12px;font-size:.82rem;font-weight:650;text-transform:uppercase;letter-spacing:.07em;color:var(--ink-muted)}.panel-head .panel-title{margin-bottom:12px}.panel-note{margin:0 0 10px;font-size:.88rem;line-height:1.5;color:var(--ink-muted)}.panel-note--muted{color:var(--ink-faint);font-size:.8rem}.panel--error{border-color:#f8717180}.banner{margin:0;padding:10px 14px;border-radius:var(--radius-sm);font-size:.84rem;line-height:1.45}.banner--info{background:#ffffff14;color:var(--ink-muted)}.banner--warn{background:#fb923c29;border:1px solid rgba(251,146,60,.35)}.status-bar{display:flex;align-items:center;justify-content:space-between;gap:10px}.status-text{font-size:.78rem;color:var(--ink-faint)}.current-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.place-name{margin:0;font-size:1.25rem;font-weight:650;line-height:1.25}.current-time{margin:3px 0 0;font-size:.78rem;color:var(--ink-faint)}.current-headline{display:flex;align-items:center;gap:16px;margin:18px 0 20px}.current-icon{color:var(--accent);flex:0 0 auto}.current-temp{margin:0;font-size:3.2rem;font-weight:300;line-height:1;letter-spacing:-.02em}.current-label{margin:6px 0 0;font-size:.95rem;color:var(--ink-muted)}.metric-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;margin:0;background:var(--border);border:1px solid var(--border);border-radius:var(--radius-sm);overflow:hidden}.metric{background:#161d2a;padding:11px 13px}.metric dt{font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-faint)}.metric dd{margin:4px 0 0;font-size:1.02rem;font-weight:600}.metric-detail{display:block;margin-top:2px;font-size:.74rem;font-weight:400;color:var(--ink-faint)}.hourly{list-style:none;display:flex;gap:4px;margin:0;padding:2px 0 8px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:thin}.hour{flex:0 0 auto;width:62px;display:flex;flex-direction:column;align-items:center;gap:5px;padding:10px 4px;border-radius:var(--radius-sm);background:#ffffff0a;scroll-snap-align:start}.hour-clock{font-size:.72rem;color:var(--ink-faint)}.hour-icon{color:var(--accent)}.hour-temp{font-size:.95rem;font-weight:600}.hour-pop{font-size:.7rem;color:var(--ink-faint)}.hour-pop.is-likely{color:var(--accent);font-weight:600}.chart{width:100%;height:auto;display:block}.chart-line{fill:none;stroke:var(--accent);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}.chart-area{fill:var(--accent);opacity:.11}.chart-bar{fill:#fff;opacity:.16}.chart-tick{fill:#f2f6fa80;font-size:11px}.chart-empty{margin:0;font-size:.85rem;color:var(--ink-faint)}.daily{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}.day{display:grid;grid-template-columns:4.6rem 1.8rem 2.4rem 2.1rem minmax(48px,1fr) 2.1rem;align-items:center;gap:8px;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.07);font-size:.88rem}.day:last-child{border-bottom:0}.day-name{font-weight:600;display:flex;flex-direction:column}.day-date{font-size:.68rem;font-weight:400;color:var(--ink-faint)}.day-icon{color:var(--accent)}.day-pop{font-size:.72rem;color:var(--accent)}.day-low{color:var(--ink-faint);text-align:right}.day-high{font-weight:600;text-align:right}.day-bar{position:relative;height:5px;border-radius:999px;background:#ffffff1a}.day-bar-fill{position:absolute;top:0;height:100%;border-radius:999px;background:linear-gradient(90deg,#60a5fa,#fbbf24)}.aqi-headline{display:flex;align-items:center;gap:14px;margin-bottom:12px}.aqi-value{font-size:2.5rem;font-weight:300;line-height:1}.aqi-label{margin:0;font-size:1rem;font-weight:650}.aqi-scale{margin:2px 0 0;font-size:.74rem;color:var(--ink-faint)}.aqi-meter{height:8px;border-radius:999px;background:#ffffff1a;overflow:hidden}.aqi-meter-fill{display:block;height:100%;border-radius:999px;transition:width .4s ease}[data-level=good]{color:var(--good)}[data-level=fair]{color:var(--fair)}[data-level=moderate]{color:var(--moderate)}[data-level=poor],[data-level=unhealthy-sensitive]{color:var(--poor)}[data-level=very-poor],[data-level=unhealthy]{color:var(--very-poor)}[data-level=extremely-poor],[data-level=very-unhealthy],[data-level=hazardous]{color:var(--extreme)}.aqi-meter-fill[data-level=good]{background:var(--good)}.aqi-meter-fill[data-level=fair]{background:var(--fair)}.aqi-meter-fill[data-level=moderate]{background:var(--moderate)}.aqi-meter-fill[data-level=poor],.aqi-meter-fill[data-level=unhealthy-sensitive]{background:var(--poor)}.aqi-meter-fill[data-level=very-poor],.aqi-meter-fill[data-level=unhealthy]{background:var(--very-poor)}.aqi-meter-fill[data-level=extremely-poor],.aqi-meter-fill[data-level=very-unhealthy],.aqi-meter-fill[data-level=hazardous]{background:var(--extreme)}.aqi-guidance{margin:12px 0 16px;font-size:.86rem;line-height:1.5;color:var(--ink-muted)}.pollutants{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;margin:0;background:var(--border);border:1px solid var(--border);border-radius:var(--radius-sm);overflow:hidden}.pollutant{background:#161d2a;padding:9px 10px}.pollutant dt{font-size:.74rem;color:var(--ink-faint)}.pollutant dt abbr{text-decoration:none;border-bottom:1px dotted var(--ink-faint);cursor:help}.pollutant dd{margin:3px 0 0;font-size:.9rem;font-weight:600}.pollutant-unit{font-size:.68rem;font-weight:400;color:var(--ink-faint)}.skeleton{background:#ffffff12;border-radius:8px;animation:pulse 1.5s ease-in-out infinite}.skeleton--title{height:20px;width:45%;margin-bottom:16px}.skeleton--headline{height:72px;width:70%;margin-bottom:18px}.skeleton--grid{height:132px}@keyframes pulse{0%,to{opacity:1}50%{opacity:.55}}.app-footer{margin-top:6px;font-size:.76rem;line-height:1.55;color:var(--ink-faint)}.app-footer p{margin:0 0 4px}.app-footer-note{font-style:italic}@media (min-width: 640px){.app{padding:24px;gap:16px}.metric-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.pollutants{grid-template-columns:repeat(6,minmax(0,1fr))}.current-temp{font-size:4rem}.place-name{font-size:1.5rem}.day{grid-template-columns:5.4rem 2rem 2.8rem 2.4rem minmax(90px,1fr) 2.4rem;font-size:.92rem}}@media (min-width: 900px){.app{padding:32px 24px 48px}}