/* Keep the approved compositions whole, including on a wider screen. */
#world[data-chapter="20"],#world[data-chapter="21"]{background:#08070e}
#world[data-chapter="20"] .scene-still img,#world[data-chapter="21"] .scene-still img{object-fit:contain}
.chapter-game-dialog{position:fixed;inset:0;width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;padding:0;border:0;background:#100b19;color:#efd9e7;overflow:hidden;overscroll-behavior:none;box-sizing:border-box;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.chapter-game-dialog::backdrop{background:#08070e}
#chapterGameRoot{display:block;width:100%;height:100%;min-height:100%;box-sizing:border-box;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
#chapterGameRoot *,#chapterGameRoot *::before,#chapterGameRoot *::after{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
#chapterGameRoot h2{font-family:LittlePixel,monospace;font-weight:400}
#chapterGameRoot .secondary-button{min-height:44px;padding:10px 14px;border:1px solid #73566f;background:#271a31;color:#efd9e7}
#episodeCinema .episode-missing{left:var(--chapter-talk-center,50%);width:var(--chapter-talk-width,min(84vw,340px))}
.chapter-speech{position:absolute;inset:0;z-index:3;pointer-events:none}
.chapter-speech[hidden]{display:none!important}
/* Local speech and Alex's thought are actor-anchored captions, not messages. */
.chapter-speech p{position:absolute;display:block;box-sizing:border-box;margin:0;padding:0 3px;background:none;border:0;box-shadow:none;color:#f3ddbd;font:12px/17px 'Courier New',monospace;text-align:center;text-wrap:balance;text-shadow:0 1px 2px #08060e,1px 0 2px #08060e,-1px 0 2px #08060e}
.chapter-speech[data-speaker="Amber"] p{color:#f9dbec}
.chapter-speech[data-speaker="Alex"] p{color:#e4edf4;text-align:right}
.chapter-speech .message-tail{white-space:nowrap}
.chapter-speech p>.caption-line{display:block;white-space:nowrap;animation:story-appear .14s ease-out both}

/* One portrait game frame and one unobstructed control bar. Insets are resolved
   by the shared portrait host, so Canvas and HTML reserve exactly the same area. */
#chapterGameRoot{--game-top:calc(var(--safe-top,0px) + 12px);--game-side:16px}
#chapterGameRoot .chapter-game-sound{position:absolute;z-index:6;right:var(--game-side);top:var(--game-top);width:40px;height:40px;min-height:40px;padding:0;display:grid;place-items:center;pointer-events:auto;touch-action:manipulation;animation:none;transition:none}
#chapterGameRoot .feed-close,#chapterGameRoot .scooter-delivery-close{left:var(--game-side);right:auto;top:var(--game-top);z-index:6;width:44px;height:40px;min-height:40px;background:transparent;border:0;color:#c7b2c8}
#chapterGameRoot .feed-heading{height:calc(var(--game-top) + 48px);padding:calc(var(--game-top) + 6px) 60px 12px}
#chapterGameRoot.feed-laifu h2{font-size:clamp(14px,calc(var(--app-width,393px)*.056),26px);line-height:1.2}
#chapterGameRoot .feed-meter{top:calc(var(--game-top) + 50px)}
#chapterGameRoot .feed-instructions{top:calc(var(--game-top) + 81px);font-size:clamp(9px,calc(var(--app-width,393px)*.0255),10px)}
#chapterGameRoot .feed-controls{bottom:calc(12px + var(--safe-bottom,0px));left:12px;right:12px;grid-template-columns:minmax(44px,1fr) 72px minmax(44px,1fr);gap:8px;height:58px}
#chapterGameRoot .feed-status{bottom:calc(82px + var(--safe-bottom,0px))}
#chapterGameRoot .feed-skip{top:auto;bottom:calc(12px + var(--safe-bottom,0px));left:50%;transform:translateX(-50%);min-height:44px}
#chapterGameRoot .feed-overlay{padding:calc(var(--game-top) + 95px) 20px calc(72px + var(--safe-bottom,0px))}
#chapterGameRoot .feed-ending{top:32%;width:min(86%,340px);padding:16px 12px}
#chapterGameRoot .feed-result{font-size:clamp(11px,calc(var(--app-width,393px)*.0356),14px)}
#chapterGameRoot .feed-result .feed-ending-line{white-space:normal;text-wrap:balance}
#chapterGameRoot .scooter-delivery-pause{top:var(--game-top);left:50%;right:auto;transform:translateX(-50%);width:78px;height:40px;min-height:40px}
#chapterGameRoot .scooter-delivery-overlay{inset:var(--scooter-hud-bottom,182px) 0 0;padding:16px 18px calc(78px + var(--safe-bottom,0px));gap:14px}
#chapterGameRoot .scooter-delivery-overlay-copy{font-size:clamp(12px,calc(var(--app-width,393px)*.0432),17px);line-height:1.55}
#chapterGameRoot .scooter-delivery-overlay-help{font-size:clamp(10px,calc(var(--app-width,393px)*.0305),12px)}
#chapterGameRoot .scooter-delivery-controls{bottom:calc(18px + var(--safe-bottom,0px));left:12px;right:12px;grid-template-columns:clamp(44px,calc(var(--app-width,393px)*.168),66px) clamp(44px,calc(var(--app-width,393px)*.168),66px)}
#chapterGameRoot .scooter-delivery-controls button{min-height:44px}
#chapterGameRoot .scooter-delivery-controls .scooter-delivery-left,#chapterGameRoot .scooter-delivery-controls .scooter-delivery-right{height:clamp(44px,calc(var(--app-width,393px)*.168),66px)}
#chapterGameRoot .scooter-delivery-skip{bottom:var(--safe-bottom,0px);max-width:84px}
#chapterGameRoot .scooter-delivery-ending{top:calc(var(--scooter-hud-bottom,182px) + 12px);left:16px;right:16px;padding:12px}
#chapterGameRoot .primary-button{font-size:clamp(10px,calc(var(--app-width,393px)*.033),13px);padding:10px 12px}
#chapterGameRoot.scooter-delivery .chapter-game-sound{background:#07111ecf;border-color:#608aac55;color:#bed7e8}
#chapterGameRoot.scooter-delivery .chapter-game-sound[aria-pressed=true]{color:#f1b47a;border-color:#e7ac7955}
