*{box-sizing:border-box}body{background:linear-gradient(135deg,#e3e5e8 0%,#c6cfcf 35%,#d6c7bd 70%,#dccdba 100%);min-width:320px;min-height:100vh;margin:0;font-family:Arial,sans-serif}#root{min-height:100vh}.WeeklyForecast{border-top:1px solid #b58f7640;width:100%;min-width:0;margin-top:35px;padding-top:30px}.WeeklyForecast h3{font-family:var(--font-heading);color:var(--color-text-primary);text-align:left;margin:0 0 20px;font-size:28px;font-weight:400;line-height:1.2}span.fivedays{color:var(--color-accent);font-size:38px;font-family:var(--font-heading)}.Forecast{text-align:center;width:100%;min-width:0;margin-top:0;padding-top:10px}.Forecast .row{scrollbar-width:thin;scrollbar-color:#b58f768c transparent;grid-template-columns:repeat(5,minmax(0,1fr));align-items:stretch;gap:12px;width:100%;min-width:0;margin:0;padding:5px 2px 12px;display:grid;overflow:auto hidden}.Forecast .col{min-width:0;display:flex}.Forecast .row::-webkit-scrollbar{height:6px}.Forecast .row::-webkit-scrollbar-track{background:#b58f7614;border-radius:10px}.Forecast .row::-webkit-scrollbar-thumb{background:#b58f768c;border-radius:10px}.Forecast .row::-webkit-scrollbar-thumb:hover{background:#8f7660bf}.Forecast .col>*{box-sizing:border-box;background:#ffffff59;border:1px solid #ffffff80;border-radius:18px;width:100%;padding:14px 8px}.WeatherForecast-day{font-family:var(--font-body);color:var(--color-text-secondary);margin-bottom:12px;font-size:15px;font-weight:500}.weather-icon-forecast{min-height:48px;color:var(--color-accent);justify-content:center;align-items:center;margin-bottom:12px;font-size:42px;line-height:1;display:flex}.WeatherForecast-temperature{font-family:var(--font-body);color:var(--color-text-primary);white-space:nowrap;font-size:15px;font-weight:500}.WeatherForecast-temperature-max{font-weight:500}.WeatherForecast-temperature-min{opacity:.55;margin-left:5px;font-weight:400}@media (width<=768px){.WeeklyForecast{margin-top:30px;padding-top:28px}.WeeklyForecast h3{margin-bottom:20px;font-size:28px}.Forecast{padding-top:8px}.Forecast .row{scroll-behavior:smooth;scroll-snap-type:x proximity;gap:12px;padding:5px 2px 12px;display:flex;overflow-x:auto}.Forecast .col{scroll-snap-align:start;flex:0 0 100px}.Forecast .col>*{padding:13px 7px}.WeatherForecast-day{font-size:14px}.weather-icon-forecast{font-size:40px}.WeatherForecast-temperature{font-size:14px}}@media (width<=576px){.WeeklyForecast{margin-top:25px;padding-top:25px}.WeeklyForecast h3{margin-bottom:15px;font-size:25px}.Forecast{padding-top:5px;overflow:hidden}.Forecast .row{scroll-behavior:smooth;scroll-snap-type:x proximity;gap:10px;width:100%;max-width:100%;padding:5px 2px 12px;display:flex;overflow:auto hidden}.Forecast .col{scroll-snap-align:start;flex:0 0 calc(33.3333% - 6.66667px);min-width:0}.Forecast .col>*{border-radius:16px;padding:12px 5px}.WeatherForecast-day{margin-bottom:10px;font-size:13px}.weather-icon-forecast{min-height:42px;margin-bottom:10px;font-size:36px}.WeatherForecast-temperature{font-size:13px}.WeatherForecast-temperature-min{margin-left:3px}}.HourlyForecast{text-align:left;border-top:1px solid #b58f7640;width:100%;min-width:0;margin-top:35px;padding-top:30px}.HourlyForecast h3{font-family:var(--font-heading);color:var(--color-text-primary);margin:0 0 20px;font-size:28px;font-weight:400;line-height:1.2}.HourlyForecast-scroll{scroll-behavior:smooth;scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:#b58f768c transparent;gap:12px;width:100%;min-width:0;padding:5px 2px 12px;display:flex;overflow:auto hidden}.HourlyForecast-scroll::-webkit-scrollbar{height:6px}.HourlyForecast-scroll::-webkit-scrollbar-track{background:#b58f7614;border-radius:10px}.HourlyForecast-scroll::-webkit-scrollbar-thumb{background:#b58f768c;border-radius:10px}.HourlyForecast-scroll::-webkit-scrollbar-thumb:hover{background:#8f7660bf}.HourlyForecast-item{box-sizing:border-box;text-align:center;scroll-snap-align:start;background:#ffffff59;border:1px solid #ffffff80;border-radius:18px;flex-direction:column;flex:0 0 78px;align-items:center;padding:12px 8px;display:flex}.HourlyForecast-time{font-family:var(--font-body);color:var(--color-text-secondary);margin-bottom:10px;font-size:14px;font-weight:500}.HourlyForecast-icon{min-height:38px;color:var(--color-accent);justify-content:center;align-items:center;margin-bottom:10px;font-size:34px;line-height:1;display:flex}.HourlyForecast-temperature{font-family:var(--font-heading);color:var(--color-text-primary);font-size:24px;font-weight:500}@media (width<=768px){.HourlyForecast{margin-top:30px;padding-top:28px}.HourlyForecast h3{margin-bottom:18px;font-size:27px}.HourlyForecast-scroll{gap:10px}.HourlyForecast-item{flex:0 0 calc(16.6667% - 8.33333px);padding:11px 6px}.HourlyForecast-time{font-size:13px}.HourlyForecast-icon{font-size:32px}.HourlyForecast-temperature{font-size:23px}}@media (width<=576px){.HourlyForecast{margin-top:25px;padding-top:25px}.HourlyForecast h3{margin-bottom:15px;font-size:25px}.HourlyForecast-scroll{gap:10px;max-width:100%;padding:4px 2px 12px}.HourlyForecast-item{border-radius:16px;flex:0 0 calc(25% - 7.5px);padding:10px 5px}.HourlyForecast-time{margin-bottom:8px;font-size:12px}.HourlyForecast-icon{min-height:34px;margin-bottom:8px;font-size:30px}.HourlyForecast-temperature{font-size:21px}}body{background-color:#d9d4cf;background-image:url(/assets/weather-background-5uYWciY0.png);background-position:50%;background-repeat:no-repeat;background-size:cover;background-attachment:fixed;min-height:100vh;margin:0}:root{--color-text-primary:#3f4a4d;--color-text-secondary:#596366;--color-accent:#b58f76;--color-accent-hover:#8f7660;--color-border:#c6cfcf;--color-placeholder:#9ca8a9;--color-button:#9ca6a6;--color-button-hover:#7f8b8c;--color-cream:#faf8f4;--color-sand:#cfc1b2;--color-white:#fff;--font-body:"Space Grotesk", sans-serif;--font-heading:"Cormorant Garamond", serif}.App{box-sizing:border-box;text-align:center;width:100%;max-width:900px;color:var(--color-text-primary);font-family:var(--font-body);margin:0 auto;padding:60px 24px}.app-title{font-family:var(--font-heading);letter-spacing:1.5px;color:var(--color-text-primary);margin:0 0 35px;font-size:48px;font-weight:400;line-height:1.1}.Search{width:100%;max-width:650px;margin:0 auto 35px}.Search form{grid-template-columns:1fr auto auto;gap:10px;width:100%;display:grid}.Search input[type=search]{border:1px solid var(--color-border);width:100%;min-width:0;color:var(--color-text-primary);font-family:var(--font-body);background-color:#faf8f4e6;border-radius:30px;outline:none;padding:15px 20px;font-size:16px;transition:all .3s}.Search input[type=search]::placeholder{color:var(--color-placeholder)}.Search input[type=search]:focus{border-color:var(--color-placeholder);box-shadow:0 0 0 4px #c6cfcf59}.Search input[type=submit],.Search button{background-color:var(--color-button);color:var(--color-white);font-family:var(--font-body);letter-spacing:.5px;cursor:pointer;white-space:nowrap;border:none;border-radius:30px;padding:15px 24px;font-size:16px;font-weight:500;transition:all .3s}.Search input[type=submit]:hover,.Search button:hover{background-color:var(--color-button-hover);transform:translateY(-2px)}.Search input[type=submit]:active,.Search button:active{transform:translateY(0)}.Search button svg{margin-left:4px}.Weather{box-sizing:border-box;-webkit-backdrop-filter:blur(12px);background:#faf8f4c7;border:1px solid #ffffffbf;border-radius:28px;width:100%;max-width:650px;min-height:300px;margin:0 auto;padding:42px 45px;position:relative;box-shadow:0 20px 50px #3f4a4d1f,inset 0 1px #ffffffb3}.weather-header{text-align:left;grid-template-columns:1fr auto;grid-template-areas:"city time""date time""description description";gap:0 20px;display:grid}.weather-header h2{font-family:var(--font-heading);color:var(--color-text-primary);grid-area:city;margin:0;font-size:60px;font-weight:400;line-height:1}.DateTime{display:contents}.DateTime .date{font-family:var(--font-body);color:var(--color-text-secondary);grid-area:date;margin:6px 0 0;font-size:15px;line-height:1.2}.DateTime .time{font-family:var(--font-heading);color:var(--color-accent);grid-area:time;align-self:start;margin:0;font-size:52px;line-height:1}.weather-description{text-transform:capitalize;color:var(--color-text-secondary);grid-area:description;margin:14px 0 0;font-size:17px;font-weight:400}.weather-main{grid-template-columns:1.2fr 1fr;align-items:center;gap:45px;margin-top:35px;display:grid}.temperature-section{align-items:center;gap:16px;display:flex}.weather-icon{color:var(--color-accent);justify-content:center;align-items:center;font-size:105px;line-height:1;display:flex}.temperature{font-family:var(--font-heading);color:var(--color-text-primary);font-size:72px;font-weight:400;line-height:1}a{text-decoration:none}a.temperature{color:var(--color-text-primary);cursor:pointer}a.temperature:hover{color:var(--color-accent-hover)}.weather-details{border-left:1px solid #b58f764d;flex-direction:column;gap:18px;padding-left:25px;display:flex}.weather-detail{justify-content:space-between;align-items:baseline;gap:20px;display:flex}.weather-detail span{letter-spacing:1.2px;text-transform:uppercase;color:var(--color-text-secondary);font-size:12px}.weather-detail strong{color:var(--color-text-primary);font-size:17px;font-weight:500}.error{color:var(--color-text-secondary);background-color:#cfc1b259;border-radius:16px;margin:20px 0;padding:18px;font-size:16px}.Footer{width:fit-content;max-width:100%;color:var(--color-text-primary);-webkit-backdrop-filter:blur(8px);background:#faf8f4a6;border:1px solid #ffffffb3;border-radius:18px;margin:50px auto 0;padding:12px 22px;font-size:14px;box-shadow:0 8px 25px #3f4a4d1f,inset 0 1px #ffffffb3}.react-logo{width:16px;height:16px;margin:0 4px -2px;display:inline-block}.footer-link{color:var(--color-accent);text-decoration:none;transition:color .3s}.footer-link:hover{color:var(--color-accent-hover);text-decoration:underline}.weather-content.is-loading{visibility:hidden}.weather-loading{z-index:10;-webkit-backdrop-filter:blur(2px);background:#faf8f48c;border-radius:28px;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}@media (width<=768px){.App{padding:45px 20px}.app-title{margin-bottom:30px;font-size:44px}.Weather{padding:35px 30px}.weather-header h2,.DateTime .time{font-size:42px}.DateTime .date{margin-top:6px}.weather-description{margin-top:14px}.weather-main{grid-template-columns:1fr;gap:30px}.weather-details{border-top:1px solid #b58f764d;border-left:none;padding-top:20px;padding-left:0}}@media (width<=576px){.App{padding:35px 15px}.app-title{letter-spacing:1px;margin-bottom:25px;font-size:38px}.Search{margin-bottom:25px}.Search form{flex-direction:column;gap:10px;display:flex}.Search input[type=search],.Search input[type=submit],.Search button{box-sizing:border-box;width:100%}.Search input[type=submit],.Search button{padding:14px 20px}.Weather{border-radius:22px;min-height:280px;padding:30px 22px}.weather-header{grid-template-columns:1fr auto;grid-template-areas:"city time""date time""description description";gap:0 12px}.weather-header h2,.DateTime .time{font-size:38px;line-height:1}.DateTime .date{margin-top:6px;font-size:15px;line-height:1.2}.weather-description{margin-top:14px}.weather-main{gap:25px;margin-top:30px}.temperature-section{justify-content:center}.weather-icon{font-size:85px}.temperature{font-size:60px}.weather-details{gap:16px}.weather-loading{border-radius:22px}body{background-position:50%;background-attachment:scroll}}
