mnfst 0.5.53 → 0.5.55

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/lib/manifest.js CHANGED
@@ -11,6 +11,166 @@
11
11
  (function () {
12
12
  'use strict';
13
13
 
14
+ /*
15
+ * Hydration contract runtime
16
+ * --------------------------
17
+ * Prerendered MPA pages carry a `<script type="application/json"
18
+ * id="__manifest_hydrate__">` blob containing the source-authored
19
+ * attributes (and, for explicit `data-hydrate` subtrees, the source
20
+ * innerHTML) of every element that needs runtime hydration. This
21
+ * function runs once on page load BEFORE any plugin or Alpine starts —
22
+ * it walks the contract, restores source state, and removes its own
23
+ * markers. Every downstream plugin (themes, router, data, markdown,
24
+ * icons, …) then sees exactly the DOM the user authored, exactly as it
25
+ * would in a live SPA. No plugin needs a "prerender mode" branch.
26
+ *
27
+ * Implementation notes:
28
+ * - We use a temp-div HTML parse to set attributes because `setAttribute`
29
+ * throws InvalidCharacterError on Alpine special names like `@click`.
30
+ * The HTML parser is lenient and accepts them.
31
+ * - The contract is a compact diff: only attributes whose values drifted
32
+ * from source during prerender appear. An entry's `attrs` object maps
33
+ * attribute name -> source value, or null to mean "remove".
34
+ */
35
+ function hydratePrerenderedPage() {
36
+ if (typeof document === 'undefined' || !document.querySelector) return;
37
+ // Only run on pages the prerender marked as static MPA output.
38
+ const prerenderMeta = document.querySelector('meta[name="manifest:prerendered"]');
39
+ if (!prerenderMeta || prerenderMeta.getAttribute('content') === '0') return;
40
+ const blob = document.getElementById('__manifest_hydrate__');
41
+ if (!blob) return;
42
+ let entries;
43
+ try {
44
+ entries = JSON.parse(blob.textContent || '[]');
45
+ } catch (_) {
46
+ entries = [];
47
+ }
48
+ if (!Array.isArray(entries) || entries.length === 0) {
49
+ blob.remove();
50
+ return;
51
+ }
52
+ const escAttr = (s) => String(s == null ? '' : s)
53
+ .replace(/&/g, '&amp;')
54
+ .replace(/"/g, '&quot;');
55
+ const voidEls = new Set(['area', 'base', 'br', 'col', 'embed', 'hr', 'img', 'input', 'link', 'meta', 'param', 'source', 'track', 'wbr']);
56
+
57
+ // Restore deepest-first so that when an ancestor rebuilds its innerHTML,
58
+ // its children have already been restored and their source state is what
59
+ // the ancestor captures.
60
+ const items = [];
61
+ for (const entry of entries) {
62
+ const el = document.querySelector('[data-hydrate-id="' + entry.id + '"]');
63
+ if (!el) continue;
64
+ let depth = 0;
65
+ for (let p = el.parentNode; p; p = p.parentNode) depth++;
66
+ items.push({ entry, el, depth });
67
+ }
68
+ items.sort((a, b) => b.depth - a.depth);
69
+
70
+ for (const { entry, el: initialEl } of items) {
71
+ const el = document.querySelector('[data-hydrate-id="' + entry.id + '"]') || initialEl;
72
+ if (!el || !el.parentNode) continue;
73
+
74
+ // Case 1: explicit subtree restoration (entry.html present).
75
+ // Rebuild the element from scratch via outerHTML replacement so the
76
+ // entire subtree mirrors the authored source.
77
+ if (typeof entry.html === 'string') {
78
+ const tag = el.tagName.toLowerCase();
79
+ const finalAttrs = {};
80
+ // Start from current attrs, then apply the contract diff.
81
+ const cur = el.attributes;
82
+ for (let i = 0; i < cur.length; i++) {
83
+ if (cur[i].name !== 'data-hydrate-id') finalAttrs[cur[i].name] = cur[i].value;
84
+ }
85
+ if (entry.attrs) {
86
+ for (const name in entry.attrs) {
87
+ const v = entry.attrs[name];
88
+ if (v === null) delete finalAttrs[name];
89
+ else finalAttrs[name] = v;
90
+ }
91
+ }
92
+ const attrString = Object.keys(finalAttrs)
93
+ .map((n) => n + '="' + escAttr(finalAttrs[n]) + '"')
94
+ .join(' ');
95
+ const isVoid = voidEls.has(tag);
96
+ const newHTML = isVoid
97
+ ? '<' + tag + ' ' + attrString + '>'
98
+ : '<' + tag + ' ' + attrString + '>' + entry.html + '</' + tag + '>';
99
+ const tmp = document.createElement('div');
100
+ tmp.innerHTML = newHTML;
101
+ const parsed = tmp.firstElementChild;
102
+ if (parsed) {
103
+ try { el.parentNode.replaceChild(parsed, el); } catch (_) {}
104
+ }
105
+ continue;
106
+ }
107
+
108
+ // Case 2: attribute-only diff. Reparse the element with the merged
109
+ // attribute set (current attrs overlaid by source diff) so that
110
+ // special-name attributes like @click work. Preserve innerHTML.
111
+ if (!entry.attrs) continue;
112
+ const tag = el.tagName.toLowerCase();
113
+ const finalAttrs = {};
114
+ const cur = el.attributes;
115
+ for (let i = 0; i < cur.length; i++) {
116
+ if (cur[i].name !== 'data-hydrate-id') finalAttrs[cur[i].name] = cur[i].value;
117
+ }
118
+ for (const name in entry.attrs) {
119
+ const v = entry.attrs[name];
120
+ if (v === null) delete finalAttrs[name];
121
+ else finalAttrs[name] = v;
122
+ }
123
+ const attrString = Object.keys(finalAttrs)
124
+ .map((n) => n + '="' + escAttr(finalAttrs[n]) + '"')
125
+ .join(' ');
126
+ const isVoid = voidEls.has(tag);
127
+ const innerHTML = isVoid ? '' : el.innerHTML;
128
+ const newHTML = isVoid
129
+ ? '<' + tag + ' ' + attrString + '>'
130
+ : '<' + tag + ' ' + attrString + '>' + innerHTML + '</' + tag + '>';
131
+ const tmp = document.createElement('div');
132
+ tmp.innerHTML = newHTML;
133
+ const parsed = tmp.firstElementChild;
134
+ if (parsed) {
135
+ try { el.parentNode.replaceChild(parsed, el); } catch (_) {}
136
+ }
137
+ }
138
+
139
+ blob.remove();
140
+ }
141
+
142
+ // Run hydration BEFORE Alpine's deferred script executes.
143
+ //
144
+ // Timing: `<script defer>` runs AFTER HTML parsing finishes but BEFORE
145
+ // `DOMContentLoaded` fires. So listening for DOMContentLoaded is too late —
146
+ // Alpine has already walked the tree and attached directives by then, and
147
+ // our `replaceChild`-based restore would destroy the Alpine-bound nodes.
148
+ //
149
+ // The only earlier hook is `readystatechange → 'interactive'`, which is
150
+ // dispatched the moment the parser finishes and BEFORE deferred scripts run.
151
+ // We also run synchronously if readyState is already 'interactive' or later
152
+ // (e.g. if manifest.js was injected dynamically after page load).
153
+ function tryHydrate() {
154
+ try { hydratePrerenderedPage(); } catch (e) { /* graceful */ }
155
+ }
156
+ if (typeof document !== 'undefined') {
157
+ if (document.readyState === 'loading') {
158
+ // We're still parsing. Listen for 'interactive' via readystatechange
159
+ // — this is the earliest moment document.body is guaranteed to exist
160
+ // but deferred scripts haven't run yet.
161
+ let hydrated = false;
162
+ document.addEventListener('readystatechange', () => {
163
+ if (!hydrated && document.readyState !== 'loading') {
164
+ hydrated = true;
165
+ tryHydrate();
166
+ }
167
+ });
168
+ } else {
169
+ // Parser already done (interactive or complete). Hydrate immediately.
170
+ tryHydrate();
171
+ }
172
+ }
173
+
14
174
  // Configuration
15
175
  const DEFAULT_VERSION = 'latest';
16
176
  const ALPINE_CDN_URL = 'https://cdn.jsdelivr.net/npm/alpinejs@3/dist/cdn.min.js';
@@ -36,7 +196,8 @@
36
196
  'dropdowns',
37
197
  'tabs',
38
198
  'slides',
39
- 'resize'
199
+ 'resize',
200
+ 'colorpicker'
40
201
  ];
41
202
 
42
203
  // Appwrite integration plugins (opt-in only, never auto-loaded)
@@ -79,16 +240,26 @@
79
240
  });
80
241
  }
81
242
 
82
- // Get plugin URL from CDN
243
+ // Get plugin URL from CDN or the `data-plugin-base` override. When the
244
+ // loader's <script> tag carries `data-plugin-base="/scripts"` (or an
245
+ // absolute URL), plugins are loaded from that base as unminified `.js`
246
+ // files. Otherwise they come from the jsDelivr CDN as `.min.js`.
247
+ let _pluginBase = null;
248
+ function setPluginBase(b) { _pluginBase = b || null; }
83
249
  function getPluginUrl(pluginName, version = DEFAULT_VERSION) {
250
+ if (_pluginBase) {
251
+ const base = _pluginBase.replace(/\/$/, '');
252
+ if (pluginName.startsWith('appwrite-')) {
253
+ const appwriteName = pluginName.replace('appwrite-', 'appwrite.');
254
+ return `${base}/manifest.${appwriteName}.js`;
255
+ }
256
+ return `${base}/manifest.${pluginName}.js`;
257
+ }
84
258
  const base = getBaseUrl(version);
85
-
86
- // Handle Appwrite plugin naming (appwrite-auth -> manifest.appwrite.auth.min.js)
87
259
  if (pluginName.startsWith('appwrite-')) {
88
260
  const appwriteName = pluginName.replace('appwrite-', 'appwrite.');
89
261
  return `${base}/manifest.${appwriteName}.min.js`;
90
262
  }
91
-
92
263
  return `${base}/manifest.${pluginName}.min.js`;
93
264
  }
94
265
 
@@ -99,23 +270,31 @@
99
270
  return `https://cdn.jsdelivr.net/npm/alpinejs@${dataAlpine}/dist/cdn.min.js`;
100
271
  }
101
272
 
102
- // Load Alpine.js from CDN with defer attribute
103
- // Alpine waits for DOM to be ready, and by then all plugins are registered
273
+ // Load Alpine.js from CDN. Called by the loader AFTER all plugin scripts
274
+ // have finished loading and registered their directives/magics. We do
275
+ // NOT use `defer` here — defer fires at DOMContentLoaded, which may race
276
+ // the plugin loads; instead we wait for every plugin script's load event
277
+ // explicitly and then append Alpine synchronously (the script downloads
278
+ // but Alpine's `auto-start` hooks DOMContentLoaded if still loading, or
279
+ // runs immediately if past it).
104
280
  function loadAlpine(alpineUrl = ALPINE_CDN_URL) {
105
281
  // Fast check: Alpine already initialized
106
282
  if (window.Alpine) {
107
283
  return;
108
284
  }
109
285
 
110
- // Fallback: Check if script tag exists (Alpine might be loading)
111
- const existingAlpine = document.querySelector('script[src*="alpine"]');
286
+ // Fallback: if an existing Alpine <script> tag is already in the DOM
287
+ // (e.g. the fixture explicitly added one), wait for it — don't inject
288
+ // a second copy.
289
+ const existingAlpine = document.querySelector('script[src*="alpinejs"]');
112
290
  if (existingAlpine) {
113
291
  return;
114
292
  }
115
293
 
116
294
  const script = document.createElement('script');
117
295
  script.src = alpineUrl;
118
- script.defer = true; // Critical: defer ensures Alpine waits for DOM and all plugins
296
+ // No `defer` we're already past plugin registration, so Alpine
297
+ // should load and execute as soon as it arrives.
119
298
  document.head.appendChild(script);
120
299
  }
121
300
 
@@ -229,6 +408,12 @@
229
408
  const tailwind = script.getAttribute('data-tailwind') !== null;
230
409
  const version = script.getAttribute('data-version') || DEFAULT_VERSION;
231
410
  const alpine = script.getAttribute('data-alpine');
411
+ // Optional override: when present, plugin URLs are resolved against
412
+ // this base instead of the CDN. Useful for self-hosted deployments
413
+ // and for the e2e harness which needs to load locally-built plugins.
414
+ // The base should point at a directory that serves `manifest.<name>.js`
415
+ // files. It can be relative (e.g. "/scripts") or absolute.
416
+ const pluginBase = script.getAttribute('data-plugin-base');
232
417
 
233
418
  let pluginList = [];
234
419
  const deriveFromManifest = !plugins;
@@ -255,7 +440,8 @@
255
440
  deriveFromManifest,
256
441
  tailwind,
257
442
  version,
258
- alpine
443
+ alpine,
444
+ pluginBase,
259
445
  };
260
446
  }
261
447
 
@@ -304,6 +490,7 @@
304
490
 
305
491
  // Parse config and load plugins
306
492
  const config = parseDataAttributes();
493
+ if (config && config.pluginBase) setPluginBase(config.pluginBase);
307
494
 
308
495
  // Detect Appwrite usage from manifest (non-blocking, just suggests)
309
496
  detectAppwriteFromManifest();
@@ -309,6 +309,15 @@ async function initializeMarkdownPlugin() {
309
309
  // Check if there are any elements with x-markdown already on the page
310
310
  const existingMarkdownElements = document.querySelectorAll('[x-markdown]');
311
311
 
312
+ // Detect whether this page was produced by the prerender. On
313
+ // prerendered pages, x-markdown elements arrive with their content
314
+ // already rendered to HTML — we must NOT hide them on init or the
315
+ // user sees a flash of empty content while the plugin re-fetches.
316
+ const isPrerenderedPage = !!(
317
+ document.querySelector('meta[name="manifest:prerendered"]') &&
318
+ document.querySelector('meta[name="manifest:prerendered"]').getAttribute('content') !== '0'
319
+ );
320
+
312
321
  // Register markdown directive
313
322
  Alpine.directive('markdown', (el, { expression, modifiers }, { effect, evaluateLater }) => {
314
323
 
@@ -317,14 +326,23 @@ async function initializeMarkdownPlugin() {
317
326
  return;
318
327
  }
319
328
 
320
- // Hide element initially to prevent flicker
321
- el.style.opacity = '0';
322
- el.style.transition = 'opacity 0.15s ease-in-out';
329
+ // Prerender idempotency: if the page is a prerendered MPA and this
330
+ // element already has rendered HTML children, the content was baked
331
+ // at build time and is authoritative for SEO + no-JS users. Skip
332
+ // the initial hide-and-re-render step entirely. We still register
333
+ // the reactive effect below so the content can update if its
334
+ // expression is dynamic and later changes (e.g. via $route).
335
+ const hasBakedContent = isPrerenderedPage && el.innerHTML && el.innerHTML.trim() !== '';
336
+ if (!hasBakedContent) {
337
+ // Hide element initially to prevent flicker (live SPA behaviour)
338
+ el.style.opacity = '0';
339
+ el.style.transition = 'opacity 0.15s ease-in-out';
340
+ }
323
341
 
324
342
  // Store original markdown content
325
343
  let markdownSource = '';
326
344
  let isUpdating = false;
327
- let hasContent = false;
345
+ let hasContent = hasBakedContent;
328
346
 
329
347
  const normalizeContent = (content) => {
330
348
  const lines = content.split('\n');
@@ -428,6 +446,15 @@ async function initializeMarkdownPlugin() {
428
446
  return;
429
447
  }
430
448
 
449
+ // Prerender idempotency: on prerendered MPA pages with baked content,
450
+ // the x-markdown element is already correct — skip the reactive effect
451
+ // entirely. Navigation on MPA is full page loads, so there's no
452
+ // dynamic re-resolution to handle; each route serves its own prerendered
453
+ // HTML with the right baked content.
454
+ if (hasBakedContent) {
455
+ return;
456
+ }
457
+
431
458
  // Handle expressions (file paths, inline strings, content references)
432
459
  // Check if this is a simple string literal that needs to be quoted
433
460
  let processedExpression = expression;
@@ -1 +1 @@
1
- @layer base{*,::backdrop,::file-selector-button,:after,:before{border:0 solid;box-sizing:border-box;margin:0;padding:0}:where(:root){-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;overflow-wrap:break-word;-moz-tab-size:4;-o-tab-size:4;tab-size:4;text-rendering:optimizeLegibility}:host,:where(html){font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal;line-height:1.5;max-width:100vw;overflow-x:hidden;tab-size:4;width:100vw;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent;scroll-behavior:smooth;-ms-overflow-style:none;scrollbar-width:none;&::-webkit-scrollbar{display:none}&:has(dialog:popover-open){overflow:hidden}}:where(body){line-height:inherit;margin:0;max-width:100vw;min-height:100vh}:where(a){color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}:where(abbr[title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}:where([aria-controls]){cursor:pointer}:where([aria-hidden=false][hidden]){display:initial}:where([aria-hidden=false][hidden]:not(:focus)){clip:rect(0,0,0,0);position:absolute}:where(audio:not([controls])){display:none;height:0}:where(b,strong){font-weight:bolder}:where(button,input,optgroup,select,textarea){color:inherit;font-family:inherit;font-feature-settings:inherit;font-size:100%;font-variation-settings:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;margin:0;padding:0}:where(button,select){text-transform:none}:where(button,input:where([type=button],[type=reset],[type=submit]),::file-selector-button){appearance:button;background-color:transparent;background-image:none}:where(::-webkit-file-upload-button){-webkit-appearance:button;font:inherit}:where(::-webkit-inner-spin-button,::-webkit-outer-spin-button){height:auto}:where(::-webkit-search-decoration){-webkit-appearance:none}:where(button,[role=button]){cursor:pointer}:where(code,samp,pre){font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-size:1em;font-variation-settings:normal}:where([dir=rtl]){direction:rtl}:where([disabled],:disabled,[aria-disabled=true],.disabled){cursor:default;opacity:.5;pointer-events:none}:where(figcaption){font-size:75%}:where(figure){display:block;padding:0}:where(::file-selector-button){margin-inline-end:4px}:where(h1,h2,h3,h4,h5,h6){font-size:inherit;font-weight:inherit}:where(hr){background-color:var(--color-line,oklch(48.3% .006422 17.4/.15));border:0;color:inherit;height:1px}:where(img,svg,video,canvas,audio,iframe,embed,object){display:block}:where(img,video){height:auto;max-width:100%}:where(::-webkit-autofill,:-webkit-autofill:focus){transition:background-color 0s 600000s,color 0s 600000s}:where(::-webkit-date-and-time-value){min-height:1lh;text-align:inherit}:where(::-webkit-datetime-edit){display:inline-flex}:where(::-webkit-datetime-edit-fields-wrapper){padding:0}:where(::-webkit-datetime-edit,::-webkit-datetime-edit-year-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-meridiem-field){padding-block:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}:where(small){font-size:80%}:where(span){color:inherit}:where(sub,sup){font-size:50%;line-height:0;position:relative;vertical-align:baseline}:where(sub){bottom:-.25em}:where(sup){top:-.5em}:where(svg):not([fill]){fill:currentColor}:where(svg):not(:root){overflow:hidden}:where(table){border-collapse:collapse;border-color:inherit;text-indent:0}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}:where(::placeholder){color:#9ca3af;opacity:1}@supports (not (-webkit-appearance:-apple-pay-button)) or (contain-intrinsic-size:1px){:where(::placeholder){color:color-mix(in oklab,currentcolor 50%,transparent)}}:where([popover]){display:none;transition:opacity .15s ease-in,scale .15s ease-in,display .15s ease-in;transition-behavior:allow-discrete;&:popover-open{display:flex}@starting-style{opacity:0;scale:.9}&:not(:popover-open){display:none!important;opacity:0;scale:1;transition-duration:.15s;transition-timing-function:ease-out}}:where(progress){vertical-align:baseline}:where([type=search]){-webkit-appearance:textfield;appearance:textfield;outline-offset:-2px}:where(summary){display:list-item}:where(textarea){resize:vertical}[hidden],[un-cloak],[v-cloak],[x-cloak]{display:none}@media (-webkit-min-device-pixel-ratio:2){:where(html){-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}}@media (prefers-reduced-motion:reduce){:not([aria-busy=true]),:not([aria-busy=true]):after,:not([aria-busy=true]):before{animation-delay:-1ms!important;animation-duration:1ms!important;animation-iteration-count:1!important;background-attachment:scroll!important;scroll-behavior:auto!important;transition-delay:0s!important;transition-duration:0s!important}}@media (prefers-reduced-motion:no-preference){[dir=rtl] progress:indeterminate{animation-direction:reverse}}}@layer components{:where(details):not(.unstyle){transition:var(--transition,all .05s ease-in-out);width:100%;&[open]>summary:before{transform:rotate(90deg)}& [open] summary{margin-bottom:calc(var(--spacing, .25rem)*4)}&>:not(summary){padding:var(--spacing-field-padding,.625rem) 0}:where(summary){align-items:center;color:var(--color-content-stark,oklch(16.6% .026 267));cursor:pointer;display:flex;font-weight:700;justify-content:space-between;position:relative;transition:var(--transition,all .05s ease-in-out);user-select:none;&::-webkit-details-marker,&::marker{content:"";display:none}&:hover{color:color-mix(in oklch,var(--color-surface-1,oklch(98.17% .0005 95.87)) 40%,var(--color-content-stark,oklch(16.6% .026 267)))}&:active{color:color-mix(in oklch,var(--color-surface-1,oklch(98.17% .0005 95.87)) 50%,var(--color-content-stark,oklch(16.6% .026 267)))}&:before{background-color:color-mix(in oklch,var(--color-field-surface,oklch(91.79% .0029 264.26)) 50%,var(--color-field-inverse,oklch(16.6% .026 267)));content:"";height:1rem;-webkit-mask-image:var(--icon-accordion,url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' viewBox='0 0 256 256'%3E%3Cpath d='m184.49 136.49-80 80a12 12 0 0 1-17-17L159 128 87.51 56.49a12 12 0 1 1 17-17l80 80a12 12 0 0 1-.02 17'/%3E%3C/svg%3E"));mask-image:var(--icon-accordion,url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' viewBox='0 0 256 256'%3E%3Cpath d='m184.49 136.49-80 80a12 12 0 0 1-17-17L159 128 87.51 56.49a12 12 0 1 1 17-17l80 80a12 12 0 0 1-.02 17'/%3E%3C/svg%3E"));-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%;order:1;transform:rotate(0);transition:transform .25s ease;width:1rem}}}[dir=rtl] :where(details):not(.unstyle){& summary:before{transform:rotate(180deg)}&[open]>summary:before{transform:rotate(90deg)}}}@layer utilities{:where(.avatar){align-items:center;background-clip:content-box;background-color:var(--color-field-surface,oklch(91.79% .0029 264.26));background-position:50%;background-size:cover;border-radius:var(--radius,.5rem);color:var(--color-field-inverse,oklch(16.6% .026 267));display:flex;flex-flow:row wrap;flex-shrink:0;font-weight:700;height:var(--spacing-field-height,2.25rem);justify-content:center;position:relative;text-align:center;text-transform:uppercase;width:var(--spacing-field-height,2.25rem);&[x-icon]{color:var(--color-content-subtle,oklch(67.4% .0318 251.27))}:where(img){border-radius:inherit;height:100%;left:0;object-fit:cover;object-position:center;position:absolute;top:0;transition:var(--transition,all .05s ease-in-out);width:100%}:where(figure){background-color:var(--color-field-surface,oklch(91.79% .0029 264.26));border:1px solid var(--color-page,oklch(100% 0 0));border-radius:50%;bottom:-3px;height:9px;position:absolute;right:-3px;width:9px;z-index:1}}:where(button.avatar,label.avatar){background-blend-mode:normal;padding:0;&:hover{background-blend-mode:multiply;background-color:var(--color-field-surface-hover,oklch(89.24% .0024 12.48));& img{filter:brightness(.9)}}}:where(.avatar-wide){align-items:center;display:flex;flex-flow:row;gap:1.5ch;justify-content:start;max-width:100%;overflow:hidden;width:100%;& span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}:where(button.avatar-wide){height:fit-content;padding:var(--spacing,.25rem);padding-inline-end:1.5ch;&:hover .avatar{background-color:var(--color-field-surface-hover,oklch(89.24% .0024 12.48));transition:var(--transition,all .05s ease-in-out)}}:where([role=group]:has(.avatar,button.avatar)){align-items:center;display:flex;flex-flow:row nowrap;:where(.avatar){box-shadow:0 0 0 3px var(--color-page,oklch(100% 0 0));margin-inline-end:calc(var(--spacing-field-height, 2.25rem)*-.3)}}}@layer components{:where(button:not(.link),[role=button],[type=button],[type=reset],[type=submit],select):not(.unstyle){align-items:center;appearance:button;background-color:var(--color-field-surface,oklch(91.79% .0029 264.26));border:0 solid transparent;border-radius:var(--radius,.5rem);color:var(--color-field-inverse,oklch(16.6% .026 267));cursor:pointer;display:inline-flex;flex-flow:row;gap:.375rem;height:var(--spacing-field-height,2.25rem);justify-content:center;margin:0;max-width:100%;min-width:var(--spacing-field-height,2.25rem);outline-color:var(--color-line,oklch(48.3% .006422 17.4/.15));overflow:hidden;padding:0 var(--spacing-field-padding,.625rem);text-overflow:ellipsis;transition:var(--transition,all .05s ease-in-out);white-space:nowrap;width:fit-content;& [x-icon],& span{color:inherit}& span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}&:has(>svg:only-child){font-size:1rem;padding:0}& svg{margin-left:auto;margin-right:auto}&:active,&:hover{background-color:var(--color-field-surface-hover,oklch(89.24% .0024 12.48))}&:focus-visible{background-color:var(--color-field-surface,oklch(91.79% .0029 264.26))}}:where(select):not(.unstyle){appearance:base-select;&::picker-icon{content:"⌄";font-size:20px;height:calc(var(--spacing-field-height, 2.25rem)*.5);line-height:.4;transform:scaleY(.7)}}}@layer components{input[type=checkbox]:not([role=switch],.unstyle){border-radius:.4rem;cursor:pointer;height:calc(var(--spacing-field-height, 2.25rem)*.6);max-width:calc(var(--spacing-field-height, 2.25rem)*.6);min-width:calc(var(--spacing-field-height, 2.25rem)*.6);padding:0;position:relative;width:calc(var(--spacing-field-height, 2.25rem)*.6);&:checked{&:active,&:hover{background-color:var(--color-field-surface-hover,oklch(89.24% .0024 12.48));border-color:var(--color-field-surface-hover,oklch(89.24% .0024 12.48))}}&:after{background-color:var(--color-field-inverse,oklch(16.6% .026 267));content:"";height:60%;left:50%;-webkit-mask-image:var(--icon-checkbox,url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='currentColor' d='m0 11 2-2 5 5L18 3l2 2L7 18z'/%3E%3C/svg%3E"));mask-image:var(--icon-checkbox,url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='currentColor' d='m0 11 2-2 5 5L18 3l2 2L7 18z'/%3E%3C/svg%3E"));-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%;opacity:0;position:absolute;top:50%;transform:translateX(-50%) translateY(-50%) scale(0);transform-origin:center;transition:var(--transition,all .05s ease-in-out);width:60%}&:checked:after{opacity:1;transform:translateX(-50%) translateY(-50%) scale(1)}}}@layer components{:where(dialog[popover],.dialog):not(.unstyle){background-color:var(--color-popover-surface,oklch(100% 0 0));border:0;border-radius:calc(var(--radius, .5rem)*2);box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 8px 10px -6px rgba(0,0,0,.1);color:var(--color-content-stark,oklch(16.6% .026 267));flex-direction:column;left:0;margin:auto;max-height:90vh;max-width:100%;min-height:200px;position:fixed;right:0;width:500px;&::backdrop{background-color:rgba(0,0,0,.2)}& :where(header,main,footer){padding:calc(var(--spacing, .25rem)*4)}& :where(header){align-items:center;display:flex;gap:calc(var(--spacing, .25rem)*4);justify-content:space-between}& :where(main){flex-grow:1}& :where(footer){align-items:center;display:flex;gap:calc(var(--spacing, .25rem)*2);justify-content:end;margin-top:auto}@media screen and (max-width:768px){margin-bottom:auto!important;margin-left:auto!important;margin-right:auto!important;margin-top:auto!important;max-height:calc(100vh - var(--spacing, .25rem)*4 - var(--spacing, .25rem)*4)!important;width:calc(100vw - var(--spacing, .25rem)*4 - var(--spacing, .25rem)*4)!important}}:where(.dialog){height:fit-content;inset:0;z-index:10}.dark :where(dialog)::backdrop{background-color:rgba(0,0,0,.35)}html:has(dialog:popover-open){& menu[popover]:not(dialog *){opacity:0;pointer-events:none;scale:.9;transition:opacity .15s ease-out,scale .15s ease-out;&:popover-open{display:flex!important}}}html:has(dialog:popover-open~dialog:popover-open){& dialog:popover-open:not(:last-of-type) menu[popover]{opacity:0;pointer-events:none;scale:.9;transition:opacity .15s ease-out,scale .15s ease-out;&:popover-open{display:flex!important}}}}@layer utilities{:where(.divider){align-items:center;color:var(--color-content-neutral,oklch(48.26% .0365 255.09));display:flex;flex-flow:row nowrap;font-size:.875rem;height:1px;justify-content:center;margin:var(--spacing-field-padding,.625rem) 0;white-space:nowrap;width:100%;&:after,&:before{background-color:var(--color-line,oklch(48.3% .006422 17.4/.15));content:"";display:inline-flex;flex:1;height:1px;width:auto}&:not(:empty){gap:var(--spacing-field-padding,.625rem)}}:where(.divider.start){justify-content:flex-start;&:before{display:none}}:where(.divider.end){justify-content:flex-end;&:after{display:none}}.divider.vertical{align-self:stretch;flex-flow:column nowrap;height:auto;margin:0 var(--spacing-field-padding,.625rem);min-height:100%;min-width:1px;width:fit-content;&:after,&:before{content:"";height:auto;min-height:1px;width:1px}& [x-icon]{flex-shrink:0;font-size:.875rem;min-height:.875rem}}}@layer components{:where(menu[popover]):not(.unstyle){background:var(--color-popover-surface,oklch(100% 0 0));border:0;border-radius:var(--radius,.5rem);box-shadow:0 0 0 1px hsla(0,0%,6%,.05),0 3px 6px hsla(0,0%,6%,.1),0 9px 24px hsla(0,0%,6%,.2);flex-flow:column nowrap;gap:0;height:fit-content;inset:auto;list-style:none;margin:var(--spacing-popover-offset,.5rem) 0;max-height:90vh;min-width:160px;overflow-x:hidden;padding:.25rem;position-area:end span-end;position-try-fallbacks:flip-inline,flip-block,flip-start;transform-origin:top center;width:fit-content;z-index:50;& :where(li,a,button,label){align-items:center;background-color:transparent;border-radius:6px;color:var(--color-content-stark,oklch(16.6% .026 267));cursor:pointer;display:inline-flex;font-weight:400;justify-content:start;max-width:100%;min-height:2rem;overflow:hidden;padding-inline-end:.5rem;padding-inline-start:.5rem;text-align:start;text-decoration:none;text-overflow:ellipsis;user-select:none;white-space:nowrap;width:100%;&:hover{text-decoration:inherit}&:active,&:hover{background-color:var(--color-field-surface,oklch(91.79% .0029 264.26));color:var(--color-field-inverse,oklch(16.6% .026 267))}& [x-icon],& span{color:inherit}& [x-icon]:first-child:not(:only-child){margin-inline-end:.375rem}}& small{color:var(--color-content-neutral,oklch(48.26% .0365 255.09));padding:.25rem .5rem}& hr{background-color:var(--color-line,oklch(48.3% .006422 17.4/.15));flex-shrink:0;margin-inline-start:-.25rem;margin-bottom:.25rem;margin-top:.25rem;width:calc(100% + .5rem)}& label{cursor:default;padding-inline-end:.5rem;padding-inline-start:.5rem;&:hover{background-color:transparent}&:has(input[role=switch]){justify-content:space-between}}& :where(input,textarea){flex-shrink:0;&:not(:first-child){margin-top:var(--spacing,.25rem)}}& span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}:where(.dark menu[popover]) :where(li,a,button,label):hover{background-color:var(--color-field-surface-hover,oklch(89.24% .0024 12.48))}:where(menu menu):not(.unstyle){margin:0 var(--spacing-popover-offset,.5rem);position-area:span-end end}:where(menu.center){position-area:center}:where(menu.top){margin:var(--spacing-popover-offset,.5rem) 0;position-area:top}:where(menu.bottom){margin:var(--spacing-popover-offset,.5rem) 0;position-area:bottom}:where(menu.start){margin:0 var(--spacing-popover-offset,.5rem);position-area:center start}:where(menu.end){margin:0 var(--spacing-popover-offset,.5rem);position-area:center end}:where(menu.top-start){margin:var(--spacing-popover-offset,.5rem) 0;position-area:start span-end}:where(menu.top-end){margin:var(--spacing-popover-offset,.5rem) 0;position-area:start span-start}:where(menu.bottom-start){margin:var(--spacing-popover-offset,.5rem) 0;position-area:end span-end}:where(menu.bottom-end){margin:var(--spacing-popover-offset,.5rem) 0;position-area:end span-start}:where(menu.start-top){margin:0 var(--spacing-popover-offset,.5rem);position-area:span-end start}:where(menu.start-bottom){margin:0 var(--spacing-popover-offset,.5rem);position-area:span-start start}:where(menu.end-top){margin:0 var(--spacing-popover-offset,.5rem);position-area:span-end end}:where(menu.end-bottom){margin:0 var(--spacing-popover-offset,.5rem);position-area:span-start end}:where(menu.top-start-corner,menu.start-top-corner){margin:var(--spacing-popover-offset,.5rem);position-area:start start}:where(menu.top-end-corner,menu.end-top-corner){margin:var(--spacing-popover-offset,.5rem);position-area:start end}:where(menu.bottom-start-corner,menu.start-bottom-corner){margin:var(--spacing-popover-offset,.5rem);position-area:end start}:where(menu.bottom-end-corner,menu.end-bottom-corner){margin:var(--spacing-popover-offset,.5rem);position-area:end end}@media (pointer:coarse){menu[popover]:not(.unstyle){bottom:1rem;left:1rem;margin:0;position:fixed;position-area:none;top:auto;width:calc(100% - 2rem);& :where(li,a,button,label) [x-icon]:first-child:not(:only-child){margin-inline-end:.8125rem}}}}@layer components{:where([role=group]:has(button,input,select)):not(.unstyle){align-items:center;display:flex;flex-flow:row nowrap;gap:0;max-width:100%;width:fit-content;&>*{flex-basis:auto;flex-shrink:0;&:focus{z-index:1}}&>:first-child{border-end-end-radius:0;border-start-end-radius:0}&>:not(:first-child):not(:last-child){border-radius:0}&>:last-child{border-end-start-radius:0;border-start-start-radius:0}&.even>*{flex-shrink:1;width:100%}& input{width:fit-content}}:where(form):not(.unstyle){display:flex;flex-direction:column;gap:calc(var(--spacing)*4);width:100%}:where(fieldset):not(.unstyle){display:flex;flex-direction:column;gap:.375ch calc(var(--spacing)*2);width:100%;&:has([type=radio],[type=checkbox]){gap:calc(var(--spacing)*2)}}:where(fieldset:has(legend)):not(.unstyle){border-color:var(--color-line,oklch(48.3% .006422 17.4/.15));border-radius:var(--radius,.5rem);border-style:solid;border-width:1px;padding:1ch 1.5ch 1.5ch;& :where(legend){color:var(--color-content-subtle,oklch(67.4% .0318 251.27));font-size:.875rem;padding:0 1.5ch}}:where(label,.label):has([type=radio],[type=checkbox]):not(.unstyle){align-items:center;cursor:pointer;display:flex;flex-flow:row;gap:1ch;outline:0 none;&:focus-within{box-shadow:0 0 0 0}}:where(label:not(:has(.label)),.label):has(button,[role=button],[type=button],[type=submit],select,input:not([role=button],[type=checkbox],[type=radio],[type=file],[type=search]),textarea):not(:has(data)):not(.unstyle){cursor:pointer;display:flex;flex-direction:column;gap:.2ch;text-indent:calc(var(--radius)/2);width:100%;:where(*){text-indent:0}:where(span:first-of-type){padding-inline-start:calc(var(--radius)/2)}:where(button,[role=button],[type=button],[type=submit],select,input:not([role=button],[type=checkbox],[type=radio],[type=file],[type=search]),textarea){max-width:100%;width:100%}:has([type=search],[type=file]) :where([type=search],[type=file]){margin-top:.2ch}}label:has(data):not(.unstyle){align-items:center;display:flex;flex-direction:row;gap:1rem;justify-content:space-between;width:100%;&:focus-within{box-shadow:0 0 0 0}& :where(.label,button,input:not([type=checkbox],[type=radio]),select,textarea){max-width:50%;width:calc(var(--spacing-field-height)*8)}& .label:focus-within{box-shadow:0 0 0 2px color-mix(in oklch,var(--color-content-stark) 35%,transparent)}&:has(textarea){align-items:start;:where(data){padding-top:calc(var(--spacing))}}}label:has(.label):not(.unstyle){background-color:transparent;cursor:default;justify-content:space-between;:where([type=search]){max-width:100%;width:100%}}}@layer components{:where(input:not([type=range]),textarea,label:has([type=search],[type=file]),.label:has([type=search],[type=file])):not(.unstyle){appearance:none;background-color:var(--color-field-surface,oklch(91.79% .0029 264.26));border:0 solid transparent;border-radius:var(--radius,.5rem);color:var(--color-field-inverse,oklch(16.6% .026 267));cursor:text;max-width:100%;transition:var(--transition,all .05s ease-in-out);width:100%;&:active,&:hover{background-color:var(--color-field-surface-hover,oklch(89.24% .0024 12.48))}&:focus-visible{background-color:var(--color-field-surface,oklch(91.79% .0029 264.26))}&::placeholder{color:color-mix(in oklch,var(--color-field-inverse,oklch(16.6% .026 267)) 65%,transparent)}&::selection{background-color:color-mix(in oklch,var(--color-field-surface,oklch(91.79% .0029 264.26)) 80%,var(--color-field-inverse,oklch(16.6% .026 267)))}&[type=file]{left:0;max-height:0;max-width:0;opacity:0;overflow:hidden;position:absolute;top:0;z-index:-1}}:where(input:not([type=range]):not(.unstyle)){height:var(--spacing-field-height,2.25rem);padding-left:var(--spacing-field-padding,.625rem);padding-right:var(--spacing-field-padding,.625rem)}:where(label,.label):has([type=search],[type=file]):not(.unstyle){align-items:center;display:flex;flex-flow:row;padding-inline-start:0;& :where(input){background:transparent;padding-inline-end:0;padding-inline-start:0;&:focus-visible,&:hover{background:transparent}&:focus-visible{box-shadow:0 0 0 0 transparent}}&:has(input+*){padding-inline-end:.375rem}&:has(input[type=file]+[x-icon]){padding-inline-end:0}}:where(label,.label):has([type=file]):not(.unstyle){cursor:pointer;gap:var(--spacing,.5rem);height:var(--spacing-field-height,2.25rem);justify-content:center}:where(label,.label):has([type=search]):not(.unstyle){justify-content:start;& [x-icon]{align-items:center;color:var(--color-content-subtle,oklch(67.4% .0318 251.27));display:flex;height:100%;justify-content:center;margin-inline-end:0;width:var(--spacing-field-height,2.25rem)}}:where(input[type=search]):not(.unstyle)::-webkit-search-cancel-button{appearance:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}:where(textarea):not(.unstyle){display:block;height:auto;padding:var(--spacing-field-padding,.625rem) calc(var(--spacing-field-padding, .625rem)*1.3)}}:root{--presence-focus-outline-width:2px;--presence-focus-outline-style:dashed;--presence-focus-outline-offset:2px;--presence-focus-opacity:0.6;--presence-focus-color:#3b82f6;--presence-caret-width:2px;--presence-caret-height:1.2em;--presence-caret-color:#3b82f6;--presence-caret-z-index:1000;--presence-caret-blink-duration:1s;--presence-caret-opacity-high:1;--presence-caret-opacity-low:0.3;--presence-selection-color:#3b82f6;--presence-selection-opacity:0.2;--presence-selection-z-index:999;--presence-cursor-size:8px;--presence-cursor-border-width:2px;--presence-cursor-z-index:1001;--presence-throttle:300ms;--presence-cleanup-interval:30000ms;--presence-min-change-threshold:5px;--presence-idle-threshold:5000ms}@layer elements{:where(.presence-focused){opacity:var(--presence-focus-opacity);outline:var(--presence-focus-outline-width) var(--presence-focus-outline-style) var(--presence-focus-color);outline-offset:var(--presence-focus-outline-offset)}:where(.presence-focused[data-presence-focus-color]){--presence-focus-color:attr(data-presence-focus-color);outline-color:var(--presence-focus-color)}:where(.presence-caret){animation:presence-caret-blink var(--presence-caret-blink-duration) infinite;background-color:var(--presence-caret-color);height:var(--presence-caret-height);pointer-events:none;position:absolute;width:var(--presence-caret-width);z-index:var(--presence-caret-z-index)}:where(.presence-caret[data-presence-caret-color]),[data-presence-caret-color] .presence-caret{--presence-caret-color:attr(data-presence-caret-color)}@keyframes presence-caret-blink{0%,50%{opacity:var(--presence-caret-opacity-high)}51%,to{opacity:var(--presence-caret-opacity-low)}}:where(.presence-selection){background-color:var(--presence-selection-color);opacity:var(--presence-selection-opacity);pointer-events:none;position:absolute;z-index:var(--presence-selection-z-index)}:where(.presence-selection){background-color:var(--presence-selection-color)}:where(.presence-cursor){background-color:var(--presence-cursor-color,var(--presence-focus-color));border:var(--presence-cursor-border-width) solid var(--presence-cursor-color,var(--presence-focus-color));border-radius:50%;height:var(--presence-cursor-size);pointer-events:none;position:absolute;transform:translate(-50%,-50%);width:var(--presence-cursor-size);z-index:var(--presence-cursor-z-index)}:where(.presence-cursor-label){background-color:var(--presence-cursor-color,var(--presence-focus-color));border-radius:4px;color:#fff;font-size:12px;left:50%;padding:2px 6px;pointer-events:none;position:absolute;top:calc(var(--presence-cursor-size) + 4px);transform:translateX(-50%);white-space:nowrap;z-index:calc(var(--presence-cursor-z-index) + 1)}:where([data-presence-caret-user],[data-presence-selection-user],[data-presence-focus-user]){position:relative}}@layer components{input[type=radio]:not(.unstyle){border-radius:50%;cursor:pointer;height:calc(var(--spacing-field-height, 2.25rem)*.625);min-width:calc(var(--spacing-field-height, 2.25rem)*.625);padding:5px;position:relative;width:calc(var(--spacing-field-height, 2.25rem)*.625);&:after{background-color:var(--color-field-inverse,oklch(16.6% .026 267));border-radius:50%;content:"";height:60%;left:50%;opacity:0;position:absolute;top:50%;transform:translateX(-50%) translateY(-50%) scale(0);transform-origin:center;transition:var(--transition,all .05s ease-in-out);width:60%}&:checked:after{opacity:1;transform:translateX(-50%) translateY(-50%) scale(1)}}}@layer components{input[type=range]:not(.unstyle){appearance:none;background-color:transparent;border-radius:var(--radius,.5rem);cursor:default;&::-webkit-slider-runnable-track{background-color:var(--color-field-surface,oklch(91.79% .0029 264.26));border-radius:var(--radius,.5rem);cursor:pointer;height:calc(var(--spacing, .25rem)*2);transition:var(--transition)}&:hover::-webkit-slider-runnable-track{background-color:var(--color-field-surface-hover,oklch(89.24% .0024 12.48))}&::-webkit-slider-thumb{appearance:none;background-color:color-mix(in oklch,var(--color-field-surface,oklch(91.79% .0029 264.26)) 60%,var(--color-field-inverse,oklch(16.6% .026 267)));border-radius:200px;box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1);cursor:pointer;height:calc(var(--spacing-field-height, 2.25rem)*.5);position:relative;top:50%;transform:translateY(-50%);transition:var(--transition);width:calc(var(--spacing-field-height, 2.25rem)*.5)}&::-webkit-slider-thumb:hover{background-color:color-mix(in oklch,var(--color-field-surface,oklch(91.79% .0029 264.26)) 30%,var(--color-field-inverse,oklch(16.6% .026 267)))}}:where(datalist):not(.unstyle){display:flex;flex-flow:row nowrap;justify-content:space-between;max-width:100%;width:100%;& option{color:var(--color-content-neutral,oklch(48.26% .0365 255.09));font-size:.875rem;text-align:center;width:2ch}}label:has(input[type=range]):not(.unstyle){cursor:default}}@layer utilities{:where([x-resize]){position:relative;.resize-handle{background:transparent;border:none;display:block;height:var(--spacing-resize-handle,1rem);outline:none;position:absolute;width:var(--spacing-resize-handle,1rem);z-index:100;&:before{background:transparent;content:"";height:1px;left:50%;pointer-events:none;position:absolute;top:50%;transform:translate(-50%,-50%);transition:background-color .2s ease;width:1px}&:active:before,&:hover:before{background-color:var(--color-line,oklch(48.3% .006422 17.4/.15))}}.resize-handle-bottom,.resize-handle-top{cursor:ns-resize;left:0;width:100%;&:before{width:100%}}.resize-handle-end,.resize-handle-left,.resize-handle-right,.resize-handle-start{cursor:ew-resize;height:100%;top:0;&:before{height:100%}}.resize-handle-top{top:calc(var(--spacing-resize-handle, 1rem)*-.5)}.resize-handle-bottom{bottom:calc(var(--spacing-resize-handle, 1rem)*-.5);top:auto}.resize-handle-left,.resize-handle-start{left:calc(var(--spacing-resize-handle, 1rem)*-.5)}.resize-handle-end,.resize-handle-right{right:calc(var(--spacing-resize-handle, 1rem)*-.5)}.resize-handle-top-left{cursor:nw-resize;left:calc(var(--spacing-resize-handle, 1rem)*-.5)}.resize-handle-top-left,.resize-handle-top-right{height:var(--spacing-resize-handle,1rem);top:calc(var(--spacing-resize-handle, 1rem)*-.5);width:var(--spacing-resize-handle,1rem)}.resize-handle-top-right{cursor:ne-resize;right:calc(var(--spacing-resize-handle, 1rem)*-.5)}.resize-handle-bottom-left{cursor:sw-resize;left:calc(var(--spacing-resize-handle, 1rem)*-.5)}.resize-handle-bottom-left,.resize-handle-bottom-right{bottom:calc(var(--spacing-resize-handle, 1rem)*-.5);height:var(--spacing-resize-handle,1rem);width:var(--spacing-resize-handle,1rem)}.resize-handle-bottom-right{cursor:se-resize;right:calc(var(--spacing-resize-handle, 1rem)*-.5)}.resize-handle-top-start{cursor:nw-resize;left:calc(var(--spacing-resize-handle, 1rem)*-.5)}.resize-handle-top-end,.resize-handle-top-start{height:var(--spacing-resize-handle,1rem);top:calc(var(--spacing-resize-handle, 1rem)*-.5);width:var(--spacing-resize-handle,1rem)}.resize-handle-top-end{cursor:ne-resize;right:calc(var(--spacing-resize-handle, 1rem)*-.5)}.resize-handle-bottom-start{cursor:sw-resize;left:calc(var(--spacing-resize-handle, 1rem)*-.5)}.resize-handle-bottom-end,.resize-handle-bottom-start{bottom:calc(var(--spacing-resize-handle, 1rem)*-.5);height:var(--spacing-resize-handle,1rem);width:var(--spacing-resize-handle,1rem)}.resize-handle-bottom-end{cursor:se-resize;right:calc(var(--spacing-resize-handle, 1rem)*-.5)}.resize-overlay{background:transparent;display:none;height:100vh;left:0;position:fixed;top:0;width:100vw;z-index:9999}.resizable-closing{opacity:.5;transition:opacity .2s ease}.resizable-closed{display:none!important}.resize-handle:focus{outline:2px solid rgba(59,130,246,.5);outline-offset:2px}@media (prefers-contrast:high){:where(.resize-handle:hover .resize-handle-inner){background:rgba(0,0,0,.3)}:where(.resize-handle:active .resize-handle-inner){background:rgba(0,0,0,.5)}}@media (prefers-reduced-motion:reduce){:where(.resize-handle-inner,.resizable-closing,.resize-handle){transition:none}}}[dir=rtl] :where([x-resize]) .resize-handle-start{left:auto;right:calc(var(--spacing-resize-handle, 1rem)*-.5)}[dir=rtl] :where([x-resize]) .resize-handle-end{left:calc(var(--spacing-resize-handle, 1rem)*-.5);right:auto}[dir=rtl] :where([x-resize]) .resize-handle-top-start{cursor:ne-resize;left:auto;right:calc(var(--spacing-resize-handle, 1rem)*-.5)}[dir=rtl] :where([x-resize]) .resize-handle-top-end{cursor:nw-resize;left:calc(var(--spacing-resize-handle, 1rem)*-.5);right:auto}[dir=rtl] :where([x-resize]) .resize-handle-bottom-start{cursor:se-resize;left:auto;right:calc(var(--spacing-resize-handle, 1rem)*-.5)}[dir=rtl] :where([x-resize]) .resize-handle-bottom-end{cursor:sw-resize;left:calc(var(--spacing-resize-handle, 1rem)*-.5);right:auto}}@layer components{:where(aside[popover]){background-color:var(--color-popover-surface,oklch(100% 0 0));height:100%;inset-inline-end:0;inset-inline-start:auto;max-width:80vw;max-width:100%;min-width:20vw;overflow-y:auto;transition:opacity .15s ease-in,transform .15s ease-in,display .15s ease-in;transition-behavior:allow-discrete;width:fit-content;z-index:200;@starting-style{opacity:1;scale:1;transform:translateX(100%)}&:not(:popover-open){opacity:1;scale:1;transform:translateX(100%)}[dir=rtl] &{@starting-style{transform:translateX(-100%)}&:not(:popover-open){transform:translateX(-100%)}}}:where(aside[popover].appear-start){inset-inline-end:auto;inset-inline-start:0;@starting-style{transform:translateX(-100%)}&:not(:popover-open){transform:translateX(-100%)}[dir=rtl] &{@starting-style{transform:translateX(100%)}&:not(:popover-open){transform:translateX(100%)}}}.dark :where(aside[popover]){background-color:var(--color-surface-1,oklch(98.17% .0005 95.87))}}@layer components{[x-carousel]{display:flex;flex-direction:column;overflow:hidden;position:relative;width:100%;.carousel-slides{aspect-ratio:16/9;display:flex;transition:transform .3s ease-in-out;width:100%}& button[\@click="next()"],& button[\@click="prev()"]{background-color:oklch(100% 0 0/.15);position:absolute;top:50%;transform:translateY(-50%);&:hover{background-color:oklch(100% 0 0/.3)}}& button[\@click="prev()"]{left:calc(var(--spacing)*4)}& button[\@click="next()"]{left:auto;right:calc(var(--spacing)*4)}.carousel-dots{bottom:calc(var(--spacing)*4);display:flex;gap:calc(var(--spacing)*2);left:50%;max-width:100%;overflow-x:auto;padding:0 calc(var(--spacing)*4);position:absolute;transform:translateX(-50%);-webkit-overflow-scrolling:touch;scrollbar-width:none;&::-webkit-scrollbar{display:none}& span{background-color:oklch(100% 0 0/.15);border-radius:50%;cursor:pointer;flex-shrink:0;height:.625rem;transition:background-color .3s ease-in-out;width:.625rem;&:hover{background-color:oklch(100% 0 0/.3)}&.active{background-color:#fff}}}}}@layer components{:where(input[role=switch]):not(.unstyle){border-radius:calc(var(--spacing-field-height, 2.25rem)*.65);box-sizing:content-box;cursor:pointer;height:calc(var(--spacing-field-height, 2.25rem)*.65);min-width:calc(var(--spacing-field-height, 2.25rem)*.65*2);padding:0;position:relative;width:calc(var(--spacing-field-height, 2.25rem)*.65*2);&:before{background-color:color-mix(in oklch,var(--color-field-surface,oklch(91.79% .0029 264.26)) 60%,var(--color-field-inverse,oklch(16.6% .026 267)));border-radius:50%;box-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);content:"";height:calc(var(--spacing-field-height, 2.25rem)*.65 - .25rem);left:.125rem;position:absolute;top:.125rem;transition:var(--transition,all .05s ease-in-out);width:calc(var(--spacing-field-height, 2.25rem)*.65 - .25rem)}&:checked{background-color:var(--color-field-surface,oklch(91.79% .0029 264.26));&:before{background-color:var(--color-field-inverse,oklch(16.6% .026 267));left:calc(100% - var(--spacing-field-height, 2.25rem)*.65 + .125rem)}&:hover{background-color:var(--color-field-surface-hover,oklch(89.24% .0024 12.48))}}}}@layer components{:where(table,.grid-table):not(.unstyle){border-radius:var(--radius,.5rem);border-spacing:0;max-width:100%;overflow:hidden;table-layout:auto;width:100%;:where(.grid-header,.grid-row,.grid-footer){display:contents}:where(thead,.grid-header>*){background-color:var(--color-surface-1,oklch(98.17% .0005 95.87));border-bottom:1px solid var(--color-line,oklch(48.3% .006422 17.4/.15))}:where(th,.grid-header>*){font-weight:700}:where(tr,.grid-row>*){border-bottom:1px solid var(--color-line,oklch(48.3% .006422 17.4/.15))}:where(td,th,.grid-header>*,.grid-row>*,.grid-footer>*){font-size:.875rem;overflow:hidden;padding:calc(var(--spacing, .25rem)*2.5) calc(var(--spacing, .25rem)*4);text-align:left;text-align:start;&>:not(template){display:inline-flex;vertical-align:middle;&:not(:last-child){margin-right:4px}}}:where(:not(:has(tfoot)) tbody tr:last-child,tfoot tr:last-child,.grid-footer>*){border-bottom:0}&.striped{:where(tr:nth-child(2n),.grid-row:nth-child(2n)){background-color:var(--color-surface-1,oklch(98.17% .0005 95.87))}:where(tr:nth-child(odd),.grid-row:nth-child(odd)){background-color:transparent}:where(tr,.grid-row){border-bottom:0}}}}@layer utilities{:where(.toast-container){align-items:center;bottom:3vw;display:flex;flex-direction:column-reverse;gap:calc(var(--spacing, .25rem)*2);left:50%;position:fixed;transform:translateX(-50%);z-index:100}:where(.toast){background-color:var(--color-popover-surface,oklch(100% 0 0));border:1px solid var(--color-line,oklch(48.3% .006422 17.4/.15));border-radius:calc(var(--radius, .5rem)*2);box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 8px 10px -6px rgba(0,0,0,.1);display:flex;max-width:90vw;opacity:0;overflow:hidden;transform:translateY(1rem);transition:opacity .2s ease-out,transform .2s ease-out,height .2s ease-out,margin .2s ease-out,padding .2s ease-out;:where(.toast-content){align-items:center;color:inherit;display:flex;padding:.375rem .75rem;white-space:pre-wrap;:where([x-icon]:first-child){margin-right:1ch}}:where(.toast-dismiss-button){border-inline-start:1px solid color-mix(in oklch,var(--color-content-stark,oklch(16.6% .026 267)) 20%,transparent);border-radius:0;position:relative;&:after{background-color:var(--color-field-inverse,oklch(16.6% .026 267));content:"";height:50%;left:50%;mask-image:var(--icon-toast-dismiss,url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E"));mask-repeat:no-repeat;mask-size:100% 100%;position:absolute;top:50%;transform:translateX(-50%) translateY(-50%);transform-origin:center;width:50%}}}:where(.toast.brand,.toast.accent,.toast.positive,.toast.negative){background-color:var(--color-field-surface,oklch(91.79% .0029 264.26));color:var(--color-field-inverse,oklch(16.6% .026 267));:where(.toast-dismiss-button){border-inline-start:1px solid color-mix(in oklch,var(--color-field-inverse,oklch(16.6% .026 267)) 20%,transparent)}}:where(.toast-entry){opacity:1;transform:translateY(0)}:where(.toast-exit){opacity:0;transform:translateY(1rem)}}@layer utilities{:where(.tooltip[popover]){background-color:var(--color-content-stark,oklch(16.6% .026 267));border:0;border-radius:var(--radius,.5rem);box-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);color:var(--color-page,oklch(100% 0 0));display:block;font-size:.875rem;inset:auto;margin:var(--spacing-popover-offset,.5rem) 0;max-width:200px;padding:calc(var(--spacing, .25rem)*.5) calc(var(--spacing, .25rem)*2);position:absolute;position-area:bottom;position-try-fallbacks:flip-inline,flip-block,flip-start;width:fit-content;&:hover{transition-delay:var(--tooltip-hover-delay,1s)}& [x-icon]:first-child{margin-inline-end:.25rem}}:where(.tooltip.top){margin:var(--spacing-popover-offset,.5rem) 0;position-area:top}:where(.tooltip.bottom){margin:var(--spacing-popover-offset,.5rem) 0;position-area:bottom}:where(.tooltip.start){margin:0 var(--spacing-popover-offset,.5rem);position-area:center start}:where(.tooltip.end){margin:0 var(--spacing-popover-offset,.5rem);position-area:center end}:where(.tooltip.top-start){margin:var(--spacing-popover-offset,.5rem) 0;position-area:start span-end}:where(.tooltip.top-end){margin:var(--spacing-popover-offset,.5rem) 0;position-area:start span-start}:where(.tooltip.bottom-start){margin:var(--spacing-popover-offset,.5rem) 0;position-area:end span-end}:where(.tooltip.bottom-end){margin:var(--spacing-popover-offset,.5rem) 0;position-area:end span-start}:where(.tooltip.start-top){margin:0 var(--spacing-popover-offset,.5rem);position-area:span-end start}:where(.tooltip.start-bottom){margin:0 var(--spacing-popover-offset,.5rem);position-area:span-start start}:where(.tooltip.end-top){margin:0 var(--spacing-popover-offset,.5rem);position-area:span-end end}:where(.tooltip.end-bottom){margin:0 var(--spacing-popover-offset,.5rem);position-area:span-start end}:where(.tooltip.top-start-corner,.tooltip.start-top-corner){margin:var(--spacing-popover-offset,.5rem);position-area:start start}:where(.tooltip.top-end-corner,.tooltip.end-top-corner){margin:var(--spacing-popover-offset,.5rem);position-area:start end}:where(.tooltip.bottom-start-corner,.tooltip.start-bottom-corner){margin:var(--spacing-popover-offset,.5rem);position-area:end start}:where(.tooltip.bottom-end-corner,.tooltip.end-bottom-corner){margin:var(--spacing-popover-offset,.5rem);position-area:end end}}@layer base{.caption,.h1,.h2,.h3,.h4,.h5,.h6,.label,.paragraph,.small,:where(a,abbr,address,blockquote,code,del,figcaption,h1,h2,h3,h4,h5,h6,ins,label:not(.avatar,:has([type=file],[type=search])),legend,p,small,cite,q):not(.unstyle){color:var(--color-content-stark);&:where(:has([x-icon])){align-items:center;display:inline-flex;& [x-icon]{margin-inline-end:.5ch}}& span{vertical-align:inherit}}.h1,.h2,.h3,.h4,.h5,.h6,:where(h1,h2,h3,h4,h5,h6):not(.unstyle){font-weight:bolder;word-wrap:break-word}.h1,.h2,.h3,.h4,:where(h1,h2,h3,h4):not(.unstyle){font-weight:700}.h1,.h2,.h3,:where(h1,h2,h3):not(.unstyle){letter-spacing:-.025em}.h1,:where(h1):not(.unstyle){font-size:2.25rem;line-height:1.25}.h2,:where(h2):not(.unstyle){font-size:1.5rem}.h3,:where(h3):not(.unstyle){font-size:1.25rem;line-height:1.4}.h4,:where(h4):not(.unstyle){font-size:1rem}.h5,:where(h5):not(.unstyle){color:var(--color-content-neutral,oklch(48.26% .0365 255.09));font-size:.875rem;font-weight:600;line-height:1rem}.h6,:where(h6):not(.unstyle){font-size:.8125rem;font-weight:600;line-height:1.4;text-transform:uppercase}.paragraph,:where(p):not(.unstyle){line-height:1.6}:where(a:not([role=button]),button.link):not(.unstyle){cursor:pointer;text-decoration:underline;text-underline-offset:2px;transition:var(--transition,all .05s ease-in-out);&:active,&:hover{color:var(--color-content-neutral,oklch(48.26% .0365 255.09))}}:where(blockquote):not(.unstyle){border-inline-end:none;border-inline-start:.25rem solid color-mix(in oklch,var(--color-content-stark,oklch(16.6% .026 267)) 25%,transparent);color:var(--color-content-stark,oklch(16.6% .026 267));display:block;margin:calc(var(--spacing, .25rem)*4) 0;max-width:100%;padding:0 calc(var(--spacing, .25rem)*4);width:100%;& *{color:inherit}}:where(code):not(.unstyle){display:inline-block;font-size:82.5%;height:fit-content;padding:.1ch .5ch;width:fit-content;word-wrap:break-word;background-color:color-mix(in oklch,var(--color-content-neutral,oklch(48.26% .0365 255.09)) 10%,transparent);border:1px solid color-mix(in oklch,var(--color-content-subtle,oklch(67.4% .0318 251.27)) 10%,transparent);border-radius:var(--radius,.5rem);color:var(--color-content-neutral,oklch(48.26% .0365 255.09))}.caption,:where(figcaption):not(.unstyle){color:var(--color-content-neutral,oklch(48.26% .0365 255.09));font-size:.8125rem;& a{color:inherit;font-weight:inherit}}:where(figure figcaption):not(.unstyle){margin:calc(var(--spacing, .25rem)*2) auto;text-align:center}.small,:where(small):not(.unstyle){color:var(--color-content-neutral,oklch(48.26% .0365 255.09));font-size:.875rem}:where([x-icon]){display:inline-flex;width:fit-content}:where(ins):not(.unstyle){text-decoration:none}.kbd,:where(kbd):not(.unstyle){background-color:color-mix(in oklch,var(--color-content-neutral,oklch(48.26% .0365 255.09)) 10%,transparent);border-radius:calc(var(--radius, .5rem)/1.5);color:var(--color-content-neutral,oklch(48.26% .0365 255.09));display:inline-block;font-family:inherit;font-size:75%;font-weight:600;line-height:1;min-width:1.4rem;padding:.3rem;text-align:center;vertical-align:baseline;width:fit-content;&:not(:last-of-type){margin-inline-end:1px}}[dir=rtl] :where(kbd:not(:last-of-type),.kbd:not(:last-of-type)){margin-inline-end:0;margin-inline-start:1px}.label,:where(label):not(.unstyle){user-select:none;width:-moz-fit-content;width:fit-content}.legend,:where(legend):not(.unstyle){display:block;max-width:100%;white-space:normal}.badge,:where(mark):not(.unstyle){align-items:center;background-color:var(--color-field-surface,oklch(91.79% .0029 264.26));border-radius:100px;color:var(--color-field-inverse,oklch(16.6% .026 267));display:inline-flex;font-size:.75rem;font-weight:500;gap:.25rem;height:fit-content;justify-content:center;line-height:1;padding:var(--spacing,.25rem) calc(var(--spacing, .25rem)*1.5);width:fit-content;&:has(svg:only-child){padding:var(--spacing,.25rem) calc(var(--spacing, .25rem)*1)}}:where(ol):not(nav ol):not(menu ol):not(.unstyle){list-style-type:decimal}:where(ul):not(nav ul):not(menu ul):not(.unstyle){list-style-type:disc}:where(ol):not(nav ol):not(menu ol):not(.unstyle),:where(ul):not(nav ul):not(menu ul):not(.unstyle){&:not(:has(input[type=checkbox])){padding-inline-start:1.75ch}& li{padding-inline-start:1ch;&:not(:last-of-type){margin-bottom:1.25ch}&:has([x-icon]){display:inherit;list-style:none;position:relative;& [x-icon]{left:-1.75ch;position:absolute;top:.45ch}}&:has(input[type=checkbox]){display:inherit;list-style:none;position:relative;& input[type=checkbox]{left:-1ch;position:absolute;top:.45ch}}}}[dir=rtl] :where(ol):not(nav ol):not(menu ol):not(.unstyle),[dir=rtl] :where(ul):not(nav ul):not(menu ul):not(.unstyle){& li:has([x-icon]){& [x-icon]{left:auto;right:-1.75ch}}& li:has(input[type=checkbox]){& input[type=checkbox]{left:auto;right:-1.25ch}}}:where(ol,ul):not(nav ol):not(menu ol):not(.unstyle) ul,:where(ol,ul):not(nav ul):not(menu ul):not(.unstyle) ol{margin-top:1ch;padding-inline-start:2.75ch;&+li{margin-top:1.5ch}}:where(span):not(.unstyle){vertical-align:middle}}@layer utilities{:where(.center){align-items:center;justify-content:center}:where(.row,.row-wrap,.col,.col-wrap){display:flex}:where(.col){flex-flow:column nowrap}:where(.col-wrap){flex-flow:column wrap}:where(.row){flex-flow:row nowrap}:where(.row-wrap){flex-flow:row wrap}:where(.content){margin-inline-end:auto;margin-inline-start:auto;max-width:100%;width:var(--spacing-content-width,68.75rem)}:where(.ghost){background-color:transparent;color:var(--color-content-stark,oklch(16.6% .026 267));&:hover{background-color:var(--color-field-surface,oklch(91.79% .0029 264.26))}&.brand:hover{color:var(--color-brand-inverse,#763518)}&.accent:hover{color:var(--color-accent-inverse,oklch(100% 0 0))}&.negative:hover{color:var(--color-negative-inverse,#fff)}}:where(.hug){height:fit-content;min-width:0;padding:0;width:fit-content}:where(.outlined){border-color:color-mix(in oklch,var(--color-field-surface,oklch(91.79% .0029 264.26)) 90%,var(--color-field-inverse,oklch(16.6% .026 267)));border-style:solid;border-width:1px}.dark :where(.outlined){border-color:color-mix(in oklch,var(--color-field-surface,oklch(91.79% .0029 264.26)) 80%,var(--color-field-inverse,oklch(16.6% .026 267)))}:where(.selected){background-color:color-mix(in oklch,var(--color-field-surface,oklch(91.79% .0029 264.26)) 25%,transparent)}:where(.transparent){background-color:transparent!important;color:var(--color-content-neutral,oklch(48.26% .0365 255.09));&:hover{color:var(--color-content-stark,oklch(16.6% .026 267))}}:where(.lg){--spacing-field-height:2.5rem;--spacing-field-padding:0.78rem;font-size:125%}:where(.sm){--spacing-field-height:1.5rem;--spacing-field-padding:0.49rem;font-size:75%;&::picker-icon{line-height:.2}}:where(body.page){display:flex;flex-direction:column;min-height:100vh}.page{&>footer,&>header{z-index:30}&>footer,&>header,&>main{padding-inline-end:var(--spacing-viewport-padding,5vw);padding-inline-start:var(--spacing-viewport-padding,5vw)}&>footer nav,&>header nav,&>main>section:not(.banner,.overlay-dark,.overlay-light){margin-inline-end:auto;margin-inline-start:auto;max-width:100%;width:var(--spacing-content-width,68.75rem)}&>footer{margin-top:auto}}.no-focus:focus,.no-focus:focus-visible,.no-focus:focus-within{box-shadow:0 0 0 0 transparent}:where(.no-scrollbar){-ms-overflow-style:none;scrollbar-width:none;&::-webkit-scrollbar{display:none}}:where(.overlay-dark,.overlay-light){position:relative;&:after{content:"";height:100%;left:0;position:absolute;top:0;width:100%;z-index:0}>*{position:relative;z-index:1}}:where(.overlay-dark){color:#fff!important;&:after{background:oklch(0 0 0/50%)}}:where(.overlay-light){color:#000!important;&:after{background:oklch(100% 0 0/75%)}}:where(.prose){max-width:100%;width:65ch;& aside:not([popover]){background-color:color-mix(in oklch,var(--color-field-surface,oklch(91.79% .0029 264.26)) 20%,transparent);border:1px solid color-mix(in oklch,var(--color-field-surface,oklch(91.79% .0029 264.26)) 30%,transparent);border-radius:calc(var(--radius, .5rem)*2);color:var(--color-content-stark,oklch(16.6% .026 267));margin-top:1.4rem;padding:1rem;&:not(.frame) *{color:inherit}&:has([x-icon]):not(.frame){display:flex;flex-direction:row;gap:1rem;& [x-icon]{font-size:1.25rem;padding-top:.25rem}}}&>a:not(:where(h1,h2,h3,h4,h5,h6,p,small,figcaption,label,li,blockquote,pre code,code,kbd,span,mark,[role=button]) a){margin-top:1.4rem}&>blockquote{margin-top:2rem;& *{margin:0}}&>figcaption{margin-top:1rem}&>figure{margin-top:1.4rem;& img{margin:0}}&>h1+p{color:var(--color-content-neutral,oklch(48.26% .0365 255.09));font-size:1.125rem;margin-top:.625rem}&>h2{margin-bottom:.6667rem;margin-top:1rem}&>h3{margin-top:2.4rem}&>h4{margin-top:3rem}&>h4+p{margin-top:.25rem}&>h5{margin-top:1rem}&>h5,&>h6{margin-bottom:1rem}&>h6{margin-top:2rem}&>hr{margin-bottom:3rem;margin-top:3rem}&>img,&>p{margin-top:1.4rem}&>ol,&>small,&>ul{margin-top:1rem}&>pre,&>table,&>x-code,&>x-code-group{margin-bottom:2rem;margin-top:2rem}&>x-code pre,&>x-code-group x-code{margin-bottom:0;margin-top:0}}:where(.trailing){color:var(--color-content-neutral,oklch(48.26% .0365 255.09));display:inline-block;margin-inline-start:auto}:where(.brand){--color-field-surface:var(--color-brand-surface,#f6c07b);--color-field-surface-hover:var(--color-brand-surface-hover,#f19b46);--color-field-inverse:var(--color-brand-inverse,#763518);--color-content-stark:var(--color-brand-content,#de6618);--color-content-neutral:color-mix(in oklch,var(--color-brand-content,#de6618) 85%,transparent);--color-content-subtle:color-mix(in oklch,var(--color-brand-content,#de6618) 70%,transparent)}:where(.accent){--color-field-surface:var(--color-accent-surface,oklch(16.6% 0.026 267));--color-field-surface-hover:var(--color-accent-surface-hover,oklch(28.7% 0.030787 270.1));--color-field-inverse:var(--color-accent-inverse,oklch(100% 0 0));--color-content-stark:var(--color-accent-content,oklch(16.6% 0.026 267));--color-content-neutral:color-mix(in oklch,var(--color-accent-content,oklch(16.6% 0.026 267)) 85%,transparent);--color-content-subtle:color-mix(in oklch,var(--color-accent-content,oklch(16.6% 0.026 267)) 70%,transparent)}:where(.negative){--color-field-surface:var(--color-negative-surface,#ef4444);--color-field-surface-hover:var(--color-negative-surface-hover,#dc2626);--color-field-inverse:var(--color-negative-inverse,#fff);--color-content-stark:var(--color-negative-content,#ef4444);--color-content-neutral:color-mix(in oklch,var(--color-negative-content,#ef4444) 85%,transparent);--color-content-subtle:color-mix(in oklch,var(--color-negative-content,#ef4444) 70%,transparent)}:where(.positive){--color-field-surface:var(--color-positive-surface,#16a34a);--color-field-surface-hover:var(--color-positive-surface-hover,#166534);--color-field-inverse:var(--color-positive-inverse,#fff);--color-content-stark:var(--color-positive-content,#16a34a);--color-content-neutral:color-mix(in oklch,var(--color-positive-content,#16a34a) 85%,transparent);--color-content-subtle:color-mix(in oklch,var(--color-positive-content,#16a34a) 70%,transparent)}:where(.stark){color:var(--color-content-stark,oklch(16.6% .026 267))}:where(.neutral){color:var(--color-content-neutral,oklch(48.26% .0365 255.09))}:where(.subtle){color:var(--color-content-subtle,oklch(67.4% .0318 251.27))}}
1
+ @layer base{*,::backdrop,::file-selector-button,:after,:before{border:0 solid;box-sizing:border-box;margin:0;padding:0}:where(:root){-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;overflow-wrap:break-word;-moz-tab-size:4;-o-tab-size:4;tab-size:4;text-rendering:optimizeLegibility}:host,:where(html){font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal;line-height:1.5;max-width:100vw;overflow-x:hidden;tab-size:4;width:100vw;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent;scroll-behavior:smooth;-ms-overflow-style:none;scrollbar-width:none;&::-webkit-scrollbar{display:none}&:has(dialog:popover-open){overflow:hidden}}:where(body){line-height:inherit;margin:0;max-width:100vw;min-height:100vh}:where(a){color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}:where(abbr[title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}:where([aria-controls]){cursor:pointer}:where([aria-hidden=false][hidden]){display:initial}:where([aria-hidden=false][hidden]:not(:focus)){clip:rect(0,0,0,0);position:absolute}:where(audio:not([controls])){display:none;height:0}:where(b,strong){font-weight:bolder}:where(button,input,optgroup,select,textarea){color:inherit;font-family:inherit;font-feature-settings:inherit;font-size:100%;font-variation-settings:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;margin:0;padding:0}:where(button,select){text-transform:none}:where(button,input:where([type=button],[type=reset],[type=submit]),::file-selector-button){appearance:button;background-color:transparent;background-image:none}:where(::-webkit-file-upload-button){-webkit-appearance:button;font:inherit}:where(::-webkit-inner-spin-button,::-webkit-outer-spin-button){height:auto}:where(::-webkit-search-decoration){-webkit-appearance:none}:where(button,[role=button]){cursor:pointer}:where(code,samp,pre){font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-size:1em;font-variation-settings:normal}:where([dir=rtl]){direction:rtl}:where([disabled],:disabled,[aria-disabled=true],.disabled){cursor:default;opacity:.5;pointer-events:none}:where(figcaption){font-size:75%}:where(figure){display:block;padding:0}:where(::file-selector-button){margin-inline-end:4px}:where(h1,h2,h3,h4,h5,h6){font-size:inherit;font-weight:inherit}:where(hr){background-color:var(--color-line,oklch(48.3% .006422 17.4/.15));border:0;color:inherit;height:1px}:where(img,svg,video,canvas,audio,iframe,embed,object){display:block}:where(img,video){height:auto;max-width:100%}:where(::-webkit-autofill,:-webkit-autofill:focus){transition:background-color 0s 600000s,color 0s 600000s}:where(::-webkit-date-and-time-value){min-height:1lh;text-align:inherit}:where(::-webkit-datetime-edit){display:inline-flex}:where(::-webkit-datetime-edit-fields-wrapper){padding:0}:where(::-webkit-datetime-edit,::-webkit-datetime-edit-year-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-meridiem-field){padding-block:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}:where(small){font-size:80%}:where(span){color:inherit}:where(sub,sup){font-size:50%;line-height:0;position:relative;vertical-align:baseline}:where(sub){bottom:-.25em}:where(sup){top:-.5em}:where(svg):not([fill]){fill:currentColor}:where(svg):not(:root){overflow:hidden}:where(table){border-collapse:collapse;border-color:inherit;text-indent:0}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}:where(::placeholder){color:#9ca3af;opacity:1}@supports (not (-webkit-appearance:-apple-pay-button)) or (contain-intrinsic-size:1px){:where(::placeholder){color:color-mix(in oklab,currentcolor 50%,transparent)}}:where([popover]){display:none;transition:opacity .15s ease-in,scale .15s ease-in,display .15s ease-in;transition-behavior:allow-discrete;&:popover-open{display:flex}@starting-style{opacity:0;scale:.9}&:not(:popover-open){display:none!important;opacity:0;scale:1;transition-duration:.15s;transition-timing-function:ease-out}}:where(progress){vertical-align:baseline}:where([type=search]){-webkit-appearance:textfield;appearance:textfield;outline-offset:-2px}:where(summary){display:list-item}:where(textarea){resize:vertical}[hidden],[un-cloak],[v-cloak],[x-cloak]{display:none}@media (-webkit-min-device-pixel-ratio:2){:where(html){-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}}@media (prefers-reduced-motion:reduce){:not([aria-busy=true]),:not([aria-busy=true]):after,:not([aria-busy=true]):before{animation-delay:-1ms!important;animation-duration:1ms!important;animation-iteration-count:1!important;background-attachment:scroll!important;scroll-behavior:auto!important;transition-delay:0s!important;transition-duration:0s!important}}@media (prefers-reduced-motion:no-preference){[dir=rtl] progress:indeterminate{animation-direction:reverse}}}@layer components{:where(details):not(.unstyle){transition:var(--transition,all .05s ease-in-out);width:100%;&[open]>summary:before{transform:rotate(90deg)}& [open] summary{margin-bottom:calc(var(--spacing, .25rem)*4)}&>:not(summary){padding:var(--spacing-field-padding,.625rem) 0}:where(summary){align-items:center;color:var(--color-content-stark,oklch(16.6% .026 267));cursor:pointer;display:flex;font-weight:700;justify-content:space-between;position:relative;transition:var(--transition,all .05s ease-in-out);user-select:none;&::-webkit-details-marker,&::marker{content:"";display:none}&:hover{color:color-mix(in oklch,var(--color-surface-1,oklch(98.17% .0005 95.87)) 40%,var(--color-content-stark,oklch(16.6% .026 267)))}&:active{color:color-mix(in oklch,var(--color-surface-1,oklch(98.17% .0005 95.87)) 50%,var(--color-content-stark,oklch(16.6% .026 267)))}&:before{background-color:color-mix(in oklch,var(--color-field-surface,oklch(91.79% .0029 264.26)) 50%,var(--color-field-inverse,oklch(16.6% .026 267)));content:"";height:1rem;-webkit-mask-image:var(--icon-accordion,url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' viewBox='0 0 256 256'%3E%3Cpath d='m184.49 136.49-80 80a12 12 0 0 1-17-17L159 128 87.51 56.49a12 12 0 1 1 17-17l80 80a12 12 0 0 1-.02 17'/%3E%3C/svg%3E"));mask-image:var(--icon-accordion,url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1em' height='1em' viewBox='0 0 256 256'%3E%3Cpath d='m184.49 136.49-80 80a12 12 0 0 1-17-17L159 128 87.51 56.49a12 12 0 1 1 17-17l80 80a12 12 0 0 1-.02 17'/%3E%3C/svg%3E"));-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%;order:1;transform:rotate(0);transition:transform .25s ease;width:1rem}}}[dir=rtl] :where(details):not(.unstyle){& summary:before{transform:rotate(180deg)}&[open]>summary:before{transform:rotate(90deg)}}}@layer utilities{:where(.avatar){align-items:center;background-clip:content-box;background-color:var(--color-field-surface,oklch(91.79% .0029 264.26));background-position:50%;background-size:cover;border-radius:var(--radius,.5rem);color:var(--color-field-inverse,oklch(16.6% .026 267));display:flex;flex-flow:row wrap;flex-shrink:0;font-weight:700;height:var(--spacing-field-height,2.25rem);justify-content:center;position:relative;text-align:center;text-transform:uppercase;width:var(--spacing-field-height,2.25rem);&[x-icon]{color:var(--color-content-subtle,oklch(67.4% .0318 251.27))}:where(img){border-radius:inherit;height:100%;left:0;object-fit:cover;object-position:center;position:absolute;top:0;transition:var(--transition,all .05s ease-in-out);width:100%}:where(figure){background-color:var(--color-field-surface,oklch(91.79% .0029 264.26));border:1px solid var(--color-page,oklch(100% 0 0));border-radius:50%;bottom:-3px;height:9px;position:absolute;right:-3px;width:9px;z-index:1}}:where(button.avatar,label.avatar){background-blend-mode:normal;padding:0;&:hover{background-blend-mode:multiply;background-color:var(--color-field-surface-hover,oklch(89.24% .0024 12.48));& img{filter:brightness(.9)}}}:where(.avatar-wide){align-items:center;display:flex;flex-flow:row;gap:1.5ch;justify-content:start;max-width:100%;overflow:hidden;width:100%;& span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}:where(button.avatar-wide){height:fit-content;padding:var(--spacing,.25rem);padding-inline-end:1.5ch;&:hover .avatar{background-color:var(--color-field-surface-hover,oklch(89.24% .0024 12.48));transition:var(--transition,all .05s ease-in-out)}}:where([role=group]:has(.avatar,button.avatar)){align-items:center;display:flex;flex-flow:row nowrap;:where(.avatar){box-shadow:0 0 0 3px var(--color-page,oklch(100% 0 0));margin-inline-end:calc(var(--spacing-field-height, 2.25rem)*-.3)}}}@layer components{:where(button:not(.link),[role=button],[type=button],[type=reset],[type=submit],select):not(.unstyle){align-items:center;appearance:button;background-color:var(--color-field-surface,oklch(91.79% .0029 264.26));border:0 solid transparent;border-radius:var(--radius,.5rem);color:var(--color-field-inverse,oklch(16.6% .026 267));cursor:pointer;display:inline-flex;flex-flow:row;gap:.375rem;height:var(--spacing-field-height,2.25rem);justify-content:center;margin:0;max-width:100%;min-width:var(--spacing-field-height,2.25rem);outline-color:var(--color-line,oklch(48.3% .006422 17.4/.15));overflow:hidden;padding:0 var(--spacing-field-padding,.625rem);text-overflow:ellipsis;transition:var(--transition,all .05s ease-in-out);white-space:nowrap;width:fit-content;& [x-icon],& span{color:inherit}& span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}&:has(>svg:only-child){font-size:1rem;padding:0}& svg{margin-left:auto;margin-right:auto}&:active,&:hover{background-color:var(--color-field-surface-hover,oklch(89.24% .0024 12.48))}&:focus-visible{background-color:var(--color-field-surface,oklch(91.79% .0029 264.26))}}:where(select):not(.unstyle){appearance:base-select;&::picker-icon{content:"⌄";font-size:20px;height:calc(var(--spacing-field-height, 2.25rem)*.5);line-height:.4;transform:scaleY(.7)}}}@layer components{input[type=checkbox]:not([role=switch],.unstyle){border-radius:.4rem;cursor:pointer;height:calc(var(--spacing-field-height, 2.25rem)*.6);max-width:calc(var(--spacing-field-height, 2.25rem)*.6);min-width:calc(var(--spacing-field-height, 2.25rem)*.6);padding:0;position:relative;width:calc(var(--spacing-field-height, 2.25rem)*.6);&:checked{&:active,&:hover{background-color:var(--color-field-surface-hover,oklch(89.24% .0024 12.48));border-color:var(--color-field-surface-hover,oklch(89.24% .0024 12.48))}}&:after{background-color:var(--color-field-inverse,oklch(16.6% .026 267));content:"";height:60%;left:50%;-webkit-mask-image:var(--icon-checkbox,url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='currentColor' d='m0 11 2-2 5 5L18 3l2 2L7 18z'/%3E%3C/svg%3E"));mask-image:var(--icon-checkbox,url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='currentColor' d='m0 11 2-2 5 5L18 3l2 2L7 18z'/%3E%3C/svg%3E"));-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%;opacity:0;position:absolute;top:50%;transform:translateX(-50%) translateY(-50%) scale(0);transform-origin:center;transition:var(--transition,all .05s ease-in-out);width:60%}&:checked:after{opacity:1;transform:translateX(-50%) translateY(-50%) scale(1)}}}:root{--icon-alpha-pattern:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 2 2'%3E%3Cpath fill='gray' d='M0 0h1v1H0zM1 1h1v1H1z' opacity='.15'/%3E%3C/svg%3E")}@layer utilities{:where(.colorpicker-swatch):not(.unstyle){background:var(--swatch-color,#000);border-color:oklch(from var(--swatch-color,#000) calc(l + (.5 - l) * .35) c calc(h + 0));border-radius:var(--radius,.5rem);border-style:solid;border-width:1px;cursor:pointer;height:var(--spacing-field-height,2.25rem);max-width:var(--spacing-field-height,2.25rem);min-width:var(--spacing-field-height,2.25rem);overflow:hidden;padding:0;position:relative;transition:var(--transition);width:var(--spacing-field-height,2.25rem);&:active,&:focus,&:focus-visible,&:hover{border-color:oklch(from var(--swatch-color,#000) calc(l + (.5 - l) * .35) c calc(h + 0)/.5)}&:before{background-image:var(--icon-alpha-pattern);background-position:0 0;background-size:50%;content:"";height:100%;left:0;position:absolute;top:0;width:100%;z-index:-1}}[x-colorpicker]:not(.unstyle){& :where(hr){margin-bottom:2px;margin-top:2px}& .canvas-wrapper{aspect-ratio:1;cursor:crosshair;overflow:hidden;position:relative;touch-action:none;width:100%}& canvas{display:block;height:100%;width:100%}& .color-reticle{border:2px solid #fff;border-radius:50%;box-shadow:0 0 0 1px rgba(0,0,0,.3),inset 0 0 0 1px rgba(0,0,0,.2);height:.75rem;pointer-events:none;position:absolute;transform:translate(-50%,-50%);width:.75rem;z-index:1}& .color-controls{display:flex;flex-direction:column;gap:.75rem;padding:.75rem}& input[type=range].alpha,& input[type=range].hue{appearance:none;-webkit-appearance:none;background:transparent;border:none;border-radius:1rem;cursor:pointer;height:.75rem;outline:none;padding:0;width:100%;&::-webkit-slider-thumb{-webkit-appearance:none;background:#fff;border:2px solid #fff;border-radius:50%;box-shadow:0 0 0 1px rgba(0,0,0,.15),0 1px 3px rgba(0,0,0,.25);cursor:grab;height:1rem;width:1rem;&:active{cursor:grabbing}}&::-moz-range-thumb{background:#fff;border:2px solid #fff;border-radius:50%;box-shadow:0 0 0 1px rgba(0,0,0,.15),0 1px 3px rgba(0,0,0,.25);cursor:grab;height:1rem;width:1rem;&:active{cursor:grabbing}}&::-webkit-slider-runnable-track{border-radius:1rem;height:.75rem}&::-moz-range-track{border-radius:1rem;height:.75rem}}& input[type=range].hue{&::-webkit-slider-runnable-track{background:linear-gradient(90deg,red,#ff0,#0f0,#0ff,#00f,#f0f,red)}&::-moz-range-track{background:linear-gradient(90deg,red,#ff0,#0f0,#0ff,#00f,#f0f,red)}}& input[type=range].alpha{--cp-color:#000;position:relative;&::-webkit-slider-runnable-track{background:linear-gradient(to right,transparent,var(--cp-color)),repeating-conic-gradient(#e0e0e0 0 25%,#fff 0 50%) 0 0 /.5rem .5rem}&::-moz-range-track{background:linear-gradient(to right,transparent,var(--cp-color)),repeating-conic-gradient(#e0e0e0 0 25%,#fff 0 50%) 0 0 /.5rem .5rem}}& select.color-format{font-size:.6875rem;padding-inline-end:0;padding-inline-start:0;width:8ch;&::picker-icon{display:none}}& input.color-value{flex:1;font-size:50%;padding-inline-end:0}& input.alpha-value{-moz-appearance:textfield;font-size:50%;padding-inline-end:0;width:6ch;&::-webkit-inner-spin-button,&::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}}& .gradient-layers{display:flex;flex-direction:column;gap:.5rem}& .layer-angle-menu,& .stop-floating-menu{background:var(--color-popover-surface,oklch(100% 0 0));border-radius:var(--radius,.5rem);box-shadow:0 0 0 1px hsla(0,0%,6%,.05),0 3px 6px hsla(0,0%,6%,.1),0 9px 24px hsla(0,0%,6%,.2);display:none;flex-direction:column;list-style:none;margin:0;min-width:140px;padding:.25rem;z-index:100;& :where(li){align-items:center;border-radius:6px;color:var(--color-content-stark,oklch(16.6% .026 267));cursor:pointer;display:flex;font-size:.8125rem;padding:.25rem .5rem;user-select:none;&:hover{background-color:var(--color-field-surface,oklch(91.79% .0029 264.26))}&.negative:hover{color:var(--color-negative-content,#ef4444)}}& :where(hr){border:none;border-top:1px solid var(--color-line,color-mix(in oklch,oklch(16.6% .026 267) 11%,transparent));margin:.25rem 0}& :where(small){color:var(--color-content-subtle,oklch(52.38% .017 264.26));display:block;font-size:.6875rem;padding:.25rem .5rem .125rem}}& .layer-angle-menu.show,& .stop-floating-menu{display:flex}& .layer-angle{align-items:center;cursor:ew-resize;display:inline-flex;& input[type=number]{-moz-appearance:textfield!important;appearance:textfield!important;background:transparent;border:none;color:var(--color-content-stark,oklch(16.6% .026 267));cursor:ew-resize;font-family:ui-monospace,monospace;font-size:.625rem;outline:none;padding:0 .125rem;text-align:right;width:4ch;&:focus{background-color:var(--color-field-surface,oklch(91.79% .0029 264.26));border-radius:.125rem;cursor:text}}& span{color:var(--color-content-subtle,oklch(52.38% .017 264.26));font-size:.625rem;pointer-events:none;user-select:none}}& .gradient-layer{background:var(--color-field-surface,oklch(91.79% .0029 264.26));border-radius:1rem;cursor:pointer;height:.75rem;position:relative;width:100%}& .stop-handle{border:2px solid #fff;border-radius:50%;box-shadow:0 0 0 1px rgba(0,0,0,.15),0 1px 3px rgba(0,0,0,.25);cursor:grab;height:1rem;position:absolute;top:50%;touch-action:none;transform:translate(-50%,-50%);width:1rem;z-index:1;&.active{box-shadow:0 0 0 2px var(--color-brand-content,#de6618),0 1px 3px rgba(0,0,0,.25)}&:active{cursor:grabbing}}& .stop-context-menu{min-width:140px}& .eyedropper{}& .swatches{display:flex;flex-wrap:wrap;gap:.25rem;& [data-color]{border:1px solid var(--color-line,color-mix(in oklch,oklch(16.6% .026 267) 11%,transparent));border-radius:calc(var(--radius, .5rem) - .125rem);cursor:pointer;height:1.25rem;transition:var(--transition,all .05s ease-in-out);width:1.25rem;&:hover{box-shadow:0 1px 3px rgba(0,0,0,.2);scale:1.15}}}}menu[popover].colorpicker .layer-angle input[type=number]::-webkit-inner-spin-button,menu[popover].colorpicker .layer-angle input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none!important;appearance:none!important;display:none!important;height:0!important;margin:0!important;width:0!important}}@layer components{:where(dialog[popover],.dialog):not(.unstyle){background-color:var(--color-popover-surface,oklch(100% 0 0));border:0;border-radius:calc(var(--radius, .5rem)*2);box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 8px 10px -6px rgba(0,0,0,.1);color:var(--color-content-stark,oklch(16.6% .026 267));flex-direction:column;left:0;margin:auto;max-height:90vh;max-width:100%;min-height:200px;position:fixed;right:0;width:500px;&::backdrop{background-color:rgba(0,0,0,.2)}& :where(header,main,footer){padding:calc(var(--spacing, .25rem)*4)}& :where(header){align-items:center;display:flex;gap:calc(var(--spacing, .25rem)*4);justify-content:space-between}& :where(main){flex-grow:1}& :where(footer){align-items:center;display:flex;gap:calc(var(--spacing, .25rem)*2);justify-content:end;margin-top:auto}@media screen and (max-width:768px){margin-bottom:auto!important;margin-left:auto!important;margin-right:auto!important;margin-top:auto!important;max-height:calc(100vh - var(--spacing, .25rem)*4 - var(--spacing, .25rem)*4)!important;width:calc(100vw - var(--spacing, .25rem)*4 - var(--spacing, .25rem)*4)!important}}:where(.dialog){height:fit-content;inset:0;z-index:10}.dark :where(dialog)::backdrop{background-color:rgba(0,0,0,.35)}html:has(dialog:popover-open){& menu[popover]:not(dialog *){opacity:0;pointer-events:none;scale:.9;transition:opacity .15s ease-out,scale .15s ease-out;&:popover-open{display:flex!important}}}html:has(dialog:popover-open~dialog:popover-open){& dialog:popover-open:not(:last-of-type) menu[popover]{opacity:0;pointer-events:none;scale:.9;transition:opacity .15s ease-out,scale .15s ease-out;&:popover-open{display:flex!important}}}}@layer utilities{:where(.divider){align-items:center;color:var(--color-content-neutral,oklch(48.26% .0365 255.09));display:flex;flex-flow:row nowrap;font-size:.875rem;height:1px;justify-content:center;margin:var(--spacing-field-padding,.625rem) 0;white-space:nowrap;width:100%;&:after,&:before{background-color:var(--color-line,oklch(48.3% .006422 17.4/.15));content:"";display:inline-flex;flex:1;height:1px;width:auto}&:not(:empty){gap:var(--spacing-field-padding,.625rem)}}:where(.divider.start){justify-content:flex-start;&:before{display:none}}:where(.divider.end){justify-content:flex-end;&:after{display:none}}.divider.vertical{align-self:stretch;flex-flow:column nowrap;height:auto;margin:0 var(--spacing-field-padding,.625rem);min-height:100%;min-width:1px;width:fit-content;&:after,&:before{content:"";height:auto;min-height:1px;width:1px}& [x-icon]{flex-shrink:0;font-size:.875rem;min-height:.875rem}}}@layer components{:where(menu[popover]):not(.unstyle){background:var(--color-popover-surface,oklch(100% 0 0));border:0;border-radius:var(--radius,.5rem);box-shadow:0 0 0 1px hsla(0,0%,6%,.05),0 3px 6px hsla(0,0%,6%,.1),0 9px 24px hsla(0,0%,6%,.2);flex-flow:column nowrap;gap:0;height:fit-content;inset:auto;list-style:none;margin:var(--spacing-popover-offset,.5rem) 0;max-height:90vh;min-width:160px;overflow-x:hidden;padding:.25rem;position-area:end span-end;position-try-fallbacks:flip-inline,flip-block,flip-start;transform-origin:top center;width:fit-content;z-index:50;& :where(li,a,button,label){align-items:center;background-color:transparent;border-radius:6px;color:var(--color-content-stark,oklch(16.6% .026 267));cursor:pointer;display:inline-flex;font-weight:400;justify-content:start;max-width:100%;min-height:2rem;overflow:hidden;padding-inline-end:.5rem;padding-inline-start:.5rem;text-align:start;text-decoration:none;text-overflow:ellipsis;user-select:none;white-space:nowrap;width:100%;&:hover{text-decoration:inherit}&:active,&:hover{background-color:var(--color-field-surface,oklch(91.79% .0029 264.26));color:var(--color-field-inverse,oklch(16.6% .026 267))}& [x-icon],& span{color:inherit}& [x-icon]:first-child:not(:only-child){margin-inline-end:.375rem}}& small{color:var(--color-content-neutral,oklch(48.26% .0365 255.09));padding:.25rem .5rem}& hr{background-color:var(--color-line,oklch(48.3% .006422 17.4/.15));flex-shrink:0;margin-inline-start:-.25rem;margin-bottom:.25rem;margin-top:.25rem;width:calc(100% + .5rem)}& label{cursor:default;padding-inline-end:.5rem;padding-inline-start:.5rem;&:hover{background-color:transparent}&:has(input[role=switch]){justify-content:space-between}}& :where(input,textarea){flex-shrink:0;&:not(:first-child){}}& span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}:where(.dark menu[popover]) :where(li,a,button,label):hover{background-color:var(--color-field-surface-hover,oklch(89.24% .0024 12.48))}:where(menu menu):not(.unstyle){margin:0 var(--spacing-popover-offset,.5rem);position-area:span-end end}:where(menu.center){position-area:center}:where(menu.top){margin:var(--spacing-popover-offset,.5rem) 0;position-area:top}:where(menu.bottom){margin:var(--spacing-popover-offset,.5rem) 0;position-area:bottom}:where(menu.start){margin:0 var(--spacing-popover-offset,.5rem);position-area:center start}:where(menu.end){margin:0 var(--spacing-popover-offset,.5rem);position-area:center end}:where(menu.top-start){margin:var(--spacing-popover-offset,.5rem) 0;position-area:start span-end}:where(menu.top-end){margin:var(--spacing-popover-offset,.5rem) 0;position-area:start span-start}:where(menu.bottom-start){margin:var(--spacing-popover-offset,.5rem) 0;position-area:end span-end}:where(menu.bottom-end){margin:var(--spacing-popover-offset,.5rem) 0;position-area:end span-start}:where(menu.start-top){margin:0 var(--spacing-popover-offset,.5rem);position-area:span-end start}:where(menu.start-bottom){margin:0 var(--spacing-popover-offset,.5rem);position-area:span-start start}:where(menu.end-top){margin:0 var(--spacing-popover-offset,.5rem);position-area:span-end end}:where(menu.end-bottom){margin:0 var(--spacing-popover-offset,.5rem);position-area:span-start end}:where(menu.top-start-corner,menu.start-top-corner){margin:var(--spacing-popover-offset,.5rem);position-area:start start}:where(menu.top-end-corner,menu.end-top-corner){margin:var(--spacing-popover-offset,.5rem);position-area:start end}:where(menu.bottom-start-corner,menu.start-bottom-corner){margin:var(--spacing-popover-offset,.5rem);position-area:end start}:where(menu.bottom-end-corner,menu.end-bottom-corner){margin:var(--spacing-popover-offset,.5rem);position-area:end end}@media (pointer:coarse){menu[popover]:not(.unstyle){bottom:1rem;left:1rem;margin:0;position:fixed;position-area:none;top:auto;width:calc(100% - 2rem);& :where(li,a,button,label) [x-icon]:first-child:not(:only-child){margin-inline-end:.8125rem}}}}@layer components{:where([role=group]:has(button,input,select)):not(.unstyle){align-items:center;display:flex;flex-flow:row nowrap;gap:0;max-width:100%;width:fit-content;&>*{flex-basis:auto;flex-shrink:0;&:focus{z-index:1}}&>:first-child{border-end-end-radius:0;border-start-end-radius:0}&>:not(:first-child):not(:last-child){border-radius:0}&>:last-child{border-end-start-radius:0;border-start-start-radius:0}&.even>*{flex-shrink:1;width:100%}& input{width:fit-content}}:where(form):not(.unstyle){display:flex;flex-direction:column;gap:calc(var(--spacing)*4);width:100%}:where(fieldset):not(.unstyle){display:flex;flex-direction:column;gap:.375ch calc(var(--spacing)*2);width:100%;&:has([type=radio],[type=checkbox]){gap:calc(var(--spacing)*2)}}:where(fieldset:has(legend)):not(.unstyle){border-color:var(--color-line,oklch(48.3% .006422 17.4/.15));border-radius:var(--radius,.5rem);border-style:solid;border-width:1px;padding:1ch 1.5ch 1.5ch;& :where(legend){color:var(--color-content-subtle,oklch(67.4% .0318 251.27));font-size:.875rem;padding:0 1.5ch}}:where(label,.label):has([type=radio],[type=checkbox]):not(.unstyle){align-items:center;cursor:pointer;display:flex;flex-flow:row;gap:1ch;outline:0 none;&:focus-within{box-shadow:0 0 0 0}}:where(label:not(:has(.label)),.label):has(button,[role=button],[type=button],[type=submit],select,input:not([role=button],[type=checkbox],[type=radio],[type=file],[type=search]),textarea):not(:has(data)):not(.unstyle){cursor:pointer;display:flex;flex-direction:column;gap:.2ch;text-indent:calc(var(--radius)/2);width:100%;:where(*){text-indent:0}:where(span:first-of-type){padding-inline-start:calc(var(--radius)/2)}:where(button,[role=button],[type=button],[type=submit],select,input:not([role=button],[type=checkbox],[type=radio],[type=file],[type=search]),textarea){max-width:100%;width:100%}:has([type=search],[type=file]) :where([type=search],[type=file]){margin-top:.2ch}}label:has(data):not(.unstyle){align-items:center;display:flex;flex-direction:row;gap:1rem;justify-content:space-between;width:100%;&:focus-within{box-shadow:0 0 0 0}& :where(.label,button,input:not([type=checkbox],[type=radio]),select,textarea){max-width:50%;width:calc(var(--spacing-field-height)*8)}& .label:focus-within{box-shadow:0 0 0 2px color-mix(in oklch,var(--color-content-stark) 35%,transparent)}&:has(textarea){align-items:start;:where(data){padding-top:calc(var(--spacing))}}}label:has(.label):not(.unstyle){background-color:transparent;cursor:default;justify-content:space-between;:where([type=search]){max-width:100%;width:100%}}}@layer components{:where(input:not([type=range],[type=color]),textarea,label:has([type=search],[type=file]),.label:has([type=search],[type=file])):not(.unstyle){appearance:none;background-color:var(--color-field-surface,oklch(91.79% .0029 264.26));border:0 solid transparent;border-radius:var(--radius,.5rem);color:var(--color-field-inverse,oklch(16.6% .026 267));cursor:text;max-width:100%;transition:var(--transition,all .05s ease-in-out);width:100%;&:active,&:hover{background-color:var(--color-field-surface-hover,oklch(89.24% .0024 12.48))}&:focus-visible{background-color:var(--color-field-surface,oklch(91.79% .0029 264.26))}&::placeholder{color:color-mix(in oklch,var(--color-field-inverse,oklch(16.6% .026 267)) 65%,transparent)}&::selection{background-color:color-mix(in oklch,var(--color-field-surface,oklch(91.79% .0029 264.26)) 80%,var(--color-field-inverse,oklch(16.6% .026 267)))}&[type=file]{left:0;max-height:0;max-width:0;opacity:0;overflow:hidden;position:absolute;top:0;z-index:-1}}:where(input:not([type=range]):not(.unstyle)){height:var(--spacing-field-height,2.25rem);padding-left:var(--spacing-field-padding,.625rem);padding-right:var(--spacing-field-padding,.625rem)}:where(label,.label):has([type=search],[type=file]):not(.unstyle){align-items:center;display:flex;flex-flow:row;padding-inline-start:0;& :where(input){background:transparent;padding-inline-end:0;padding-inline-start:0;&:focus-visible,&:hover{background:transparent}&:focus-visible{box-shadow:0 0 0 0 transparent}}&:has(input+*){padding-inline-end:.375rem}&:has(input[type=file]+[x-icon]){padding-inline-end:0}}:where(label,.label):has([type=file]):not(.unstyle){cursor:pointer;gap:var(--spacing,.5rem);height:var(--spacing-field-height,2.25rem);justify-content:center}:where(label,.label):has([type=search]):not(.unstyle){justify-content:start;& [x-icon]{align-items:center;color:var(--color-content-subtle,oklch(67.4% .0318 251.27));display:flex;height:100%;justify-content:center;margin-inline-end:0;width:var(--spacing-field-height,2.25rem)}}:where(input[type=search]):not(.unstyle)::-webkit-search-cancel-button{appearance:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}:where(textarea):not(.unstyle){display:block;height:auto;padding:var(--spacing-field-padding,.625rem) calc(var(--spacing-field-padding, .625rem)*1.3)}}:root{--presence-focus-outline-width:2px;--presence-focus-outline-style:dashed;--presence-focus-outline-offset:2px;--presence-focus-opacity:0.6;--presence-focus-color:#3b82f6;--presence-caret-width:2px;--presence-caret-height:1.2em;--presence-caret-color:#3b82f6;--presence-caret-z-index:1000;--presence-caret-blink-duration:1s;--presence-caret-opacity-high:1;--presence-caret-opacity-low:0.3;--presence-selection-color:#3b82f6;--presence-selection-opacity:0.2;--presence-selection-z-index:999;--presence-cursor-size:8px;--presence-cursor-border-width:2px;--presence-cursor-z-index:1001;--presence-throttle:300ms;--presence-cleanup-interval:30000ms;--presence-min-change-threshold:5px;--presence-idle-threshold:5000ms}@layer elements{:where(.presence-focused){opacity:var(--presence-focus-opacity);outline:var(--presence-focus-outline-width) var(--presence-focus-outline-style) var(--presence-focus-color);outline-offset:var(--presence-focus-outline-offset)}:where(.presence-focused[data-presence-focus-color]){--presence-focus-color:attr(data-presence-focus-color);outline-color:var(--presence-focus-color)}:where(.presence-caret){animation:presence-caret-blink var(--presence-caret-blink-duration) infinite;background-color:var(--presence-caret-color);height:var(--presence-caret-height);pointer-events:none;position:absolute;width:var(--presence-caret-width);z-index:var(--presence-caret-z-index)}:where(.presence-caret[data-presence-caret-color]),[data-presence-caret-color] .presence-caret{--presence-caret-color:attr(data-presence-caret-color)}@keyframes presence-caret-blink{0%,50%{opacity:var(--presence-caret-opacity-high)}51%,to{opacity:var(--presence-caret-opacity-low)}}:where(.presence-selection){background-color:var(--presence-selection-color);opacity:var(--presence-selection-opacity);pointer-events:none;position:absolute;z-index:var(--presence-selection-z-index)}:where(.presence-selection){background-color:var(--presence-selection-color)}:where(.presence-cursor){background-color:var(--presence-cursor-color,var(--presence-focus-color));border:var(--presence-cursor-border-width) solid var(--presence-cursor-color,var(--presence-focus-color));border-radius:50%;height:var(--presence-cursor-size);pointer-events:none;position:absolute;transform:translate(-50%,-50%);width:var(--presence-cursor-size);z-index:var(--presence-cursor-z-index)}:where(.presence-cursor-label){background-color:var(--presence-cursor-color,var(--presence-focus-color));border-radius:4px;color:#fff;font-size:12px;left:50%;padding:2px 6px;pointer-events:none;position:absolute;top:calc(var(--presence-cursor-size) + 4px);transform:translateX(-50%);white-space:nowrap;z-index:calc(var(--presence-cursor-z-index) + 1)}:where([data-presence-caret-user],[data-presence-selection-user],[data-presence-focus-user]){position:relative}}@layer components{input[type=radio]:not(.unstyle){border-radius:50%;cursor:pointer;height:calc(var(--spacing-field-height, 2.25rem)*.625);min-width:calc(var(--spacing-field-height, 2.25rem)*.625);padding:5px;position:relative;width:calc(var(--spacing-field-height, 2.25rem)*.625);&:after{background-color:var(--color-field-inverse,oklch(16.6% .026 267));border-radius:50%;content:"";height:60%;left:50%;opacity:0;position:absolute;top:50%;transform:translateX(-50%) translateY(-50%) scale(0);transform-origin:center;transition:var(--transition,all .05s ease-in-out);width:60%}&:checked:after{opacity:1;transform:translateX(-50%) translateY(-50%) scale(1)}}}@layer components{input[type=range]:not(.unstyle){appearance:none;background-color:transparent;border-radius:var(--radius,.5rem);cursor:default;&::-webkit-slider-runnable-track{background-color:var(--color-field-surface,oklch(91.79% .0029 264.26));border-radius:var(--radius,.5rem);cursor:pointer;height:calc(var(--spacing, .25rem)*2);transition:var(--transition)}&:hover::-webkit-slider-runnable-track{background-color:var(--color-field-surface-hover,oklch(89.24% .0024 12.48))}&::-webkit-slider-thumb{appearance:none;background-color:color-mix(in oklch,var(--color-field-surface,oklch(91.79% .0029 264.26)) 60%,var(--color-field-inverse,oklch(16.6% .026 267)));border-radius:200px;box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1);cursor:pointer;height:calc(var(--spacing-field-height, 2.25rem)*.5);position:relative;top:50%;transform:translateY(-50%);transition:var(--transition);width:calc(var(--spacing-field-height, 2.25rem)*.5)}&::-webkit-slider-thumb:hover{background-color:color-mix(in oklch,var(--color-field-surface,oklch(91.79% .0029 264.26)) 30%,var(--color-field-inverse,oklch(16.6% .026 267)))}}:where(datalist):not(.unstyle){display:flex;flex-flow:row nowrap;justify-content:space-between;max-width:100%;width:100%;& option{color:var(--color-content-neutral,oklch(48.26% .0365 255.09));font-size:.875rem;text-align:center;width:2ch}}label:has(input[type=range]):not(.unstyle){cursor:default}}@layer utilities{:where([x-resize]){position:relative;.resize-handle{background:transparent;border:none;display:block;height:var(--spacing-resize-handle,1rem);outline:none;position:absolute;width:var(--spacing-resize-handle,1rem);z-index:100;&:before{background:transparent;content:"";height:1px;left:50%;pointer-events:none;position:absolute;top:50%;transform:translate(-50%,-50%);transition:background-color .2s ease;width:1px}&:active:before,&:hover:before{background-color:var(--color-line,oklch(48.3% .006422 17.4/.15))}}.resize-handle-bottom,.resize-handle-top{cursor:ns-resize;left:0;width:100%;&:before{width:100%}}.resize-handle-end,.resize-handle-left,.resize-handle-right,.resize-handle-start{cursor:ew-resize;height:100%;top:0;&:before{height:100%}}.resize-handle-top{top:calc(var(--spacing-resize-handle, 1rem)*-.5)}.resize-handle-bottom{bottom:calc(var(--spacing-resize-handle, 1rem)*-.5);top:auto}.resize-handle-left,.resize-handle-start{left:calc(var(--spacing-resize-handle, 1rem)*-.5)}.resize-handle-end,.resize-handle-right{right:calc(var(--spacing-resize-handle, 1rem)*-.5)}.resize-handle-top-left{cursor:nw-resize;left:calc(var(--spacing-resize-handle, 1rem)*-.5)}.resize-handle-top-left,.resize-handle-top-right{height:var(--spacing-resize-handle,1rem);top:calc(var(--spacing-resize-handle, 1rem)*-.5);width:var(--spacing-resize-handle,1rem)}.resize-handle-top-right{cursor:ne-resize;right:calc(var(--spacing-resize-handle, 1rem)*-.5)}.resize-handle-bottom-left{cursor:sw-resize;left:calc(var(--spacing-resize-handle, 1rem)*-.5)}.resize-handle-bottom-left,.resize-handle-bottom-right{bottom:calc(var(--spacing-resize-handle, 1rem)*-.5);height:var(--spacing-resize-handle,1rem);width:var(--spacing-resize-handle,1rem)}.resize-handle-bottom-right{cursor:se-resize;right:calc(var(--spacing-resize-handle, 1rem)*-.5)}.resize-handle-top-start{cursor:nw-resize;left:calc(var(--spacing-resize-handle, 1rem)*-.5)}.resize-handle-top-end,.resize-handle-top-start{height:var(--spacing-resize-handle,1rem);top:calc(var(--spacing-resize-handle, 1rem)*-.5);width:var(--spacing-resize-handle,1rem)}.resize-handle-top-end{cursor:ne-resize;right:calc(var(--spacing-resize-handle, 1rem)*-.5)}.resize-handle-bottom-start{cursor:sw-resize;left:calc(var(--spacing-resize-handle, 1rem)*-.5)}.resize-handle-bottom-end,.resize-handle-bottom-start{bottom:calc(var(--spacing-resize-handle, 1rem)*-.5);height:var(--spacing-resize-handle,1rem);width:var(--spacing-resize-handle,1rem)}.resize-handle-bottom-end{cursor:se-resize;right:calc(var(--spacing-resize-handle, 1rem)*-.5)}.resize-overlay{background:transparent;display:none;height:100vh;left:0;position:fixed;top:0;width:100vw;z-index:9999}.resizable-closing{opacity:.5;transition:opacity .2s ease}.resizable-closed{display:none!important}.resize-handle:focus{outline:2px solid rgba(59,130,246,.5);outline-offset:2px}@media (prefers-contrast:high){:where(.resize-handle:hover .resize-handle-inner){background:rgba(0,0,0,.3)}:where(.resize-handle:active .resize-handle-inner){background:rgba(0,0,0,.5)}}@media (prefers-reduced-motion:reduce){:where(.resize-handle-inner,.resizable-closing,.resize-handle){transition:none}}}[dir=rtl] :where([x-resize]) .resize-handle-start{left:auto;right:calc(var(--spacing-resize-handle, 1rem)*-.5)}[dir=rtl] :where([x-resize]) .resize-handle-end{left:calc(var(--spacing-resize-handle, 1rem)*-.5);right:auto}[dir=rtl] :where([x-resize]) .resize-handle-top-start{cursor:ne-resize;left:auto;right:calc(var(--spacing-resize-handle, 1rem)*-.5)}[dir=rtl] :where([x-resize]) .resize-handle-top-end{cursor:nw-resize;left:calc(var(--spacing-resize-handle, 1rem)*-.5);right:auto}[dir=rtl] :where([x-resize]) .resize-handle-bottom-start{cursor:se-resize;left:auto;right:calc(var(--spacing-resize-handle, 1rem)*-.5)}[dir=rtl] :where([x-resize]) .resize-handle-bottom-end{cursor:sw-resize;left:calc(var(--spacing-resize-handle, 1rem)*-.5);right:auto}}@layer components{:where(aside[popover]){background-color:var(--color-popover-surface,oklch(100% 0 0));height:100%;inset-inline-end:0;inset-inline-start:auto;max-width:80vw;max-width:100%;min-width:20vw;overflow-y:auto;transition:opacity .15s ease-in,transform .15s ease-in,display .15s ease-in;transition-behavior:allow-discrete;width:fit-content;z-index:200;@starting-style{opacity:1;scale:1;transform:translateX(100%)}&:not(:popover-open){opacity:1;scale:1;transform:translateX(100%)}[dir=rtl] &{@starting-style{transform:translateX(-100%)}&:not(:popover-open){transform:translateX(-100%)}}}:where(aside[popover].appear-start){inset-inline-end:auto;inset-inline-start:0;@starting-style{transform:translateX(-100%)}&:not(:popover-open){transform:translateX(-100%)}[dir=rtl] &{@starting-style{transform:translateX(100%)}&:not(:popover-open){transform:translateX(100%)}}}.dark :where(aside[popover]){background-color:var(--color-surface-1,oklch(98.17% .0005 95.87))}}@layer components{[x-carousel]{display:flex;flex-direction:column;overflow:hidden;position:relative;width:100%;.carousel-slides{aspect-ratio:16/9;display:flex;transition:transform .3s ease-in-out;width:100%}& button[\@click="next()"],& button[\@click="prev()"]{background-color:oklch(100% 0 0/.15);position:absolute;top:50%;transform:translateY(-50%);&:hover{background-color:oklch(100% 0 0/.3)}}& button[\@click="prev()"]{left:calc(var(--spacing)*4)}& button[\@click="next()"]{left:auto;right:calc(var(--spacing)*4)}.carousel-dots{bottom:calc(var(--spacing)*4);display:flex;gap:calc(var(--spacing)*2);left:50%;max-width:100%;overflow-x:auto;padding:0 calc(var(--spacing)*4);position:absolute;transform:translateX(-50%);-webkit-overflow-scrolling:touch;scrollbar-width:none;&::-webkit-scrollbar{display:none}& span{background-color:oklch(100% 0 0/.15);border-radius:50%;cursor:pointer;flex-shrink:0;height:.625rem;transition:background-color .3s ease-in-out;width:.625rem;&:hover{background-color:oklch(100% 0 0/.3)}&.active{background-color:#fff}}}}}@layer components{:where(input[role=switch]):not(.unstyle){border-radius:calc(var(--spacing-field-height, 2.25rem)*.65);box-sizing:content-box;cursor:pointer;height:calc(var(--spacing-field-height, 2.25rem)*.65);min-width:calc(var(--spacing-field-height, 2.25rem)*.65*2);padding:0;position:relative;width:calc(var(--spacing-field-height, 2.25rem)*.65*2);&:before{background-color:color-mix(in oklch,var(--color-field-surface,oklch(91.79% .0029 264.26)) 60%,var(--color-field-inverse,oklch(16.6% .026 267)));border-radius:50%;box-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);content:"";height:calc(var(--spacing-field-height, 2.25rem)*.65 - .25rem);left:.125rem;position:absolute;top:.125rem;transition:var(--transition,all .05s ease-in-out);width:calc(var(--spacing-field-height, 2.25rem)*.65 - .25rem)}&:checked{background-color:var(--color-field-surface,oklch(91.79% .0029 264.26));&:before{background-color:var(--color-field-inverse,oklch(16.6% .026 267));left:calc(100% - var(--spacing-field-height, 2.25rem)*.65 + .125rem)}&:hover{background-color:var(--color-field-surface-hover,oklch(89.24% .0024 12.48))}}}}@layer components{:where(table,.grid-table):not(.unstyle){border-radius:var(--radius,.5rem);border-spacing:0;max-width:100%;overflow:hidden;table-layout:auto;width:100%;:where(.grid-header,.grid-row,.grid-footer){display:contents}:where(thead,.grid-header>*){background-color:var(--color-surface-1,oklch(98.17% .0005 95.87));border-bottom:1px solid var(--color-line,oklch(48.3% .006422 17.4/.15))}:where(th,.grid-header>*){font-weight:700}:where(tr,.grid-row>*){border-bottom:1px solid var(--color-line,oklch(48.3% .006422 17.4/.15))}:where(td,th,.grid-header>*,.grid-row>*,.grid-footer>*){font-size:.875rem;overflow:hidden;padding:calc(var(--spacing, .25rem)*2.5) calc(var(--spacing, .25rem)*4);text-align:left;text-align:start;&>:not(template){display:inline-flex;vertical-align:middle;&:not(:last-child){margin-right:4px}}}:where(:not(:has(tfoot)) tbody tr:last-child,tfoot tr:last-child,.grid-footer>*){border-bottom:0}&.striped{:where(tr:nth-child(2n),.grid-row:nth-child(2n)){background-color:var(--color-surface-1,oklch(98.17% .0005 95.87))}:where(tr:nth-child(odd),.grid-row:nth-child(odd)){background-color:transparent}:where(tr,.grid-row){border-bottom:0}}}}@layer utilities{:where(.toast-container){align-items:center;bottom:3vw;display:flex;flex-direction:column-reverse;gap:calc(var(--spacing, .25rem)*2);left:50%;position:fixed;transform:translateX(-50%);z-index:100}:where(.toast){background-color:var(--color-popover-surface,oklch(100% 0 0));border:1px solid var(--color-line,oklch(48.3% .006422 17.4/.15));border-radius:calc(var(--radius, .5rem)*2);box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 8px 10px -6px rgba(0,0,0,.1);display:flex;max-width:90vw;opacity:0;overflow:hidden;transform:translateY(1rem);transition:opacity .2s ease-out,transform .2s ease-out,height .2s ease-out,margin .2s ease-out,padding .2s ease-out;:where(.toast-content){align-items:center;color:inherit;display:flex;padding:.375rem .75rem;white-space:pre-wrap;:where([x-icon]:first-child){margin-right:1ch}}:where(.toast-dismiss-button){border-inline-start:1px solid color-mix(in oklch,var(--color-content-stark,oklch(16.6% .026 267)) 20%,transparent);border-radius:0;position:relative;&:after{background-color:var(--color-field-inverse,oklch(16.6% .026 267));content:"";height:50%;left:50%;mask-image:var(--icon-toast-dismiss,url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E"));mask-repeat:no-repeat;mask-size:100% 100%;position:absolute;top:50%;transform:translateX(-50%) translateY(-50%);transform-origin:center;width:50%}}}:where(.toast.brand,.toast.accent,.toast.positive,.toast.negative){background-color:var(--color-field-surface,oklch(91.79% .0029 264.26));color:var(--color-field-inverse,oklch(16.6% .026 267));:where(.toast-dismiss-button){border-inline-start:1px solid color-mix(in oklch,var(--color-field-inverse,oklch(16.6% .026 267)) 20%,transparent)}}:where(.toast-entry){opacity:1;transform:translateY(0)}:where(.toast-exit){opacity:0;transform:translateY(1rem)}}@layer utilities{:where(.tooltip[popover]){background-color:var(--color-content-stark,oklch(16.6% .026 267));border:0;border-radius:var(--radius,.5rem);box-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);color:var(--color-page,oklch(100% 0 0));display:block;font-size:.875rem;inset:auto;margin:var(--spacing-popover-offset,.5rem) 0;max-width:200px;padding:calc(var(--spacing, .25rem)*.5) calc(var(--spacing, .25rem)*2);position:absolute;position-area:bottom;position-try-fallbacks:flip-inline,flip-block,flip-start;width:fit-content;&:hover{transition-delay:var(--tooltip-hover-delay,1s)}& [x-icon]:first-child{margin-inline-end:.25rem}}:where(.tooltip.top){margin:var(--spacing-popover-offset,.5rem) 0;position-area:top}:where(.tooltip.bottom){margin:var(--spacing-popover-offset,.5rem) 0;position-area:bottom}:where(.tooltip.start){margin:0 var(--spacing-popover-offset,.5rem);position-area:center start}:where(.tooltip.end){margin:0 var(--spacing-popover-offset,.5rem);position-area:center end}:where(.tooltip.top-start){margin:var(--spacing-popover-offset,.5rem) 0;position-area:start span-end}:where(.tooltip.top-end){margin:var(--spacing-popover-offset,.5rem) 0;position-area:start span-start}:where(.tooltip.bottom-start){margin:var(--spacing-popover-offset,.5rem) 0;position-area:end span-end}:where(.tooltip.bottom-end){margin:var(--spacing-popover-offset,.5rem) 0;position-area:end span-start}:where(.tooltip.start-top){margin:0 var(--spacing-popover-offset,.5rem);position-area:span-end start}:where(.tooltip.start-bottom){margin:0 var(--spacing-popover-offset,.5rem);position-area:span-start start}:where(.tooltip.end-top){margin:0 var(--spacing-popover-offset,.5rem);position-area:span-end end}:where(.tooltip.end-bottom){margin:0 var(--spacing-popover-offset,.5rem);position-area:span-start end}:where(.tooltip.top-start-corner,.tooltip.start-top-corner){margin:var(--spacing-popover-offset,.5rem);position-area:start start}:where(.tooltip.top-end-corner,.tooltip.end-top-corner){margin:var(--spacing-popover-offset,.5rem);position-area:start end}:where(.tooltip.bottom-start-corner,.tooltip.start-bottom-corner){margin:var(--spacing-popover-offset,.5rem);position-area:end start}:where(.tooltip.bottom-end-corner,.tooltip.end-bottom-corner){margin:var(--spacing-popover-offset,.5rem);position-area:end end}}@layer base{.caption,.h1,.h2,.h3,.h4,.h5,.h6,.label,.paragraph,.small,:where(a,abbr,address,blockquote,code,del,figcaption,h1,h2,h3,h4,h5,h6,ins,label:not(.avatar,:has([type=file],[type=search])),legend,p,small,cite,q):not(.unstyle){color:var(--color-content-stark);&:where(:has([x-icon])){align-items:center;display:inline-flex;& [x-icon]{margin-inline-end:.5ch}}& span{vertical-align:inherit}}.h1,.h2,.h3,.h4,.h5,.h6,:where(h1,h2,h3,h4,h5,h6):not(.unstyle){font-weight:bolder;word-wrap:break-word}.h1,.h2,.h3,.h4,:where(h1,h2,h3,h4):not(.unstyle){font-weight:700}.h1,.h2,.h3,:where(h1,h2,h3):not(.unstyle){letter-spacing:-.025em}.h1,:where(h1):not(.unstyle){font-size:2.25rem;line-height:1.25}.h2,:where(h2):not(.unstyle){font-size:1.5rem}.h3,:where(h3):not(.unstyle){font-size:1.25rem;line-height:1.4}.h4,:where(h4):not(.unstyle){font-size:1rem}.h5,:where(h5):not(.unstyle){color:var(--color-content-neutral,oklch(48.26% .0365 255.09));font-size:.875rem;font-weight:600;line-height:1rem}.h6,:where(h6):not(.unstyle){font-size:.8125rem;font-weight:600;line-height:1.4;text-transform:uppercase}.paragraph,:where(p):not(.unstyle){line-height:1.6}:where(a:not([role=button]),button.link):not(.unstyle){cursor:pointer;text-decoration:underline;text-underline-offset:2px;transition:var(--transition,all .05s ease-in-out);&:active,&:hover{color:var(--color-content-neutral,oklch(48.26% .0365 255.09))}}:where(blockquote):not(.unstyle){border-inline-end:none;border-inline-start:.25rem solid color-mix(in oklch,var(--color-content-stark,oklch(16.6% .026 267)) 25%,transparent);color:var(--color-content-stark,oklch(16.6% .026 267));display:block;margin:calc(var(--spacing, .25rem)*4) 0;max-width:100%;padding:0 calc(var(--spacing, .25rem)*4);width:100%;& *{color:inherit}}:where(code):not(.unstyle){display:inline-block;font-size:82.5%;height:fit-content;padding:.1ch .5ch;width:fit-content;word-wrap:break-word;background-color:color-mix(in oklch,var(--color-content-neutral,oklch(48.26% .0365 255.09)) 10%,transparent);border:1px solid color-mix(in oklch,var(--color-content-subtle,oklch(67.4% .0318 251.27)) 10%,transparent);border-radius:var(--radius,.5rem);color:var(--color-content-neutral,oklch(48.26% .0365 255.09))}.caption,:where(figcaption):not(.unstyle){color:var(--color-content-neutral,oklch(48.26% .0365 255.09));font-size:.8125rem;& a{color:inherit;font-weight:inherit}}:where(figure figcaption):not(.unstyle){margin:calc(var(--spacing, .25rem)*2) auto;text-align:center}.small,:where(small):not(.unstyle){color:var(--color-content-neutral,oklch(48.26% .0365 255.09));font-size:.875rem}:where([x-icon]){display:inline-flex;width:fit-content}:where(ins):not(.unstyle){text-decoration:none}.kbd,:where(kbd):not(.unstyle){background-color:color-mix(in oklch,var(--color-content-neutral,oklch(48.26% .0365 255.09)) 10%,transparent);border-radius:calc(var(--radius, .5rem)/1.5);color:var(--color-content-neutral,oklch(48.26% .0365 255.09));display:inline-block;font-family:inherit;font-size:75%;font-weight:600;line-height:1;min-width:1.4rem;padding:.3rem;text-align:center;vertical-align:baseline;width:fit-content;&:not(:last-of-type){margin-inline-end:1px}}[dir=rtl] :where(kbd:not(:last-of-type),.kbd:not(:last-of-type)){margin-inline-end:0;margin-inline-start:1px}.label,:where(label):not(.unstyle){user-select:none;width:-moz-fit-content;width:fit-content}.legend,:where(legend):not(.unstyle){display:block;max-width:100%;white-space:normal}.badge,:where(mark):not(.unstyle){align-items:center;background-color:var(--color-field-surface,oklch(91.79% .0029 264.26));border-radius:100px;color:var(--color-field-inverse,oklch(16.6% .026 267));display:inline-flex;font-size:.75rem;font-weight:500;gap:.25rem;height:fit-content;justify-content:center;line-height:1;padding:var(--spacing,.25rem) calc(var(--spacing, .25rem)*1.5);width:fit-content;&:has(svg:only-child){padding:var(--spacing,.25rem) calc(var(--spacing, .25rem)*1)}}:where(ol):not(nav ol):not(menu ol):not(.unstyle){list-style-type:decimal}:where(ul):not(nav ul):not(menu ul):not(.unstyle){list-style-type:disc}:where(ol):not(nav ol):not(menu ol):not(.unstyle),:where(ul):not(nav ul):not(menu ul):not(.unstyle){&:not(:has(input[type=checkbox])){padding-inline-start:1.75ch}& li{padding-inline-start:1ch;&:not(:last-of-type){margin-bottom:1.25ch}&:has([x-icon]){display:inherit;list-style:none;position:relative;& [x-icon]{left:-1.75ch;position:absolute;top:.45ch}}&:has(input[type=checkbox]){display:inherit;list-style:none;position:relative;& input[type=checkbox]{left:-1ch;position:absolute;top:.45ch}}}}[dir=rtl] :where(ol):not(nav ol):not(menu ol):not(.unstyle),[dir=rtl] :where(ul):not(nav ul):not(menu ul):not(.unstyle){& li:has([x-icon]){& [x-icon]{left:auto;right:-1.75ch}}& li:has(input[type=checkbox]){& input[type=checkbox]{left:auto;right:-1.25ch}}}:where(ol,ul):not(nav ol):not(menu ol):not(.unstyle) ul,:where(ol,ul):not(nav ul):not(menu ul):not(.unstyle) ol{margin-top:1ch;padding-inline-start:2.75ch;&+li{margin-top:1.5ch}}:where(span):not(.unstyle){vertical-align:middle}}@layer utilities{:where(.center){align-items:center;justify-content:center}:where(.row,.row-wrap,.col,.col-wrap){display:flex}:where(.col){flex-flow:column nowrap}:where(.col-wrap){flex-flow:column wrap}:where(.row){flex-flow:row nowrap}:where(.row-wrap){flex-flow:row wrap}:where(.content){margin-inline-end:auto;margin-inline-start:auto;max-width:100%;width:var(--spacing-content-width,68.75rem)}:where(.ghost){background-color:transparent;color:var(--color-content-stark,oklch(16.6% .026 267));&:hover{background-color:var(--color-field-surface,oklch(91.79% .0029 264.26))}&.brand:hover{color:var(--color-brand-inverse,#763518)}&.accent:hover{color:var(--color-accent-inverse,oklch(100% 0 0))}&.negative:hover{color:var(--color-negative-inverse,#fff)}}:where(.hug){height:fit-content;min-width:0;padding:0;width:fit-content}:where(.outlined){border-color:color-mix(in oklch,var(--color-field-surface,oklch(91.79% .0029 264.26)) 90%,var(--color-field-inverse,oklch(16.6% .026 267)));border-style:solid;border-width:1px}.dark :where(.outlined){border-color:color-mix(in oklch,var(--color-field-surface,oklch(91.79% .0029 264.26)) 80%,var(--color-field-inverse,oklch(16.6% .026 267)))}:where(.selected){background-color:color-mix(in oklch,var(--color-field-surface,oklch(91.79% .0029 264.26)) 25%,transparent)}:where(.transparent){background-color:transparent!important;color:var(--color-content-neutral,oklch(48.26% .0365 255.09));&:hover{color:var(--color-content-stark,oklch(16.6% .026 267))}}:where(.lg){--spacing-field-height:2.5rem;--spacing-field-padding:0.78rem;font-size:125%}:where(.sm){--spacing-field-height:1.5rem;--spacing-field-padding:0.49rem;font-size:75%;&::picker-icon{line-height:.2}}:where(body.page){display:flex;flex-direction:column;min-height:100vh}.page{&>footer,&>header{z-index:30}&>footer,&>header,&>main{padding-inline-end:var(--spacing-viewport-padding,5vw);padding-inline-start:var(--spacing-viewport-padding,5vw)}&>footer nav,&>header nav,&>main>section:not(.banner,.overlay-dark,.overlay-light){margin-inline-end:auto;margin-inline-start:auto;max-width:100%;width:var(--spacing-content-width,68.75rem)}&>footer{margin-top:auto}}.no-focus:focus,.no-focus:focus-visible,.no-focus:focus-within{box-shadow:0 0 0 0 transparent}:where(.no-scrollbar){-ms-overflow-style:none;scrollbar-width:none;&::-webkit-scrollbar{display:none}}:where(.overlay-dark,.overlay-light){position:relative;&:after{content:"";height:100%;left:0;position:absolute;top:0;width:100%;z-index:0}>*{position:relative;z-index:1}}:where(.overlay-dark){color:#fff!important;&:after{background:oklch(0 0 0/50%)}}:where(.overlay-light){color:#000!important;&:after{background:oklch(100% 0 0/75%)}}:where(.prose){max-width:100%;width:65ch;& aside:not([popover]){background-color:color-mix(in oklch,var(--color-field-surface,oklch(91.79% .0029 264.26)) 20%,transparent);border:1px solid color-mix(in oklch,var(--color-field-surface,oklch(91.79% .0029 264.26)) 30%,transparent);border-radius:calc(var(--radius, .5rem)*2);color:var(--color-content-stark,oklch(16.6% .026 267));margin-top:1.4rem;padding:1rem;&:not(.frame) *{color:inherit}&:has([x-icon]):not(.frame){display:flex;flex-direction:row;gap:1rem;& [x-icon]{font-size:1.25rem;padding-top:.25rem}}}&>a:not(:where(h1,h2,h3,h4,h5,h6,p,small,figcaption,label,li,blockquote,pre code,code,kbd,span,mark,[role=button]) a){margin-top:1.4rem}&>blockquote{margin-top:2rem;& *{margin:0}}&>figcaption{margin-top:1rem}&>figure{margin-top:1.4rem;& img{margin:0}}&>h1+p{color:var(--color-content-neutral,oklch(48.26% .0365 255.09));font-size:1.125rem;margin-top:.625rem}&>h2{margin-bottom:.6667rem;margin-top:1rem}&>h3{margin-top:2.4rem}&>h4{margin-top:3rem}&>h4+p{margin-top:.25rem}&>h5{margin-top:1rem}&>h5,&>h6{margin-bottom:1rem}&>h6{margin-top:2rem}&>hr{margin-bottom:3rem;margin-top:3rem}&>img,&>p{margin-top:1.4rem}&>ol,&>small,&>ul{margin-top:1rem}&>pre,&>table,&>x-code,&>x-code-group{margin-bottom:2rem;margin-top:2rem}&>x-code pre,&>x-code-group x-code{margin-bottom:0;margin-top:0}}:where(.trailing){color:var(--color-content-neutral,oklch(48.26% .0365 255.09));display:inline-block;margin-inline-start:auto}:where(.brand){--color-field-surface:var(--color-brand-surface,#f6c07b);--color-field-surface-hover:var(--color-brand-surface-hover,#f19b46);--color-field-inverse:var(--color-brand-inverse,#763518);--color-content-stark:var(--color-brand-content,#de6618);--color-content-neutral:color-mix(in oklch,var(--color-brand-content,#de6618) 85%,transparent);--color-content-subtle:color-mix(in oklch,var(--color-brand-content,#de6618) 70%,transparent)}:where(.accent){--color-field-surface:var(--color-accent-surface,oklch(16.6% 0.026 267));--color-field-surface-hover:var(--color-accent-surface-hover,oklch(28.7% 0.030787 270.1));--color-field-inverse:var(--color-accent-inverse,oklch(100% 0 0));--color-content-stark:var(--color-accent-content,oklch(16.6% 0.026 267));--color-content-neutral:color-mix(in oklch,var(--color-accent-content,oklch(16.6% 0.026 267)) 85%,transparent);--color-content-subtle:color-mix(in oklch,var(--color-accent-content,oklch(16.6% 0.026 267)) 70%,transparent)}:where(.negative){--color-field-surface:var(--color-negative-surface,#ef4444);--color-field-surface-hover:var(--color-negative-surface-hover,#dc2626);--color-field-inverse:var(--color-negative-inverse,#fff);--color-content-stark:var(--color-negative-content,#ef4444);--color-content-neutral:color-mix(in oklch,var(--color-negative-content,#ef4444) 85%,transparent);--color-content-subtle:color-mix(in oklch,var(--color-negative-content,#ef4444) 70%,transparent)}:where(.positive){--color-field-surface:var(--color-positive-surface,#16a34a);--color-field-surface-hover:var(--color-positive-surface-hover,#166534);--color-field-inverse:var(--color-positive-inverse,#fff);--color-content-stark:var(--color-positive-content,#16a34a);--color-content-neutral:color-mix(in oklch,var(--color-positive-content,#16a34a) 85%,transparent);--color-content-subtle:color-mix(in oklch,var(--color-positive-content,#16a34a) 70%,transparent)}:where(.stark){color:var(--color-content-stark,oklch(16.6% .026 267))}:where(.neutral){color:var(--color-content-neutral,oklch(48.26% .0365 255.09))}:where(.subtle){color:var(--color-content-subtle,oklch(67.4% .0318 251.27))}}