.weather-app--loading .weather-stream{min-height:100vh}
.weather-app--loading .stream-topbar>.brand{font-size:18px;letter-spacing:-.05em;white-space:nowrap}
.weather-app--loading .stream-topbar{width:100%;box-sizing:border-box;min-width:0}
.weather-app--loading .stream-topbar .city-search__form{display:block;position:relative;flex:0 0 42px;width:42px;height:42px;margin:0 0 0 auto}
.weather-app--loading .stream-topbar .city-search__form button{display:grid;visibility:visible;opacity:1;right:0;top:0}
.weather-loading{padding:52px clamp(28px,5.2vw,68px);min-height:calc(100vh - 92px);background:linear-gradient(145deg,#337d97,#225f77);color:#fff}
.weather-loading__status{max-width:500px}
.weather-loading__spinner{display:block;width:30px;height:30px;border:2px solid #ffffff35;border-top-color:#ffc34c;border-radius:50%;animation:weather-loading-spin .85s linear infinite;margin-bottom:24px}
.weather-loading__eyebrow{font:11px "DM Mono",monospace;letter-spacing:.06em;margin:0 0 12px;color:#c3e8f1}
.weather-loading h1{font-size:clamp(27px,3vw,40px);font-weight:600;letter-spacing:-.05em;line-height:1.12;margin:0 0 14px}
.weather-loading__status>p:last-of-type{font-size:14px;line-height:1.65;color:#d8edf4;margin:0;max-width:340px}
.weather-loading__skeleton{margin-top:40px;opacity:.7}
.weather-loading__hero{height:114px;border-radius:12px;background:#ffffff0d;border:1px solid #ffffff1a;margin-bottom:28px}
.weather-loading__row{height:56px;border-top:1px solid #ffffff20;position:relative}
.weather-loading__row:before,.weather-loading__row:after{content:"";position:absolute;top:20px;height:9px;border-radius:10px;background:#ffffff15;left:0;width:42%}
.weather-loading__row:after{left:auto;right:0;width:12%}
.weather-loading__retry{background:#ffc34c;border:0;border-radius:8px;color:#164e66;padding:12px 18px;font-size:13px;font-weight:700;margin-top:24px;cursor:pointer}
.weather-loading__retry:focus-visible{outline:2px solid #fff;outline-offset:4px}
.weather-loading__rail{height:100vh;position:sticky;top:0;background:#205b74;padding:30px 18px}
.weather-loading__rail>span{font:10px "DM Mono",monospace;color:#c3e8f1;letter-spacing:.05em}
.weather-loading__rail>div{height:80px;border-top:1px solid #ffffff20;margin-top:20px;background:#ffffff05;border-radius:6px}
@keyframes weather-loading-spin{to{transform:rotate(360deg)}}
@media(max-width:1100px){.weather-loading__rail{display:none}}
@media(max-width:760px){.weather-loading{padding:40px 24px;min-height:calc(100vh - 64px)}.weather-loading__skeleton{margin-top:30px}.weather-app--loading .stream-topbar{display:flex;align-items:center;justify-content:space-between}.weather-loading__hero{height:100px}}
@media(prefers-reduced-motion:reduce){.weather-loading__spinner{animation:none;border-top-color:#ffc34c;border-right-color:#ffc34c}}

.weather-app--switching .weather-stream{position:relative;min-height:100vh}.weather-app--switching .current-hero,.weather-app--switching .forecast-day,.weather-app--switching .weekly-rail,.weather-app--switching .weekly-rail--desktop,.weather-app--switching .weekly-rail--mobile{visibility:hidden;pointer-events:none}.city-transition{position:absolute;top:140px;left:clamp(28px,5.2vw,68px);right:clamp(28px,5.2vw,68px);z-index:5;border:1px solid #ffffff30;border-radius:14px;background:#316f87;padding:26px;color:#fff;box-shadow:0 12px 36px #103e5320}.city-transition h2{font-size:23px;font-weight:600;letter-spacing:-.035em;line-height:1.25;margin:0 0 10px}.city-transition p{font-size:13px;line-height:1.6;margin:0;color:#d8edf4}.city-transition .weather-loading__spinner{width:24px;height:24px;margin-bottom:18px}.weather-app--switching .site-footer{visibility:hidden}.weather-app--switching .weather-stream:after{content:"";position:absolute;inset:340px 0 0;background:linear-gradient(#286f89,#286f89e8);pointer-events:none}.weather-app--switching .current-hero__note{visibility:hidden}@media(max-width:760px){.city-transition{top:140px;left:20px;right:20px;padding:24px}.city-transition h2{font-size:22px}}
