/* R0 candidate 44: controls occupy document space; a short screen never hides them. */
html body[data-route='splash'] #app {height:100dvh;overflow-y:auto;overflow-x:hidden}
body[data-route='splash']::after {display:none}
body[data-route='splash'] .splash-backdrop::after {background:linear-gradient(180deg,rgba(3,12,17,.70),rgba(3,12,17,.74) 55%,#071317)}
body[data-route='splash'] #app .welcome-screen {min-height:100dvh;padding:calc(60px + env(safe-area-inset-top)) max(20px,env(safe-area-inset-right)) 0 max(20px,env(safe-area-inset-left));overflow:visible}
body[data-route='splash'] #app .welcome-logo {width:clamp(56px,calc(100dvh - 620px),220px);max-height:220px}
body[data-route='splash'] #app .splash-controls {position:relative;inset:auto;flex-shrink:0;width:100%;margin-top:8px;padding-inline:0;z-index:2}
body[data-route='splash'] #app .welcome-content p {margin-bottom:0}
body[data-route='splash'] #app .welcome-details {margin-bottom:0}
body[data-route='splash'] #app .splash-controls [data-act='cloud'] {grid-column:1/-1;min-height:44px;font-family:var(--ff-ui);font-size:var(--t-footnote);line-height:var(--lh-footnote);font-weight:400}
/* The optional introduction stays available in the expanded explanation. */
@media(max-height:640px) {
 body[data-route='splash'] #app .welcome-content>p:first-of-type {display:none}
 body[data-route='splash'] #app .welcome-logo {width:56px;max-height:56px}
 body[data-route='splash'] #app .welcome-content h1 {margin:4px 0 8px}
 body[data-route='splash'] #app .welcome-content .welcome-play {margin-top:8px;min-height:44px}
 body[data-route='splash'] #app .welcome-content .welcome-note {margin-top:8px}
 body[data-route='splash'] #app .welcome-details {margin-top:0}
 body[data-route='splash'] #app .welcome-details summary {padding-block:10px;min-height:44px}
}
@media(orientation:landscape) and (max-height:600px) {
 body[data-route='splash'] #app .welcome-screen {display:grid;grid-template-columns:minmax(90px,.6fr) minmax(0,1.8fr);grid-template-rows:1fr auto;column-gap:20px;padding-top:50px;align-items:center}
 body[data-route='splash'] #app .welcome-logo {grid-area:1/1;width:min(36dvh,160px);max-height:160px;justify-self:center}
 body[data-route='splash'] #app .welcome-content {grid-area:1/2}
 body[data-route='splash'] #app .welcome-content h1 {margin:0 0 4px}
 body[data-route='splash'] #app .splash-controls {grid-area:2/1/3/3;grid-template-columns:minmax(0,1fr) auto auto;margin-top:4px;gap:8px}
 body[data-route='splash'] #app .splash-controls [data-act='cloud'] {grid-column:1;justify-self:start;text-align:left}
 body[data-route='splash'] #app .welcome-note {margin-block:4px 0}
 body[data-route='splash'] #app .welcome-details summary {padding-block:4px}

 body[data-route='play'][data-mode='sort'] {height:100dvh;overflow:hidden}
 body[data-route='play'][data-mode='sort'] #app {height:100dvh;overflow:hidden}
 body[data-route='play'][data-mode='sort'] .app-shell {display:block;height:100%;min-height:0;padding:0}
 body[data-route='play'][data-mode='sort'] :is(.sidebar,.topbar,.mobile-nav,.side-panel,.chapter-card,.mode-tabs,.practice-top,.journey-goal,.instruction,.play-skills,.essence-manifest) {display:none!important}
 body[data-route='play'][data-mode='sort'] .main {height:100%;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);overflow:hidden}
 body[data-route='play'][data-mode='sort'] .workspace,body[data-route='play'][data-mode='sort'] .workspace>div {display:block;height:100%;min-height:0;max-width:none;margin:0}
 body[data-route='play'][data-mode='sort'] .practice {height:100%;min-height:0;margin:0;border:0;border-radius:0;display:grid;grid-template-columns:minmax(0,1fr) clamp(108px,18vw,160px);grid-template-rows:44px minmax(0,1fr);overflow:hidden}
 body[data-route='play'][data-mode='sort'] .level-compact-header {grid-area:1/1/2/3;display:grid;height:44px;padding-block:0}
 body[data-route='play'][data-mode='sort'] .sort-board {grid-area:2/1;grid-template-columns:repeat(var(--landscape-cols),minmax(0,1fr));grid-template-rows:repeat(var(--landscape-rows),minmax(0,1fr));min-height:0!important;height:100%;padding:8px!important;gap:8px!important;align-content:stretch;align-items:stretch}
 body[data-route='play'][data-mode='sort'] .flask-button {display:flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;padding:0}
 body[data-route='play'][data-mode='sort'] .flask-visual {height:100%;width:100%;min-height:0}
 body[data-route='play'][data-mode='sort'] .flask-visual>svg.flask-glass {height:100%;width:100%;max-height:100%;max-width:100%}
 body[data-route='play'][data-mode='sort'] .flask-id {position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important}
 body[data-route='play'][data-mode='sort'] .practice {grid-template-columns:minmax(0,1fr);grid-template-rows:44px minmax(0,1fr) auto}
 body[data-route='play'][data-mode='sort'] .level-compact-header {grid-area:1/1}
 body[data-route='play'][data-mode='sort'] .sort-board {grid-area:2/1}
 body[data-route='play'][data-mode='sort'] .tools {grid-area:3/1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:minmax(44px,auto);gap:6px;padding:6px max(8px,env(safe-area-inset-right)) max(6px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));border-top:1px solid var(--line);border-left:0;min-height:0;overflow:visible}
 body[data-route='play'][data-mode='sort'] .tools:has([data-act='extra']) {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:minmax(44px,auto);flex-wrap:nowrap}
 body[data-route='play'][data-mode='sort'] .tools .tool {display:none;min-height:44px;min-width:0;width:100%;max-width:none;padding:4px}
 body[data-route='play'][data-mode='sort'] .tools :is([data-act='undo'],[data-act='hint'],[data-act='extra'],[data-act='restart']) {display:flex}
 body[data-route='play'][data-mode='sort'] .tools .tool-with-reason {display:contents}
 body[data-route='play'][data-mode='sort'] .tools .tool-disabled-reason {display:none;position:fixed;left:50%;bottom:calc(56px + env(safe-area-inset-bottom));transform:translateX(-50%);z-index:101;max-width:min(88vw,420px);padding:10px 14px;border:1px solid #618778;border-radius:5px;background:#183b37;color:#f0e7d0;text-align:center}
 body[data-route='play'][data-mode='sort'] .tools .tool-with-reason:active .tool-disabled-reason {display:block}
}

/* Audit44 M1: the compact header also needs its own surface above 900px. */
@media(orientation:landscape) and (max-height:600px) {
 body[data-route='play'][data-mode='sort'] .level-compact-header {align-items:center;column-gap:8px;padding-inline:8px;background:#07191d;color:var(--text);border-bottom:1px solid var(--line);position:relative;z-index:4}
}
/* Audit44 M2: alpha asset, with its gold colours preserved over either backdrop. */
body[data-route='splash'] #app .welcome-logo {mix-blend-mode:normal}