/* Keep spare decoders mounted behind the selected native video on phones. */
#media video.chunk-decoder[data-presented]{z-index:1}
#media #film,#media #poster{z-index:2}

@media(max-width:700px),(pointer:coarse){
 .premium-card #journey::after{backdrop-filter:none;-webkit-backdrop-filter:none}
 .sms::before{animation:none;display:none}
 .scroll-line{animation:none}
}

/* Portrait film reserves its upper sky for copy, including in a short Safari viewport. */
@media(max-width:700px) and (orientation:portrait){
 html[data-profile="portrait"]:not(.reduced) .scene .copy,
 html[data-profile="portrait"]:not(.reduced) .premium-card .scene .copy{
  position:absolute!important;inset:0 0 auto!important;width:100%!important;
  height:auto!important;min-height:0!important;margin:0!important;
  padding:max(24px,env(safe-area-inset-top)) 20px 0!important;
  align-items:center!important;justify-content:flex-start!important;gap:7px;
 }
 html[data-profile="portrait"]:not(.reduced) .cover .copy,
 html[data-profile="portrait"]:not(.reduced) .premium-card .cover .copy{gap:5px}
 html[data-profile="portrait"] .cover .brands{position:static;gap:9px;margin:0}
 html[data-profile="portrait"] .cover .logo-slot{width:24px;height:24px}
 html[data-profile="portrait"] .cover .brand-times{font-size:15px}
 html[data-profile="portrait"] .cover .eyebrow{display:none}
 html[data-profile="portrait"] .cover h1{font-size:clamp(28px,8.3vw,38px);line-height:1.04;max-width:none;white-space:nowrap}
 html[data-profile="portrait"] .cover-description,html[data-profile="portrait"] .beat-description{font-size:12px;line-height:1.35;max-width:27em;margin:0}
 html[data-profile="portrait"] .cover .sms,html[data-profile="portrait"] #scene-5 .sms{min-width:180px;min-height:44px;padding:8px 16px}
 html[data-profile="portrait"] .cover .sms-label,html[data-profile="portrait"] #scene-5 .sms-label{font-size:13px}
 html[data-profile="portrait"] .cover .sms-number,html[data-profile="portrait"] #scene-5 .sms-number{font-size:10px}
 html[data-profile="portrait"] .cover .sms-arrow,html[data-profile="portrait"] #scene-5 .sms-arrow{width:18px;height:18px}
 html[data-profile="portrait"] .cover .scroll-cue{flex-direction:row;min-height:22px;margin:0;padding:2px 10px;gap:6px;font-size:8px}
 html[data-profile="portrait"] .cover .scroll-line{font-size:15px}
 html[data-profile="portrait"] h2,html[data-profile="portrait"] #scene-5 h2{font-size:clamp(30px,8.5vw,40px);line-height:1.05;max-width:10em}
 html[data-profile="portrait"] .program-info-button{padding:3px 0;font-size:11px}
 html[data-profile="portrait"] .scene .text-to-apply{margin:0 auto;font-size:11px;line-height:1.3}
}

@media(max-width:700px) and (max-height:600px) and (orientation:portrait){
 html[data-profile="portrait"]:not(.reduced) .scene .copy,
 html[data-profile="portrait"]:not(.reduced) .premium-card .scene .copy{padding-top:20px!important}
 html[data-profile="portrait"] .cover .logo-slot{width:22px;height:22px}
 html[data-profile="portrait"] .cover h1{font-size:clamp(26px,8vw,34px)}
 html[data-profile="portrait"] .cover-description,html[data-profile="portrait"] .beat-description{font-size:11px}
 html[data-profile="portrait"] .cover .sms,html[data-profile="portrait"] #scene-5 .sms{min-height:42px}
}