@import"https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap";:root{color-scheme:dark;font-family:Manrope,system-ui,sans-serif;line-height:1.5;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--bg-start: #0f172a;--bg-end: #312e81;--text-primary: #f8fafc;--text-secondary: rgba(248, 250, 252, .72);--glass-bg: rgba(255, 255, 255, .08);--glass-border: rgba(255, 255, 255, .18);--accent: #38bdf8;--accent-strong: #0ea5e9;--danger: #fca5a5}*,*:before,*:after{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;min-width:320px;color:var(--text-primary);background:radial-gradient(circle at top left,rgba(56,189,248,.25),transparent 35%),radial-gradient(circle at bottom right,rgba(168,85,247,.22),transparent 30%),linear-gradient(135deg,var(--bg-start),var(--bg-end));background-attachment:fixed}button,input{font:inherit}button{cursor:pointer}button:disabled,input:disabled{cursor:not-allowed;opacity:.65}.app{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}.app__shell{width:min(100%,560px);display:grid;gap:24px}.app__hero{text-align:center}.app__badge{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;border:1px solid var(--glass-border);background:#ffffff0f;color:var(--text-secondary);font-size:.875rem;letter-spacing:.02em}.app__title{margin:16px 0 8px;font-size:clamp(2rem,5vw,3rem);line-height:1.05;font-weight:800}.app__subtitle{margin:0;color:var(--text-secondary);font-size:1rem}.city-search{display:grid;gap:10px}.city-search__label{font-size:.875rem;font-weight:600;color:var(--text-secondary)}.city-search__controls{display:grid;grid-template-columns:1fr auto;gap:12px}.city-search__input{width:100%;padding:14px 16px;border-radius:16px;border:1px solid var(--glass-border);background:#0f172a73;color:var(--text-primary);outline:none;transition:border-color .2s ease,box-shadow .2s ease}.city-search__input::placeholder{color:#f8fafc73}.city-search__input:focus{border-color:#38bdf8cc;box-shadow:0 0 0 4px #38bdf826}.city-search__button{padding:0 20px;border:none;border-radius:16px;background:linear-gradient(135deg,var(--accent),var(--accent-strong));color:#082f49;font-weight:700;white-space:nowrap;transition:transform .2s ease,box-shadow .2s ease}.city-search__button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 12px 24px #0ea5e947}.weather-card,.status-card{padding:28px;border-radius:28px;border:1px solid var(--glass-border);background:var(--glass-bg);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:0 24px 60px #0f172a59,inset 0 1px #ffffff14}.weather-card__header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.weather-card__label{margin:0 0 4px;color:var(--text-secondary);font-size:.875rem}.weather-card__city{margin:0;font-size:1.75rem;font-weight:700}.weather-card__emoji{font-size:3rem;line-height:1}.weather-card__main{margin-top:24px}.weather-card__temperature{margin:0;font-size:clamp(4rem,14vw,5.5rem);line-height:.95;font-weight:800;letter-spacing:-.04em}.weather-card__description{margin:8px 0 0;font-size:1.125rem;color:var(--text-secondary)}.weather-card__stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:28px 0 0}.weather-card__stat{padding:14px;border-radius:18px;background:#0f172a59;border:1px solid rgba(255,255,255,.08)}.weather-card__stat dt{margin:0;font-size:.75rem;text-transform:uppercase;letter-spacing:.06em;color:var(--text-secondary)}.weather-card__stat dd{margin:8px 0 0;font-size:1.125rem;font-weight:700}.status-card{text-align:center}.status-card__spinner{width:42px;height:42px;margin:0 auto 16px;border-radius:50%;border:3px solid rgba(255,255,255,.15);border-top-color:var(--accent);animation:spin .9s linear infinite}.status-card__title{margin:0 0 8px;font-size:1.25rem;font-weight:700}.status-card__text{margin:0;color:var(--text-secondary)}.status-card--error .status-card__title{color:var(--danger)}.status-card__button{margin-top:18px;padding:12px 18px;border:1px solid var(--glass-border);border-radius:14px;background:#ffffff0f;color:var(--text-primary);font-weight:600}.status-card__button:hover:not(:disabled){background:#ffffff1f}@keyframes spin{to{transform:rotate(360deg)}}@media (max-width: 640px){.app{padding:16px}.city-search__controls,.weather-card__stats{grid-template-columns:1fr}}