@font-face{font-family:FowlDisplay;src:url('/assets/fonts/display.woff2') format('woff2');font-display:swap}
@font-face{font-family:FowlBody;src:url('/assets/fonts/body.woff2') format('woff2');font-display:swap}
@font-face{font-family:Arcade;src:url('/assets/fonts/arcade.woff2') format('woff2');font-display:swap}
:root{--play-cream:#fff1d3;--play-ink:#38251f;--play-red:#c92f24;--play-gold:#ffcb4e;--play-dark:#1c100d;color-scheme:light}
*{box-sizing:border-box}
html,body{margin:0;min-width:280px;min-height:100%;background:var(--play-cream);color:var(--play-ink);font-family:FowlBody,Arial,sans-serif}
button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
[hidden]{display:none!important}
.playable-shell{max-width:1440px;margin:0 auto;padding:12px max(12px,env(safe-area-inset-right)) 12px max(12px,env(safe-area-inset-left));display:flex;flex-direction:column;min-height:100svh}
.play-marquee{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;background:var(--play-red);color:var(--play-cream);padding:0 16px;border:2px solid var(--play-ink);border-bottom:0}
.play-stage-label{font:11px Arcade,monospace;line-height:1.6}
.play-button{min-height:44px;padding:10px 18px;border:2px solid var(--play-ink);background:var(--play-cream);box-shadow:0 3px 0 var(--play-ink);font-weight:bold;line-height:1.2}
.play-button:active{transform:translateY(2px);box-shadow:0 1px 0 var(--play-ink)}
.play-button:disabled{opacity:.65;cursor:wait}
.play-button:focus-visible,.play-control:focus-visible,.play-canvas:focus-visible{outline:3px solid var(--play-gold);outline-offset:3px}
.play-primary{background:var(--play-red);color:var(--play-cream)}
.play-pause-button{border:0;box-shadow:none;background:transparent;color:var(--play-cream);padding:8px 10px;min-width:70px;height:40px;min-height:40px}
.play-pause-button[hidden]{display:block!important;visibility:hidden;pointer-events:none}
.play-fullscreen-pause{display:none}
.play-overlay-setting{margin-top:14px;font-size:14px}
.play-frame{position:relative;isolation:isolate;overflow:hidden;min-height:240px;aspect-ratio:16/9;background:#0c9af2;border:2px solid var(--play-ink)}
.play-canvas{display:block;width:100%;height:100%;image-rendering:pixelated;outline-offset:-4px!important;touch-action:none}
.play-overlay{position:absolute;inset:0;display:grid;place-items:center;overflow:auto;padding:24px}
.play-title{width:min(680px,100%);text-align:center;display:flex;flex-direction:column;align-items:center;gap:16px;padding:6px 0 16px}
.play-title-mark{margin:0;display:flex;flex-direction:column;align-items:center;line-height:1;color:var(--play-cream);text-shadow:2px 2px var(--play-red),4px 4px var(--play-ink);font-family:Arcade,monospace;font-weight:400}
.play-title-mark span{font-size:clamp(20px,3.5vw,44px)}
.play-title-mark strong{font-size:clamp(52px,7vw,88px);font-weight:400;margin-top:9px}
.play-tagline{font:clamp(8px,1.1vw,11px)/1.7 Arcade,monospace;color:var(--play-ink);margin:0}
.play-title-copy{font-size:18px;line-height:1.3;max-width:38ch;margin:0}
.play-start{font:12px Arcade,monospace;padding:18px 30px;min-height:54px}
.play-ticket-progress{height:7px;width:210px;border:2px solid var(--play-ink);background:var(--play-cream)}
.play-ticket-progress span{display:block;height:100%;background:var(--play-gold);transform-origin:left;transform:scaleX(0)}
.play-loading-hint{font-size:14px;margin:0}
.play-stage-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;gap:12px;margin-top:4px}
.play-stage-choice{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:66px;padding:12px 8px;font:9px/1.6 Arcade,monospace;background:#fff1d3e8}
.play-stage-choice[aria-pressed=true]{background:var(--play-gold);box-shadow:0 3px 0 var(--play-ink),inset 0 0 0 2px var(--play-cream)}
.play-order-number{font:10px/1.4 Arcade,monospace;margin:0}
.play-menu{width:min(450px,100%);padding:30px;background:var(--play-cream);border:2px solid var(--play-ink);box-shadow:5px 5px 0 #38251f70;text-align:center}
.play-menu-heading{font:clamp(28px,4vw,44px)/1 FowlDisplay,Impact,sans-serif;margin:0 0 16px;color:var(--play-red)}
.play-menu-copy{font-size:17px;line-height:1.5;overflow-wrap:anywhere}
.play-menu-actions{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;margin-top:22px}
.play-receipt{position:relative;border-top:0;border-bottom:0;margin:12px 0;padding:22px 26px}
.play-receipt::before,.play-receipt::after{content:'';position:absolute;left:-2px;right:-2px;height:8px;background:linear-gradient(135deg,transparent 25%,var(--play-cream) 25%) 0 0/12px 12px,linear-gradient(225deg,transparent 25%,var(--play-cream) 25%) 0 0/12px 12px}
.play-receipt::before{top:-8px}.play-receipt::after{bottom:-8px;transform:rotate(180deg)}
.play-receipt-brand{font:18px FowlDisplay,Impact,sans-serif;margin:0 0 10px}
.play-receipt .play-menu-heading{margin:14px 0 5px}
.play-receipt-stage{font:9px/1.5 Arcade,monospace;margin:0 0 16px}
.play-receipt-rows{display:grid;grid-template-columns:1fr auto;gap:10px 16px;margin:0;padding:16px 0;border-top:1px dashed var(--play-ink);border-bottom:1px dashed var(--play-ink);font-size:17px;text-align:left}
.play-receipt-rows dd{margin:0;text-align:right;font:11px/1.5 Arcade,monospace}
.play-receipt-line{font-size:17px;line-height:1.35;margin:16px 0 0}
.play-dialogue-advance{position:absolute;right:12px;bottom:12px;min-height:44px;padding:8px 12px;font-size:14px;background:var(--play-cream)}
.play-touch-deck{display:flex;justify-content:space-between;align-items:center;gap:15px;padding:12px 8px max(12px,env(safe-area-inset-bottom));user-select:none;-webkit-user-select:none;touch-action:none}
.play-directions,.play-actions{display:flex;gap:12px;align-items:center}
.play-control{position:relative;flex:none;width:66px;min-height:57px;border:2px solid var(--play-ink);background:var(--play-cream);box-shadow:0 4px 0 var(--play-ink);display:flex;flex-direction:column;justify-content:center;align-items:center;gap:3px;padding:4px;touch-action:none;user-select:none;-webkit-user-select:none}
.play-control::before{content:'';position:absolute;inset:-6px -5px}
.play-control-jump{width:108px;background:var(--play-gold)}
.play-control-glyph{font:25px/1 Arial,sans-serif}
.play-control-label{font:9px/1 Arcade,monospace}
.play-control-left .play-control-label,.play-control-right .play-control-label{display:none}
.play-control.held{background:var(--play-red);color:var(--play-cream);transform:translateY(2px);box-shadow:0 2px 0 var(--play-ink)}
.play-footer{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 0 0}
.play-keyboard-hints{font:8px/1.9 Arcade,monospace;max-width:52ch;margin:0}
.play-utilities{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.play-utilities .play-button{padding:8px 12px;background:transparent;font-size:14px;border:0;box-shadow:none;text-decoration:underline;text-underline-offset:4px}
.play-sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(pointer:fine) and (min-width:701px){.play-touch-deck{display:none}}
@media(max-width:700px){
 .playable-shell{padding:0 max(0px,env(safe-area-inset-right)) 8px max(0px,env(safe-area-inset-left))}
 .play-frame{aspect-ratio:auto;height:min(64svh,540px);min-height:300px;border-left:0;border-right:0}
 .play-marquee{border-left:0;border-right:0;padding:0 12px}.play-stage-label{font-size:9px}
 .play-overlay{padding:18px 14px}.play-title{gap:14px}.play-title-copy{font-size:16px;max-width:32ch}
 .play-title-mark span{font-size:25px}.play-title-mark strong{font-size:62px}
 .play-stage-choices{gap:8px}.play-stage-choice{font-size:8px;min-height:62px;padding:10px 4px}
 .play-touch-deck{padding:12px 4px max(12px,env(safe-area-inset-bottom));gap:15px}.play-directions,.play-actions{gap:8px}
 .play-control{width:56px}.play-control-jump{width:88px}.play-control::before{inset:-6px -3px}
 .play-footer{justify-content:center;padding-top:2px}.play-keyboard-hints{display:none}
 .play-receipt{padding:18px 22px}.play-receipt-rows{gap:8px;font-size:16px}.play-menu-heading{font-size:36px}
}
@media(max-width:364px){
 .play-touch-deck{gap:8px;padding-left:3px;padding-right:3px}.play-directions,.play-actions{gap:6px}
 .play-control{width:48px;min-height:57px}.play-control-jump{width:70px}.play-control-label{font-size:8px}.play-control::before{inset:-5px -2px}
 .play-title-mark span{font-size:22px}.play-title-mark strong{font-size:52px}.play-title-copy{font-size:15px}.play-title{gap:12px}
 .play-stage-choice{font-size:7px}.play-overlay{padding:12px}.play-menu{padding:20px 14px}
}
@media(max-width:319px){.play-control{width:44px}.play-control-jump{width:60px}.play-directions,.play-actions{gap:4px}.play-control::before{inset:-5px -1px}}
@media(orientation:landscape) and (max-height:600px){
 .playable-shell{padding-top:0;padding-bottom:0;min-height:100svh;max-width:none}
 .play-marquee{min-height:44px}.play-frame{height:calc(100svh - 127px - env(safe-area-inset-bottom));min-height:160px;aspect-ratio:auto;width:100%}
 .play-touch-deck{padding-top:8px;padding-bottom:calc(8px + env(safe-area-inset-bottom))}.play-footer{display:none}
 .play-overlay{padding:12px}.play-title{display:grid;grid-template-columns:1fr 1fr;align-content:center;gap:10px 28px;max-width:790px;padding:0}
 .play-title-mark{grid-row:span 3}.play-title-mark span{font-size:24px}.play-title-mark strong{font-size:60px}
 .play-tagline{font-size:8px}.play-title-copy{font-size:15px}.play-start{padding:12px 20px;min-height:44px;font-size:10px}
 .play-stage-choices{grid-column:1/-1;margin:0}.play-stage-choice{flex-direction:row;gap:10px;min-height:44px;padding:7px;font-size:8px}
 .play-menu{padding:16px;max-width:640px}.play-receipt{display:grid;grid-template-columns:1fr 1fr;gap:8px 22px;text-align:left;margin:8px 0}
 .play-receipt-brand{margin:0}.play-receipt .play-order-number{grid-column:1}.play-receipt .play-menu-heading{grid-column:1;margin:0;font-size:32px}.play-receipt-stage{grid-column:1;margin:0}
 .play-receipt-rows{grid-column:2;grid-row:1/5;padding:6px 0;gap:4px 12px;font-size:14px}.play-receipt-rows dd{font-size:9px}
 .play-receipt-line{grid-column:1/-1;font-size:14px;margin:0}.play-receipt .play-menu-actions{grid-column:1/-1;margin-top:4px}
 .playable-shell[data-overlay-controls=true] .play-frame{height:calc(100svh - 44px);min-height:0;border:0}
 .playable-shell[data-overlay-controls=true] .play-touch-deck{position:absolute;z-index:3;inset:auto 0 0;opacity:.4;padding:8px max(12px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));pointer-events:none}
 .playable-shell[data-overlay-controls=true] .play-control{pointer-events:auto;width:56px;min-height:56px}
 .playable-shell[data-overlay-controls=true] .play-control-jump{width:88px}
 .playable-shell[data-overlay-controls=true] .play-dialogue-advance{z-index:4;bottom:82px}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

/* Portrait tablets use the height left after reachable controls and utilities.
   The phone console keeps its existing layout below 701 CSS pixels. */
@media(min-width:701px) and (orientation:portrait){
 .touch-device .playable-shell{height:100svh;min-height:0;padding-top:8px;padding-bottom:8px}
 .touch-device .play-marquee{height:44px;min-height:44px;flex:none}
 .touch-device .play-frame{height:0;min-height:55svh;flex:1;aspect-ratio:auto}
 .touch-device .play-touch-deck{height:100px;flex:none}
 .touch-device .play-footer{flex:none;min-height:44px}
 .touch-device .play-keyboard-hints{display:none}
}

/* Desktop budgets height first. Touch/cropped phone layouts remain separate.
   Utilities share the 44px header instead of adding a scrolling footer. */
@media(pointer:fine) and (min-width:701px) and (min-height:601px){
 html,body{height:100%;overflow:hidden}
 .playable-shell{--desktop-frame-width:calc(100vw - 24px);position:relative;max-width:none;height:100svh;min-height:0;padding:8px 12px;align-items:center;overflow:hidden}
 .play-marquee,.play-frame{width:var(--desktop-frame-width);flex:none}
 .play-marquee{height:44px;min-height:44px}
 .play-pause-button{height:40px;min-height:40px;padding:8px 10px}
 .play-frame{height:calc(100svh - 60px);min-height:0;aspect-ratio:auto;border:0;box-shadow:inset 0 0 0 2px var(--play-ink)}
 .play-footer{position:absolute;z-index:2;top:8px;right:calc((100% - var(--desktop-frame-width))/2 + 84px);height:44px;padding:0}
 .play-keyboard-hints{display:none}
 .play-utilities{gap:4px}
 .play-utilities .play-button{color:var(--play-cream);height:40px;min-height:40px;padding:6px 10px}
}
#app:fullscreen{background:var(--play-cream)}
#app:fullscreen .play-marquee,#app:fullscreen .play-footer{display:none}
#app:fullscreen .playable-shell{padding:0;max-width:none;min-height:100dvh;height:100dvh}
#app:fullscreen .play-frame{width:100%;height:100dvh;max-height:none;border:0}
.touch-device #app:fullscreen .playable-shell[data-controls-placement=outside] .play-frame{height:0;min-height:0;flex:1;aspect-ratio:auto}
.touch-device #app:fullscreen .play-touch-deck{flex:none}
#app:fullscreen .playable-shell[data-screen=playing] .play-fullscreen-pause{display:block;position:absolute;z-index:4;top:8px;left:50%;transform:translateX(-50%);min-height:44px;padding:8px 12px;opacity:.65}
@media(orientation:landscape) and (max-height:600px){#app:fullscreen .playable-shell[data-screen=playing] .play-fullscreen-pause{top:48px}}

/* Opening controls sit on the road; the scene and wordmark are canvas layers. */
.playable-shell[data-screen=title] .play-overlay{overflow:hidden;pointer-events:none}
.playable-shell[data-screen=title] .play-title{position:absolute;inset:0;width:100%;max-width:none;display:block;padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom)}
.play-title .play-start{position:absolute;left:45%;top:82%;transform:translate(-50%,-50%);pointer-events:auto;min-height:44px;font-size:clamp(8px,1.1vw,12px);padding:10px 16px}
.play-title .play-stage-choices{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);width:min(680px,94%);pointer-events:auto;display:grid}
.play-title .play-start{top:72%}
.playable-shell[data-ready=true] .play-start{animation:start-rise .12s steps(3,end),start-blink 1s steps(1,end) infinite;background:transparent;border-color:transparent;box-shadow:none;color:var(--play-cream);text-shadow:2px 2px var(--play-ink)}
.touch-device .playable-shell[data-ready=true] .play-start{animation:none;background:var(--play-red);border:2px solid var(--play-ink);box-shadow:0 3px var(--play-ink);clip-path:polygon(5% 0,95% 0,100% 10%,100% 90%,95% 100%,5% 100%,0 90%,0 10%)}
.play-prologue-skip{position:absolute;z-index:4;top:max(12px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right));min-height:44px}
.play-entry-prompt{display:block;font:16px Arcade,monospace}
.play-entry-name{display:block;width:100%;margin:18px 0 8px;padding:12px 6px;border:0;border-bottom:3px solid var(--play-ink);background:transparent;color:var(--play-ink);font:22px Arcade,monospace;text-align:center;letter-spacing:3px;text-transform:uppercase}
.play-entry-hint{font-size:13px;line-height:1.4}
.playable-shell[data-screen=entry] .play-menu{width:min(500px,100%);padding:22px 12px}
.playable-shell[data-screen=entry] .play-menu>.play-button{margin:8px 4px}
.play-entry-keyboard{display:none}
.touch-device .play-entry-keyboard{display:block;margin:10px -6px}
.play-entry-key-row{display:flex;justify-content:center;gap:2px;margin-bottom:6px}
.play-entry-keyboard .play-button{min-width:0;min-height:44px;flex:1;max-width:40px;padding:4px 0;font-size:12px}
.play-entry-keyboard>.play-button{max-width:none;width:64px}
@keyframes start-blink{0%,100%{opacity:1}50%{opacity:0}}
@media(prefers-reduced-motion:reduce){.playable-shell[data-ready=true] .play-start{animation:none}}

.playable-shell[data-reduced-motion=true] .play-start{animation:none}
.play-receipt-mark{display:block;width:96px;height:auto;image-rendering:pixelated;margin:0 auto 10px}

@keyframes start-rise{from{translate:0 4px}to{translate:0 0}}

/* Portrait opening has a scene above a separate cream control area. */
@media(max-width:700px) and (orientation:portrait){
 .playable-shell[data-screen=title] .play-frame{height:calc(100svh - 112px);min-height:600px;max-height:none;background:var(--play-cream)}
 .playable-shell[data-screen=title] .play-start{top:calc(64% + 38px);left:40%;font-size:12px;background:var(--play-red);border:2px solid var(--play-ink);color:var(--play-cream);animation:none;text-shadow:none}
 .playable-shell[data-screen=title] .play-stage-choices{bottom:26px;width:94%}
 .playable-shell[data-screen=title] .play-overlay{padding:0}
}

/* Canvas layout supplies the measured control positions. */
.playable-shell[data-screen=title] .play-title .play-start{top:30%;left:50%;font-size:16px;width:max-content;max-width:calc(100% - 16px);white-space:nowrap;background:var(--play-cream);border:2px solid var(--play-ink);border-radius:0;box-shadow:0 3px 0 var(--play-ink);color:var(--play-ink);text-shadow:none;clip-path:none;animation:none;opacity:1}
.playable-shell[data-screen=title] .play-title .play-stage-choices{bottom:auto;margin:0;z-index:2;grid-template-columns:repeat(2,minmax(0,1fr));width:min(448px,94%)}
.playable-shell[data-screen=title] .play-title[data-compact=true] .play-stage-choices{width:min(448px,calc(100% - var(--title-start-width,200px) - 48px));gap:8px}
.playable-shell[data-screen=title] .play-title[data-compact=true] .play-stage-choice{flex-direction:column;gap:2px;padding:4px;min-height:44px;font-size:7px;line-height:1.2}
.play-stage-choice:disabled{opacity:.65;cursor:not-allowed}
@media(max-width:700px) and (orientation:portrait){.playable-shell[data-screen=title] .play-title .play-start{top:18%}}

/* shell.json supplies every art dimension in CSS px. This selector is enabled
   only by portrait touch layout; hidden console nodes have no desktop footprint. */
.play-console-lid{position:relative;display:flex;flex-direction:column;flex:none;height:var(--console-lid-height);min-height:0;border:0 solid transparent;border-image-repeat:stretch;border-image-width:var(--console-lid-top) var(--console-lid-right) var(--console-lid-bottom) var(--console-lid-left);padding:var(--console-lid-top) var(--console-lid-right) var(--console-lid-bottom) var(--console-lid-left);image-rendering:auto}
.play-console-wordmark{position:absolute;left:50%;transform:translateX(-50%);pointer-events:none}
.play-console-deck{position:relative;flex:none;height:var(--console-deck-height);background:#efd7ad;touch-action:none;user-select:none;-webkit-user-select:none}
.play-console-band{position:absolute;width:100%;background-size:100% 100%;background-repeat:no-repeat;image-rendering:auto}
.play-console-sprite,.play-console-hit{position:absolute;display:block}
.play-console-sprite,.play-console-wordmark{image-rendering:auto}
.play-console-sprite{pointer-events:none}
.play-console-hit{margin:0;padding:0;min-width:0;min-height:0;border:0;background:transparent;box-shadow:none;touch-action:none;-webkit-user-select:none;user-select:none}
.play-console-hit:focus-visible{outline:3px solid var(--play-gold);outline-offset:-3px}
.play-console-band:has([data-control=left].held) .play-console-sprite-dpad{transform:translate(-2px,0) scale(.96);filter:brightness(.82)}
.play-console-band:has([data-control=right].held) .play-console-sprite-dpad{transform:translate(2px,0) scale(.96);filter:brightness(.82)}
.play-console-band:has([data-control=down].held) .play-console-sprite-dpad{transform:translateY(2px) scale(.96);filter:brightness(.82)}
.play-console-band:has([data-control=jump].held) .play-console-sprite-a,
.play-console-band:has([data-control=dash].held) .play-console-sprite-b,
.play-console-band:has([data-action=sound].held) .play-console-sprite-select,
.play-console-band:has([data-action=pause].held) .play-console-sprite-start{transform:translateY(2px) scale(.96);filter:brightness(.82)}
@media(max-width:700px) and (orientation:portrait){
 html.touch-device:has(.playable-shell[data-console=true]),.touch-device body:has(.playable-shell[data-console=true]),.touch-device #app:has(.playable-shell[data-console=true]){background:var(--play-dark)}
 .touch-device .playable-shell[data-console=true],.touch-device #app:fullscreen .playable-shell[data-console=true]{width:var(--console-width);max-width:100%;height:100svh;min-height:0;margin:0 auto;padding:0 0 env(safe-area-inset-bottom);background:var(--play-dark)}
 .touch-device .playable-shell[data-console=true] .play-frame,.touch-device #app:fullscreen .playable-shell[data-console=true] .play-frame{width:100%;height:0;min-height:0;max-height:none;flex:1;aspect-ratio:auto;border:0;box-shadow:none;border-radius:var(--console-radius)}
 .touch-device .playable-shell[data-console=true] .play-overlay{overflow:auto;place-items:safe center}
 .touch-device .playable-shell[data-console=true] .play-title{padding:0}
 .touch-device .playable-shell[data-console=true][data-screen=title] .play-title .play-start{width:var(--console-start-width);height:var(--console-start-height);min-height:44px;font-size:12px;padding:4px}
 .touch-device .playable-shell[data-console=true][data-screen=title] .play-title .play-stage-choices{width:var(--console-stages-width);height:var(--console-stages-height);grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,44px);gap:8px}
 .touch-device .playable-shell[data-console=true][data-screen=title] .play-title .play-stage-choice{min-height:44px;flex-direction:column;gap:2px;padding:4px;font-size:7px;line-height:1.2;box-shadow:none}
 .touch-device .playable-shell[data-console=true] .play-fullscreen-pause{display:none!important}
 .touch-device .playable-shell[data-console=true][data-screen=entry] .play-overlay{padding:6px}
 .touch-device .playable-shell[data-console=true] .play-console-entry-compact{display:grid;grid-template-columns:44px 1fr 1fr;gap:8px;width:100%;padding:8px 6px;box-shadow:none}
 .play-console-entry-compact .play-entry-prompt,.play-console-entry-compact .play-entry-name,.play-console-entry-compact .play-entry-hint,.play-console-entry-compact .play-entry-key-row{grid-column:1/-1;margin:0}
 .play-console-entry-compact .play-entry-prompt{font-size:12px;line-height:16px}
 .play-console-entry-compact .play-entry-name{height:30px;padding:2px 4px;font-size:18px}
 .play-console-entry-compact .play-entry-hint{font-size:10px;line-height:12px}
 .touch-device .play-console-entry-compact .play-entry-keyboard{display:contents}
 .play-console-entry-compact .play-entry-key-row{gap:2px;height:36px}
 .play-console-entry-compact .play-entry-key-row .play-button{position:relative;min-height:36px;height:36px;padding:0;font-size:12px;box-shadow:none}
 .play-console-entry-compact .play-entry-key-row .play-button::before{content:'';position:absolute;top:-4px;bottom:-4px;left:50%;transform:translateX(-50%);width:max(100%,44px)}
 .playable-shell[data-console=true][data-screen=entry] .play-console-entry-compact>.play-button,.play-console-entry-compact .play-entry-keyboard>.play-button{width:100%;min-width:0;min-height:44px;margin:0;padding:4px 2px;font-size:11px;line-height:14px;box-shadow:none}
}

/* Reports stay inside the phone lid and scroll independently of shell controls. */
.play-menu { max-height: 100%; overflow-y: auto; }
/* Round A #6 (24 Sep 2026): the results receipt and pause menu fit the game frame with no scrollbar.
   The frame, not the window, is the limit (desktop is always 540 px tall), so size against the overlay. */
.playable-shell:is([data-screen=results],[data-screen=pause]) .play-overlay{container-type:size}
/* The torn-paper edges hang 8 px outside the receipt: a scrolling receipt clipped them and counted them as overflow.
   The overlay stays the scroll fallback, and the sticky action row keeps RETRY on screen even there. */
.play-menu.play-receipt{overflow:visible}
.play-receipt .play-menu-actions{position:sticky;bottom:0;z-index:1;background:var(--play-cream)}
@media not ((orientation:landscape) and (max-height:600px)){
 @container (max-height:640px){
  .play-receipt{padding:12px 20px}
  .play-receipt-mark{width:80px;margin-bottom:4px}
  .play-receipt-name{margin:0;font-size:14px}
  .play-receipt .play-menu-heading{margin:6px 0 2px;font-size:34px}
  .play-receipt-stage{margin:0 0 8px}
  .play-receipt-stages{margin:0 0 6px;font:9px/1.5 Arcade,monospace}
  .play-receipt-rows{grid-template-columns:1fr auto 1fr auto;gap:6px 12px;padding:8px 0;font-size:14px}
  .play-receipt-line{font-size:14px;margin:8px 0 0}
  .play-receipt .play-menu-actions{margin-top:8px;padding-top:4px}
  .play-menu:not(.play-receipt){padding:16px}
  .play-menu:not(.play-receipt) .play-menu-heading{margin-bottom:10px;font-size:32px}
  .play-menu:not(.play-receipt) .play-menu-actions{gap:8px;margin-top:8px}
 }
 @container (max-height:460px){
  .play-receipt{padding:8px 12px;margin:4px 0}
  .play-receipt-mark{display:none}
  .play-receipt-name,.play-receipt-line{font-size:12px}
  .play-receipt .play-menu-heading{font-size:26px}
  .play-receipt-rows{grid-template-columns:1fr auto;gap:3px 10px;padding:6px 0;font-size:12px}
  .play-receipt-rows dd{font-size:9px}
  .play-receipt .play-menu-actions{margin-top:6px}
  .play-menu:not(.play-receipt){padding:10px}
  .play-menu:not(.play-receipt) .play-menu-heading{font-size:26px;margin-bottom:6px}
  .play-menu:not(.play-receipt) .play-menu-actions{gap:6px;margin-top:6px}
  .play-menu .play-button{min-height:40px;padding:6px 12px;font-size:14px}
 }
 @container (max-height:340px){.play-receipt-stage,.play-receipt-stages,.play-receipt-line{display:none}.play-receipt .play-menu-heading{font-size:22px;margin:2px 0 4px}
  /* WebKit sets these labels wider than Chrome and wraps one more row at 320 px. */
  .play-menu:not(.play-receipt) .play-menu-heading{font-size:22px;margin-bottom:4px}
  .play-menu:not(.play-receipt) .play-menu-actions{gap:4px;margin-top:4px}
  .play-menu:not(.play-receipt) .play-button{min-height:36px;padding:4px 8px;font-size:13px}}
}
@media (orientation:landscape) and (max-height:600px){
 @container (max-height:420px){.play-receipt-mark{width:56px;margin:0}.play-receipt-name{margin:0;font-size:14px}.play-receipt-rows{gap:2px 12px}.play-receipt{margin:2px 0}.play-receipt-stages{margin:0;font:9px/1.5 Arcade,monospace}}
 @container (max-height:420px){
  .play-menu:not(.play-receipt){width:min(720px,100%);max-width:none;padding:10px 14px}
  .play-menu:not(.play-receipt) .play-menu-heading{font-size:26px;margin-bottom:6px}
  .play-menu:not(.play-receipt) .play-menu-actions{gap:6px;margin-top:6px}
 }
}
.play-bug-report { display: flex; flex-direction: column; gap: 10px; text-align: left; box-sizing: border-box; }
.play-bug-report img { display: block; max-width: 100%; max-height: 140px; margin: auto; object-fit: contain; }
.play-bug-report img.play-bug-enlarged { max-height: none; width: 100%; }
.play-bug-report code { overflow-wrap: anywhere; font: 12px monospace; user-select: text; }
.play-bug-report label { display: block; font-size: 14px; }
.play-bug-report input[type=text] { display: block; width: 100%; box-sizing: border-box; font: 16px sans-serif; }
.play-bug-report button { min-height: 44px; flex-shrink: 0; }
.play-bug-report input[type=checkbox] { width: 24px; height: 24px; vertical-align: middle; }

/* Fight chrome: avoid plain flat boxes, small centred portraits and thin sans-serif type. */
.play-fight-vs{position:absolute;left:0;right:0;top:20%;height:60%;max-height:340px;z-index:8;display:grid;box-sizing:border-box;grid-template-columns:1fr 64px 1fr;grid-template-rows:100%;align-items:end;text-align:center;background:repeating-linear-gradient(105deg,#0000 0 14px,#0000001a 14px 16px),linear-gradient(105deg,#d9362a 0 49%,#ffcb4e 49% 51%,#241008 51% 100%);border-block:6px solid #ffcb4e;box-shadow:0 8px 0 #180c09,0 -4px 0 #c05b19;color:#fff1d3;font:clamp(12px,2vw,22px) FowlDisplay,Arcade,monospace;pointer-events:none;overflow:hidden}
.play-fight-vs h2{position:absolute;left:0;right:0;top:5%;z-index:2;margin:0 auto;width:max-content;padding:0 .35em;background:#180c09;border:3px solid #ffcb4e;box-shadow:4px 4px #0008;color:#ffcb4e;font:clamp(26px,5vw,58px) FowlDisplay,Arcade,monospace;text-shadow:3px 3px #8b2c13,-2px -2px #180c09,2px -2px #180c09,-2px 2px #180c09}
.play-fight-vs>div{height:100%;min-width:0;display:flex;flex-direction:column;justify-content:flex-end;align-items:center}.play-fight-vs canvas{display:block;height:var(--vs-portrait);width:var(--vs-portrait);aspect-ratio:1;object-fit:contain;filter:drop-shadow(6px 6px #120907)}
.play-fight-vs strong{display:block;margin:-6px 0 8%;padding:4px 14px;background:#180c09;border:3px solid #ffcb4e;color:#fff1d3;letter-spacing:.06em;position:relative;z-index:1}.play-fight-vs>b{align-self:center;font:clamp(32px,7vw,80px) FowlDisplay,Arcade,monospace;color:#fff1d3;text-shadow:4px 4px #b33716,-2px -2px #180c09,2px -2px #180c09,-2px 2px #180c09}
.play-fight-bar{position:absolute;top:5px;left:50%;transform:translateX(-50%);z-index:9;display:flex;align-items:center;gap:12px;padding:6px 12px;background:linear-gradient(#563322,#25130e);color:#ffcb4e;border:3px solid #eab943;box-shadow:0 4px 0 #170b08;font:16px FowlDisplay,Arcade,monospace;white-space:nowrap;pointer-events:none}
.play-fight-pips{display:flex;gap:6px}.play-fight-pips i{position:relative;box-sizing:content-box;width:24px;height:24px;border:3px solid #170b08;outline:1px solid #ce8f26;background:#55321c;box-shadow:inset 0 3px #ffffff28}
.play-fight-pips i[data-full="true"]{background:#ffcb4e}.play-fight-pips i[data-cracked="true"]:after{content:'';position:absolute;inset:2px 6px;background:#160b08;clip-path:polygon(55% 0,25% 43%,70% 52%,20% 100%,100% 52%,55% 37%,100% 0)}
.play-fight-banner{position:absolute;left:0;right:0;top:35%;z-index:8;padding:24px 8px;text-align:center;background:linear-gradient(110deg,#1d100df5,#613321f5,#1d100df5);border-block:5px solid #ffcb4e;box-shadow:0 6px #1b0d08;color:#ffcb4e;font:clamp(24px,4vw,44px) FowlDisplay,Arcade,monospace;text-shadow:3px 3px #782611;pointer-events:none}
.play-fight-vs[hidden],.play-fight-bar[hidden],.play-fight-banner[hidden]{display:none}
@media(max-width:600px){.play-fight-bar{flex-direction:column;font-size:13px;gap:4px;padding:3px 10px}.play-fight-vs{top:23%;height:48%}.play-fight-vs strong{font-size:12px}}
