.weather-app-page{font-family:Outfit,sans-serif;background:#07151d}.weather-app-page main{max-width:1380px;margin:auto;padding:120px 4vw 30px}.weather-hub-heading,.city-browse-heading{display:flex;align-items:center;justify-content:space-between;gap:30px;margin-bottom:28px}.weather-hub h1{font-size:clamp(38px,4.6vw,66px);line-height:1.05;letter-spacing:-.055em;margin:12px 0 16px}.weather-hub p,.city-browse p{color:var(--app-muted)}.weather-hub .eyebrow,.city-browse .eyebrow{font-size:10px;letter-spacing:.16em;color:var(--app-accent)}.weather-modes,.day-count{display:flex;padding:5px;gap:4px;background:var(--app-surface);border:1px solid var(--app-line);border-radius:24px}.weather-app-page button{font:600 13px Outfit,sans-serif;color:var(--app-text);background:var(--app-raised);border:1px solid var(--app-line);padding:12px 18px;border-radius:22px;cursor:pointer;min-height:44px}.weather-modes button,.day-count button{border:0;background:transparent;white-space:nowrap}.weather-app-page button[aria-pressed=true]{background:var(--app-accent);color:var(--app-bg)}.place-search{max-width:650px}.place-search label,.city-browse label{display:block;font-size:12px;color:var(--app-muted);margin-bottom:8px}.place-search>div{display:flex;gap:8px}.weather-app-page input{font:16px Outfit,sans-serif;background:var(--app-surface);color:var(--app-text);border:1px solid var(--app-line);border-radius:16px;padding:14px 18px;min-width:0;width:100%}.place-search input{flex:1}.place-results{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}#weather-status{font-size:12px;min-height:18px;margin:12px 0 20px}.weather-dashboard{display:grid;grid-template-columns:1fr 1.1fr;gap:24px}.today-panel,.forecast-panel,.hourly-panel{border-radius:28px;border:1px solid var(--app-line);padding:32px;background:var(--app-surface);min-width:0}.today-panel{background:radial-gradient(ellipse at 95% 0%,#18887955,transparent 65%),var(--app-surface)}.today-top,.forecast-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.today-top>span{font-size:15px;font-weight:600}.today-top button{padding:8px 12px;font-size:12px}.today-panel #place-clock{font-size:12px;margin-top:4px}.current-weather{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:30px 0 0}.current-weather strong{font-size:clamp(80px,9vw,120px);font-weight:500;line-height:1;letter-spacing:-.065em}.current-weather .app-icon{font-size:80px;color:#f4be63}.today-panel h2{font-size:24px;margin:12px 0}.weather-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:28px 0}.weather-stats>div{border-left:1px solid var(--app-line);padding-left:14px}.weather-stats span{display:block;font-size:11px;color:var(--app-muted);margin-bottom:8px}.weather-stats strong{font-size:19px;font-weight:500}.wear-tip{padding-top:20px;border-top:1px solid var(--app-line);font-size:14px;line-height:1.6}.forecast-heading h2,.hourly-panel h2{font-size:22px;letter-spacing:-.03em;margin:0}.day-count button{font-size:11px;padding:8px 12px}.daily-forecast{margin-top:14px;max-height:420px;overflow:auto}.forecast-day{display:grid;grid-template-columns:65px 1fr 32px 42px 70px;align-items:center;gap:12px;padding:18px 0;border-bottom:1px solid var(--app-line);font-size:14px}.forecast-day .app-icon{font-size:25px;color:var(--app-accent)}.forecast-day .condition,.forecast-day .pop{color:var(--app-muted);font-size:12px}.forecast-day .temps{white-space:nowrap;text-align:right}.forecast-day .temps span{color:var(--app-muted);margin-left:8px}.forecast-note{font-size:11px;margin:18px 0 0}.hourly-panel{margin-top:24px}.hourly-forecast{display:grid;grid-template-columns:repeat(12,minmax(65px,1fr));gap:18px;overflow-x:auto;padding-top:24px}.forecast-hour{display:flex;flex-direction:column;align-items:center;gap:12px}.forecast-hour span:first-child{font-size:11px;color:var(--app-muted);white-space:nowrap}.forecast-hour .app-icon{font-size:26px;color:var(--app-accent)}.forecast-hour strong{font-size:18px;font-weight:500}.weather-attribution{font-size:11px;margin:18px 0 0;line-height:1.7}.weather-attribution a{color:var(--app-accent)}.city-browse{margin-top:65px}.city-browse h2{font-size:36px;letter-spacing:-.04em;margin:8px 0}.city-directory{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.weather-app-page .city-directory a{background:var(--app-surface);border:1px solid var(--app-line);border-radius:18px;color:var(--app-text);padding:20px;text-decoration:none}.city-directory a[hidden]{display:none}.city-directory strong{font-size:15px}.city-directory span{font-size:11px;color:var(--app-muted)!important;margin-top:8px}.global-explore{display:grid;grid-template-columns:1fr 1fr;gap:40px;padding:36px;margin-top:24px;border-radius:28px;background:radial-gradient(at 0% 100%,#2e777733,transparent),var(--app-surface);border:1px solid var(--app-line)}.global-explore[hidden]{display:none}.global-explore h2{font-size:32px;letter-spacing:-.04em;line-height:1.15}.world-places{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.world-places button{text-align:left;border-radius:18px;background:var(--app-bg)}.world-places button span{display:block;font-size:11px;color:var(--app-muted);margin-top:5px}.weather-app-page :is(button,input,a):focus-visible{outline:3px solid var(--app-accent);outline-offset:3px}.weather-app-page footer{padding:30px 4vw}.weather-app-page .watch-callout{margin-top:45px;background:var(--app-surface);border-color:var(--app-line);border-radius:24px}.weather-app-page .watch-callout a{color:var(--app-accent)}@media(max-width:900px){.weather-hub-heading{align-items:start;flex-direction:column;gap:15px}.weather-dashboard{grid-template-columns:1fr}.city-directory{grid-template-columns:repeat(3,1fr)}.forecast-day{padding:16px 0}.global-explore{grid-template-columns:1fr}.daily-forecast{max-height:420px}}@media(max-width:600px){.weather-app-page main{padding:95px 16px 20px}.weather-hub h1{font-size:42px}.weather-hub-heading{gap:12px}.today-panel,.forecast-panel,.hourly-panel{padding:22px}.weather-dashboard{gap:16px}.forecast-heading{flex-wrap:wrap}.forecast-day{grid-template-columns:53px 1fr 28px 34px 65px;gap:6px}.forecast-day .condition{font-size:10px}.city-directory{grid-template-columns:repeat(2,1fr)}.city-browse-heading{flex-direction:column;align-items:stretch;gap:10px}.city-browse h2{font-size:30px}.city-directory a{padding:16px!important}.city-directory strong{font-size:13px}.global-explore{padding:24px;gap:20px}.current-weather strong{font-size:100px}.weather-stats strong{font-size:17px}}
