/* Pass 1: compact navigation context without shrinking body text. */
@media(max-width:760px){
body[data-stage=lesson] .shell{padding:0 12px}body[data-stage=lesson] header{height:44px}.brand-icon{width:27px;height:27px;font-size:19px}.brand small{display:none}body[data-stage=lesson] main{padding-top:8px}.progress-head{font-size:11px;margin:0 0 3px}.progress-track{margin-bottom:8px;height:3px}.route-strip{margin:0 0 7px;gap:4px}.route-strip li{display:none}.route-strip li.current{display:block;padding:2px 8px}.title-row .eyebrow{display:none}.title-row h1{font-size:19px;line-height:1.45;margin:0 0 5px}.freq{padding:2px 7px;margin-bottom:7px}.lesson-grid{gap:10px}body[data-stage=lesson] footer{display:none}
}
/* Pass 2: smaller photos retain the original coordinate frame for annotations. */
@media(max-width:760px){
.lesson:not(:has(.quiz-grid)) .component-photo,.lesson .lamp-photo{width:min(100%,270px);margin-inline:auto;aspect-ratio:3/2;height:auto;flex:none}.lesson .component-photo img,.lesson .lamp-photo img{object-fit:contain}.lesson .mode-switch{padding:5px;gap:5px}.lesson .mode-switch button{padding:5px 7px;min-height:40px}.lesson .example-controls{padding:5px;gap:4px}.lesson .example-controls button{padding:4px 8px;font-size:12px;min-height:40px}.lesson .photo-caption{padding:7px 10px;font-size:13px}.lesson .art-note{padding:5px 9px}.lesson .lamp-controls{padding:5px}.lesson .visual{border-radius:12px}
}
/* Pass 3: remove repeated normal/abnormal prose from the default mobile view. */
.criteria{border:0}.criteria>summary{display:none}.criteria .condition+.condition{margin-top:10px}
@media(max-width:760px){.criteria{background:#eef3ef;border-radius:8px;padding:7px 10px;font-size:13px}.criteria>summary{display:list-item;cursor:pointer;min-height:28px;line-height:28px}.criteria .condition{margin-top:8px}.method{padding:0}.method p{font-size:14px;line-height:1.65;margin:3px 0}.method .mini-label{font-size:11px}.compare-help{display:none}}
/* Pass 4: preserve supplementary content behind one optional disclosure. */
.lesson-extra>summary{display:none}.lesson-extra{border:0}
@media(max-width:760px){.lesson-extra{margin:7px 0;background:#edf2f3;border-radius:8px;padding:7px 10px;font-size:13px}.lesson-extra>summary{display:list-item;min-height:28px;line-height:28px;cursor:pointer}.lesson-extra .terms{margin:8px 0}.lesson-extra .mentor-tip{margin:8px 0}.lesson-extra .location{margin:8px 0}.frequency-note{display:none}}
/* Pass 5: stable bottom controls, including safe-area space. */
@media(max-width:760px){body[data-stage=lesson] main{padding-bottom:78px}.lesson-nav{position:fixed;bottom:0;left:0;right:0;width:auto;margin:0;padding:8px 12px calc(8px + env(safe-area-inset-bottom));height:auto;min-height:60px;background:#f8f7f1fa;z-index:8;box-shadow:0 -3px 12px #213a4c12}.lesson-nav .btn{min-height:44px;padding:8px 12px}.lesson-nav .primary{min-width:145px}.lesson-nav>span{white-space:nowrap}.lesson-extra .frequency-note{display:block;font-size:12px}}
/* Pass 6: no automatic scrolling when comparisons change. */
@media(max-width:760px){.lesson-grid>.visual{overflow-anchor:none}.lesson .photo-caption{min-height:56px}.lesson .mode-switch{flex:none}}
/* Pass 7: keep essential safety visible; abnormal response replaces repeated method text. */
.safety-brief{display:none}
@media(max-width:760px){.safety-brief{display:block;margin:7px 0;padding:5px 8px;border-left:3px solid #dfac61;background:#fff4de;font-size:13px;line-height:1.6}body[data-stage=lesson][data-mode=abnormal] .explanation>.method{display:none}.lesson .response-cue{font-size:13px;padding:7px 10px;line-height:1.6}.lesson .response-cue b{display:inline;margin-right:8px}.lesson .photo-caption{min-height:48px}}
/* Pass 8: compact route/cab instruction pages, keeping every procedure step. */
@media(max-width:760px){.lesson .visual .route-map svg{height:155px!important;width:100%}.route-map{padding:5px}.route-map .route-order{font-size:11px;gap:3px}.route-order span{padding:3px 5px}.route-map p{margin:5px 0;font-size:12px}.explain-steps{font-size:13px;padding-left:21px;margin:5px 0}.explain-steps li{padding:1px 0 5px 2px}.explain-steps span{font-size:13px;line-height:1.5;margin-top:1px}.cab-movie{padding:7px 0}.movie-status{padding:6px 10px;min-height:36px;line-height:1.5}.movie-controls{padding:5px;gap:5px}.movie-controls button{padding:5px 10px;min-height:40px}.cab-movie small{font-size:11px;line-height:1.5}.lesson .visual .cab-movie svg{max-height:155px!important}.lesson .visual:has(.route-map),.lesson .visual:has(.cab-movie){min-height:0}
}
/* Pass 9: keep quiz question, choices and feedback together. */
.quiz-image>summary{display:none}
@media(max-width:760px){body[data-stage=quiz] header{height:44px}body[data-stage=quiz] footer{display:none}body[data-stage=quiz] main{padding-top:8px}.quiz-grid{margin-top:7px;gap:8px}.quiz-image{font-size:13px;background:#edf2f3;padding:7px 10px;border-radius:8px}.quiz-image>summary{display:list-item;min-height:28px;line-height:28px;cursor:pointer}.quiz-image .visual{margin-top:8px}.quiz-grid .choices{gap:8px}.quiz-grid .choice{font-size:14px;padding:10px 12px;min-height:48px}.quiz-grid .feedback{padding:9px 12px}.quiz-grid .mini-label{margin:2px 0}.quiz-grid .feedback p{font-size:14px;line-height:1.6}.quiz-grid .choices>.btn{min-height:44px}.lesson .quiz-grid{display:flex;flex-direction:column}}
/* Pass 10: short viewports and long diagnostic panels, without clipping or tiny text. */
@media(max-width:760px){.lesson .diagnostic{padding:12px}.diagnostic-caption{font-size:15px;margin:8px 0;line-height:1.6}.range-teaching{padding:10px 6px 0}.range-track{height:63px;margin:18px 0 20px}.range-mark{top:66px}.range-teaching p{margin-top:30px;margin-bottom:5px}.signal-illustration{padding:9px;margin:9px 0}.lesson .visual .diagnostic svg{max-height:130px!important}.lesson .component-photo.pedal{display:none}.pedal-detail{padding:9px 12px}.lesson .visual .pedal-detail svg{max-height:120px!important}.pedal-detail p{margin:4px 0;font-size:13px;line-height:1.6}.pedal-detail-body{margin-top:5px}.context-photo{padding:7px 10px}.context-photo summary{min-height:28px;line-height:28px}}
@media(max-width:760px) and (max-height:700px){.lesson:not(:has(.quiz-grid)) .component-photo,.lesson .lamp-photo{width:min(100%,225px)}.lesson .visual .route-map svg{height:125px!important}.lesson .visual .cab-movie svg{max-height:125px!important}.lesson-nav{padding-top:5px;padding-bottom:calc(5px + env(safe-area-inset-bottom))}}
@media(min-width:761px){.criteria:not([open])>*,.lesson-extra:not([open])>*,.quiz-image:not([open])>*{content-visibility:visible}}

/* v0.9: keep realistic images primary and the quantity guide compact. */
@media(max-width:760px){.reading-guide>summary{font-size:13px;padding:6px 10px}.real-first .diagnostic{padding:7px 10px}.lesson .visual .real-first .quantity-detail{max-height:105px!important;width:100%}.real-first .diagnostic-caption{font-size:13px;margin:3px 0}.real-first .diagnostic>small{display:none}.real-first .photo-caption{min-height:0}.wear-key{font-size:11px;padding:3px 5px}.wear-marker{width:24px;height:24px;line-height:20px;font-size:14px}}
