@@ -105,6 +105,13 @@ The clipboard is held **by channel** and relative to the earliest key copied, so
 | Zoom | Wheel (up = in), or the ± buttons |
 | Pan | Right- or middle-drag, <kbd>Shift</kbd>+wheel, or the navigator thumb |
 
+## On a phone
+
+Since 1.30 the Animation window fits a phone (and any window narrower than 640 px): it shows one pane at a time —
+**Channels**, **Timeline**, **Key** or **Clip** — from a switch in its header. Drag keys and easing handles with a
+finger, two fingers pan and pinch-zoom the timeline, and a long press opens the key or plot menu (the right-click
+menu on a desktop). Tool rows that do not fit scroll sideways.
+
 ## Auto-key
 
 Switch **Auto-key** on and posing the object records it: drag the gizmo or type a number in the properties panel and a key lands at the playhead, creating the channel if it does not exist yet. Switch it off and the object goes back to being just an object.
 
@@ -24,14 +24,22 @@ Profiler's text).
 The theme applies at once and is remembered on this device; a built-in theme is painted before the first frame on the
 next visit, so it never flashes the default. Icons follow the theme's colours too.
 
+Since 1.30 every theme follows the **one-accent rule**: blue marks what you can act on or have selected, and orange is
+kept for Play, recording and live states. The light theme and custom themes now restyle **every** surface — windows,
+menus, dialogs, the HUD and the node editor — because every colour comes from the design tokens.
+
 ## Making your own theme
 
 **Settings ▸ Interface ▸ Appearance ▸ Custom theme**:
 
 1. **Export template** downloads the active theme as an editable `.theme.json` — every colour the interface uses, by
    name (surfaces, fields, text, muted text, borders, accents, menus, scrollbars…). Since 1.21 a theme also carries
    **state colours** — `--ink-bad`, `--ink-warn`, `--ink-good` for error, warning and good text, and `--accent-fill` /
-   `--on-accent` for a filled accent chip and the text on it, and a custom theme may set them.
+   `--on-accent` for a filled accent chip and the text on it, and a custom theme may set them. Since 1.30 it may also
+   set the redesign's tokens — `--bg-app`, `--surface-1`, `--surface-2`, `--surface-inset`, `--border`,
+   `--border-strong`, `--text`, `--text-2`, `--text-muted`, `--text-faint`, `--accent`, `--accent-soft`,
+   `--accent-text`, `--live`, `--warn-text`, `--danger`, `--badge-bg`, `--badge-text`; any it leaves out are derived
+   from its other colours.
 2. Change the colours in any text editor.
 3. **Browse…** loads it back. It appears in the **Theme** list under its own name, and as a chip under *Custom theme*;
    the chip's **✕** removes it.
 
@@ -35,9 +35,13 @@ yourself the way other people do.
 | **Show my name above me** | your name label |
 | **Ping** | the colour and chime of *your* [pings](notifications.md#pinging); **Preview** pings beside your character (only you see and hear it) |
 
+Since 1.30 the panel is a **drawer** on the right (a bottom sheet on a phone): drag its inner edge to make it wider or
+narrower — the keyboard works too (focus the edge, then the arrow keys; <kbd>Shift</kbd> for bigger steps) — and the
+camera keeps your character in the part of the screen the drawer leaves free. The size is remembered on this device.
+
 Every change shows on your character at once; nothing reaches other people until you press **Apply**, which saves it and
-shows it to everyone. **Cancel**, <kbd>Esc</kbd> or ✕ throw the changes away. Either way the camera flies back to where
-you were.
+shows it to everyone. **Cancel**, <kbd>Esc</kbd> or ✕ throw the changes away. Either way the camera returns exactly to
+where your view was before you opened it.
 
 ## Showing everyone as classic heads
 
 
@@ -31,6 +31,8 @@ Two filters narrow the list: show only **This scene**'s checkpoints, or hide the
 While you work, autosave also adds an **automatic** checkpoint every few minutes — only when the scene actually changed
 since the last one, and never while a scene is loading or a simulation is running.
 
+In the Checkpoints window the **Automatic** switch shows or hides the automatic checkpoints in the timeline.
+
 ## Settings
 
 **Settings ▸ Scene ▸ Checkpoints**:
 
@@ -13,6 +13,11 @@ It has two halves:
 - **📋 Your ID** — the button on the left shows your own peer ID. Click it to **copy your invite link** (your app URL with your ID attached, e.g. `https://theprototype.app/#AB12CD`) to the clipboard. Until the connection to the signaling server is ready it reads *Generating…*.
 - **Connect field** — paste a peer's ID into *Enter peer ID to connect* and press **Connect** to request a connection.
 
+Since 1.30, once you are connected the bar **collapses to a compact chip** — a status dot, the session, the avatars
+of who is here and your mic; click it to open the full bar again (its collapse button folds it back). While the signaling link
+is down the status badge says how long it has been trying (*Reconnecting · 2 min*); the attempt count is in the drawer's
+**Info** tab. On a phone the bar is always the chip — tap it for your ID, the join field, Info and Toasts.
+
 ### Inviting someone
 
 1. **Copy your invite link** (the 📋 button) and send it to a friend.
 
@@ -377,6 +377,9 @@ Layouts are kept on this device. A reload still starts with a clean slate: a lay
 
 ## The toolbar
 
+Since 1.30 the toolbar is one glass bar where the accent marks the armed tool or an open window and **Play** is the
+only orange button; on a touch screen its buttons are 44 px. See [The Interface](interface.md#the-main-hud).
+
 Pressing a toolbar button never takes the keyboard: the keys stay with whatever had them — this holds for the bottom
 toolbar, the Connect bar, the touch tools, the draw, sculpt, spline and mesh-edit toolboxes and module toolboxes. So
 "press Move, then <kbd>F</kbd>" still frames the selection from the 3D view.
@@ -406,6 +409,9 @@ own page: see [Settings](settings.md).
 
 ## Keyboard shortcuts
 
+<kbd>Ctrl</kbd>+<kbd>K</kbd> opens the [command palette](interface.md#the-command-palette-ctrlk): one search over tools,
+windows, menus and every setting.
+
 Shortcuts are inert while you type in a text field and while play mode owns the keyboard. The same list is shown in **Settings ▸ Shortcuts** (<kbd>Ctrl</kbd>+<kbd>/</kbd> opens it directly), where a click on a shortcut's keys rebinds it and **Reset all** puts the defaults back.
 
 The keys in the table are the **3D view's**: they fire while the 3D view has focus. A panel you click in gets its own keys — see [Keys follow the panel you are in](#keys-follow-the-panel-you-are-in).
 
@@ -24,6 +24,19 @@ with a contributing guide and an `llms.txt` for coding agents.
 
 ## What's new
 
+**1.30 — a calm new look, on a desk and in a pocket.** Every window, menu, dialog, the main HUD and the phone layout
+now share [one interface](interface.md): one window header and [one tab strip](interface.md#windows-and-tabs), one menu
+style with a [shorter object menu](interface.md#menus) (rare actions one level down, nothing removed), calmer dialogs,
+and one accent colour — blue for what you can act on, orange only for Play and live states. The HUD is one glass
+toolbar, the [Connect bar collapses to a chip](connection.md#the-connect-panel) once you are connected, toasts stack three
+at a time, and <kbd>Ctrl</kbd>+<kbd>K</kbd> opens a [command palette](interface.md#the-command-palette-ctrlk) over every
+tool, window, menu and setting. While you play a small [banner](physics.md#play-mode-is-interact-mode) says how to stop
+(a scene can hide it or use its own words). [Customize character](avatars.md#customize-character) is a resizable drawer
+that puts your view back exactly. On a phone, a [decluttered layout](interface.md#on-a-phone) keeps the logo, a Connect
+chip and a bottom bar you can rearrange — Add · Objects · Play · Explorer · More — with windows as bottom sheets that
+remember their height. Light and custom [themes](appearance.md) restyle everything. Every shortcut, setting, scrub field
+and panel works as before.
+
 **1.29 — groundwork for cloud saves and kept rooms.** Under the hood, the app can now tell the
 theprototype.app cloud plugin when the scene changes, fingerprint what is in it, and hand over or open a whole
 project — what [cloud saves and rooms that stay open when everyone leaves](community.md) are built on. They switch on
 
@@ -0,0 +1,104 @@
+# The Interface
+
+Since 1.30 every window, menu, dialog, the main HUD and the phone layout are built from one small kit of parts and
+one set of colours. This page is the map: where things are and what the shapes mean. Nothing you can *do* changed —
+every shortcut, setting, scrub field and panel works as before; only the look and a few placements moved.
+
+## One accent colour
+
+**Blue** marks what you can act on or have selected: the armed tool, a switch that is on, the chosen chip, a primary
+button, the focus ring. **Orange** is kept for things that are live — **Play**, recording, streaming — so it stands out
+where it matters. A **Shared** or **This device** badge beside a heading says who a setting affects, instead of a
+paragraph explaining it.
+
+The light theme and every custom `.theme.json` restyle all of it; see [Themes & Appearance](appearance.md).
+
+## The main HUD
+
+- **The toolbar** at the bottom is one glass bar: Move, Rotate, Scale, Interact, **Play** (the only orange button), then
+  the windows you keep there (Objects, Node editor, Explorer, Animation…). The accent fill marks the armed tool or an open
+  window. It is still yours to arrange — right-click any button; see [The toolbar](controls.md#the-toolbar).
+- **The logo** (top-left) opens the main menu, grouped as Project · Scene · Collaborate · App.
+- **The Connect bar** (top centre) shows your ID — click it to copy your invite link — the field to join someone, and
+  the status as a badge. Once you are connected it **collapses to a chip**: a status dot, the session, the avatars of who
+  is here and your mic. Click the chip to open the full bar again. While the link to the signaling server is down it
+  says for how long ("Reconnecting · 2 min"); the attempt count is in **Connect ▸ Info**. See
+  [Connection](connection.md#the-connect-panel).
+- **Top right**: scene notes, the notification bell (with a count) and the peers list sit in one group beside your
+  picture, which opens your profile menu (**Customize character**, **Profile settings**).
+- **Toasts** are calm cards under the Connect bar, at most three at a time; more collect behind **+N more**. See
+  [Toasts](notifications.md#toasts).
+- Someone who is **speaking** in voice chat gets a soft green ring on their avatar.
+- Buttons are 36–38 px with a mouse and grow to **44 px on a touch screen**.
+
+## The command palette (Ctrl+K)
+
+<kbd>Ctrl</kbd>+<kbd>K</kbd> opens one search box over everything: **tools** (Move, Scale, Interact…), **windows**
+(Explorer, Objects, the Profiler…), **menu items** and **every setting**. Type a few letters, move with
+<kbd>↑</kbd> <kbd>↓</kbd>, press <kbd>Enter</kbd> to run it; <kbd>Esc</kbd> or a click outside closes it. Picking a
+setting opens Settings already searching for that row. The palette is listed in the shortcut sheet (<kbd>?</kbd>) and
+can be rebound there like any shortcut.
+
+## Windows and tabs
+
+Every docked or floating window — Explorer, Objects, Chat, AI assistant, Notes, the Notification centre, the node
+editor, Flow code, Animation, UV, Shader, HUD editor, Profiler, the Code workspace — has the same header: icon, title,
+the window's own actions, then pin and close in the same places. Windows in one group, and the views in the bottom dock,
+share **one tab strip**: pill tabs with the view's icon and their own **✕** to close that view (it shows on the
+active tab and when you point at one); a docked view no longer repeats its name under its tab. More tabs than fit
+scroll sideways (the wheel or a swipe; the strip fades where more tabs are hidden) while **+** stays in place.
+Moving, docking, splitting and tabbing work exactly as before — see [Floating windows](controls.md#floating-windows).
+
+Lists scroll with a thin scrollbar that appears only while you scroll or point at them; there are no chunky native
+scrollbars anywhere.
+
+## Menus
+
+The right-click, Add (<kbd>Shift</kbd>+<kbd>A</kbd>) and viewport menus share one style: 32 px rows, an icon per row,
+shortcuts right-aligned, quiet section labels.
+
+**Right-click an object** and the everyday actions come first — **Properties**, **Rename**, **Duplicate**, **Delete** —
+then **Focus**, **Ping** and **Add note**, then the editing modes. Rarer work is one level down: **Transform ▸**
+(align to ground, origin, pivot…), **Mesh ▸** (convert, boolean…), **Physics & effects ▸** (joints, particles, flow
+effects), **Prefab ▸** on a placed prefab copy, and **Save as… ▸**. Every action and its shortcut is still there.
+
+## Dialogs
+
+Modules, Sessions, Checkpoints, Templates, Storage, Publish / Export, Import and every confirmation share one dialog
+style: a header with the title and close, tabs directly under it where a dialog has them, one scrolling body and the
+answers bottom-right. Each view has **one** emphasised action; a destructive answer is red. Escape, a click outside and
+the close button behave as before. **Customize character** is a drawer you can resize by its edge — see
+[Your Character](avatars.md#customize-character).
+
+## On a phone
+
+Below 640 px wide the app switches to a phone layout with less on screen and nothing missing:
+
+- **Top**: the logo (main menu) on the left, a **Connect chip** in the middle — tap it for your invite link, the join
+  field, Info and Toasts — and the notification bell and your picture on the right.
+- **Bottom bar**: **Add · Objects · Play · Explorer · More**. Play stays the only orange control. **More** holds the
+  rest: Chat, the AI assistant, Notes, the node editor and every other window, the viewport tools and stats.
+- **Make the bar yours**: **More ▸ Edit bar…**, or a long press on any tab, picks which views take the four slots
+  (More always stays). The choice is kept on this device; **Reset** goes back to the default.
+- **The selection toolbar** appears only while something is selected: Move, Rotate, Scale, Inspect, Undo and Redo.
+  With nothing selected — just looking around — there is no toolbar; **More ▸ Edit** has Undo, Redo, Select multiple
+  and Interact mode.
+- **Sheets sit above the bottom bar.** Objects, Explorer and the other docked views, the Inspector, Notifications, Add
+  and More open as bottom sheets with a handle — drag (or tap the handle) between peek, half and full height — and
+  the bar with Play stays visible and tappable. The selection toolbar rides on top of whatever sheet is open, so you
+  can pick an object in Objects and move or undo without closing it. Each sheet reopens at the height you left it, on
+  this device. The menus you open by long-pressing the scene are short-lived action sheets that may cover the bar
+  until you pick something or tap outside.
+- **Editors fit a phone**: the [Animation](animation.md#on-a-phone) window shows one pane at a time, the [Shader
+  editor](shader-graph.md#on-a-phone) gives the canvas the whole screen with the palette and properties as sheets,
+  and every toolbar that does not fit — UV editor tools, Profiler controls — scrolls sideways (with a fade where
+  more is hidden); nothing is out of reach.
+- **Settings** is a list you tap into, with ‹ Back on every page; Settings and dialogs open full-screen and cover the
+  logo while they are open.
+
+Touch targets are at least 44 px, switches 51 × 31, and text fields use 16 px text so the browser never zooms.
+
+## For module authors
+
+Every part shown here is on the **/kit** page of the app, in every state, and module panels can use the same parts — see
+[The UI kit](ui-kit.md).
@@ -17,6 +17,10 @@ Two ways to ship one:
 Start by downloading a core module from the manager ("Download as example") —
 `hello` is the smallest complete one.
 
+Giving your module a panel or settings? Build it from the app's own parts and design
+tokens so it matches every theme: see [UI kit for module authors](ui-kit.md) and the live
+[kit page](https://theprototype.app/kit).
+
 Writing a **user module**? The companion repo
 [theprototype-app/modules](https://github.com/theprototype-app/modules) carries
 the working end of this page:
 
@@ -4,7 +4,9 @@ Modules plug playable content into the app — instruments, mini-games, generato
 
 ## The Modules manager
 
-Open it from **Menu ▸ Modules**.
+Open it from **Menu ▸ Modules**. Since 1.30 **Install from file…** sits in the header, the **Core / User / Browse** tabs
+show counts, a **Filter modules** field narrows whatever the tab lists (name, description, author, tags), and each module
+is one row — name, version, description, its actions, the download-as-example icon and its on/off switch.
 
 - **Core modules** ship with the app (hello, button, pong, VR sleeve). Toggle each on or off: both are **live** (since 1.20, disabling no longer needs a reload).
 - The dungeon generator, piano, avatar controller, VR essentials and drivable car used to ship in the app; they now live in the **Browse** gallery, so install them there when you want them. Everyone in a session needs the same modules for shared behaviour to match — including anyone who joins later.