/* Mobile horizontal composition uses the phone document's orientation class. */
body.phone-landscape .app-shell{max-width:none}
body.phone-landscape .phone-scene-frame{width:52%;height:100%!important;inset:0 auto 0 0}
body.phone-landscape .app-shell[data-ui=story] .phone-scene-frame .scene-art{height:100%;background-position:center}
body.phone-landscape .app-shell[data-ui=story] .phone-scene-frame .hotspots{height:100%}
body.phone-landscape .app-shell[data-ui=story] .phone-scene-frame .character-art{height:86%;max-width:60%;right:0}
body.phone-landscape .app-shell[data-ui=story] .dialogue-panel:is(.dialogue-only,.explore-mode,.task-mode,.night-mode){inset:0 0 0 52%;height:100%;max-height:100%;min-height:0;padding:14px 18px;display:flex;flex-direction:column}
body.phone-landscape .app-shell[data-ui=story] .dialogue-panel.dialogue-only{height:100%;max-height:100%;min-height:0}
body.phone-landscape .app-shell[data-ui=story] .dialogue-panel.explore-mode .dialogue-copy{max-height:82px}
body.phone-landscape .app-shell[data-ui=story] .dialogue-panel.night-mode .dialogue-copy.has-night-plan{display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;max-height:none;flex:1;overflow:hidden;min-height:0}
body.phone-landscape .app-shell[data-ui=story] .dialogue-panel.night-mode:has(.has-night-plan) .choice-area{display:none!important}
body.phone-landscape .app-shell[data-ui=story] .scene-label{font-size:14px;top:14px}
body.phone-landscape .phone-home-intro{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:center}
body.phone-landscape .phone-home-intro .craft-home-photo{grid-column:1}
body.phone-landscape .phone-home-intro h1{font-size:36px}
body.phone-landscape .craft-role-grid{grid-template-columns:1fr 1fr;gap:24px}
body.phone-landscape .opening-workshop{display:grid;grid-template-columns:1fr 1fr;min-height:100%;padding:18px 26px;gap:15px 30px}
body.phone-landscape .opening-workshop>.paper-link{grid-column:1/-1;grid-row:1}
body.phone-landscape .opening-object{grid-column:1;grid-row:2;min-height:200px;flex-direction:column}
body.phone-landscape .opening-copy{grid-column:2;grid-row:2}
body.phone-landscape .opening-copy h1{font-size:32px}
body.phone-landscape .opening-object>svg{width:100%;max-height:230px}
body.phone-landscape .old-notebook{width:150px;min-height:125px;margin:0;padding:10px 15px}
body.phone-landscape .phone-desk-layout{max-width:820px;margin:auto;padding:24px 30px}
body.phone-landscape .phone-desk-layout .desk-editor{display:grid;grid-template-columns:1fr 1fr;gap:10px 28px;align-items:start}
body.phone-landscape .phone-desk-layout .editor-heading{grid-column:1/-1}
body.phone-landscape .phone-desk-layout .editor-heading h2 br{display:none}
body.phone-landscape .phone-desk-layout .craft-stage{grid-column:1;grid-row:2}
body.phone-landscape .phone-desk-layout .craft-caption{grid-column:1;grid-row:3}
body.phone-landscape .phone-desk-layout .craft-tools{grid-column:2;grid-row:2/4}
body.phone-landscape .phone-desk-layout .craft-exports,body.phone-landscape .phone-desk-layout .making-details,body.phone-landscape .phone-desk-layout .craft-live{grid-column:1/-1}

body.phone-landscape .app-shell[data-ui=story] .dialogue-panel.night-mode .dialogue-copy:not(.has-night-plan){max-height:72px}

body.phone-landscape .phone-role-bar{width:100%;padding:8px 26px max(8px,env(safe-area-inset-bottom))}