@elench/shell 0.1.8 → 0.1.10

package/README.md

@@ -1,27 +1,27 @@
 # @elench/shell
 
-Avocado's desktop shell extracted into a reusable React package.
+Reusable React shell for Elench desktop-style workspaces.
 
 The package owns the shell frame, FlexLayout substrate, activity rail, sidebar,
 workspace tabs, inspector, search bar, status bar, keyboard shortcuts, state
-persistence, and Avocado shell styling. Product code consumes only the public
+persistence, and shell styling. Product code consumes only the public
 API exported from `@elench/shell`.
 
 ## Public API
 
 ```tsx
 import {
-  ShellApp,
-  defineShellApp,
-  defineShellSection,
-  defineShellTab,
+  ShellWorkbench,
+  defineWorkbenchApp,
+  defineWorkbenchTab,
 } from "@elench/shell";
 import "@elench/shell/styles.css";
 ```
 
-Studio/product code defines sections and tabs. The shell adapts those
-definitions into the Avocado shell internals; consumers should not import
-FlexLayout, shell internals, or package source paths directly.
+Product code defines sections, tabs, resources, commands, and declarative view
+nodes. The shell adapts those definitions into its internal layout substrate;
+consumers should not import FlexLayout, shell internals, package source paths,
+or UI primitives directly.
 
 ## Commands
 

package/dist/components/shell/primitives/sidebar-new-button.js

@@ -4,6 +4,6 @@ import { cn } from "../../../lib/utils.js";
 import { useShellSurface } from "./shell-surface.js";
 export function SidebarNewButton({ className, noun, type = "button", ...props }) {
     const { isCompact, isNarrow } = useShellSurface();
-    return (_jsxs("button", { className: cn("mx-0.5 mt-1 mb-1.5 flex w-[calc(100%-4px)] items-center justify-center gap-1.5 rounded-[7px] bg-bg-elevated px-3 py-[7px] text-[12px] font-medium text-fg-secondary transition-all", "hover:bg-bg-hover hover:text-fg", "active:translate-y-px active:bg-bg-active", "disabled:pointer-events-none disabled:opacity-50", isCompact && "mt-0.5 mb-1 px-2.5 py-1.5", isNarrow && "mx-0 mt-0.5 w-full gap-1 px-2 py-1.5 text-[11.5px]", className), type: type, ...props, children: [_jsx(PlusIcon, { className: cn("size-3.5", isNarrow && "size-3") }), _jsxs("span", { className: "min-w-0 truncate", children: ["New ", noun] })] }));
+    return (_jsxs("button", { className: cn("mx-0.5 mt-1 mb-1.5 flex w-[calc(100%-4px)] items-center justify-center gap-1.5 rounded-[7px] border border-border bg-bg-elevated px-3 py-[7px] text-[12px] font-semibold tracking-[0.01em] text-fg-secondary transition-all", "hover:border-border-light hover:bg-bg-hover hover:text-fg", "active:translate-y-px active:bg-bg-active", "disabled:pointer-events-none disabled:opacity-50", isCompact && "mt-0.5 mb-1 px-2.5 py-1.5", isNarrow && "mx-0 mt-0.5 w-full gap-1 px-2 py-1.5 text-[11.5px]", className), type: type, ...props, children: [_jsx(PlusIcon, { className: cn("size-3.5", isNarrow && "size-3") }), _jsxs("span", { className: "min-w-0 truncate", children: ["New ", noun] })] }));
 }
 //# sourceMappingURL=sidebar-new-button.js.map

package/dist/components/shell/primitives/sidebar-new-button.js.map

@@ -1 +1 @@
-{"version":3,"file":"sidebar-new-button.js","sourceRoot":"","sources":["../../../../src/components/shell/primitives/sidebar-new-button.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AACxC,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AACjC,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AASlD,MAAM,UAAU,gBAAgB,CAAC,EAC/B,SAAS,EACT,IAAI,EACJ,IAAI,GAAG,QAAQ,EACf,GAAG,KAAK,EACc;IACtB,MAAM,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,eAAe,EAAE,CAAC;IAElD,OAAO,CACL,kBACE,SAAS,EAAE,EAAE,CACX,oLAAoL,EACpL,iCAAiC,EACjC,2CAA2C,EAC3C,kDAAkD,EAClD,SAAS,IAAI,2BAA2B,EACxC,QAAQ,IAAI,oDAAoD,EAChE,SAAS,CACV,EACD,IAAI,EAAE,IAAI,KACN,KAAK,aAET,KAAC,QAAQ,IAAC,SAAS,EAAE,EAAE,CAAC,UAAU,EAAE,QAAQ,IAAI,QAAQ,CAAC,GAAI,EAC7D,gBAAM,SAAS,EAAC,kBAAkB,qBAAM,IAAI,IAAQ,IAC7C,CACV,CAAC;AACJ,CAAC"}
+{"version":3,"file":"sidebar-new-button.js","sourceRoot":"","sources":["../../../../src/components/shell/primitives/sidebar-new-button.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AACxC,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AACjC,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AASlD,MAAM,UAAU,gBAAgB,CAAC,EAC/B,SAAS,EACT,IAAI,EACJ,IAAI,GAAG,QAAQ,EACf,GAAG,KAAK,EACc;IACtB,MAAM,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,eAAe,EAAE,CAAC;IAElD,OAAO,CACL,kBACE,SAAS,EAAE,EAAE,CACX,6NAA6N,EAC7N,2DAA2D,EAC3D,2CAA2C,EAC3C,kDAAkD,EAClD,SAAS,IAAI,2BAA2B,EACxC,QAAQ,IAAI,oDAAoD,EAChE,SAAS,CACV,EACD,IAAI,EAAE,IAAI,KACN,KAAK,aAET,KAAC,QAAQ,IAAC,SAAS,EAAE,EAAE,CAAC,UAAU,EAAE,QAAQ,IAAI,QAAQ,CAAC,GAAI,EAC7D,gBAAM,SAAS,EAAC,kBAAkB,qBAAM,IAAI,IAAQ,IAC7C,CACV,CAAC;AACJ,CAAC"}

package/dist/index.d.ts

@@ -1,3 +1,6 @@
-export { ShellApp, ShellEmptyState, ShellField, ShellMetric, ShellPage, ShellSidebar, ShellSidebarItem, ShellSidebarNewButton, ShellSidebarSection, defineShellApp, defineShellSection, defineShellTab, useShellController, } from "./public-api.js";
-export type { DefineShellSectionInput, ShellActionMeta, ShellAppDefinition, ShellAppProps, ShellController, ShellRenderContext, ShellSectionDefinition, ShellSidebarContext, ShellTab, ShellTabTarget, ShellTabTone, } from "./public-api.js";
+export { ShellErrorBoundaryView, ShellWorkbench, defineWorkbenchApp, defineWorkbenchTab, } from "./workbench.js";
+export type { ShellTabTarget, ShellTabTone } from "./lib/shell/types.js";
+export type { ShellCommandDefinition, ShellCommandHelpers, ShellCommandState, ShellInspectorField, ShellMetricDefinition, ShellResourceDefinition, ShellResourceState, ShellRowDefinition, ShellRowStatus, ShellSidebarItemDefinition, ShellSidebarNewDefinition, ShellSidebarSectionDefinition, ShellTabInput, ShellTransport, ShellViewContext, ShellViewNode, ShellWorkbenchAppDefinition, ShellWorkbenchSectionDefinition, ShellWorkbenchTab, } from "./workbench.js";
+export { createShellApiClient, ShellApiError } from "./lib/shell/api.js";
+export type { ShellApiClientOptions, ShellApiRequestInit, ShellApiResponseType, } from "./lib/shell/api.js";
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,QAAQ,EACR,eAAe,EACf,UAAU,EACV,WAAW,EACX,SAAS,EACT,YAAY,EACZ,gBAAgB,EAChB,qBAAqB,EACrB,mBAAmB,EACnB,cAAc,EACd,kBAAkB,EAClB,cAAc,EACd,kBAAkB,GACnB,MAAM,iBAAiB,CAAC;AACzB,YAAY,EACV,uBAAuB,EACvB,eAAe,EACf,kBAAkB,EAClB,aAAa,EACb,eAAe,EACf,kBAAkB,EAClB,sBAAsB,EACtB,mBAAmB,EACnB,QAAQ,EACR,cAAc,EACd,YAAY,GACb,MAAM,iBAAiB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,sBAAsB,EACtB,cAAc,EACd,kBAAkB,EAClB,kBAAkB,GACnB,MAAM,gBAAgB,CAAC;AACxB,YAAY,EAAE,cAAc,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACzE,YAAY,EACV,sBAAsB,EACtB,mBAAmB,EACnB,iBAAiB,EACjB,mBAAmB,EACnB,qBAAqB,EACrB,uBAAuB,EACvB,kBAAkB,EAClB,kBAAkB,EAClB,cAAc,EACd,0BAA0B,EAC1B,yBAAyB,EACzB,6BAA6B,EAC7B,aAAa,EACb,cAAc,EACd,gBAAgB,EAChB,aAAa,EACb,2BAA2B,EAC3B,+BAA+B,EAC/B,iBAAiB,GAClB,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,oBAAoB,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AACzE,YAAY,EACV,qBAAqB,EACrB,mBAAmB,EACnB,oBAAoB,GACrB,MAAM,oBAAoB,CAAC"}

package/dist/index.js

@@ -1,2 +1,3 @@
-export { ShellApp, ShellEmptyState, ShellField, ShellMetric, ShellPage, ShellSidebar, ShellSidebarItem, ShellSidebarNewButton, ShellSidebarSection, defineShellApp, defineShellSection, defineShellTab, useShellController, } from "./public-api.js";
+export { ShellErrorBoundaryView, ShellWorkbench, defineWorkbenchApp, defineWorkbenchTab, } from "./workbench.js";
+export { createShellApiClient, ShellApiError } from "./lib/shell/api.js";
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,QAAQ,EACR,eAAe,EACf,UAAU,EACV,WAAW,EACX,SAAS,EACT,YAAY,EACZ,gBAAgB,EAChB,qBAAqB,EACrB,mBAAmB,EACnB,cAAc,EACd,kBAAkB,EAClB,cAAc,EACd,kBAAkB,GACnB,MAAM,iBAAiB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,sBAAsB,EACtB,cAAc,EACd,kBAAkB,EAClB,kBAAkB,GACnB,MAAM,gBAAgB,CAAC;AAuBxB,OAAO,EAAE,oBAAoB,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC"}

package/dist/lib/shell/api.d.ts

@@ -0,0 +1,17 @@
+export declare class ShellApiError extends Error {
+    status: number;
+    body?: unknown | undefined;
+    constructor(status: number, message: string, body?: unknown | undefined);
+}
+export type ShellApiResponseType = "json" | "text" | "blob" | "arrayBuffer" | "void";
+export type ShellApiRequestInit = RequestInit & {
+    json?: unknown;
+    responseType?: ShellApiResponseType;
+};
+export type ShellApiClientOptions = {
+    baseUrl?: string;
+    getToken?: () => string | null | Promise<string | null>;
+    getTraceId?: () => string;
+};
+export declare function createShellApiClient({ baseUrl, getToken, getTraceId, }?: ShellApiClientOptions): <T>(path: string, init?: ShellApiRequestInit) => Promise<T>;
+//# sourceMappingURL=api.d.ts.map

package/dist/lib/shell/api.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"api.d.ts","sourceRoot":"","sources":["../../../src/lib/shell/api.ts"],"names":[],"mappings":"AAIA,qBAAa,aAAc,SAAQ,KAAK;IAE7B,MAAM,EAAE,MAAM;IAEd,IAAI,CAAC,EAAE,OAAO;gBAFd,MAAM,EAAE,MAAM,EACrB,OAAO,EAAE,MAAM,EACR,IAAI,CAAC,EAAE,OAAO,YAAA;CAIxB;AAED,MAAM,MAAM,oBAAoB,GAC5B,MAAM,GACN,MAAM,GACN,MAAM,GACN,aAAa,GACb,MAAM,CAAC;AAEX,MAAM,MAAM,mBAAmB,GAAG,WAAW,GAAG;IAC9C,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,YAAY,CAAC,EAAE,oBAAoB,CAAC;CACrC,CAAC;AAEF,MAAM,MAAM,qBAAqB,GAAG;IAClC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,MAAM,GAAG,IAAI,GAAG,OAAO,CAAC,MAAM,GAAG,IAAI,CAAC,CAAC;IACxD,UAAU,CAAC,EAAE,MAAM,MAAM,CAAC;CAC3B,CAAC;AAoDF,wBAAgB,oBAAoB,CAAC,EACnC,OAAY,EACZ,QAAQ,EACR,UAA4B,GAC7B,GAAE,qBAA0B,IACS,CAAC,EACnC,MAAM,MAAM,EACZ,OAAO,mBAAmB,KACzB,OAAO,CAAC,CAAC,CAAC,CAkDd"}

package/dist/lib/shell/api.js

@@ -0,0 +1,93 @@
+import { logger, sessionId } from "../infra/logger.js";
+const apiLog = logger.named("api");
+export class ShellApiError extends Error {
+    constructor(status, message, body) {
+        super(message);
+        this.status = status;
+        this.body = body;
+    }
+}
+function resolveUrl(baseUrl, path) {
+    if (/^https?:\/\//.test(path))
+        return path;
+    const normalizedBase = baseUrl.endsWith("/") ? baseUrl.slice(0, -1) : baseUrl;
+    const normalizedPath = path.startsWith("/") ? path : `/${path}`;
+    return `${normalizedBase}${normalizedPath}`;
+}
+function headersFrom(initHeaders) {
+    return new Headers(initHeaders);
+}
+async function parseResponse(response, responseType, method) {
+    if (response.status === 204 || response.status === 205 || method === "HEAD") {
+        return undefined;
+    }
+    const resolvedType = responseType ??
+        (response.headers.get("content-type")?.includes("application/json")
+            ? "json"
+            : "text");
+    switch (resolvedType) {
+        case "void":
+            return undefined;
+        case "text":
+            return (await response.text());
+        case "blob":
+            return (await response.blob());
+        case "arrayBuffer":
+            return (await response.arrayBuffer());
+        case "json":
+        default:
+            return (await response.json());
+    }
+}
+async function parseErrorBody(response) {
+    const contentType = response.headers.get("content-type") ?? "";
+    if (contentType.includes("application/json")) {
+        return response.json().catch(() => null);
+    }
+    const text = await response.text().catch(() => "");
+    return text || null;
+}
+export function createShellApiClient({ baseUrl = "", getToken, getTraceId = () => sessionId, } = {}) {
+    return async function shellApiFetch(path, init) {
+        const body = init?.json !== undefined
+            ? JSON.stringify(init.json)
+            : (init?.body ?? null);
+        const method = init?.method ?? "GET";
+        const headers = headersFrom(init?.headers);
+        const token = getToken ? await getToken() : null;
+        headers.set("X-Session-ID", getTraceId());
+        if (token && !headers.has("Authorization")) {
+            headers.set("Authorization", `Bearer ${token}`);
+        }
+        if (init?.json !== undefined &&
+            body !== null &&
+            body !== undefined &&
+            !headers.has("Content-Type")) {
+            headers.set("Content-Type", "application/json");
+        }
+        const start = performance.now();
+        const url = resolveUrl(baseUrl, path);
+        const response = await fetch(url, { ...init, body, headers });
+        const durationMs = Math.round(performance.now() - start);
+        apiLog
+            .event("api.request")
+            .setMany({
+            method,
+            path,
+            status: response.status,
+            duration_ms: durationMs,
+        })
+            .setLevel(response.status >= 500 ? "error" : "info")
+            .send();
+        if (!response.ok) {
+            const errorBody = await parseErrorBody(response);
+            const message = typeof errorBody === "string"
+                ? errorBody
+                : (errorBody?.error ??
+                    response.statusText);
+            throw new ShellApiError(response.status, message, errorBody);
+        }
+        return parseResponse(response, init?.responseType, method);
+    };
+}
+//# sourceMappingURL=api.js.map

package/dist/lib/shell/api.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"api.js","sourceRoot":"","sources":["../../../src/lib/shell/api.ts"],"names":[],"mappings":"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"}

package/dist/styles.css

@@ -1,6 +1,6 @@
 @import "flexlayout-react/style/light.css";
 
-/* ═══════ FlexLayout Avocado Theme ═══════ */
+/* ═══════ FlexLayout Shell Theme ═══════ */
 
 .flexlayout__layout {
   --color-text: var(--fg);
@@ -345,3 +345,408 @@
   background: var(--fg-tertiary);
   border-radius: 4px;
 }
+
+@custom-variant dark (&:where(.dark, .dark *, .theme-carbon, .theme-carbon *, .theme-dark, .theme-dark *, .theme-night-owl, .theme-night-owl *));
+
+/* ── Theme foundation ─────────────────────────────────────────────── */
+:root {
+  --font-geist-sans: "Geist Variable";
+  --font-geist-mono: "Geist Mono Variable";
+  --transition: 150ms ease;
+  --radius: 0.5rem;
+
+  /* Canonical semantic tokens default to Studio carbon. */
+  --background: #0a1120;
+  --foreground: #e5edf7;
+  --card: #162236;
+  --card-foreground: #e5edf7;
+  --popover: #162236;
+  --popover-foreground: #e5edf7;
+  --primary: #3b82f6;
+  --primary-foreground: #f8fbff;
+  --secondary: #0f172a;
+  --secondary-foreground: #e5edf7;
+  --muted: #0f172a;
+  --muted-foreground: #73839b;
+  --accent: #1e3050;
+  --accent-foreground: #e5edf7;
+  --destructive: #ef4444;
+  --destructive-foreground: #fef2f2;
+  --border: #1e2d44;
+  --input: #1e2d44;
+  --ring: #3b82f6;
+
+  /* Product-specific tokens that do not map cleanly to generic semantics. */
+  --fg-80: rgba(229, 237, 247, 0.8);
+  --fg-secondary: #a8b5c7;
+  --fg-tertiary: #73839b;
+  --fg-inverse: #0a1120;
+  --border-light: #2a3f5f;
+  --primary-hover: #2563eb;
+  --primary-rgb: 59, 130, 246;
+
+  --status-ok: rgb(34, 197, 94);
+  --status-ok-bg: rgba(34, 197, 94, 0.1);
+  --status-ok-border: rgba(34, 197, 94, 0.28);
+  --status-err: rgb(239, 68, 68);
+  --status-err-bg: rgba(239, 68, 68, 0.1);
+  --status-err-border: rgba(239, 68, 68, 0.28);
+  --status-warn: rgb(245, 158, 11);
+  --status-warn-bg: rgba(245, 158, 11, 0.1);
+  --status-warn-border: rgba(245, 158, 11, 0.28);
+  --status-info: rgb(56, 189, 248);
+  --status-info-bg: rgba(56, 189, 248, 0.1);
+  --status-info-border: rgba(56, 189, 248, 0.28);
+  --status-debug: #7a8499;
+  --status-debug-bg: rgba(122, 132, 153, 0.1);
+  --status-muted: var(--fg-tertiary);
+  --status-auto: rgb(59, 130, 246);
+  --status-auto-bg: rgba(59, 130, 246, 0.12);
+  --status-auto-border: rgba(59, 130, 246, 0.28);
+
+  --chart-1: #93c5fd;
+  --chart-2: #60a5fa;
+  --chart-3: #38bdf8;
+  --chart-4: #22c55e;
+  --chart-5: #f59e0b;
+
+  /* Shell aliases derived from semantic tokens. */
+  --bg-primary: var(--background);
+  --bg-secondary: var(--secondary);
+  --bg-card: var(--card);
+  --bg-muted: var(--muted);
+  --bg-hover: var(--accent);
+  --bg-base: var(--background);
+  --bg-surface: var(--secondary);
+  --bg-elevated: #1b2a42;
+  --bg-active: #1a2d4a;
+  --fg: var(--foreground);
+  --fg-muted: var(--fg-tertiary);
+  --primary-muted: rgba(var(--primary-rgb), 0.12);
+  --shell-gap: 6px;
+  --shell-radius: 8px;
+  --border-subtle: #172338;
+  --border-strong: var(--border-light);
+  --ok: var(--status-ok);
+  --warn: var(--status-warn);
+  --error: var(--status-err);
+  --info: var(--status-info);
+  --ok-glow: rgba(34, 197, 94, 0.3);
+  --warn-glow: rgba(245, 158, 11, 0.3);
+  --error-glow: rgba(239, 68, 68, 0.3);
+  --info-glow: rgba(56, 189, 248, 0.3);
+  --error-bg: rgba(239, 68, 68, 0.1);
+
+  /* Brand gradients */
+  --gradient-brand: linear-gradient(135deg, #22c55e 0%, #3b82f6 100%);
+  --gradient-cta: linear-gradient(
+    135deg,
+    #3b82f6 0%,
+    #2563eb 50%,
+    #1d4ed8 100%
+  );
+
+  --sidebar: var(--secondary);
+  --sidebar-foreground: var(--foreground);
+  --sidebar-primary: var(--primary);
+  --sidebar-primary-foreground: var(--primary-foreground);
+  --sidebar-accent: var(--accent);
+  --sidebar-accent-foreground: var(--accent-foreground);
+  --sidebar-border: var(--border);
+  --sidebar-ring: var(--ring);
+}
+
+.theme-carbon {
+}
+
+.theme-light {
+  --gradient-brand: linear-gradient(135deg, #16a34a 0%, #2563eb 100%);
+  --gradient-cta: linear-gradient(
+    135deg,
+    #2563eb 0%,
+    #1d4ed8 50%,
+    #1e40af 100%
+  );
+
+  --background: #f8fafc;
+  --foreground: #0f172a;
+  --card: #ffffff;
+  --card-foreground: #0f172a;
+  --popover: #ffffff;
+  --popover-foreground: #0f172a;
+  --primary: #2563eb;
+  --primary-foreground: #eff6ff;
+  --secondary: #f1f5f9;
+  --secondary-foreground: #0f172a;
+  --muted: #f8fafc;
+  --muted-foreground: #64748b;
+  --accent: #e2e8f0;
+  --accent-foreground: #0f172a;
+  --destructive: #dc2626;
+  --destructive-foreground: #fef2f2;
+  --border: #dbe4f0;
+  --input: #dbe4f0;
+  --ring: #2563eb;
+
+  --fg-80: rgba(15, 23, 42, 0.8);
+  --fg-secondary: #475569;
+  --fg-tertiary: #64748b;
+  --fg-inverse: #ffffff;
+  --border-light: #cbd5e1;
+  --primary-hover: #1d4ed8;
+  --primary-rgb: 37, 99, 235;
+
+  --chart-1: #2563eb;
+  --chart-2: #0f766e;
+  --chart-3: #ea580c;
+  --chart-4: #7c3aed;
+  --chart-5: #dc2626;
+}
+
+.theme-dark {
+  --background: #111827;
+  --foreground: #e2e8f0;
+  --card: #1b273a;
+  --card-foreground: #e2e8f0;
+  --popover: #1b273a;
+  --popover-foreground: #e2e8f0;
+  --primary: #3b82f6;
+  --primary-foreground: #eff6ff;
+  --secondary: #182235;
+  --secondary-foreground: #e2e8f0;
+  --muted: #152033;
+  --muted-foreground: #64748b;
+  --accent: #21314a;
+  --accent-foreground: #e2e8f0;
+  --destructive: #ef4444;
+  --destructive-foreground: #fef2f2;
+  --border: #283548;
+  --input: #283548;
+  --ring: #3b82f6;
+
+  --fg-80: rgba(226, 232, 240, 0.8);
+  --fg-secondary: #94a3b8;
+  --fg-tertiary: #64748b;
+  --fg-inverse: #111827;
+  --border-light: #334155;
+  --primary-hover: #60a5fa;
+  --primary-rgb: 59, 130, 246;
+
+  --chart-1: #60a5fa;
+  --chart-2: #34d399;
+  --chart-3: #f59e0b;
+  --chart-4: #f472b6;
+  --chart-5: #a78bfa;
+}
+
+.theme-night-owl {
+  --gradient-brand: linear-gradient(135deg, #7fdbca 0%, #82aaff 100%);
+  --gradient-cta: linear-gradient(
+    135deg,
+    #82aaff 0%,
+    #6b93e8 50%,
+    #5a82d8 100%
+  );
+
+  --background: #011627;
+  --foreground: #d6deeb;
+  --card: #022e4c;
+  --card-foreground: #d6deeb;
+  --popover: #022e4c;
+  --popover-foreground: #d6deeb;
+  --primary: #82aaff;
+  --primary-foreground: #011627;
+  --secondary: #01243d;
+  --secondary-foreground: #d6deeb;
+  --muted: #01243d;
+  --muted-foreground: #637777;
+  --accent: #033558;
+  --accent-foreground: #d6deeb;
+  --destructive: #ff6363;
+  --destructive-foreground: #1a2330;
+  --border: #1d3b53;
+  --input: #1d3b53;
+  --ring: #82aaff;
+
+  --fg-80: rgba(214, 222, 235, 0.8);
+  --fg-secondary: #7fdbca;
+  --fg-tertiary: #637777;
+  --fg-inverse: #011627;
+  --border-light: #234e6d;
+  --primary-hover: #a3c1ff;
+  --primary-rgb: 130, 170, 255;
+
+  --chart-1: #82aaff;
+  --chart-2: #7fdbca;
+  --chart-3: #ecc48d;
+  --chart-4: #c792ea;
+  --chart-5: #f78c6c;
+}
+
+/* ── Tailwind v4 theme bridge ────────────────────────────────────── */
+@theme inline {
+  --font-sans: var(--font-geist-sans);
+  --font-heading: var(--font-geist-sans);
+  --font-mono: var(--font-geist-mono);
+
+  --color-background: var(--background);
+  --color-foreground: var(--foreground);
+  --color-card: var(--card);
+  --color-card-foreground: var(--card-foreground);
+  --color-popover: var(--popover);
+  --color-popover-foreground: var(--popover-foreground);
+  --color-primary: var(--primary);
+  --color-primary-foreground: var(--primary-foreground);
+  --color-secondary: var(--secondary);
+  --color-secondary-foreground: var(--secondary-foreground);
+  --color-muted: var(--muted);
+  --color-muted-foreground: var(--muted-foreground);
+  --color-accent: var(--accent);
+  --color-accent-foreground: var(--accent-foreground);
+  --color-destructive: var(--destructive);
+  --color-input: var(--input);
+  --color-border: var(--border);
+  --color-ring: var(--ring);
+
+  --color-bg-primary: var(--bg-primary);
+  --color-bg-secondary: var(--bg-secondary);
+  --color-bg-base: var(--bg-base);
+  --color-bg-surface: var(--bg-surface);
+  --color-bg-card: var(--bg-card);
+  --color-bg-muted: var(--bg-muted);
+  --color-bg-hover: var(--bg-hover);
+  --color-bg-elevated: var(--bg-elevated);
+  --color-bg-active: var(--bg-active);
+  --color-fg: var(--fg);
+  --color-fg-secondary: var(--fg-secondary);
+  --color-fg-tertiary: var(--fg-tertiary);
+  --color-fg-inverse: var(--fg-inverse);
+  --color-primary-hover: var(--primary-hover);
+  --color-border-light: var(--border-light);
+  --color-border-subtle: var(--border-subtle);
+  --color-border-strong: var(--border-strong);
+
+  --color-status-ok: var(--status-ok);
+  --color-status-ok-bg: var(--status-ok-bg);
+  --color-status-err: var(--status-err);
+  --color-status-err-bg: var(--status-err-bg);
+  --color-status-warn: var(--status-warn);
+  --color-status-warn-bg: var(--status-warn-bg);
+  --color-status-info: var(--status-info);
+  --color-status-info-bg: var(--status-info-bg);
+
+  --color-chart-1: var(--chart-1);
+  --color-chart-2: var(--chart-2);
+  --color-chart-3: var(--chart-3);
+  --color-chart-4: var(--chart-4);
+  --color-chart-5: var(--chart-5);
+
+  --color-sidebar: var(--sidebar);
+  --color-sidebar-foreground: var(--sidebar-foreground);
+  --color-sidebar-primary: var(--sidebar-primary);
+  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
+  --color-sidebar-accent: var(--sidebar-accent);
+  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
+  --color-sidebar-border: var(--sidebar-border);
+  --color-sidebar-ring: var(--sidebar-ring);
+
+  --radius-sm: calc(var(--radius) * 0.6);
+  --radius-md: calc(var(--radius) * 0.8);
+  --radius-lg: var(--radius);
+  --radius-xl: calc(var(--radius) * 1.4);
+  --radius-2xl: calc(var(--radius) * 1.8);
+  --radius-3xl: calc(var(--radius) * 2.2);
+  --radius-4xl: calc(var(--radius) * 2.6);
+}
+
+/* ── Reset & base ───────────────────────────────────────────────── */
+* {
+  box-sizing: border-box;
+}
+
+html {
+  height: 100%;
+}
+
+body {
+  min-height: 100%;
+  background: var(--background);
+  color: var(--foreground);
+  font-family: var(--font-geist-sans), sans-serif;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  overflow: hidden;
+}
+
+.shell-viewport-y-gap {
+  padding-block: var(--shell-gap);
+}
+
+.shell-main-gap {
+  padding: var(--shell-gap);
+}
+
+.shell-main-gap-no-left {
+  padding: var(--shell-gap);
+  padding-left: 0;
+}
+
+.shell-surface-radius {
+  border-radius: var(--shell-radius);
+}
+
+::selection {
+  background: rgba(var(--primary-rgb), 0.28);
+}
+
+a {
+  color: inherit;
+  text-decoration: none;
+}
+
+:focus-visible {
+  outline: 2px solid var(--ring);
+  outline-offset: -2px;
+}
+
+::-webkit-scrollbar {
+  width: 6px;
+  height: 6px;
+}
+
+::-webkit-scrollbar-track {
+  background: transparent;
+}
+
+::-webkit-scrollbar-thumb {
+  background: var(--border-strong);
+  border-radius: 999px;
+}
+
+::-webkit-scrollbar-thumb:hover {
+  background: var(--fg-tertiary);
+}
+
+/* ── Keyframes ─────────────────────────────────────────────────── */
+@keyframes shimmer {
+  0% {
+    background-position: -200% 0;
+  }
+  100% {
+    background-position: 200% 0;
+  }
+}
+
+@layer base {
+  * {
+    @apply border-border outline-ring/50;
+  }
+
+  body {
+    @apply bg-background text-foreground;
+  }
+
+  html {
+    @apply font-sans;
+  }
+}