# Cursor prompt — unique mobile portrait shell (new file) Do not edit `STUDIO2-DISPLAY-CURSOR-PROMPT.md`, `STUDIO2-DISPLAY-LAYOUT-SPEC.md`, `STUDIO2-LORA-DIALS-PROMPT.md`, or `STUDIO2-VIEWER-FIT-PROMPT.md`. Branch: **`studio-2`**. Push `origin/studio-2` only. Chrome only. Same `form`, queue, generate, locks, LoRAs, library. No graph/runner/extend/YuE2 changes. Desktop 3-column bench is **done**. Do not restyle desktop to make mobile work. Do not stack the three columns in a tall scroll and call it mobile. Breakpoint: `(max-width: 767px)` **and** coarse pointer. Use a **separate mobile shell** (`Studio2Mobile.vue` or `Bench` template `v-if="isMobile"`) that binds the **same** state as desktop Bench. Reference mock: `studio2-display-ux/mobile-mock.html` (open on a 390×844 viewport). --- ## Why unique Portrait cannot show 260 | stage | 280. If you shrink that grid you lose Generate, LoRAs, and the still. Mobile is a **viewer-first phone app** with sheets for the inspector and the queue. Every desktop control still exists. It is just not on screen at once. --- ## Chrome map (portrait) ``` ┌ status / 48px header ─────────────────────────────────────┐ │ AIGen Inbox ▾ GPU ☰ queue(n) │ ├ task chips (scroll-x) Generate Edit … Music ─────────────┤ ├ model chips Klein | Krea or H3 | LTX ───────┤ ├───────────────────────────────────────────────────────────┤ │ │ │ STAGE (contain, full remaining height) │ │ │ ├ filmstrip scroll-x, tiles 72px ───────────────────────────┤ ├ [Slots] [Prompt] [Look] [Gen] Generate (amber, 48px) ─┤ └───────────────────────────────────────────────────────────┘ ``` Bottom **dock** is 4 tabs that open sheets, plus Generate always visible: | Tab | Sheet contents (all desktop fields) | |---|---| | **Slots** | Hero, Start, End, Guides, Upload, Lock face, Lock outfit + Klein caption | | **Prompt** | Prompt textarea, negative chips, style/render/quality/lighting chips | | **Look** | LoRA stack (filename + Model/CLIP sliders + numbers), Seed + dice, Aspect, extra generation settings (steps/CFG only if that engine uses them) | | **Gen** | Engine-specific video/music extras: duration/target length, fps, turbo, camera beats, YuE2 hints. Not a second Generate button. | **Generate** is the rightmost dock control — 48×48 or a 120px amber pill. Never labeled Queue. Header **☰** or badge **Queue (n)** opens a **right/bottom sheet** of job cards (same cards as desktop right column). Library and Settings stay header links (or a `…` menu). Do not drop them. --- ## Stage - Same contain rule as desktop: `max-width/height 100%`, `object-fit: contain`, no inner max-width cap. - Still / video / audio switch on `selected.kind`. No waveform on a still. - Safe area: `padding-bottom: env(safe-area-inset-bottom)` on the dock. - Filmstrip under stage, 72×48 tiles, amber ring on selected, horizontal scroll. Trash on selected tile only. --- ## Sheets - One sheet at a time. Height `min(85vh, content)`. Drag handle + Done. - Fields keep desktop order and payload keys. - LoRA card = filename + two (or one) sliders + numeric `0.00–2.00`. No hashed meters. - Krea disabled-on-Edit with the same one-line reason. - LTX disabled on AIGen with `xAIGen only`. - xAIGen hide defaults: eye on stage + each tile. No global hide checkbox required on mobile. --- ## What you must not do - No desktop 3-column at `<768`. - No “rotate device” dead end. - No missing task (Iterate if desktop has it — add the chip). - No second `form` object. - Do not change Classic/Studio desktop tokens in this pass. `isMobile` from `window.matchMedia('(max-width: 767px)')` + resize listener. SSR: default desktop to avoid hydration flip, then switch on mount. --- ## Done when 390×844 portrait: - Stage fills the phone; dock + chips visible without page-zoom. - Slots, Prompt, Look, Gen sheets each reachable; Generate queues a job. - Queue sheet lists jobs. - Rotate to ≥768: desktop 3-column returns, same job state. One or two present-tense commits. Screenshot 390 and 1440.