.weather-page-button{border:1px solid #c9ddec;background:#f4faff;color:#46758e;border-radius:8px;padding:8px 10px;font:700 11px 'DM Sans',sans-serif;cursor:pointer}.weather-modal{position:fixed;z-index:95;inset:0;display:grid;place-items:center;padding:18px;background:#20333a82;opacity:0;pointer-events:none;transition:.2s}.weather-modal.open{opacity:1;pointer-events:auto}.weather-page{width:min(800px,95vw);max-height:90vh;overflow:auto;background:#fffdf9;border-radius:18px;padding:27px}.weather-page header{display:flex;justify-content:space-between}.weather-page h2,.weather-page h3{font-family:Fraunces,serif;margin:0}.weather-page h2{font-size:30px}.weather-page header button{border:0;background:none;color:#718386;font-size:21px;cursor:pointer}.weather-hero{margin:18px 0;background:linear-gradient(120deg,#fbd77d,#ed9b71);border-radius:14px;padding:20px;display:flex;align-items:center;gap:20px}.weather-hero>div:first-child{display:grid;grid-template-columns:60px 1fr;align-items:center}.weather-hero>div:first-child span{font-size:44px;grid-row:span 2}.weather-hero b{font:40px Fraunces,serif}.weather-hero p{margin:0;font-size:12px}.weather-stats{display:grid;gap:7px;margin-left:auto;font-size:11px}.weather-stats b{margin-left:7px}.weather-page h3{font-size:21px;margin:21px 0 10px}.hourly-weather{display:flex;justify-content:space-between;gap:8px}.hourly-weather span{flex:1;text-align:center;background:#f5f8f4;border-radius:9px;padding:10px 5px}.hourly-weather b,.hourly-weather i,.hourly-weather em{display:block}.hourly-weather b{font-size:9px;color:#71868b}.hourly-weather i{font-size:20px;font-style:normal;margin:6px}.hourly-weather em{font-size:11px;font-style:normal;font-weight:700}.week-weather div{display:grid;grid-template-columns:1fr 1.5fr 1fr;padding:11px 4px;border-bottom:1px solid #edf0ed;font-size:12px}.week-weather span{color:#71868b}.week-weather em{text-align:right;font-style:normal;font-weight:700}@media(max-width:600px){.weather-hero{flex-wrap:wrap}.weather-stats{margin-left:0}.hourly-weather{overflow:auto}.hourly-weather span{min-width:62px}}
