#computer-pane{margin:12px auto;width:calc(100% - 16px);max-width:1400px;padding:12px;overflow:hidden;background:#fff;color:#111;border-radius:12px}
#computer-screen{width:100%;height:calc(100dvh - 250px);min-height:220px;background:#111;overflow:hidden;pointer-events:none;touch-action:pinch-zoom}
#computer-screen.controlling{pointer-events:auto;touch-action:none;outline:3px solid #f59e0b;cursor:crosshair}
#computer-screen.zoomed{overflow:auto;touch-action:pan-x pan-y}
#computer-banner{background:#fef3c7;color:#92400e;border:1px solid #fcd34d;border-radius:10px;padding:6px 10px;margin:6px 0;font-weight:600}
#computer-input{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
#computer-input input{flex:1 1 100%;min-width:0;min-height:44px;font-size:16px}
#computer-input button{flex:1 1 0}
#computer-input button,.computer-actions button{min-height:44px;min-width:44px}
.computer-actions{position:sticky;bottom:0;display:flex;gap:8px;margin-top:8px;padding-bottom:env(safe-area-inset-bottom)}
.computer-actions button{flex:1;font-weight:600}
.computer-actions button[aria-pressed=true]{outline:2px solid var(--acc)}
[data-computer-done]{background:#16a34a;color:#fff}
#computer-screen canvas{max-width:100%}
#computer-stage{position:relative}
#computer-fullscreen{position:absolute;top:6px;right:6px;z-index:3;min-width:44px;min-height:44px;padding:0;font-size:22px;line-height:1;background:rgba(17,17,17,.65);color:#fff;border-color:rgba(255,255,255,.35)}
/* Fullscreen: the pane covers the whole Mini App viewport; actions and input stay reachable. */
#computer-pane.fullscreen{position:fixed;top:0;left:0;z-index:100;margin:0;width:100vw;height:100dvh;max-width:none;border-radius:0;border:0;background:#000;color:#fff;display:flex;flex-direction:column;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}
#computer-pane.fullscreen>[data-computer-close],#computer-pane.fullscreen>#computer-state{display:none}
#computer-pane.fullscreen #computer-stage{flex:1 1 auto;min-height:0}
#computer-pane.fullscreen #computer-screen{height:100%;min-height:0}
#computer-pane.fullscreen .computer-actions{margin-top:4px;padding-bottom:0}
#computer-pane.fullscreen #computer-input{margin-top:4px}
/* Portrait phone without an orientation lock: show the desktop landscape by rotating the pane 90°.
   Only in view mode — control mode never rotates, so pointer/touch coordinates stay exact. */
#computer-pane.fullscreen.rotated{width:100dvh;height:100vw;transform-origin:top left;transform:translateX(100vw) rotate(90deg)}
[hidden]{display:none!important}
