.precipitation-app .precipitation-topbar{grid-template-columns:minmax(280px,1fr) auto;width:min(720px,calc(100% - 32px))}.precipitation-app .wind-time-readout .precipitation-confidence{display:inline-flex;align-items:center;min-height:20px;padding:3px 7px;border:1px solid rgba(126,203,245,.34);border-radius:999px;background:rgba(27,92,135,.32);color:#d8f2ff;font-size:.57rem;font-weight:800;letter-spacing:.01em;white-space:nowrap}
.precipitation-badge{display:grid;gap:2px;min-height:54px;padding:9px 13px;border:1px solid rgba(255,255,255,.16);border-radius:15px;background:rgba(7,21,33,.84);box-shadow:0 14px 38px rgba(0,0,0,.26);backdrop-filter:blur(18px) saturate(125%);font-variant-numeric:tabular-nums}
.precipitation-badge b{color:#eaf7ff;font-size:.72rem}.precipitation-badge span{color:#9bb3c1;font-size:.59rem}
.precipitation-app .wind-picker{bottom:10px;left:10px}.precipitation-picker p{margin:4px 0 5px;color:#b9d9f4;font-size:.68rem;line-height:1.35}.precipitation-selected-marker{position:absolute;z-index:20;width:0;height:0;pointer-events:auto}.precipitation-selected-marker>.map-pin{position:absolute;top:-6px;left:-6px;width:13px;height:13px;border:3px solid #fff;border-radius:50%;background:#5b43c7;box-shadow:0 2px 10px rgba(4,10,30,.72)}.precipitation-selected-marker.is-left .wind-picker{right:10px;left:auto;padding-right:14px;padding-left:24px;clip-path:polygon(0 0,100% 0,100% 100%,0 100%,0 62%,6% 50%,0 38%)}.precipitation-selected-marker.is-centered .wind-picker{right:auto;left:50%;transform:translateX(-50%)}.precipitation-selected-marker.is-below .wind-picker{top:10px;bottom:auto}
.precipitation-legend{width:290px}.precipitation-gradient{height:9px;border-radius:999px;background:linear-gradient(90deg,rgba(137,205,245,.35) 0 20%,#89cdf5 20% 40%,#3285e6 40% 60%,#6849cd 60% 80%,#40197e 80%)}.precipitation-legend>div:nth-child(2){justify-content:space-between}.precipitation-legend>div:nth-child(2) span{white-space:nowrap}.precipitation-app .wind-map-attribution{justify-content:center}.precipitation-app .wind-map-attribution button{color:#a9bec9}
@media(max-width:760px){.precipitation-app .precipitation-topbar{grid-template-columns:minmax(0,1fr) auto;width:calc(100% - 20px)}.precipitation-badge{min-height:48px;padding:7px 10px;border-radius:13px}.precipitation-badge b{font-size:.65rem}.precipitation-badge span{max-width:92px;font-size:.54rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.precipitation-app .wind-zoom-controls{top:70px}.precipitation-app .wind-map-status{bottom:100px}.precipitation-app .wind-picker{bottom:10px}.precipitation-legend{right:10px;bottom:114px;width:min(242px,calc(100% - 20px));padding:9px 10px}.precipitation-legend>div:nth-child(2){font-size:.54rem}.precipitation-app .wind-search-results{top:55px}}

@media(prefers-reduced-motion:reduce){.precipitation-app .maplibregl-canvas{scroll-behavior:auto}}
.precipitation-app .precipitation-map-timeline{position:absolute;z-index:5;right:16px;bottom:16px;left:16px;border:1px solid rgba(185,203,214,.82);border-radius:18px;box-shadow:0 14px 38px rgba(0,0,0,.26);backdrop-filter:blur(18px) saturate(125%)}
.precipitation-app .forecast-precipitation-timeline-summary{grid-template-columns:auto minmax(0,1fr) 36px}.precipitation-app .forecast-precipitation-play{justify-self:center}
.precipitation-app .forecast-precipitation-play{width:34px;min-width:34px;height:34px;min-height:34px;padding:0;border-radius:9px;background:#dff2ee;color:#176b65}
.precipitation-app .forecast-precipitation-play.is-playing span{font-size:0}
.precipitation-app .forecast-precipitation-play.is-playing span::after{content:"Ⅱ";font-size:.85rem}
.precipitation-app .precipitation-legend{bottom:160px}
.precipitation-app .wind-map-status{top:auto;bottom:164px}
.precipitation-app .wind-map-status{display:block;width:max-content;min-width:0;max-width:calc(100% - 32px);height:auto;min-height:0;max-height:none;overflow:hidden;box-sizing:border-box;white-space:nowrap;text-align:center;text-overflow:ellipsis}
.precipitation-app .forecast-precipitation-days{height:30px}
.precipitation-app .forecast-precipitation-day{top:0}
.precipitation-app .precipitation-hour-mark{position:absolute;top:16px;left:var(--hour-position);color:#8fa7b5;font-size:.52rem;font-weight:760;line-height:1;letter-spacing:.02em;transform:translateX(-50%);font-variant-numeric:tabular-nums}
.precipitation-app .precipitation-hour-mark::before{content:"";position:absolute;bottom:calc(100% + 3px);left:50%;width:1px;height:4px;background:rgba(143,167,181,.62)}
@media(max-width:760px){.precipitation-app .precipitation-map-timeline{right:8px;bottom:8px;left:8px}.precipitation-app .forecast-precipitation-timeline-summary{grid-template-columns:auto minmax(0,1fr) 36px}.precipitation-app .forecast-precipitation-step{display:none}.precipitation-app .precipitation-legend{bottom:132px}.precipitation-app .wind-map-status{top:50%;bottom:auto;left:50%;transform:translate(-50%,-50%)}}
/* Keep these final: the shared map stylesheet has earlier mobile defaults. */
.precipitation-app .precipitation-legend{width:250px}
.precipitation-app .precipitation-gradient{height:8px}
@media(max-width:760px){
  .precipitation-app .wind-map-status{
    z-index:19;top:auto;bottom:149px;left:18px;max-width:calc(100% - 210px);
    text-align:left;transform:none;
  }
  .precipitation-app .precipitation-legend{right:10px;bottom:132px;width:170px;padding:10px 12px}
  .precipitation-app .precipitation-legend>div:nth-child(2){font-size:.62rem}
}

.precipitation-app .forecast-precipitation-selected-time strong.is-play-pulsing{display:inline-block;animation:precipitation-play-clock-pulse 620ms ease-out both}@keyframes precipitation-play-clock-pulse{0%{transform:scale(1);color:#173f56;text-shadow:0 0 0 rgba(100,204,242,0)}38%{transform:scale(1.025);color:#245d80;text-shadow:0 0 5px rgba(100,204,242,.48),0 0 13px rgba(100,204,242,.22)}100%{transform:scale(1);color:#173f56;text-shadow:0 0 0 rgba(100,204,242,0)}}