/* Mobile presentation is layered after the existing art and gameplay styles. */
:root{--keyboard-inset:0px;--viewport-height:100dvh}
html{scroll-padding-top:max(12px,env(safe-area-inset-top))}
body{padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}
[hidden]{display:none!important}
.platform-panel{padding:18px;border:1px solid #aac4b5;border-radius:16px;background:#fffdf5;color:#203d3b;line-height:1.6}
.platform-panel p{color:#45665a;font-size:14px;line-height:1.7}.platform-panel button{min-height:44px;padding:10px 14px;margin:4px;border:1px solid #86a994;border-radius:10px;background:#e6f2e7;color:#214e41;font:inherit}
.platform-panel .primary{background:#237d6b;color:#fff}.platform-status{white-space:pre-line;overflow-wrap:anywhere}.platform-panel button:disabled{opacity:.5}
.platform-actions{display:flex;flex-wrap:wrap;gap:6px}.platform-actions button{flex:1 1 160px}
.platform-dialog{width:min(620px,calc(100vw - 24px));max-height:calc(var(--viewport-height) - 24px);overflow:auto;color:#203d3b;background:#fffdf5;border:1px solid #8db39a;border-radius:18px;padding:20px}.platform-dialog::backdrop{background:#081e27bb}.platform-dialog h2{font-size:23px}.platform-dialog p{font-size:15px;line-height:1.7}.platform-dialog input{max-width:100%;font-size:16px}
.platform-notice{position:fixed;left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));bottom:max(12px,env(safe-area-inset-bottom));z-index:1000;max-width:620px;margin:auto;box-shadow:0 8px 40px #0004}
@media(max-width:720px){
 body{font-size:16px}.shell{padding:0 10px;min-width:0;width:100%}.shell>header{min-height:64px;gap:8px;padding:10px 0}.brand{font-size:20px;min-width:0}.brand small{font-size:9px}.header-controls{gap:6px;min-width:0}.header-controls button{min-height:44px;padding:8px 10px;font-size:13px;white-space:normal}.header-back{max-width:112px}
 button,summary{touch-action:manipulation}button:not(.table-hotspot):not(.orbit-tool):not(.sentence-token){min-height:44px}input,textarea,select{font-size:16px!important;max-width:100%}input,textarea{scroll-margin:80px 0 80px}
 .game-layout,body[data-phase=cook] .game-layout{width:100%;max-width:100%;min-width:0;margin:8px auto;grid-template-columns:minmax(0,1fr)}
 .world-panel,body.focused-hud[data-mode=typing]:is([data-exercise=study],[data-phase=cook]) .world-panel{width:100%;min-width:0;aspect-ratio:auto;overflow:visible;border-radius:16px;padding-top:0}
 .focused-hud .play-toolbar{position:relative;inset:auto;order:-1;padding:12px;min-width:0;gap:10px;border-radius:16px 16px 0 0}.focused-hud .play-toolbar .journey{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}.focused-hud .hud-adventure{min-width:0;gap:6px}.focused-hud .hud-learning{min-width:0;padding-left:10px}.hud-icon{flex-shrink:0}.focused-hud .play-toolbar .player-level{min-width:0}.focused-hud .play-toolbar .player-level span{font-size:18px}.focused-hud .play-toolbar .study-level-badge{font-size:13px}.focused-hud .play-toolbar .stats.hud-resources{gap:8px}.focused-hud .play-toolbar .stats .hud-resource small{font-size:11px}.focused-hud .play-toolbar .stats .hud-resource b{font-size:16px}
 .world-panel canvas#world,body.focused-hud[data-mode=typing]:is([data-exercise=study],[data-phase=cook]) .world-panel canvas#world{position:relative;inset:auto;display:block;width:100%;height:auto;min-height:0;aspect-ratio:3/2;object-fit:contain;order:0}
 .scene-label,.focused-hud .scene-label{position:relative;inset:auto;order:-1;padding:8px 12px;min-height:36px;flex-wrap:wrap;gap:6px;font-size:12px}.scene-tag{font-size:11px}.scene-bottom{padding:10px 12px;font-size:12px;line-height:1.6}
 .side,body.focused-hud[data-mode=typing]:is([data-exercise=study],[data-phase=cook]) .side,body[data-phase=fish][data-mode=idle] .side{position:relative;inset:auto;transform:none;width:100%!important;max-width:none!important;min-width:0;display:block;padding:14px;border-radius:0 0 16px 16px;margin:0;background:#15373c;overflow:visible;max-height:none}
 body.focused-hud[data-mode=typing][data-exercise=study] .study-card{display:flex;flex-direction:column;gap:12px;padding:16px;min-width:0}.study-card>*{min-width:0;max-width:100%}.study-context,.study-meaning{font-size:16px!important;line-height:1.65!important}.study-sentence{font-size:22px!important;overflow-wrap:anywhere}.study-blanks{flex-wrap:wrap}.study-input{min-height:48px;max-width:100%}.study-choices{grid-template-columns:minmax(0,1fr)!important}.study-choice{white-space:normal;overflow-wrap:anywhere;min-height:48px!important;font-size:16px!important}.study-card .study-actions{display:flex;flex-wrap:wrap;gap:8px}.study-actions button{flex:1 1 110px;font-size:14px!important;min-height:44px!important}
 body.focused-hud[data-mode=typing][data-exercise=study] .study-feedback{max-height:none;overflow:visible}.study-correct-sentence{font-size:21px!important;overflow-wrap:anywhere}.sentence-token{min-height:44px;min-width:44px;font-size:16px!important;padding:10px 12px!important}.sentence-drag-help{font-size:13px}.study-word-bank,.study-assembled{gap:8px;max-width:100%}
 #setup.fishing-orbit{position:relative;inset:auto;width:100%;max-width:none;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;padding:12px;margin:0;order:1;background:#15373c}.orbit-tool{min-width:0;min-height:62px}.orbit-tool canvas{max-width:100%}.orbit-tool span{font-size:12px;overflow-wrap:anywhere}.orbit-tool small{font-size:11px}.orbit-tray,#setup .orbit-tray{position:fixed;top:env(safe-area-inset-top,0px);right:12px;left:12px;width:auto;max-width:430px;margin:12px auto;max-height:calc(var(--viewport-height) - 40px);overflow:auto;z-index:50}.orbit-tray button{min-height:48px}
 .story-objective{position:relative;inset:auto;max-width:100%;margin:0 12px 8px;order:0;font-size:12px;min-height:44px}.story-objective>span:first-child{font-size:11px}
 #sceneActions[data-action=fight]{left:12px;right:12px;width:auto;bottom:14px;max-width:none}#sceneActionTarget{touch-action:none!important;min-width:80px;min-height:80px}.scene-actions:not([data-action=fight]):not(.in-learning-panel){top:auto;bottom:16px;left:50%;width:calc(100% - 24px);max-width:340px}.scene-actions .action-coach{max-width:100%;padding:10px}.scene-actions .action-coach p{font-size:14px}.scene-actions .action-steps{font-size:11px}.scene-actions.in-learning-panel{position:relative;inset:auto;transform:none;width:100%;max-width:none;margin:12px 0}
 .hub-grid,.catalog-grid,.collection-grid,.unit-grid,.analytics-grid{grid-template-columns:minmax(0,1fr)!important}.settings-hub{padding:12px}.hub-heading{flex-wrap:wrap;gap:12px}.hub-heading h1{font-size:26px}.hub-group{padding:16px}.hub-link{min-height:48px;font-size:16px}.hub-grid>*{min-width:0}
 dialog{max-width:calc(100vw - 20px);max-height:calc(var(--viewport-height) - 20px);margin:auto;overflow:auto;padding-bottom:max(16px,env(safe-area-inset-bottom));scroll-padding:16px}.intro-dialogue{min-height:0}.intro-dialogue p{min-height:0}.intro-illustration canvas{object-fit:contain;max-height:25dvh}.placement-options{grid-template-columns:minmax(0,1fr)}.placement-card{min-width:0;padding:14px}.placement-card button{white-space:normal}.placement-card input{min-height:48px}.promotion-panel{padding:14px}.promotion-panel .row{flex-wrap:wrap}.promotion-passage{overflow-wrap:anywhere}.promotion-actions button{flex:1 1 120px}.foundation-options button{font-size:16px!important;min-height:48px}.foundation-practice{min-width:0}
 body.keyboard-open .play-toolbar,body.keyboard-open .scene-label,body.keyboard-open .scene-bottom{display:none!important}body.keyboard-open[data-exercise=study] canvas#world{display:none!important}body.keyboard-open .side{padding:8px!important}body.keyboard-open .study-card{padding:12px!important}
 .platform-notice{bottom:max(12px,env(safe-area-inset-bottom));max-height:calc(var(--viewport-height) - 24px);overflow:auto}
}
@media(max-width:359px){.focused-hud .play-toolbar .stats .hud-resource>div{display:grid;gap:1px}.brand{font-size:18px}.brand-icon{font-size:30px}.hud-adventure>.hud-icon{display:none}.header-controls button{padding:8px}.study-sentence{font-size:20px!important}.study-actions button{flex-basis:100px}}
@media(max-height:500px) and (orientation:landscape) and (max-width:950px){dialog{max-height:calc(100dvh - 12px)}.world-panel canvas#world{max-height:65dvh;object-fit:contain}.play-toolbar{min-height:0!important}.scene-actions .action-coach{padding:6px}.scene-actions .action-coach p{min-height:0}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

.platform-entry{display:block;margin:12px auto;min-height:44px;padding:10px 16px;border:1px solid #8db39a;border-radius:10px;font:inherit;background:#e6f2e7;color:#214e41}
@media(max-width:720px){
 .table-hotspots{inset:auto 0 auto;top:var(--scene-top,0px);height:var(--scene-height,0px);width:100%}
 body[data-exercise=study][data-mode=typing] .play-toolbar .stats{display:none!important}
 body[data-exercise=study][data-mode=typing] .scene-label{display:none}
 #sceneActions,#sceneActions[data-action=fight],.scene-actions.in-learning-panel,.scene-actions:not([data-action=fight]):not(.in-learning-panel){position:relative;inset:auto;transform:none;order:1;width:calc(100% - 24px);max-width:none;margin:12px;align-self:center}
 .platform-status{font-size:15px;line-height:1.7}
}
@media(max-width:720px){body.focused-hud[data-exercise=study] .study-card input.study-input{min-height:48px!important;font-size:18px!important}}

/* Give the actual scene the full mobile width, including while studying. */
@media(max-width:720px){
 .focused-hud .play-toolbar{padding:8px 10px;gap:6px}
 .focused-hud .play-toolbar .journey{gap:8px;align-items:center}
 .focused-hud .play-toolbar .hud-caption{display:none}
 .focused-hud .hud-adventure{gap:6px}
 .focused-hud .hud-learning{gap:2px;padding-left:8px}
 .focused-hud .hud-adventure-info,.focused-hud .play-toolbar .player-level{gap:3px}
 .focused-hud .play-toolbar .player-level span{font-size:16px;line-height:1.2}
 .focused-hud .play-toolbar .player-level small,.focused-hud .hud-learning small{font-size:10px;line-height:1.2}
 .focused-hud .play-toolbar .study-level-badge{font-size:12px;line-height:1.25}
 .world-panel canvas#world,body.focused-hud[data-mode=typing]:is([data-exercise=study],[data-phase=cook]) .world-panel canvas#world{height:auto;max-height:none;aspect-ratio:auto;object-fit:contain;background:#173b40}
}
/* A short landscape viewport still needs room for the controls below the scene. */
@media(max-height:500px) and (orientation:landscape) and (max-width:720px){
 .world-panel canvas#world,body.focused-hud[data-mode=typing]:is([data-exercise=study],[data-phase=cook]) .world-panel canvas#world{max-height:65dvh}
}