@crowdedkingdoms/crowdyjs 12.0.0 → 12.2.0

package/dist/crowdy-studio/layout.d.ts

@@ -0,0 +1,50 @@
+/**
+ * User-directed Crowdy Studio layout state: which panes are visible and how
+ * large they are. The editor is the only always-visible surface; the explorer,
+ * project settings, agent dock, and bottom panel are toggled by the person
+ * using the Studio and their choices persist locally.
+ */
+export type StudioPaneId = 'explorer' | 'settings' | 'agent' | 'bottom';
+export interface StudioPaneSizeRange {
+    readonly min: number;
+    readonly max: number;
+}
+export interface StudioLayoutState {
+    readonly visible: Readonly<Record<StudioPaneId, boolean>>;
+    /** Pixel widths for side panes; pixel height for the bottom panel. */
+    readonly sizes: Readonly<Record<StudioPaneId, number>>;
+}
+export type StudioLayoutListener = (state: StudioLayoutState) => void;
+export type StudioLayoutStorage = Pick<Storage, 'getItem' | 'setItem'>;
+export interface StudioLayoutControllerOptions {
+    storage?: StudioLayoutStorage | null;
+    storageKey?: string;
+    defaults?: Partial<StudioLayoutState>;
+}
+export declare const STUDIO_LAYOUT_STORAGE_KEY = "ck:crowdy-studio:layout:v1";
+export declare const STUDIO_PANE_IDS: readonly StudioPaneId[];
+export declare function studioPaneSizeRange(pane: StudioPaneId): StudioPaneSizeRange;
+export declare function clampStudioPaneSize(pane: StudioPaneId, size: number): number;
+/**
+ * Headless layout state machine. DOM shells subscribe and translate the state
+ * into CSS variables / hidden attributes; tests drive it directly.
+ */
+export declare class StudioLayoutController {
+    private readonly storage;
+    private readonly storageKey;
+    private readonly listeners;
+    private visible;
+    private sizes;
+    constructor(options?: StudioLayoutControllerOptions);
+    getState(): StudioLayoutState;
+    isVisible(pane: StudioPaneId): boolean;
+    paneSize(pane: StudioPaneId): number;
+    subscribe(listener: StudioLayoutListener): () => void;
+    setVisible(pane: StudioPaneId, visible: boolean): void;
+    toggle(pane: StudioPaneId): void;
+    setSize(pane: StudioPaneId, size: number, persist?: boolean): void;
+    private emit;
+    private loadPersisted;
+    private persist;
+}
+//# sourceMappingURL=layout.d.ts.map

package/dist/crowdy-studio/layout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"layout.d.ts","sourceRoot":"","sources":["../../src/crowdy-studio/layout.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,MAAM,MAAM,YAAY,GAAG,UAAU,GAAG,UAAU,GAAG,OAAO,GAAG,QAAQ,CAAC;AAExE,MAAM,WAAW,mBAAmB;IAClC,QAAQ,CAAC,GAAG,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,GAAG,EAAE,MAAM,CAAC;CACtB;AAED,MAAM,WAAW,iBAAiB;IAChC,QAAQ,CAAC,OAAO,EAAE,QAAQ,CAAC,MAAM,CAAC,YAAY,EAAE,OAAO,CAAC,CAAC,CAAC;IAC1D,sEAAsE;IACtE,QAAQ,CAAC,KAAK,EAAE,QAAQ,CAAC,MAAM,CAAC,YAAY,EAAE,MAAM,CAAC,CAAC,CAAC;CACxD;AAED,MAAM,MAAM,oBAAoB,GAAG,CAAC,KAAK,EAAE,iBAAiB,KAAK,IAAI,CAAC;AAEtE,MAAM,MAAM,mBAAmB,GAAG,IAAI,CAAC,OAAO,EAAE,SAAS,GAAG,SAAS,CAAC,CAAC;AAEvE,MAAM,WAAW,6BAA6B;IAC5C,OAAO,CAAC,EAAE,mBAAmB,GAAG,IAAI,CAAC;IACrC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC,iBAAiB,CAAC,CAAC;CACvC;AAED,eAAO,MAAM,yBAAyB,+BAA+B,CAAC;AAEtE,eAAO,MAAM,eAAe,EAAE,SAAS,YAAY,EAKlD,CAAC;AAuBF,wBAAgB,mBAAmB,CAAC,IAAI,EAAE,YAAY,GAAG,mBAAmB,CAE3E;AAED,wBAAgB,mBAAmB,CAAC,IAAI,EAAE,YAAY,EAAE,IAAI,EAAE,MAAM,GAAG,MAAM,CAI5E;AAED;;;GAGG;AACH,qBAAa,sBAAsB;IACjC,OAAO,CAAC,QAAQ,CAAC,OAAO,CAA6B;IACrD,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAS;IACpC,OAAO,CAAC,QAAQ,CAAC,SAAS,CAAmC;IAC7D,OAAO,CAAC,OAAO,CAAgC;IAC/C,OAAO,CAAC,KAAK,CAA+B;gBAEhC,OAAO,GAAE,6BAAkC;IAevD,QAAQ,IAAI,iBAAiB;IAI7B,SAAS,CAAC,IAAI,EAAE,YAAY,GAAG,OAAO;IAItC,QAAQ,CAAC,IAAI,EAAE,YAAY,GAAG,MAAM;IAIpC,SAAS,CAAC,QAAQ,EAAE,oBAAoB,GAAG,MAAM,IAAI;IAOrD,UAAU,CAAC,IAAI,EAAE,YAAY,EAAE,OAAO,EAAE,OAAO,GAAG,IAAI;IAOtD,MAAM,CAAC,IAAI,EAAE,YAAY,GAAG,IAAI;IAIhC,OAAO,CAAC,IAAI,EAAE,YAAY,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,UAAO,GAAG,IAAI;IAW/D,OAAO,CAAC,IAAI;IAKZ,OAAO,CAAC,aAAa;IA6BrB,OAAO,CAAC,OAAO;CAWhB"}

package/dist/crowdy-studio/layout.js

@@ -0,0 +1,155 @@
+/**
+ * User-directed Crowdy Studio layout state: which panes are visible and how
+ * large they are. The editor is the only always-visible surface; the explorer,
+ * project settings, agent dock, and bottom panel are toggled by the person
+ * using the Studio and their choices persist locally.
+ */
+export const STUDIO_LAYOUT_STORAGE_KEY = 'ck:crowdy-studio:layout:v1';
+export const STUDIO_PANE_IDS = [
+    'explorer',
+    'settings',
+    'agent',
+    'bottom',
+];
+const DEFAULT_VISIBLE = {
+    explorer: true,
+    settings: false,
+    agent: false,
+    bottom: false,
+};
+const DEFAULT_SIZES = {
+    explorer: 230,
+    settings: 280,
+    agent: 340,
+    bottom: 180,
+};
+const SIZE_RANGES = {
+    explorer: { min: 160, max: 480 },
+    settings: { min: 220, max: 480 },
+    agent: { min: 280, max: 620 },
+    bottom: { min: 96, max: 480 },
+};
+export function studioPaneSizeRange(pane) {
+    return SIZE_RANGES[pane];
+}
+export function clampStudioPaneSize(pane, size) {
+    const range = SIZE_RANGES[pane];
+    if (!Number.isFinite(size))
+        return DEFAULT_SIZES[pane];
+    return Math.round(Math.min(range.max, Math.max(range.min, size)));
+}
+/**
+ * Headless layout state machine. DOM shells subscribe and translate the state
+ * into CSS variables / hidden attributes; tests drive it directly.
+ */
+export class StudioLayoutController {
+    constructor(options = {}) {
+        this.listeners = new Set();
+        this.storage =
+            options.storage !== undefined ? options.storage : safeLocalStorage();
+        this.storageKey = options.storageKey ?? STUDIO_LAYOUT_STORAGE_KEY;
+        this.visible = { ...DEFAULT_VISIBLE, ...options.defaults?.visible };
+        this.sizes = { ...DEFAULT_SIZES };
+        if (options.defaults?.sizes) {
+            for (const pane of STUDIO_PANE_IDS) {
+                const size = options.defaults.sizes[pane];
+                if (size !== undefined)
+                    this.sizes[pane] = clampStudioPaneSize(pane, size);
+            }
+        }
+        this.loadPersisted();
+    }
+    getState() {
+        return { visible: { ...this.visible }, sizes: { ...this.sizes } };
+    }
+    isVisible(pane) {
+        return this.visible[pane];
+    }
+    paneSize(pane) {
+        return this.sizes[pane];
+    }
+    subscribe(listener) {
+        this.listeners.add(listener);
+        return () => {
+            this.listeners.delete(listener);
+        };
+    }
+    setVisible(pane, visible) {
+        if (this.visible[pane] === visible)
+            return;
+        this.visible = { ...this.visible, [pane]: visible };
+        this.persist();
+        this.emit();
+    }
+    toggle(pane) {
+        this.setVisible(pane, !this.visible[pane]);
+    }
+    setSize(pane, size, persist = true) {
+        const next = clampStudioPaneSize(pane, size);
+        if (this.sizes[pane] === next) {
+            if (persist)
+                this.persist();
+            return;
+        }
+        this.sizes = { ...this.sizes, [pane]: next };
+        if (persist)
+            this.persist();
+        this.emit();
+    }
+    emit() {
+        const state = this.getState();
+        for (const listener of [...this.listeners])
+            listener(state);
+    }
+    loadPersisted() {
+        if (!this.storage)
+            return;
+        let raw = null;
+        try {
+            raw = this.storage.getItem(this.storageKey);
+        }
+        catch {
+            return;
+        }
+        if (!raw)
+            return;
+        try {
+            const parsed = JSON.parse(raw);
+            if (typeof parsed !== 'object' || parsed === null)
+                return;
+            const record = parsed;
+            for (const pane of STUDIO_PANE_IDS) {
+                const visible = record.visible?.[pane];
+                if (typeof visible === 'boolean')
+                    this.visible[pane] = visible;
+                const size = record.sizes?.[pane];
+                if (typeof size === 'number' && Number.isFinite(size)) {
+                    this.sizes[pane] = clampStudioPaneSize(pane, size);
+                }
+            }
+        }
+        catch {
+            // Ignore corrupt persisted layout; defaults remain in effect.
+        }
+    }
+    persist() {
+        if (!this.storage)
+            return;
+        try {
+            this.storage.setItem(this.storageKey, JSON.stringify({ visible: this.visible, sizes: this.sizes }));
+        }
+        catch {
+            // Storage can be unavailable (private mode); layout stays session-only.
+        }
+    }
+}
+function safeLocalStorage() {
+    try {
+        if (typeof window === 'undefined')
+            return null;
+        return window.localStorage;
+    }
+    catch {
+        return null;
+    }
+}

package/dist/crowdy-studio/mount.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"mount.d.ts","sourceRoot":"","sources":["../../src/crowdy-studio/mount.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,sBAAsB,EACtB,KAAK,6BAA6B,EACnC,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAGL,uBAAuB,EACvB,2BAA2B,EAE3B,KAAK,gCAAgC,EACrC,KAAK,oCAAoC,EAC1C,MAAM,0BAA0B,CAAC;AAClC,OAAO,EACL,wBAAwB,EAExB,KAAK,iCAAiC,EACtC,KAAK,mBAAmB,EACzB,MAAM,yBAAyB,CAAC;AAEjC,OAAO,KAAK,EACV,yBAAyB,EAEzB,sBAAsB,EACvB,MAAM,aAAa,CAAC;AACrB,OAAO,EAEL,KAAK,+BAA+B,EACrC,MAAM,oBAAoB,CAAC;AAG5B,MAAM,WAAW,wBACf,SAAQ,6BAA6B,EACnC,+BAA+B;IACjC,6DAA6D;IAC7D,KAAK,CAAC,EAAE,6BAA6B,CAAC;CACvC;AAED,MAAM,WAAW,6BACf,SAAQ,IAAI,CACV,oCAAoC,EAClC,mBAAmB,GACnB,iBAAiB,GACjB,iBAAiB,GACjB,gBAAgB,GAChB,WAAW,GACX,uBAAuB,CAC1B;IACD,QAAQ,CAAC,EAAE,uBAAuB,CAAC;IACnC,qEAAqE;IACrE,eAAe,CAAC,EAAE,gCAAgC,CAAC;IACnD,UAAU,CAAC,EAAE,mBAAmB,CAAC;IACjC,WAAW,CAAC,EAAE,iCAAiC,CAAC;IAChD,cAAc,CAAC,EAAE,oCAAoC,CAAC,WAAW,CAAC,CAAC;IACnE,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED,MAAM,WAAW,kBAAkB;IACjC,UAAU,EAAE,sBAAsB,CAAC;IACnC,KAAK,EAAE,2BAA2B,GAAG,IAAI,CAAC;IAC1C,mBAAmB,EAAE,wBAAwB,GAAG,IAAI,CAAC;IACrD,UAAU,EAAE,sBAAsB,CAAC;IACnC,OAAO,IAAI,IAAI,CAAC;CACjB;AAED;;;;GAIG;AACH,wBAAgB,+BAA+B,CAC7C,IAAI,EAAE,WAAW,EACjB,aAAa,EAAE,MAAM,yBAAyB,GAAG,IAAI,GACpD,MAAM,IAAI,CAmBZ;AAED;;;;GAIG;AACH,wBAAsB,iBAAiB,CACrC,IAAI,EAAE,WAAW,EACjB,OAAO,EAAE,wBAAwB,GAChC,OAAO,CAAC,kBAAkB,CAAC,CA6O7B"}
+{"version":3,"file":"mount.d.ts","sourceRoot":"","sources":["../../src/crowdy-studio/mount.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,sBAAsB,EACtB,KAAK,6BAA6B,EACnC,MAAM,iBAAiB,CAAC;AACzB,OAAO,EAGL,uBAAuB,EACvB,2BAA2B,EAE3B,KAAK,gCAAgC,EACrC,KAAK,oCAAoC,EAC1C,MAAM,0BAA0B,CAAC;AAClC,OAAO,EACL,wBAAwB,EAExB,KAAK,iCAAiC,EACtC,KAAK,mBAAmB,EACzB,MAAM,yBAAyB,CAAC;AAEjC,OAAO,KAAK,EACV,yBAAyB,EAEzB,sBAAsB,EACvB,MAAM,aAAa,CAAC;AACrB,OAAO,EAEL,KAAK,+BAA+B,EACrC,MAAM,oBAAoB,CAAC;AAG5B,MAAM,WAAW,wBACf,SAAQ,6BAA6B,EACnC,+BAA+B;IACjC,6DAA6D;IAC7D,KAAK,CAAC,EAAE,6BAA6B,CAAC;CACvC;AAED,MAAM,WAAW,6BACf,SAAQ,IAAI,CACV,oCAAoC,EAClC,mBAAmB,GACnB,iBAAiB,GACjB,iBAAiB,GACjB,gBAAgB,GAChB,WAAW,GACX,uBAAuB,CAC1B;IACD,QAAQ,CAAC,EAAE,uBAAuB,CAAC;IACnC,qEAAqE;IACrE,eAAe,CAAC,EAAE,gCAAgC,CAAC;IACnD,UAAU,CAAC,EAAE,mBAAmB,CAAC;IACjC,WAAW,CAAC,EAAE,iCAAiC,CAAC;IAChD,cAAc,CAAC,EAAE,oCAAoC,CAAC,WAAW,CAAC,CAAC;IACnE,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED,MAAM,WAAW,kBAAkB;IACjC,UAAU,EAAE,sBAAsB,CAAC;IACnC,KAAK,EAAE,2BAA2B,GAAG,IAAI,CAAC;IAC1C,mBAAmB,EAAE,wBAAwB,GAAG,IAAI,CAAC;IACrD,UAAU,EAAE,sBAAsB,CAAC;IACnC,OAAO,IAAI,IAAI,CAAC;CACjB;AAED;;;;GAIG;AACH,wBAAgB,+BAA+B,CAC7C,IAAI,EAAE,WAAW,EACjB,aAAa,EAAE,MAAM,yBAAyB,GAAG,IAAI,GACpD,MAAM,IAAI,CAmBZ;AAED;;;;GAIG;AACH,wBAAsB,iBAAiB,CACrC,IAAI,EAAE,WAAW,EACjB,OAAO,EAAE,wBAAwB,GAChC,OAAO,CAAC,kBAAkB,CAAC,CA+O7B"}

package/dist/crowdy-studio/mount.js

@@ -138,7 +138,9 @@ export async function mountCrowdyStudio(host, options) {
     let editor = null;
     let destroyed = false;
     let recoveringEditor = false;
-    const disconnectLayoutObserver = observeCrowdyStudioEditorLayout(host, () => editor);
+    // Observe the editor box itself so pane toggles and splitter drags inside
+    // the studio relayout Monaco, not only host/window resizes.
+    const disconnectLayoutObserver = observeCrowdyStudioEditorLayout(shell.editorHost, () => editor);
     const callbacks = {
         onProjectFileChange: (target, path, content) => controller.updateFile(target, path, content),
         onLocalDiagnostics: (diagnostics) => controller.setLocalDiagnostics(diagnostics),

package/dist/crowdy-studio/splitter.d.ts

@@ -0,0 +1,33 @@
+/**
+ * Reusable accessible pane splitter for Crowdy Studio panes. Pointer drag plus
+ * Arrow/Home/End keyboard resizing, mirroring the behavior games already ship
+ * for the game/studio dock separator.
+ */
+export interface PaneSplitterRange {
+    readonly min: number;
+    readonly max: number;
+}
+export interface PaneSplitterOptions {
+    /** `vertical` separators resize widths; `horizontal` separators heights. */
+    orientation: 'vertical' | 'horizontal';
+    /**
+     * Where the sized pane sits relative to the separator in document order:
+     * `before` (explorer to its left / panel above) grows as the pointer moves
+     * right/down; `after` (right-hand or bottom panes) grows in the opposite
+     * direction.
+     */
+    pane: 'before' | 'after';
+    label: string;
+    range(): PaneSplitterRange;
+    getSize(): number;
+    /** `commit` is true for the final size of a gesture (persist it). */
+    setSize(size: number, commit: boolean): void;
+}
+export interface PaneSplitterHandle {
+    readonly element: HTMLDivElement;
+    /** Re-sync ARIA values after external size or range changes. */
+    refresh(): void;
+    dispose(): void;
+}
+export declare function createPaneSplitter(options: PaneSplitterOptions): PaneSplitterHandle;
+//# sourceMappingURL=splitter.d.ts.map

package/dist/crowdy-studio/splitter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"splitter.d.ts","sourceRoot":"","sources":["../../src/crowdy-studio/splitter.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,MAAM,WAAW,iBAAiB;IAChC,QAAQ,CAAC,GAAG,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,GAAG,EAAE,MAAM,CAAC;CACtB;AAED,MAAM,WAAW,mBAAmB;IAClC,4EAA4E;IAC5E,WAAW,EAAE,UAAU,GAAG,YAAY,CAAC;IACvC;;;;;OAKG;IACH,IAAI,EAAE,QAAQ,GAAG,OAAO,CAAC;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,IAAI,iBAAiB,CAAC;IAC3B,OAAO,IAAI,MAAM,CAAC;IAClB,qEAAqE;IACrE,OAAO,CAAC,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,GAAG,IAAI,CAAC;CAC9C;AAED,MAAM,WAAW,kBAAkB;IACjC,QAAQ,CAAC,OAAO,EAAE,cAAc,CAAC;IACjC,gEAAgE;IAChE,OAAO,IAAI,IAAI,CAAC;IAChB,OAAO,IAAI,IAAI,CAAC;CACjB;AAKD,wBAAgB,kBAAkB,CAChC,OAAO,EAAE,mBAAmB,GAC3B,kBAAkB,CAoIpB"}

package/dist/crowdy-studio/splitter.js

@@ -0,0 +1,133 @@
+/**
+ * Reusable accessible pane splitter for Crowdy Studio panes. Pointer drag plus
+ * Arrow/Home/End keyboard resizing, mirroring the behavior games already ship
+ * for the game/studio dock separator.
+ */
+const KEYBOARD_STEP_PX = 16;
+const KEYBOARD_LARGE_STEP_PX = 48;
+export function createPaneSplitter(options) {
+    const element = document.createElement('div');
+    element.className = 'ck-crowdy-studio-splitter';
+    element.dataset.orientation = options.orientation;
+    element.tabIndex = 0;
+    element.setAttribute('role', 'separator');
+    element.setAttribute('aria-orientation', options.orientation === 'vertical' ? 'vertical' : 'horizontal');
+    element.setAttribute('aria-label', options.label);
+    element.title =
+        options.orientation === 'vertical'
+            ? `${options.label} (Left/Right arrows, Home/End)`
+            : `${options.label} (Up/Down arrows, Home/End)`;
+    let draggingPointerId = null;
+    let dragStartCoord = 0;
+    let dragStartSize = 0;
+    const direction = options.pane === 'before' ? 1 : -1;
+    const refresh = () => {
+        const range = options.range();
+        element.setAttribute('aria-valuemin', String(range.min));
+        element.setAttribute('aria-valuemax', String(range.max));
+        element.setAttribute('aria-valuenow', String(Math.round(options.getSize())));
+    };
+    const apply = (size, commit) => {
+        const range = options.range();
+        const next = Math.round(Math.min(range.max, Math.max(range.min, size)));
+        options.setSize(next, commit);
+        refresh();
+    };
+    const pointerCoord = (event) => options.orientation === 'vertical' ? event.clientX : event.clientY;
+    const pointerDown = (event) => {
+        if (event.button !== 0)
+            return;
+        event.preventDefault();
+        event.stopPropagation();
+        draggingPointerId = event.pointerId;
+        dragStartCoord = pointerCoord(event);
+        dragStartSize = options.getSize();
+        element.dataset.dragging = 'true';
+        try {
+            element.setPointerCapture(event.pointerId);
+        }
+        catch {
+            // Synthetic browser tests and older engines may not expose capture.
+        }
+    };
+    const pointerMove = (event) => {
+        if (event.pointerId !== draggingPointerId)
+            return;
+        event.preventDefault();
+        event.stopPropagation();
+        const delta = pointerCoord(event) - dragStartCoord;
+        apply(dragStartSize + direction * delta, false);
+    };
+    const pointerUp = (event) => {
+        if (event.pointerId !== draggingPointerId)
+            return;
+        event.preventDefault();
+        event.stopPropagation();
+        const delta = pointerCoord(event) - dragStartCoord;
+        apply(dragStartSize + direction * delta, true);
+        stopDragging();
+    };
+    const pointerCancel = (event) => {
+        if (event.pointerId !== draggingPointerId)
+            return;
+        event.stopPropagation();
+        apply(options.getSize(), true);
+        stopDragging();
+    };
+    const stopDragging = () => {
+        const pointerId = draggingPointerId;
+        draggingPointerId = null;
+        element.dataset.dragging = 'false';
+        if (pointerId === null)
+            return;
+        try {
+            if (element.hasPointerCapture(pointerId)) {
+                element.releasePointerCapture(pointerId);
+            }
+        }
+        catch {
+            // Capture is an enhancement; sizing does not depend on it.
+        }
+    };
+    const keyDown = (event) => {
+        const range = options.range();
+        const step = event.shiftKey ? KEYBOARD_LARGE_STEP_PX : KEYBOARD_STEP_PX;
+        const grow = options.orientation === 'vertical' ? 'ArrowRight' : 'ArrowDown';
+        const shrink = options.orientation === 'vertical' ? 'ArrowLeft' : 'ArrowUp';
+        let next = null;
+        if (event.code === grow)
+            next = options.getSize() + direction * step;
+        else if (event.code === shrink)
+            next = options.getSize() - direction * step;
+        else if (event.code === 'Home')
+            next = range.min;
+        else if (event.code === 'End')
+            next = range.max;
+        if (next === null)
+            return;
+        event.preventDefault();
+        event.stopPropagation();
+        apply(next, true);
+    };
+    element.addEventListener('pointerdown', pointerDown);
+    element.addEventListener('pointermove', pointerMove);
+    element.addEventListener('pointerup', pointerUp);
+    element.addEventListener('pointercancel', pointerCancel);
+    element.addEventListener('lostpointercapture', pointerCancel);
+    element.addEventListener('keydown', keyDown);
+    refresh();
+    return {
+        element,
+        refresh,
+        dispose() {
+            stopDragging();
+            element.removeEventListener('pointerdown', pointerDown);
+            element.removeEventListener('pointermove', pointerMove);
+            element.removeEventListener('pointerup', pointerUp);
+            element.removeEventListener('pointercancel', pointerCancel);
+            element.removeEventListener('lostpointercapture', pointerCancel);
+            element.removeEventListener('keydown', keyDown);
+            element.remove();
+        },
+    };
+}

package/dist/crowdy-studio/styles.d.ts

@@ -1,2 +1,2 @@
-export declare const CROWDY_STUDIO_STYLES = "\n.ck-crowdy-studio{--ck-bg:#111827;--ck-panel:#182235;--ck-line:#334155;--ck-text:#e5e7eb;--ck-muted:#94a3b8;--ck-accent:#38bdf8;container-type:inline-size;display:grid;grid-template-rows:auto auto minmax(240px,1fr) minmax(120px,.36fr);width:100%;height:100%;min-height:0;overflow:hidden;background:var(--ck-bg);color:var(--ck-text);font:13px/1.4 ui-sans-serif,system-ui,sans-serif;border:1px solid var(--ck-line)}\n.ck-crowdy-studio *{box-sizing:border-box}.ck-crowdy-studio button,.ck-crowdy-studio input,.ck-crowdy-studio select,.ck-crowdy-studio textarea{font:inherit}.ck-crowdy-studio button,.ck-crowdy-studio select,.ck-crowdy-studio input{background:#0f172a;color:var(--ck-text);border:1px solid var(--ck-line);border-radius:4px;padding:5px 8px}.ck-crowdy-studio button{cursor:pointer}.ck-crowdy-studio button:hover{border-color:var(--ck-accent)}.ck-crowdy-studio button:disabled{opacity:.5;cursor:not-allowed}\n.ck-crowdy-studio-toolbar,.ck-crowdy-studio-actions,.ck-crowdy-studio-tabs,.ck-crowdy-studio-panel-tabs{display:flex;align-items:center;gap:6px;padding:7px;border-bottom:1px solid var(--ck-line)}.ck-crowdy-studio-toolbar{justify-content:space-between;flex-wrap:wrap}.ck-crowdy-studio-project-tools,.ck-crowdy-studio-runtime-tools{display:flex;align-items:center;gap:6px;flex-wrap:wrap}\n.ck-crowdy-studio-save[data-state=SAVED]{color:#86efac}.ck-crowdy-studio-save[data-state=SAVING]{color:#fde68a}.ck-crowdy-studio-save[data-state=CONFLICT]{color:#fca5a5}.ck-crowdy-studio-save[data-state=OFFLINE]{color:#fdba74}\n.ck-crowdy-studio-main{display:grid;grid-template-columns:230px minmax(0,1fr) 260px;min-height:0}.ck-crowdy-studio-explorer,.ck-crowdy-studio-settings{background:var(--ck-panel);overflow:auto;padding:8px}.ck-crowdy-studio-explorer{border-right:1px solid var(--ck-line)}.ck-crowdy-studio-settings{border-left:1px solid var(--ck-line)}.ck-crowdy-studio-editor-column{display:grid;grid-template-rows:auto minmax(0,1fr);min-width:0}\n.ck-crowdy-studio-editor{min-height:0;position:relative}.ck-crowdy-studio-textarea{width:100%;height:100%;min-height:0;resize:none;background:#0b1020;color:var(--ck-text);border:0;padding:12px;font:13px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace}.ck-crowdy-studio-editor-notice{padding:4px 8px;background:#78350f;color:#ffedd5}\n.ck-crowdy-studio-section{margin-bottom:12px}.ck-crowdy-studio-section-header{display:flex;align-items:center;justify-content:space-between;color:var(--ck-muted);font-weight:700;text-transform:uppercase;font-size:11px;margin-bottom:4px}.ck-crowdy-studio-file{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:3px;align-items:center}.ck-crowdy-studio-file>button:first-child{text-align:left;overflow:hidden;text-overflow:ellipsis;border:0;background:transparent}.ck-crowdy-studio-file>button:not(:first-child){padding:1px 4px}\n.ck-crowdy-studio-tabs{padding:4px;overflow:auto}.ck-crowdy-studio-tab[data-active=true],.ck-crowdy-studio-panel-tab[data-active=true]{border-color:var(--ck-accent);color:#bae6fd}.ck-crowdy-studio-tab{white-space:nowrap}.ck-crowdy-studio-tab span{margin-left:7px;color:var(--ck-muted)}\n.ck-crowdy-studio-settings label{display:grid;gap:3px;margin-bottom:9px;color:var(--ck-muted)}.ck-crowdy-studio-settings input,.ck-crowdy-studio-settings select{width:100%}.ck-crowdy-studio-new{display:none;gap:6px;align-items:center;width:100%;padding:7px;border-bottom:1px solid var(--ck-line)}.ck-crowdy-studio-new[data-open=true]{display:flex}.ck-crowdy-studio-new input{flex:1}\n.ck-crowdy-studio-bottom{display:grid;grid-template-rows:auto minmax(0,1fr);min-height:0;border-top:1px solid var(--ck-line)}.ck-crowdy-studio-panel{display:none;overflow:auto;padding:8px}.ck-crowdy-studio-panel[data-active=true]{display:block}.ck-crowdy-studio-panel pre{white-space:pre-wrap;margin:0;font:12px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace}.ck-crowdy-studio-problem{display:grid;grid-template-columns:auto auto 1fr;gap:8px;padding:3px;border-bottom:1px solid #243247}.ck-crowdy-studio-problem[data-source=rustc]{color:#fecaca}.ck-crowdy-studio-problem[data-source=local-advisory]{color:#fde68a}\n.ck-crowdy-studio-status{color:var(--ck-muted)}.ck-crowdy-studio-invoke{display:grid;grid-template-columns:180px 1fr auto;gap:6px}.ck-crowdy-studio-invoke textarea{min-height:70px;background:#0f172a;color:var(--ck-text);border:1px solid var(--ck-line)}.ck-crowdy-studio-empty{color:var(--ck-muted);padding:8px}\n.ck-crowdy-studio[data-agent=true]{grid-template-columns:minmax(0,1fr) minmax(300px,380px)}.ck-crowdy-studio[data-agent=true]>.ck-crowdy-studio-toolbar,.ck-crowdy-studio[data-agent=true]>.ck-crowdy-studio-new,.ck-crowdy-studio[data-agent=true]>.ck-crowdy-studio-main,.ck-crowdy-studio[data-agent=true]>.ck-crowdy-studio-bottom{grid-column:1}.ck-crowdy-studio-agent-dock{grid-column:2;grid-row:1/-1;display:flex;flex-direction:column;gap:8px;min-width:0;min-height:0;padding:10px;border-left:1px solid var(--ck-line);background:#0b1220;overflow:auto}.ck-crowdy-studio-agent-dock header{display:flex;align-items:center;justify-content:space-between;gap:8px}.ck-crowdy-studio-agent-dock h2,.ck-crowdy-studio-agent-dock h3{margin:0;font-size:13px}.ck-crowdy-studio-agent-status,.ck-crowdy-studio-agent-budget,.ck-crowdy-studio-agent-lease{color:var(--ck-muted);font-size:12px}.ck-crowdy-studio-agent-modes,.ck-crowdy-studio-agent-controls{display:flex;gap:5px;flex-wrap:wrap}.ck-crowdy-studio-agent-modes button[data-active=true]{border-color:var(--ck-accent);color:#bae6fd}.ck-crowdy-studio-agent-stop{border-color:#ef4444!important;color:#fecaca!important}.ck-crowdy-studio-agent-lease-controls{display:flex;gap:6px;flex-wrap:wrap;margin:0;padding:7px;border:1px solid var(--ck-line)}.ck-crowdy-studio-agent-lease-controls legend{color:var(--ck-muted)}.ck-crowdy-studio-agent-lease-controls label{display:flex;gap:3px;align-items:center}.ck-crowdy-studio-agent-messages{display:flex;flex-direction:column;gap:6px;min-height:90px;max-height:260px;overflow:auto}.ck-crowdy-studio-agent-message,.ck-crowdy-studio-agent-stream,.ck-crowdy-studio-agent-approval,.ck-crowdy-studio-agent-diff,.ck-crowdy-studio-agent-checkpoint{padding:7px;border:1px solid var(--ck-line);border-radius:5px;background:var(--ck-panel)}.ck-crowdy-studio-agent-message[data-role=USER]{border-color:#155e75}.ck-crowdy-studio-agent-message p,.ck-crowdy-studio-agent-approval p,.ck-crowdy-studio-agent-diff p,.ck-crowdy-studio-agent-checkpoint p{margin:3px 0;white-space:pre-wrap;overflow-wrap:anywhere}.ck-crowdy-studio-agent-timeline{display:grid;gap:5px;margin:0;padding-left:22px;max-height:190px;overflow:auto}.ck-crowdy-studio-agent-timeline li{padding:4px;border-bottom:1px solid #243247}.ck-crowdy-studio-agent-timeline li>span{margin-left:6px;color:var(--ck-muted)}.ck-crowdy-studio-agent-approvals,.ck-crowdy-studio-agent-checkpoints{display:grid;gap:7px}.ck-crowdy-studio-agent-approval{border-color:#f59e0b}.ck-crowdy-studio-agent-approval code{display:block;overflow-wrap:anywhere;color:#fde68a}.ck-crowdy-studio-agent-approval>div{display:flex;gap:6px}.ck-crowdy-studio-agent-composer{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px;margin-top:auto}.ck-crowdy-studio-agent-composer textarea{min-height:62px;resize:vertical;background:#0f172a;color:var(--ck-text);border:1px solid var(--ck-line);padding:7px}.ck-crowdy-studio :focus-visible{outline:2px solid var(--ck-accent);outline-offset:2px}\n@container(max-width:900px){.ck-crowdy-studio-main{grid-template-columns:180px minmax(0,1fr)}.ck-crowdy-studio-settings{display:none}}@container(max-width:620px){.ck-crowdy-studio-main{grid-template-columns:1fr}.ck-crowdy-studio-explorer{display:none}}\n@container(max-width:760px){.ck-crowdy-studio[data-agent=true]{grid-template-columns:1fr;grid-template-rows:auto auto minmax(240px,1fr) minmax(120px,.36fr) minmax(300px,.7fr);overflow:auto}.ck-crowdy-studio[data-agent=true]>.ck-crowdy-studio-agent-dock{grid-column:1;grid-row:5;border-left:0;border-top:1px solid var(--ck-line)}}\n";
+export declare const CROWDY_STUDIO_STYLES = "\n.ck-crowdy-studio{--ck-bg:#111827;--ck-panel:#182235;--ck-line:#334155;--ck-text:#e5e7eb;--ck-muted:#94a3b8;--ck-accent:#38bdf8;container-type:inline-size;display:flex;flex-direction:column;position:relative;isolation:isolate;width:100%;height:100%;min-height:0;overflow:hidden;background:var(--ck-bg);color:var(--ck-text);font:13px/1.4 ui-sans-serif,system-ui,sans-serif;border:1px solid var(--ck-line)}\n.ck-crowdy-studio *{box-sizing:border-box}.ck-crowdy-studio button,.ck-crowdy-studio input,.ck-crowdy-studio select,.ck-crowdy-studio textarea{font:inherit}.ck-crowdy-studio button,.ck-crowdy-studio select,.ck-crowdy-studio input{background:#0f172a;color:var(--ck-text);border:1px solid var(--ck-line);border-radius:4px;padding:5px 8px}.ck-crowdy-studio button{cursor:pointer}.ck-crowdy-studio button:hover{border-color:var(--ck-accent)}.ck-crowdy-studio button:disabled{opacity:.5;cursor:not-allowed}\n.ck-crowdy-studio [hidden]{display:none!important}\n\n/* Top bar */\n.ck-crowdy-studio-toolbar{display:flex;align-items:center;justify-content:space-between;gap:6px;padding:6px 8px;border-bottom:1px solid var(--ck-line);position:relative;z-index:30}\n.ck-crowdy-studio-project-tools,.ck-crowdy-studio-runtime-tools{display:flex;align-items:center;gap:6px;min-width:0}\n.ck-crowdy-studio-primary{border-color:var(--ck-accent);color:#bae6fd}\n.ck-crowdy-studio-save{color:var(--ck-muted)}\n.ck-crowdy-studio-save[data-state=SAVED]{color:#86efac}.ck-crowdy-studio-save[data-state=SAVING]{color:#fde68a}.ck-crowdy-studio-save[data-state=CONFLICT]{color:#fca5a5;border-color:#f87171}.ck-crowdy-studio-save[data-state=OFFLINE]{color:#fdba74;border-color:#fb923c}\n.ck-crowdy-studio-save-message{margin:0;padding:4px 6px;color:var(--ck-muted);max-width:280px}\n.ck-crowdy-studio-save-actions{display:flex;gap:6px;padding:4px 6px}\n\n/* Menus */\n.ck-crowdy-studio-menu-wrap{position:relative;display:inline-flex;min-width:0}\n.ck-crowdy-studio-menu-button{max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n.ck-crowdy-studio-menu{position:absolute;top:calc(100% + 4px);left:0;z-index:40;min-width:180px;max-width:320px;max-height:60vh;overflow:auto;display:flex;flex-direction:column;background:var(--ck-panel);border:1px solid var(--ck-line);border-radius:6px;padding:4px;box-shadow:0 8px 24px rgba(2,6,23,.55)}\n.ck-crowdy-studio-runtime-tools .ck-crowdy-studio-menu{left:auto;right:0}\n.ck-crowdy-studio-menu-item{display:block;width:100%;text-align:left;background:transparent;border:0;border-radius:4px;padding:6px 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}\n.ck-crowdy-studio-menu-item:hover{background:#0f172a;border:0}\n.ck-crowdy-studio-menu-item[data-active=true]{color:#bae6fd}\n.ck-crowdy-studio-menu-divider{border-top:1px solid var(--ck-line);margin:4px 2px}\n\n/* New-project popover */\n.ck-crowdy-studio-new{display:none;position:absolute;top:100%;left:8px;z-index:35;gap:6px;align-items:center;padding:8px;background:var(--ck-panel);border:1px solid var(--ck-line);border-radius:6px;box-shadow:0 8px 24px rgba(2,6,23,.55)}\n.ck-crowdy-studio-new[data-open=true]{display:flex}\n.ck-crowdy-studio-new input{flex:1;min-width:160px}\n\n/* Workspace: rail + panes + editor */\n.ck-crowdy-studio-workspace{display:flex;flex:1;min-height:0;min-width:0;position:relative}\n.ck-crowdy-studio-rail{display:flex;flex-direction:column;gap:4px;padding:6px 3px;border-right:1px solid var(--ck-line);background:#0b1220}\n.ck-crowdy-studio-rail-button{writing-mode:vertical-rl;padding:8px 4px;background:transparent;border:1px solid transparent;color:var(--ck-muted);border-radius:4px}\n.ck-crowdy-studio-rail-button:hover{color:var(--ck-text)}\n.ck-crowdy-studio-rail-button[aria-pressed=true]{color:#bae6fd;border-color:var(--ck-line);background:#0f172a}\n.ck-crowdy-studio-explorer,.ck-crowdy-studio-settings{flex:none;background:var(--ck-panel);overflow:auto;padding:8px;min-width:0}\n.ck-crowdy-studio-settings{border-left:1px solid var(--ck-line)}\n.ck-crowdy-studio-settings h3{margin:0 0 8px}\n.ck-crowdy-studio-editor-column{display:flex;flex-direction:column;flex:1;min-width:240px;min-height:0}\n.ck-crowdy-studio-editor{flex:1;min-height:80px;position:relative}\n.ck-crowdy-studio-textarea{width:100%;height:100%;min-height:0;resize:none;background:#0b1020;color:var(--ck-text);border:0;padding:12px;font:13px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace}\n.ck-crowdy-studio-editor-notice{padding:4px 8px;background:#78350f;color:#ffedd5}\n\n/* Splitters */\n.ck-crowdy-studio-splitter{flex:none;background:transparent;position:relative;z-index:5}\n.ck-crowdy-studio-splitter[data-orientation=vertical]{width:6px;cursor:col-resize}\n.ck-crowdy-studio-splitter[data-orientation=horizontal]{height:6px;cursor:row-resize}\n.ck-crowdy-studio-splitter:hover,.ck-crowdy-studio-splitter[data-dragging=true]{background:var(--ck-accent);opacity:.5}\n\n/* Explorer */\n.ck-crowdy-studio-section{margin-bottom:12px}\n.ck-crowdy-studio-section-header{display:flex;align-items:center;justify-content:space-between;color:var(--ck-muted);font-weight:700;text-transform:uppercase;font-size:11px;margin-bottom:4px}\n.ck-crowdy-studio-file{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3px;align-items:center}\n.ck-crowdy-studio-file>button:first-child{text-align:left;overflow:hidden;text-overflow:ellipsis;border:0;background:transparent}\n.ck-crowdy-studio-file-action{padding:1px 6px}\n.ck-crowdy-studio-file .ck-crowdy-studio-menu{left:auto;right:0;min-width:130px}\n.ck-crowdy-studio-inline-form{display:flex;flex-wrap:wrap;gap:4px;margin:4px 0;padding:6px;border:1px solid var(--ck-line);border-radius:4px;background:#0f172a}\n.ck-crowdy-studio-inline-form input{flex:1 1 100%;min-width:0}\n.ck-crowdy-studio-file-form-row{display:flex;flex-wrap:wrap;gap:4px;align-items:center;margin:4px 0;padding:6px;border:1px solid #f59e0b66;border-radius:4px}\n\n/* Editor tabs */\n.ck-crowdy-studio-tabs{display:flex;align-items:center;gap:6px;padding:4px;border-bottom:1px solid var(--ck-line);overflow:auto}\n.ck-crowdy-studio-tab{white-space:nowrap}\n.ck-crowdy-studio-tab[data-active=true],.ck-crowdy-studio-panel-tab[data-active=true]{border-color:var(--ck-accent);color:#bae6fd}\n.ck-crowdy-studio-tab span{margin-left:7px;color:var(--ck-muted)}\n\n/* Settings */\n.ck-crowdy-studio-settings label{display:grid;gap:3px;margin-bottom:9px;color:var(--ck-muted)}\n.ck-crowdy-studio-settings input,.ck-crowdy-studio-settings select{width:100%}\n\n/* Bottom panel */\n.ck-crowdy-studio-bottom{flex:none;display:flex;flex-direction:column;min-height:0;border-top:1px solid var(--ck-line)}\n.ck-crowdy-studio-panel-tabs{display:flex;align-items:center;gap:6px;padding:5px 7px;border-bottom:1px solid var(--ck-line)}\n.ck-crowdy-studio-panel-hide{margin-left:auto;padding:1px 7px;color:var(--ck-muted)}\n.ck-crowdy-studio-panel-body{flex:1;min-height:0;display:flex;flex-direction:column}\n.ck-crowdy-studio-panel{display:none;flex:1;overflow:auto;padding:8px}\n.ck-crowdy-studio-panel[data-active=true]{display:block}\n.ck-crowdy-studio-panel pre{white-space:pre-wrap;margin:0;font:12px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace}\n.ck-crowdy-studio-problem{display:grid;grid-template-columns:auto auto 1fr;gap:8px;padding:3px;border-bottom:1px solid #243247;width:100%;text-align:left;background:transparent;border-left:0;border-right:0;border-top:0;border-radius:0}\n.ck-crowdy-studio-problem[data-source=rustc]{color:#fecaca}\n.ck-crowdy-studio-problem[data-source=local-advisory]{color:#fde68a}\n.ck-crowdy-studio-invoke{display:grid;grid-template-columns:180px 1fr auto;gap:6px}\n.ck-crowdy-studio-invoke textarea{min-height:70px;background:#0f172a;color:var(--ck-text);border:1px solid var(--ck-line)}\n.ck-crowdy-studio-empty{color:var(--ck-muted);padding:8px}\n\n/* Status bar */\n.ck-crowdy-studio-statusbar{display:flex;align-items:center;gap:14px;padding:3px 10px;border-top:1px solid var(--ck-line);background:#0b1220;font-size:12px;min-height:24px}\n.ck-crowdy-studio-status{color:var(--ck-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}\n.ck-crowdy-studio-statusbar-runtime{background:transparent;border:0;padding:1px 4px;border-radius:3px}\n.ck-crowdy-studio-statusbar-runtime:hover{color:var(--ck-text)}\n.ck-crowdy-studio-statusbar-runtime[data-phase=RUNNING]{color:#86efac}\n.ck-crowdy-studio-statusbar-runtime[data-phase=COMPILING],.ck-crowdy-studio-statusbar-runtime[data-phase=TESTING_DRAFT],.ck-crowdy-studio-statusbar-runtime[data-phase=DEPLOYING_LIVE],.ck-crowdy-studio-statusbar-runtime[data-phase=ENABLING]{color:#fde68a}\n.ck-crowdy-studio-statusbar-runtime[data-phase=COMPILE_FAILED],.ck-crowdy-studio-statusbar-runtime[data-phase=ERROR],.ck-crowdy-studio-statusbar-runtime[data-phase=PARTIAL_FAILURE]{color:#fca5a5}\n\n/* Agent dock */\n.ck-crowdy-studio-agent-dock{flex:none;display:flex;flex-direction:column;gap:8px;min-width:0;min-height:0;padding:10px;border-left:1px solid var(--ck-line);background:#0b1220;overflow:auto}\n.ck-crowdy-studio-agent-dock header{display:flex;align-items:center;justify-content:space-between;gap:8px}\n.ck-crowdy-studio-agent-dock h2,.ck-crowdy-studio-agent-dock h3{margin:0;font-size:13px}\n.ck-crowdy-studio-agent-status,.ck-crowdy-studio-agent-budget,.ck-crowdy-studio-agent-lease{color:var(--ck-muted);font-size:12px}\n.ck-crowdy-studio-agent-lease[data-active=true]{color:#fde68a;border:1px solid #f59e0b;border-radius:5px;padding:6px}\n.ck-crowdy-studio-agent-controls-row{display:flex;align-items:center;justify-content:space-between;gap:6px;flex-wrap:wrap}\n.ck-crowdy-studio-agent-modes,.ck-crowdy-studio-agent-controls{display:flex;gap:5px;flex-wrap:wrap}\n.ck-crowdy-studio-agent-modes button[data-active=true]{border-color:var(--ck-accent);color:#bae6fd}\n.ck-crowdy-studio-agent-stop{border-color:#ef4444!important;color:#fecaca!important}\n.ck-crowdy-studio-agent-disclosure{border:1px solid var(--ck-line);border-radius:5px;padding:0}\n.ck-crowdy-studio-agent-disclosure>summary{cursor:pointer;padding:6px 8px;color:var(--ck-muted)}\n.ck-crowdy-studio-agent-disclosure[open]>summary{border-bottom:1px solid var(--ck-line);color:var(--ck-text)}\n.ck-crowdy-studio-agent-disclosure>:not(summary){padding:6px 8px}\n.ck-crowdy-studio-agent-lease-controls{display:flex;gap:6px;flex-wrap:wrap;margin:0;padding:7px;border:1px solid var(--ck-line)}\n.ck-crowdy-studio-agent-lease-controls legend{color:var(--ck-muted)}\n.ck-crowdy-studio-agent-lease-controls label{display:flex;gap:3px;align-items:center}\n.ck-crowdy-studio-agent-messages{display:flex;flex-direction:column;gap:6px;flex:1;min-height:120px;overflow:auto}\n.ck-crowdy-studio-agent-message,.ck-crowdy-studio-agent-stream,.ck-crowdy-studio-agent-approval,.ck-crowdy-studio-agent-diff,.ck-crowdy-studio-agent-checkpoint{padding:7px;border:1px solid var(--ck-line);border-radius:5px;background:var(--ck-panel)}\n.ck-crowdy-studio-agent-message[data-role=USER]{border-color:#155e75}\n.ck-crowdy-studio-agent-message p,.ck-crowdy-studio-agent-approval p,.ck-crowdy-studio-agent-diff p,.ck-crowdy-studio-agent-checkpoint p{margin:3px 0;white-space:pre-wrap;overflow-wrap:anywhere}\n.ck-crowdy-studio-agent-timeline{display:grid;gap:5px;margin:0;padding-left:22px;max-height:190px;overflow:auto}\n.ck-crowdy-studio-agent-timeline li{padding:4px;border-bottom:1px solid #243247}\n.ck-crowdy-studio-agent-timeline li>span{margin-left:6px;color:var(--ck-muted)}\n.ck-crowdy-studio-agent-approvals,.ck-crowdy-studio-agent-checkpoints{display:grid;gap:7px}\n.ck-crowdy-studio-agent-approval{border-color:#f59e0b}\n.ck-crowdy-studio-agent-approval code{display:block;overflow-wrap:anywhere;color:#fde68a}\n.ck-crowdy-studio-agent-approval>div{display:flex;gap:6px}\n.ck-crowdy-studio-agent-composer{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px}\n.ck-crowdy-studio-agent-composer textarea{min-height:62px;resize:vertical;background:#0f172a;color:var(--ck-text);border:1px solid var(--ck-line);padding:7px}\n.ck-crowdy-studio :focus-visible{outline:2px solid var(--ck-accent);outline-offset:2px}\n\n/* Narrow widths: side panes become overlays so the editor keeps priority. */\n@container(max-width:900px){.ck-crowdy-studio-settings{position:absolute;right:0;top:0;bottom:0;z-index:20;max-width:85%;border-left:1px solid var(--ck-line);box-shadow:-8px 0 24px rgba(2,6,23,.55)}.ck-crowdy-studio-splitter[data-orientation=vertical]{display:none}}\n@container(max-width:760px){.ck-crowdy-studio-agent-dock{position:absolute;right:0;top:0;bottom:0;z-index:22;max-width:92%;box-shadow:-8px 0 24px rgba(2,6,23,.55)}}\n@container(max-width:620px){.ck-crowdy-studio-explorer{position:absolute;left:34px;top:0;bottom:0;z-index:21;max-width:85%;border-right:1px solid var(--ck-line);box-shadow:8px 0 24px rgba(2,6,23,.55)}}\n";
 //# sourceMappingURL=styles.d.ts.map

package/dist/crowdy-studio/styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/crowdy-studio/styles.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,oBAAoB,y1PAehC,CAAC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/crowdy-studio/styles.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,oBAAoB,2iZAkIhC,CAAC"}

package/dist/crowdy-studio/styles.js

@@ -1,16 +1,131 @@
 export const CROWDY_STUDIO_STYLES = `
-.ck-crowdy-studio{--ck-bg:#111827;--ck-panel:#182235;--ck-line:#334155;--ck-text:#e5e7eb;--ck-muted:#94a3b8;--ck-accent:#38bdf8;container-type:inline-size;display:grid;grid-template-rows:auto auto minmax(240px,1fr) minmax(120px,.36fr);width:100%;height:100%;min-height:0;overflow:hidden;background:var(--ck-bg);color:var(--ck-text);font:13px/1.4 ui-sans-serif,system-ui,sans-serif;border:1px solid var(--ck-line)}
+.ck-crowdy-studio{--ck-bg:#111827;--ck-panel:#182235;--ck-line:#334155;--ck-text:#e5e7eb;--ck-muted:#94a3b8;--ck-accent:#38bdf8;container-type:inline-size;display:flex;flex-direction:column;position:relative;isolation:isolate;width:100%;height:100%;min-height:0;overflow:hidden;background:var(--ck-bg);color:var(--ck-text);font:13px/1.4 ui-sans-serif,system-ui,sans-serif;border:1px solid var(--ck-line)}
 .ck-crowdy-studio *{box-sizing:border-box}.ck-crowdy-studio button,.ck-crowdy-studio input,.ck-crowdy-studio select,.ck-crowdy-studio textarea{font:inherit}.ck-crowdy-studio button,.ck-crowdy-studio select,.ck-crowdy-studio input{background:#0f172a;color:var(--ck-text);border:1px solid var(--ck-line);border-radius:4px;padding:5px 8px}.ck-crowdy-studio button{cursor:pointer}.ck-crowdy-studio button:hover{border-color:var(--ck-accent)}.ck-crowdy-studio button:disabled{opacity:.5;cursor:not-allowed}
-.ck-crowdy-studio-toolbar,.ck-crowdy-studio-actions,.ck-crowdy-studio-tabs,.ck-crowdy-studio-panel-tabs{display:flex;align-items:center;gap:6px;padding:7px;border-bottom:1px solid var(--ck-line)}.ck-crowdy-studio-toolbar{justify-content:space-between;flex-wrap:wrap}.ck-crowdy-studio-project-tools,.ck-crowdy-studio-runtime-tools{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
-.ck-crowdy-studio-save[data-state=SAVED]{color:#86efac}.ck-crowdy-studio-save[data-state=SAVING]{color:#fde68a}.ck-crowdy-studio-save[data-state=CONFLICT]{color:#fca5a5}.ck-crowdy-studio-save[data-state=OFFLINE]{color:#fdba74}
-.ck-crowdy-studio-main{display:grid;grid-template-columns:230px minmax(0,1fr) 260px;min-height:0}.ck-crowdy-studio-explorer,.ck-crowdy-studio-settings{background:var(--ck-panel);overflow:auto;padding:8px}.ck-crowdy-studio-explorer{border-right:1px solid var(--ck-line)}.ck-crowdy-studio-settings{border-left:1px solid var(--ck-line)}.ck-crowdy-studio-editor-column{display:grid;grid-template-rows:auto minmax(0,1fr);min-width:0}
-.ck-crowdy-studio-editor{min-height:0;position:relative}.ck-crowdy-studio-textarea{width:100%;height:100%;min-height:0;resize:none;background:#0b1020;color:var(--ck-text);border:0;padding:12px;font:13px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace}.ck-crowdy-studio-editor-notice{padding:4px 8px;background:#78350f;color:#ffedd5}
-.ck-crowdy-studio-section{margin-bottom:12px}.ck-crowdy-studio-section-header{display:flex;align-items:center;justify-content:space-between;color:var(--ck-muted);font-weight:700;text-transform:uppercase;font-size:11px;margin-bottom:4px}.ck-crowdy-studio-file{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:3px;align-items:center}.ck-crowdy-studio-file>button:first-child{text-align:left;overflow:hidden;text-overflow:ellipsis;border:0;background:transparent}.ck-crowdy-studio-file>button:not(:first-child){padding:1px 4px}
-.ck-crowdy-studio-tabs{padding:4px;overflow:auto}.ck-crowdy-studio-tab[data-active=true],.ck-crowdy-studio-panel-tab[data-active=true]{border-color:var(--ck-accent);color:#bae6fd}.ck-crowdy-studio-tab{white-space:nowrap}.ck-crowdy-studio-tab span{margin-left:7px;color:var(--ck-muted)}
-.ck-crowdy-studio-settings label{display:grid;gap:3px;margin-bottom:9px;color:var(--ck-muted)}.ck-crowdy-studio-settings input,.ck-crowdy-studio-settings select{width:100%}.ck-crowdy-studio-new{display:none;gap:6px;align-items:center;width:100%;padding:7px;border-bottom:1px solid var(--ck-line)}.ck-crowdy-studio-new[data-open=true]{display:flex}.ck-crowdy-studio-new input{flex:1}
-.ck-crowdy-studio-bottom{display:grid;grid-template-rows:auto minmax(0,1fr);min-height:0;border-top:1px solid var(--ck-line)}.ck-crowdy-studio-panel{display:none;overflow:auto;padding:8px}.ck-crowdy-studio-panel[data-active=true]{display:block}.ck-crowdy-studio-panel pre{white-space:pre-wrap;margin:0;font:12px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace}.ck-crowdy-studio-problem{display:grid;grid-template-columns:auto auto 1fr;gap:8px;padding:3px;border-bottom:1px solid #243247}.ck-crowdy-studio-problem[data-source=rustc]{color:#fecaca}.ck-crowdy-studio-problem[data-source=local-advisory]{color:#fde68a}
-.ck-crowdy-studio-status{color:var(--ck-muted)}.ck-crowdy-studio-invoke{display:grid;grid-template-columns:180px 1fr auto;gap:6px}.ck-crowdy-studio-invoke textarea{min-height:70px;background:#0f172a;color:var(--ck-text);border:1px solid var(--ck-line)}.ck-crowdy-studio-empty{color:var(--ck-muted);padding:8px}
-.ck-crowdy-studio[data-agent=true]{grid-template-columns:minmax(0,1fr) minmax(300px,380px)}.ck-crowdy-studio[data-agent=true]>.ck-crowdy-studio-toolbar,.ck-crowdy-studio[data-agent=true]>.ck-crowdy-studio-new,.ck-crowdy-studio[data-agent=true]>.ck-crowdy-studio-main,.ck-crowdy-studio[data-agent=true]>.ck-crowdy-studio-bottom{grid-column:1}.ck-crowdy-studio-agent-dock{grid-column:2;grid-row:1/-1;display:flex;flex-direction:column;gap:8px;min-width:0;min-height:0;padding:10px;border-left:1px solid var(--ck-line);background:#0b1220;overflow:auto}.ck-crowdy-studio-agent-dock header{display:flex;align-items:center;justify-content:space-between;gap:8px}.ck-crowdy-studio-agent-dock h2,.ck-crowdy-studio-agent-dock h3{margin:0;font-size:13px}.ck-crowdy-studio-agent-status,.ck-crowdy-studio-agent-budget,.ck-crowdy-studio-agent-lease{color:var(--ck-muted);font-size:12px}.ck-crowdy-studio-agent-modes,.ck-crowdy-studio-agent-controls{display:flex;gap:5px;flex-wrap:wrap}.ck-crowdy-studio-agent-modes button[data-active=true]{border-color:var(--ck-accent);color:#bae6fd}.ck-crowdy-studio-agent-stop{border-color:#ef4444!important;color:#fecaca!important}.ck-crowdy-studio-agent-lease-controls{display:flex;gap:6px;flex-wrap:wrap;margin:0;padding:7px;border:1px solid var(--ck-line)}.ck-crowdy-studio-agent-lease-controls legend{color:var(--ck-muted)}.ck-crowdy-studio-agent-lease-controls label{display:flex;gap:3px;align-items:center}.ck-crowdy-studio-agent-messages{display:flex;flex-direction:column;gap:6px;min-height:90px;max-height:260px;overflow:auto}.ck-crowdy-studio-agent-message,.ck-crowdy-studio-agent-stream,.ck-crowdy-studio-agent-approval,.ck-crowdy-studio-agent-diff,.ck-crowdy-studio-agent-checkpoint{padding:7px;border:1px solid var(--ck-line);border-radius:5px;background:var(--ck-panel)}.ck-crowdy-studio-agent-message[data-role=USER]{border-color:#155e75}.ck-crowdy-studio-agent-message p,.ck-crowdy-studio-agent-approval p,.ck-crowdy-studio-agent-diff p,.ck-crowdy-studio-agent-checkpoint p{margin:3px 0;white-space:pre-wrap;overflow-wrap:anywhere}.ck-crowdy-studio-agent-timeline{display:grid;gap:5px;margin:0;padding-left:22px;max-height:190px;overflow:auto}.ck-crowdy-studio-agent-timeline li{padding:4px;border-bottom:1px solid #243247}.ck-crowdy-studio-agent-timeline li>span{margin-left:6px;color:var(--ck-muted)}.ck-crowdy-studio-agent-approvals,.ck-crowdy-studio-agent-checkpoints{display:grid;gap:7px}.ck-crowdy-studio-agent-approval{border-color:#f59e0b}.ck-crowdy-studio-agent-approval code{display:block;overflow-wrap:anywhere;color:#fde68a}.ck-crowdy-studio-agent-approval>div{display:flex;gap:6px}.ck-crowdy-studio-agent-composer{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px;margin-top:auto}.ck-crowdy-studio-agent-composer textarea{min-height:62px;resize:vertical;background:#0f172a;color:var(--ck-text);border:1px solid var(--ck-line);padding:7px}.ck-crowdy-studio :focus-visible{outline:2px solid var(--ck-accent);outline-offset:2px}
-@container(max-width:900px){.ck-crowdy-studio-main{grid-template-columns:180px minmax(0,1fr)}.ck-crowdy-studio-settings{display:none}}@container(max-width:620px){.ck-crowdy-studio-main{grid-template-columns:1fr}.ck-crowdy-studio-explorer{display:none}}
-@container(max-width:760px){.ck-crowdy-studio[data-agent=true]{grid-template-columns:1fr;grid-template-rows:auto auto minmax(240px,1fr) minmax(120px,.36fr) minmax(300px,.7fr);overflow:auto}.ck-crowdy-studio[data-agent=true]>.ck-crowdy-studio-agent-dock{grid-column:1;grid-row:5;border-left:0;border-top:1px solid var(--ck-line)}}
+.ck-crowdy-studio [hidden]{display:none!important}
+
+/* Top bar */
+.ck-crowdy-studio-toolbar{display:flex;align-items:center;justify-content:space-between;gap:6px;padding:6px 8px;border-bottom:1px solid var(--ck-line);position:relative;z-index:30}
+.ck-crowdy-studio-project-tools,.ck-crowdy-studio-runtime-tools{display:flex;align-items:center;gap:6px;min-width:0}
+.ck-crowdy-studio-primary{border-color:var(--ck-accent);color:#bae6fd}
+.ck-crowdy-studio-save{color:var(--ck-muted)}
+.ck-crowdy-studio-save[data-state=SAVED]{color:#86efac}.ck-crowdy-studio-save[data-state=SAVING]{color:#fde68a}.ck-crowdy-studio-save[data-state=CONFLICT]{color:#fca5a5;border-color:#f87171}.ck-crowdy-studio-save[data-state=OFFLINE]{color:#fdba74;border-color:#fb923c}
+.ck-crowdy-studio-save-message{margin:0;padding:4px 6px;color:var(--ck-muted);max-width:280px}
+.ck-crowdy-studio-save-actions{display:flex;gap:6px;padding:4px 6px}
+
+/* Menus */
+.ck-crowdy-studio-menu-wrap{position:relative;display:inline-flex;min-width:0}
+.ck-crowdy-studio-menu-button{max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
+.ck-crowdy-studio-menu{position:absolute;top:calc(100% + 4px);left:0;z-index:40;min-width:180px;max-width:320px;max-height:60vh;overflow:auto;display:flex;flex-direction:column;background:var(--ck-panel);border:1px solid var(--ck-line);border-radius:6px;padding:4px;box-shadow:0 8px 24px rgba(2,6,23,.55)}
+.ck-crowdy-studio-runtime-tools .ck-crowdy-studio-menu{left:auto;right:0}
+.ck-crowdy-studio-menu-item{display:block;width:100%;text-align:left;background:transparent;border:0;border-radius:4px;padding:6px 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
+.ck-crowdy-studio-menu-item:hover{background:#0f172a;border:0}
+.ck-crowdy-studio-menu-item[data-active=true]{color:#bae6fd}
+.ck-crowdy-studio-menu-divider{border-top:1px solid var(--ck-line);margin:4px 2px}
+
+/* New-project popover */
+.ck-crowdy-studio-new{display:none;position:absolute;top:100%;left:8px;z-index:35;gap:6px;align-items:center;padding:8px;background:var(--ck-panel);border:1px solid var(--ck-line);border-radius:6px;box-shadow:0 8px 24px rgba(2,6,23,.55)}
+.ck-crowdy-studio-new[data-open=true]{display:flex}
+.ck-crowdy-studio-new input{flex:1;min-width:160px}
+
+/* Workspace: rail + panes + editor */
+.ck-crowdy-studio-workspace{display:flex;flex:1;min-height:0;min-width:0;position:relative}
+.ck-crowdy-studio-rail{display:flex;flex-direction:column;gap:4px;padding:6px 3px;border-right:1px solid var(--ck-line);background:#0b1220}
+.ck-crowdy-studio-rail-button{writing-mode:vertical-rl;padding:8px 4px;background:transparent;border:1px solid transparent;color:var(--ck-muted);border-radius:4px}
+.ck-crowdy-studio-rail-button:hover{color:var(--ck-text)}
+.ck-crowdy-studio-rail-button[aria-pressed=true]{color:#bae6fd;border-color:var(--ck-line);background:#0f172a}
+.ck-crowdy-studio-explorer,.ck-crowdy-studio-settings{flex:none;background:var(--ck-panel);overflow:auto;padding:8px;min-width:0}
+.ck-crowdy-studio-settings{border-left:1px solid var(--ck-line)}
+.ck-crowdy-studio-settings h3{margin:0 0 8px}
+.ck-crowdy-studio-editor-column{display:flex;flex-direction:column;flex:1;min-width:240px;min-height:0}
+.ck-crowdy-studio-editor{flex:1;min-height:80px;position:relative}
+.ck-crowdy-studio-textarea{width:100%;height:100%;min-height:0;resize:none;background:#0b1020;color:var(--ck-text);border:0;padding:12px;font:13px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace}
+.ck-crowdy-studio-editor-notice{padding:4px 8px;background:#78350f;color:#ffedd5}
+
+/* Splitters */
+.ck-crowdy-studio-splitter{flex:none;background:transparent;position:relative;z-index:5}
+.ck-crowdy-studio-splitter[data-orientation=vertical]{width:6px;cursor:col-resize}
+.ck-crowdy-studio-splitter[data-orientation=horizontal]{height:6px;cursor:row-resize}
+.ck-crowdy-studio-splitter:hover,.ck-crowdy-studio-splitter[data-dragging=true]{background:var(--ck-accent);opacity:.5}
+
+/* Explorer */
+.ck-crowdy-studio-section{margin-bottom:12px}
+.ck-crowdy-studio-section-header{display:flex;align-items:center;justify-content:space-between;color:var(--ck-muted);font-weight:700;text-transform:uppercase;font-size:11px;margin-bottom:4px}
+.ck-crowdy-studio-file{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3px;align-items:center}
+.ck-crowdy-studio-file>button:first-child{text-align:left;overflow:hidden;text-overflow:ellipsis;border:0;background:transparent}
+.ck-crowdy-studio-file-action{padding:1px 6px}
+.ck-crowdy-studio-file .ck-crowdy-studio-menu{left:auto;right:0;min-width:130px}
+.ck-crowdy-studio-inline-form{display:flex;flex-wrap:wrap;gap:4px;margin:4px 0;padding:6px;border:1px solid var(--ck-line);border-radius:4px;background:#0f172a}
+.ck-crowdy-studio-inline-form input{flex:1 1 100%;min-width:0}
+.ck-crowdy-studio-file-form-row{display:flex;flex-wrap:wrap;gap:4px;align-items:center;margin:4px 0;padding:6px;border:1px solid #f59e0b66;border-radius:4px}
+
+/* Editor tabs */
+.ck-crowdy-studio-tabs{display:flex;align-items:center;gap:6px;padding:4px;border-bottom:1px solid var(--ck-line);overflow:auto}
+.ck-crowdy-studio-tab{white-space:nowrap}
+.ck-crowdy-studio-tab[data-active=true],.ck-crowdy-studio-panel-tab[data-active=true]{border-color:var(--ck-accent);color:#bae6fd}
+.ck-crowdy-studio-tab span{margin-left:7px;color:var(--ck-muted)}
+
+/* Settings */
+.ck-crowdy-studio-settings label{display:grid;gap:3px;margin-bottom:9px;color:var(--ck-muted)}
+.ck-crowdy-studio-settings input,.ck-crowdy-studio-settings select{width:100%}
+
+/* Bottom panel */
+.ck-crowdy-studio-bottom{flex:none;display:flex;flex-direction:column;min-height:0;border-top:1px solid var(--ck-line)}
+.ck-crowdy-studio-panel-tabs{display:flex;align-items:center;gap:6px;padding:5px 7px;border-bottom:1px solid var(--ck-line)}
+.ck-crowdy-studio-panel-hide{margin-left:auto;padding:1px 7px;color:var(--ck-muted)}
+.ck-crowdy-studio-panel-body{flex:1;min-height:0;display:flex;flex-direction:column}
+.ck-crowdy-studio-panel{display:none;flex:1;overflow:auto;padding:8px}
+.ck-crowdy-studio-panel[data-active=true]{display:block}
+.ck-crowdy-studio-panel pre{white-space:pre-wrap;margin:0;font:12px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace}
+.ck-crowdy-studio-problem{display:grid;grid-template-columns:auto auto 1fr;gap:8px;padding:3px;border-bottom:1px solid #243247;width:100%;text-align:left;background:transparent;border-left:0;border-right:0;border-top:0;border-radius:0}
+.ck-crowdy-studio-problem[data-source=rustc]{color:#fecaca}
+.ck-crowdy-studio-problem[data-source=local-advisory]{color:#fde68a}
+.ck-crowdy-studio-invoke{display:grid;grid-template-columns:180px 1fr auto;gap:6px}
+.ck-crowdy-studio-invoke textarea{min-height:70px;background:#0f172a;color:var(--ck-text);border:1px solid var(--ck-line)}
+.ck-crowdy-studio-empty{color:var(--ck-muted);padding:8px}
+
+/* Status bar */
+.ck-crowdy-studio-statusbar{display:flex;align-items:center;gap:14px;padding:3px 10px;border-top:1px solid var(--ck-line);background:#0b1220;font-size:12px;min-height:24px}
+.ck-crowdy-studio-status{color:var(--ck-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
+.ck-crowdy-studio-statusbar-runtime{background:transparent;border:0;padding:1px 4px;border-radius:3px}
+.ck-crowdy-studio-statusbar-runtime:hover{color:var(--ck-text)}
+.ck-crowdy-studio-statusbar-runtime[data-phase=RUNNING]{color:#86efac}
+.ck-crowdy-studio-statusbar-runtime[data-phase=COMPILING],.ck-crowdy-studio-statusbar-runtime[data-phase=TESTING_DRAFT],.ck-crowdy-studio-statusbar-runtime[data-phase=DEPLOYING_LIVE],.ck-crowdy-studio-statusbar-runtime[data-phase=ENABLING]{color:#fde68a}
+.ck-crowdy-studio-statusbar-runtime[data-phase=COMPILE_FAILED],.ck-crowdy-studio-statusbar-runtime[data-phase=ERROR],.ck-crowdy-studio-statusbar-runtime[data-phase=PARTIAL_FAILURE]{color:#fca5a5}
+
+/* Agent dock */
+.ck-crowdy-studio-agent-dock{flex:none;display:flex;flex-direction:column;gap:8px;min-width:0;min-height:0;padding:10px;border-left:1px solid var(--ck-line);background:#0b1220;overflow:auto}
+.ck-crowdy-studio-agent-dock header{display:flex;align-items:center;justify-content:space-between;gap:8px}
+.ck-crowdy-studio-agent-dock h2,.ck-crowdy-studio-agent-dock h3{margin:0;font-size:13px}
+.ck-crowdy-studio-agent-status,.ck-crowdy-studio-agent-budget,.ck-crowdy-studio-agent-lease{color:var(--ck-muted);font-size:12px}
+.ck-crowdy-studio-agent-lease[data-active=true]{color:#fde68a;border:1px solid #f59e0b;border-radius:5px;padding:6px}
+.ck-crowdy-studio-agent-controls-row{display:flex;align-items:center;justify-content:space-between;gap:6px;flex-wrap:wrap}
+.ck-crowdy-studio-agent-modes,.ck-crowdy-studio-agent-controls{display:flex;gap:5px;flex-wrap:wrap}
+.ck-crowdy-studio-agent-modes button[data-active=true]{border-color:var(--ck-accent);color:#bae6fd}
+.ck-crowdy-studio-agent-stop{border-color:#ef4444!important;color:#fecaca!important}
+.ck-crowdy-studio-agent-disclosure{border:1px solid var(--ck-line);border-radius:5px;padding:0}
+.ck-crowdy-studio-agent-disclosure>summary{cursor:pointer;padding:6px 8px;color:var(--ck-muted)}
+.ck-crowdy-studio-agent-disclosure[open]>summary{border-bottom:1px solid var(--ck-line);color:var(--ck-text)}
+.ck-crowdy-studio-agent-disclosure>:not(summary){padding:6px 8px}
+.ck-crowdy-studio-agent-lease-controls{display:flex;gap:6px;flex-wrap:wrap;margin:0;padding:7px;border:1px solid var(--ck-line)}
+.ck-crowdy-studio-agent-lease-controls legend{color:var(--ck-muted)}
+.ck-crowdy-studio-agent-lease-controls label{display:flex;gap:3px;align-items:center}
+.ck-crowdy-studio-agent-messages{display:flex;flex-direction:column;gap:6px;flex:1;min-height:120px;overflow:auto}
+.ck-crowdy-studio-agent-message,.ck-crowdy-studio-agent-stream,.ck-crowdy-studio-agent-approval,.ck-crowdy-studio-agent-diff,.ck-crowdy-studio-agent-checkpoint{padding:7px;border:1px solid var(--ck-line);border-radius:5px;background:var(--ck-panel)}
+.ck-crowdy-studio-agent-message[data-role=USER]{border-color:#155e75}
+.ck-crowdy-studio-agent-message p,.ck-crowdy-studio-agent-approval p,.ck-crowdy-studio-agent-diff p,.ck-crowdy-studio-agent-checkpoint p{margin:3px 0;white-space:pre-wrap;overflow-wrap:anywhere}
+.ck-crowdy-studio-agent-timeline{display:grid;gap:5px;margin:0;padding-left:22px;max-height:190px;overflow:auto}
+.ck-crowdy-studio-agent-timeline li{padding:4px;border-bottom:1px solid #243247}
+.ck-crowdy-studio-agent-timeline li>span{margin-left:6px;color:var(--ck-muted)}
+.ck-crowdy-studio-agent-approvals,.ck-crowdy-studio-agent-checkpoints{display:grid;gap:7px}
+.ck-crowdy-studio-agent-approval{border-color:#f59e0b}
+.ck-crowdy-studio-agent-approval code{display:block;overflow-wrap:anywhere;color:#fde68a}
+.ck-crowdy-studio-agent-approval>div{display:flex;gap:6px}
+.ck-crowdy-studio-agent-composer{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px}
+.ck-crowdy-studio-agent-composer textarea{min-height:62px;resize:vertical;background:#0f172a;color:var(--ck-text);border:1px solid var(--ck-line);padding:7px}
+.ck-crowdy-studio :focus-visible{outline:2px solid var(--ck-accent);outline-offset:2px}
+
+/* Narrow widths: side panes become overlays so the editor keeps priority. */
+@container(max-width:900px){.ck-crowdy-studio-settings{position:absolute;right:0;top:0;bottom:0;z-index:20;max-width:85%;border-left:1px solid var(--ck-line);box-shadow:-8px 0 24px rgba(2,6,23,.55)}.ck-crowdy-studio-splitter[data-orientation=vertical]{display:none}}
+@container(max-width:760px){.ck-crowdy-studio-agent-dock{position:absolute;right:0;top:0;bottom:0;z-index:22;max-width:92%;box-shadow:-8px 0 24px rgba(2,6,23,.55)}}
+@container(max-width:620px){.ck-crowdy-studio-explorer{position:absolute;left:34px;top:0;bottom:0;z-index:21;max-width:85%;border-right:1px solid var(--ck-line);box-shadow:8px 0 24px rgba(2,6,23,.55)}}
 `;