@media screen and (max-width:767px){
#experience .nvForecastCalendar{height:25px;min-height:25px;display:flex;justify-content:space-between;align-items:center;padding:0 8px 0 13px;color:#f6faff;text-shadow:0 1px 4px #061623;gap:5px;font:600 11px/1.1 Arial,'Segoe UI',sans-serif}
#experience .nvCalendarStamp{display:flex;align-items:center;gap:6px;min-width:0}
#experience #nvCalendarText{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#experience .nvCalendarControls{display:flex;align-items:center;gap:2px;flex:none}
#experience .nvCalendarControls button{border:0;background:rgba(19,37,52,.24);color:#f6fbff;border-radius:9px;font-size:22px;line-height:1;width:28px;height:24px;min-height:24px;display:grid;place-items:center}
#experience .nvCalendarControls button[hidden]{display:none}
#experience .hoursPanel{min-width:0;display:block!important}
#experience .hoursTrack,#experience .hour{height:77px}
#experience .hour{padding:4px 0 5px;gap:2px}
#experience .hour .weatherIcon{width:28px;height:28px}
#experience .nvDailyMin{font-size:10px;color:#81ddfc;display:block;line-height:1.1}
#experience .nvDailyMax{font-size:11px;color:#ffd088;display:block;line-height:1.1}
#experience .metricsPanel{display:block!important}
#experience .selectedCaption{display:none!important}
}
/* NADVIR mobile forecast spacing / visibility refinement. Desktop unaffected. */
@media screen and (max-width:767px){
 #experience .cityButton>.icon:first-child path{fill:none!important;stroke:currentColor!important;stroke-width:2.1px!important;stroke-linejoin:round}
 #experience .cityButton>.icon:first-child circle{fill:none!important;stroke:currentColor!important;stroke-width:1.8px!important}
 #experience .modeTabs{margin-bottom:7px}
 #experience .forecastStack{margin-bottom:5px}
 #experience .hoursPanel{margin-bottom:8px}
 #experience .metricsTrack{height:clamp(220px,29svh,255px)}
 #experience .temperatureChart{top:15%;height:15%}
 #experience .metricLabel.tempLabel{top:3%}
 #experience .tempValues{top:31%}
 #experience .metricLabel.rainLabel{top:45%}
 #experience .rainValues{top:59%;height:14%}
 #experience .metricLabel.windLabel{top:75%}
 #experience .windValues{top:85%}
 #experience .metricsPanel:after{background:linear-gradient(#fff4,#fff4) 50% 44%/calc(100% - 20px) 1px no-repeat,linear-gradient(#fff4,#fff4) 50% 74%/calc(100% - 20px) 1px no-repeat}
}
@media screen and (max-width:767px) and (max-height:720px){
 #experience .metricsTrack{height:208px}
 #experience .tempValues{top:30%}
 #experience .metricLabel.rainLabel{top:44%}
 #experience .rainValues{top:57%}
 #experience .metricLabel.windLabel{top:73%}
 #experience .windValues{top:85%}
}
@media screen and (max-width:767px) and (max-height:630px){
 #experience .metricsTrack{height:190px}
 #experience .metricLabel{font-size:9px;min-height:20px}
 #experience .rainValues{top:57%}
 #experience .metricLabel.windLabel{top:72%}
 #experience .windValues{top:83%}
 #experience .windValue{gap:1px}
}

@media screen and (max-width:767px){#experience .hero{padding:3px 10px 0!important}#experience .cityButton{min-height:30px!important}#experience .updated{margin:1px 0 2px!important}#experience .temperature{margin:3px 0 3px!important}#experience .condition{margin:0 0 4px!important}#experience .pageContent{gap:8px!important}#experience .windValues{top:86%}#experience .windValue{gap:2px}}
@media screen and (max-width:767px) and (max-height:720px){#experience .windValues{top:85%}}

@media(max-width:767px){#experience .selectedHourLens::after{display:none!important;content:none!important}}

@media screen and (min-width:768px){#experience .nvForecastCalendar{display:none!important}}

@media screen and (max-width:767px){#experience .nvDesktopModeLabel{display:none!important}}
@media screen and (min-width:768px){#experience .nvMobileModeLabel{display:none!important}}

/* Mobile forecast metrics: measured, non-scrolling three-row layout */
@media screen and (max-width:767px) {
  #experience .metricsPanel { overflow:hidden!important; }
  #experience #metricsScroll { overflow-x:auto!important;overflow-y:hidden!important;overscroll-behavior-y:none; scrollbar-width:none; }
  #experience .metricsTrack {height:242px!important;min-height:242px!important;overflow:hidden!important;}
  #experience .metricLens {
    background:linear-gradient(100deg,rgba(110,216,255,.07),rgba(103,196,247,.14),rgba(153,217,245,.07))!important;
    border-color:rgba(166,234,255,.23)!important;
    box-shadow:inset 0 1px 3px rgba(185,239,255,.16),0 0 3px rgba(94,203,255,.10)!important;
  }
  #experience .temperatureChart{top:31px!important;height:35px!important;}
  #experience .metricLabel.tempLabel{top:4px!important;}
  #experience .tempValues{top:70px!important;}
  #experience .metricLabel.rainLabel{top:91px!important;}
  #experience .rainValues{top:118px!important;height:42px!important;align-items:flex-end!important;}
  #experience .rainValue{height:42px!important;gap:3px!important;}
  #experience .metricLabel.windLabel{top:168px!important;}
  #experience .windValues{top:201px!important;}
  #experience .windValue{gap:4px!important;}
  #experience .metricsPanel::after{background:linear-gradient(#fff3,#fff3) 50% 88px/calc(100% - 20px) 1px no-repeat,linear-gradient(#fff3,#fff3) 50% 163px/calc(100% - 20px) 1px no-repeat!important;}
}
@media screen and (max-width:767px) and (max-height:720px){
  #experience .metricsTrack{height:228px!important;min-height:228px!important;}
  #experience .metricLabel.rainLabel{top:82px!important;}
  #experience .tempValues{top:63px!important;}
  #experience .temperatureChart{top:28px!important;height:30px!important;}
  #experience .rainValues{top:109px!important;height:38px!important;}
  #experience .rainValue{height:38px!important;}
  #experience .metricLabel.windLabel{top:151px!important;}
  #experience .windValues{top:182px!important;}
  #experience .metricsPanel::after{background:linear-gradient(#fff3,#fff3) 50% 80px/calc(100% - 20px) 1px no-repeat,linear-gradient(#fff3,#fff3) 50% 149px/calc(100% - 20px) 1px no-repeat!important;}
}
@media screen and (max-width:767px) and (max-height:630px){
  #experience .metricsTrack{height:211px!important;min-height:211px!important;}
  #experience .metricLabel.rainLabel{top:76px!important;}
  #experience .temperatureChart{top:26px!important;height:28px!important;}
  #experience .tempValues{top:58px!important;}
  #experience .rainValues{top:102px!important;height:35px!important;}
  #experience .rainValue{height:35px!important;}
  #experience .metricLabel.windLabel{top:141px!important;}
  #experience .windValues{top:168px!important;}
  #experience .windValue{gap:2px!important;}
  #experience .metricsPanel::after{background:linear-gradient(#fff3,#fff3) 50% 74px/calc(100% - 20px) 1px no-repeat,linear-gradient(#fff3,#fff3) 50% 139px/calc(100% - 20px) 1px no-repeat!important;}
}

@media screen and (max-width:767px){
 #experience #hoursScroll,#experience #metricsScroll,
 #experience .hoursTrack,#experience .metricsTrack{touch-action:pan-x pan-y!important;overscroll-behavior-y:auto!important}
 #experience .metricLens,#experience .hourLens{pointer-events:none!important}
}