/* ---------- responsive ---------- */
@media (max-width:900px){
  .hero,.tiles,.daily,.side,.hourly{grid-column:span 12}
  .hero{padding:22px}
}
@media (max-width:900px){.days{grid-auto-rows:auto;flex:none}}
@media (max-width:520px){
  .brand{width:100%}
  .search{max-width:none;flex-basis:100%;order:3}
  .day{grid-template-columns:minmax(52px,1fr) 32px 34px 30px minmax(48px,1.2fr) 30px;gap:6px;padding:10px}
  .tile{min-height:118px;padding:14px}.tile .v{font-size:24px}
  .card-head{padding-inline:16px}.hscroll{padding-inline:12px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}