rivet-design 0.10.6 → 0.10.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/mcp/agent-variants/SessionStore.d.ts +11 -0
- package/dist/mcp/agent-variants/SessionStore.d.ts.map +1 -1
- package/dist/mcp/agent-variants/SessionStore.js +44 -14
- package/dist/mcp/agent-variants/SessionStore.js.map +1 -1
- package/dist/mcp/agent-variants/WorktreeOrchestrator.d.ts +44 -3
- package/dist/mcp/agent-variants/WorktreeOrchestrator.d.ts.map +1 -1
- package/dist/mcp/agent-variants/WorktreeOrchestrator.js +297 -63
- package/dist/mcp/agent-variants/WorktreeOrchestrator.js.map +1 -1
- package/dist/mcp/agent-variants/WorktreeOrchestrator.testHelpers.d.ts +4 -0
- package/dist/mcp/agent-variants/WorktreeOrchestrator.testHelpers.d.ts.map +1 -1
- package/dist/mcp/agent-variants/WorktreeOrchestrator.testHelpers.js +1 -1
- package/dist/mcp/agent-variants/WorktreeOrchestrator.testHelpers.js.map +1 -1
- package/dist/mcp/agent-variants/contracts.d.ts +28 -0
- package/dist/mcp/agent-variants/contracts.d.ts.map +1 -1
- package/dist/mcp/agent-variants/contracts.js.map +1 -1
- package/dist/mcp/agent-variants/createZeroToOneTool.d.ts +47 -265
- package/dist/mcp/agent-variants/createZeroToOneTool.d.ts.map +1 -1
- package/dist/mcp/agent-variants/createZeroToOneTool.js +147 -207
- package/dist/mcp/agent-variants/createZeroToOneTool.js.map +1 -1
- package/dist/mcp/agent-variants/generatedDestination.d.ts +75 -0
- package/dist/mcp/agent-variants/generatedDestination.d.ts.map +1 -0
- package/dist/mcp/agent-variants/generatedDestination.js +104 -0
- package/dist/mcp/agent-variants/generatedDestination.js.map +1 -0
- package/dist/mcp/agent-variants/index.d.ts +0 -1
- package/dist/mcp/agent-variants/index.d.ts.map +1 -1
- package/dist/mcp/agent-variants/index.js +1 -3
- package/dist/mcp/agent-variants/index.js.map +1 -1
- package/dist/mcp/agent-variants/pinterestSourceContext.d.ts +18 -0
- package/dist/mcp/agent-variants/pinterestSourceContext.d.ts.map +1 -0
- package/dist/mcp/agent-variants/pinterestSourceContext.js +134 -0
- package/dist/mcp/agent-variants/pinterestSourceContext.js.map +1 -0
- package/dist/mcp/agent-variants/runPlan.d.ts +107 -0
- package/dist/mcp/agent-variants/runPlan.d.ts.map +1 -0
- package/dist/mcp/agent-variants/runPlan.js +97 -0
- package/dist/mcp/agent-variants/runPlan.js.map +1 -0
- package/dist/mcp/agent-variants/tools.d.ts +48 -3
- package/dist/mcp/agent-variants/tools.d.ts.map +1 -1
- package/dist/mcp/agent-variants/tools.js +54 -47
- package/dist/mcp/agent-variants/tools.js.map +1 -1
- package/dist/mcp/integrations/tools.d.ts +14 -0
- package/dist/mcp/integrations/tools.d.ts.map +1 -0
- package/dist/mcp/integrations/tools.js +38 -0
- package/dist/mcp/integrations/tools.js.map +1 -0
- package/dist/mcp/server.d.ts.map +1 -1
- package/dist/mcp/server.js +18 -13
- package/dist/mcp/server.js.map +1 -1
- package/dist/routes/agentVariants.d.ts.map +1 -1
- package/dist/routes/agentVariants.js +5 -0
- package/dist/routes/agentVariants.js.map +1 -1
- package/dist/services/IntegrationsClient.d.ts +58 -0
- package/dist/services/IntegrationsClient.d.ts.map +1 -0
- package/dist/services/IntegrationsClient.js +81 -0
- package/dist/services/IntegrationsClient.js.map +1 -0
- package/dist/services/staticStarter.d.ts +1 -1
- package/dist/services/staticStarter.d.ts.map +1 -1
- package/dist/services/staticStarter.js +76 -19
- package/dist/services/staticStarter.js.map +1 -1
- package/dist/utils/skills/describe-motion-protocol.d.ts +1 -1
- package/dist/utils/skills/describe-motion-protocol.d.ts.map +1 -1
- package/dist/utils/skills/describe-motion-protocol.js +11 -11
- package/dist/utils/skills/shared-variants-protocol.d.ts.map +1 -1
- package/dist/utils/skills/shared-variants-protocol.js +6 -4
- package/dist/utils/skills/shared-variants-protocol.js.map +1 -1
- package/package.json +1 -1
- package/src/ui/dist/assets/main-DUIrSkV3.css +1 -0
- package/src/ui/dist/assets/main-DYpxGvCu.js +646 -0
- package/src/ui/dist/index.html +2 -2
- package/src/ui/dist/assets/main-B54sNpwl.css +0 -1
- package/src/ui/dist/assets/main-B9BHMA4s.js +0 -646
|
@@ -21,40 +21,97 @@ exports.STATIC_STARTER_HTML = `<!doctype html>
|
|
|
21
21
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
22
22
|
<title>New Rivet project</title>
|
|
23
23
|
<style>
|
|
24
|
-
|
|
25
|
-
|
|
24
|
+
* { box-sizing: border-box; margin: 0; padding: 0; }
|
|
25
|
+
html, body { height: 100%; }
|
|
26
26
|
body {
|
|
27
|
-
|
|
27
|
+
font-family: system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica,
|
|
28
|
+
Arial, sans-serif;
|
|
29
|
+
-webkit-font-smoothing: antialiased;
|
|
30
|
+
background: #f3ede3;
|
|
31
|
+
color: #1a1a17;
|
|
28
32
|
min-height: 100vh;
|
|
29
|
-
display:
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
33
|
+
display: flex;
|
|
34
|
+
flex-direction: column;
|
|
35
|
+
}
|
|
36
|
+
header { padding: 28px clamp(24px, 6vw, 56px); }
|
|
37
|
+
.wordmark {
|
|
38
|
+
display: inline-flex;
|
|
39
|
+
align-items: center;
|
|
40
|
+
gap: 10px;
|
|
41
|
+
font-weight: 800;
|
|
42
|
+
font-size: 19px;
|
|
43
|
+
letter-spacing: -0.02em;
|
|
44
|
+
}
|
|
45
|
+
.wordmark .dot {
|
|
46
|
+
width: 13px;
|
|
47
|
+
height: 13px;
|
|
48
|
+
border-radius: 3px;
|
|
49
|
+
background: #ff3300;
|
|
50
|
+
box-shadow: 0 0 0 4px rgba(255, 90, 30, 0.18);
|
|
35
51
|
}
|
|
36
52
|
main {
|
|
53
|
+
flex: 1;
|
|
54
|
+
display: flex;
|
|
55
|
+
flex-direction: column;
|
|
56
|
+
align-items: center;
|
|
57
|
+
justify-content: center;
|
|
37
58
|
text-align: center;
|
|
38
|
-
padding:
|
|
39
|
-
max-width: 32rem;
|
|
59
|
+
padding: 24px clamp(24px, 6vw, 56px) 72px;
|
|
40
60
|
}
|
|
41
|
-
|
|
42
|
-
|
|
61
|
+
.eyebrow {
|
|
62
|
+
display: inline-flex;
|
|
63
|
+
align-items: center;
|
|
64
|
+
gap: 8px;
|
|
65
|
+
font-size: 12.5px;
|
|
43
66
|
font-weight: 600;
|
|
44
|
-
|
|
67
|
+
letter-spacing: 0.05em;
|
|
68
|
+
text-transform: uppercase;
|
|
69
|
+
color: #a4441f;
|
|
70
|
+
background: rgba(255, 90, 30, 0.1);
|
|
71
|
+
border: 1px solid rgba(255, 90, 30, 0.22);
|
|
72
|
+
padding: 6px 14px;
|
|
73
|
+
border-radius: 999px;
|
|
74
|
+
margin-bottom: 26px;
|
|
75
|
+
}
|
|
76
|
+
.eyebrow .pulse {
|
|
77
|
+
width: 7px;
|
|
78
|
+
height: 7px;
|
|
79
|
+
border-radius: 50%;
|
|
80
|
+
background: #ff3300;
|
|
45
81
|
}
|
|
82
|
+
h1 {
|
|
83
|
+
font-size: clamp(34px, 6vw, 60px);
|
|
84
|
+
line-height: 1.05;
|
|
85
|
+
letter-spacing: -0.035em;
|
|
86
|
+
font-weight: 820;
|
|
87
|
+
max-width: 16ch;
|
|
88
|
+
}
|
|
89
|
+
h1 .accent { color: #ff3300; }
|
|
46
90
|
p {
|
|
47
|
-
margin:
|
|
48
|
-
|
|
49
|
-
|
|
91
|
+
margin-top: 20px;
|
|
92
|
+
font-size: clamp(15px, 1.8vw, 19px);
|
|
93
|
+
line-height: 1.55;
|
|
94
|
+
max-width: 46ch;
|
|
95
|
+
color: #54504a;
|
|
96
|
+
}
|
|
97
|
+
footer {
|
|
98
|
+
padding: 24px clamp(24px, 6vw, 56px);
|
|
99
|
+
text-align: center;
|
|
100
|
+
font-size: 13px;
|
|
101
|
+
color: #8c877f;
|
|
50
102
|
}
|
|
51
103
|
</style>
|
|
52
104
|
</head>
|
|
53
105
|
<body>
|
|
106
|
+
<header>
|
|
107
|
+
<span class="wordmark"><span class="dot"></span>Rivet</span>
|
|
108
|
+
</header>
|
|
54
109
|
<main>
|
|
55
|
-
<
|
|
56
|
-
<
|
|
110
|
+
<span class="eyebrow"><span class="pulse"></span>Empty project</span>
|
|
111
|
+
<h1>Your <span class="accent">blank canvas</span></h1>
|
|
112
|
+
<p>Point and click to edit this page in Rivet, or ask Claude to build something here.</p>
|
|
57
113
|
</main>
|
|
114
|
+
<footer>Make it yours.</footer>
|
|
58
115
|
</body>
|
|
59
116
|
</html>
|
|
60
117
|
`;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"staticStarter.js","sourceRoot":"","sources":["../../src/services/staticStarter.ts"],"names":[],"mappings":";;;;;;
|
|
1
|
+
{"version":3,"file":"staticStarter.js","sourceRoot":"","sources":["../../src/services/staticStarter.ts"],"names":[],"mappings":";;;;;;AAgIA,8DAeC;AA/ID,4CAAoB;AACpB,gDAAwB;AACxB,4CAA+C;AAE/C,MAAM,GAAG,GAAG,IAAA,qBAAY,EAAC,eAAe,CAAC,CAAC;AAE1C;;;;GAIG;AACU,QAAA,mBAAmB,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoGlC,CAAC;AAEF;;;;;;;;;;;;;;GAcG;AACH,SAAgB,yBAAyB,CAAC,WAAmB;IAC3D,IAAI,CAAC;QACH,IAAI,YAAE,CAAC,UAAU,CAAC,cAAI,CAAC,IAAI,CAAC,WAAW,EAAE,YAAY,CAAC,CAAC;YAAE,OAAO,KAAK,CAAC;QACtE,IAAI,YAAE,CAAC,UAAU,CAAC,cAAI,CAAC,IAAI,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC;YAAE,OAAO,KAAK,CAAC;QAClE,YAAE,CAAC,aAAa,CACd,cAAI,CAAC,IAAI,CAAC,WAAW,EAAE,YAAY,CAAC,EACpC,2BAAmB,EACnB,MAAM,CACP,CAAC;QACF,GAAG,CAAC,IAAI,CAAC,yDAAyD,WAAW,EAAE,CAAC,CAAC;QACjF,OAAO,IAAI,CAAC;IACd,CAAC;IAAC,OAAO,GAAG,EAAE,CAAC;QACb,GAAG,CAAC,IAAI,CAAC,yCAAyC,WAAW,GAAG,EAAE,GAAG,CAAC,CAAC;QACvE,OAAO,KAAK,CAAC;IACf,CAAC;AACH,CAAC"}
|
|
@@ -7,5 +7,5 @@
|
|
|
7
7
|
* the spec in a shape that drops cleanly into a `motionBrief`
|
|
8
8
|
* sourceArtifact.
|
|
9
9
|
*/
|
|
10
|
-
export declare const DESCRIBE_MOTION_PROTOCOL = "### Describe Motion protocol (video / motion artifact -> motionBrief)\n\nUse this protocol when the user attaches a video, gif, screen recording, or\nframe sequence to a variants request. The output is a structured motion spec\nthe agent passes back to Rivet as a `sourceArtifacts` entry with\n`kind: 'motionBrief'`. Run this BEFORE `start_variants` so the spec is\navailable to per-variant briefs and codegen.\n\nIf the user provided ONLY a static image or a URL, this protocol is the wrong\ntool \u2014 describe the image as `visualBrief` / `screenshotNotes` instead.\n\n#### Step 1 \u2014 Get frames you can inspect\n\nGuessing from memory of a single playback is the most common failure mode.\nPull stills before describing anything.\n\n- **Video (.mov/.mp4/.webm):** `ffmpeg -i <input> -vf \"fps=30\" frames/%04d.png`\n to step through, or `ffmpeg -i <input> -ss <timestamp> -frames:v 1 frame.png`\n for a single frame around a state change.\n- **GIF:** `magick <input> -coalesce frames/%04d.png` (ImageMagick) for\n per-frame stills.\n- **Unknown framerate:** assume 30 or 60fps. 33ms per frame at 30fps,\n 16ms per frame at 60fps. Multiply frame count between state-change\n boundaries to get duration.\n- **Frame sequence already supplied:** read every frame. The middle frames\n carry the easing.\n\nIf you cannot extract frames in the current environment, say so explicitly in\nthe spec and mark timing / easing fields with `~estimated`.\n\n#### Step 2 \u2014 Five-phase pass\n\nRun these in order. Later phases depend on earlier observations.\n\n1. **Elements & trigger.** Which DOM nodes change between frames, what\n initiates the motion (`hover`, `click`, `focus`, `mount`, `unmount`,\n `scroll`, `intersection`, `drag`, `route change`, `state change`,\n `keypress`), and the direction (entrance / exit / hover / toggle / loop).\n2. **States.** Enumerate discrete states. Most interactions are A -> B\n or A -> B -> A. Some have intermediates (idle -> loading -> success).\n For each state, note every property that will animate.\n3. **Per-property motion.** For each animated property on each element:\n - **Property** \u2014 prefer compositor-friendly (`transform`, `opacity`).\n - **From -> to** \u2014 concrete values (`opacity: 0 -> 1`, `translateY: 8px -> 0`).\n - **Duration** \u2014 milliseconds, measured from frame count. Round to common\n UI durations when within 1 frame: 150, 200, 250, 300, 400, 500ms.\n - **Easing** \u2014 identify by shape (see easing guide below), not by guessing\n a cubic-bezier from memory.\n - **Delay** \u2014 t=0 or later?\n4. **Choreography.** How per-property animations relate across elements:\n parallel (default), sequence (B starts after A), stagger (siblings with a\n fixed offset \u2014 note interval and direction), overlap (B starts before A\n finishes \u2014 note overlap duration), anchor / transform origin if non-default.\n5. **Edge cases & quality.** Cover all of these, even if the answer is\n \"not visible in artifact \u2014 recommend default\":\n - **Reduced motion** \u2014 what `prefers-reduced-motion: reduce` should do.\n Default: skip transforms, keep opacity, shorten to ~0ms.\n - **Interrupt** \u2014 re-trigger mid-animation: snap, reverse from current,\n or queue?\n - **Exit symmetry** \u2014 is the exit the reverse of the entrance, or different?\n - **Loop** \u2014 one-shot, loop, ping-pong, or on-demand?\n - **Performance flags** \u2014 any property that would force layout\n (`height`, `width`, `top`)? Flag and suggest a transform alternative\n if visually equivalent.\n\n#### Easing identification guide\n\nWatch the speed across the animation, not just the endpoints.\n\n- **Linear** \u2014 constant speed. Mechanical-feeling. Rare in good UI.\n- **Ease-out** \u2014 fast start, slow end. Most common entrance.\n- **Ease-in** \u2014 slow start, fast end. Best for exits.\n- **Ease-in-out** \u2014 slow-fast-slow. For transitions between two non-home states.\n- **Spring** \u2014 overshoots, then settles. Look for any frame where the element\n passes its final position. Springs cross the target; ease-out approaches\n monotonically.\n- **Back-out / overshoot** \u2014 ease-out with a slight overshoot before settling.\n\n#### Library recommendation\n\nPick one based on what you observed; the downstream codegen may override.\n\n- **CSS transitions** \u2014 simple state change, single property, no interrupt\n complexity.\n- **CSS keyframes** \u2014 loops, multi-step sequences with fixed timing.\n- **Framer Motion** \u2014 springs, gestures, layout animations, exit animations\n via `AnimatePresence`, stagger via `staggerChildren`.\n- **React Spring** \u2014 physics-driven motion where spring feel matters more\n than precise timing.\n- **GSAP** \u2014 complex sequences, timeline choreography, SVG morphing.\n- **Native View Transitions API** \u2014 page / route transitions where browser\n support allows.\n\n#### Spec template (the motionBrief `content` payload)\n\nAlways produce this exact shape. If a field is not observable, write\n`not visible in artifact` \u2014 do not omit the field. The content string is\nwhat you pass as `sourceArtifacts[i].content`.\n\n```\n# Motion spec: <short name>\n\n## Source\n- Artifact: <filename or description>\n- Input type: video | gif | recording | frame-sequence\n- Frames inspected: <count or \"single playback only\">\n- Estimated framerate: <30 | 60 | unknown>\n\n## Trigger\n- Event: <hover | click | mount | scroll | intersection | ...>\n- Element receiving event: <selector or description>\n\n## Elements animated\n1. <element name> \u2014 role in interaction\n2. ...\n\n## States\n- A (initial): <description>\n- B (final): <description>\n- (intermediate states if any)\n\n## Per-property motion\n### <element 1>\n- \\`<property>\\`: <from> -> <to>, duration <ms>, easing <type>, delay <ms>\n- ...\n\n### <element 2>\n- ...\n\n## Choreography\n- <parallel | sequence | stagger | overlap with details>\n- Transform origin: <if non-default>\n\n## Edge cases\n- Reduced motion: <behavior>\n- Interrupt: <snap | reverse | queue>\n- Exit: <symmetric reverse | different \u2014 describe>\n- Loop: <one-shot | loop | ping-pong>\n- Performance flags: <any layout-thrashing properties>\n\n## Recommended implementation\n- Library: <css | framer-motion | gsap | react-spring | view-transitions>\n- Reason: <one line>\n\n## Confidence\n- High / Medium / Low on: <which fields>\n- Estimates flagged with ~ in the spec above\n```\n\n#### Working principles\n\n- **Numbers over adjectives.** \"Fast\" is useless; \"180ms\" is implementable.\n If you cannot get a number, write `~estimated` and a range.\n- **Frame counting beats vibes.** Snappy ~ 150-250ms; deliberate ~ 300-500ms.\n Measure when you can.\n- **Identify easing by shape, not by name.** Watch where the element sits\n at 25%, 50%, 75% of the duration. Even spacing = linear. Compressed at\n the end = ease-out.\n- **Distinguish observed from inferred.** Anything not seen in the artifact\n is inference. Mark it.\n- **One spec per interaction.** If the video shows three interactions,\n produce three motionBrief entries, not one merged blob.\n\n#### Handing the spec back to Rivet\n\nPass each finished spec as one entry in `sourceArtifacts`:\n\n```\nsourceArtifacts: [\n {\n kind: 'motionBrief',\n label: '<short interaction name, <= 60 chars>',\n content: '<the full spec from the template above>',\n },\n // ... one entry per distinct interaction in the video\n]\n```\n\n**Routing.** A request that carries any `sourceArtifacts` (motionBrief,\nvisualBrief, screenshotNotes, siteBrief, urlText) is source-grounded.\nSource-grounded fresh-project sessions go through\n`
|
|
10
|
+
export declare const DESCRIBE_MOTION_PROTOCOL = "### Describe Motion protocol (video / motion artifact -> motionBrief)\n\nUse this protocol when the user attaches a video, gif, screen recording, or\nframe sequence to a variants request. The output is a structured motion spec\nthe agent passes back to Rivet as a `sourceArtifacts` entry with\n`kind: 'motionBrief'`. Run this BEFORE `start_variants` so the spec is\navailable to per-variant briefs and codegen.\n\nIf the user provided ONLY a static image or a URL, this protocol is the wrong\ntool \u2014 describe the image as `visualBrief` / `screenshotNotes` instead.\n\n#### Step 1 \u2014 Get frames you can inspect\n\nGuessing from memory of a single playback is the most common failure mode.\nPull stills before describing anything.\n\n- **Video (.mov/.mp4/.webm):** `ffmpeg -i <input> -vf \"fps=30\" frames/%04d.png`\n to step through, or `ffmpeg -i <input> -ss <timestamp> -frames:v 1 frame.png`\n for a single frame around a state change.\n- **GIF:** `magick <input> -coalesce frames/%04d.png` (ImageMagick) for\n per-frame stills.\n- **Unknown framerate:** assume 30 or 60fps. 33ms per frame at 30fps,\n 16ms per frame at 60fps. Multiply frame count between state-change\n boundaries to get duration.\n- **Frame sequence already supplied:** read every frame. The middle frames\n carry the easing.\n\nIf you cannot extract frames in the current environment, say so explicitly in\nthe spec and mark timing / easing fields with `~estimated`.\n\n#### Step 2 \u2014 Five-phase pass\n\nRun these in order. Later phases depend on earlier observations.\n\n1. **Elements & trigger.** Which DOM nodes change between frames, what\n initiates the motion (`hover`, `click`, `focus`, `mount`, `unmount`,\n `scroll`, `intersection`, `drag`, `route change`, `state change`,\n `keypress`), and the direction (entrance / exit / hover / toggle / loop).\n2. **States.** Enumerate discrete states. Most interactions are A -> B\n or A -> B -> A. Some have intermediates (idle -> loading -> success).\n For each state, note every property that will animate.\n3. **Per-property motion.** For each animated property on each element:\n - **Property** \u2014 prefer compositor-friendly (`transform`, `opacity`).\n - **From -> to** \u2014 concrete values (`opacity: 0 -> 1`, `translateY: 8px -> 0`).\n - **Duration** \u2014 milliseconds, measured from frame count. Round to common\n UI durations when within 1 frame: 150, 200, 250, 300, 400, 500ms.\n - **Easing** \u2014 identify by shape (see easing guide below), not by guessing\n a cubic-bezier from memory.\n - **Delay** \u2014 t=0 or later?\n4. **Choreography.** How per-property animations relate across elements:\n parallel (default), sequence (B starts after A), stagger (siblings with a\n fixed offset \u2014 note interval and direction), overlap (B starts before A\n finishes \u2014 note overlap duration), anchor / transform origin if non-default.\n5. **Edge cases & quality.** Cover all of these, even if the answer is\n \"not visible in artifact \u2014 recommend default\":\n - **Reduced motion** \u2014 what `prefers-reduced-motion: reduce` should do.\n Default: skip transforms, keep opacity, shorten to ~0ms.\n - **Interrupt** \u2014 re-trigger mid-animation: snap, reverse from current,\n or queue?\n - **Exit symmetry** \u2014 is the exit the reverse of the entrance, or different?\n - **Loop** \u2014 one-shot, loop, ping-pong, or on-demand?\n - **Performance flags** \u2014 any property that would force layout\n (`height`, `width`, `top`)? Flag and suggest a transform alternative\n if visually equivalent.\n\n#### Easing identification guide\n\nWatch the speed across the animation, not just the endpoints.\n\n- **Linear** \u2014 constant speed. Mechanical-feeling. Rare in good UI.\n- **Ease-out** \u2014 fast start, slow end. Most common entrance.\n- **Ease-in** \u2014 slow start, fast end. Best for exits.\n- **Ease-in-out** \u2014 slow-fast-slow. For transitions between two non-home states.\n- **Spring** \u2014 overshoots, then settles. Look for any frame where the element\n passes its final position. Springs cross the target; ease-out approaches\n monotonically.\n- **Back-out / overshoot** \u2014 ease-out with a slight overshoot before settling.\n\n#### Library recommendation\n\nPick one based on what you observed; the downstream codegen may override.\n\n- **CSS transitions** \u2014 simple state change, single property, no interrupt\n complexity.\n- **CSS keyframes** \u2014 loops, multi-step sequences with fixed timing.\n- **Framer Motion** \u2014 springs, gestures, layout animations, exit animations\n via `AnimatePresence`, stagger via `staggerChildren`.\n- **React Spring** \u2014 physics-driven motion where spring feel matters more\n than precise timing.\n- **GSAP** \u2014 complex sequences, timeline choreography, SVG morphing.\n- **Native View Transitions API** \u2014 page / route transitions where browser\n support allows.\n\n#### Spec template (the motionBrief `content` payload)\n\nAlways produce this exact shape. If a field is not observable, write\n`not visible in artifact` \u2014 do not omit the field. The content string is\nwhat you pass as `sourceArtifacts[i].content`.\n\n```\n# Motion spec: <short name>\n\n## Source\n- Artifact: <filename or description>\n- Input type: video | gif | recording | frame-sequence\n- Frames inspected: <count or \"single playback only\">\n- Estimated framerate: <30 | 60 | unknown>\n\n## Trigger\n- Event: <hover | click | mount | scroll | intersection | ...>\n- Element receiving event: <selector or description>\n\n## Elements animated\n1. <element name> \u2014 role in interaction\n2. ...\n\n## States\n- A (initial): <description>\n- B (final): <description>\n- (intermediate states if any)\n\n## Per-property motion\n### <element 1>\n- \\`<property>\\`: <from> -> <to>, duration <ms>, easing <type>, delay <ms>\n- ...\n\n### <element 2>\n- ...\n\n## Choreography\n- <parallel | sequence | stagger | overlap with details>\n- Transform origin: <if non-default>\n\n## Edge cases\n- Reduced motion: <behavior>\n- Interrupt: <snap | reverse | queue>\n- Exit: <symmetric reverse | different \u2014 describe>\n- Loop: <one-shot | loop | ping-pong>\n- Performance flags: <any layout-thrashing properties>\n\n## Recommended implementation\n- Library: <css | framer-motion | gsap | react-spring | view-transitions>\n- Reason: <one line>\n\n## Confidence\n- High / Medium / Low on: <which fields>\n- Estimates flagged with ~ in the spec above\n```\n\n#### Working principles\n\n- **Numbers over adjectives.** \"Fast\" is useless; \"180ms\" is implementable.\n If you cannot get a number, write `~estimated` and a range.\n- **Frame counting beats vibes.** Snappy ~ 150-250ms; deliberate ~ 300-500ms.\n Measure when you can.\n- **Identify easing by shape, not by name.** Watch where the element sits\n at 25%, 50%, 75% of the duration. Even spacing = linear. Compressed at\n the end = ease-out.\n- **Distinguish observed from inferred.** Anything not seen in the artifact\n is inference. Mark it.\n- **One spec per interaction.** If the video shows three interactions,\n produce three motionBrief entries, not one merged blob.\n\n#### Handing the spec back to Rivet\n\nPass each finished spec as one entry in `sourceArtifacts`:\n\n```\nsourceArtifacts: [\n {\n kind: 'motionBrief',\n label: '<short interaction name, <= 60 chars>',\n content: '<the full spec from the template above>',\n },\n // ... one entry per distinct interaction in the video\n]\n```\n\n**Routing.** A request that carries any `sourceArtifacts` (motionBrief,\nvisualBrief, screenshotNotes, siteBrief, urlText) is source-grounded.\nSource-grounded fresh-project sessions go through\n`start_variants({ mode: 'zero_to_one' })` \u2014 pass the artifacts under\n`sourceContext.sourceArtifacts`. start_variants detects the source-grounded\ninput and runs the source-research (`source_plan`) flow automatically,\nreturning `stage: 'awaiting_source_plan'` (rather than the prompt-only\nsingle-call `work_items_ready`).\n\nstart_variants is the single fresh-project entry point \u2014 there is **no**\nseparate source-grounded kickoff tool. A prompt-only `start_variants({ mode:\n'zero_to_one' })` call (no `sourceContext`) takes the single-call path and\nreturns `work_items_ready` directly; adding any `sourceArtifacts` /\n`sourceUrls` switches it to the multi-step source-research flow.\n\nIf the video is supplementary to an existing project (the user wants\nvariants of a specific element / file / route in their open project and\nattached a video for motion reference), use\n`start_variants({ mode: 'existing', target: ... })` instead and embed the\nmotion spec into each variant's `briefs[i].body` \u2014 `sourceArtifacts` are\nnot part of the existing-project flow.\n\nPer-variant briefs and codegen should treat the motionBrief as authoritative\ntiming / easing / choreography guidance \u2014 visual styling can diverge per\nvariant, motion fidelity should not.";
|
|
11
11
|
//# sourceMappingURL=describe-motion-protocol.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"describe-motion-protocol.d.ts","sourceRoot":"","sources":["../../../src/utils/skills/describe-motion-protocol.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AACH,eAAO,MAAM,wBAAwB,
|
|
1
|
+
{"version":3,"file":"describe-motion-protocol.d.ts","sourceRoot":"","sources":["../../../src/utils/skills/describe-motion-protocol.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AACH,eAAO,MAAM,wBAAwB,w1RA0MA,CAAC"}
|
|
@@ -191,17 +191,17 @@ sourceArtifacts: [
|
|
|
191
191
|
**Routing.** A request that carries any \`sourceArtifacts\` (motionBrief,
|
|
192
192
|
visualBrief, screenshotNotes, siteBrief, urlText) is source-grounded.
|
|
193
193
|
Source-grounded fresh-project sessions go through
|
|
194
|
-
\`
|
|
195
|
-
\`
|
|
196
|
-
\`
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
the
|
|
201
|
-
|
|
202
|
-
(\`
|
|
203
|
-
\`
|
|
204
|
-
|
|
194
|
+
\`start_variants({ mode: 'zero_to_one' })\` — pass the artifacts under
|
|
195
|
+
\`sourceContext.sourceArtifacts\`. start_variants detects the source-grounded
|
|
196
|
+
input and runs the source-research (\`source_plan\`) flow automatically,
|
|
197
|
+
returning \`stage: 'awaiting_source_plan'\` (rather than the prompt-only
|
|
198
|
+
single-call \`work_items_ready\`).
|
|
199
|
+
|
|
200
|
+
start_variants is the single fresh-project entry point — there is **no**
|
|
201
|
+
separate source-grounded kickoff tool. A prompt-only \`start_variants({ mode:
|
|
202
|
+
'zero_to_one' })\` call (no \`sourceContext\`) takes the single-call path and
|
|
203
|
+
returns \`work_items_ready\` directly; adding any \`sourceArtifacts\` /
|
|
204
|
+
\`sourceUrls\` switches it to the multi-step source-research flow.
|
|
205
205
|
|
|
206
206
|
If the video is supplementary to an existing project (the user wants
|
|
207
207
|
variants of a specific element / file / route in their open project and
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"shared-variants-protocol.d.ts","sourceRoot":"","sources":["../../../src/utils/skills/shared-variants-protocol.ts"],"names":[],"mappings":"AAEA;;;;GAIG;AACH,eAAO,MAAM,wBAAwB,QAGgF,CAAC;AAEtH,0DAA0D;AAC1D,eAAO,MAAM,sBAAsB,mjCAQoK,CAAC;AAExM;;;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,
|
|
1
|
+
{"version":3,"file":"shared-variants-protocol.d.ts","sourceRoot":"","sources":["../../../src/utils/skills/shared-variants-protocol.ts"],"names":[],"mappings":"AAEA;;;;GAIG;AACH,eAAO,MAAM,wBAAwB,QAGgF,CAAC;AAEtH,0DAA0D;AAC1D,eAAO,MAAM,sBAAsB,mjCAQoK,CAAC;AAExM;;;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,CA6GT"}
|
|
@@ -88,14 +88,15 @@ For brand-new projects the user describes from scratch ("build me a Vite todo ap
|
|
|
88
88
|
|
|
89
89
|
---
|
|
90
90
|
|
|
91
|
-
### Sub-flow C: Fresh project (source-grounded) — \`
|
|
91
|
+
### Sub-flow C: Fresh project (source-grounded) — \`start_variants\`
|
|
92
92
|
|
|
93
93
|
**Trigger:** the user provided inspiration URLs ("like stripe.com"), attached an image in chat (pasted screenshot/mockup), attached a video/gif/screen recording ("match this animation", "build the hover from this clip"), referenced an image or video file path (e.g. \`~/Desktop/mockup.png\`, \`~/Desktop/hover.mov\`), or supplied written design context. Image-only and video-only requests with no URLs are valid and belong in this sub-flow — do not fall back to Sub-flow B.
|
|
94
94
|
|
|
95
|
-
Use
|
|
95
|
+
Use the same \`start_variants({ mode: 'zero_to_one' })\` entry point as Sub-flow B, but pass a \`sourceContext\`. When \`sourceContext\` carries \`sourceUrls\`, \`sourceArtifacts\`, or \`sourceIntent\`, start_variants detects the source-grounded input and runs the source-research flow automatically — returning \`stage: 'awaiting_source_plan'\` instead of the prompt-only single-call \`work_items_ready\`. start_variants is the single fresh-project entry point — there is no separate source-grounded kickoff tool.
|
|
96
96
|
|
|
97
|
-
1. **Call \`
|
|
97
|
+
1. **Call \`start_variants\`** with:
|
|
98
98
|
- \`prompt\`: the user's request verbatim
|
|
99
|
+
- \`mode\`: \`'zero_to_one'\`
|
|
99
100
|
- \`framework\` (optional, defaults to \`'vite'\`)
|
|
100
101
|
- \`destinationParent\` (optional, absolute path)
|
|
101
102
|
- \`sourceContext\`:
|
|
@@ -103,7 +104,7 @@ Use \`create_zero_to_one_project\` for this sub-flow. \`start_variants({ mode: '
|
|
|
103
104
|
- \`preserveBrand\` (optional): true when the user wants brand colors/type/voice preserved exactly
|
|
104
105
|
- \`sourceArtifacts\` (optional): pasted briefs, screenshot notes, written design context, **agent-described images**, OR **agent-described videos**. If the user attached one or more images in chat OR referenced an image file path: for path references, open the file with your \`Read\` tool first; then in both cases describe what you see — layout, colour palette, typography, component patterns, voice — and pass each image as a \`sourceArtifacts\` entry with \`kind: 'visualBrief'\` (overall design system) or \`kind: 'screenshotNotes'\` (specific screen). If the user attached a video, gif, screen recording, or frame sequence OR referenced a video file path: run the **Describe Motion protocol** (see section below) to extract a structured motion spec, and pass each spec as a \`sourceArtifacts\` entry with \`kind: 'motionBrief'\`. One \`motionBrief\` per distinct interaction in the video — do not merge multiple interactions into one entry. Do not invent a URL for an image or video. \`sourceArtifacts\` can fully replace \`sourceUrls\` — image-only and video-only calls (no URLs) are supported.
|
|
105
106
|
|
|
106
|
-
Response (source-grounded): \`{ sessionId, stage: 'awaiting_source_plan', sourcePlanWorkItem, nextAction: 'continue_variants', visualEditor? }\`. Share \`visualEditor.url\` with the user immediately.
|
|
107
|
+
Response (source-grounded): \`{ sessionId, stage: 'awaiting_source_plan', mode: 'zero_to_one', sourcePlanWorkItem, nextAction: 'continue_variants', destinationPath, visualEditor? }\`. Share \`visualEditor.url\` with the user immediately.
|
|
107
108
|
|
|
108
109
|
2. **Process the source_plan work item.** Classify the inspiration sources, produce per-slot DESIGN.md, and choose \`executionPlan.mode\`:
|
|
109
110
|
- DESIGN.md per slot matches the bundled catalog shape under \`src/services/templates/designmd/*.md\` (Visual Theme & Atmosphere → Color Palette & Roles → Typography Rules → Component Stylings → Layout Principles → Depth & Elevation → Do's & Don'ts → Responsive Behavior → Agent Prompt Guide). For sections you cannot determine from the source, write \`Not observed\` rather than inventing values.
|
|
@@ -131,6 +132,7 @@ ${describe_motion_protocol_1.DESCRIBE_MOTION_PROTOCOL}
|
|
|
131
132
|
- 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.
|
|
132
133
|
- Parallel code-gen is the only step where you fan out — every other step is one tool call.
|
|
133
134
|
- **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.
|
|
135
|
+
- **Honor aborts mid-generation.** When the user removes or cancels a direction while it is still generating, the very next \`report_variant_complete\` for that work item returns \`{ aborted: true }\`. Treat that as a hard stop for that one direction: abandon it immediately, do NOT retry or re-report it, and keep going on the rest. For directions that take a while to build, send periodic \`status: 'running'\` heartbeats through \`report_variant_complete\` so an abort is caught early instead of after you have spent the work — a cleared lease surfacing as \`{ aborted: true }\` (rather than an error) is the signal to drop it.
|
|
134
136
|
- 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.`;
|
|
135
137
|
}
|
|
136
138
|
//# sourceMappingURL=shared-variants-protocol.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"shared-variants-protocol.js","sourceRoot":"","sources":["../../../src/utils/skills/shared-variants-protocol.ts"],"names":[],"mappings":";;;AA2BA,
|
|
1
|
+
{"version":3,"file":"shared-variants-protocol.js","sourceRoot":"","sources":["../../../src/utils/skills/shared-variants-protocol.ts"],"names":[],"mappings":";;;AA2BA,8DAsHC;AAjJD,yEAAsE;AAEtE;;;;GAIG;AACU,QAAA,wBAAwB,GACnC,kGAAkG;IAClG,0FAA0F;IAC1F,mHAAmH,CAAC;AAEtH,0DAA0D;AAC7C,QAAA,sBAAsB,GAAG;;;;;;;;uMAQiK,CAAC;AAExM;;;GAGG;AACH,SAAgB,yBAAyB,CAAC,IASzC;IACC,OAAO;;oMAE2L,IAAI,CAAC,cAAc,uJAAuJ,IAAI,CAAC,cAAc;;;;;;;;;;;;;;uKAc1N,gCAAwB;;;;;;;KAO1L,IAAI,CAAC,KAAK;;;;;;;;;;;KAWV,IAAI,CAAC,YAAY;;;;;;;;;;;;;;;;;uKAiBiJ,gCAAwB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAwC7L,mDAAwB;;;;;;0CAMgB,IAAI,CAAC,cAAc;;;;;;;;;;oMAUuI,CAAC;AACrM,CAAC"}
|
package/package.json
CHANGED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scale-z:1;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-space-y-reverse:0;--tw-space-x-reverse:0;--tw-divide-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-ordinal:initial;--tw-slashed-zero:initial;--tw-numeric-figure:initial;--tw-numeric-spacing:initial;--tw-numeric-fraction:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-duration:initial;--tw-ease:initial}}}@layer theme{:root,:host{--font-sans:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-red-200:oklch(88.5% .062 18.334);--color-red-400:oklch(70.4% .191 22.216);--color-red-500:oklch(63.7% .237 25.331);--color-red-600:oklch(57.7% .245 27.325);--color-green-400:oklch(79.2% .209 151.711);--color-emerald-500:oklch(69.6% .17 162.48);--color-gray-300:oklch(87.2% .01 258.338);--color-gray-500:oklch(55.1% .027 264.364);--color-gray-600:oklch(44.6% .03 256.802);--color-gray-900:oklch(21% .034 264.665);--color-neutral-900:oklch(20.5% 0 0);--color-black:#000;--color-white:#fff;--spacing:.25rem;--container-xs:20rem;--container-sm:24rem;--container-md:28rem;--container-7xl:80rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-base:1rem;--text-base--line-height: 1.5 ;--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75 / 1.25);--text-3xl:1.875rem;--text-3xl--line-height: 1.2 ;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--tracking-wide:.025em;--tracking-wider:.05em;--leading-snug:1.375;--leading-relaxed:1.625;--radius-sm:.25rem;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--radius-2xl:1rem;--radius-3xl:1.5rem;--ease-out:cubic-bezier(0, 0, .2, 1);--ease-in-out:cubic-bezier(.4, 0, .2, 1);--animate-spin:spin 1s linear infinite;--animate-pulse:pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;--blur-sm:8px;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}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;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){-webkit-appearance:button;-moz-appearance:button;appearance:button}::file-selector-button{-webkit-appearance:button;-moz-appearance:button;appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}*,:after,:before{border-color:var(--color-main-border,#232328)}}@layer components;@layer utilities{.pointer-events-auto{pointer-events:auto}.pointer-events-none{pointer-events:none}.collapse{visibility:collapse}.invisible{visibility:hidden}.visible{visibility:visible}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.static{position:static}.sticky{position:sticky}.inset-0{inset:calc(var(--spacing) * 0)}.inset-\[5\%\]{top:5%;right:5%;bottom:5%;left:5%}.-top-0\.5{top:calc(var(--spacing) * -.5)}.-top-1{top:calc(var(--spacing) * -1)}.top-0{top:calc(var(--spacing) * 0)}.top-1{top:calc(var(--spacing) * 1)}.top-1\.5{top:calc(var(--spacing) * 1.5)}.top-1\/2{top:50%}.top-2{top:calc(var(--spacing) * 2)}.top-2\.5{top:calc(var(--spacing) * 2.5)}.top-3{top:calc(var(--spacing) * 3)}.top-4{top:calc(var(--spacing) * 4)}.-right-0\.5{right:calc(var(--spacing) * -.5)}.-right-1{right:calc(var(--spacing) * -1)}.right-0{right:calc(var(--spacing) * 0)}.right-1{right:calc(var(--spacing) * 1)}.right-2{right:calc(var(--spacing) * 2)}.right-3{right:calc(var(--spacing) * 3)}.right-6{right:calc(var(--spacing) * 6)}.bottom-6{bottom:calc(var(--spacing) * 6)}.bottom-full{bottom:100%}.left-0{left:calc(var(--spacing) * 0)}.left-1\/2{left:50%}.left-2{left:calc(var(--spacing) * 2)}.isolate{isolation:isolate}.z-0{z-index:0}.z-10{z-index:10}.z-20{z-index:20}.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}.container{width:100%}@media(min-width:40rem){.container{max-width:40rem}}@media(min-width:48rem){.container{max-width:48rem}}@media(min-width:64rem){.container{max-width:64rem}}@media(min-width:80rem){.container{max-width:80rem}}@media(min-width:96rem){.container{max-width:96rem}}.mx-1{margin-inline:calc(var(--spacing) * 1)}.mx-auto{margin-inline:auto}.my-1{margin-block:calc(var(--spacing) * 1)}.mt-0\.5{margin-top:calc(var(--spacing) * .5)}.mt-1{margin-top:calc(var(--spacing) * 1)}.mt-1\.5{margin-top:calc(var(--spacing) * 1.5)}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-4{margin-top:calc(var(--spacing) * 4)}.mt-\[1px\]{margin-top:1px}.-mr-0\.5{margin-right:calc(var(--spacing) * -.5)}.mr-1{margin-right:calc(var(--spacing) * 1)}.mb-1{margin-bottom:calc(var(--spacing) * 1)}.mb-2{margin-bottom:calc(var(--spacing) * 2)}.mb-4{margin-bottom:calc(var(--spacing) * 4)}.-ml-2\.5{margin-left:calc(var(--spacing) * -2.5)}.ml-1{margin-left:calc(var(--spacing) * 1)}.ml-1\.5{margin-left:calc(var(--spacing) * 1.5)}.ml-2{margin-left:calc(var(--spacing) * 2)}.ml-auto{margin-left:auto}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}.scrollbar-hide::-webkit-scrollbar{display:none}.line-clamp-2{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.block{display:block}.contents{display:contents}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.inline-flex{display:inline-flex}.inline-grid{display:inline-grid}.table{display:table}.aspect-\[4\/3\]{aspect-ratio:4/3}.h-0{height:calc(var(--spacing) * 0)}.h-1{height:calc(var(--spacing) * 1)}.h-2{height:calc(var(--spacing) * 2)}.h-2\.5{height:calc(var(--spacing) * 2.5)}.h-3{height:calc(var(--spacing) * 3)}.h-3\.5{height:calc(var(--spacing) * 3.5)}.h-4{height:calc(var(--spacing) * 4)}.h-5{height:calc(var(--spacing) * 5)}.h-6{height:calc(var(--spacing) * 6)}.h-7{height:calc(var(--spacing) * 7)}.h-8{height:calc(var(--spacing) * 8)}.h-10{height:calc(var(--spacing) * 10)}.h-44{height:calc(var(--spacing) * 44)}.h-52{height:calc(var(--spacing) * 52)}.h-80{height:calc(var(--spacing) * 80)}.h-96{height:calc(var(--spacing) * 96)}.h-\[450px\]{height:450px}.h-full{height:100%}.h-px{height:1px}.h-screen{height:100vh}.max-h-10{max-height:calc(var(--spacing) * 10)}.max-h-20{max-height:calc(var(--spacing) * 20)}.max-h-24{max-height:calc(var(--spacing) * 24)}.max-h-28{max-height:calc(var(--spacing) * 28)}.max-h-32{max-height:calc(var(--spacing) * 32)}.max-h-36{max-height:calc(var(--spacing) * 36)}.max-h-40{max-height:calc(var(--spacing) * 40)}.max-h-64{max-height:calc(var(--spacing) * 64)}.max-h-72{max-height:calc(var(--spacing) * 72)}.max-h-96{max-height:calc(var(--spacing) * 96)}.max-h-\[80vh\]{max-height:80vh}.min-h-0{min-height:calc(var(--spacing) * 0)}.min-h-\[2\.5rem\]{min-height:2.5rem}.min-h-screen{min-height:100vh}.w-0{width:calc(var(--spacing) * 0)}.w-2{width:calc(var(--spacing) * 2)}.w-2\.5{width:calc(var(--spacing) * 2.5)}.w-3{width:calc(var(--spacing) * 3)}.w-3\.5{width:calc(var(--spacing) * 3.5)}.w-4{width:calc(var(--spacing) * 4)}.w-5{width:calc(var(--spacing) * 5)}.w-6{width:calc(var(--spacing) * 6)}.w-7{width:calc(var(--spacing) * 7)}.w-8{width:calc(var(--spacing) * 8)}.w-10{width:calc(var(--spacing) * 10)}.w-12{width:calc(var(--spacing) * 12)}.w-20{width:calc(var(--spacing) * 20)}.w-24{width:calc(var(--spacing) * 24)}.w-28{width:calc(var(--spacing) * 28)}.w-32{width:calc(var(--spacing) * 32)}.w-44{width:calc(var(--spacing) * 44)}.w-48{width:calc(var(--spacing) * 48)}.w-56{width:calc(var(--spacing) * 56)}.w-64{width:calc(var(--spacing) * 64)}.w-72{width:calc(var(--spacing) * 72)}.w-80{width:calc(var(--spacing) * 80)}.w-96{width:calc(var(--spacing) * 96)}.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-full{width:100%}.w-px{width:1px}.max-w-7xl{max-width:var(--container-7xl)}.max-w-\[8rem\]{max-width:8rem}.max-w-\[80\%\]{max-width:80%}.max-w-\[180px\]{max-width:180px}.max-w-\[200px\]{max-width:200px}.max-w-\[300px\]{max-width:300px}.max-w-full{max-width:100%}.max-w-md{max-width:var(--container-md)}.max-w-sm{max-width:var(--container-sm)}.max-w-xs{max-width:var(--container-xs)}.min-w-0{min-width:calc(var(--spacing) * 0)}.min-w-4{min-width:calc(var(--spacing) * 4)}.min-w-\[140px\]{min-width:140px}.min-w-\[180px\]{min-width:180px}.flex-1{flex:1}.flex-shrink-0{flex-shrink:0}.shrink{flex-shrink:1}.shrink-0{flex-shrink:0}.grow{flex-grow:1}.-translate-x-1\/2{--tw-translate-x: -50% ;translate:var(--tw-translate-x) var(--tw-translate-y)}.-translate-y-1\/2{--tw-translate-y: -50% ;translate:var(--tw-translate-x) var(--tw-translate-y)}.scale-110{--tw-scale-x:110%;--tw-scale-y:110%;--tw-scale-z:110%;scale:var(--tw-scale-x) var(--tw-scale-y)}.rotate-90{rotate:90deg}.rotate-180{rotate:180deg}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.animate-pulse{animation:var(--animate-pulse)}.animate-spin{animation:var(--animate-spin)}.animate-token-highlight{animation:1.5s ease-in-out token-highlight}.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}.cursor-text{cursor:text}.touch-none{touch-action:none}.resize{resize:both}.resize-none{resize:none}.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-col{flex-direction:column}.flex-row{flex-direction:row}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-start{align-items:flex-start}.items-stretch{align-items:stretch}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.justify-start{justify-content:flex-start}.gap-0\.5{gap:calc(var(--spacing) * .5)}.gap-1{gap:calc(var(--spacing) * 1)}.gap-1\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-2\.5{gap:calc(var(--spacing) * 2.5)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-5{gap:calc(var(--spacing) * 5)}.gap-6{gap:calc(var(--spacing) * 6)}.gap-10{gap:calc(var(--spacing) * 10)}:where(.space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 1) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-1\.5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 1.5) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 1.5) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-3>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-10>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 10) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 10) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-x-1>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-start:calc(calc(var(--spacing) * 1) * var(--tw-space-x-reverse));margin-inline-end:calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-x-reverse)))}:where(.space-x-2>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-start:calc(calc(var(--spacing) * 2) * var(--tw-space-x-reverse));margin-inline-end:calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-x-reverse)))}:where(.divide-y>:not(:last-child)){--tw-divide-y-reverse:0;border-bottom-style:var(--tw-border-style);border-top-style:var(--tw-border-style);border-top-width:calc(1px * var(--tw-divide-y-reverse));border-bottom-width:calc(1px * calc(1 - var(--tw-divide-y-reverse)))}:where(.divide-main-border>:not(:last-child)){border-color:#232328}.self-start{align-self:flex-start}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-visible{overflow:visible}.overflow-y-auto{overflow-y:auto}.scroll-smooth{scroll-behavior:smooth}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-3xl{border-radius:var(--radius-3xl)}.rounded-\[10px\]{border-radius:10px}.rounded-\[20px\]{border-radius:20px}.rounded-\[22px\]{border-radius:22px}.rounded-\[64px\]{border-radius:64px}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-sm{border-radius:var(--radius-sm)}.rounded-xl{border-radius:var(--radius-xl)}.rounded-t-lg{border-top-left-radius:var(--radius-lg);border-top-right-radius:var(--radius-lg)}.rounded-l-lg{border-top-left-radius:var(--radius-lg);border-bottom-left-radius:var(--radius-lg)}.rounded-l-md{border-top-left-radius:var(--radius-md);border-bottom-left-radius:var(--radius-md)}.rounded-r-md{border-top-right-radius:var(--radius-md);border-bottom-right-radius:var(--radius-md)}.border{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-\[1px\]{border-style:var(--tw-border-style);border-width:1px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-t-\[6px\]{border-top-style:var(--tw-border-style);border-top-width:6px}.border-r-0{border-right-style:var(--tw-border-style);border-right-width:0}.border-r-\[4px\]{border-right-style:var(--tw-border-style);border-right-width:4px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-b-2{border-bottom-style:var(--tw-border-style);border-bottom-width:2px}.border-b-\[1px\]{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-l{border-left-style:var(--tw-border-style);border-left-width:1px}.border-l-\[4px\]{border-left-style:var(--tw-border-style);border-left-width:4px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-none{--tw-border-style:none;border-style:none}.border-\[\#6B97FF\]{border-color:#6b97ff}.border-border{border-color:var(--border)}.border-content-muted\/30{border-color:#d1d5db4d}.border-content-muted\/40{border-color:#d1d5db66}.border-divider{border-color:#4b5563}.border-gray-300{border-color:var(--color-gray-300)}.border-hover{border-color:var(--hover)}.border-main-border{border-color:#232328}.border-primary{border-color:#f30}.border-primary-border{border-color:#ff6b35}.border-primary\/30{border-color:#ff33004d}.border-transparent{border-color:#0000}.border-white\/10{border-color:#ffffff1a}@supports (color:color-mix(in lab,red,red)){.border-white\/10{border-color:color-mix(in oklab,var(--color-white) 10%,transparent)}}.border-white\/20{border-color:#fff3}@supports (color:color-mix(in lab,red,red)){.border-white\/20{border-color:color-mix(in oklab,var(--color-white) 20%,transparent)}}.border-t-content{border-top-color:#fff}.border-t-transparent{border-top-color:#0000}.border-r-transparent{border-right-color:#0000}.border-l-transparent{border-left-color:#0000}.bg-\[\#1c1c20\]{background-color:#1c1c20}.bg-\[\#f3ede3\]{background-color:#f3ede3}.bg-accent-error{background-color:#ef4444}.bg-accent-success{background-color:#10b981}.bg-accent\/20{background-color:var(--accent)}@supports (color:color-mix(in lab,red,red)){.bg-accent\/20{background-color:color-mix(in oklab,var(--accent) 20%,transparent)}}.bg-black\/40{background-color:#0006}@supports (color:color-mix(in lab,red,red)){.bg-black\/40{background-color:color-mix(in oklab,var(--color-black) 40%,transparent)}}.bg-black\/45{background-color:#00000073}@supports (color:color-mix(in lab,red,red)){.bg-black\/45{background-color:color-mix(in oklab,var(--color-black) 45%,transparent)}}.bg-black\/50{background-color:#00000080}@supports (color:color-mix(in lab,red,red)){.bg-black\/50{background-color:color-mix(in oklab,var(--color-black) 50%,transparent)}}.bg-divider{background-color:#4b5563}.bg-divider\/20{background-color:#4b556333}.bg-foreground{background-color:var(--foreground)}.bg-hover{background-color:var(--hover)}.bg-input{background-color:var(--input)}.bg-main{background-color:#1c1c20}.bg-main-border{background-color:#232328}.bg-main-hover{background-color:#404040}.bg-main-hover\/50{background-color:#40404080}.bg-main-input{background-color:#2e2e2e}.bg-main-input\/40{background-color:#2e2e2e66}.bg-main-input\/80{background-color:#2e2e2ecc}.bg-main-light{background-color:#1e1e22}.bg-main\/90{background-color:#1c1c20e6}.bg-muted-foreground\/15{background-color:var(--muted-foreground)}@supports (color:color-mix(in lab,red,red)){.bg-muted-foreground\/15{background-color:color-mix(in oklab,var(--muted-foreground) 15%,transparent)}}.bg-neutral-900{background-color:var(--color-neutral-900)}.bg-primary{background-color:#f30}.bg-primary\/10{background-color:#ff33001a}.bg-primary\/15{background-color:#ff330026}.bg-primary\/20{background-color:#f303}.bg-readOnly{background-color:#232323}.bg-red-500{background-color:var(--color-red-500)}.bg-red-500\/80{background-color:#fb2c36cc}@supports (color:color-mix(in lab,red,red)){.bg-red-500\/80{background-color:color-mix(in oklab,var(--color-red-500) 80%,transparent)}}.bg-secondary{background-color:var(--secondary)}.bg-transparent{background-color:#0000}.bg-white{background-color:var(--color-white)}.bg-white\/8{background-color:#ffffff14}@supports (color:color-mix(in lab,red,red)){.bg-white\/8{background-color:color-mix(in oklab,var(--color-white) 8%,transparent)}}.bg-white\/15{background-color:#ffffff26}@supports (color:color-mix(in lab,red,red)){.bg-white\/15{background-color:color-mix(in oklab,var(--color-white) 15%,transparent)}}.fill-main{fill:#1c1c20}.fill-main-input{fill:#2e2e2e}.object-contain{object-fit:contain}.object-cover{object-fit:cover}.p-0\.5{padding:calc(var(--spacing) * .5)}.p-1{padding:calc(var(--spacing) * 1)}.p-1\.5{padding:calc(var(--spacing) * 1.5)}.p-2{padding:calc(var(--spacing) * 2)}.p-3{padding:calc(var(--spacing) * 3)}.p-4{padding:calc(var(--spacing) * 4)}.p-6{padding:calc(var(--spacing) * 6)}.p-8{padding:calc(var(--spacing) * 8)}.px-1{padding-inline:calc(var(--spacing) * 1)}.px-1\.5{padding-inline:calc(var(--spacing) * 1.5)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-5{padding-inline:calc(var(--spacing) * 5)}.px-6{padding-inline:calc(var(--spacing) * 6)}.px-8{padding-inline:calc(var(--spacing) * 8)}.px-10{padding-inline:calc(var(--spacing) * 10)}.py-0\.5{padding-block:calc(var(--spacing) * .5)}.py-1{padding-block:calc(var(--spacing) * 1)}.py-1\.5{padding-block:calc(var(--spacing) * 1.5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-2\.5{padding-block:calc(var(--spacing) * 2.5)}.py-3{padding-block:calc(var(--spacing) * 3)}.py-3\.5{padding-block:calc(var(--spacing) * 3.5)}.py-4{padding-block:calc(var(--spacing) * 4)}.py-6{padding-block:calc(var(--spacing) * 6)}.py-8{padding-block:calc(var(--spacing) * 8)}.py-12{padding-block:calc(var(--spacing) * 12)}.py-14{padding-block:calc(var(--spacing) * 14)}.pt-1{padding-top:calc(var(--spacing) * 1)}.pt-2{padding-top:calc(var(--spacing) * 2)}.pt-3{padding-top:calc(var(--spacing) * 3)}.pr-1{padding-right:calc(var(--spacing) * 1)}.pr-2{padding-right:calc(var(--spacing) * 2)}.pr-3{padding-right:calc(var(--spacing) * 3)}.pr-4{padding-right:calc(var(--spacing) * 4)}.pr-8{padding-right:calc(var(--spacing) * 8)}.pb-0{padding-bottom:calc(var(--spacing) * 0)}.pb-1{padding-bottom:calc(var(--spacing) * 1)}.pb-2{padding-bottom:calc(var(--spacing) * 2)}.pb-3{padding-bottom:calc(var(--spacing) * 3)}.pb-4{padding-bottom:calc(var(--spacing) * 4)}.pl-2{padding-left:calc(var(--spacing) * 2)}.pl-3{padding-left:calc(var(--spacing) * 3)}.pl-4{padding-left:calc(var(--spacing) * 4)}.pl-7{padding-left:calc(var(--spacing) * 7)}.pl-8{padding-left:calc(var(--spacing) * 8)}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.font-main{font-family:Satoshi,Inter,system-ui,-apple-system,Segoe UI,sans-serif}.font-mono{font-family:var(--font-mono)}.font-sans{font-family:var(--font-sans)}.text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\[9px\]{font-size:9px}.text-\[10px\]{font-size:10px}.text-\[11px\]{font-size:11px}.text-\[12px\]{font-size:12px}.text-\[13px\]{font-size:13px}.leading-4{--tw-leading:calc(var(--spacing) * 4);line-height:calc(var(--spacing) * 4)}.leading-none{--tw-leading:1;line-height:1}.leading-relaxed{--tw-leading:var(--leading-relaxed);line-height:var(--leading-relaxed)}.leading-snug{--tw-leading:var(--leading-snug);line-height:var(--leading-snug)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-normal{--tw-font-weight:var(--font-weight-normal);font-weight:var(--font-weight-normal)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.tracking-wider{--tw-tracking:var(--tracking-wider);letter-spacing:var(--tracking-wider)}.break-words{overflow-wrap:break-word}.break-all{word-break:break-all}.whitespace-nowrap{white-space:nowrap}.whitespace-pre-wrap{white-space:pre-wrap}.text-accent-error{color:#ef4444}.text-content{color:#fff}.text-content-muted{color:#d1d5db}.text-content-subtle{color:#9ca3af}.text-emerald-500{color:var(--color-emerald-500)}.text-foreground{color:var(--foreground)}.text-gray-300{color:var(--color-gray-300)}.text-gray-500{color:var(--color-gray-500)}.text-gray-600{color:var(--color-gray-600)}.text-gray-900{color:var(--color-gray-900)}.text-green-400{color:var(--color-green-400)}.text-muted-foreground{color:var(--muted-foreground)}.text-primary{color:#f30}.text-red-200{color:var(--color-red-200)}.text-red-400{color:var(--color-red-400)}.text-red-500{color:var(--color-red-500)}.text-secondary-foreground{color:var(--secondary-foreground)}.text-transparent{color:#0000}.text-white{color:var(--color-white)}.text-white\/60{color:#fff9}@supports (color:color-mix(in lab,red,red)){.text-white\/60{color:color-mix(in oklab,var(--color-white) 60%,transparent)}}.text-white\/70{color:#ffffffb3}@supports (color:color-mix(in lab,red,red)){.text-white\/70{color:color-mix(in oklab,var(--color-white) 70%,transparent)}}.capitalize{text-transform:capitalize}.uppercase{text-transform:uppercase}.tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}.underline{text-decoration-line:underline}.placeholder-content-subtle::placeholder{color:#9ca3af}.opacity-0{opacity:0}.opacity-50{opacity:.5}.opacity-60{opacity:.6}.opacity-100{opacity:1}.shadow{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-2xl{--tw-shadow:0 25px 50px -12px var(--tw-shadow-color,#00000040);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a), 0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-md{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a), 0 2px 4px -2px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-xl{--tw-shadow:0 20px 25px -5px var(--tw-shadow-color,#0000001a), 0 8px 10px -6px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ring,.ring-1{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ring-2{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ring-content-muted\/40{--tw-ring-color:oklab(87.1681% -.00188759 -.00914592/.4)}.ring-primary{--tw-ring-color:#f30}.ring-offset-1{--tw-ring-offset-width:1px;--tw-ring-offset-shadow:var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}.ring-offset-background{--tw-ring-offset-color:var(--background)}.outline,.outline-1{outline-style:var(--tw-outline-style);outline-width:1px}.outline-transparent{outline-color:#0000}.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(110%);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(var(--blur-sm));-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,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[color\,font-variation-settings\]{transition-property:color,font-variation-settings;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[color\,stroke-width\]{transition-property:color,stroke-width;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[filter\]{transition-property:filter;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[outline-color\]{transition-property:outline-color;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-80{--tw-duration:80ms;transition-duration:80ms}.duration-100{--tw-duration:.1s;transition-duration:.1s}.duration-150{--tw-duration:.15s;transition-duration:.15s}.duration-200{--tw-duration:.2s;transition-duration:.2s}.ease-in-out{--tw-ease:var(--ease-in-out);transition-timing-function:var(--ease-in-out)}.ease-out{--tw-ease:var(--ease-out);transition-timing-function:var(--ease-out)}.outline-none{--tw-outline-style:none;outline-style:none}.select-none{-webkit-user-select:none;user-select:none}.select-text{-webkit-user-select:text;user-select:text}.ring-inset{--tw-ring-inset:inset}@media(hover:hover){.group-hover\:pointer-events-auto:is(:where(.group):hover *){pointer-events:auto}.group-hover\:border-content-muted:is(:where(.group):hover *){border-color:#d1d5db}.group-hover\:text-content:is(:where(.group):hover *){color:#fff}.group-hover\:opacity-0:is(:where(.group):hover *){opacity:0}.group-hover\:opacity-100:is(:where(.group):hover *){opacity:1}.group-hover\:brightness-75:is(:where(.group):hover *){--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,)}}.group-has-\[\:focus-visible\]\:opacity-0:is(:where(.group):has(:focus-visible) *){opacity:0}.placeholder\:text-content-muted::placeholder{color:#d1d5db}.placeholder\:text-content-subtle::placeholder{color:#9ca3af}.last\:border-b-0:last-child{border-bottom-style:var(--tw-border-style);border-bottom-width:0}.focus-within\:outline-white\/20:focus-within{outline-color:#fff3}@supports (color:color-mix(in lab,red,red)){.focus-within\:outline-white\/20:focus-within{outline-color:color-mix(in oklab,var(--color-white) 20%,transparent)}}@media(hover:hover){.hover\:scale-110:hover{--tw-scale-x:110%;--tw-scale-y:110%;--tw-scale-z:110%;scale:var(--tw-scale-x) var(--tw-scale-y)}.hover\:border-main-border:hover{border-color:#232328}.hover\:border-primary-border:hover{border-color:#ff6b35}.hover\:bg-accent:hover{background-color:var(--accent)}.hover\:bg-black\/70:hover{background-color:#000000b3}@supports (color:color-mix(in lab,red,red)){.hover\:bg-black\/70:hover{background-color:color-mix(in oklab,var(--color-black) 70%,transparent)}}.hover\:bg-divider:hover{background-color:#4b5563}.hover\:bg-hover:hover{background-color:var(--hover)}.hover\:bg-main:hover{background-color:#1c1c20}.hover\:bg-main-border:hover{background-color:#232328}.hover\:bg-main-hover:hover{background-color:#404040}.hover\:bg-main-input:hover{background-color:#2e2e2e}.hover\:bg-main\/80:hover{background-color:#1c1c20cc}.hover\:bg-primary-hover:hover{background-color:#c2410c}.hover\:bg-primary\/90:hover{background-color:#ff3300e6}.hover\:bg-red-600:hover{background-color:var(--color-red-600)}.hover\:bg-white\/10:hover{background-color:#ffffff1a}@supports (color:color-mix(in lab,red,red)){.hover\:bg-white\/10:hover{background-color:color-mix(in oklab,var(--color-white) 10%,transparent)}}.hover\:text-accent-error:hover{color:#ef4444}.hover\:text-content:hover{color:#fff}.hover\:text-foreground:hover{color:var(--foreground)}.hover\:text-red-400:hover{color:var(--color-red-400)}.hover\:text-white:hover{color:var(--color-white)}}.focus\:border-primary:focus{border-color:#f30}.focus\:ring-1:focus{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.focus\:ring-content-muted\/40:focus{--tw-ring-color:oklab(87.1681% -.00188759 -.00914592/.4)}.focus\:ring-content-muted\/50:focus{--tw-ring-color:oklab(87.1681% -.00188759 -.00914592/.5)}.focus\:ring-primary\/30:focus{--tw-ring-color:oklab(64.6321% .202926 .129852/.3)}.focus\:outline-none:focus{--tw-outline-style:none;outline-style:none}.focus-visible\:ring-1:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.focus-visible\:ring-2:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.focus-visible\:ring-\[\#6B97FF\]:focus-visible{--tw-ring-color:#6b97ff}.focus-visible\:ring-content-muted\/40:focus-visible{--tw-ring-color:oklab(87.1681% -.00188759 -.00914592/.4)}.focus-visible\:ring-offset-0:focus-visible{--tw-ring-offset-width:0px;--tw-ring-offset-shadow:var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}.focus-visible\:outline-none:focus-visible{--tw-outline-style:none;outline-style:none}.active\:scale-95:active{--tw-scale-x:95%;--tw-scale-y:95%;--tw-scale-z:95%;scale:var(--tw-scale-x) var(--tw-scale-y)}.active\:cursor-grabbing:active{cursor:grabbing}.disabled\:pointer-events-none:disabled{pointer-events:none}.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}.has-\[\:focus-visible\]\:pointer-events-auto:has(:focus-visible){pointer-events:auto}.has-\[\:focus-visible\]\:opacity-100:has(:focus-visible){opacity:1}.data-\[disabled\]\:pointer-events-none[data-disabled]{pointer-events:none}.data-\[disabled\]\:opacity-50[data-disabled]{opacity:.5}.data-\[highlighted\]\:border-primary-border[data-highlighted]{border-color:#ff6b35}.data-\[highlighted\]\:bg-main-hover[data-highlighted]{background-color:#404040}.data-\[highlighted\]\:bg-main-input[data-highlighted]{background-color:#2e2e2e}.data-\[highlighted\]\:text-content[data-highlighted]{color:#fff}.data-\[highlighted\]\:ring-1[data-highlighted]{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.data-\[highlighted\]\:ring-primary-border[data-highlighted]{--tw-ring-color:#ff6b35}.data-\[state\=active\]\:border-primary[data-state=active]{border-color:#f30}.data-\[state\=active\]\:text-white[data-state=active]{color:var(--color-white)}.data-\[state\=checked\]\:bg-transparent[data-state=checked]{background-color:#0000}@media(min-width:40rem){.sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(min-width:48rem){.md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}}@media(min-width:64rem){.lg\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}}@media(prefers-color-scheme:dark){.dark\:bg-accent\/12{background-color:var(--accent)}@supports (color:color-mix(in lab,red,red)){.dark\:bg-accent\/12{background-color:color-mix(in oklab,var(--accent) 12%,transparent)}}}}:root{--background:#1c1c20;--foreground:#fff;--card:#1e1e22;--card-foreground:#fff;--popover:#232328;--popover-foreground:#fff;--primary:#f30;--primary-foreground:#fff;--secondary:#2e2e2e;--secondary-foreground:#fff;--muted:#2e2e2e;--muted-foreground:#9ca3af;--accent:#333;--accent-foreground:#fff;--selected:#404040;--border:#ffffff1f;--input:#404040;--ring:#404040;--destructive:#ef4444;--destructive-foreground:#fff;--destructive-light:#450a0a;--hover:#ffffff0f;--active:#ffffff1a;--checker-a:#1f1f1f;--checker-b:#2a2a2a;--surface-1:#1c1c20;--surface-2:#232328;--surface-3:#2a2a30;--surface-4:#313138;--surface-5:#383840;--surface-6:#3f3f48;--surface-7:#464650;--surface-8:#4d4d58;--dm-hi-base:#ffffff03;--dm-hi-mid:#ffffff05;--dm-hi-high:#ffffff0a;--dm-hi-peak:#ffffff0f;--dm-ring-base:#ffffff05;--dm-ring-mid:#ffffff0a;--dm-ring-high:#ffffff0f;--dm-drop:#0000002e;--shadow-surface-1:inset 0 0 0 1px var(--dm-ring-base);--shadow-surface-2:inset 0 1px 0 0 var(--dm-hi-base), inset 0 0 0 1px var(--dm-ring-base), 0 1px 1px -.5px var(--dm-drop);--shadow-surface-3:inset 0 1px 0 0 var(--dm-hi-mid), inset 0 0 0 1px var(--dm-ring-base), 0 0 0 1px #0000001f, 0 1px 1px -.5px var(--dm-drop), 0 3px 3px -1.5px var(--dm-drop);--shadow-surface-4:inset 0 1px 0 0 var(--dm-hi-mid), inset 0 0 0 1px var(--dm-ring-mid), 0 0 0 1px #00000024, 0 1px 1px -.5px var(--dm-drop), 0 3px 3px -1.5px var(--dm-drop), 0 6px 6px -3px var(--dm-drop);--shadow-surface-5:inset 0 1px 0 0 var(--dm-hi-high), inset 0 0 0 1px var(--dm-ring-mid), 0 0 0 1px #00000029, 0 1px 1px -.5px var(--dm-drop), 0 3px 3px -1.5px var(--dm-drop), 0 6px 6px -3px var(--dm-drop), 0 12px 12px -6px var(--dm-drop);--shadow-surface-6:inset 0 1px 0 0 var(--dm-hi-high), inset 0 0 0 1px var(--dm-ring-high), 0 0 0 1px #0000002e, 0 1px 1px -.5px var(--dm-drop), 0 3px 3px -1.5px var(--dm-drop), 0 6px 6px -3px var(--dm-drop), 0 12px 12px -6px var(--dm-drop), 0 24px 24px -12px var(--dm-drop);--shadow-surface-7:inset 0 1px 0 0 var(--dm-hi-peak), inset 0 0 0 1px var(--dm-ring-high), 0 0 0 1px #0003, 0 1px 1px -.5px var(--dm-drop), 0 3px 3px -1.5px var(--dm-drop), 0 6px 6px -3px var(--dm-drop), 0 12px 12px -6px var(--dm-drop), 0 24px 24px -12px var(--dm-drop), 0 48px 48px -24px var(--dm-drop);--shadow-surface-8:inset 0 1px 0 0 var(--dm-hi-peak), inset 0 0 0 1px var(--dm-ring-high), 0 0 0 1px #00000038, 0 1px 1px -.5px var(--dm-drop), 0 3px 3px -1.5px var(--dm-drop), 0 6px 6px -3px var(--dm-drop), 0 12px 12px -6px var(--dm-drop), 0 24px 24px -12px var(--dm-drop), 0 48px 48px -24px var(--dm-drop), 0 96px 96px -48px var(--dm-drop)}html,body{background-color:var(--background);overflow:hidden}body{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:0 0;border-radius:4px}::-webkit-scrollbar-thumb{background:#3a3a3f padding-box padding-box;border:2px solid #0000;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#505058 padding-box padding-box;border:2px solid #0000}::-webkit-scrollbar-corner{background:0 0}.markdown-content{color:#fff;word-break:break-word;overflow-wrap:anywhere;min-width:0;font-size:.875rem;line-height:1.625}.markdown-content h1,.markdown-content h2,.markdown-content h3,.markdown-content h4,.markdown-content h5,.markdown-content h6{color:#fff;margin-top:1rem;margin-bottom:.25rem;font-weight:600;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{color:#e5e7eb;overflow-wrap:anywhere;background:#ffffff1a;border-radius:.25rem;padding:.125rem .375rem;font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,monospace;font-size:.8125rem}.markdown-content blockquote{color:#9ca3af;border-left:3px solid #4b5563;margin:.5rem 0;padding-left:.75rem}.markdown-content table{border-collapse:collapse;width:100%;margin:.5rem 0;font-size:.8125rem}.markdown-content th,.markdown-content td{text-align:left;border:1px solid #4b5563;padding:.375rem .625rem}.markdown-content th{color:#fff;background:#ffffff0d;font-weight:600}.markdown-content hr{border:none;border-top:1px solid #4b5563;margin:.75rem 0}.markdown-content del{color:#9ca3af;text-decoration:line-through}.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:.9s steps(6,end) infinite rivet-sparkle-scroll}@media(prefers-reduced-motion:reduce){.rivet-sparkle-strip{animation:none}}@keyframes shimmer{0%{background-position:0 0}to{background-position:100% 0}}.shimmer-text{-webkit-text-fill-color:transparent;color:#0000;background:linear-gradient(90deg,#a3a3a3,#a3a3a3 35%,#525252,#a3a3a3 65%,#a3a3a3) 0 0/300% 100%;-webkit-background-clip:text;background-clip:text;animation:1.5s ease-in-out infinite shimmer}.glass-panel{-webkit-backdrop-filter:blur(20px);background:#ffffff04;border:1px solid #ffffff08}.active-push:active{transition:transform .1s;transform:scale(.98)}:root{--variant-split-ease:cubic-bezier(.4, 0, .2, 1);--variant-split-accent:var(--color-primary,#f30);--variant-split-zone-bg:#26262aeb;--variant-split-zone-border:#ffffff0a;--variant-split-zone-shadow:0 30px 60px -20px #0000008c, 0 0 90px 10px #ffdca00d}.variant-preview-region{isolation:isolate}.variant-preview-primary{transition:filter .2s var(--variant-split-ease)}.variant-preview-region.is-dragging .variant-preview-primary{filter:brightness(.92)saturate(.92)}.variant-preview-region.is-dragging iframe{pointer-events:none}.variant-preview-atmosphere{pointer-events:none;opacity:0;z-index:30;transition:opacity .2s var(--variant-split-ease);background:radial-gradient(60% 50%,#0000,#00000059);position:absolute;top:0;right:0;bottom:0;left:0}.variant-preview-region.is-dragging .variant-preview-atmosphere{opacity:1}.variant-drop-zones{pointer-events:none;z-index:50;position:absolute;top:16px;right:16px;bottom:16px;left:16px}.variant-drop-zone{background:var(--variant-split-zone-bg);border:1px solid var(--variant-split-zone-border);pointer-events:auto;opacity:0;filter:blur(12px);width:14%;min-width:130px;max-width:180px;box-shadow:var(--variant-split-zone-shadow);transition:opacity .32s var(--variant-split-ease),transform .32s var(--variant-split-ease),filter .32s var(--variant-split-ease),box-shadow .24s var(--variant-split-ease);border-radius:14px;justify-content:center;align-items:center;display:flex;position:absolute;top:0;bottom:0;transform:scale(.94)}.variant-drop-zone.is-left{left:8px}.variant-drop-zone.is-right{right:8px}.variant-drop-zones.is-visible .variant-drop-zone{opacity:1;filter:blur();transform:scale(1)}.variant-drop-zones.is-exiting .variant-drop-zone{opacity:0;filter:blur(8px);transition:opacity .2s var(--variant-split-ease),transform .2s var(--variant-split-ease),filter .2s var(--variant-split-ease);transform:scale(.97)}.variant-drop-zone.is-disabled{opacity:.6;filter:blur(2px)saturate(.6)}.variant-drop-zone-inner{opacity:0;filter:blur(4px);transition:opacity .22s var(--variant-split-ease),transform .22s var(--variant-split-ease),filter .22s var(--variant-split-ease);flex-direction:column;justify-content:center;align-items:center;gap:12px;display:flex;position:absolute;top:0;right:0;bottom:0;left:0;transform:translateY(6px)}.variant-drop-zones.is-visible .variant-drop-zone-inner{opacity:1;filter:blur();transition-delay:.18s;transform:translateY(0)}.variant-drop-zone.is-hover .variant-drop-zone-caption{color:var(--variant-split-accent)}.variant-drop-zone-icon{border:1.5px solid #ffffff73;border-radius:6px;width:36px;height:28px;position:relative;overflow:hidden}.variant-drop-zone-icon:after{content:"";background:#ffffff73;width:1.5px;position:absolute;top:0;bottom:0}.variant-drop-zone-icon.is-left:after{left:11px}.variant-drop-zone-icon.is-right:after{right:11px}.variant-drop-zone-icon.is-left:before{content:"";background:#ffffff14;width:11px;position:absolute;top:0;bottom:0;left:0}.variant-drop-zone-icon.is-right:before{content:"";background:#ffffff14;width:11px;position:absolute;top:0;bottom:0;right:0}.variant-drop-zone.is-hover .variant-drop-zone-icon{border-color:var(--variant-split-accent)}.variant-drop-zone.is-hover .variant-drop-zone-icon:after,.variant-drop-zone.is-hover .variant-drop-zone-icon.is-left:before,.variant-drop-zone.is-hover .variant-drop-zone-icon.is-right:before{background:var(--variant-split-accent)}@supports (color:color-mix(in lab,red,red)){.variant-drop-zone.is-hover .variant-drop-zone-icon.is-left:before,.variant-drop-zone.is-hover .variant-drop-zone-icon.is-right:before{background:color-mix(in srgb,var(--variant-split-accent) 22%,transparent)}}.variant-drop-zone-caption{letter-spacing:.02em;color:#fff9;text-align:center;max-width:80%;font-size:11.5px;line-height:1.35}.variant-drop-zone-border{border:2px dashed var(--variant-split-accent);opacity:0;transition:opacity .24s var(--variant-split-ease);pointer-events:none;border-radius:10px;position:absolute;top:4px;right:4px;bottom:4px;left:4px}.variant-drop-zone.is-hover .variant-drop-zone-border{opacity:1}.variant-drop-zone-preview{display:none}.variant-drag-ghost{pointer-events:none;z-index:60;background:#1f1f21f5;border:1px solid #ffffff0f;border-radius:10px;padding:8px 12px;position:fixed;top:0;left:0;box-shadow:inset 0 0 0 1px #ffffff05,0 24px 60px -10px #0009,0 0 80px 10px #ffdc8c0f}.variant-drag-ghost-body{flex-direction:column;min-width:0;display:flex}.variant-drag-ghost-row{align-items:center;gap:8px;min-width:0;display:flex}.variant-drag-ghost-title{color:#ffffffeb;white-space:nowrap;text-overflow:ellipsis;flex:1;min-width:0;font-size:13px;font-weight:500;overflow:hidden}.variant-drag-ghost-tag{white-space:nowrap;border-radius:4px;flex-shrink:0;padding:1px 6px;font-size:10px;font-weight:500}.variant-drag-ghost-desc{color:#ffffff80;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-top:2px;font-size:12px;line-height:1.35;display:-webkit-box;overflow:hidden}.variant-split-secondary{border-left:1px solid var(--main-border,#ffffff0f);background:var(--bg-main,#0d0d0e);min-width:0;animation:variantSplitSecondaryEnter .42s var(--variant-split-ease) both;flex-direction:column;flex:1 1 0;display:flex;position:relative}.variant-preview-region.is-split>.variant-preview-row>.variant-preview-primary{border-right:1px solid var(--main-border,#ffffff0f)}@keyframes variantSplitSecondaryEnter{0%{opacity:0}to{opacity:1}}.variant-split-secondary-toolbar{color:#ffffffb3;background:#ffffff05;border-bottom:1px solid #ffffff0a;flex:0 0 32px;justify-content:space-between;align-items:center;height:32px;padding:0 10px;font-size:11.5px;display:flex}.variant-split-secondary-label{white-space:nowrap;text-overflow:ellipsis;min-width:0;overflow:hidden}.variant-split-secondary-close{-webkit-appearance:none;-moz-appearance:none;appearance:none;color:#ffffff8c;cursor:pointer;transition:color .14s var(--variant-split-ease),background-color .14s var(--variant-split-ease);background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;padding:4px;display:inline-flex}.variant-split-secondary-close:hover{color:#ffffffeb;background:#ffffff0f}.variant-split-secondary-iframe{background:#fff;border:0;flex:1;width:100%;height:100%}@media(prefers-reduced-motion:reduce){.variant-drop-zone,.variant-drop-zone-inner,.variant-drop-zone-preview,.variant-drop-zone-border,.variant-preview-primary,.variant-preview-atmosphere,.variant-split-secondary,.variant-split-secondary-close{filter:none!important;transition-duration:80ms!important;animation-duration:80ms!important;transform:none!important}.variant-drop-zones.is-visible .variant-drop-zone-inner{transition-delay:0s}}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-scale-x{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-y{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-z{syntax:"*";inherits:false;initial-value:1}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-space-x-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-divide-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-ordinal{syntax:"*";inherits:false}@property --tw-slashed-zero{syntax:"*";inherits:false}@property --tw-numeric-figure{syntax:"*";inherits:false}@property --tw-numeric-spacing{syntax:"*";inherits:false}@property --tw-numeric-fraction{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{50%{opacity:.5}}@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}}
|