Scaling down was not enough
A desktop layout can place the current objective beside the room, but that card leaves too little investigation space on a phone. It also remained after the objective was understood. A language switch that followed the page while scrolling covered clues in long portrait layouts. Mobile required a different order, not a smaller desktop.
The objective moved into an on-demand top control and the permanent desktop assistance card was removed. Language selection now appears only at the top-right of the initial player setup card. Once play begins, it no longer intrudes on the room, and each choice consistently links to the matching game and official content URLs.
Hit areas larger than objects
A key or switch cannot use its exact visible size as a touch target. Objects receive transparent minimum hit areas adjusted against the image ratio without overlapping nearby clues. Empty space uses a click cue and meaningful objects use a tap cue, immediately confirming whether a selection was recognized.
Applying a generic cue everywhere created doubles in password and wiring puzzles. Generic sound now belongs only to investigation and popups without a meaningful effect. Number keys, doors, tools, and wires each own one specific response.
Inventory and popups
Selecting inventory opens an image, description, and Use action when available. Open, close, use, and popup controls share one short interface cue. Consumed objects disappear, while an invalid destination explains the problem without removing the item.
Popups remain within the phone viewport and long copy can be read internally. Close controls use generous hit targets, and background dismissal stops propagation so it cannot activate the puzzle underneath. Death and stage-clear screens cannot be dismissed by an accidental background touch.
Portrait scroll and safe areas
Mobile browser chrome changes height during scroll. Fixed pixel layouts can hide inventory and exit buttons. We use dynamic viewport sizing and bottom safe areas, while allowing long content to scroll naturally. Images are checked again for accidental horizontal overflow.
Review covers a small phone, a typical mobile width, tablet, and desktop. We complete setup, all five stages, death, and result sharing while checking language, audio, inventory, popups, and bottom controls.
Current baseline
The goal is not to show every piece of information at once but to keep information from blocking action. Targets must be touchable, one touch must produce one response, and visible state must match saved state. New stages are reviewed first in a portrait mobile route before desktop assistance is added.
