@import url("YellowActionBars.css?v=20261112cosmetic");
/* Shared screen-fit rules: readable type, flexible cards and intact words. */
@media screen {
 html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
 *,*::before,*::after{box-sizing:border-box}
 body{min-width:0}
 main,section,article,header,footer,nav,figure,div,a{min-width:0}
 img,video,iframe,svg{max-width:100%}
 img,video{height:auto}
 h1,h2,h3,h4{word-break:normal;overflow-wrap:normal;hyphens:none;text-wrap:pretty}
 p,li,td,th,a{overflow-wrap:break-word;word-break:normal}
 .button,.text-link{max-width:100%;white-space:normal}
 .button{flex-shrink:1;text-align:left}
 .button .arrow-icon,.text-link .arrow-icon{flex-shrink:0}
 input,textarea,select{min-width:0;max-width:100%;font-size:16px}
 .site-header{gap:16px}
 .back-home{gap:12px}
 .back-home>.arrow-icon{margin:0;flex-shrink:0}
 .site-header nav{min-width:0}
 .hero-copy,.hero-image,.route-copy,.learning-program,.section-links>a{min-width:0}
 .route-copy{container-type:inline-size}
 .route-copy h3,.card-workbook .route-copy h3{font-size:clamp(19px,11cqi,28px);white-space:normal;line-height:1.2}
 .route-card .route-visual img{height:100%}
 .still-learning-subtitle{white-space:normal!important;font-size:clamp(16px,1.8vw,24px);line-height:1.5}
 .card-workbook .workbook-home-hero .still-learning-subtitle{font-size:clamp(17px,1.6vw,22px);line-height:1.5;max-width:38ch}
 .card-workbook .workbook-home-hero h1{font-size:clamp(38px,5vw,76px);white-space:normal;letter-spacing:-1px}
 .page-copy h2,.page-copy h3,.contents-name,.resource-group-title{white-space:normal!important;max-width:100%;line-height:1.25}
 .page-copy h2{font-size:clamp(27px,3.6vw,46px)}
 .page-copy h3{font-size:clamp(23px,2.7vw,32px)}
 .page-copy .assignment-template h3{font-size:clamp(24px,3vw,34px)}
 .page-copy a{overflow-wrap:anywhere}
 .chapter-audio-toolbar{flex-wrap:wrap}
 .chapter-listen-label{white-space:normal}
 .table-scroll{width:100%;max-width:100%}
 .page-copy table{min-width:0;table-layout:fixed}
 .page-copy td,.page-copy th{overflow-wrap:break-word;word-break:normal}
 .page-footer{flex-wrap:wrap}
 .chapter-footer{flex-wrap:wrap}
 .page-title{font-size:clamp(34px,5.2vw,72px);overflow-wrap:normal}
 .hero-tagline .tagline-location,.hero-tagline strong{white-space:normal}
 .email-link{overflow-wrap:anywhere}
 .card-workbook .site-header .wordmark{flex-shrink:1}
 .card-workbook .site-header .book-download{white-space:normal;line-height:1.4;flex-shrink:0}
 .card-workbook .download-icon{flex-shrink:0}
 .card-workbook .site-header .wordmark>span{font-size:clamp(10px,1.4vw,16px)}
}
@media screen and (min-width:701px) and (max-width:1100px){
 .route-card{display:flex;flex-direction:column}
 .route-visual{aspect-ratio:16/9;height:auto;min-height:0}
 .home-page .route-card:last-child{grid-column:auto}
 .hero{gap:24px}
 .card-workbook .workbook-home-hero h1{font-size:clamp(40px,5.2vw,62px)}
 .hero-bottom{flex-wrap:wrap}
 .learning-program-grid{grid-template-columns:1fr}
}
/* Stack interview media before its copy becomes too narrow for intact words. */
@media screen and (min-width:701px) and (max-width:1000px){
 .video-feature{grid-template-columns:minmax(0,1fr)}
 .video-feature>.video-panel .video-stage{aspect-ratio:16/9}
 .video-feature .video-copy{padding:32px}
 .video-feature .video-copy h3{font-size:40px;line-height:1.2}
}
@media screen and (max-width:700px){
 .site-header .wordmark{flex-shrink:1}
 .site-header .wordmark>span{font-size:clamp(10px,3vw,14px)}
 .card-workbook .site-header{padding-inline:5%;gap:12px}
 .card-workbook .site-header .wordmark{font-size:34px;gap:9px}
 .card-workbook .site-header .wordmark>span{font-size:10px;letter-spacing:1px}
 .card-workbook .site-header .book-download{font-size:11px;gap:7px}
 .card-workbook .workbook-home-hero h1{font-size:clamp(38px,11.5vw,64px)}
 .card-workbook .workbook-home-hero .still-learning-subtitle{font-size:18px;line-height:1.5}
 .card-workbook .workbook-home-hero .hero-tagline{font-size:25px;line-height:1.3}
 .route-card{grid-template-columns:clamp(80px,25vw,120px) minmax(0,1fr)}
 .route-copy h3,.card-workbook .route-copy h3{font-size:clamp(19px,10.5cqi,25px)}
 .route-copy p,.home-page .route-copy p{font-size:14px;line-height:1.55;padding-right:0;padding-bottom:24px}
 .route-kicker{font-size:9px;letter-spacing:1px;line-height:1.5}
 .card-workbook .home-explore h2{white-space:normal}
 .page-copy p{font-size:17px}
 .page-copy td,.page-copy th{font-size:14px;padding:12px 9px}
 /* Labelled rows keep rubrics and schedules readable without sideways scrolling. */
 .page-copy table.mobile-cards,.page-copy table.mobile-cards tbody{display:block;width:100%}
 .page-copy table.mobile-cards thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
 .page-copy table.mobile-cards tr{display:block;margin:0 0 16px;border:1px solid #ffffff40;background:#ffffff04}
 .page-copy table.mobile-cards td{display:block;width:100%!important;border:0;border-bottom:1px solid #ffffff20}
 .page-copy table.mobile-cards td:last-child{border-bottom:0}
 .page-copy table.mobile-cards td::before{content:attr(data-label);display:block;font-weight:700;color:var(--gold);margin-bottom:5px}
 .page-copy table.mobile-cards td:first-child{background:#ffffff08}
 .resource-summary{gap:10px;padding:16px}
 .resource-group-title{font-size:24px}
 .course-resources .resource-intro{padding:24px 18px}
 .course-resources .resource-intro h2{font-size:30px}
 .assignment-template.learning-program{padding:24px 18px}
 .page-footer .button{font-size:12px;gap:12px}
 .community-feature{grid-template-columns:1fr;gap:0}
 .community-feature>img{height:auto;min-height:0;aspect-ratio:16/9}
 .community-feature>div{padding:24px 22px 52px}
 .page-onward{flex-wrap:wrap}
 .learning-program h3{font-size:32px}
 .page-title{font-size:clamp(34px,10vw,45px)}
 .publication-entry h3{font-size:29px}
 .contact-form{width:100%}
 .player-controls{flex-wrap:wrap}
 .chapter-heading h2{font-size:clamp(30px,8vw,39px)}
 dialog{max-width:calc(100vw - 24px)}
}

@media screen and (max-width:700px){
 .gallery-filters{flex-wrap:wrap;overflow:visible}
 .gallery-filters button{white-space:normal;flex-shrink:1;max-width:100%}
}
