/* Nothing here changes the standard responsive view unless Phone mode is on. */
html[data-phone-mode=true] .ward{max-width:480px;margin-inline:auto}
html[data-phone-mode=true] .ward-layout.follows-patient{display:block;--patient-follow-height:clamp(340px,44svh,420px)}
html[data-phone-mode=true] body.in-ward .ward-layout.follows-patient>.patient-stage{height:var(--patient-follow-height);top:8px;margin-bottom:18px;box-shadow:0 5px 20px #102e2a40}
html[data-phone-mode=true] .ward-exam-flow{gap:20px}
html[data-phone-mode=true] .ward-exam-flow :is(button,select,input,summary,section,.exam-toolbar,.head-exam-controls){scroll-margin-top:calc(var(--patient-follow-height) + 24px)}
html[data-phone-mode=true] .ward-exam-flow :is(button,select,input,summary){min-height:44px}
html[data-phone-mode=true] .ward-exam-flow button{font-size:12px;line-height:1.4}
html[data-phone-mode=true] .ward-exam-flow :is(select,input){font-size:16px;max-width:100%}
html[data-phone-mode=true] .ward-exam-flow :is(p,.workbench-intro,.head-instruction,.observed-finding){font-size:13px;line-height:1.65}
html[data-phone-mode=true] .ward-exam-flow .mentor{display:block;padding:18px}
html[data-phone-mode=true] .mentor .guide-action{width:100%;margin-top:12px}
html[data-phone-mode=true] .exam-toolbar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:6px}
html[data-phone-mode=true] .exam-toolbar button{min-height:68px;padding:8px 4px;gap:6px}
html[data-phone-mode=true] .exam-toolbar button b{font-size:22px}
html[data-phone-mode=true] .exam-toolbar button span{font-size:11px;letter-spacing:0}
html[data-phone-mode=true] .exam-toolbar button i{display:none}
html[data-phone-mode=true] :is(.paw-actions,.head-test-tools,.anatomy-view-tabs,.signal-buttons){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
html[data-phone-mode=true] .head-test-tools button{min-height:68px;padding:10px}
html[data-phone-mode=true] :is(.head-view-row,.head-side,.head-replay-row){flex-wrap:wrap;gap:8px}
html[data-phone-mode=true] .head-structure-inspector{grid-template-columns:1fr}
html[data-phone-mode=true] .anatomy-label-record .vertebral-section{grid-template-columns:66px minmax(0,1fr);gap:8px}
html[data-phone-mode=true] .anatomy-label-record .vertebra-numbers{gap:6px}
html[data-phone-mode=true] .anatomy-label-record .vertebra-numbers button{min-width:44px;min-height:44px;font-size:12px}
html[data-phone-mode=true] .anatomy-label-record .structure-name-grid{grid-template-columns:1fr 1fr;gap:8px}
html[data-phone-mode=true] .anatomy-label-record .structure-name-grid button{font-size:12px;min-height:48px}
html[data-phone-mode=true] body.in-ward .ward-layout.follows-patient>.patient-stage.has-anatomy-labels .patient-canvas,
html[data-phone-mode=true] body.in-ward .ward-layout.follows-patient>.patient-stage.has-anatomy-labels.head-with-anatomy .patient-canvas{top:164px;height:calc(100% - 193px)}
html[data-phone-mode=true] body.in-ward .ward-layout.follows-patient>.patient-stage.has-anatomy-labels.anatomy-macro .patient-canvas{top:105px;height:calc(100% - 135px)}
html[data-phone-mode=true] .follows-patient .patient-ident{top:12px;left:12px}
html[data-phone-mode=true] .follows-patient .patient-ident h1{font-size:28px;margin:5px 0}
html[data-phone-mode=true] .follows-patient .patient-ident .eyebrow{font-size:7px}
html[data-phone-mode=true] .follows-patient .patient-ident p.patient-exam-status{font-size:10px;max-width:155px}
html[data-phone-mode=true] .follows-patient .anatomy-region-labels,
html[data-phone-mode=true] .follows-patient .head-with-anatomy .anatomy-region-labels{top:83px;left:8px;right:8px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}
html[data-phone-mode=true] .follows-patient .anatomy-region-name{font-size:10px;padding:3px;min-height:22px;max-width:100%}
html[data-phone-mode=true] .follows-patient .scene-view-controls,
html[data-phone-mode=true] .follows-patient .has-anatomy-labels .scene-view-controls{top:12px;right:8px;bottom:auto;flex-direction:row;gap:4px}
html[data-phone-mode=true] .follows-patient .scene-view-controls button{min-width:44px;min-height:44px;padding:4px;font-size:10px}
html[data-phone-mode=true] .follows-patient .scene-view-controls button:first-child span{display:none}
html[data-phone-mode=true] .follows-patient .scene-mode{bottom:30px;left:11px;right:auto;max-width:calc(100% - 22px);padding:5px 7px}
html[data-phone-mode=true] .follows-patient .scene-caption{bottom:9px;left:12px;font-size:7px}
html[data-phone-mode=true] .follows-patient .head-with-anatomy .head-motion-status{bottom:28px;font-size:8px}
@media(min-width:600px) and (max-height:620px){
 html[data-phone-mode=true] .ward-layout.follows-patient{--patient-follow-height:255px}
 html[data-phone-mode=true] .ward{max-width:none}
 html[data-phone-mode=true] .ward-layout.follows-patient{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,1fr);gap:16px}
 html[data-phone-mode=true] body.in-ward .ward-layout.follows-patient>.patient-stage{height:calc(100svh - 24px)}
 html[data-phone-mode=true] .ward-exam-flow :is(button,select,input,summary,section){scroll-margin-top:20px}
}