@surrealdb/ui 1.0.76 → 1.0.78
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/.cursor/plans/mdx_support_research_f85826b1.plan.md +260 -0
- package/dist/ui.css +1 -1
- package/dist/ui.d.ts +184 -321
- package/dist/ui.js +11170 -8044
- package/dist/ui.js.map +1 -1
- package/dist/yoopta.css +1 -4
- package/package.json +5 -4
|
@@ -0,0 +1,260 @@
|
|
|
1
|
+
---
|
|
2
|
+
name: MDX Support Research
|
|
3
|
+
overview: Analysis of three approaches to add MDX support to the custom markdown parser, with a detailed implementation plan for the recommended hybrid approach that extends the existing parser with JSX capabilities using only `acorn` as a new dependency.
|
|
4
|
+
todos:
|
|
5
|
+
- id: acorn-dep
|
|
6
|
+
content: Add `acorn` as a dependency in package.json
|
|
7
|
+
status: completed
|
|
8
|
+
- id: ast-types
|
|
9
|
+
content: Add JsxComponentNode, JsxExpressionNode, and JsxExpression types to types.ts; update BlockNode/InlineNode/AnyNode unions
|
|
10
|
+
status: completed
|
|
11
|
+
- id: fix-readtagname
|
|
12
|
+
content: Update readTagName in utils/attributes.ts to preserve original case; update callers to lowercase where needed
|
|
13
|
+
status: completed
|
|
14
|
+
- id: expr-attributes
|
|
15
|
+
content: Extend parseAttributes to support {expression} attribute values using acorn.parseExpressionAt()
|
|
16
|
+
status: completed
|
|
17
|
+
- id: jsx-parser
|
|
18
|
+
content: "Create nodes/jsx-component.ts: parse PascalCase JSX tags with expression-aware attributes, self-closing and container variants"
|
|
19
|
+
status: completed
|
|
20
|
+
- id: html-routing
|
|
21
|
+
content: Update html.ts to route PascalCase tags to the new JSX component parser
|
|
22
|
+
status: completed
|
|
23
|
+
- id: inline-expressions
|
|
24
|
+
content: Add {expression} parsing in inline.ts using acorn
|
|
25
|
+
status: completed
|
|
26
|
+
- id: renderer
|
|
27
|
+
content: Extend RenderMarkdown.tsx and components.tsx with jsxComponents/jsxScope props and jsxComponent/jsxExpression component entries
|
|
28
|
+
status: completed
|
|
29
|
+
- id: exports
|
|
30
|
+
content: Update index.ts with new exports
|
|
31
|
+
status: completed
|
|
32
|
+
- id: tests
|
|
33
|
+
content: Add comprehensive test coverage in __tests__/jsx-components.test.ts
|
|
34
|
+
status: completed
|
|
35
|
+
isProject: false
|
|
36
|
+
---
|
|
37
|
+
|
|
38
|
+
# MDX Support for Custom Markdown Parser
|
|
39
|
+
|
|
40
|
+
## Current Architecture Summary
|
|
41
|
+
|
|
42
|
+
The parser is a fully custom, zero-dependency (aside from `github-slugger`) implementation:
|
|
43
|
+
|
|
44
|
+
- **Block parsing** (`[parser.ts](src/lib/markdown/parser.ts)`): Line-by-line loop dispatching via `[detect.ts](src/lib/markdown/detect.ts)`
|
|
45
|
+
- **Inline parsing** (`[inline.ts](src/lib/markdown/inline.ts)`): Character-by-character within text spans
|
|
46
|
+
- **HTML handling** (`[html.ts](src/lib/markdown/html.ts)`): Hardcoded `if/else` chain for known tags (`details`, `tabs`, `div`, etc.) -- **unknown tags are silently skipped**
|
|
47
|
+
- **Rendering** (`[RenderMarkdown.tsx](src/lib/markdown/RenderMarkdown.tsx)`): AST-to-React via a typed component map (`[components.tsx](src/lib/markdown/components.tsx)`)
|
|
48
|
+
- **Attributes** (`[utils/attributes.ts](src/lib/markdown/utils/attributes.ts)`): Regex-based, supports `name="value"` only, and `readTagName` **lowercases all tag names** (loses PascalCase)
|
|
49
|
+
|
|
50
|
+
Two critical limitations for MDX:
|
|
51
|
+
|
|
52
|
+
1. `readTagName` lowercases everything -- `<MyComponent>` becomes `mycomponent`
|
|
53
|
+
2. `parseAttributes` only handles string attributes -- no `prop={expression}` support
|
|
54
|
+
3. Unknown tags in `html.ts` are discarded (line 147: `state.currentIndex = lineIndex + 1`)
|
|
55
|
+
|
|
56
|
+
---
|
|
57
|
+
|
|
58
|
+
## Option A: Implement MDX Without Any New Package
|
|
59
|
+
|
|
60
|
+
**Feasibility: Low for "full MDX", Medium for "JSX-lite"**
|
|
61
|
+
|
|
62
|
+
You would need to hand-write:
|
|
63
|
+
|
|
64
|
+
- A JSX expression parser for `{expression}` in attributes and content -- this means parsing arbitrary JavaScript (arrow functions, ternaries, template literals, nested braces, etc.). This is extremely hard to get right without a real JS parser.
|
|
65
|
+
- Tag nesting with mixed PascalCase/lowercase handling
|
|
66
|
+
- Import/export statement parsing
|
|
67
|
+
|
|
68
|
+
The expression parsing problem alone makes this impractical for anything beyond simple `{variable}` references. JavaScript syntax is complex enough (template literals with `${...}`, regex, string escaping, nested objects) that a hand-rolled brace-matching approach will inevitably break on real-world content.
|
|
69
|
+
|
|
70
|
+
**Verdict:** Not recommended. The complexity of JS expression parsing makes this fragile and costly.
|
|
71
|
+
|
|
72
|
+
---
|
|
73
|
+
|
|
74
|
+
## Option B: Replace Parser With Official `@mdx-js/mdx`
|
|
75
|
+
|
|
76
|
+
**What `@mdx-js/mdx` brings:**
|
|
77
|
+
|
|
78
|
+
- Full MDX spec compliance (JSX, expressions, imports/exports)
|
|
79
|
+
- `compile()` / `evaluate()` API that turns MDX into executable JavaScript
|
|
80
|
+
- Plugin ecosystem (remark, rehype)
|
|
81
|
+
|
|
82
|
+
**Dependency cost:**
|
|
83
|
+
|
|
84
|
+
- **~90 unique transitive packages** (339 entries in the tree including deduped)
|
|
85
|
+
- Pulls in the entire unified ecosystem: `unified`, `remark-parse`, `remark-rehype`, `micromark`, `mdast-util-`*, `hast-util-`*, `estree-util-*`, `recma-*`, `acorn`, `astring`, `vfile`, etc.
|
|
86
|
+
- The pipeline is: MDX string -> micromark tokens -> mdast -> hast -> esast -> JavaScript string -> `eval()`
|
|
87
|
+
|
|
88
|
+
**Architecture mismatch:**
|
|
89
|
+
|
|
90
|
+
- `@mdx-js/mdx` outputs **JavaScript code** (a module with a default export component), not an inspectable AST
|
|
91
|
+
- The current system outputs a **typed AST** that gets rendered via a component map -- this would be completely abandoned
|
|
92
|
+
- All custom node types (`CheckNode`, `RailroadDiagramNode`, `SurrealistMiniNode`, etc.) would need to be reimplemented as MDX components passed via provider
|
|
93
|
+
- The `evaluate()` function uses `eval` / `new Function()` under the hood
|
|
94
|
+
- Compilation is async and relatively expensive
|
|
95
|
+
|
|
96
|
+
**What you'd keep:** Nothing from the current parser. The entire `src/lib/markdown/` directory would effectively be replaced.
|
|
97
|
+
|
|
98
|
+
**What you'd gain:** Full MDX spec, plugin ecosystem.
|
|
99
|
+
|
|
100
|
+
**Verdict:** Not recommended. The dependency bloat is extreme (~90 packages), the architecture is fundamentally different (eval-based JS generation vs typed AST), and you lose all existing customizations and type safety.
|
|
101
|
+
|
|
102
|
+
---
|
|
103
|
+
|
|
104
|
+
## Option C (Recommended): Extend Custom Parser With JSX Support Using `acorn`
|
|
105
|
+
|
|
106
|
+
**Core idea:** Keep the existing parser architecture and extend it to handle arbitrary JSX components with expression attributes. Use `acorn` (single package, ~130KB, the standard JS parser that MDX itself uses internally) for the hard part: parsing JavaScript expressions.
|
|
107
|
+
|
|
108
|
+
**New packages: 1** (`acorn`) -- optionally 2 if you also add `acorn-jsx`, but it is not needed since we only parse expressions, not full JSX via acorn.
|
|
109
|
+
|
|
110
|
+
### What This Gives You
|
|
111
|
+
|
|
112
|
+
- `<MyComponent prop="string" count={42} active={isActive} />` -- arbitrary components with expression props
|
|
113
|
+
- `<Layout sidebar={<Sidebar />}>...markdown content...</Layout>` -- nested JSX components
|
|
114
|
+
- `{variable}` and `{expression}` inline in markdown text
|
|
115
|
+
- Full compatibility with existing markdown features and custom nodes
|
|
116
|
+
- Type-safe AST with a new `JsxComponentNode`
|
|
117
|
+
- Zero changes to existing parsing of `#`, `*`*,
|
|
118
|
+
|
|
119
|
+
```, lists, tables, etc.
|
|
120
|
+
|
|
121
|
+
### What This Does NOT Give (trade-offs)
|
|
122
|
+
|
|
123
|
+
- `import`/`export` statements (components are passed via the existing component map instead -- which is arguably better for security)
|
|
124
|
+
- JavaScript expressions that span across the JSX boundary in complex ways (e.g., `{items.map(x => <Component key={x}>{x.name}</Component>)}`) -- these would require a full JSX-aware expression parser
|
|
125
|
+
- Full MDX spec compliance (edge cases around ESM interop, layout exports, etc.)
|
|
126
|
+
|
|
127
|
+
These limitations are acceptable because: the component map pattern already works well for providing components, and complex JS expressions in markdown content are an anti-pattern for documentation/content sites.
|
|
128
|
+
|
|
129
|
+
---
|
|
130
|
+
|
|
131
|
+
## Detailed Implementation Plan (Option C)
|
|
132
|
+
|
|
133
|
+
### 1. Add `acorn` dependency
|
|
134
|
+
|
|
135
|
+
Single new package. Used only for parsing JavaScript expressions inside `{...}` in attributes and inline content.
|
|
136
|
+
|
|
137
|
+
### 2. New AST node type: `JsxComponentNode`
|
|
138
|
+
|
|
139
|
+
Add to `[types.ts](src/lib/markdown/types.ts)`:
|
|
140
|
+
|
|
141
|
+
```typescript
|
|
142
|
+
export interface JsxExpression {
|
|
143
|
+
type: "expression";
|
|
144
|
+
value: string; // raw JS source, e.g. "isActive" or "items.length > 0"
|
|
145
|
+
}
|
|
146
|
+
|
|
147
|
+
export type JsxAttributeValue = string | JsxExpression | true;
|
|
148
|
+
|
|
149
|
+
export interface JsxComponentNode {
|
|
150
|
+
type: "jsxComponent";
|
|
151
|
+
name: string; // PascalCase component name, e.g. "MyComponent"
|
|
152
|
+
attributes: Record<string, JsxAttributeValue>;
|
|
153
|
+
children: AnyNode[]; // parsed markdown/JSX children
|
|
154
|
+
className?: string;
|
|
155
|
+
id?: string;
|
|
156
|
+
style?: string;
|
|
157
|
+
}
|
|
158
|
+
```
|
|
159
|
+
|
|
160
|
+
Add `JsxComponentNode` to `BlockNode`, `InlineNode`, and `AnyNode` unions.
|
|
161
|
+
|
|
162
|
+
### 3. Fix `readTagName` to preserve case
|
|
163
|
+
|
|
164
|
+
In `[utils/attributes.ts](src/lib/markdown/utils/attributes.ts)`, `readTagName` currently lowercases:
|
|
165
|
+
|
|
166
|
+
```50:51:src/lib/markdown/utils/attributes.ts
|
|
167
|
+
return { tagName: tagName.toLowerCase(), endIndex: i };
|
|
168
|
+
```
|
|
169
|
+
|
|
170
|
+
Change to return the original case. Update existing callers to lowercase where needed (the existing HTML tag matching in `html.ts` already lowercases for comparison).
|
|
171
|
+
|
|
172
|
+
### 4. Extend `parseAttributes` for expression attributes
|
|
173
|
+
|
|
174
|
+
In `[utils/attributes.ts](src/lib/markdown/utils/attributes.ts)`, add support for `prop={expression}` syntax alongside existing `prop="value"`:
|
|
175
|
+
|
|
176
|
+
- When `=` is followed by `{`, use `acorn.parseExpressionAt()` to find the matching `}` (handles nested braces, strings, template literals correctly)
|
|
177
|
+
- Store expression attributes as `JsxExpression` objects instead of plain strings
|
|
178
|
+
- Also support boolean attributes (bare `disabled` without `=`)
|
|
179
|
+
|
|
180
|
+
### 5. New JSX component parser
|
|
181
|
+
|
|
182
|
+
Create `[nodes/jsx-component.ts](src/lib/markdown/nodes/jsx-component.ts)`:
|
|
183
|
+
|
|
184
|
+
- Detect PascalCase tag names (first char is uppercase) to distinguish from HTML tags
|
|
185
|
+
- Parse opening tag with expression-aware attributes
|
|
186
|
+
- Handle self-closing (`<Component />`)
|
|
187
|
+
- For container components, collect lines until matching closing tag (similar to how `parseDivTag` / `parseDetailsTag` work)
|
|
188
|
+
- Re-parse children through `detectAndParseLine` (same pattern as existing container tags)
|
|
189
|
+
|
|
190
|
+
### 6. Update `html.ts` to route JSX components
|
|
191
|
+
|
|
192
|
+
In `[html.ts](src/lib/markdown/html.ts)`, before the hardcoded tag name checks, add:
|
|
193
|
+
|
|
194
|
+
```typescript
|
|
195
|
+
if (tagName[0] === tagName[0].toUpperCase() && /^[A-Z]/.test(tagName)) {
|
|
196
|
+
parseJsxComponent(state, tagName, attrs);
|
|
197
|
+
return;
|
|
198
|
+
}
|
|
199
|
+
```
|
|
200
|
+
|
|
201
|
+
This routes PascalCase tags to the new JSX component parser while keeping all existing HTML tag handling unchanged.
|
|
202
|
+
|
|
203
|
+
### 7. Add inline JSX expression support
|
|
204
|
+
|
|
205
|
+
In `[inline.ts](src/lib/markdown/inline.ts)`, add a new case for `{` characters:
|
|
206
|
+
|
|
207
|
+
- When encountering `{`, use `acorn.parseExpressionAt()` to parse the expression
|
|
208
|
+
- Create a new `JsxExpressionNode` for inline expressions like `{variable}` or `{1 + 2}`
|
|
209
|
+
- Add this as a new inline node type
|
|
210
|
+
|
|
211
|
+
### 8. Extend the renderer
|
|
212
|
+
|
|
213
|
+
In `[RenderMarkdown.tsx](src/lib/markdown/RenderMarkdown.tsx)` and `[components.tsx](src/lib/markdown/components.tsx)`:
|
|
214
|
+
|
|
215
|
+
- Add a `jsxComponent` entry to the component map that dynamically looks up the component by name from a new `jsxComponents` prop (a `Record<string, ComponentType>`)
|
|
216
|
+
- For expression attributes, evaluate them against a provided scope/context object
|
|
217
|
+
- For inline expressions, evaluate and render the result
|
|
218
|
+
|
|
219
|
+
The `RenderMarkdownProps` interface gains:
|
|
220
|
+
|
|
221
|
+
```typescript
|
|
222
|
+
export interface RenderMarkdownProps extends StackProps {
|
|
223
|
+
ast: Root;
|
|
224
|
+
components?: Partial<ComponentMap>;
|
|
225
|
+
componentProps?: MarkdownComponentProps;
|
|
226
|
+
jsxComponents?: Record<string, React.ComponentType<any>>; // NEW
|
|
227
|
+
jsxScope?: Record<string, unknown>; // NEW: variables for {expressions}
|
|
228
|
+
}
|
|
229
|
+
```
|
|
230
|
+
|
|
231
|
+
### 9. Update tests
|
|
232
|
+
|
|
233
|
+
Add new test file `__tests__/jsx-components.test.ts` covering:
|
|
234
|
+
|
|
235
|
+
- PascalCase component parsing (self-closing, with children)
|
|
236
|
+
- String and expression attributes
|
|
237
|
+
- Nested JSX components
|
|
238
|
+
- Inline `{expression}` syntax
|
|
239
|
+
- Interaction with existing markdown features (JSX inside lists, blockquotes, etc.)
|
|
240
|
+
- Malformed JSX error handling
|
|
241
|
+
|
|
242
|
+
### Summary of Changes
|
|
243
|
+
|
|
244
|
+
|
|
245
|
+
| File | Change |
|
|
246
|
+
| ---------------------------------- | ------------------------------------------------------------- |
|
|
247
|
+
| `package.json` | Add `acorn` dependency |
|
|
248
|
+
| `types.ts` | Add `JsxComponentNode`, `JsxExpressionNode`, expression types |
|
|
249
|
+
| `utils/attributes.ts` | Preserve tag name case; add expression attribute parsing |
|
|
250
|
+
| `nodes/jsx-component.ts` | **New file** -- JSX component block parser |
|
|
251
|
+
| `html.ts` | Route PascalCase tags to JSX parser |
|
|
252
|
+
| `inline.ts` | Add `{expression}` inline parsing |
|
|
253
|
+
| `detect.ts` | No changes needed (already routes `<` to `parseHtmlTag`) |
|
|
254
|
+
| `parser.ts` | No changes needed |
|
|
255
|
+
| `RenderMarkdown.tsx` | Add `jsxComponents` and `jsxScope` props |
|
|
256
|
+
| `components.tsx` | Add `jsxComponent` and `jsxExpression` component entries |
|
|
257
|
+
| `index.ts` | Export new types and parser |
|
|
258
|
+
| `__tests__/jsx-components.test.ts` | **New file** -- test coverage |
|
|
259
|
+
|
|
260
|
+
|
package/dist/ui.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
@layer surreal {
|
|
2
|
-
:root{--surreal-opacity-subtle: .07;--surreal-opacity-medium: .3;--surreal-opacity-strong: .6;--surreal-glass-subtle: rgba(255, 255, 255, var(--surreal-opacity-subtle));--surreal-glass-medium: rgba(255, 255, 255, var(--surreal-opacity-medium));--surreal-glass-strong: rgba(255, 255, 255, var(--surreal-opacity-strong));--surreal-blur: blur(12px);--surreal-pink: #ff00a0;--surreal-purple: #9800ff;--surreal-energy: #D255FE;--surreal-passion: #651DDD;--surreal-gradient: linear-gradient(135deg, var(--surreal-energy), var(--surreal-passion));--surreal-spinner-size-xs: 1rem;--surreal-spinner-size-sm: 1.5rem;--surreal-spinner-size-md: 2rem;--surreal-spinner-size-lg: 2.5rem;--surreal-spinner-size-xl: 3rem}:root[data-mantine-color-scheme=dark]{--surreal-blend-mode: "darken";--surreal-glass-subtle: rgba(255, 255, 255, var(--surreal-opacity-subtle));--surreal-glass-medium: rgba(255, 255, 255, var(--surreal-opacity-medium));--surreal-glass-strong: rgba(255, 255, 255, var(--surreal-opacity-strong));--surreal-overlay-color: #07060a;--surreal-background-color: var(--mantine-color-obsidian-9);--surreal-pill-background: var(--mantine-color-obsidian-6);--surreal-text-gradient: linear-gradient(180deg, var(--mantine-color-obsidian-0), var(--mantine-color-obsidian-3));--surreal-paper-background: linear-gradient(135deg, var(--mantine-color-obsidian-8), var(--mantine-color-obsidian-9));--surreal-menu-background-color: var(--mantine-color-obsidian-7);--surreal-menu-background: rgba(from var(--surreal-menu-background-color) r g b / .75);--surreal-menu-shadow: 0 8px 18px rgba(0, 0, 0, .3), 0 2px 6px rgba(0, 0, 0, .3);--surreal-paper-background-filled: var(--mantine-color-obsidian-8);--surreal-input-background-filled: var(--mantine-color-obsidian-7);--surreal-paper-background-glass: linear-gradient(135deg, var(--mantine-color-obsidian-8), rgba(from var(--mantine-color-obsidian-9) r g b / 0));--surreal-gradient-gray: linear-gradient(101deg, rgba(111, 121, 136, .55) 3.18%, rgba(111, 121, 136, .4) 100%);--surreal-table-stripe: var(--mantine-color-obsidian-7);--surreal-table-hover-color: var(--mantine-color-obsidian-8)}:root[data-mantine-color-scheme=light]{--surreal-blend-mode: "lighten";--surreal-glass-subtle: rgba(0, 0, 0, var(--surreal-opacity-subtle));--surreal-glass-medium: rgba(0, 0, 0, var(--surreal-opacity-medium));--surreal-glass-strong: rgba(0, 0, 0, var(--surreal-opacity-strong));--surreal-overlay-color: #A29FAC;--surreal-background-color: var(--mantine-color-obsidian-1);--surreal-pill-background: var(--mantine-color-obsidian-2);--surreal-text-gradient: linear-gradient(180deg, var(--mantine-color-obsidian-6), var(--mantine-color-obsidian-9));--surreal-paper-background: linear-gradient(135deg, var(--mantine-color-obsidian-0), var(--mantine-color-obsidian-1));--surreal-menu-background-color: var(--mantine-color-obsidian-0);--surreal-menu-background: var(--surreal-menu-background-color);--surreal-menu-shadow: 0 8px 18px rgba(0, 0, 0, .1), 0 2px 6px rgba(0, 0, 0, .1);--surreal-paper-background-filled: var(--mantine-color-obsidian-0);--surreal-input-background-filled: var(--mantine-color-obsidian-2);--surreal-gradient-gray: linear-gradient(101deg, rgba(111, 121, 136, .15) 3.18%, rgba(111, 121, 136, .3) 100%);--surreal-table-stripe: var(--mantine-color-obsidian-2);--surreal-table-hover-color: var(--mantine-color-obsidian-0)}.mantine-ActionIcon-root[data-variant=surreal]{border-width:1px;border-style:solid}.mantine-CloseButton-root[data-variant=surreal]{color:var(--mantine-color-slate-outline)}.mantine-CloseButton-root[data-variant=surreal]:hover{background-color:var(--surreal-glass-subtle)}.mantine-Button-root[data-variant=surreal]{border-width:1px;border-style:solid;backdrop-filter:blur(2px)}.mantine-ActionIcon-root[data-variant=surreal]:disabled{opacity:var(--surreal-opacity-medium)}.mantine-Button-root[data-variant=transparent]:disabled,.mantine-ActionIcon-root[data-variant=transparent]:disabled{background-color:unset;opacity:var(--surreal-opacity-strong)}.mantine-Button-root[data-variant=surreal]:disabled,.mantine-Button-root[data-variant=gradient]:disabled,.mantine-ActionIcon-root[data-variant=surreal]:disabled,.mantine-Checkbox-root[data-variant=surreal]:disabled,.mantine-Radio-root[data-variant=surreal]:disabled{border-color:var(--surreal-glass-subtle);background-color:var(--surreal-glass-subtle);color:var(--mantine-color-text)}.mantine-Checkbox-icon{color:#fff;width:calc(var(--checkbox-size) / 2)}.mantine-Button-root[data-variant=gradient]:hover:not([disabled]){filter:brightness(1.1)}.mantine-InputWrapper-root[data-variant=filled] .mantine-InputWrapper-label,.mantine-InputWrapper-root[data-variant=surreal] .mantine-InputWrapper-label{color:var(--mantine-color-bright);font-weight:600;margin-bottom:4px}.mantine-InputWrapper-root[data-variant=filled] .mantine-Input-input,.mantine-InputWrapper-root[data-variant=filled] .mantine-InputBase-input,.mantine-InputWrapper-root[data-variant=filled] .mantine-TextInput-input,.mantine-InputWrapper-root[data-variant=surreal] .mantine-Input-input,.mantine-InputWrapper-root[data-variant=surreal] .mantine-InputBase-input,.mantine-InputWrapper-root[data-variant=surreal] .mantine-TextInput-input{--focus-outline: color-mix(in srgb, var(--mantine-color-violet-3) 75%, var(--surreal-glass-subtle));color:var(--mantine-color-bright);font-weight:300;transition:all .25s ease;outline:1px solid transparent}.mantine-InputWrapper-root[data-variant=filled] .mantine-Input-input:focus-within,.mantine-InputWrapper-root[data-variant=filled] .mantine-InputBase-input:focus-within,.mantine-InputWrapper-root[data-variant=filled] .mantine-TextInput-input:focus-within,.mantine-InputWrapper-root[data-variant=surreal] .mantine-Input-input:focus-within,.mantine-InputWrapper-root[data-variant=surreal] .mantine-InputBase-input:focus-within,.mantine-InputWrapper-root[data-variant=surreal] .mantine-TextInput-input:focus-within{outline-color:var(--focus-outline)}.mantine-InputWrapper-root[data-variant=filled] .mantine-Input-input::placeholder,.mantine-InputWrapper-root[data-variant=filled] .mantine-InputBase-input::placeholder,.mantine-InputWrapper-root[data-variant=filled] .mantine-TextInput-input::placeholder,.mantine-InputWrapper-root[data-variant=surreal] .mantine-Input-input::placeholder,.mantine-InputWrapper-root[data-variant=surreal] .mantine-InputBase-input::placeholder,.mantine-InputWrapper-root[data-variant=surreal] .mantine-TextInput-input::placeholder{color:var(--mantine-color-text);opacity:var(--surreal-opacity-strong)}.mantine-InputWrapper-root[data-variant=surreal] .mantine-Input-input,.mantine-InputWrapper-root[data-variant=surreal] .mantine-InputBase-input,.mantine-InputWrapper-root[data-variant=surreal] .mantine-TextInput-input{--focus-background: color-mix(in srgb, var(--mantine-color-violet-3) 7%, var(--surreal-glass-subtle));background:linear-gradient(115deg,var(--surreal-glass-subtle),transparent)}.mantine-InputWrapper-root[data-variant=surreal] .mantine-Input-input:focus-within,.mantine-InputWrapper-root[data-variant=surreal] .mantine-InputBase-input:focus-within,.mantine-InputWrapper-root[data-variant=surreal] .mantine-TextInput-input:focus-within{background:linear-gradient(115deg,var(--focus-background),transparent)}.mantine-InputWrapper-root[data-variant=filled] .mantine-Input-input,.mantine-InputWrapper-root[data-variant=filled] .mantine-InputBase-input,.mantine-InputWrapper-root[data-variant=filled] .mantine-TextInput-input{--focus-background: color-mix(in srgb, var(--mantine-color-violet-3) 7%, var(--surreal-input-background-filled));background-color:var(--surreal-input-background-filled)}.mantine-InputWrapper-root[data-variant=filled] .mantine-Input-input:focus-within,.mantine-InputWrapper-root[data-variant=filled] .mantine-InputBase-input:focus-within,.mantine-InputWrapper-root[data-variant=filled] .mantine-TextInput-input:focus-within{background:var(--focus-background)}.mantine-Autocomplete-dropdown[data-variant=surreal]{overflow:hidden}.mantine-Autocomplete-dropdown[data-variant=surreal] .mantine-Autocomplete-options{padding:4px 0 4px 4px}.mantine-Autocomplete-dropdown[data-variant=surreal] .mantine-Autocomplete-option{border-radius:var(--mantine-radius-xs)}.mantine-Autocomplete-dropdown[data-variant=surreal] .mantine-Autocomplete-option:hover{background-color:var(--surreal-glass-subtle)}.mantine-Paper-root[data-variant=surreal]{background:var(--surreal-paper-background)}.mantine-Paper-root[data-variant=surreal][data-with-border]{border:1px solid var(--surreal-glass-subtle)}.mantine-Paper-root[data-variant=filled]{background:var(--surreal-paper-background-filled)}.mantine-Paper-root[data-variant=filled][data-with-border]{border:1px solid var(--surreal-glass-subtle)}.mantine-Paper-root[data-variant=glass]{background:var(--surreal-paper-background-glass);box-shadow:0 12px 45px var(--surreal-background-color);backdrop-filter:var(--surreal-blur)}@supports not (backdrop-filter: var(--surreal-blur)){.mantine-Paper-root[data-variant=glass]{background:var(--surreal-paper-background)}}.mantine-Paper-root[data-variant=glass][data-with-border]{border:1px solid var(--surreal-glass-subtle)}.mantine-ScrollArea-root[data-variant=surreal] .mantine-ScrollArea-scrollbar{transition:opacity .25s ease;opacity:0}.mantine-ScrollArea-root[data-variant=surreal] .mantine-ScrollArea-scrollbar[data-state=visible]{opacity:1}.mantine-ScrollArea-root[data-variant=surreal] .mantine-ScrollArea-scrollbar:hover{background-color:var(--surreal-glass-subtle);border-radius:var(--mantine-radius-xl)}.mantine-Divider-root[data-variant=surreal]{--divider-color: var(--surreal-glass-subtle)}.mantine-Divider-root[data-variant=surreal][data-orientation=horizontal]{border-top:var(--divider-size) solid var(--divider-color)}.mantine-Divider-root[data-variant=surreal][data-orientation=vertical]{border-left:var(--divider-size) solid var(--divider-color)}.mantine-Notification-root[data-variant=spaced],.mantine-Notification-root[data-variant=surreal]{background-color:var(--surreal-glass-subtle);border:1px solid var(--surreal-glass-subtle);align-items:flex-start;padding:var(--mantine-spacing-md);backdrop-filter:var(--surreal-blur)}@supports not (backdrop-filter: var(--surreal-blur)){.mantine-Notification-root[data-variant=spaced],.mantine-Notification-root[data-variant=surreal]{background:var(--surreal-paper-background)}}.mantine-Notification-root[data-variant=spaced] .mantine-Notification-title,.mantine-Notification-root[data-variant=surreal] .mantine-Notification-title{color:var(--mantine-color-bright);font-size:var(--mantine-font-size-md);margin-block:var(--mantine-spacing-xs);font-weight:600}.mantine-Notification-root[data-variant=spaced] .mantine-Notification-description,.mantine-Notification-root[data-variant=surreal] .mantine-Notification-description{color:var(--mantine-color-text)}.mantine-Notification-root[data-variant=spaced] .mantine-Notification-icon,.mantine-Notification-root[data-variant=surreal] .mantine-Notification-icon{background-color:transparent;border:1px solid var(--surreal-glass-subtle);padding:15px;color:var(--notification-color);font-size:5rem}.mantine-Notification-root[data-variant=spaced] .mantine-Notification-body,.mantine-Notification-root[data-variant=surreal] .mantine-Notification-body{padding-left:var(--mantine-spacing-md)}.mantine-Notification-root[data-variant=spaced] .mantine-Notification-body{padding-left:0}.mantine-Notification-root[data-variant=spaced]:before{display:none}.mantine-Loader-root[data-variant=surreal]:after{border:none;background:conic-gradient(from 0,transparent 15%,var(--loader-color) 100%);mask:radial-gradient(circle at center,transparent 50%,#000 0%)}.mantine-ThemeIcon-root[data-variant=surreal]{border-width:1px;border-style:solid;background-color:transparent;color:var(--ti-color)}.mantine-Tooltip-tooltip[data-variant=surreal]{color:var(--tooltip-color, var(--mantine-color-text));background-color:var(--tooltip-bg, var(--mantine-color-obsidian-5));box-shadow:var(--mantine-shadow-md);padding-block:var(--mantine-spacing-xs);padding-inline:var(--mantine-spacing-md);color:#fff}.mantine-Popover-dropdown[data-variant=surreal],.mantine-HoverCard-dropdown[data-variant=surreal],.mantine-Menu-dropdown[data-variant=surreal]{background:var(--surreal-menu-background-color);background-color:var(--surreal-menu-background);border:1px solid var(--surreal-glass-subtle);border-radius:var(--mantine-radius-sm);box-shadow:var(--surreal-menu-shadow);backdrop-filter:var(--surreal-blur)}@supports not (backdrop-filter: var(--surreal-blur)){.mantine-Popover-dropdown[data-variant=surreal],.mantine-HoverCard-dropdown[data-variant=surreal],.mantine-Menu-dropdown[data-variant=surreal]{background:var(--surreal-paper-background)}}.mantine-Popover-dropdown[data-variant=surreal] .mantine-Menu-divider,.mantine-HoverCard-dropdown[data-variant=surreal] .mantine-Menu-divider,.mantine-Menu-dropdown[data-variant=surreal] .mantine-Menu-divider{border-color:var(--surreal-glass-subtle);margin-inline:calc(var(--mantine-spacing-xs) * -1);margin-block:var(--mantine-spacing-xs)}.mantine-Popover-dropdown[data-variant=surreal] .mantine-Menu-label,.mantine-HoverCard-dropdown[data-variant=surreal] .mantine-Menu-label,.mantine-Menu-dropdown[data-variant=surreal] .mantine-Menu-label{color:var(--mantine-color-bright);opacity:var(--surreal-opacity-strong);font-size:var(--mantine-font-size-xs);font-weight:600}.mantine-Popover-dropdown[data-variant=surreal] .mantine-Menu-item,.mantine-HoverCard-dropdown[data-variant=surreal] .mantine-Menu-item,.mantine-Menu-dropdown[data-variant=surreal] .mantine-Menu-item{border-radius:100px;color:var(--mantine-color-bright);font-weight:500}.mantine-Popover-dropdown[data-variant=surreal] .mantine-Menu-item:hover,.mantine-HoverCard-dropdown[data-variant=surreal] .mantine-Menu-item:hover,.mantine-Menu-dropdown[data-variant=surreal] .mantine-Menu-item:hover{background-color:var(--surreal-glass-subtle)}.mantine-Popover-dropdown[data-variant=surreal] .mantine-Menu-item[data-variant=gradient],.mantine-HoverCard-dropdown[data-variant=surreal] .mantine-Menu-item[data-variant=gradient],.mantine-Menu-dropdown[data-variant=surreal] .mantine-Menu-item[data-variant=gradient]{background:var(--surreal-gradient);color:#fff}.mantine-Popover-dropdown[data-variant=surreal] .mantine-Menu-itemSection svg,.mantine-HoverCard-dropdown[data-variant=surreal] .mantine-Menu-itemSection svg,.mantine-Menu-dropdown[data-variant=surreal] .mantine-Menu-itemSection svg{opacity:var(--surreal-opacity-strong)}.mantine-Popover-dropdown[data-variant=surreal] .mantine-Select-option:hover,.mantine-HoverCard-dropdown[data-variant=surreal] .mantine-Select-option:hover,.mantine-Menu-dropdown[data-variant=surreal] .mantine-Select-option:hover{background-color:var(--surreal-glass-subtle)}.mantine-Popover-dropdown[data-variant=transparent],.mantine-HoverCard-dropdown[data-variant=transparent]{background-color:transparent;border:unset;padding:0}.mantine-Modal-root[data-variant=glass] .mantine-Modal-inner,.mantine-Modal-root[data-variant=surreal] .mantine-Modal-inner{overflow-y:auto;display:grid}.mantine-Modal-root[data-variant=glass] .mantine-Modal-content,.mantine-Modal-root[data-variant=surreal] .mantine-Modal-content{border:1px solid var(--surreal-glass-subtle);border-radius:var(--mantine-radius-xs);overflow-y:unset;max-height:unset;width:var(--modal-size);max-width:calc(100vw - var(--modal-inner-x-offset, var(--modal-x-offset)) * 2);backdrop-filter:var(--surreal-blur)}@supports not (backdrop-filter: var(--surreal-blur)){.mantine-Modal-root[data-variant=glass] .mantine-Modal-content,.mantine-Modal-root[data-variant=surreal] .mantine-Modal-content{background:var(--surreal-paper-background)}}.mantine-Modal-root[data-variant=glass] .mantine-Modal-header,.mantine-Modal-root[data-variant=surreal] .mantine-Modal-header{background-color:unset;border-bottom:1px solid var(--surreal-glass-subtle);margin-bottom:var(--mb-padding, var(--mantine-spacing-md));position:static;padding-block:0}.mantine-Modal-root[data-variant=glass] .mantine-Modal-title,.mantine-Modal-root[data-variant=surreal] .mantine-Modal-title{font-size:var(--mantine-font-size-lg);color:var(--mantine-color-bright);font-weight:600}.mantine-Modal-root[data-variant=glass] .mantine-Modal-header{border:none;margin-bottom:0}.mantine-Modal-root[data-variant=glass] .mantine-Modal-content{background-color:color-mix(in srgb,var(--mantine-color-slate-6) calc(var(--surreal-opacity-strong) * 100%),transparent);background-color:var(--surreal-glass-subtle)}.mantine-Overlay-root[data-variant=surreal]{background-color:rgba(from var(--surreal-overlay-color) r g b/.75)}.mantine-Anchor-root[data-variant=surreal]{color:var(--mantine-color-bright)}.mantine-Anchor-root[data-variant=surreal]:hover,.mantine-Anchor-root[data-variant=surreal]:focus-within{color:var(--mantine-color-violet-text)}.mantine-Anchor-root[data-variant=vibrant]{color:var(--mantine-color-violet-text)}.mantine-Anchor-root[data-variant=vibrant]:hover,.mantine-Anchor-root[data-variant=vibrant]:focus-within{color:var(--mantine-color-bright)}.mantine-Anchor-root[data-variant=glow]>div{position:relative}.mantine-Anchor-root[data-variant=glow]>div:before,.mantine-Anchor-root[data-variant=glow]>div:after{content:"";position:absolute;pointer-events:none;transition:all .25s ease;inset:9px;z-index:-2;opacity:0;filter:blur(6px);mix-blend-mode:screen}.mantine-Anchor-root[data-variant=glow]>div:before{background:radial-gradient(120% 170% at 0% 0%,var(--surreal-energy) 0%,rgba(197,91,255,0) 50%),radial-gradient(120% 170% at 100% 100%,var(--surreal-passion) 0%,rgba(96,114,255,0) 50%)}.mantine-Anchor-root[data-variant=glow]>div:after{background:radial-gradient(100% 100% at 0% 0%,var(--surreal-energy) 0%,rgba(197,91,255,0) 35%),radial-gradient(100% 100% at 100% 100%,var(--surreal-passion) 0%,rgba(96,114,255,0) 35%)}.mantine-Anchor-root[data-variant=glow]>div:hover:before,.mantine-Anchor-root[data-variant=glow]>div:hover:after{inset:-9px;opacity:1}.mantine-Badge-root[data-variant=surreal]{border-radius:var(--mantine-radius-xl);background-color:var(--surreal-glass-subtle);border:1px solid var(--surreal-glass-subtle);color:var(--mantine-color-bright)}.mantine-Checkbox-root[data-variant=gradient] .mantine-Checkbox-input,.mantine-Checkbox-root[data-variant=surreal] .mantine-Checkbox-input{border-radius:var(--mantine-radius-xs);background-color:var(--surreal-glass-subtle);border:1px solid var(--surreal-glass-subtle);color:var(--mantine-color-bright)}.mantine-Checkbox-root[data-variant=gradient] .mantine-Checkbox-input:checked,.mantine-Checkbox-root[data-variant=surreal] .mantine-Checkbox-input:checked{background-color:var(--checkbox-color)}.mantine-Checkbox-root[data-variant=gradient] .mantine-Checkbox-label,.mantine-Checkbox-root[data-variant=surreal] .mantine-Checkbox-label{user-select:none}.mantine-Checkbox-root[data-variant=gradient] .mantine-Checkbox-input:checked{background:var(--surreal-gradient);background-origin:border-box}.mantine-Radio-root[data-variant=gradient] .mantine-Radio-radio,.mantine-Radio-root[data-variant=surreal] .mantine-Radio-radio{background-color:var(--surreal-glass-subtle);border:1px solid var(--surreal-glass-subtle);color:var(--mantine-color-bright)}.mantine-Radio-root[data-variant=gradient] .mantine-Radio-radio:checked,.mantine-Radio-root[data-variant=surreal] .mantine-Radio-radio:checked{background-color:var(--radio-color)}.mantine-Radio-root[data-variant=gradient] .mantine-Radio-label,.mantine-Radio-root[data-variant=surreal] .mantine-Radio-label{user-select:none}.mantine-Radio-root[data-variant=gradient] .mantine-Radio-radio:checked{background:var(--surreal-gradient);background-origin:border-box}.mantine-Switch-root[data-variant=gradient] .mantine-Switch-track,.mantine-Switch-root[data-variant=surreal] .mantine-Switch-track{background-color:var(--surreal-glass-subtle);border:1px solid var(--surreal-glass-subtle);cursor:pointer}.mantine-Switch-root[data-variant=gradient] .mantine-Switch-input:checked+.mantine-Switch-track,.mantine-Switch-root[data-variant=surreal] .mantine-Switch-input:checked+.mantine-Switch-track{background-color:var(--switch-color)}.mantine-Switch-root[data-variant=gradient] .mantine-Switch-input:checked+.mantine-Switch-track{background:var(--surreal-gradient);background-origin:border-box}.mantine-Tabs-tab[data-variant=surreal]{border:1px solid var(--surreal-glass-subtle);border-radius:var(--mantine-radius-xl)}.mantine-Tabs-tab[data-variant=surreal][aria-selected=true]{border:1px solid var(--surreal-glass-subtle);background-color:var(--surreal-glass-subtle)}.mantine-Tabs-tab[data-variant=surreal][aria-selected=false]{border:1px solid transparent;background-color:transparent}.mantine-Skeleton-root[data-variant=surreal]:before{background-color:transparent}.mantine-Skeleton-root[data-variant=surreal]:after{background-color:var(--surreal-glass-subtle);animation-timing-function:cubic-bezier(.47,0,.745,.715)}.mantine-SegmentedControl-root[data-variant=surreal]{background-color:transparent;overflow:visible}.mantine-SegmentedControl-root[data-variant=surreal] .mantine-SegmentedControl-indicator{border-radius:3px 3px 0 0;top:unset;bottom:0;height:5px!important;background:var(--surreal-gradient)}.mantine-NavLink-root[data-variant=surreal]{transition:background-color .25s ease;border-radius:var(--mantine-radius-lg);padding:var(--mantine-spacing-xs)}.mantine-NavLink-root[data-variant=surreal] .mantine-NavLink-label{font-weight:500;color:var(--mantine-color-bright)}.mantine-NavLink-root[data-variant=surreal] .mantine-NavLink-description{font-size:var(--mantine-font-size-xs);color:var(--mantine-color-slate-2);opacity:var(--surreal-opacity-strong)}.mantine-NavLink-root[data-variant=surreal]:hover{background-color:var(--surreal-glass-subtle)}.mantine-Kbd-root[data-variant=surreal]{background-color:var(--surreal-glass-subtle);border:1px solid var(--surreal-glass-subtle);color:var(--mantine-color-bright);border-radius:var(--mantine-radius-xs)}.mantine-Title-root[data-variant=surreal-gradient]{color:var(--mantine-color-bright);background:var(--surreal-gradient);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.mantine-Title-root[data-variant=gradient]{color:var(--mantine-color-bright);background:var(--surreal-text-gradient);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.mantine-Tabs-list[data-variant=gradient]{background:var(--surreal-paper-background);border:1px solid var(--surreal-glass-subtle);border-radius:var(--mantine-radius-xl);padding:4px;gap:4px;width:fit-content}.mantine-Tabs-tab[data-variant=gradient]{border-radius:var(--mantine-radius-xl);border:1px solid transparent;color:var(--mantine-color-bright);transition:background-color .2s ease,color .2s ease,border-color .2s ease;background-origin:border-box}.mantine-Tabs-tab[data-variant=gradient][aria-selected=true]{background:var(--surreal-gradient);border-color:var(--surreal-glass-subtle);color:var(--mantine-color-obsidian-0);background-origin:border-box}.mantine-Tabs-tab[data-variant=gradient][aria-selected=false]:hover{background-color:var(--surreal-glass-subtle);color:var(--mantine-color-bright)}.mantine-Pagination-root[data-variant=surreal] .mantine-Pagination-control{border-radius:var(--mantine-radius-xl);border:1px solid var(--surreal-glass-subtle);background-color:transparent;color:var(--mantine-color-bright)}.mantine-Pagination-root[data-variant=surreal] .mantine-Pagination-control[data-active=true]{background:var(--surreal-gradient-gray)}.mantine-Pagination-root[data-variant=surreal] .mantine-Pagination-control:hover{background-color:var(--surreal-glass-subtle)}.mantine-TagsInput-root[data-variant=surreal] .mantine-TagsInput-pill,.mantine-TagsInput-root[data-variant=surreal] .mantine-MultiSelect-pill,.mantine-TagsInput-root[data-variant=filled] .mantine-TagsInput-pill,.mantine-TagsInput-root[data-variant=filled] .mantine-MultiSelect-pill,.mantine-MultiSelect-root[data-variant=filled] .mantine-TagsInput-pill,.mantine-MultiSelect-root[data-variant=filled] .mantine-MultiSelect-pill,.mantine-MultiSelect-root[data-variant=surreal] .mantine-TagsInput-pill,.mantine-MultiSelect-root[data-variant=surreal] .mantine-MultiSelect-pill{background-color:var(--surreal-pill-background);font-weight:500}.mantine-TagsInput-root[data-variant=surreal] .mantine-Pill-remove svg,.mantine-TagsInput-root[data-variant=filled] .mantine-Pill-remove svg,.mantine-MultiSelect-root[data-variant=filled] .mantine-Pill-remove svg,.mantine-MultiSelect-root[data-variant=surreal] .mantine-Pill-remove svg{width:var(--cb-icon-size, 70%)!important;height:var(--cb-icon-size, 70%)!important}.mantine-Table-table[data-variant=surreal]{--table-border-color: var(--surreal-glass-subtle) !important;--table-striped-color: var(--surreal-table-stripe) !important;--table-hover-color: var(--surreal-table-hover-color) !important}.mantine-Alert-root[data-variant=surreal]{border:none;border-left:4px solid var(--alert-color);background-color:var(--surreal-glass-subtle);white-space:pre-wrap}._root_744ed_1{vertical-align:middle;flex-shrink:0}._path_744ed_6{fill:currentColor}._spinning_744ed_10{animation:_spin_744ed_10 .5s linear infinite}@keyframes _spin_744ed_10{0%{transform:rotate(0)}to{transform:rotate(360deg)}}._details_1m4wu_1{background-color:var(--surreal-paper-background);border:2px solid var(--surreal-glass-subtle);border-radius:var(--mantine-radius-lg);padding:var(--mantine-spacing-xl);position:relative;overflow:hidden}._details_1m4wu_1::details-content{display:flex;flex-direction:column;gap:var(--mantine-spacing-md)}._details_1m4wu_1:before{content:" ";background:var(--surreal-gradient);position:absolute;width:100%;height:200px;border-radius:100000px;left:0;right:0;margin:0 auto;top:-220px;filter:blur(50px);pointer-events:none;z-index:0}._summary_1m4wu_32{color:var(--mantine-color-bright);font-size:var(--mantine-spacing-lg);display:flex;justify-content:space-between;align-items:center;cursor:pointer;z-index:1;position:relative}._details_1m4wu_1[open]>._summary_1m4wu_32{margin-bottom:var(--mantine-spacing-lg)}._chevron_1m4wu_47{transition:all .1s ease}._details_1m4wu_1[open]>._chevron_1m4wu_47{rotate:90deg}._details_1m4wu_1>._details_1m4wu_1{margin-top:var(--mantine-spacing-sm);margin-bottom:var(--mantine-spacing-sm)}._root_2wglw_1{display:block}._root_2wglw_1 text{font-family:var(--mantine-font-family-monospace);font-size:var(--mantine-font-size-xs);fill:var(--mantine-color-bright)}._root_2wglw_1 line,._root_2wglw_1 path{stroke:var(--mantine-color-slate-4);stroke-width:2;fill:none}._root_2wglw_1 rect{fill:var(--surreal-paper-background-filled);stroke-width:2}._root_2wglw_1 ._terminal_2wglw_19 rect{stroke:var(--mantine-color-slate-4)}._root_2wglw_1 ._nonTerminal_2wglw_22 rect{stroke:var(--mantine-color-violet-4)}._root_2wglw_1 ._comment_2wglw_25{fill:var(--mantine-color-text)}._spinner_1dhyf_1{stroke:var(--spinner-color);width:var(--spinner-size);height:var(--spinner-size)}._spinner_g_1dhyf_7{transform-origin:center;animation:_spinner-rotate_1dhyf_1 2s linear infinite}._spinner_circle_1dhyf_12{stroke-linecap:round;animation:_spinner-dash_1dhyf_1 1.5s ease-in-out infinite}@keyframes _spinner-rotate_1dhyf_1{to{transform:rotate(360deg)}}@keyframes _spinner-dash_1dhyf_1{0%{stroke-dasharray:0 150;stroke-dashoffset:0}47.5%{stroke-dasharray:42 150;stroke-dashoffset:-16}95%,to{stroke-dasharray:42 150;stroke-dashoffset:-59}}._loader_mqlxq_1{display:flex;align-items:center;justify-content:center;gap:var(--mantine-spacing-md);transition:opacity .25s ease}._container_mqlxq_9[data-loading=false] ._loader_mqlxq_1{opacity:0;pointer-events:none}._mini_mqlxq_14{transition:opacity .25s ease}._container_mqlxq_9[data-loading=true] ._mini_mqlxq_14{opacity:0}._controls_ycnxv_1{position:absolute;display:flex;gap:8px;padding:8px;background:#0009;opacity:0;pointer-events:none;transition:opacity .15s ease;border-radius:4px;z-index:2}._thumbnail_ycnxv_14{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;z-index:1}._videoPlayer_ycnxv_24:hover ._controls_ycnxv_1,._videoPlayer_ycnxv_24:focus-within ._controls_ycnxv_1{opacity:1;pointer-events:auto}._controlsVisible_ycnxv_30{opacity:1;pointer-events:auto}._controlsTopLeft_ycnxv_35{top:12px;left:12px}._controlsTopRight_ycnxv_40{top:12px;right:12px}._controlsBottomLeft_ycnxv_45{bottom:12px;left:12px}._controlsBottomRight_ycnxv_50{bottom:12px;right:12px}._progress_ycnxv_55{position:absolute;left:0;right:0;bottom:0;height:6px;padding:0;border:0;background:#ffffff59;cursor:pointer;display:block;opacity:0;pointer-events:none;transition:opacity .15s ease 1s;margin-inline:-4px;z-index:2}._videoPlayer_ycnxv_24:hover ._progress_ycnxv_55,._videoPlayer_ycnxv_24:focus-within ._progress_ycnxv_55{opacity:1;pointer-events:auto;transition-delay:0s}._progress_ycnxv_55:disabled{cursor:default;opacity:.6}._progress_ycnxv_55:focus-visible{outline:2px solid rgba(255,255,255,.85);outline-offset:2px}._progressFill_ycnxv_90{height:100%;background:#fffffff2}._progressTooltip_ycnxv_95{position:absolute;bottom:100%;transform:translate(-50%);margin-bottom:8px;padding:4px 8px;border-radius:4px;background:#000c;color:#fff;font-size:12px;line-height:1;white-space:nowrap;pointer-events:none}._root_19akq_1{position:relative;font-family:var(--mantine-font-family)}._floatingActions_19akq_6{transform:translateY(-50%)}._root_1ph8i_1 .mantine-Button-label{opacity:var(--surrealist-opacity-strong)}._root_1ph8i_1:hover .mantine-Button-label{opacity:1}._root_197cu_1{min-height:0;flex:1}._editor_197cu_6{position:absolute;inset:0}
|
|
2
|
+
:root{--surreal-opacity-subtle: .07;--surreal-opacity-medium: .3;--surreal-opacity-strong: .6;--surreal-glass-subtle: rgba(255, 255, 255, var(--surreal-opacity-subtle));--surreal-glass-medium: rgba(255, 255, 255, var(--surreal-opacity-medium));--surreal-glass-strong: rgba(255, 255, 255, var(--surreal-opacity-strong));--surreal-blur: blur(12px);--surreal-pink: #ff00a0;--surreal-purple: #9800ff;--surreal-energy: #D255FE;--surreal-passion: #651DDD;--surreal-gradient: linear-gradient(135deg, var(--surreal-energy), var(--surreal-passion));--surreal-spinner-size-xs: 1rem;--surreal-spinner-size-sm: 1.5rem;--surreal-spinner-size-md: 2rem;--surreal-spinner-size-lg: 2.5rem;--surreal-spinner-size-xl: 3rem;--surreal-icon-size-xs: .75em;--surreal-icon-size-sm: 1em;--surreal-icon-size-md: 1.25em;--surreal-icon-size-lg: 1.5em;--surreal-icon-size-xl: 2em}:root[data-mantine-color-scheme=dark]{--surreal-blend-mode: "darken";--surreal-glass-subtle: rgba(255, 255, 255, var(--surreal-opacity-subtle));--surreal-glass-medium: rgba(255, 255, 255, var(--surreal-opacity-medium));--surreal-glass-strong: rgba(255, 255, 255, var(--surreal-opacity-strong));--surreal-overlay-color: #07060a;--surreal-background-color: var(--mantine-color-obsidian-9);--surreal-pill-background: var(--mantine-color-obsidian-6);--surreal-text-gradient: linear-gradient(180deg, var(--mantine-color-obsidian-0), var(--mantine-color-obsidian-3));--surreal-paper-background: linear-gradient(135deg, var(--mantine-color-obsidian-8), var(--mantine-color-obsidian-9));--surreal-menu-background-color: var(--mantine-color-obsidian-7);--surreal-menu-background: rgba(from var(--surreal-menu-background-color) r g b / .75);--surreal-menu-shadow: 0 8px 18px rgba(0, 0, 0, .3), 0 2px 6px rgba(0, 0, 0, .3);--surreal-paper-background-filled: var(--mantine-color-obsidian-8);--surreal-input-background-filled: var(--mantine-color-obsidian-7);--surreal-paper-background-glass: linear-gradient(135deg, var(--mantine-color-obsidian-8), rgba(from var(--mantine-color-obsidian-9) r g b / 0));--surreal-gradient-gray: linear-gradient(101deg, rgba(111, 121, 136, .55) 3.18%, rgba(111, 121, 136, .4) 100%);--surreal-table-stripe: var(--mantine-color-obsidian-7);--surreal-table-hover-color: var(--mantine-color-obsidian-8)}:root[data-mantine-color-scheme=light]{--surreal-blend-mode: "lighten";--surreal-glass-subtle: rgba(0, 0, 0, var(--surreal-opacity-subtle));--surreal-glass-medium: rgba(0, 0, 0, var(--surreal-opacity-medium));--surreal-glass-strong: rgba(0, 0, 0, var(--surreal-opacity-strong));--surreal-overlay-color: #A29FAC;--surreal-background-color: var(--mantine-color-obsidian-1);--surreal-pill-background: var(--mantine-color-obsidian-2);--surreal-text-gradient: linear-gradient(180deg, var(--mantine-color-obsidian-6), var(--mantine-color-obsidian-9));--surreal-paper-background: linear-gradient(135deg, var(--mantine-color-obsidian-0), var(--mantine-color-obsidian-1));--surreal-menu-background-color: var(--mantine-color-obsidian-0);--surreal-menu-background: var(--surreal-menu-background-color);--surreal-menu-shadow: 0 8px 18px rgba(0, 0, 0, .1), 0 2px 6px rgba(0, 0, 0, .1);--surreal-paper-background-filled: var(--mantine-color-obsidian-0);--surreal-input-background-filled: var(--mantine-color-obsidian-2);--surreal-gradient-gray: linear-gradient(101deg, rgba(111, 121, 136, .15) 3.18%, rgba(111, 121, 136, .3) 100%);--surreal-table-stripe: var(--mantine-color-obsidian-2);--surreal-table-hover-color: var(--mantine-color-obsidian-0)}.mantine-ActionIcon-root[data-variant=surreal]{border-width:1px;border-style:solid}.mantine-CloseButton-root[data-variant=surreal]{color:var(--mantine-color-slate-outline)}.mantine-CloseButton-root[data-variant=surreal]:hover{background-color:var(--surreal-glass-subtle)}.mantine-Button-root[data-variant=surreal]{border-width:1px;border-style:solid;backdrop-filter:blur(2px)}.mantine-ActionIcon-root[data-variant=surreal]:disabled{opacity:var(--surreal-opacity-medium)}.mantine-Button-root[data-variant=transparent]:disabled,.mantine-ActionIcon-root[data-variant=transparent]:disabled{background-color:unset;opacity:var(--surreal-opacity-strong)}.mantine-Button-root[data-variant=surreal]:disabled,.mantine-Button-root[data-variant=gradient]:disabled,.mantine-ActionIcon-root[data-variant=surreal]:disabled,.mantine-Checkbox-root[data-variant=surreal]:disabled,.mantine-Radio-root[data-variant=surreal]:disabled{border-color:var(--surreal-glass-subtle);background-color:var(--surreal-glass-subtle);color:var(--mantine-color-text)}.mantine-Checkbox-icon{color:#fff;width:calc(var(--checkbox-size) / 2)}.mantine-Button-root[data-variant=gradient]:hover:not([disabled]){filter:brightness(1.1)}.mantine-InputWrapper-root[data-variant=filled] .mantine-InputWrapper-label,.mantine-InputWrapper-root[data-variant=surreal] .mantine-InputWrapper-label{color:var(--mantine-color-bright);font-weight:600;margin-bottom:4px}.mantine-InputWrapper-root[data-variant=filled] .mantine-Input-input,.mantine-InputWrapper-root[data-variant=filled] .mantine-InputBase-input,.mantine-InputWrapper-root[data-variant=filled] .mantine-TextInput-input,.mantine-InputWrapper-root[data-variant=surreal] .mantine-Input-input,.mantine-InputWrapper-root[data-variant=surreal] .mantine-InputBase-input,.mantine-InputWrapper-root[data-variant=surreal] .mantine-TextInput-input{--focus-outline: color-mix(in srgb, var(--mantine-color-violet-3) 75%, var(--surreal-glass-subtle));color:var(--mantine-color-bright);font-weight:300;transition:all .25s ease;outline:1px solid transparent}.mantine-InputWrapper-root[data-variant=filled] .mantine-Input-input:focus-within,.mantine-InputWrapper-root[data-variant=filled] .mantine-InputBase-input:focus-within,.mantine-InputWrapper-root[data-variant=filled] .mantine-TextInput-input:focus-within,.mantine-InputWrapper-root[data-variant=surreal] .mantine-Input-input:focus-within,.mantine-InputWrapper-root[data-variant=surreal] .mantine-InputBase-input:focus-within,.mantine-InputWrapper-root[data-variant=surreal] .mantine-TextInput-input:focus-within{outline-color:var(--focus-outline)}.mantine-InputWrapper-root[data-variant=filled] .mantine-Input-input::placeholder,.mantine-InputWrapper-root[data-variant=filled] .mantine-InputBase-input::placeholder,.mantine-InputWrapper-root[data-variant=filled] .mantine-TextInput-input::placeholder,.mantine-InputWrapper-root[data-variant=surreal] .mantine-Input-input::placeholder,.mantine-InputWrapper-root[data-variant=surreal] .mantine-InputBase-input::placeholder,.mantine-InputWrapper-root[data-variant=surreal] .mantine-TextInput-input::placeholder{color:var(--mantine-color-text);opacity:var(--surreal-opacity-strong)}.mantine-InputWrapper-root[data-variant=surreal] .mantine-Input-input,.mantine-InputWrapper-root[data-variant=surreal] .mantine-InputBase-input,.mantine-InputWrapper-root[data-variant=surreal] .mantine-TextInput-input{--focus-background: color-mix(in srgb, var(--mantine-color-violet-3) 7%, var(--surreal-glass-subtle));background:linear-gradient(115deg,var(--surreal-glass-subtle),transparent)}.mantine-InputWrapper-root[data-variant=surreal] .mantine-Input-input:focus-within,.mantine-InputWrapper-root[data-variant=surreal] .mantine-InputBase-input:focus-within,.mantine-InputWrapper-root[data-variant=surreal] .mantine-TextInput-input:focus-within{background:linear-gradient(115deg,var(--focus-background),transparent)}.mantine-InputWrapper-root[data-variant=filled] .mantine-Input-input,.mantine-InputWrapper-root[data-variant=filled] .mantine-InputBase-input,.mantine-InputWrapper-root[data-variant=filled] .mantine-TextInput-input{--focus-background: color-mix(in srgb, var(--mantine-color-violet-3) 7%, var(--surreal-input-background-filled));background-color:var(--surreal-input-background-filled)}.mantine-InputWrapper-root[data-variant=filled] .mantine-Input-input:focus-within,.mantine-InputWrapper-root[data-variant=filled] .mantine-InputBase-input:focus-within,.mantine-InputWrapper-root[data-variant=filled] .mantine-TextInput-input:focus-within{background:var(--focus-background)}.mantine-Autocomplete-dropdown[data-variant=surreal]{overflow:hidden}.mantine-Autocomplete-dropdown[data-variant=surreal] .mantine-Autocomplete-options{padding:4px 0 4px 4px}.mantine-Autocomplete-dropdown[data-variant=surreal] .mantine-Autocomplete-option{border-radius:var(--mantine-radius-xs)}.mantine-Autocomplete-dropdown[data-variant=surreal] .mantine-Autocomplete-option:hover{background-color:var(--surreal-glass-subtle)}.mantine-Paper-root[data-variant=surreal]{background:var(--surreal-paper-background)}.mantine-Paper-root[data-variant=surreal][data-with-border]{border:1px solid var(--surreal-glass-subtle)}.mantine-Paper-root[data-variant=filled]{background:var(--surreal-paper-background-filled)}.mantine-Paper-root[data-variant=filled][data-with-border]{border:1px solid var(--surreal-glass-subtle)}.mantine-Paper-root[data-variant=glass]{background:var(--surreal-paper-background-glass);box-shadow:0 12px 45px var(--surreal-background-color);backdrop-filter:var(--surreal-blur)}@supports not (backdrop-filter: var(--surreal-blur)){.mantine-Paper-root[data-variant=glass]{background:var(--surreal-paper-background)}}.mantine-Paper-root[data-variant=glass][data-with-border]{border:1px solid var(--surreal-glass-subtle)}.mantine-ScrollArea-root[data-variant=surreal] .mantine-ScrollArea-scrollbar{transition:opacity .25s ease;opacity:0}.mantine-ScrollArea-root[data-variant=surreal] .mantine-ScrollArea-scrollbar[data-state=visible]{opacity:1}.mantine-ScrollArea-root[data-variant=surreal] .mantine-ScrollArea-scrollbar:hover{background-color:var(--surreal-glass-subtle);border-radius:var(--mantine-radius-xl)}.mantine-Divider-root[data-variant=surreal]{--divider-color: var(--surreal-glass-subtle)}.mantine-Divider-root[data-variant=surreal][data-orientation=horizontal]{border-top:var(--divider-size) solid var(--divider-color)}.mantine-Divider-root[data-variant=surreal][data-orientation=vertical]{border-left:var(--divider-size) solid var(--divider-color)}.mantine-Notification-root[data-variant=spaced],.mantine-Notification-root[data-variant=surreal]{background-color:var(--surreal-glass-subtle);border:1px solid var(--surreal-glass-subtle);align-items:flex-start;padding:var(--mantine-spacing-md);backdrop-filter:var(--surreal-blur)}@supports not (backdrop-filter: var(--surreal-blur)){.mantine-Notification-root[data-variant=spaced],.mantine-Notification-root[data-variant=surreal]{background:var(--surreal-paper-background)}}.mantine-Notification-root[data-variant=spaced] .mantine-Notification-title,.mantine-Notification-root[data-variant=surreal] .mantine-Notification-title{color:var(--mantine-color-bright);font-size:var(--mantine-font-size-md);margin-block:var(--mantine-spacing-xs);font-weight:600}.mantine-Notification-root[data-variant=spaced] .mantine-Notification-description,.mantine-Notification-root[data-variant=surreal] .mantine-Notification-description{color:var(--mantine-color-text)}.mantine-Notification-root[data-variant=spaced] .mantine-Notification-icon,.mantine-Notification-root[data-variant=surreal] .mantine-Notification-icon{background-color:transparent;border:1px solid var(--surreal-glass-subtle);padding:15px;color:var(--notification-color);font-size:5rem}.mantine-Notification-root[data-variant=spaced] .mantine-Notification-body,.mantine-Notification-root[data-variant=surreal] .mantine-Notification-body{padding-left:var(--mantine-spacing-md)}.mantine-Notification-root[data-variant=spaced] .mantine-Notification-body{padding-left:0}.mantine-Notification-root[data-variant=spaced]:before{display:none}.mantine-Loader-root[data-variant=surreal]:after{border:none;background:conic-gradient(from 0,transparent 15%,var(--loader-color) 100%);mask:radial-gradient(circle at center,transparent 50%,#000 0%)}.mantine-ThemeIcon-root[data-variant=surreal]{border-width:1px;border-style:solid;background-color:transparent;color:var(--ti-color)}.mantine-Tooltip-tooltip[data-variant=surreal]{color:var(--tooltip-color, var(--mantine-color-text));background-color:var(--tooltip-bg, var(--mantine-color-obsidian-5));box-shadow:var(--mantine-shadow-md);padding-block:var(--mantine-spacing-xs);padding-inline:var(--mantine-spacing-md);color:#fff}.mantine-Popover-dropdown[data-variant=surreal],.mantine-HoverCard-dropdown[data-variant=surreal],.mantine-Menu-dropdown[data-variant=surreal]{background:var(--surreal-menu-background-color);background-color:var(--surreal-menu-background);border:1px solid var(--surreal-glass-subtle);border-radius:var(--mantine-radius-sm);box-shadow:var(--surreal-menu-shadow);backdrop-filter:var(--surreal-blur)}@supports not (backdrop-filter: var(--surreal-blur)){.mantine-Popover-dropdown[data-variant=surreal],.mantine-HoverCard-dropdown[data-variant=surreal],.mantine-Menu-dropdown[data-variant=surreal]{background:var(--surreal-paper-background)}}.mantine-Popover-dropdown[data-variant=surreal] .mantine-Menu-divider,.mantine-HoverCard-dropdown[data-variant=surreal] .mantine-Menu-divider,.mantine-Menu-dropdown[data-variant=surreal] .mantine-Menu-divider{border-color:var(--surreal-glass-subtle);margin-inline:calc(var(--mantine-spacing-xs) * -1);margin-block:var(--mantine-spacing-xs)}.mantine-Popover-dropdown[data-variant=surreal] .mantine-Menu-label,.mantine-HoverCard-dropdown[data-variant=surreal] .mantine-Menu-label,.mantine-Menu-dropdown[data-variant=surreal] .mantine-Menu-label{color:var(--mantine-color-bright);opacity:var(--surreal-opacity-strong);font-size:var(--mantine-font-size-xs);font-weight:600}.mantine-Popover-dropdown[data-variant=surreal] .mantine-Menu-item,.mantine-HoverCard-dropdown[data-variant=surreal] .mantine-Menu-item,.mantine-Menu-dropdown[data-variant=surreal] .mantine-Menu-item{border-radius:100px;color:var(--mantine-color-bright);padding-block:var(--mantine-spacing-xs);font-weight:500}.mantine-Popover-dropdown[data-variant=surreal] .mantine-Menu-item:hover,.mantine-HoverCard-dropdown[data-variant=surreal] .mantine-Menu-item:hover,.mantine-Menu-dropdown[data-variant=surreal] .mantine-Menu-item:hover{background-color:var(--menu-item-hover, var(--surreal-glass-subtle))}.mantine-Popover-dropdown[data-variant=surreal] .mantine-Menu-itemSection[data-position=left],.mantine-HoverCard-dropdown[data-variant=surreal] .mantine-Menu-itemSection[data-position=left],.mantine-Menu-dropdown[data-variant=surreal] .mantine-Menu-itemSection[data-position=left]{margin-right:var(--mantine-spacing-sm)}.mantine-Popover-dropdown[data-variant=surreal] .mantine-Menu-itemSection[data-position=right],.mantine-HoverCard-dropdown[data-variant=surreal] .mantine-Menu-itemSection[data-position=right],.mantine-Menu-dropdown[data-variant=surreal] .mantine-Menu-itemSection[data-position=right]{margin-left:var(--mantine-spacing-sm)}.mantine-Popover-dropdown[data-variant=surreal] .mantine-Menu-itemSection svg,.mantine-HoverCard-dropdown[data-variant=surreal] .mantine-Menu-itemSection svg,.mantine-Menu-dropdown[data-variant=surreal] .mantine-Menu-itemSection svg{opacity:var(--surreal-opacity-strong)}.mantine-Popover-dropdown[data-variant=surreal] .mantine-Menu-item[data-variant=gradient],.mantine-HoverCard-dropdown[data-variant=surreal] .mantine-Menu-item[data-variant=gradient],.mantine-Menu-dropdown[data-variant=surreal] .mantine-Menu-item[data-variant=gradient]{background:var(--surreal-gradient);color:#fff}.mantine-Popover-dropdown[data-variant=surreal] .mantine-Menu-item[data-variant=gradient] .mantine-Menu-itemSection svg,.mantine-HoverCard-dropdown[data-variant=surreal] .mantine-Menu-item[data-variant=gradient] .mantine-Menu-itemSection svg,.mantine-Menu-dropdown[data-variant=surreal] .mantine-Menu-item[data-variant=gradient] .mantine-Menu-itemSection svg{opacity:1}.mantine-Popover-dropdown[data-variant=surreal] .mantine-Select-option:hover,.mantine-HoverCard-dropdown[data-variant=surreal] .mantine-Select-option:hover,.mantine-Menu-dropdown[data-variant=surreal] .mantine-Select-option:hover{background-color:var(--surreal-glass-subtle)}.mantine-Popover-dropdown[data-variant=transparent],.mantine-HoverCard-dropdown[data-variant=transparent]{background-color:transparent;border:unset;padding:0}.mantine-Modal-root[data-variant=glass] .mantine-Modal-inner,.mantine-Modal-root[data-variant=surreal] .mantine-Modal-inner{overflow-y:auto;display:grid}.mantine-Modal-root[data-variant=glass] .mantine-Modal-content,.mantine-Modal-root[data-variant=surreal] .mantine-Modal-content{border:1px solid var(--surreal-glass-subtle);border-radius:var(--mantine-radius-xs);overflow-y:unset;max-height:unset;width:var(--modal-size);max-width:calc(100vw - var(--modal-inner-x-offset, var(--modal-x-offset)) * 2);backdrop-filter:var(--surreal-blur)}@supports not (backdrop-filter: var(--surreal-blur)){.mantine-Modal-root[data-variant=glass] .mantine-Modal-content,.mantine-Modal-root[data-variant=surreal] .mantine-Modal-content{background:var(--surreal-paper-background)}}.mantine-Modal-root[data-variant=glass] .mantine-Modal-header,.mantine-Modal-root[data-variant=surreal] .mantine-Modal-header{background-color:unset;border-bottom:1px solid var(--surreal-glass-subtle);margin-bottom:var(--mb-padding, var(--mantine-spacing-md));position:static;padding-block:0}.mantine-Modal-root[data-variant=glass] .mantine-Modal-title,.mantine-Modal-root[data-variant=surreal] .mantine-Modal-title{font-size:var(--mantine-font-size-lg);color:var(--mantine-color-bright);font-weight:600}.mantine-Modal-root[data-variant=glass] .mantine-Modal-header{border:none;margin-bottom:0}.mantine-Modal-root[data-variant=glass] .mantine-Modal-content{background-color:color-mix(in srgb,var(--mantine-color-slate-6) calc(var(--surreal-opacity-strong) * 100%),transparent);background-color:var(--surreal-glass-subtle)}.mantine-Overlay-root[data-variant=surreal]{background-color:rgba(from var(--surreal-overlay-color) r g b/.75)}.mantine-Anchor-root[data-variant=surreal]{color:var(--mantine-color-bright)}.mantine-Anchor-root[data-variant=surreal]:hover,.mantine-Anchor-root[data-variant=surreal]:focus-within{color:var(--mantine-color-violet-text)}.mantine-Anchor-root[data-variant=vibrant]{color:var(--mantine-color-violet-text)}.mantine-Anchor-root[data-variant=vibrant]:hover,.mantine-Anchor-root[data-variant=vibrant]:focus-within{color:var(--mantine-color-bright)}.mantine-Anchor-root[data-variant=glow]>div{position:relative}.mantine-Anchor-root[data-variant=glow]>div:before,.mantine-Anchor-root[data-variant=glow]>div:after{content:"";position:absolute;pointer-events:none;transition:all .25s ease;inset:9px;z-index:-2;opacity:0;filter:blur(6px);mix-blend-mode:screen}.mantine-Anchor-root[data-variant=glow]>div:before{background:radial-gradient(120% 170% at 0% 0%,var(--surreal-energy) 0%,rgba(197,91,255,0) 50%),radial-gradient(120% 170% at 100% 100%,var(--surreal-passion) 0%,rgba(96,114,255,0) 50%)}.mantine-Anchor-root[data-variant=glow]>div:after{background:radial-gradient(100% 100% at 0% 0%,var(--surreal-energy) 0%,rgba(197,91,255,0) 35%),radial-gradient(100% 100% at 100% 100%,var(--surreal-passion) 0%,rgba(96,114,255,0) 35%)}.mantine-Anchor-root[data-variant=glow]>div:hover:before,.mantine-Anchor-root[data-variant=glow]>div:hover:after{inset:-9px;opacity:1}.mantine-Badge-root[data-variant=surreal]{border-radius:var(--mantine-radius-xl);background-color:var(--surreal-glass-subtle);border:1px solid var(--surreal-glass-subtle);color:var(--mantine-color-bright)}.mantine-Checkbox-root[data-variant=gradient] .mantine-Checkbox-input,.mantine-Checkbox-root[data-variant=surreal] .mantine-Checkbox-input{border-radius:var(--mantine-radius-xs);background-color:var(--surreal-glass-subtle);border:1px solid var(--surreal-glass-subtle);color:var(--mantine-color-bright)}.mantine-Checkbox-root[data-variant=gradient] .mantine-Checkbox-input:checked,.mantine-Checkbox-root[data-variant=surreal] .mantine-Checkbox-input:checked{background-color:var(--checkbox-color)}.mantine-Checkbox-root[data-variant=gradient] .mantine-Checkbox-label,.mantine-Checkbox-root[data-variant=surreal] .mantine-Checkbox-label{user-select:none}.mantine-Checkbox-root[data-variant=gradient] .mantine-Checkbox-input:checked{background:var(--surreal-gradient);background-origin:border-box}.mantine-Radio-root[data-variant=gradient] .mantine-Radio-radio,.mantine-Radio-root[data-variant=surreal] .mantine-Radio-radio{background-color:var(--surreal-glass-subtle);border:1px solid var(--surreal-glass-subtle);color:var(--mantine-color-bright)}.mantine-Radio-root[data-variant=gradient] .mantine-Radio-radio:checked,.mantine-Radio-root[data-variant=surreal] .mantine-Radio-radio:checked{background-color:var(--radio-color)}.mantine-Radio-root[data-variant=gradient] .mantine-Radio-label,.mantine-Radio-root[data-variant=surreal] .mantine-Radio-label{user-select:none}.mantine-Radio-root[data-variant=gradient] .mantine-Radio-radio:checked{background:var(--surreal-gradient);background-origin:border-box}.mantine-Switch-root[data-variant=gradient] .mantine-Switch-track,.mantine-Switch-root[data-variant=surreal] .mantine-Switch-track{background-color:var(--surreal-glass-subtle);border:1px solid var(--surreal-glass-subtle);cursor:pointer}.mantine-Switch-root[data-variant=gradient] .mantine-Switch-input:checked+.mantine-Switch-track,.mantine-Switch-root[data-variant=surreal] .mantine-Switch-input:checked+.mantine-Switch-track{background-color:var(--switch-color)}.mantine-Switch-root[data-variant=gradient] .mantine-Switch-input:checked+.mantine-Switch-track{background:var(--surreal-gradient);background-origin:border-box}.mantine-Tabs-tab[data-variant=surreal]{border:1px solid var(--surreal-glass-subtle);border-radius:var(--mantine-radius-xl)}.mantine-Tabs-tab[data-variant=surreal][aria-selected=true]{border:1px solid var(--surreal-glass-subtle);background-color:var(--surreal-glass-subtle)}.mantine-Tabs-tab[data-variant=surreal][aria-selected=false]{border:1px solid transparent;background-color:transparent}.mantine-Skeleton-root[data-variant=surreal]:before{background-color:transparent}.mantine-Skeleton-root[data-variant=surreal]:after{background-color:var(--surreal-glass-subtle);animation-timing-function:cubic-bezier(.47,0,.745,.715)}.mantine-SegmentedControl-root[data-variant=surreal]{background-color:transparent;overflow:visible}.mantine-SegmentedControl-root[data-variant=surreal] .mantine-SegmentedControl-indicator{border-radius:3px 3px 0 0;top:unset;bottom:0;height:5px!important;background:var(--surreal-gradient)}.mantine-NavLink-root[data-variant=surreal]{transition:background-color .25s ease;border-radius:var(--mantine-radius-lg);padding:var(--mantine-spacing-xs)}.mantine-NavLink-root[data-variant=surreal] .mantine-NavLink-label{font-weight:500;color:var(--mantine-color-bright)}.mantine-NavLink-root[data-variant=surreal] .mantine-NavLink-description{font-size:var(--mantine-font-size-xs);color:var(--mantine-color-slate-2);opacity:var(--surreal-opacity-strong)}.mantine-NavLink-root[data-variant=surreal]:hover{background-color:var(--surreal-glass-subtle)}.mantine-Kbd-root[data-variant=surreal]{background-color:var(--surreal-glass-subtle);border:1px solid var(--surreal-glass-subtle);color:var(--mantine-color-bright);border-radius:var(--mantine-radius-xs)}.mantine-Title-root[data-variant=surreal-gradient]{color:var(--mantine-color-bright);background:var(--surreal-gradient);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.mantine-Title-root[data-variant=gradient]{color:var(--mantine-color-bright);background:var(--surreal-text-gradient);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.mantine-Tabs-list[data-variant=gradient]{background:var(--surreal-paper-background);border:1px solid var(--surreal-glass-subtle);border-radius:var(--mantine-radius-xl);padding:4px;gap:4px;width:fit-content}.mantine-Tabs-tab[data-variant=gradient]{border-radius:var(--mantine-radius-xl);border:1px solid transparent;color:var(--mantine-color-bright);transition:background-color .2s ease,color .2s ease,border-color .2s ease;background-origin:border-box}.mantine-Tabs-tab[data-variant=gradient][aria-selected=true]{background:var(--surreal-gradient);border-color:var(--surreal-glass-subtle);color:var(--mantine-color-obsidian-0);background-origin:border-box}.mantine-Tabs-tab[data-variant=gradient][aria-selected=false]:hover{background-color:var(--surreal-glass-subtle);color:var(--mantine-color-bright)}.mantine-Pagination-root[data-variant=surreal] .mantine-Pagination-control{border-radius:var(--mantine-radius-xl);border:1px solid var(--surreal-glass-subtle);background-color:transparent;color:var(--mantine-color-bright)}.mantine-Pagination-root[data-variant=surreal] .mantine-Pagination-control[data-active=true]{background:var(--surreal-gradient-gray)}.mantine-Pagination-root[data-variant=surreal] .mantine-Pagination-control:hover{background-color:var(--surreal-glass-subtle)}.mantine-TagsInput-root[data-variant=surreal] .mantine-TagsInput-pill,.mantine-TagsInput-root[data-variant=surreal] .mantine-MultiSelect-pill,.mantine-TagsInput-root[data-variant=filled] .mantine-TagsInput-pill,.mantine-TagsInput-root[data-variant=filled] .mantine-MultiSelect-pill,.mantine-MultiSelect-root[data-variant=filled] .mantine-TagsInput-pill,.mantine-MultiSelect-root[data-variant=filled] .mantine-MultiSelect-pill,.mantine-MultiSelect-root[data-variant=surreal] .mantine-TagsInput-pill,.mantine-MultiSelect-root[data-variant=surreal] .mantine-MultiSelect-pill{background-color:var(--surreal-pill-background);font-weight:500}.mantine-TagsInput-root[data-variant=surreal] .mantine-Pill-remove svg,.mantine-TagsInput-root[data-variant=filled] .mantine-Pill-remove svg,.mantine-MultiSelect-root[data-variant=filled] .mantine-Pill-remove svg,.mantine-MultiSelect-root[data-variant=surreal] .mantine-Pill-remove svg{width:var(--cb-icon-size, 70%)!important;height:var(--cb-icon-size, 70%)!important}.mantine-Table-table[data-variant=surreal]{--table-border-color: var(--surreal-glass-subtle) !important;--table-striped-color: var(--surreal-table-stripe) !important;--table-hover-color: var(--surreal-table-hover-color) !important}.mantine-Alert-root[data-variant=surreal]{border:none;border-left:4px solid var(--alert-color);background-color:var(--surreal-glass-subtle);white-space:pre-wrap}._root_hzrc8_1{vertical-align:middle;flex-shrink:0;color:var(--icon-color);width:var(--icon-size);height:var(--icon-size)}._root_hzrc8_1[flip=horizontal],._root_hzrc8_1[flip=both]{transform:scaleX(-1)}._root_hzrc8_1[flip=vertical],._root_hzrc8_1[flip=both]{transform:scaleY(-1)}._path_hzrc8_15{fill:currentColor}._spinning_hzrc8_19{animation:_spin_hzrc8_19 .5s linear infinite}@keyframes _spin_hzrc8_19{0%{transform:rotate(0)}to{transform:rotate(360deg)}}._details_1m4wu_1{background-color:var(--surreal-paper-background);border:2px solid var(--surreal-glass-subtle);border-radius:var(--mantine-radius-lg);padding:var(--mantine-spacing-xl);position:relative;overflow:hidden}._details_1m4wu_1::details-content{display:flex;flex-direction:column;gap:var(--mantine-spacing-md)}._details_1m4wu_1:before{content:" ";background:var(--surreal-gradient);position:absolute;width:100%;height:200px;border-radius:100000px;left:0;right:0;margin:0 auto;top:-220px;filter:blur(50px);pointer-events:none;z-index:0}._summary_1m4wu_32{color:var(--mantine-color-bright);font-size:var(--mantine-spacing-lg);display:flex;justify-content:space-between;align-items:center;cursor:pointer;z-index:1;position:relative}._details_1m4wu_1[open]>._summary_1m4wu_32{margin-bottom:var(--mantine-spacing-lg)}._chevron_1m4wu_47{transition:all .1s ease}._details_1m4wu_1[open]>._chevron_1m4wu_47{rotate:90deg}._details_1m4wu_1>._details_1m4wu_1{margin-top:var(--mantine-spacing-sm);margin-bottom:var(--mantine-spacing-sm)}._spinner_1dhyf_1{stroke:var(--spinner-color);width:var(--spinner-size);height:var(--spinner-size)}._spinner_g_1dhyf_7{transform-origin:center;animation:_spinner-rotate_1dhyf_1 2s linear infinite}._spinner_circle_1dhyf_12{stroke-linecap:round;animation:_spinner-dash_1dhyf_1 1.5s ease-in-out infinite}@keyframes _spinner-rotate_1dhyf_1{to{transform:rotate(360deg)}}@keyframes _spinner-dash_1dhyf_1{0%{stroke-dasharray:0 150;stroke-dashoffset:0}47.5%{stroke-dasharray:42 150;stroke-dashoffset:-16}95%,to{stroke-dasharray:42 150;stroke-dashoffset:-59}}._loader_mqlxq_1{display:flex;align-items:center;justify-content:center;gap:var(--mantine-spacing-md);transition:opacity .25s ease}._container_mqlxq_9[data-loading=false] ._loader_mqlxq_1{opacity:0;pointer-events:none}._mini_mqlxq_14{transition:opacity .25s ease}._container_mqlxq_9[data-loading=true] ._mini_mqlxq_14{opacity:0}._controls_ycnxv_1{position:absolute;display:flex;gap:8px;padding:8px;background:#0009;opacity:0;pointer-events:none;transition:opacity .15s ease;border-radius:4px;z-index:2}._thumbnail_ycnxv_14{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;z-index:1}._videoPlayer_ycnxv_24:hover ._controls_ycnxv_1,._videoPlayer_ycnxv_24:focus-within ._controls_ycnxv_1{opacity:1;pointer-events:auto}._controlsVisible_ycnxv_30{opacity:1;pointer-events:auto}._controlsTopLeft_ycnxv_35{top:12px;left:12px}._controlsTopRight_ycnxv_40{top:12px;right:12px}._controlsBottomLeft_ycnxv_45{bottom:12px;left:12px}._controlsBottomRight_ycnxv_50{bottom:12px;right:12px}._progress_ycnxv_55{position:absolute;left:0;right:0;bottom:0;height:6px;padding:0;border:0;background:#ffffff59;cursor:pointer;display:block;opacity:0;pointer-events:none;transition:opacity .15s ease 1s;margin-inline:-4px;z-index:2}._videoPlayer_ycnxv_24:hover ._progress_ycnxv_55,._videoPlayer_ycnxv_24:focus-within ._progress_ycnxv_55{opacity:1;pointer-events:auto;transition-delay:0s}._progress_ycnxv_55:disabled{cursor:default;opacity:.6}._progress_ycnxv_55:focus-visible{outline:2px solid rgba(255,255,255,.85);outline-offset:2px}._progressFill_ycnxv_90{height:100%;background:#fffffff2}._progressTooltip_ycnxv_95{position:absolute;bottom:100%;transform:translate(-50%);margin-bottom:8px;padding:4px 8px;border-radius:4px;background:#000c;color:#fff;font-size:12px;line-height:1;white-space:nowrap;pointer-events:none}._root_19akq_1{position:relative;font-family:var(--mantine-font-family)}._floatingActions_19akq_6{transform:translateY(-50%)}._root_1ph8i_1 .mantine-Button-label{opacity:var(--surrealist-opacity-strong)}._root_1ph8i_1:hover .mantine-Button-label{opacity:1}._root_197cu_1{min-height:0;flex:1}._editor_197cu_6{position:absolute;inset:0}._root_2wglw_1{display:block}._root_2wglw_1 text{font-family:var(--mantine-font-family-monospace);font-size:var(--mantine-font-size-xs);fill:var(--mantine-color-bright)}._root_2wglw_1 line,._root_2wglw_1 path{stroke:var(--mantine-color-slate-4);stroke-width:2;fill:none}._root_2wglw_1 rect{fill:var(--surreal-paper-background-filled);stroke-width:2}._root_2wglw_1 ._terminal_2wglw_19 rect{stroke:var(--mantine-color-slate-4)}._root_2wglw_1 ._nonTerminal_2wglw_22 rect{stroke:var(--mantine-color-violet-4)}._root_2wglw_1 ._comment_2wglw_25{fill:var(--mantine-color-text)}
|
|
3
3
|
|
|
4
4
|
}
|