/* CSS-pixel sized targets remain usable in both orientations, including notches. */
#touch-ui[hidden],#touch-controls[hidden],#touch-modal[hidden]{display:none!important}
#touch-ui{position:absolute;inset:0;pointer-events:none;user-select:none;-webkit-user-select:none;color:#fff2d5;font:14px system-ui}
#touch-ui button{pointer-events:auto;min-height:48px;min-width:52px;border:1px solid #dcc49388;border-radius:16px;background:#102126dd;color:#fff2d5;touch-action:none;-webkit-tap-highlight-color:transparent}
#touch-ui button:active,#touch-ui button.held,#touch-ui button[aria-pressed=true]{background:#b58a3b;color:#09171b}
#touch-hud{position:absolute;top:max(8px,env(safe-area-inset-top));left:max(12px,env(safe-area-inset-left));right:max(12px,env(safe-area-inset-right));display:flex;align-items:center;gap:12px;text-shadow:0 2px 3px #000}
#touch-status{flex:1;text-align:right}#touch-hud button{min-height:44px}
#touch-hint{position:absolute;top:68px;left:12px;right:12px;text-align:center;text-shadow:0 2px 3px #000}
#joystick{position:absolute;left:max(24px,env(safe-area-inset-left));bottom:max(28px,env(safe-area-inset-bottom));width:132px;height:132px;border-radius:50%;border:2px solid #e0c38a88;background:#0b1a2199;pointer-events:auto;touch-action:none;box-shadow:inset 0 0 24px #0005}
#stick{position:absolute;width:56px;height:56px;left:36px;top:36px;border:2px solid #e8c789;border-radius:50%;background:#d0ad6699;pointer-events:none}#joystick small{position:absolute;bottom:8px;width:100%;text-align:center;color:#fff0c9;font-size:12px;pointer-events:none}
#actions{position:absolute;right:max(18px,env(safe-area-inset-right));bottom:max(26px,env(safe-area-inset-bottom));display:grid;grid-template-columns:64px 64px;gap:10px}#actions button{height:60px;border-radius:50%}#interact{border-color:#f9ce71!important}
#energy{position:absolute;bottom:8px;left:28px;font-size:11px}#energy meter{width:88px;height:10px;margin-left:6px}
#touch-modal{position:absolute;inset:0;background:#071419f2;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:24px;text-align:center;pointer-events:auto}#touch-modal h2{font-size:28px;margin:8px}#touch-modal p{max-width:430px;font-size:15px;line-height:1.8;white-space:pre-line}#touch-modal button{padding:12px 32px;background:#d6b16c;color:#102126}
body.touch-playing{height:100dvh;overflow:hidden}body.touch-playing header,body.touch-playing footer{display:none}body.touch-playing main{height:100%;touch-action:none}
@media(max-height:450px){#intro{padding:12px 24px!important;overflow:auto}.copy h1{font-size:30px;margin:8px 0}.copy p{margin:6px 0;font-size:14px}.copy small{font-size:12px}#play{margin:4px 0!important;padding:10px 20px!important}#touch-hint{top:52px;font-size:12px}}