:root{color-scheme:dark;font-family:Georgia,serif;color:#eadfc8;background:#141c1c}*{box-sizing:border-box}body{margin:0;height:100dvh;display:grid;grid-template-rows:56px minmax(0,1fr) 28px;overflow:hidden}button,input{font:inherit}button{cursor:pointer;color:inherit;border:1px solid #657065;background:#28322d;padding:9px 13px;border-radius:3px}button:hover{background:#3d493c}button:focus-visible,input:focus-visible{outline:2px solid #e9be6e;outline-offset:2px}header{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #414b42;padding:0 3%;gap:15px}header>a{font-size:27px;letter-spacing:6px;color:#eee1bc;text-decoration:none}header>a span{font-size:18px}header>span,.eyebrow,.scene-heading>span,footer,label{font:10px/1.5 system-ui,sans-serif;letter-spacing:1.4px}header>span{color:#a9b1a0}header button{font:12px system-ui}main{width:100%;max-width:1600px;min-height:0;margin:auto; height:100%;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(300px,1fr);padding:18px 3% 12px;gap:24px}.scene{min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto;border:1px solid #4c5747;background:#202a26;border-radius:5px;overflow:hidden}.scene-heading{padding:16px 22px}.scene-heading>span{color:#bdb591;font-size:9px}h1{font-weight:400;font-size:32px;margin:5px 0 0;letter-spacing:-.5px}.art{position:relative;isolation:isolate;overflow:hidden;min-height:0;background:#29372c;background-size:cover;background-position:center;display:grid;place-items:center}.prop{position:absolute;width:18%;height:52%;object-fit:contain;left:18%;bottom:8%;z-index:2;pointer-events:none;filter:drop-shadow(5px 7px 3px #17201944)}.prop[hidden]{display:none}.foreground{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;z-index:3;pointer-events:none}#art-note{z-index:4;text-align:center;padding:20px}.description{padding:14px 22px;max-height:155px;overflow:auto}.eyebrow{color:#bfb896;font-size:9px}.description p{font-size:16px;line-height:1.5;margin:7px 0 0;white-space:normal}aside{min-height:0;display:grid;grid-template-rows:minmax(0,1fr) auto;gap:15px}.response{min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr)}.response-title{display:flex;align-items:baseline;justify-content:space-between;padding:0 0 12px;border-bottom:1px solid #414b42}h2{font-size:20px;font-weight:400;margin:0}.response-title span{font:11px system-ui;color:#a7b29f}#transcript{overflow:auto;min-height:0;overscroll-behavior:contain;padding:14px 12px 10px 0;scrollbar-color:#586652 transparent}#transcript section+section{margin-top:20px}.command-label{font:12px/1.5 ui-monospace,monospace;color:#b8a978;margin:0 0 8px}pre{white-space:pre-wrap;font:16px/1.6 Georgia,serif;margin:0;overflow-wrap:anywhere}form{padding-top:12px;border-top:1px solid #414b42}label{display:block;margin-bottom:7px;color:#c4c8b9;letter-spacing:.5px}form>div{display:flex;gap:7px}input{min-width:0;width:100%;background:#1d2723;color:#efe4cd;border:1px solid #5b6656;padding:11px}form button{white-space:nowrap;font:12px system-ui}#error{font:12px/1.4 system-ui;color:#ebcaa0;margin:6px 0 0}#error:empty{display:none}footer{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:0 3%;color:#9eab99;letter-spacing:.2px;font-size:9px}a{color:#cbbd8b}@media(max-width:700px){body{grid-template-rows:48px minmax(0,1fr) 24px}header>span{display:none}main{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) minmax(0,1fr);gap:12px;padding:10px 14px}.scene-heading{padding:8px 14px}.scene-heading>span{display:none}h1{font-size:24px;margin:0}.description{padding:9px 14px;max-height:90px}.description p{font-size:13px;line-height:1.4;margin:0}.eyebrow{display:none}aside{gap:7px}.response-title{padding-bottom:6px}h2{font-size:17px}pre{font-size:14px;line-height:1.5}#transcript{padding-top:8px}form{padding-top:7px}input{padding:9px}footer{font-size:8px}header>a{font-size:23px}}@media(max-height:560px) and (min-width:701px){main{padding-top:10px}.scene-heading{padding:8px 15px}h1{font-size:24px}.scene-heading>span{display:none}.description{max-height:100px;padding:10px 15px}.description p,pre{font-size:14px}}
#window-layer{position:absolute;inset:0;z-index:1;background-size:cover;background-position:center;pointer-events:none}#window-layer[hidden]{display:none}
.command-heading{align-items:center;justify-content:space-between;margin-bottom:6px}.command-heading label{margin:0}#verbs-open{padding:3px 8px;font:11px system-ui}dialog{color:#eadfc8;background:#202a26;border:1px solid #68725e;border-radius:6px;width:min(640px,calc(100vw - 28px));max-height:calc(100dvh - 32px);padding:18px;overflow:hidden}dialog[open]{display:flex;flex-direction:column}dialog::backdrop{background:#07100bd9}.verb-title{display:flex;justify-content:space-between;align-items:center;gap:15px}.verb-title button{font:12px system-ui}.verb-intro,.verb-foot,#verb-count{font:12px/1.45 system-ui;color:#bec7b5;margin:9px 0}.verb-foot{font-size:11px}#verb-search{flex-shrink:0}#verb-list{min-height:80px;overflow:auto;overscroll-behavior:contain;border-top:1px solid #4c5747}.verb-row{padding:8px 0;border-bottom:1px solid #3c493c;display:flex;align-items:baseline;flex-wrap:wrap;gap:5px}.verb-row button{padding:5px 8px;font:13px ui-monospace,monospace}.verb-row .alias{background:transparent;border-color:#465345;font-size:12px}.alias-label{font:11px system-ui;color:#adb8a3;margin-left:6px}@media(max-width:700px){dialog{padding:12px}.verb-intro{font-size:11px;margin:6px 0}.verb-title h2{font-size:18px}}
#verb-group{color:inherit;background:#1d2723;border:1px solid #5b6656;padding:8px;font:12px system-ui;margin-bottom:10px;flex-shrink:0}.verb-row details{font:11px system-ui;color:#adb8a3}.verb-row summary{cursor:pointer;padding:5px}.verb-row details button{margin:3px}.verb-row details[open]{flex-basis:100%}

.foreground[hidden]{display:none}

.leaves-prop,.nest-prop,.egg-prop{position:absolute;object-fit:contain;pointer-events:none;z-index:2}.egg-prop{z-index:3}.leaves-prop[hidden],.nest-prop[hidden],.egg-prop[hidden]{display:none}

.anchored-prop{position:absolute;object-fit:contain;pointer-events:none;z-index:2}.anchored-prop[hidden]{display:none}#ground-props{position:absolute;inset:0;pointer-events:none;z-index:1}

#interior-props{position:absolute;inset:0;z-index:2;pointer-events:none}.interior-prop{position:absolute;background-image:url(assets/interior-props.png);background-size:400% 300%;background-repeat:no-repeat}.interior-prop[hidden]{display:none}.art[data-dark="true"]{background-color:#080a09}/* Atlas gutter: exclude adjacent sword tip from the knife cell. */
.interior-prop[data-kind="knife"]{clip-path:inset(22% 0 0 0)}

.art[data-interior="true"]{background-size:contain;background-repeat:no-repeat;background-color:#171b18}#window-layer{background-repeat:no-repeat}.art[data-interior="true"] #window-layer{background-size:contain}

#case-layer,#door-lettering,#bottle-break{position:absolute;pointer-events:none}#case-layer{z-index:1;background-image:url(assets/living-case-open.png);background-repeat:no-repeat}#door-lettering{z-index:3;color:#382619;font-family:Georgia,serif;font-weight:bold;text-align:center;display:flex;align-items:center;justify-content:center;line-height:1.05;transform:skewY(3deg);text-shadow:0 1px #b18e5a}#bottle-break{z-index:5;background-repeat:no-repeat}#case-layer[hidden],#door-lettering[hidden],#bottle-break[hidden]{display:none}.interior-prop[data-place="inside"]{z-index:3}.interior-prop[data-place="case"]{filter:brightness(.82)}.shatter{animation:bottle-shatter 1.1s ease-out forwards}@keyframes bottle-shatter{0%{opacity:1;transform:scale(.6)}65%{opacity:.8;transform:scale(1)}100%{opacity:0;transform:translateY(25px) scale(1.1)}}@media(prefers-reduced-motion:reduce){.shatter{animation:bottle-shatter .05s linear forwards}}

.interior-prop[data-kind="rug"],.interior-prop[data-kind="hatch"]{z-index:0}.interior-prop{z-index:1}

.inventory-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(105px,1fr));gap:10px;margin:12px 0;max-height:260px;overflow:auto;padding:6px;border:1px solid #425149;border-radius:4px}.inventory-gallery:empty{display:none}.inventory-card{margin:0;padding:8px;background:#26332c;border-radius:4px;text-align:center;font-size:13px}.inventory-sprite{width:88px;height:88px;margin:auto;background-image:url(assets/interior-props.png);background-size:400% 300%;background-repeat:no-repeat}.inventory-card small{display:block;color:#c8be9e;font-size:11px;margin-top:4px}@media(max-width:700px){.inventory-gallery{max-height:180px;grid-template-columns:repeat(auto-fill,minmax(90px,1fr))}.inventory-sprite{width:72px;height:72px}}

[data-kind="sword"][data-state="glow"]{filter:drop-shadow(0 0 2px #70aaff)}[data-kind="sword"][data-state="bright"]{filter:drop-shadow(0 0 5px #428bff)}.inventory-sprite[data-kind="knife"]{clip-path:inset(22% 0 0 0)}
/* Exclude the neighboring sandwich's atlas gutter without clipping the clove. */
[data-kind="garlic"]{clip-path:inset(0 0 0 10%)}
[data-kind="buoy"][data-state="open"]{clip-path:inset(0 0 0 18%)}

#cellar-hatch,#thief-prop{position:absolute;pointer-events:none;background-repeat:no-repeat}#cellar-hatch{z-index:1;background-image:url(assets/cellar-open.png)}#thief-prop{z-index:4;background-image:url(assets/thief-states.png);background-size:200% 200%}#cellar-hatch[hidden],#thief-prop[hidden]{display:none}

#cellar-hatch{clip-path:polygon(32% 0,66% 0,66% 20%,32% 20%)}
/* Registered sprites keep canonical framing; state layers may extend for a moving lid. */
.prop>svg,.anchored-prop>svg,.interior-prop>svg,.inventory-sprite>svg{display:block;pointer-events:none}
#troll-prop{position:absolute;z-index:4;pointer-events:none}#troll-prop[hidden]{display:none}

#mirror-layer{position:absolute;inset:0;pointer-events:none;background:url(assets/mirror-broken.png) center/100% 100%;z-index:2}#mirror-layer[hidden]{display:none}#mirror-reflections{position:absolute;inset:0;pointer-events:none;z-index:3}
/* Clip the entire overlay, including its reused base, so CSS/SVG resampling cannot alter surrounding pixels. */
#mirror-layer{clip-path:polygon(24.4140625% 0,75.7161458333% 0,75.7161458333% 61.03515625%,24.4140625% 61.03515625%)}

.machine-flash{animation:machine-color 1.2s ease-out}@keyframes machine-color{0%,100%{filter:none}20%{filter:hue-rotate(100deg) brightness(1.4)}45%{filter:hue-rotate(250deg) brightness(1.2)}70%{filter:hue-rotate(30deg)}}@media(prefers-reduced-motion:reduce){.machine-flash{animation:none}}

/* Original ghost mode grants sight but describes a pale, unreal world. */
#art[data-ghost="true"]{filter:grayscale(.85) brightness(1.15)}

header nav{display:flex;gap:6px;align-items:center}header nav button{white-space:nowrap}@media(max-width:600px){header nav{gap:4px}header nav button{padding:6px 8px;font-size:12px}}

#root,#root>div{display:contents}

#save-status{letter-spacing:0;max-width:65%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#save-status[data-failed="true"]{color:#ffcf8a;white-space:normal;max-width:80%;padding:3px 0;background:#29251b}footer>span:not(#save-status){display:none}

body:has(#save-status[data-failed="true"]){grid-template-rows:56px minmax(0,1fr) auto}

#title-dialog,#help-dialog,#audio-dialog{color:#eee4cb;background:#1b2520;border:1px solid #74765c;border-radius:8px;padding:24px;max-height:calc(100dvh - 32px);max-width:min(620px,calc(100vw - 28px));box-sizing:border-box;overflow:auto;font:16px/1.6 Georgia}dialog::backdrop{background:#0b120ee8}#title-dialog h1{font-size:48px;letter-spacing:.22em;margin:10px 0}dialog a{color:#ddcba0}dialog button{margin:4px}dialog dt{font-weight:bold;margin-top:12px}dialog dd{margin-left:0}#title-dialog a{display:block;margin-top:18px}.small-note{font-size:13px;opacity:.8}#audio-open{font-size:16px;padding:0 8px;margin-right:8px}#music-volume{display:block;width:100%}footer{gap:8px}footer #save-status{flex:1}#help-open{margin-left:auto}#help-dialog .verb-title{position:sticky;top:-24px;background:#1b2520;padding:8px 0}#help-dialog h3{margin-bottom:5px}@media(max-height:450px){#title-dialog{padding:14px}#title-dialog h1{font-size:30px}#title-dialog p{margin:6px 0}}

#title-dialog[open],#help-dialog[open],#audio-dialog[open]{display:block}#help-dialog p{margin:10px 0}#help-dialog h3{margin-top:18px}#help-open{padding:3px 8px;font:13px system-ui}
/* Footer shares the content container's width and gutters at every breakpoint. */
footer{width:100%;max-width:1600px;margin:0 auto;padding:0 3%;min-width:0}.footer-tools{display:flex;align-items:center;gap:6px;flex:none}.footer-tools button{font:11px system-ui;padding:2px 7px;margin:0;height:24px}#audio-open{margin:0;font-size:16px;padding:0 8px}footer #save-status{min-width:0;max-width:none}footer>a{flex:none}body{grid-template-rows:56px minmax(0,1fr) 32px}
#feedback-dialog,#feedback-view-dialog{color:#eee4cb;background:#1b2520;border:1px solid #74765c;border-radius:8px;padding:22px;width:560px;max-width:calc(100vw - 28px);max-height:calc(100dvh - 28px);overflow:auto}#feedback-dialog[open],#feedback-view-dialog[open]{display:block}#feedback-form{display:block}#feedback-form label{margin-top:10px}#feedback-form textarea{width:100%;resize:vertical;min-height:90px;background:#1d2723;color:#efe4cd;border:1px solid #5b6656;padding:10px;font:14px system-ui}#feedback-form details{margin-top:12px;font:12px/1.5 system-ui}#feedback-context{font:11px/1.4 monospace}#feedback-status{font:13px/1.5 system-ui}button:disabled{opacity:.55;cursor:not-allowed}textarea:focus-visible{outline:2px solid #e9be6e;outline-offset:2px}@media(max-width:700px){header,footer{padding-left:14px;padding-right:14px}body{grid-template-rows:48px minmax(0,1fr) 32px}footer{gap:6px}.footer-tools{gap:4px}.footer-tools button{padding:2px 5px}footer>a{max-width:65px;text-align:right}#feedback-dialog{padding:16px}}
.feedback-consent{display:flex;align-items:start;gap:8px;font:13px/1.5 system-ui}.feedback-consent input{width:auto;flex:none;margin-top:3px}#feedback-list article{border-top:1px solid #657065;padding:12px 0;overflow-wrap:anywhere}#feedback-list pre{font:11px/1.4 monospace}#feedback-list h3{margin:0}#feedback-list p{white-space:pre-wrap}
#typed{--command-button-width:84px}#verbs-open,#typed>div>button:not(#help-open){width:var(--command-button-width);min-width:var(--command-button-width);flex:0 0 var(--command-button-width);box-sizing:border-box}#help-open{width:auto;flex:none}
#feedback-dialog .verb-title,#feedback-view-dialog .verb-title{position:sticky;top:-22px;background:#1b2520;padding:8px 0;z-index:1}@media(max-width:700px){#feedback-dialog .verb-title{top:-16px}}
/* Command controls use shared tracks, heights and spacing on every viewport. */
#typed{--command-gap:8px;--command-height:40px;display:grid;row-gap:var(--command-gap)}
#typed>.command-heading{display:grid;grid-template-columns:minmax(0,1fr) var(--command-height) var(--command-button-width);gap:var(--command-gap);margin:0;align-items:center}
#typed>div:not(.command-heading){display:grid;grid-template-columns:minmax(0,1fr) var(--command-button-width);gap:var(--command-gap);align-items:stretch}
#typed #command,#typed button{height:var(--command-height);margin:0;box-sizing:border-box}
#typed #help-open{width:var(--command-height);min-width:0;padding:0}
#typed #verbs-open,#typed>div:not(.command-heading)>button{padding:0 8px;font:12px system-ui}
#typed #command{width:100%;padding:8px 10px}
#typed #error{margin:0}#typed #error:empty{display:none}
/* A scene is revealed only when every visible layer has decoded. */
#art[data-loading="true"],#art[data-load-failed="true"]{visibility:hidden}
#art[data-loading="true"]>*,#art[data-load-failed="true"]>*{visibility:hidden!important}
#art[data-loading="true"]::after,#art[data-load-failed="true"]::after{position:absolute;inset:0;display:grid;place-items:center;background:#17201c;color:#c9c1aa;font:12px system-ui;content:'Loading scenery…';z-index:100;visibility:visible}
#art[data-load-failed="true"]::after{content:'Scenery unavailable — use the room description.'}
.full-download{display:grid;place-items:center;min-height:100dvh;height:auto;padding:clamp(16px,4vw,48px);box-sizing:border-box;overflow:auto}.full-download section{max-width:620px;width:100%;margin:auto;padding:clamp(18px,4vw,36px);box-sizing:border-box;background:#19211e;border:1px solid #536257;border-radius:12px}.full-download h1{font-size:clamp(24px,5vw,38px)}.full-download p{line-height:1.5}.full-download progress{display:block;width:100%;height:22px;accent-color:#c6ac71}.full-download button{min-height:44px;padding:8px 20px}
.full-download{grid-template-columns:minmax(0,1fr);width:100%;max-width:none;gap:0}
.full-download{height:100dvh;min-height:0;max-height:100dvh;align-items:safe center}
/* Normal mobile document flow: full picture, story, then command controls. */
#mobile-menu-open[hidden]{display:none}
#mobile-menu{overflow:auto;max-height:calc(100dvh - 24px);margin:auto;padding:16px;width:min(360px,calc(100vw - 24px))}
#mobile-menu[open]{display:flex;gap:10px}#mobile-menu nav,#mobile-menu .footer-tools{display:flex;flex-wrap:wrap;gap:8px}
#mobile-menu button{min-height:44px;padding:8px 10px;font:14px system-ui}#mobile-menu #verbs-open{width:auto;font-size:14px}
#mobile-menu #save-status{max-width:100%;white-space:normal;font:12px/1.4 system-ui}#mobile-menu>a{padding:8px 0}
@media(max-width:700px),(max-width:1000px) and (pointer:coarse){
 body,body:has(#save-status[data-failed="true"]){display:block;height:auto;min-height:100dvh;overflow:auto}
 header{min-height:42px;padding:8px 18px;gap:8px}header>a{font-size:20px;letter-spacing:3px}header>span,footer{display:none}
 main:not(.full-download){display:block;height:auto;min-height:0;overflow:visible;padding:12px 18px 24px;margin:0 auto}
 .scene{display:block;margin:0 0 16px;overflow:hidden}.scene-heading{padding:8px 10px}.scene-heading h1{font-size:22px;line-height:1.2}.scene-heading>span,.description{display:none}
 .art{width:100%;height:auto;min-height:0;aspect-ratio:var(--scene-aspect,3 / 2);background-size:contain;background-repeat:no-repeat}
 aside,.response{display:block;height:auto;min-height:0;overflow:visible}.response-title{padding-bottom:8px}.response-title h2{font-size:18px}
 #transcript{min-height:100px;max-height:24rem;overflow:auto;overscroll-behavior-y:auto;padding:10px 0 12px;scroll-padding:0}#transcript pre{font-size:16px;line-height:1.5}#transcript section+section{margin-top:16px}
 #typed{position:static;margin:12px 0 0;padding:12px 0 0;--command-height:44px;--command-button-width:58px;--command-gap:6px;display:grid;grid-template-columns:minmax(0,1fr) 58px 38px 38px;gap:6px}
 #typed>.command-heading,#typed>div:not(.command-heading){display:contents}#typed label{display:none}
 #typed #command{grid-column:1;grid-row:1;font-size:16px;padding:8px;min-width:0}
 #typed>div:not(.command-heading)>button{grid-column:2;grid-row:1;width:58px;min-width:0;padding:0 4px}
 #typed #help-open{grid-column:3;grid-row:1;width:38px}#mobile-menu-open{grid-column:4;grid-row:1;width:38px;min-width:0;padding:0;font:18px system-ui}
 #typed #error{grid-column:1/-1;font-size:12px}
}

/* Mobile illustration trial: native viewport sizing, independent story scroll. */
@media(max-width:700px),(max-width:1000px) and (pointer:coarse){
 body,body:has(#save-status[data-failed="true"]){display:grid;grid-template-rows:42px minmax(0,1fr);height:100dvh;min-height:360px;overflow:auto}
 main:not(.full-download){height:100%;min-height:0;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) minmax(215px,1fr);gap:10px;padding:8px 18px 12px}
 .scene{margin:0;display:flex;flex-direction:column;align-items:center;background:#141c1c;container-type:size}
 .scene-heading{width:100%;background:#202a26;padding:5px 10px}.scene-heading h1{font-size:20px;line-height:1.2}
 .art{width:min(100cqw,calc((100cqh - 36px) * var(--scene-ratio,1.5)));height:auto;flex:none;margin:auto;aspect-ratio:var(--scene-aspect,3 / 2)}
 aside{display:grid;grid-template-rows:minmax(0,1fr) auto;gap:8px;min-height:0;height:100%}
 .response{display:grid;grid-template-rows:auto minmax(0,1fr);height:100%;min-height:0}
 #transcript{min-height:0;max-height:none;overflow:auto;overscroll-behavior:contain;padding:8px 0}
 #typed{margin:0;padding-top:8px}
}

/* Keyboard overlays reduce the visual viewport even when 100dvh is unchanged. */
@media(max-width:700px),(max-width:1000px) and (pointer:coarse){
 html.compact-play{overflow:hidden}
 html.compact-play body,html.compact-play body:has(#save-status[data-failed="true"]){position:fixed;inset:auto 0 auto 0;top:var(--visible-top,0px);height:var(--visible-height,100dvh);min-height:0;overflow:hidden}
 html.compact-play main:not(.full-download){grid-template-rows:minmax(40px,1fr) minmax(min(215px,65%),1fr)}
 html.compact-play dialog{max-height:calc(var(--visible-height,100dvh) - 24px);top:var(--visible-top,0px);bottom:auto;margin:12px auto}
}
/* Desktop footer breathing room; mobile utilities remain in the menu. */
@media(min-width:701px){
 html:not(.compact-play) body{grid-template-rows:56px minmax(0,1fr) 40px}
 html:not(.compact-play) footer{padding-bottom:8px}
}

/* Mobile identity lives above the transcript; utilities are in the menu. */
@media(max-width:700px),(max-width:1000px) and (pointer:coarse){
 header{display:none}
 .response-title{padding-bottom:5px}.response-title h2,.scene-heading h1{font-size:16px;line-height:1.5}
 body,body:has(#save-status[data-failed="true"]){grid-template-rows:minmax(0,1fr)}
}

/* One mobile heading combines identity, current room and turn count. */
@media(max-width:700px),(max-width:1000px) and (pointer:coarse){
 .scene-heading,.response-title #moves{display:none}
 .response-title{display:block}.response-title h2{overflow-wrap:anywhere}
 .art{width:min(100cqw,calc(100cqh * var(--scene-ratio,1.5)))}
}

/* Fit the frame to the image; the half-height share is a ceiling, not padding. */
@media(max-width:700px),(max-width:1000px) and (pointer:coarse){
 html.compact-play main:not(.full-download){grid-template-rows:auto minmax(0,1fr)}
 .scene{--mobile-art-height:min(calc((100vw - 38px) / var(--scene-ratio,1.5)),calc((var(--visible-height,100dvh) - 30px) / 2 - 2px),max(24px,calc(var(--visible-height,100dvh) - 245px)));container-type:normal;justify-self:center;width:min(100%,calc(var(--mobile-art-height) * var(--scene-ratio,1.5) + 2px));height:calc(var(--mobile-art-height) + 2px)}
 .art{width:100%;height:auto;margin:0}
}

/* Keep the move count anchored beside a wrapping mobile room heading. */
@media(max-width:700px),(max-width:1000px) and (pointer:coarse){
 .response-title{display:grid;grid-template-columns:minmax(0,1fr) max-content;gap:8px;align-items:baseline}
 .response-title #moves{display:block;white-space:nowrap;font:16px/1.5 Georgia,serif}
 .response-title h2{min-width:0}
}

#art[tabindex]{cursor:zoom-in}#art:focus-visible{outline:2px solid #e9be6e;outline-offset:-3px}
#scene-viewer{position:fixed;inset:0;width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;padding:12px;border:0;border-radius:0;background:#101816;overflow:hidden}
#scene-viewer[open]{display:grid;grid-template-rows:44px minmax(0,1fr);gap:10px}
#scene-viewer>button{justify-self:end;min-height:44px;z-index:10}
.viewer-stage{min-height:0;container-type:size;display:grid;place-items:center}
#scene-viewer #art{width:min(100cqw,calc(100cqh * var(--viewer-ratio,1.5)));height:auto;max-height:100%;aspect-ratio:var(--scene-aspect,3 / 2);margin:0;background-size:contain!important;cursor:default}
@media(max-width:700px),(max-width:1000px) and (pointer:coarse){
 html.compact-play #scene-viewer{top:var(--visible-top,0px);height:var(--visible-height,100dvh);max-height:none;margin:0}
}

.visible-item-description{color:inherit;font:inherit}

#transcript pre,.description p{font-size:var(--story-font-size,16px);color:var(--story-color,#eadfc8)}
.response-title h2{color:var(--story-color,#eadfc8)}
#transcript .visible-item-description{color:inherit}
#text-settings label,#text-settings legend{font:14px/1.5 system-ui;letter-spacing:0}
#text-settings label{margin-top:18px}#text-scale{padding:0;width:100%;min-height:36px}
.text-scale-labels{display:grid;grid-template-columns:1fr 1fr 1fr;align-items:start;font:12px/1.3 system-ui}.text-scale-labels strong{text-align:center}.text-scale-labels span:last-child{text-align:right}
#text-settings fieldset{margin:20px 0 0;border:1px solid #657065;border-radius:4px}
.text-color-choices{display:flex;flex-wrap:wrap;align-items:center;gap:10px}.text-color-choices button{min-height:44px}.text-color-choices button::before{content:'';display:inline-block;background:var(--swatch);width:16px;height:16px;border:1px solid #999;margin-right:7px;vertical-align:middle}.text-color-choices button[aria-pressed=true]{outline:2px solid #e9be6e;outline-offset:1px}
#text-settings .text-color-choices label{margin:0}#text-color{display:block;padding:2px;width:64px;height:36px}
#text-contrast,#text-prefs-status{font:13px/1.5 system-ui;color:#ebcaa0}#text-settings{overflow:auto}
@media(max-width:700px),(max-width:1000px) and (pointer:coarse){.response-title h2,.response-title #moves{font-size:var(--story-font-size,16px);color:var(--story-color,#eadfc8)}}

/* When the native keyboard overlays the layout viewport, pair art with metadata. */
@media(max-width:700px),(max-width:1000px) and (pointer:coarse){
 html.compact-play.keyboard-side main:not(.full-download){grid-template-columns:minmax(0,1.857fr) minmax(104px,1fr);grid-template-rows:var(--side-art-height,auto) minmax(0,1fr);column-gap:12px}
 .keyboard-side .scene{grid-column:1;grid-row:1;justify-self:start;align-self:start;width:min(100%,calc((var(--side-art-height) - 2px) * var(--scene-ratio,1.5) + 2px));height:auto}
 .keyboard-side main>.response-title{grid-column:2;grid-row:1;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:0;border:0;padding:0;min-width:0;align-self:center;max-height:none;overflow:auto}
 .keyboard-side .response-title>*{flex-shrink:0}
 .keyboard-side .response-title h2 span{display:block;font:inherit;color:inherit;letter-spacing:inherit}.keyboard-side .response-title #moves{white-space:normal;overflow-wrap:anywhere}
 .keyboard-side aside{grid-column:1/-1;grid-row:2}.keyboard-side .response{display:block}.keyboard-side #transcript{height:100%}
}
@media(max-width:700px),(max-width:1000px) and (pointer:coarse){
 .keyboard-side main>.response-title{align-self:stretch;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto;align-items:stretch;overflow:visible}
 .keyboard-side .response-title h2{display:grid;grid-template-rows:auto minmax(0,1fr);min-height:0;margin:0;overflow:hidden}
 .keyboard-side .response-title h2 span:last-child{align-self:center;max-height:100%;overflow:auto}
 .keyboard-side .response-title #moves{align-self:end;justify-self:start}
}
/* Reclaim heading space before gently fitting default desktop room prose. */
html:not(.compact-play) .scene-heading{padding:12px 22px}
html:not(.compact-play) .scene-heading h1{font-size:28px;margin-top:0}
html:not(.compact-play) .description{max-height:min(172px,30dvh)}
html:not(.compact-play) .response-scroll-tail{display:none}
.response-scroll-tail{pointer-events:none}

/* Exploration follows Moves; compact keyboard mode uses two deliberate lines. */
#moves{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:0 10px}
#moves>span{white-space:nowrap;font:inherit;color:inherit}
@media(max-width:700px),(max-width:1000px) and (pointer:coarse){
 .response-title{grid-template-columns:minmax(0,1fr) minmax(0,max-content)}
 .response-title h2>span{display:block;font:inherit;color:inherit;letter-spacing:inherit}
 .response-title #moves{display:flex;flex-direction:column;align-items:flex-end;white-space:normal}
 .keyboard-side .response-title h2{display:block;overflow:auto}
 .keyboard-side .response-title h2 span:last-child{max-height:none}
 .keyboard-side .response-title #moves{align-items:flex-start;gap:0}
 .keyboard-side #moves>span{white-space:normal}
}

/* Shared White House geometry, inside the existing composed-scene viewer. */
#house-scene {position:absolute;inset:0;overflow:hidden;background:#30281d;pointer-events:none}
#house-scene[hidden],#house-views[hidden]{display:none}
.house-world{position:absolute;width:1536px;height:1024px;transform-origin:0 0;overflow:hidden}
.house-background,.house-props{position:absolute;inset:0;width:1536px;height:1024px}
#house-scene .prop{position:absolute;transform-origin:0 0;bottom:auto;right:auto;z-index:auto;filter:none}
#art[data-house="true"] > :not(#house-scene):not(#house-views){display:none!important}
#house-views{position:absolute;left:8px;bottom:8px;display:flex;gap:5px;z-index:20}
#house-views button{font:11px/1.2 system-ui;padding:7px 9px;background:#19251ee8;border-color:#8e957d}
#house-views button[aria-pressed="true"]{background:#ead9b6;color:#243029}
@media(max-width:700px){#house-views{left:4px;bottom:4px;gap:3px}#house-views button{font-size:10px;padding:5px 7px}}

.house-case-layer{position:absolute;inset:0;width:1536px;height:1024px}
#house-case-contents{width:min(700px,94vw);max-height:90dvh;overflow:auto;background:#202a26;color:#eadfc8;border:1px solid #8e957d}
#house-case-contents .inventory-gallery{max-height:60dvh}
#house-views{flex-wrap:wrap;max-width:calc(100% - 12px)}
