@import"https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@700;800&display=swap";:root{font-family:DM Sans,sans-serif;color:#122033;background:#f6f8fb;font-synthesis:none}*{box-sizing:border-box}body{margin:0}.app-shell{min-height:100vh;display:flex}.sidebar{width:260px;background:#10243a;color:#dce8f4;padding:30px 20px;display:flex;flex-direction:column}.brand{display:flex;align-items:center;gap:10px;color:#fff;font:800 24px Manrope;margin:0 10px 70px}.brand svg{color:#ffbf4b}.saved-heading{display:flex;justify-content:space-between;align-items:center;color:#8ea6bd;text-transform:uppercase;letter-spacing:1.5px;font-size:11px;font-weight:700;padding:0 10px 14px}.saved-heading button{background:none;border:0;color:#6d87a0;cursor:pointer}.saved-list{display:grid;gap:5px}.saved-place{display:flex;align-items:center;border-radius:9px}.saved-place.active{background:#1c3855}.saved-place>button:first-child{display:flex;gap:11px;align-items:center;flex:1;background:none;border:0;color:#dce8f4;text-align:left;padding:12px 8px;cursor:pointer}.saved-place svg{color:#7fa2c3;flex:none}.saved-place small{display:block;color:#8097ac;font-size:11px;margin-top:3px}.saved-place .delete{background:none;border:0;color:#607b94;padding:8px;cursor:pointer;opacity:.5}.saved-place .delete:hover{opacity:1;color:#f58a8a}.side-empty{font-size:13px;line-height:1.5;color:#7f96aa;padding:0 10px}.sidebar-footer{margin-top:auto;border-top:1px solid #2a425a;padding:22px 10px 0;display:flex;gap:12px;align-items:center;color:#7891a8;font-size:12px;line-height:1.4}.weather-mark{color:#ffbf4b;font-size:35px}.main{max-width:1060px;width:100%;margin:0 auto;padding:48px 58px 80px}.topbar{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:32px}.eyebrow{color:#7e94a9;font-size:10px;font-weight:700;letter-spacing:2px;margin:0 0 8px}.topbar h1{font:800 31px Manrope;margin:0;color:#10243a}.unit-toggle{border:1px solid #d8e1e9;background:#fff;border-radius:25px;padding:4px;display:flex;gap:2px;color:#8798a9;cursor:pointer}.unit-toggle span{border-radius:18px;padding:7px 12px;font-weight:700;font-size:13px}.unit-toggle .selected{background:#10243a;color:#fff}.search-wrap{height:54px;background:#fff;border:1px solid #e0e7ee;border-radius:12px;display:flex;align-items:center;padding:0 10px 0 18px;color:#92a3b3;box-shadow:0 3px 10px #20364b08}.search-wrap input{border:0;outline:0;flex:1;font:15px DM Sans;color:#1b2c3c;padding:0 12px}.search-wrap button,.error-card button{border:0;border-radius:8px;background:#ffb83e;color:#152b42;font-weight:700;padding:11px 20px;cursor:pointer}.search-wrap button:disabled{opacity:.6}.results-panel{background:#fff;position:relative;z-index:3;margin-top:6px;border:1px solid #e0e7ee;border-radius:10px;box-shadow:0 10px 30px #1c385522;overflow:hidden}.results-panel button{width:100%;border:0;border-bottom:1px solid #edf1f5;background:#fff;display:flex;align-items:center;gap:13px;padding:14px 18px;text-align:left;color:#7890a5;cursor:pointer}.results-panel button:hover{background:#f8fafc}.results-panel button span{flex:1}.results-panel strong,.results-panel small{display:block}.results-panel strong{color:#142b42}.results-panel small{font-size:12px;margin-top:3px}.form-message{color:#b04a4a;font-size:13px;padding:9px 4px}.welcome{text-align:center;margin:130px auto;max-width:370px}.welcome-art{font-size:75px;color:#ffbd43;margin-bottom:16px}.welcome h2{font:800 27px Manrope;margin:0 0 8px}.welcome p{color:#7d8d9d;line-height:1.6;margin:0}.hero-card{margin-top:28px;border-radius:18px;padding:28px 32px 30px;background:linear-gradient(120deg,#dff3ff,#c8e4f6 55%,#b6d8ef);min-height:260px;box-shadow:0 8px 30px #12314c14}.hero-location{display:flex;align-items:center;gap:7px;color:#45647d;font-size:14px;font-weight:600}.hero-location .star{margin-left:auto;border:0;background:#fff8;padding:9px;border-radius:50%;color:#355d7a;cursor:pointer}.hero-location .star:disabled{color:#e19b28}.hero-weather{display:flex;align-items:center;gap:25px;margin-top:39px}.hero-weather>div:first-child{display:flex;flex-direction:column;align-items:center;gap:3px}.hero-weather p{margin:0;color:#52718a;font-size:13px}.big-temp{font:800 81px Manrope;color:#14314b;line-height:1}.big-temp small{font:600 25px Manrope;color:#55758e;margin-left:5px}.hero-details{display:flex;flex-direction:column;gap:6px;color:#5f7b91;font-size:12px;border-left:1px solid #94b5c9;padding-left:24px}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin:18px 0 38px}.metric{background:#fff;border:1px solid #e3ebf1;border-radius:12px;display:flex;align-items:center;gap:11px;padding:16px}.metric-icon{border-radius:9px;background:#edf7fb;color:#4c93a9;padding:8px;display:flex}.metric-icon svg{width:17px;height:17px}.metric small,.metric strong{display:block}.metric small{color:#8798a7;font-size:11px;margin-bottom:4px}.metric strong{font-size:14px;color:#1b354c}.forecast-section{margin-top:30px}.section-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.section-title h2{font:800 18px Manrope;margin:0;color:#122b43}.section-title span{font-size:12px;color:#8b9cab}.hourly-scroll{display:flex;background:#fff;border:1px solid #e3ebf1;border-radius:13px;overflow-x:auto}.hour{min-width:91px;flex:1;display:flex;flex-direction:column;align-items:center;gap:10px;padding:17px 8px;border-right:1px solid #edf1f4;color:#7d8e9e;font-size:12px}.hour:last-child{border:0}.hour.now{background:#f2f9fc;color:#27728b}.hour strong{font-size:16px;color:#1d3449}.hour small{color:#5eacbf;font-size:10px}.weather-icon{font-family:Arial,sans-serif;line-height:1}.weather-icon.clear{color:#f5ad2f}.weather-icon.partly-cloudy,.weather-icon.cloudy{color:#6d96ae}.weather-icon.rain,.weather-icon.showers,.weather-icon.storm{color:#5789a7}.weather-icon.snow{color:#73a9bd}.weather-icon.fog{color:#839eae}.daily-list{background:#fff;border:1px solid #e3ebf1;border-radius:13px;padding:3px 20px}.day-row{min-height:66px;display:grid;grid-template-columns:75px 1fr 50px 90px;align-items:center;border-bottom:1px solid #eef2f5;gap:15px;font-size:13px}.day-row:last-child{border:0}.day-row>strong{color:#294157}.day-condition{display:flex;align-items:center;gap:12px;color:#7f919f}.day-condition span{font-size:12px}.rain-chance{color:#63a6b9;font-size:11px}.temps{display:flex;justify-content:space-between}.temps b{color:#203b53}.temps span{color:#91a0ad}.sun-card{display:flex;align-items:center;gap:22px;background:#fff;border:1px solid #e3ebf1;border-radius:13px;padding:20px 25px;margin-top:30px;color:#e9a82f}.sun-card>div:not(.sun-line){display:flex;align-items:center;gap:10px}.sun-card span{font-size:12px;color:#7e909f}.sun-card small{display:block;color:#294157;font-size:13px;margin-top:4px}.sun-card>div:last-child svg{color:#ff9064}.sun-line{height:2px;background:linear-gradient(90deg,#ffc04b,#ff9263);flex:1;position:relative}.sun-line span{position:absolute;width:7px;height:7px;border:2px solid #ffab42;background:#fff;border-radius:50%;top:-3px}.sun-line span:nth-child(1){left:0}.sun-line span:nth-child(2){left:50%}.sun-line span:nth-child(3){right:0}.error-card{text-align:center;background:#fff;border:1px solid #f0d7d7;border-radius:15px;padding:55px 20px;margin-top:30px;color:#b04a4a}.error-card h2{color:#24394d;font:800 20px Manrope}.error-card p{color:#84929f;margin-bottom:22px}.loading{margin-top:28px}.skeleton{border-radius:16px;background:linear-gradient(100deg,#e8eef2 30%,#f5f8fa,#e8eef2 70%);background-size:200% 100%;animation:shine 1.5s infinite}.skeleton.large{height:260px}.skeleton.row{height:95px;margin-top:18px}@keyframes shine{to{background-position:-200% 0}}@media(max-width:800px){.sidebar{width:220px}.main{padding:35px 25px}.metrics{grid-template-columns:repeat(2,1fr)}.hero-weather{gap:15px}.big-temp{font-size:62px}.hero-details{display:none}}@media(max-width:600px){.app-shell{display:block}.sidebar{width:100%;padding:17px 16px;display:block}.brand{margin:0 0 20px}.saved-heading{padding:0 0 8px}.saved-list{display:flex;overflow:auto}.saved-place{min-width:155px;background:#18324d}.sidebar-footer{display:none}.main{padding:27px 16px 50px}.topbar{margin-bottom:22px}.topbar h1{font-size:25px}.search-wrap{height:50px}.search-wrap button{padding:10px 13px}.hero-card{padding:22px 20px}.hero-weather{margin-top:30px}.hero-weather .weather-icon{font-size:54px!important}.big-temp{font-size:53px}.metrics{gap:8px;margin-bottom:28px}.metric{padding:12px 9px}.metric-icon{padding:6px}.day-row{grid-template-columns:55px 1fr 33px 70px;gap:6px}.day-condition span{display:none}.daily-list{padding:3px 10px}.sun-card{gap:10px;padding:16px 12px}.welcome{margin:90px auto}}