:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--bg:oklch(97.5% .01 240);--surface:oklch(100% 0 0);--surface-sunken:oklch(95.5% .012 240);--border:oklch(90% .012 240);--text:oklch(24% .02 250);--text-muted:oklch(48% .02 250);--accent:oklch(52% .15 245);--accent-hover:oklch(46% .15 245);--accent-contrast:oklch(100% 0 0);--icon:oklch(66% .17 60);--danger:oklch(50% .19 25);--danger-soft:oklch(50% .19 25/.08);--skeleton:oklch(92% .01 240);--skeleton-shine:oklch(96.5% .008 240);--font-sans:"Roboto", ui-sans-serif, system-ui, -apple-system, "Segoe UI", "Helvetica Neue", Arial, sans-serif;--step--1:clamp(.8rem, .78rem + .1vw, .875rem);--step-0:clamp(.94rem, .9rem + .2vw, 1rem);--step-1:clamp(1.1rem, 1rem + .4vw, 1.3rem);--step-3:clamp(1.6rem, 1.3rem + 1.4vw, 2.3rem);--step-5:clamp(2.6rem, 2rem + 3vw, 4rem);--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.5rem;--space-6:2.5rem;--radius-sm:8px;--radius:16px;--radius-full:999px;--shadow:0 1px 2px oklch(25% .03 250/.06), 0 8px 24px oklch(25% .03 250/.06);--tap:44px;--content-width:960px;--ease:cubic-bezier(.2, .7, .2, 1)}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--bg:oklch(17% .015 250);--surface:oklch(22% .018 250);--surface-sunken:oklch(19% .016 250);--border:oklch(31% .02 250);--text:oklch(94% .008 240);--text-muted:oklch(72% .015 240);--accent:oklch(75% .12 240);--accent-hover:oklch(81% .11 240);--accent-contrast:oklch(18% .03 250);--icon:oklch(80% .15 75);--danger:oklch(72% .16 25);--danger-soft:oklch(72% .16 25/.12);--skeleton:oklch(27% .018 250);--skeleton-shine:oklch(32% .02 250);--shadow:0 1px 2px oklch(0% 0 0/.35)}}*,:before,:after{box-sizing:border-box}body{background:var(--bg);min-height:100vh;color:var(--text);font-family:var(--font-sans);font-size:var(--step-0);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;line-height:1.5}button{font:inherit;color:inherit}a{color:var(--accent);text-underline-offset:.2em}a:hover{color:var(--accent-hover)}:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.visually-hidden{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.Header{margin-bottom:var(--space-5)}.Header-title{font-size:var(--step-3);margin:0;line-height:1.15}.Header-subtitle{margin:var(--space-1) 0 0;color:var(--text-muted)}.CityName-name{font-size:var(--step-1);margin:0;font-weight:500;line-height:1.2}.CityName-country{margin:var(--space-1) 0 0;font-size:var(--step--1);color:var(--text-muted)}.WeatherIcon{font-size:var(--step-5);color:var(--icon);line-height:1}.Temperature-value{font-size:var(--step-5);font-variant-numeric:tabular-nums;font-weight:700}.Temperature-unit{font-size:var(--step-1);color:var(--text-muted);vertical-align:top;font-weight:700}.WeatherSummary{align-items:center;gap:var(--space-4);display:flex}.WeatherSummary-reading{margin:0;line-height:1}.WeatherSummary-label{margin-top:var(--space-2);color:var(--text-muted);display:block}.Stat{padding:var(--space-3);background:var(--surface-sunken);border-radius:var(--radius-sm)}.Stat-label{font-size:var(--step--1);color:var(--text-muted)}.Stat-value{font-variant-numeric:tabular-nums;margin:0;font-weight:700}.WeatherStats{gap:var(--space-2);grid-template-columns:1fr 1fr;margin:0;display:grid}.WeatherData,.WeatherSkeleton{gap:var(--space-4);flex-direction:column;display:flex}.WeatherSkeleton-main{align-items:center;gap:var(--space-4);display:flex}.WeatherSkeleton-extra{gap:var(--space-2);grid-template-columns:1fr 1fr;display:grid}.WeatherSkeleton-block{border-radius:var(--radius-sm);background:linear-gradient(90deg, var(--skeleton) 25%, var(--skeleton-shine) 50%, var(--skeleton) 75%);background-size:200% 100%;animation:1.4s linear infinite WeatherSkeleton-shimmer;display:block}.WeatherSkeleton-icon{width:var(--step-5);height:var(--step-5);border-radius:var(--radius-full)}.WeatherSkeleton-value{width:7rem;height:var(--step-5)}.WeatherSkeleton-row{height:4rem}@keyframes WeatherSkeleton-shimmer{to{background-position:-200% 0}}.Button{min-height:var(--tap);min-width:var(--tap);padding:0 var(--space-4);border-radius:var(--radius-full);background:var(--accent);color:var(--accent-contrast);cursor:pointer;transition:background-color .15s var(--ease);border:0;font-weight:500}.Button:hover{background:var(--accent-hover)}.ErrorMessage{align-items:flex-start;gap:var(--space-3);padding:var(--space-4);background:var(--danger-soft);border-radius:var(--radius-sm);color:var(--danger);flex-direction:column;display:flex}.ErrorMessage-text{margin:0;font-weight:500}.ErrorMessage-detail{font-size:var(--step--1);font-weight:400;display:block}.WeatherCard{gap:var(--space-4);width:100%;padding:var(--space-5);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);flex-direction:column;display:flex}.WeatherCard-body{flex-direction:column;flex:1;display:flex}.EmptyState{padding:var(--space-6) var(--space-4);border:1px dashed var(--border);border-radius:var(--radius);color:var(--text-muted);text-align:center;margin:0}.WeatherList{gap:var(--space-4);grid-template-columns:repeat(auto-fill,minmax(min(100%,20rem),1fr));margin:0;padding:0;list-style:none;display:grid}.WeatherList-item{display:flex}.ExternalLink{min-height:var(--tap);align-items:center;display:inline-flex}.Footer{margin-top:var(--space-6);padding-top:var(--space-4);border-top:1px solid var(--border);font-size:var(--step--1)}.Footer-links{gap:0 var(--space-5);flex-wrap:wrap;margin:0;padding:0;list-style:none;display:flex}.Footer-link{min-height:var(--tap);align-items:center;display:inline-flex}.App{min-height:100vh;max-width:var(--content-width);padding:var(--space-6) var(--space-4) var(--space-5);flex-direction:column;margin:0 auto;display:flex}.App-main{flex:1}