:root{--ink: #edeff7;--ink-muted: #9aa3ba;--bg-deep: #0b1120;--glass-fill: rgba(255, 255, 255, .07);--glass-border: rgba(255, 255, 255, .14);--glass-blur: 18px;--radius-lg: 28px;--radius-md: 18px;--font-display: "Space Grotesk", sans-serif;--font-body: "Inter", sans-serif;--font-mono: "JetBrains Mono", monospace;--sky-a: #131a30;--sky-b: #1c2440;--sky-glow: rgba(139, 147, 167, .25)}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:var(--font-body);color:var(--ink);background:var(--bg-deep);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}button{font-family:inherit;cursor:pointer}.app{position:relative;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;align-items:center;padding:max(32px,env(safe-area-inset-top)) 20px calc(64px + env(safe-area-inset-bottom));overflow-x:hidden;color:var(--ink);transition:color .3s ease}.sky-layer{position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;background:radial-gradient(120% 90% at 50% -10%,var(--sky-glow),transparent 60%),linear-gradient(160deg,var(--sky-a),var(--sky-b) 70%,var(--bg-deep));transition:background 1.1s ease}.sky-clear{--sky-a: #1c2c4d;--sky-b: #2f4570;--sky-glow: rgba(245, 166, 35, .35)}.sky-cloudy{--sky-a: #202944;--sky-b: #333f5c;--sky-glow: rgba(159, 174, 204, .25)}.sky-overcast{--sky-a: #1a1f30;--sky-b: #2a3040;--sky-glow: rgba(139, 147, 167, .2)}.sky-rain{--sky-a: #10233a;--sky-b: #163852;--sky-glow: rgba(79, 168, 216, .3)}.sky-storm{--sky-a: #171630;--sky-b: #2a2352;--sky-glow: rgba(139, 127, 232, .35)}.sky-snow{--sky-a: #1b2436;--sky-b: #2c3c50;--sky-glow: rgba(216, 230, 240, .3)}.sky-fog{--sky-a: #262b36;--sky-b: #333a44;--sky-glow: rgba(180, 184, 191, .2)}.theme-light{--ink: #1c2333;--ink-muted: #626d84;--bg-deep: #eef1f8;--glass-fill: rgba(255, 255, 255, .6);--glass-border: rgba(28, 35, 51, .1)}.theme-light.sky-default,.theme-light.sky-clear{--sky-a: #eaf1ff;--sky-b: #dce7fb;--sky-glow: rgba(245, 166, 35, .28)}.theme-light.sky-cloudy{--sky-a: #e7ebf5;--sky-b: #d7ddec;--sky-glow: rgba(159, 174, 204, .3)}.theme-light.sky-overcast{--sky-a: #e3e6ec;--sky-b: #d2d6e0;--sky-glow: rgba(139, 147, 167, .2)}.theme-light.sky-rain{--sky-a: #dcedf7;--sky-b: #c7e1f0;--sky-glow: rgba(79, 168, 216, .28)}.theme-light.sky-storm{--sky-a: #e2ddf7;--sky-b: #cfc6f2;--sky-glow: rgba(139, 127, 232, .3)}.theme-light.sky-snow{--sky-a: #eef4f9;--sky-b: #dfeaf2;--sky-glow: rgba(160, 190, 210, .3)}.theme-light.sky-fog{--sky-a: #e6e8eb;--sky-b: #d8dbdf;--sky-glow: rgba(180, 184, 191, .25)}.theme-light .lang-toggle button.active,.theme-light .unit-toggle button.active{background:#1c23331a}.theme-light .theme-toggle:hover,.theme-light .geo-button:hover{background:#1c233314}.theme-light .spinner{border-color:#1c23331f;border-top-color:var(--ink)}.app-header{width:100%;max-width:640px;display:flex;flex-direction:column;align-items:center;gap:14px;margin-bottom:40px}.app-eyebrow{font-family:var(--font-display);font-size:14px;letter-spacing:.3em;text-transform:uppercase;color:var(--ink-muted);margin:0}.app-header-controls{display:flex;align-items:center;gap:10px;align-self:flex-end}.lang-toggle{display:flex;gap:2px;background:var(--glass-fill);border:1px solid var(--glass-border);border-radius:999px;padding:4px}.lang-toggle button{background:none;border:none;color:var(--ink-muted);font-family:var(--font-mono);font-size:12px;padding:6px 12px;border-radius:999px;transition:background .2s ease,color .2s ease}.lang-toggle button.active{background:#ffffff29;color:var(--ink)}.theme-toggle{width:38px;height:38px;display:grid;place-items:center;background:var(--glass-fill);border:1px solid var(--glass-border);border-radius:50%;font-size:16px;color:var(--ink);transition:background .2s ease}.theme-toggle:hover{background:#ffffff2e}.app-tagline{font-family:var(--font-body);font-weight:500;font-size:15px;color:var(--ink-muted);margin:0;text-align:center}.app-clock{font-family:var(--font-mono);font-size:13px;color:var(--ink-muted);margin:-4px 0 4px;text-transform:capitalize}.search-bar{position:relative;width:100%;max-width:420px}.search-input-row{display:flex;gap:8px;background:var(--glass-fill);border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(var(--glass-blur));backdrop-filter:blur(var(--glass-blur));border-radius:var(--radius-md);padding:6px 6px 6px 18px;align-items:center}.search-input{flex:1;background:none;border:none;outline:none;color:var(--ink);font-family:var(--font-body);font-size:16px;padding:10px 0}.search-input::placeholder{color:var(--ink-muted)}.geo-button{background:#ffffff1a;border:none;border-radius:12px;width:40px;height:40px;font-size:16px;display:grid;place-items:center;color:var(--ink);transition:background .2s ease}.geo-button:hover{background:#ffffff2e}.suggestions-list{position:absolute;top:calc(100% + 8px);left:0;right:0;list-style:none;margin:0;padding:6px;background:#0e1324eb;border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(var(--glass-blur));backdrop-filter:blur(var(--glass-blur));border-radius:var(--radius-md);z-index:10;max-height:280px;overflow-y:auto}.suggestion-item button{width:100%;display:flex;justify-content:space-between;align-items:baseline;gap:12px;background:none;border:none;color:var(--ink);padding:10px 12px;border-radius:10px;text-align:left;font-size:15px}.suggestion-item button:hover{background:#ffffff14}.suggestion-region{font-family:var(--font-mono);font-size:12px;color:var(--ink-muted);white-space:nowrap}.suggestion-status{padding:10px 12px;color:var(--ink-muted);font-size:14px}.unit-toggle{display:flex;gap:4px;background:var(--glass-fill);border:1px solid var(--glass-border);border-radius:999px;padding:4px}.unit-toggle button{background:none;border:none;color:var(--ink-muted);font-family:var(--font-mono);font-size:13px;padding:6px 16px;border-radius:999px;transition:background .2s ease,color .2s ease}.unit-toggle button.active{background:#ffffff29;color:var(--ink)}.app-main{width:100%;max-width:760px;display:flex;flex-direction:column;gap:32px}.empty-state{display:flex;flex-direction:column;align-items:center;gap:12px;padding:80px 20px;color:var(--ink-muted);font-size:16px;text-align:center}.empty-state span{font-size:48px}.back-link{background:none;border:none;color:var(--ink-muted);font-family:var(--font-mono);font-size:13px;padding:6px 0;align-self:flex-start;transition:color .2s ease}.back-link:hover{color:var(--ink)}.comparison-header{text-align:center;margin-bottom:20px}.comparison-header h2{font-family:var(--font-display);font-size:22px;margin:0 0 6px}.comparison-header p{margin:0;color:var(--ink-muted);font-size:14px}.comparison-grid{display:grid;grid-template-columns:1fr auto 1fr;gap:16px;align-items:center}.city-card{background:var(--glass-fill);border:1px solid var(--glass-border);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));border-radius:var(--radius-lg);padding:28px 20px;text-align:center;min-height:200px;display:flex;flex-direction:column;justify-content:center}.city-card-header h3{font-family:var(--font-display);font-size:20px;margin:0 0 2px}.city-card-header p{margin:0 0 16px;color:var(--ink-muted);font-size:13px}.city-card-main{display:flex;align-items:center;justify-content:center;gap:10px}.city-card-icon{font-size:36px}.city-card-temp{font-family:var(--font-display);font-size:42px;font-weight:700;display:flex;align-items:flex-start}.city-card-temp .unit{font-size:18px;font-weight:500;color:var(--ink-muted);margin-top:4px}.city-card-condition{margin:6px 0 0;color:var(--ink-muted);font-size:13px}.comparison-distance{display:flex;flex-direction:column;align-items:center;gap:4px;padding:12px 8px;color:var(--ink-muted)}.comparison-distance-icon{font-size:20px;transform:rotate(90deg)}.comparison-distance-value{font-family:var(--font-mono);font-size:15px;color:var(--ink);white-space:nowrap}.comparison-distance-label{font-size:11px;text-align:center;max-width:90px;line-height:1.3}.current-weather{background:var(--glass-fill);border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(var(--glass-blur));backdrop-filter:blur(var(--glass-blur));border-radius:var(--radius-lg);padding:40px 36px;text-align:center}.current-location h1{font-family:var(--font-display);font-size:26px;font-weight:600;margin:0 0 2px}.current-location p{margin:0;color:var(--ink-muted);font-size:14px}.current-main{display:flex;align-items:center;justify-content:center;gap:20px;margin:28px 0 4px}.current-icon{font-size:64px;line-height:1}.current-temp{font-family:var(--font-display);font-size:84px;font-weight:700;line-height:1;display:flex;align-items:flex-start}.current-temp .unit{font-size:32px;font-weight:500;margin-top:6px;color:var(--ink-muted)}.current-condition{margin:0 0 28px;font-size:17px;color:var(--ink-muted)}.current-details{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:0;padding-top:24px;border-top:1px solid var(--glass-border)}.current-details dt{font-size:12px;color:var(--ink-muted);margin-bottom:6px}.current-details dd{margin:0;font-family:var(--font-mono);font-size:18px}.forecast-title{font-family:var(--font-display);font-size:15px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-muted);margin:0 0 14px 4px;font-weight:500}.forecast-list{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(84px,1fr));gap:10px;margin:0;padding:0}.forecast-card{background:var(--glass-fill);border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(var(--glass-blur));backdrop-filter:blur(var(--glass-blur));border-radius:var(--radius-md);padding:16px 8px;text-align:center}.forecast-day{margin:0 0 8px;font-size:13px;color:var(--ink-muted);text-transform:capitalize}.forecast-icon{font-size:30px;display:block;margin-bottom:8px}.forecast-condition{margin:0 0 10px;font-size:11px;color:var(--ink-muted);min-height:28px}.forecast-temps{margin:0;font-family:var(--font-mono);font-size:14px;display:flex;justify-content:center;gap:8px}.temp-max{color:var(--ink)}.temp-min{color:var(--ink-muted)}.spinner-block{display:flex;flex-direction:column;align-items:center;gap:14px;padding:80px 20px;color:var(--ink-muted)}.spinner{width:34px;height:34px;border-radius:50%;border:3px solid var(--glass-border);border-top-color:var(--ink);animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.error-block{display:flex;flex-direction:column;align-items:center;gap:10px;padding:40px 20px;text-align:center;background:var(--glass-fill);border:1px solid var(--glass-border);border-radius:var(--radius-md)}.error-icon{font-size:28px}.error-text{margin:0;color:var(--ink)}.retry-button{background:#ffffff24;border:none;color:var(--ink);padding:8px 20px;border-radius:999px;font-size:14px}.retry-button:hover{background:#ffffff38}@media (max-width: 640px){.comparison-grid{grid-template-columns:1fr}.comparison-distance{flex-direction:row;justify-content:center;gap:10px;padding:4px 8px}.comparison-distance-icon{transform:rotate(180deg)}.comparison-distance-label{max-width:none;text-align:left}}@media (max-width: 480px){.current-temp{font-size:64px}.current-icon{font-size:48px}.current-weather{padding:28px 20px}.current-details{grid-template-columns:repeat(3,1fr);gap:6px}.geo-button{width:44px;height:44px}.unit-toggle button,.lang-toggle button{padding:10px 14px}.theme-toggle{width:44px;height:44px}.app-header-controls{flex-wrap:wrap;justify-content:center}.app-tagline{font-size:14px;padding:0 8px}.city-card{padding:22px 16px;min-height:unset}.city-card-temp{font-size:34px}}.app-footer{width:100%;max-width:640px;margin-top:56px;padding-top:24px;border-top:1px solid var(--glass-border);display:flex;flex-wrap:wrap;justify-content:center;gap:6px 20px;text-align:center}.app-footer p{margin:0;font-size:13px;color:var(--ink-muted)}.app-footer a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--glass-border);transition:border-color .2s ease}.app-footer a:hover{border-color:var(--ink)}.app-footer-meta{width:100%;font-family:var(--font-mono);font-size:11px;margin-top:4px}@media (prefers-reduced-motion: reduce){.spinner{animation:none}.sky-layer,.app{transition:none}}