rivet-design 0.9.1 → 0.9.3

package/dist/utils/skills/cursor-rules.js

@@ -1,9 +1,19 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.CURSOR_RULES_CONTENT = exports.CURSOR_RULES_FILENAME = exports.CURSOR_RULES_VERSION = void 0;
-exports.CURSOR_RULES_VERSION = 12;
+const shared_variants_protocol_1 = require("./shared-variants-protocol");
+exports.CURSOR_RULES_VERSION = 18;
 exports.CURSOR_RULES_FILENAME = 'rivet.mdc';
 const CURSOR_RULES_VERSION_MARKER = `rivet-rules-version: ${exports.CURSOR_RULES_VERSION}`;
+const AGENT_VARIANTS_SECTION = (0, shared_variants_protocol_1.buildAgentVariantsSection)({
+    inChatEmphasis: 'in chat',
+    step9: `**Run all leased code-gen items IN PARALLEL** via parallel tool calls in a single response. For each:
+   - Read \`input.briefBody\` and \`input.target\`
+   - Edit files in \`input.worktreePath\` (each variant has its own isolated worktree)
+   - Call \`report_variant_complete({ sessionId, workItemId, leaseId, attempt, status: 'succeeded' })\`. On failure, status \`'failed'\` with error description.`,
+    step11Suffix: `When \`hasChanges: true\`, you'll see a \`VariantChangeItem\` in \`changes[]\`.`,
+    nativeGenLabel: 'Task tool',
+});
 exports.CURSOR_RULES_CONTENT = `---
 description: Rivet — apply when the user says "open rivet", "open the visual editor", "create variants", "show me options for X", "build me X from scratch", "create a new Y app", or wants to make visual/UI changes or explore design directions
 alwaysApply: false
@@ -15,14 +25,7 @@ Two flows: the **visual editor** (point-and-click changes to a running web app)
 
 > Tip: type \`@rivet.mdc\` in chat to invoke this rule manually.
 
-## Picking the flow
-
-| User says | Flow |
-|---|---|
-| "open rivet", "make a visual change to X" | **Visual editor** (below) |
-| "create variants of X", "show me 3-5 options for X", "explore approaches to X" | **Agent variants** |
-| "build me a settings page from scratch", "add a feature for Y" | **Agent variants** (no \`target\`) |
-| "create a new Vite todo app", "scaffold a Next.js dashboard" | **Agent variants** (\`projectContext.kind=fresh\`) |
+${shared_variants_protocol_1.PICKING_THE_FLOW_TABLE}
 
 ## Visual Editor flow
 
@@ -30,8 +33,8 @@ Two flows: the **visual editor** (point-and-click changes to a running web app)
 
 1. Call \`detect_project\` — returns project info including \`framework\` and \`projectPath\`
 2. Call \`open_visual_editor({ projectPath, framework })\` — do NOT pass \`startPort\` or any port; the tool handles port selection automatically
-4. Tell the user: "Rivet is ready — make your visual changes and click 'Send to Cursor'."
-5. Call \`watch_for_changes({ sessionId })\` to wait for the user's changes.
+3. Tell the user: "Rivet is ready — make your visual changes and click 'Send to Cursor'."
+4. Call \`watch_for_changes({ sessionId })\` to wait for the user's changes.
 
 ## Watching and applying
 
@@ -58,74 +61,6 @@ When the user says they're done, call \`close_visual_editor({ sessionId })\`.
 
 ---
 
-## Agent Variants flow
-
-For requests like *"create variants of X"*, *"show me 3-5 options for the dropdown"*, *"build me a settings page"*, or *"create a new Vite todo app"* — DO NOT generate variants natively via parallel tool calls. Use this protocol so the user reviews design directions in chat, sees the actual code variants render in parallel, and picks based on the rendered code.
-
-### Step-by-step
-
-1. **Call \`propose_variants\`** with:
-   - \`prompt\`: the user's request verbatim
-   - \`count\`: 3-5 (default 4)
-   - \`target\` (optional): \`{ type: 'element'|'file'|'route', ref }\` — set this for refinement requests pinned to a specific element/file/route
-   - \`projectContext\` (optional):
-     - For brand-new projects: \`{ kind: 'fresh', workspacePath: '/abs/path', framework: 'vite'|'next'|'astro'|'remix' }\`
-     - Otherwise omit (defaults to existing project)
-
-   Response: \`{ sessionId, briefWorkItem }\`. The brief work item carries an \`input\` blob; you must run it next.
-
-2. **Run the brief work item using YOUR own LLM** — generate \`count\` design briefs as \`{ briefId, label, body }\`. Label is short (≤ 4 words). Body is 1-2 sentences describing the design direction. Do NOT call any Rivet tool; this is your LLM doing creative work.
-
-3. **Call \`report_variant_briefs\`** with the briefs, plus the \`workItemId\` and \`attempt: 0\`.
-
-3.5. **Ensure the Rivet visual editor is open.** If you haven't already opened it in this session, call \`detect_project\` then \`open_visual_editor({ projectPath, framework })\` now — DON'T wait for the user to ask. The user will need the iframe open to see variants render. If a session is already active (\`open_visual_editor\` returns a friendly error), just continue. Once the editor opens, the chip at the bottom-center of the iframe will show generation progress.
-
-4. **Show the briefs to the user IN CHAT** as a numbered list. Ask "Look good or want me to adjust any of them?" — DO NOT ask which one to pick. The pick happens AFTER they've seen the actual code.
-   Example:
-   > Here are 4 directions:
-   > 1. **Spring blur** — Apple-style spring with ambient blur and soft edges
-   > 2. **Linear sharp** — Crisp, fast, minimal padding
-   > 3. **Notion soft** — Rounded, calm, neutral palette
-   > 4. **Monoline editorial** — Tight typography, single accent color
-   > Look good, or want me to adjust any of them?
-
-5. **Wait for the user's reply.** Affirmative ("looks good", "go", "yep") → proceed with all briefs. Tweak request ("make #2 feel more like Linear") → call \`approve_variant_briefs\` with \`selections\` containing \`bodyOverride\` per brief, OR re-run the brief work item with new framing. Reject all → call \`cancel_variants\` and start over.
-
-6. **Call \`approve_variant_briefs({ sessionId, briefIds: [all chosen briefs] })\`**. Response: \`{ stage: 'work_items_ready', codeGenWorkItemIds: [...] }\` — one work item per approved brief.
-
-7. **Lease the work** with \`continue_variants({ sessionId, action: 'request_work' })\`. Response has \`leaseId\`, \`leaseTtlMs\`, and \`leasedWorkItems[]\` — one per approved brief (plus a preceding \`scaffold_base\` for fresh-project; lease scaffold first, succeed it, then re-lease for the code-gens).
-
-8. **Run all leased code-gen items IN PARALLEL** via parallel tool calls in a single response. For each:
-   - Read \`input.briefBody\` and \`input.target\`
-   - Edit files in \`input.worktreePath\` (each variant has its own isolated worktree)
-   - Call \`report_variant_complete({ sessionId, workItemId, leaseId, attempt, status: 'succeeded' })\`. On failure, status \`'failed'\` with error description.
-
-9. **When all variants are done (\`stage: 'ready'\` or \`'degraded'\`), tell the user the variants are ready and explain how to compare them.** Each variant has its own dev server running in an isolated worktree. The Rivet iframe shows a chip at the bottom-center: prev/label/next/check/dismiss. The user cycles between the live, running variants by clicking prev/next (the iframe re-mounts onto the variant's dev server in ~50ms via proxy retarget). When they like one, they click the check on the chip — that commits the variant.
-   Example reply:
-   > Variants are ready — open the Rivet preview and use the chip at the bottom of the iframe to cycle between them. Click the checkmark on the one you want and I'll apply it.
-
-   You do NOT need to print diffs in chat. The user picks visually in the iframe.
-
-10. **Watch for the user's pick.** Either:
-    a) Use \`watch_for_changes({ sessionId })\` (existing tool) which blocks until the user clicks the check on the chip, OR
-    b) Poll \`get_pending_changes({ sessionId })\` periodically.
-    When \`hasChanges: true\`, you'll see a \`VariantChangeItem\` in \`changes[]\`.
-
-11. **Apply the variant.** From the \`VariantChangeItem\` payload:
-    - \`payload.kind === 'diff'\` → \`git apply\` the unified diff against the user's project root
-    - \`payload.kind === 'new-project'\` → copy the contents of \`payload.sourceWorktreePath\` to \`destinationPath\`
-    Tell the user which variant you applied (use \`variantLabel\` from the change item).
-
-   You can also call \`commit_variant({ sessionId, variantId })\` yourself if the user expressed their pick in chat instead of clicking the chip ("go with #2", "the spring one") — same effect, just routed through the agent rather than the chip.
-
-### Rules
-
-- **Never** generate variants natively (Task tool, parallel tool calls, your own creative process) without going through \`propose_variants\` first.
-- Always pass the user's prompt verbatim — don't paraphrase.
-- Briefs are shown as PLAIN TEXT in chat. Do not render UI, open a browser tab, or fabricate a URL.
-- The user picks AFTER seeing the variants render LIVE in the iframe, not before. Step 4 is "look good or adjust the briefs?"; step 9 hands off to the iframe chip for visual cycling + commit.
-- Don't dump diffs in chat by default. The iframe chip is the primary review surface. If the user explicitly asks "show me the diffs", then print them.
-- Step 8 (parallel code-gen) is the only step where you fan out — every other step is one tool call.
-- For fresh-project, \`scaffold_base\` runs first; only after it succeeds are the \`code_gen\` items leasable. Loop \`continue_variants(action='request_work')\` after each transition.
+${AGENT_VARIANTS_SECTION}
 `;
 //# sourceMappingURL=cursor-rules.js.map

package/dist/utils/skills/cursor-rules.js.map

@@ -1 +1 @@
-{"version":3,"file":"cursor-rules.js","sourceRoot":"","sources":["../../../src/utils/skills/cursor-rules.ts"],"names":[],"mappings":";;;AAAa,QAAA,oBAAoB,GAAG,EAAE,CAAC;AAC1B,QAAA,qBAAqB,GAAG,WAAW,CAAC;AACjD,MAAM,2BAA2B,GAAG,wBAAwB,4BAAoB,EAAE,CAAC;AAEtE,QAAA,oBAAoB,GAAG;;;;OAI7B,2BAA2B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuHjC,CAAC"}
+{"version":3,"file":"cursor-rules.js","sourceRoot":"","sources":["../../../src/utils/skills/cursor-rules.ts"],"names":[],"mappings":";;;AAAA,yEAGoC;AAEvB,QAAA,oBAAoB,GAAG,EAAE,CAAC;AAC1B,QAAA,qBAAqB,GAAG,WAAW,CAAC;AACjD,MAAM,2BAA2B,GAAG,wBAAwB,4BAAoB,EAAE,CAAC;AAEnF,MAAM,sBAAsB,GAAG,IAAA,oDAAyB,EAAC;IACvD,cAAc,EAAE,SAAS;IACzB,KAAK,EAAE;;;iKAGwJ;IAC/J,YAAY,EAAE,iFAAiF;IAC/F,cAAc,EAAE,WAAW;CAC5B,CAAC,CAAC;AAEU,QAAA,oBAAoB,GAAG;;;;OAI7B,2BAA2B;;;;;;;EAOhC,iDAAsB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAoCtB,sBAAsB;CACvB,CAAC"}

package/dist/utils/skills/shared-variants-protocol.d.ts

@@ -0,0 +1,23 @@
+/**
+ * Canonical brief format instruction — single source of truth.
+ * Imported by claude-skill.ts, cursor-rules.ts, and tools.ts so the
+ * wording can never silently diverge between agents.
+ */
+export declare const BRIEF_FORMAT_INSTRUCTION: string;
+/** Routing table — identical in every agent skill file */
+export declare const PICKING_THE_FLOW_TABLE = "## Picking the flow\n\n| User says | Flow |\n|---|---|\n| \"open rivet\", \"make a visual change to X\" | **Visual editor** (below) |\n| \"create variants of X\", \"show me 3-5 options for X\", \"explore approaches to X\" | **Agent variants \u2014 existing project** (`start_variants`, `mode='existing'`) |\n| \"build me a settings page from scratch\", \"add a feature for Y\" | **Agent variants \u2014 existing project** (`start_variants`, no `target`) |\n| \"create a new Vite todo app\", \"scaffold a fresh dashboard\" | **Agent variants \u2014 fresh project** (`start_variants`, `mode='zero_to_one'`) |\n| \"build me a dashboard like stripe.com\", \"use this URL as inspiration\" | **Agent variants \u2014 fresh, source-grounded** (`create_zero_to_one_project`) |";
+/**
+ * Builds the full Agent Variants flow section, parameterised on the small
+ * number of lines that differ between Claude Code and Cursor.
+ */
+export declare function buildAgentVariantsSection(opts: {
+    /** "IN THIS CHAT" for Claude Code, "in chat" for Cursor */
+    inChatEmphasis: string;
+    /** Full text of the parallel code-gen step (mechanism differs per agent) */
+    step9: string;
+    /** Closing sentence of the watch step (how changes are surfaced differs slightly) */
+    step11Suffix: string;
+    /** Label used in the "never generate natively" rule, e.g. "Task sub-agents" or "Task tool" */
+    nativeGenLabel: string;
+}): string;
+//# sourceMappingURL=shared-variants-protocol.d.ts.map

package/dist/utils/skills/shared-variants-protocol.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"shared-variants-protocol.d.ts","sourceRoot":"","sources":["../../../src/utils/skills/shared-variants-protocol.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,eAAO,MAAM,wBAAwB,QAGgF,CAAC;AAEtH,0DAA0D;AAC1D,eAAO,MAAM,sBAAsB,owBAQsH,CAAC;AAE1J;;;GAGG;AACH,wBAAgB,yBAAyB,CAAC,IAAI,EAAE;IAC9C,2DAA2D;IAC3D,cAAc,EAAE,MAAM,CAAC;IACvB,4EAA4E;IAC5E,KAAK,EAAE,MAAM,CAAC;IACd,qFAAqF;IACrF,YAAY,EAAE,MAAM,CAAC;IACrB,8FAA8F;IAC9F,cAAc,EAAE,MAAM,CAAC;CACxB,GAAG,MAAM,CAuGT"}

package/dist/utils/skills/shared-variants-protocol.js

@@ -0,0 +1,131 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PICKING_THE_FLOW_TABLE = exports.BRIEF_FORMAT_INSTRUCTION = void 0;
+exports.buildAgentVariantsSection = buildAgentVariantsSection;
+/**
+ * Canonical brief format instruction — single source of truth.
+ * Imported by claude-skill.ts, cursor-rules.ts, and tools.ts so the
+ * wording can never silently diverge between agents.
+ */
+exports.BRIEF_FORMAT_INSTRUCTION = 'Label: ≤ 4 words, clear and descriptive title (e.g. "Soft spring blur", "Crisp linear motion"). ' +
+    'Body: exactly ONE sentence, ≤ 20 words — a single evocative descriptor of the direction ' +
+    '(e.g. "Apple-style spring physics with ambient blur and soft edges"). No bullet points, no lists, no line breaks.';
+/** Routing table — identical in every agent skill file */
+exports.PICKING_THE_FLOW_TABLE = `## Picking the flow
+
+| User says | Flow |
+|---|---|
+| "open rivet", "make a visual change to X" | **Visual editor** (below) |
+| "create variants of X", "show me 3-5 options for X", "explore approaches to X" | **Agent variants — existing project** (\`start_variants\`, \`mode='existing'\`) |
+| "build me a settings page from scratch", "add a feature for Y" | **Agent variants — existing project** (\`start_variants\`, no \`target\`) |
+| "create a new Vite todo app", "scaffold a fresh dashboard" | **Agent variants — fresh project** (\`start_variants\`, \`mode='zero_to_one'\`) |
+| "build me a dashboard like stripe.com", "use this URL as inspiration" | **Agent variants — fresh, source-grounded** (\`create_zero_to_one_project\`) |`;
+/**
+ * Builds the full Agent Variants flow section, parameterised on the small
+ * number of lines that differ between Claude Code and Cursor.
+ */
+function buildAgentVariantsSection(opts) {
+    return `## Agent Variants flow
+
+For requests like *"create variants of X"*, *"show me 3-5 options for the dropdown"*, *"build me a settings page"*, or *"create a new Vite todo app"* — DO NOT generate variants natively via the ${opts.nativeGenLabel} or parallel tool calls. Use this protocol so the user sees variants render in parallel and picks based on the rendered code, not text descriptions ${opts.inChatEmphasis}.
+
+There are three sub-flows. Pick by project state:
+
+- **Existing project** → \`start_variants({ mode: 'existing' })\` — single-call kickoff, no in-chat approval gate.
+- **Fresh project (prompt-only)** → \`start_variants({ mode: 'zero_to_one' })\` — same single-call kickoff, server derives the destination path and opens the editor. Use this when the user just describes the app ("build me a Vite todo app", "make a Pomodoro timer").
+- **Fresh project (source-grounded, inspiration URLs)** → \`create_zero_to_one_project\` — multi-step with source research, inspiration-link extraction, and in-chat brief approval. Use this when the user gives a URL to mimic, attaches design context, or asks for "something like \\<site\\>".
+
+---
+
+### Sub-flow A: Existing project — use \`start_variants({ mode: 'existing' })\`
+
+1. **Call \`start_variants\`** with:
+   - \`prompt\`: the user's request verbatim
+   - \`count\`: 3-5 (default 4)
+   - \`mode\`: \`'existing'\`
+   - \`target\` (optional): \`{ type: 'element'|'file'|'route', ref }\` — set this for refinement requests pinned to a specific element/file/route
+   - \`projectPath\` (optional): defaults to the MCP server's cwd; pass explicitly if the variants target a different directory
+
+   Response: \`{ sessionId, stage: 'work_items_ready', mode: 'existing', leaseId, leaseTtlMs, variants: [{ variantId, briefId, label, workItem }], project: { projectPath, framework }, visualEditor? }\`. The server already detected the framework, opened the Rivet visual editor (share \`visualEditor.url\` with the user immediately), and leased every variant — you do NOT need to call \`detect_project\`, \`open_visual_editor\`, or \`continue_variants(request_work)\`. Each \`variants[i].workItem\` carries \`input.worktreePath\` (where to edit files) and \`attempt\`.
+
+2. ${opts.step9}
+
+   **The FIRST LINE of each variant's output stream MUST be a ≤4-word label** (matching the \`BRIEF_FORMAT_INSTRUCTION\` shape — e.g. "Spring blur", "Linear sharp") so the user recognises the direction as variants stream in. The code body follows. Use the \`leaseId\` from the start_variants response on every \`report_variant_complete\` call.
+
+3. **When all variants reach \`stage: 'ready'\` or \`'degraded'\`, tell the user the variants are ready** and explain how to compare them. Each variant has its own dev server running in an isolated worktree. The Rivet iframe shows a chip at the bottom-center: prev/label/next/check/dismiss. The user cycles between the live, running variants by clicking prev/next (the iframe re-mounts onto the variant's dev server in ~50ms via proxy retarget). When they like one, they click the check on the chip — that commits the variant.
+
+   You do NOT need to print diffs in chat. The user picks visually in the iframe. You also do NOT need to call \`cancel_variant\` yourself — the iframe surfaces a cancel button per variant card, and the UI calls \`cancel_variant\` directly when the user clicks it.
+
+4. **Watch for the user's pick.** Either:
+   a) Use \`watch_for_changes({ sessionId })\` which blocks until the user clicks the check on the chip, OR
+   b) Poll \`get_pending_changes({ sessionId })\` periodically.
+   ${opts.step11Suffix}
+
+5. **Apply the variant.** From the \`VariantChangeItem\` payload:
+   - \`payload.kind === 'diff'\` → \`git apply\` the unified diff against the user's project root
+   - \`payload.kind === 'project-created'\` → the server already materialized and committed the destination project; continue from \`destinationPath\` (optionally run \`npm install\`)
+
+   Tell the user which variant you applied (use \`variantLabel\` from the change item). You can also call \`commit_variant({ sessionId, variantId, confirmedByUser: true })\` yourself if the user expressed their pick in chat ("go with #2", "the spring one") — same effect, just routed through the agent rather than the chip.
+
+---
+
+### Sub-flow B: Fresh project (prompt-only) — use \`start_variants({ mode: 'zero_to_one' })\`
+
+For brand-new projects the user describes from scratch ("build me a Vite todo app", "make a Pomodoro timer", "scaffold a kanban board"), use the same single-call kickoff. The server derives the destination directory, opens the editor on it, leases all variants, and returns everything in one response. No in-chat approval gate.
+
+1. **Call \`start_variants\`** with:
+   - \`prompt\`: the user's request verbatim
+   - \`count\`: 3-5 (default 4)
+   - \`mode\`: \`'zero_to_one'\`
+   - \`framework\` (optional, defaults to \`'vite'\`)
+   - \`destinationParent\` (optional, absolute path; defaults to the user's home dir)
+
+   Response: \`{ sessionId, stage: 'work_items_ready', mode: 'zero_to_one', leaseId, leaseTtlMs, variants: [...], scaffoldBaseWorkItemId, destinationPath, visualEditor? }\`. The server opened the editor for you if \`visualEditor\` is present — share \`visualEditor.url\` with the user immediately ("Generating variants — watch here: <url>"). Skip the manual \`detect_project\` / \`open_visual_editor\` step (the destination project doesn't exist yet, so \`detect_project\` would fail). Each \`variants[i].workItem\` carries \`input\` and \`attempt\`.
+
+2. **From here, follow Sub-flow A steps 2-5** (parallel code-gen with first-line label using each variant's \`workItem.input.worktreePath\` and the shared \`leaseId\`, then ready, watch, apply). The work items are \`static_preview\` for zero-to-one — agent output must be \`{ html: string, css?: string, js?: string }\` (self-contained HTML, no React/Vite-only imports). On commit, the apply payload is \`payload.kind === 'project-created'\` — the server materialized the chosen variant to \`destinationPath\`.
+
+---
+
+### Sub-flow C: Fresh project (source-grounded) — use \`create_zero_to_one_project\`
+
+For brand-new projects where the user provides inspiration URLs ("build me a dashboard like stripe.com"), reference designs, or custom DESIGN.md content. This keeps the multi-step flow because source research is inherently multi-step (network fetch + extraction + reporting) and benefits from the in-chat brief approval gate so the user can adjust the directions before code-gen burns.
+
+1. **Call \`create_zero_to_one_project\`** with \`prompt\`, \`count\` (3-5), \`framework\`, optional \`destinationParent\`, and optional \`sourceContext\` (for inspiration links). Response: \`{ sessionId, briefWorkItem }\` (or \`sourceResearchWorkItem\` if source URLs were provided).
+
+2. **If \`stage === awaiting_source_research\`, run source research first.** Lease \`source_research\` via \`continue_variants({ sessionId, action: 'request_work' })\`, perform source analysis, then call \`report_source_context\` with concise evidence (source roles, structure, visual findings, preserve/borrow constraints, quality bar). This unlocks briefs.
+
+3. **Run the brief work item using YOUR own LLM** — generate \`count\` briefs as \`{ briefId, label, body }\`. ${exports.BRIEF_FORMAT_INSTRUCTION}
+
+4. **Call \`report_variant_briefs\`** with the briefs, plus the \`workItemId\` and \`attempt: 0\`.
+
+5. **Ensure the Rivet visual editor is open** (same as Sub-flow A step 2).
+
+6. **MANDATORY USER CONFIRMATION: Show the briefs to the user IN CHAT** as a numbered list. Each entry must clearly label its design source (catalog name or custom markdown label). Ask "Look good or want me to adjust any of them?" — DO NOT ask which one to pick. The pick happens AFTER they've seen the actual code. DO NOT auto-approve, even if the original user message sounded urgent.
+
+7. **Wait for the user's reply before calling \`approve_variant_briefs\`.** Affirmative ("looks good", "go", "yep") → proceed with all briefs. Tweak request ("make #2 feel more like Linear") → call \`approve_variant_briefs\` with \`selections\` containing \`bodyOverride\` per brief, OR re-run the brief work item with new framing, re-report, re-show, and wait again. Reject all → call \`cancel_variants\` and start over.
+
+8. **Call \`approve_variant_briefs({ sessionId, briefIds: [all chosen briefs], confirmedByUser: true })\`**. Response: \`{ stage: 'work_items_ready', codeGenWorkItemIds: [...] }\` — one work item per approved brief, plus a preceding \`scaffold_base\` item.
+
+9. **Lease the work** with \`continue_variants({ sessionId, action: 'request_work' })\`. Lease \`scaffold_base\` first, succeed it, then re-lease for the code-gens.
+
+10. ${opts.step9}
+
+11. **From here, follow Sub-flow A steps 5-7** for the ready-state announcement, watch, and apply. The apply step uses \`payload.kind === 'project-created'\` for fresh projects.
+
+---
+
+### Rules
+
+- **Never** generate variants natively (${opts.nativeGenLabel}, parallel tool calls, your own creative process) without going through \`start_variants\` or \`create_zero_to_one_project\` first.
+- Always pass the user's prompt verbatim — don't paraphrase.
+- For **existing projects** and **prompt-only fresh projects**, prefer \`start_variants\` (with the matching \`mode\`) over the older \`propose_variants\` → \`report_variant_briefs\` → \`approve_variant_briefs\` chain. The unified call also handles \`detect_project\`, \`open_visual_editor\`, and \`continue_variants(request_work)\` server-side — \`start_variants\` returns a live \`leaseId\` and per-variant \`worktreePath\` so you can start code-gen immediately. The older tools and standalone \`detect_project\` / \`open_visual_editor\` stay registered for the Visual Editor flow (point-and-click changes without variants).
+- For **source-grounded fresh projects** (inspiration URLs, custom design context), the in-chat brief approval gate is still mandatory — never call \`approve_variant_briefs\` until you have shown the numbered brief list and received user feedback.
+- Briefs (when shown) are PLAIN TEXT in chat. Do not render UI, open a browser tab, or fabricate a URL.
+- The user picks AFTER seeing the variants render LIVE in the iframe, not before. Hand off to the iframe chip for visual cycling + commit.
+- Don't dump diffs in chat by default. The iframe chip is the primary review surface. If the user explicitly asks "show me the diffs", then print them.
+- Parallel code-gen is the only step where you fan out — every other step is one tool call.
+- For fresh-project, required sequence is \`source_research -> report_source_context -> briefs\`, then \`scaffold_base\`, then \`code_gen\`.
+- **Per-variant cancel** is handled by the iframe — the UI calls \`cancel_variant({ sessionId, variantId })\` when the user clicks the cancel button on a card. You do not need to call this from the agent side. Use \`cancel_variants\` (plural) only to kill an entire session.
+- Quality bar is mandatory: avoid generic hero-card pages; preserve source depth, realistic workflow detail, and responsive interaction states unless the user explicitly asks for a lighter build.`;
+}
+//# sourceMappingURL=shared-variants-protocol.js.map

package/dist/utils/skills/shared-variants-protocol.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"shared-variants-protocol.js","sourceRoot":"","sources":["../../../src/utils/skills/shared-variants-protocol.ts"],"names":[],"mappings":";;;AAyBA,8DAgHC;AAzID;;;;GAIG;AACU,QAAA,wBAAwB,GACnC,kGAAkG;IAClG,0FAA0F;IAC1F,mHAAmH,CAAC;AAEtH,0DAA0D;AAC7C,QAAA,sBAAsB,GAAG;;;;;;;;yJAQmH,CAAC;AAE1J;;;GAGG;AACH,SAAgB,yBAAyB,CAAC,IASzC;IACC,OAAO;;oMAE2L,IAAI,CAAC,cAAc,uJAAuJ,IAAI,CAAC,cAAc;;;;;;;;;;;;;;;;;;;;;KAqB5X,IAAI,CAAC,KAAK;;;;;;;;;;;KAWV,IAAI,CAAC,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iHAmC2F,gCAAwB;;;;;;;;;;;;;;MAcnI,IAAI,CAAC,KAAK;;;;;;;;0CAQ0B,IAAI,CAAC,cAAc;;;;;;;;;;oMAUuI,CAAC;AACrM,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rivet-design",
-  "version": "0.9.1",
+  "version": "0.9.3",
   "description": "Local visual web development tool with AI-powered code modification",
   "main": "dist/index.js",
   "workspaces": [
@@ -13,7 +13,8 @@
     "rivet": "./bin/rivet.js"
   },
   "scripts": {
-    "build": "tsc && npm run build:ui && npm run build:bin",
+    "build": "tsc && npm run build:assets && npm run build:ui && npm run build:bin",
+    "build:assets": "mkdir -p dist/services/templates/designmd && cp src/services/templates/designmd/*.md dist/services/templates/designmd/",
     "build:ui": "cd src/ui && vite build",
     "build:bin": "mkdir -p bin && cp src/bin-template.js bin/rivet.js && chmod +x bin/rivet.js",
     "dev": "tsc --watch",
@@ -170,7 +171,7 @@
     "access": "public"
   },
   "engines": {
-    "node": ">=16.0.0"
+    "node": ">=24.0.0"
   },
   "prettier": {
     "printWidth": 80,

package/src/ui/dist/assets/main-C9jfEp80.css

@@ -0,0 +1 @@
+*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.container{width:100%}@media(min-width:640px){.container{max-width:640px}}@media(min-width:768px){.container{max-width:768px}}@media(min-width:1024px){.container{max-width:1024px}}@media(min-width:1280px){.container{max-width:1280px}}@media(min-width:1536px){.container{max-width:1536px}}.pointer-events-none{pointer-events:none}.pointer-events-auto{pointer-events:auto}.visible{visibility:visible}.invisible{visibility:hidden}.static{position:static}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.inset-0{top:0;right:0;bottom:0;left:0}.-right-0\.5{right:-.125rem}.-right-1{right:-.25rem}.-top-0\.5{top:-.125rem}.-top-1{top:-.25rem}.bottom-4{bottom:1rem}.bottom-6{bottom:1.5rem}.bottom-full{bottom:100%}.left-0{left:0}.left-1\/2{left:50%}.left-2{left:.5rem}.left-4{left:1rem}.right-0{right:0}.right-1{right:.25rem}.right-2{right:.5rem}.right-3{right:.75rem}.right-6{right:1.5rem}.top-0{top:0}.top-1{top:.25rem}.top-1\/2{top:50%}.top-2{top:.5rem}.top-2\.5{top:.625rem}.top-3{top:.75rem}.top-4{top:1rem}.z-10{z-index:10}.z-30{z-index:30}.z-40{z-index:40}.z-50{z-index:50}.z-\[47\]{z-index:47}.z-\[48\]{z-index:48}.z-\[60\]{z-index:60}.z-comment-preview{z-index:55}.z-max{z-index:999999}.z-tooltip{z-index:70}.z-ui-primary{z-index:50}.order-1{order:1}.order-2{order:2}.col-start-1{grid-column-start:1}.row-start-1{grid-row-start:1}.mx-1{margin-left:.25rem;margin-right:.25rem}.mx-auto{margin-left:auto;margin-right:auto}.my-1{margin-top:.25rem;margin-bottom:.25rem}.-ml-2\.5{margin-left:-.625rem}.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.mb-4{margin-bottom:1rem}.ml-1\.5{margin-left:.375rem}.ml-2{margin-left:.5rem}.ml-auto{margin-left:auto}.mt-0\.5{margin-top:.125rem}.mt-1\.5{margin-top:.375rem}.mt-2{margin-top:.5rem}.mt-4{margin-top:1rem}.mt-\[1px\]{margin-top:1px}.line-clamp-2{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.block{display:block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.grid{display:grid}.inline-grid{display:inline-grid}.contents{display:contents}.hidden{display:none}.aspect-\[4\/3\]{aspect-ratio:4/3}.h-0{height:0px}.h-10{height:2.5rem}.h-2{height:.5rem}.h-2\.5{height:.625rem}.h-3{height:.75rem}.h-3\.5{height:.875rem}.h-4{height:1rem}.h-44{height:11rem}.h-5{height:1.25rem}.h-52{height:13rem}.h-6{height:1.5rem}.h-7{height:1.75rem}.h-8{height:2rem}.h-80{height:20rem}.h-96{height:24rem}.h-\[450px\]{height:450px}.h-full{height:100%}.h-px{height:1px}.h-screen{height:100vh}.max-h-10{max-height:2.5rem}.max-h-20{max-height:5rem}.max-h-24{max-height:6rem}.max-h-28{max-height:7rem}.max-h-32{max-height:8rem}.max-h-36{max-height:9rem}.max-h-40{max-height:10rem}.max-h-64{max-height:16rem}.max-h-96{max-height:24rem}.max-h-\[80vh\]{max-height:80vh}.min-h-0{min-height:0px}.min-h-\[2\.5rem\]{min-height:2.5rem}.min-h-screen{min-height:100vh}.w-0{width:0px}.w-10{width:2.5rem}.w-12{width:3rem}.w-2{width:.5rem}.w-2\.5{width:.625rem}.w-28{width:7rem}.w-3{width:.75rem}.w-3\.5{width:.875rem}.w-32{width:8rem}.w-4{width:1rem}.w-48{width:12rem}.w-5{width:1.25rem}.w-56{width:14rem}.w-6{width:1.5rem}.w-64{width:16rem}.w-7{width:1.75rem}.w-72{width:18rem}.w-8{width:2rem}.w-80{width:20rem}.w-96{width:24rem}.w-\[1px\]{width:1px}.w-\[280px\]{width:280px}.w-\[380px\]{width:380px}.w-\[420px\]{width:420px}.w-\[480px\]{width:480px}.w-auto{width:auto}.w-fit{width:-moz-fit-content;width:fit-content}.w-full{width:100%}.w-px{width:1px}.min-w-0{min-width:0px}.min-w-4{min-width:1rem}.min-w-\[140px\]{min-width:140px}.max-w-7xl{max-width:80rem}.max-w-\[180px\]{max-width:180px}.max-w-\[200px\]{max-width:200px}.max-w-\[300px\]{max-width:300px}.max-w-\[80\%\]{max-width:80%}.max-w-md{max-width:28rem}.max-w-sm{max-width:24rem}.max-w-xs{max-width:20rem}.flex-1{flex:1 1 0%}.flex-shrink-0{flex-shrink:0}.shrink{flex-shrink:1}.shrink-0{flex-shrink:0}.-translate-x-1\/2{--tw-translate-x: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1\/2{--tw-translate-y: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.rotate-180{--tw-rotate: 180deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.rotate-90{--tw-rotate: 90deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.scale-110{--tw-scale-x: 1.1;--tw-scale-y: 1.1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@keyframes spin{to{transform:rotate(360deg)}}.animate-spin{animation:spin 1s linear infinite}@keyframes token-highlight{0%{transform:scale(1.05);box-shadow:0 0 0 2px #facc15,0 0 0 6px #facc1580}50%{transform:scale(1.02);box-shadow:0 0 0 2px #facc15,0 0 0 8px #facc1599}to{transform:scale(1);box-shadow:0 0 #facc1500,0 0 #facc1500}}.animate-token-highlight{animation:token-highlight 1.5s ease-in-out}.cursor-auto{cursor:auto}.cursor-crosshair{cursor:crosshair}.cursor-default{cursor:default}.cursor-grab{cursor:grab}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.touch-none{touch-action:none}.select-none{-webkit-user-select:none;-moz-user-select:none;user-select:none}.resize-none{resize:none}.resize{resize:both}.appearance-none{-webkit-appearance:none;-moz-appearance:none;appearance:none}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-cols-\[80px_1fr\]{grid-template-columns:80px 1fr}.grid-cols-\[80px_1fr_auto\]{grid-template-columns:80px 1fr auto}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-start{align-items:flex-start}.items-center{align-items:center}.items-stretch{align-items:stretch}.justify-start{justify-content:flex-start}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-1{gap:.25rem}.gap-1\.5{gap:.375rem}.gap-10{gap:2.5rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-5{gap:1.25rem}.gap-6{gap:1.5rem}.space-x-1>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(.25rem * var(--tw-space-x-reverse));margin-left:calc(.25rem * calc(1 - var(--tw-space-x-reverse)))}.space-x-2>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(.5rem * var(--tw-space-x-reverse));margin-left:calc(.5rem * calc(1 - var(--tw-space-x-reverse)))}.space-y-1>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.25rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.25rem * var(--tw-space-y-reverse))}.space-y-1\.5>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.375rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.375rem * var(--tw-space-y-reverse))}.space-y-10>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(2.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(2.5rem * var(--tw-space-y-reverse))}.space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.5rem * var(--tw-space-y-reverse))}.space-y-3>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.75rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.75rem * var(--tw-space-y-reverse))}.space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}.divide-y>:not([hidden])~:not([hidden]){--tw-divide-y-reverse: 0;border-top-width:calc(1px * calc(1 - var(--tw-divide-y-reverse)));border-bottom-width:calc(1px * var(--tw-divide-y-reverse))}.divide-main-border>:not([hidden])~:not([hidden]){--tw-divide-opacity: 1;border-color:rgb(35 35 40 / var(--tw-divide-opacity, 1))}.self-start{align-self:flex-start}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-visible{overflow:visible}.overflow-y-auto{overflow-y:auto}.scroll-smooth{scroll-behavior:smooth}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.whitespace-nowrap{white-space:nowrap}.whitespace-pre-wrap{white-space:pre-wrap}.break-words{overflow-wrap:break-word}.break-all{word-break:break-all}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:1rem}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.rounded-md{border-radius:.375rem}.rounded-none{border-radius:0}.rounded-sm{border-radius:.125rem}.rounded-xl{border-radius:.75rem}.rounded-l-lg{border-top-left-radius:.5rem;border-bottom-left-radius:.5rem}.rounded-l-md{border-top-left-radius:.375rem;border-bottom-left-radius:.375rem}.rounded-r-md{border-top-right-radius:.375rem;border-bottom-right-radius:.375rem}.rounded-t-lg{border-top-left-radius:.5rem;border-top-right-radius:.5rem}.border{border-width:1px}.border-2{border-width:2px}.border-\[1px\]{border-width:1px}.border-b{border-bottom-width:1px}.border-b-2{border-bottom-width:2px}.border-b-\[1px\]{border-bottom-width:1px}.border-l{border-left-width:1px}.border-l-\[4px\]{border-left-width:4px}.border-r-0{border-right-width:0px}.border-r-\[4px\]{border-right-width:4px}.border-t,.border-t-\[1px\]{border-top-width:1px}.border-t-\[6px\]{border-top-width:6px}.border-dashed{border-style:dashed}.border-none{border-style:none}.border-divider{--tw-border-opacity: 1;border-color:rgb(75 85 99 / var(--tw-border-opacity, 1))}.border-gray-300{--tw-border-opacity: 1;border-color:rgb(209 213 219 / var(--tw-border-opacity, 1))}.border-main-border{--tw-border-opacity: 1;border-color:rgb(35 35 40 / var(--tw-border-opacity, 1))}.border-primary{--tw-border-opacity: 1;border-color:rgb(255 51 0 / var(--tw-border-opacity, 1))}.border-primary-border{--tw-border-opacity: 1;border-color:rgb(255 107 53 / var(--tw-border-opacity, 1))}.border-primary\/30{border-color:#ff33004d}.border-primary\/50{border-color:#ff330080}.border-transparent{border-color:transparent}.border-white\/10{border-color:#ffffff1a}.border-white\/20{border-color:#fff3}.border-l-transparent{border-left-color:transparent}.border-r-transparent{border-right-color:transparent}.border-t-transparent{border-top-color:transparent}.bg-\[\#1c1c20\]{--tw-bg-opacity: 1;background-color:rgb(28 28 32 / var(--tw-bg-opacity, 1))}.bg-accent-error{--tw-bg-opacity: 1;background-color:rgb(239 68 68 / var(--tw-bg-opacity, 1))}.bg-accent-success{--tw-bg-opacity: 1;background-color:rgb(16 185 129 / var(--tw-bg-opacity, 1))}.bg-black{--tw-bg-opacity: 1;background-color:rgb(0 0 0 / var(--tw-bg-opacity, 1))}.bg-black\/40{background-color:#0006}.bg-black\/45{background-color:#00000073}.bg-black\/50{background-color:#00000080}.bg-divider{--tw-bg-opacity: 1;background-color:rgb(75 85 99 / var(--tw-bg-opacity, 1))}.bg-divider\/20{background-color:#4b556333}.bg-gray-50{--tw-bg-opacity: 1;background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1))}.bg-main{--tw-bg-opacity: 1;background-color:rgb(28 28 32 / var(--tw-bg-opacity, 1))}.bg-main-border{--tw-bg-opacity: 1;background-color:rgb(35 35 40 / var(--tw-bg-opacity, 1))}.bg-main-hover{--tw-bg-opacity: 1;background-color:rgb(64 64 64 / var(--tw-bg-opacity, 1))}.bg-main-hover\/50{background-color:#40404080}.bg-main-input{--tw-bg-opacity: 1;background-color:rgb(46 46 46 / var(--tw-bg-opacity, 1))}.bg-main-input\/80{background-color:#2e2e2ecc}.bg-main-light{--tw-bg-opacity: 1;background-color:rgb(30 30 34 / var(--tw-bg-opacity, 1))}.bg-main\/90{background-color:#1c1c20e6}.bg-primary{--tw-bg-opacity: 1;background-color:rgb(255 51 0 / var(--tw-bg-opacity, 1))}.bg-primary\/10{background-color:#ff33001a}.bg-primary\/20{background-color:#f303}.bg-primary\/5{background-color:#ff33000d}.bg-readOnly{--tw-bg-opacity: 1;background-color:rgb(35 35 35 / var(--tw-bg-opacity, 1))}.bg-red-500{--tw-bg-opacity: 1;background-color:rgb(239 68 68 / var(--tw-bg-opacity, 1))}.bg-red-500\/80{background-color:#ef4444cc}.bg-transparent{background-color:transparent}.bg-white{--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1))}.bg-white\/15{background-color:#ffffff26}.fill-black{fill:#000}.fill-main{fill:#1c1c20}.fill-main-input{fill:#2e2e2e}.fill-primary\/30{fill:#ff33004d}.object-contain{-o-object-fit:contain;object-fit:contain}.object-cover{-o-object-fit:cover;object-fit:cover}.p-0\.5{padding:.125rem}.p-1{padding:.25rem}.p-1\.5{padding:.375rem}.p-2{padding:.5rem}.p-3{padding:.75rem}.p-4{padding:1rem}.p-6{padding:1.5rem}.p-8{padding:2rem}.px-1{padding-left:.25rem;padding-right:.25rem}.px-1\.5{padding-left:.375rem;padding-right:.375rem}.px-10{padding-left:2.5rem;padding-right:2.5rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-5{padding-left:1.25rem;padding-right:1.25rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.px-8{padding-left:2rem;padding-right:2rem}.py-0\.5{padding-top:.125rem;padding-bottom:.125rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-1\.5{padding-top:.375rem;padding-bottom:.375rem}.py-12{padding-top:3rem;padding-bottom:3rem}.py-14{padding-top:3.5rem;padding-bottom:3.5rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-2\.5{padding-top:.625rem;padding-bottom:.625rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-3\.5{padding-top:.875rem;padding-bottom:.875rem}.py-4{padding-top:1rem;padding-bottom:1rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.py-8{padding-top:2rem;padding-bottom:2rem}.pb-0{padding-bottom:0}.pb-1{padding-bottom:.25rem}.pb-3{padding-bottom:.75rem}.pb-4{padding-bottom:1rem}.pl-2{padding-left:.5rem}.pl-3{padding-left:.75rem}.pl-4{padding-left:1rem}.pl-8{padding-left:2rem}.pr-1{padding-right:.25rem}.pr-2{padding-right:.5rem}.pr-3{padding-right:.75rem}.pr-4{padding-right:1rem}.pr-8{padding-right:2rem}.pt-1{padding-top:.25rem}.pt-2{padding-top:.5rem}.pt-3{padding-top:.75rem}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.font-main{font-family:Satoshi,Inter,system-ui,-apple-system,Segoe UI,sans-serif}.font-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}.font-sans{font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji"}.text-3xl{font-size:1.875rem;line-height:2.25rem}.text-\[10px\]{font-size:10px}.text-\[11px\]{font-size:11px}.text-\[9px\]{font-size:9px}.text-base{font-size:1rem;line-height:1.5rem}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-xs{font-size:.75rem;line-height:1rem}.font-bold{font-weight:700}.font-medium{font-weight:500}.font-normal{font-weight:400}.font-semibold{font-weight:600}.uppercase{text-transform:uppercase}.capitalize{text-transform:capitalize}.leading-4{line-height:1rem}.leading-none{line-height:1}.leading-relaxed{line-height:1.625}.leading-snug{line-height:1.375}.tracking-wide{letter-spacing:.025em}.tracking-wider{letter-spacing:.05em}.text-accent-error{--tw-text-opacity: 1;color:rgb(239 68 68 / var(--tw-text-opacity, 1))}.text-content{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.text-content-muted{--tw-text-opacity: 1;color:rgb(209 213 219 / var(--tw-text-opacity, 1))}.text-content-subtle{--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity, 1))}.text-emerald-500{--tw-text-opacity: 1;color:rgb(16 185 129 / var(--tw-text-opacity, 1))}.text-gray-300{--tw-text-opacity: 1;color:rgb(209 213 219 / var(--tw-text-opacity, 1))}.text-gray-500{--tw-text-opacity: 1;color:rgb(107 114 128 / var(--tw-text-opacity, 1))}.text-gray-600{--tw-text-opacity: 1;color:rgb(75 85 99 / var(--tw-text-opacity, 1))}.text-gray-900{--tw-text-opacity: 1;color:rgb(17 24 39 / var(--tw-text-opacity, 1))}.text-green-400{--tw-text-opacity: 1;color:rgb(74 222 128 / var(--tw-text-opacity, 1))}.text-primary{--tw-text-opacity: 1;color:rgb(255 51 0 / var(--tw-text-opacity, 1))}.text-red-200{--tw-text-opacity: 1;color:rgb(254 202 202 / var(--tw-text-opacity, 1))}.text-red-400{--tw-text-opacity: 1;color:rgb(248 113 113 / var(--tw-text-opacity, 1))}.text-red-500{--tw-text-opacity: 1;color:rgb(239 68 68 / var(--tw-text-opacity, 1))}.text-white{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.text-white\/60{color:#fff9}.text-white\/70{color:#ffffffb3}.underline{text-decoration-line:underline}.placeholder-content-subtle::-moz-placeholder{--tw-placeholder-opacity: 1;color:rgb(156 163 175 / var(--tw-placeholder-opacity, 1))}.placeholder-content-subtle::placeholder{--tw-placeholder-opacity: 1;color:rgb(156 163 175 / var(--tw-placeholder-opacity, 1))}.opacity-50{opacity:.5}.opacity-60{opacity:.6}.opacity-70{opacity:.7}.shadow-2xl{--tw-shadow: 0 25px 50px -12px rgb(0 0 0 / .25);--tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.shadow-lg{--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.shadow-md{--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.shadow-sm{--tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);--tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.shadow-xl{--tw-shadow: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.outline-none{outline:2px solid transparent;outline-offset:2px}.outline{outline-style:solid}.outline-1{outline-width:1px}.outline-transparent{outline-color:transparent}.ring-2{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.ring-primary{--tw-ring-opacity: 1;--tw-ring-color: rgb(255 51 0 / var(--tw-ring-opacity, 1))}.blur{--tw-blur: blur(8px);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.brightness-110{--tw-brightness: brightness(1.1);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.drop-shadow{--tw-drop-shadow: drop-shadow(0 1px 2px rgb(0 0 0 / .1)) drop-shadow(0 1px 1px rgb(0 0 0 / .06));filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.invert{--tw-invert: invert(100%);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.backdrop-blur-\[2px\]{--tw-backdrop-blur: blur(2px);-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}.backdrop-blur-sm{--tw-backdrop-blur: blur(4px);-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-\[filter\]{transition-property:filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-\[outline-color\]{transition-property:outline-color;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.duration-100{transition-duration:.1s}.duration-200{transition-duration:.2s}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}.will-change-transform{will-change:transform}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}.scrollbar-hide::-webkit-scrollbar{display:none}html,body{overflow:hidden;font-family:Satoshi,Inter,system-ui,sans-serif}@font-face{font-family:Satoshi;src:url(/fonts/Satoshi-Variable.woff2) format("woff2-variations");font-weight:300 900;font-style:normal;font-display:swap}@font-face{font-family:Satoshi;src:url(/fonts/Satoshi-VariableItalic.woff2) format("woff2-variations");font-weight:300 900;font-style:italic;font-display:swap}@font-face{font-family:Goldman;src:url(/fonts/Goldman-Regular.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:Goldman;src:url(/fonts/Goldman-Bold.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}@keyframes rivet-token-highlight{0%{transform:scale(1.05);box-shadow:0 0 0 2px #facc15,0 0 0 6px #facc1580}50%{transform:scale(1.02);box-shadow:0 0 0 2px #facc15,0 0 0 8px #facc1599}to{transform:scale(1);box-shadow:0 0 #facc1500,0 0 #facc1500}}*{scrollbar-width:thin;scrollbar-color:#404040 transparent}*::-webkit-scrollbar{width:8px;height:8px}*::-webkit-scrollbar-track{background:transparent;border-radius:4px}*::-webkit-scrollbar-thumb{background:#3a3a3f;border-radius:4px;border:2px solid transparent;background-clip:padding-box}*::-webkit-scrollbar-thumb:hover{background:#505058;border:2px solid transparent;background-clip:padding-box}*::-webkit-scrollbar-corner{background:transparent}.markdown-content{color:#fff;font-size:.875rem;line-height:1.625;word-break:break-word;overflow-wrap:anywhere;min-width:0}.markdown-content h1,.markdown-content h2,.markdown-content h3,.markdown-content h4,.markdown-content h5,.markdown-content h6{color:#fff;font-weight:600;margin-top:1rem;margin-bottom:.25rem;line-height:1.3}.markdown-content h1{font-size:1.25rem}.markdown-content h2{font-size:1.125rem}.markdown-content h3{font-size:1rem}.markdown-content p{margin:.5rem 0}.markdown-content strong{color:#fff;font-weight:600}.markdown-content em{font-style:italic}.markdown-content a{color:#60a5fa;text-decoration:underline}.markdown-content a:hover{color:#93bbfd}.markdown-content ul,.markdown-content ol{margin:.5rem 0;padding-left:1.25rem}.markdown-content ul{list-style-type:disc}.markdown-content ol{list-style-type:decimal}.markdown-content li{margin:.25rem 0}.markdown-content li>ul,.markdown-content li>ol{margin:0}.markdown-inline-code{background:#ffffff1a;color:#e5e7eb;padding:.125rem .375rem;border-radius:.25rem;font-size:.8125rem;font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,monospace;overflow-wrap:anywhere}.markdown-content blockquote{border-left:3px solid #4b5563;padding-left:.75rem;margin:.5rem 0;color:#9ca3af}.markdown-content table{border-collapse:collapse;margin:.5rem 0;width:100%;font-size:.8125rem}.markdown-content th,.markdown-content td{border:1px solid #4b5563;padding:.375rem .625rem;text-align:left}.markdown-content th{color:#fff;font-weight:600;background:#ffffff0d}.markdown-content hr{border:none;border-top:1px solid #4b5563;margin:.75rem 0}.markdown-content del{text-decoration:line-through;color:#9ca3af}.markdown-content>*:first-child{margin-top:0}.markdown-content>*:last-child{margin-bottom:0}@keyframes rivet-sparkle-scroll{0%{transform:translateY(0)}to{transform:translateY(-6em)}}.rivet-sparkle-strip{animation:rivet-sparkle-scroll .9s steps(6) infinite}@media(prefers-reduced-motion:reduce){.rivet-sparkle-strip{animation:none}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.shimmer-text{background:linear-gradient(90deg,#ffffff80,#ffffffbf,#fff,#ffffffbf,#ffffff80);background-size:200% 100%;background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:shimmer 2s linear infinite}.glass-panel{background:#ffffff04;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.03)}.active-push:active{transform:scale(.98);transition:transform .1s ease}.placeholder\:text-content-subtle::-moz-placeholder{--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity, 1))}.placeholder\:text-content-subtle::placeholder{--tw-text-opacity: 1;color:rgb(156 163 175 / var(--tw-text-opacity, 1))}.last\:border-b-0:last-child{border-bottom-width:0px}.focus-within\:outline-white\/20:focus-within{outline-color:#fff3}.hover\:border-main-border:hover{--tw-border-opacity: 1;border-color:rgb(35 35 40 / var(--tw-border-opacity, 1))}.hover\:border-primary-border:hover{--tw-border-opacity: 1;border-color:rgb(255 107 53 / var(--tw-border-opacity, 1))}.hover\:bg-black\/70:hover{background-color:#000000b3}.hover\:bg-divider:hover{--tw-bg-opacity: 1;background-color:rgb(75 85 99 / var(--tw-bg-opacity, 1))}.hover\:bg-main:hover{--tw-bg-opacity: 1;background-color:rgb(28 28 32 / var(--tw-bg-opacity, 1))}.hover\:bg-main-border:hover{--tw-bg-opacity: 1;background-color:rgb(35 35 40 / var(--tw-bg-opacity, 1))}.hover\:bg-main-hover:hover{--tw-bg-opacity: 1;background-color:rgb(64 64 64 / var(--tw-bg-opacity, 1))}.hover\:bg-main-input:hover{--tw-bg-opacity: 1;background-color:rgb(46 46 46 / var(--tw-bg-opacity, 1))}.hover\:bg-main\/80:hover{background-color:#1c1c20cc}.hover\:bg-primary-hover:hover{--tw-bg-opacity: 1;background-color:rgb(194 65 12 / var(--tw-bg-opacity, 1))}.hover\:bg-primary\/90:hover{background-color:#ff3300e6}.hover\:bg-red-600:hover{--tw-bg-opacity: 1;background-color:rgb(220 38 38 / var(--tw-bg-opacity, 1))}.hover\:bg-white\/10:hover{background-color:#ffffff1a}.hover\:text-accent-error:hover{--tw-text-opacity: 1;color:rgb(239 68 68 / var(--tw-text-opacity, 1))}.hover\:text-content:hover{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.hover\:text-red-400:hover{--tw-text-opacity: 1;color:rgb(248 113 113 / var(--tw-text-opacity, 1))}.hover\:text-white:hover{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.focus\:border-primary:focus{--tw-border-opacity: 1;border-color:rgb(255 51 0 / var(--tw-border-opacity, 1))}.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.focus\:ring-1:focus{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.focus\:ring-primary\/30:focus{--tw-ring-color: rgb(255 51 0 / .3)}.active\:cursor-grabbing:active{cursor:grabbing}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:opacity-30:disabled{opacity:.3}.disabled\:opacity-40:disabled{opacity:.4}.disabled\:opacity-50:disabled{opacity:.5}.disabled\:opacity-80:disabled{opacity:.8}.group:hover .group-hover\:text-content{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.group:hover .group-hover\:brightness-75{--tw-brightness: brightness(.75);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.data-\[disabled\]\:pointer-events-none[data-disabled]{pointer-events:none}.data-\[side\=bottom\]\:origin-top[data-side=bottom]{transform-origin:top}.data-\[side\=left\]\:origin-right[data-side=left]{transform-origin:right}.data-\[side\=right\]\:origin-left[data-side=right]{transform-origin:left}.data-\[side\=top\]\:origin-bottom[data-side=top]{transform-origin:bottom}@keyframes tooltip-pop-out{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.95) translateY(2px)}}.data-\[state\=closed\]\:animate-tooltip-pop-out[data-state=closed]{animation:tooltip-pop-out .11s ease-out}.data-\[state\=delayed-open\]\:animate-tooltip-pop-in[data-state=delayed-open]{animation:tooltip-pop-in .18s cubic-bezier(.34,1.56,.64,1)}@keyframes tooltip-pop-in{0%{opacity:0;transform:scale(.82) translateY(4px)}to{opacity:1;transform:scale(1) translateY(0)}}.data-\[state\=instant-open\]\:animate-tooltip-pop-in[data-state=instant-open]{animation:tooltip-pop-in .18s cubic-bezier(.34,1.56,.64,1)}.data-\[highlighted\]\:border-primary-border[data-highlighted]{--tw-border-opacity: 1;border-color:rgb(255 107 53 / var(--tw-border-opacity, 1))}.data-\[state\=active\]\:border-primary[data-state=active]{--tw-border-opacity: 1;border-color:rgb(255 51 0 / var(--tw-border-opacity, 1))}.data-\[highlighted\]\:bg-main-hover[data-highlighted]{--tw-bg-opacity: 1;background-color:rgb(64 64 64 / var(--tw-bg-opacity, 1))}.data-\[highlighted\]\:bg-main-input[data-highlighted]{--tw-bg-opacity: 1;background-color:rgb(46 46 46 / var(--tw-bg-opacity, 1))}.data-\[state\=checked\]\:bg-transparent[data-state=checked]{background-color:transparent}.data-\[highlighted\]\:text-content[data-highlighted],.data-\[state\=active\]\:text-white[data-state=active]{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.data-\[disabled\]\:opacity-50[data-disabled]{opacity:.5}.data-\[highlighted\]\:ring-1[data-highlighted]{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.data-\[highlighted\]\:ring-primary-border[data-highlighted]{--tw-ring-opacity: 1;--tw-ring-color: rgb(255 107 53 / var(--tw-ring-opacity, 1))}.group[data-state=open] .group-data-\[state\=open\]\:rotate-180{--tw-rotate: 180deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@media(min-width:640px){.sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(min-width:768px){.md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}}@media(min-width:1024px){.lg\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}}