/* Keep the real field useful on a short landscape phone while observing.
   The existing input panel remains below it; explicit editing releases the stage. */
@media(max-height:600px) and (min-width:600px){
 html:has(.field[data-observation=true]){overflow-anchor:none}
 .route-shell:has(.field[data-observation=true]){height:auto;padding:10px}
 .route-shell:has(.field[data-observation=true])>header{display:none}
 .route-layout:has(.field[data-observation=true]){grid-template-columns:minmax(0,1fr);flex:none}
 section.field[data-observation=true]:has(#world){height:calc(100dvh - 20px);min-height:0;max-height:none}
 .field[data-observation=true] .motion:has(.route-watch-controls:not([hidden])) .route-watch-controls{grid-template-columns:max-content max-content minmax(0,1fr);align-items:center}
 .field[data-observation=true] .route-watch-controls:not([hidden]) #observe-note{grid-column:3;max-width:none;min-height:0}
 .field[data-observation=true] .motion:has(.route-watch-controls:not([hidden])) #sound{grid-column:2;grid-row:1;justify-self:end}
 .field[data-observation=true] .motion:has(.route-watch-controls:not([hidden])) #return-input:not([hidden]){grid-column:2;grid-row:2;width:auto;max-width:150px;min-width:0;justify-self:end}
}