@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600;700;800&display=swap');
:root{
  --glass: rgba(255,255,255,0.06);
  --muted: rgba(226,238,248,0.8);
}
html,body{height:100%}
body{font-family:Inter,ui-sans-serif,system-ui,Segoe UI,Roboto,'Helvetica Neue',Arial}
.forecast::-webkit-scrollbar{height:10px}
.forecast::-webkit-scrollbar-thumb{background:linear-gradient(90deg,#60a5fa,#7c3aed);border-radius:99px}
.day {
  flex: 0 0 110px;
  background: linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.01));
  border: 1px solid rgba(255,255,255,0.04);
  padding: 12px;
  border-radius: 12px;
  text-align: center;
  color: #ecfeff;
  box-shadow: 0 8px 24px rgba(2,6,23,0.6), inset 0 1px 0 rgba(255,255,255,0.02);
}
.day img{width:54px;height:54px;margin:6px auto}
.day .small{font-size:12px;color:var(--muted);margin-top:6px}
.day .temp-range{font-weight:700;margin-top:6px}
@media (max-width:768px){
  .day{flex:0 0 98px;padding:10px}
}