@paraxe/design 1.3.0 → 1.4.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/.loba-build.json +3 -3
- package/dist/index.css +1 -1
- package/dist/index.d.ts.map +1 -1
- package/package.json +2 -1
- package/src/components.css +10 -4
- package/src/index.ts +0 -1
- package/src/style.css +5 -0
package/dist/.loba-build.json
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@paraxe/design",
|
|
3
|
-
"version": "1.
|
|
4
|
-
"buildTimestamp": "2026-08-
|
|
3
|
+
"version": "1.4.2",
|
|
4
|
+
"buildTimestamp": "2026-08-18T20:51:33.402Z",
|
|
5
5
|
"gitSha": null,
|
|
6
|
-
"sourceHash": "
|
|
6
|
+
"sourceHash": "510b70a699d2602d",
|
|
7
7
|
"files": [
|
|
8
8
|
"index.css",
|
|
9
9
|
"index.d.ts",
|
package/dist/index.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@import"https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@200;300;400;500;600;700;800&family=JetBrains+Mono:wght@300;400;500;600;700;800&display=swap";:root{--space-0: 0px;--space-px: 1px;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-7: 1.75rem;--space-8: 2rem;--space-9: 2.25rem;--space-10: 2.5rem;--space-11: 2.75rem;--space-12: 3rem;--space-14: 3.5rem;--space-16: 4rem;--space-20: 5rem;--space-24: 6rem;--space-28: 7rem;--space-32: 8rem;--space-36: 9rem;--space-40: 10rem;--space-44: 11rem;--space-48: 12rem;--space-52: 13rem;--space-56: 14rem;--space-60: 15rem;--space-64: 16rem;--space-72: 18rem;--space-80: 20rem;--space-96: 24rem;--section-spacing: var(--space-24);--section-spacing-sm: var(--space-16);--section-spacing-lg: var(--space-32);--container-padding: var(--space-6);--container-padding-lg: var(--space-8);--stack-gap: var(--space-4);--stack-gap-sm: var(--space-2);--stack-gap-lg: var(--space-8);--inline-gap: var(--space-3);--inline-gap-sm: var(--space-2);--inline-gap-lg: var(--space-6);--grid-gap: var(--space-6);--grid-gap-sm: var(--space-4);--grid-gap-lg: var(--space-8);--grid-min: 16rem;--container-max-width: 1280px;--container-wide: 1440px;--container-narrow: 768px;--container-gutter: 1.5rem;--container-gutter-lg: 2rem;--content-width-narrow: 65ch;--content-width-readable: 72ch;--content-width-wide: 80ch;--section-inner-max-width: var(--container-max-width);--section-header-max-width: 720px;--section-header-wide-max-width: 1000px;--section-header-gap: var(--space-4);--section-header-title-gap: var(--space-3);--section-header-description-gap: var(--space-4);--section-header-margin-bottom: var(--space-16);--section-header-margin-bottom-sm: var(--space-12);--section-header-margin-bottom-lg: var(--space-20);--section-content-gap: var(--space-12);--section-radius: var(--radius-3xl);--section-bg-inverse: var(--text-primary);--section-bg-base: var(--background-secondary);--section-bg-raised: var(--surface-raised);--section-bg-surface: var(--surface-card);--section-bg-subtle: var(--surface-base);--section-bg-brand: var(--brand-primary-muted);--z-base: 0;--z-floor: 10;--z-sticky: 30;--z-navbar: 50;--z-dropdown: 70;--z-overlay: 80;--z-modal: 90;--z-popover: 95;--z-tooltip: 100;--font-family-display: "Plus Jakarta Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans";--font-family-body: "Plus Jakarta Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans";--font-family-mono: "JetBrains Mono", "Fira Code", monospace;--font-weight-light: 300;--font-weight-regular: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-weight-extrabold: 800;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 1.875rem;--font-size-4xl: 2.25rem;--font-size-5xl: 3rem;--font-size-6xl: 3.75rem;--font-size-7xl: 4.5rem;--font-size-8xl: 6rem;--font-size-9xl: 8rem;--line-height-none: 1;--line-height-tight: 1.1;--line-height-snug: 1.25;--line-height-normal: 1.5;--line-height-relaxed: 1.625;--line-height-loose: 2;--letter-spacing-tighter: -.04em;--letter-spacing-tight: -.025em;--letter-spacing-normal: 0em;--letter-spacing-wide: .025em;--letter-spacing-wider: .05em;--letter-spacing-widest: .1em;--typography-display-size: var(--font-size-8xl);--typography-display-weight: var(--font-weight-extrabold);--typography-display-lineheight: var(--line-height-tight);--typography-display-letterspacing: var(--letter-spacing-tighter);--typography-h1-size: var(--font-size-6xl);--typography-h2-size: var(--font-size-4xl);--typography-h3-size: var(--font-size-3xl);--typography-h4-size: var(--font-size-2xl);--typography-heading-weight: var(--font-weight-semibold);--typography-heading-lineheight: var(--line-height-tight);--typography-heading-letterspacing: var(--letter-spacing-tight);--typography-lead-size: var(--font-size-xl);--typography-lead-lineheight: var(--line-height-relaxed);--typography-lead-weight: var(--font-weight-regular);--typography-body-size: var(--font-size-base);--typography-body-lineheight: var(--line-height-normal);--typography-body-weight: var(--font-weight-regular);--typography-body-large-size: var(--font-size-lg);--typography-body-large-lineheight: var(--line-height-relaxed);--typography-caption-size: var(--font-size-sm);--typography-caption-lineheight: var(--line-height-normal);--typography-overline-size: var(--font-size-xs);--typography-overline-lineheight: var(--line-height-snug);--typography-overline-weight: var(--font-weight-semibold);--typography-overline-letterspacing: var(--letter-spacing-wider);--typography-eyebrow-size: var(--font-size-sm);--typography-eyebrow-lineheight: var(--line-height-none);--typography-eyebrow-weight: var(--font-weight-bold);--typography-eyebrow-letterspacing: var(--letter-spacing-wider);--typography-label-size: var(--font-size-sm);--typography-label-lineheight: var(--line-height-snug);--typography-label-weight: var(--font-weight-semibold);--typography-label-letterspacing: var(--letter-spacing-wide);--typography-section-title-size: var(--font-size-5xl);--typography-section-title-lineheight: var(--line-height-tight);--typography-section-title-weight: var(--font-weight-bold);--typography-section-title-letterspacing: var(--letter-spacing-tight);--typography-section-description-size: var(--font-size-base);--typography-section-description-lineheight: var(--line-height-relaxed);--typography-nav-size: var(--font-size-sm);--typography-nav-weight: var(--font-weight-medium);--typography-button-size: var(--font-size-sm);--typography-button-weight: var(--font-weight-medium);--typography-button-lineheight: var(--line-height-none);--typography-code-size: var(--font-size-sm);--radius-none: 0px;--radius-sm: .125rem;--radius-base: .25rem;--radius-md: .375rem;--radius-lg: .5rem;--radius-xl: .75rem;--radius-2xl: 1rem;--radius-3xl: 1.5rem;--radius-full: 9999px;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow-base: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--shadow-xl: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / .25);--shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 / .05);--motion-duration-fast: .15s;--motion-duration-normal: .3s;--motion-duration-slow: .5s;--motion-duration-slower: .7s;--motion-duration-slowest: 1s;--motion-ease-in: cubic-bezier(.4, 0, 1, 1);--motion-ease-out: cubic-bezier(0, 0, .2, 1);--motion-ease-in-out: cubic-bezier(.4, 0, .2, 1);--motion-ease-spring: cubic-bezier(.175, .885, .32, 1.275);--motion-ease-smooth: cubic-bezier(.22, 1, .36, 1);--motion-fast: var(--motion-duration-fast) var(--motion-ease-out);--motion-normal: var(--motion-duration-normal) var(--motion-ease-smooth);--motion-slow: var(--motion-duration-slow) var(--motion-ease-smooth);--motion-slower: var(--motion-duration-slower) var(--motion-ease-smooth);--ease-standard: var(--motion-ease-out);--ease-smooth: var(--motion-ease-smooth);--ease-spring: var(--motion-ease-spring);--transition-fast: all var(--motion-duration-fast) var(--motion-ease-out);--transition-normal: all var(--motion-duration-normal) var(--motion-ease-smooth);--transition-slow: all var(--motion-duration-slow) var(--motion-ease-smooth);--alert-info-background: color-mix( in srgb, var(--color-info) 10%, transparent );--alert-info-border: color-mix( in srgb, var(--color-info) 28%, transparent );--alert-info-text: var(--color-info);--alert-success-background: color-mix( in srgb, var(--color-success) 10%, transparent );--alert-success-border: color-mix( in srgb, var(--color-success) 28%, transparent );--alert-success-text: var(--color-success);--alert-warning-background: color-mix( in srgb, var(--color-warning) 10%, transparent );--alert-warning-border: color-mix( in srgb, var(--color-warning) 28%, transparent );--alert-warning-text: var(--color-warning);--alert-danger-background: color-mix( in srgb, var(--color-danger) 10%, transparent );--alert-danger-border: color-mix( in srgb, var(--color-danger) 28%, transparent );--alert-danger-text: var(--color-danger);--badge-background: color-mix( in srgb, var(--surface-raised), var(--text-primary) 8% );--badge-border: var(--border-default);--badge-text: var(--text-secondary);--badge-default-background: color-mix( in srgb, var(--surface-raised), var(--text-primary) 8% );--badge-default-border: var(--border-default);--badge-default-text: var(--text-secondary);--badge-success-background: color-mix( in srgb, var(--color-success) 10%, transparent );--badge-success-border: color-mix( in srgb, var(--color-success) 28%, transparent );--badge-success-text: var(--color-success);--badge-warning-background: color-mix( in srgb, var(--color-warning) 10%, transparent );--badge-warning-border: color-mix( in srgb, var(--color-warning) 28%, transparent );--badge-warning-text: var(--color-warning);--badge-danger-background: color-mix( in srgb, var(--color-danger) 10%, transparent );--badge-danger-border: color-mix( in srgb, var(--color-danger) 28%, transparent );--badge-danger-text: var(--color-danger);--badge-info-background: color-mix( in srgb, var(--color-info) 10%, transparent );--badge-info-border: color-mix( in srgb, var(--color-info) 28%, transparent );--badge-info-text: var(--color-info);--badge-brand-background: color-mix( in srgb, var(--brand-primary) 10%, transparent );--badge-brand-border: color-mix( in srgb, var(--brand-primary) 28%, transparent );--badge-brand-text: var(--brand-primary);--tag-background: var(--surface-raised);--tag-border: var(--border-subtle);--tag-text: var(--text-muted);--button-radius: var(--radius-full);--button-padding-x: 1.5rem;--button-padding-y: .75rem;--button-padding-x-sm: 1rem;--button-padding-y-sm: .5rem;--button-padding-x-lg: 2rem;--button-padding-y-lg: 1rem;--button-gap: .5rem;--button-min-height: 44px;--button-min-height-sm: 36px;--button-min-height-lg: 52px;--button-icon-size: 1rem;--button-icon-size-sm: .875rem;--button-icon-size-lg: 1.125rem;--card-radius: var(--radius-lg);--card-padding: var(--space-6);--card-padding-sm: var(--space-4);--card-padding-lg: var(--space-8);--card-content-gap: var(--space-4);--badge-radius: var(--radius-full);--badge-padding-x: var(--space-3);--badge-padding-y: var(--space-1);--badge-gap: var(--space-1);--badge-min-height: 24px;--tag-radius: var(--radius-md);--tag-padding-x: var(--space-2);--tag-padding-y: var(--space-1);--tag-gap: var(--space-1);--tag-min-height: 24px;--nav-height: 4.5rem;--nav-height-sm: 4rem;--nav-padding-x: var(--container-padding);--nav-padding-x-lg: var(--container-padding-lg);--nav-blur: 12px;--nav-link-padding-x: .75rem;--nav-link-padding-y: .5rem;--nav-link-radius: var(--radius-md);--nav-gap: var(--space-2);--nav-content-gap: var(--space-8);--form-height: 44px;--form-height-sm: 36px;--form-height-lg: 52px;--form-padding-x: 1rem;--form-padding-y: .75rem;--form-radius: var(--radius-md);--form-gap: var(--space-2);--form-label-gap: var(--space-2);--form-field-gap: var(--space-4);--form-textarea-min-height: 120px;--media-radius: var(--radius-lg);--media-radius-sm: var(--radius-md);--media-radius-lg: var(--radius-2xl);--media-aspect-square: 1 / 1;--media-aspect-video: 16 / 9;--media-aspect-wide: 21 / 9;--media-aspect-portrait: 4 / 5;--media-aspect-tall: 3 / 4;--icon-size-xs: .75rem;--icon-size-sm: 1rem;--icon-size-md: 1.25rem;--icon-size-lg: 1.5rem;--icon-size-xl: 2rem;--icon-button-size-sm: 36px;--icon-button-size: 44px;--icon-button-size-lg: 52px;--focus-ring-width: 2px;--focus-ring-offset: 2px;--focus-ring-offset-lg: 4px;--breakpoint-sm: 640px;--breakpoint-md: 768px;--breakpoint-lg: 1024px;--breakpoint-xl: 1280px;--breakpoint-2xl: 1536px;--prose-measure: 65ch;--prose-measure-wide: 75ch;--text-max-width-sm: 36rem;--text-max-width-md: 48rem;--text-max-width-lg: 64rem;--grid-min-width-sm: 12rem;--grid-min-width: 16rem;--grid-min-width-lg: 20rem;--interaction-lift-sm: -1px;--interaction-lift: -2px;--interaction-lift-lg: -4px;--interaction-scale-sm: .98;--interaction-scale: .97;--interaction-opacity-disabled: .5}:root{--brand-primary: #6366f1;--brand-primary-hover: #4f46e5;--brand-primary-active: #4338ca;--brand-primary-light: #a5b4fc;--brand-primary-muted: color-mix(in srgb, var(--brand-primary) 15%, transparent);--brand-glow: color-mix(in srgb, var(--brand-primary) 25%, transparent);--text-on-brand: #ffffff;--color-success: #22c55e;--color-warning: #f59e0b;--color-danger: #ef4444;--color-info: #3b82f6;--background-primary: #09090b;--background-secondary: color-mix(in srgb, var(--background-primary) 92%, white);--surface-base: color-mix(in srgb, var(--background-primary) 92%, white);--surface-raised: color-mix(in srgb, var(--background-primary) 84%, white);--surface-card: color-mix(in srgb, var(--background-primary) 88%, white);--surface-hover: color-mix(in srgb, var(--background-primary) 84%, white);--surface-elevated-1: color-mix(in srgb, var(--background-primary) 84%, white);--surface-elevated-2: color-mix(in srgb, var(--background-primary) 76%, white);--surface-elevated-3: color-mix(in srgb, var(--background-primary) 68%, white);--surface-glass: color-mix(in srgb, white 6%, transparent);--surface-glass-strong: color-mix(in srgb, white 10%, transparent);--text-primary: color-mix(in srgb, white 96%, transparent);--text-secondary: color-mix(in srgb, white 72%, transparent);--text-muted: color-mix(in srgb, white 54%, transparent);--text-inverse: color-mix(in srgb, white 96%, black);--text-accent: var(--brand-primary);--text-link: var(--brand-primary);--text-link-hover: var(--brand-primary-hover);--border-default: color-mix(in srgb, white 12%, transparent);--border-strong: color-mix(in srgb, white 20%, transparent);--border-subtle: color-mix(in srgb, white 6%, transparent);--border-focus: color-mix(in srgb, var(--brand-primary) 45%, transparent);--glass-background: color-mix(in srgb, white 6%, transparent);--glass-border: color-mix(in srgb, white 14%, transparent);--overlay-scrim: color-mix(in srgb, black 60%, transparent);--overlay-scrim-strong: color-mix(in srgb, black 75%, transparent);--focus-ring-color: var(--border-focus);--selection-background: var(--brand-primary);--selection-text: #ffffff;--button-primary-bg: var(--brand-primary);--button-primary-text: var(--text-on-brand);--button-primary-border: transparent;--button-primary-hover-bg: var(--brand-primary-hover);--button-primary-hover-border: transparent;--button-primary-active-bg: var(--brand-primary-active);--button-primary-disabled-bg: color-mix(in srgb, var(--brand-primary) 30%, transparent);--button-primary-disabled-text: color-mix(in srgb, var(--text-primary) 40%, transparent);--button-secondary-bg: color-mix(in srgb, var(--surface-base), var(--text-primary) 10%);--button-secondary-text: var(--text-primary);--button-secondary-border: var(--border-default);--button-secondary-hover-bg: color-mix(in srgb, var(--surface-raised), var(--text-primary) 14%);--button-secondary-hover-border: var(--border-strong);--button-secondary-active-bg: color-mix(in srgb, var(--surface-raised), var(--text-primary) 20%);--button-secondary-disabled-bg: color-mix(in srgb, var(--surface-base), var(--text-primary) 2%);--button-secondary-disabled-text: var(--text-muted);--button-secondary-disabled-border: color-mix(in srgb, var(--border-default), transparent 30%);--button-ghost-bg: transparent;--button-ghost-text: var(--text-primary);--button-ghost-border: transparent;--button-ghost-hover-bg: color-mix(in srgb, var(--surface-base), var(--text-primary) 6%);--button-ghost-hover-border: transparent;--button-ghost-active-bg: color-mix(in srgb, var(--surface-base), var(--text-primary) 12%);--button-ghost-disabled-text: var(--text-muted);--button-outline-bg: transparent;--button-outline-text: var(--text-primary);--button-outline-border: var(--border-strong);--button-outline-hover-bg: color-mix(in srgb, var(--surface-base), var(--text-primary) 6%);--button-outline-hover-border: var(--border-focus);--button-outline-active-bg: color-mix(in srgb, var(--surface-base), var(--text-primary) 12%);--button-outline-disabled-text: var(--text-muted);--button-outline-disabled-border: var(--border-default);--button-destructive-bg: color-mix(in srgb, var(--color-danger) 14%, transparent);--button-destructive-text: color-mix(in srgb, var(--color-danger) 80%, white);--button-destructive-border: color-mix(in srgb, var(--color-danger) 20%, transparent);--button-destructive-hover-bg: color-mix(in srgb, var(--color-danger) 20%, transparent);--button-destructive-hover-border: color-mix(in srgb, var(--color-danger) 28%, transparent);--button-destructive-active-bg: color-mix(in srgb, var(--color-danger) 26%, transparent);--button-destructive-disabled-bg: color-mix(in srgb, var(--color-danger) 6%, transparent);--button-destructive-disabled-text: color-mix(in srgb, var(--color-danger) 40%, transparent);--card-background: var(--surface-card);--card-background-hover: var(--surface-hover);--card-gradient: linear-gradient( 180deg, color-mix(in srgb, var(--brand-primary) 10%, transparent), transparent 40% );--card-highlight: inset 0 1px 0 0 color-mix(in srgb, white 10%, transparent);--card-highlight-inset: inset 0 1px 0 0 color-mix(in srgb, white 10%, transparent);--card-border: var(--border-default);--card-border-hover: color-mix(in srgb, var(--brand-primary) 30%, transparent);--card-shadow: color-mix(in srgb, var(--brand-primary) 12%, rgba(0, 0, 0, .7));--card-shadow-hover: color-mix(in srgb, var(--brand-primary) 18%, rgba(0, 0, 0, .8));--nav-background: color-mix(in srgb, var(--background-primary) 80%, transparent);--nav-border: var(--border-default);--nav-link: var(--text-secondary);--nav-link-hover: var(--text-primary);--nav-link-active: var(--text-primary);--nav-link-active-border: var(--brand-primary);--nav-focus-ring: var(--border-focus);--form-background: color-mix(in srgb, var(--surface-base), var(--text-primary) 3%);--form-border: var(--border-default);--form-border-hover: var(--border-strong);--form-border-focus: var(--border-focus);--form-border-error: var(--color-danger);--form-border-success: var(--color-success);--form-text: var(--text-primary);--form-text-muted: var(--text-muted);--form-text-error: var(--color-danger);--form-text-success: var(--color-success);--form-placeholder: var(--text-muted);--form-bg-disabled: color-mix(in srgb, var(--surface-base), var(--text-primary) 2%);--form-border-disabled: color-mix(in srgb, var(--border-default), transparent 30%);--form-text-disabled: var(--text-muted);--alert-info-background: color-mix( in srgb, var(--color-info) 10%, transparent );--alert-info-border: color-mix( in srgb, var(--color-info) 28%, transparent );--alert-info-text: var(--color-info);--alert-success-background: color-mix( in srgb, var(--color-success) 10%, transparent );--alert-success-border: color-mix( in srgb, var(--color-success) 28%, transparent );--alert-success-text: var(--color-success);--alert-warning-background: color-mix( in srgb, var(--color-warning) 10%, transparent );--alert-warning-border: color-mix( in srgb, var(--color-warning) 28%, transparent );--alert-warning-text: var(--color-warning);--alert-danger-background: color-mix( in srgb, var(--color-danger) 10%, transparent );--alert-danger-border: color-mix( in srgb, var(--color-danger) 28%, transparent );--alert-danger-text: var(--color-danger);--badge-background: color-mix( in srgb, var(--surface-raised), var(--text-primary) 8% );--badge-border: var(--border-default);--badge-text: var(--text-secondary);--badge-default-background: color-mix( in srgb, var(--surface-raised), var(--text-primary) 8% );--badge-default-border: var(--border-default);--badge-default-text: var(--text-secondary);--badge-success-background: color-mix( in srgb, var(--color-success) 10%, transparent );--badge-success-border: color-mix( in srgb, var(--color-success) 28%, transparent );--badge-success-text: var(--color-success);--badge-warning-background: color-mix( in srgb, var(--color-warning) 10%, transparent );--badge-warning-border: color-mix( in srgb, var(--color-warning) 28%, transparent );--badge-warning-text: var(--color-warning);--badge-danger-background: color-mix( in srgb, var(--color-danger) 10%, transparent );--badge-danger-border: color-mix( in srgb, var(--color-danger) 28%, transparent );--badge-danger-text: var(--color-danger);--badge-info-background: color-mix( in srgb, var(--color-info) 10%, transparent );--badge-info-border: color-mix( in srgb, var(--color-info) 28%, transparent );--badge-info-text: var(--color-info);--badge-brand-background: color-mix( in srgb, var(--brand-primary) 10%, transparent );--badge-brand-border: color-mix( in srgb, var(--brand-primary) 28%, transparent );--badge-brand-text: var(--brand-primary);--tag-background: var(--surface-raised);--tag-border: var(--border-subtle);--tag-text: var(--text-muted);--footer-background: color-mix(in srgb, var(--surface-base), var(--text-primary) 3%);--footer-border: var(--border-default);--footer-text: var(--text-muted);--footer-link: var(--text-secondary);--footer-link-hover: var(--text-primary);--shadow-elevation-low: 0 2px 8px color-mix(in srgb, var(--brand-primary) 10%, rgba(0, 0, 0, .6));--shadow-elevation-medium: 0 4px 24px color-mix(in srgb, var(--brand-primary) 14%, rgba(0, 0, 0, .7));--shadow-elevation-high: 0 8px 40px color-mix(in srgb, var(--brand-primary) 18%, rgba(0, 0, 0, .8));--shadow-elevation-modal: 0 20px 60px color-mix(in srgb, var(--brand-primary) 22%, rgba(0, 0, 0, .9))}[data-theme=light]{--brand-primary: #6366f1;--brand-primary-hover: #4f46e5;--brand-primary-active: #4338ca;--brand-primary-light: #c7d2fe;--brand-primary-muted: color-mix(in srgb, var(--brand-primary) 12%, transparent);--brand-glow: color-mix(in srgb, var(--brand-primary) 18%, transparent);--text-on-brand: #ffffff;--background-primary: #ffffff;--background-secondary: color-mix(in srgb, var(--background-primary) 95%, black);--surface-base: color-mix(in srgb, var(--background-primary) 93%, black);--surface-raised: color-mix(in srgb, var(--background-primary) 86%, black);--surface-card: color-mix(in srgb, var(--background-primary) 97%, black);--surface-hover: color-mix(in srgb, var(--background-primary) 90%, black);--surface-elevated-1: color-mix(in srgb, var(--background-primary) 86%, black);--surface-elevated-2: color-mix(in srgb, var(--background-primary) 78%, black);--surface-elevated-3: color-mix(in srgb, var(--background-primary) 70%, black);--surface-glass: color-mix(in srgb, white 60%, transparent);--surface-glass-strong: color-mix(in srgb, white 75%, transparent);--text-primary: color-mix(in srgb, black 92%, white);--text-secondary: color-mix(in srgb, black 70%, white);--text-muted: color-mix(in srgb, black 55%, white);--text-inverse: color-mix(in srgb, white 96%, black);--text-accent: var(--brand-primary);--text-link: var(--brand-primary);--text-link-hover: var(--brand-primary-hover);--border-default: color-mix(in srgb, var(--text-primary) 12%, transparent);--border-strong: color-mix(in srgb, var(--text-primary) 20%, transparent);--border-subtle: color-mix(in srgb, var(--text-primary) 6%, transparent);--border-focus: color-mix(in srgb, var(--brand-primary) 40%, transparent);--glass-background: color-mix(in srgb, white 60%, transparent);--glass-border: color-mix(in srgb, black 12%, transparent);--overlay-scrim: color-mix(in srgb, black 40%, transparent);--overlay-scrim-strong: color-mix(in srgb, black 60%, transparent);--focus-ring-color: var(--border-focus);--selection-background: var(--brand-primary);--selection-text: #ffffff;--nav-background: color-mix(in srgb, var(--background-primary) 80%, transparent);--button-secondary-bg: color-mix(in srgb, var(--surface-base), var(--text-primary) 5%);--button-secondary-hover-bg: color-mix(in srgb, var(--surface-raised), var(--text-primary) 8%);--button-secondary-active-bg: color-mix(in srgb, var(--surface-raised), var(--text-primary) 12%);--button-ghost-hover-bg: color-mix(in srgb, var(--surface-base), var(--text-primary) 5%);--button-ghost-active-bg: color-mix(in srgb, var(--surface-base), var(--text-primary) 10%);--button-outline-hover-bg: color-mix(in srgb, var(--surface-base), var(--text-primary) 5%);--button-outline-active-bg: color-mix(in srgb, var(--surface-base), var(--text-primary) 10%);--button-destructive-bg: color-mix(in srgb, var(--color-danger) 10%, transparent);--button-destructive-text: var(--color-danger);--button-destructive-border: color-mix(in srgb, var(--color-danger) 18%, transparent);--card-gradient: linear-gradient( 180deg, color-mix(in srgb, var(--brand-primary) 7%, transparent), transparent 40% );--card-highlight: inset 0 1px 0 0 color-mix(in srgb, white 24%, transparent);--card-highlight-inset: inset 0 1px 0 0 color-mix(in srgb, white 24%, transparent);--card-border-hover: color-mix(in srgb, var(--brand-primary) 24%, transparent);--card-shadow: color-mix(in srgb, var(--brand-primary) 8%, rgba(0, 0, 0, .5));--card-shadow-hover: color-mix(in srgb, var(--brand-primary) 12%, rgba(0, 0, 0, .6));--form-background: color-mix(in srgb, var(--surface-base), var(--text-primary) 2%);--badge-background: color-mix(in srgb, var(--surface-raised), var(--text-primary) 5%);--shadow-elevation-low: 0 2px 8px color-mix(in srgb, var(--brand-primary) 6%, rgba(0, 0, 0, .4));--shadow-elevation-medium: 0 4px 24px color-mix(in srgb, var(--brand-primary) 8%, rgba(0, 0, 0, .5));--shadow-elevation-high: 0 8px 40px color-mix(in srgb, var(--brand-primary) 12%, rgba(0, 0, 0, .6));--shadow-elevation-modal: 0 20px 60px color-mix(in srgb, var(--brand-primary) 16%, rgba(0, 0, 0, .7))}:root{--font-family-display: "Plus Jakarta Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans";--font-family-body: "Plus Jakarta Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans";--font-family-mono: "JetBrains Mono", "Fira Code", monospace;--font-weight-light: 300;--font-weight-regular: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-weight-extrabold: 800;--font-size-base: 1rem;--space-4: 1rem;--radius-md: .5rem;--motion-duration-normal: .3s;--motion-ease-out: cubic-bezier(0, 0, .2, 1);--motion-ease-spring: cubic-bezier(.175, .885, .32, 1.275);--shadow-elevation-low: 0 2px 8px rgba(0, 0, 0, .15);--glass-blur: 16px;--button-radius: var(--radius-full);--button-padding-x: 1.5rem;--button-padding-y: .75rem;--card-radius: var(--radius-lg);--nav-height: 4.5rem}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--button-gap);min-height:var(--button-min-height);padding:var(--button-padding-y) var(--button-padding-x);border:1px solid transparent;border-radius:var(--button-radius);font-family:var(--font-family-body);font-size:var(--typography-button-size);font-weight:var(--typography-button-weight);line-height:var(--typography-button-lineheight);text-decoration:none;white-space:nowrap;-webkit-user-select:none;user-select:none;cursor:pointer;transition:background-color var(--motion-duration-fast) var(--motion-ease-out),border-color var(--motion-duration-fast) var(--motion-ease-out),color var(--motion-duration-fast) var(--motion-ease-out),transform var(--motion-duration-fast) var(--motion-ease-out),box-shadow var(--motion-duration-fast) var(--motion-ease-out)}.btn:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}.btn:disabled{cursor:not-allowed;pointer-events:none}.btn-primary{background:var(--button-primary-bg);color:var(--button-primary-text);border-color:var(--button-primary-border)}.btn-primary:hover{background:var(--button-primary-hover-bg);border-color:var(--button-primary-hover-border)}.btn-primary:active{background:var(--button-primary-active-bg)}.btn-primary:disabled{background:var(--button-primary-disabled-bg);color:var(--button-primary-disabled-text);border-color:var(--button-primary-disabled-border)}.btn-secondary{background:var(--button-secondary-bg);color:var(--button-secondary-text);border-color:var(--button-secondary-border)}.btn-secondary:hover{background:var(--button-secondary-hover-bg);border-color:var(--button-secondary-hover-border)}.btn-secondary:active{background:var(--button-secondary-active-bg)}.btn-secondary:disabled{background:var(--button-secondary-disabled-bg);color:var(--button-secondary-disabled-text);border-color:var(--button-secondary-disabled-border)}.btn-destructive{background:var(--button-destructive-bg);color:var(--button-destructive-text);border-color:var(--button-destructive-border)}.btn-destructive:hover{background:var(--button-destructive-hover-bg);border-color:var(--button-destructive-hover-border)}.btn-destructive:active{background:var(--button-destructive-active-bg)}.btn-destructive:disabled{background:var(--button-destructive-disabled-bg);color:var(--button-destructive-disabled-text);border-color:var(--button-destructive-disabled-border)}.btn-ghost{background:var(--button-ghost-bg);color:var(--button-ghost-text);border-color:var(--button-ghost-border)}.btn-ghost:hover{background:var(--button-ghost-hover-bg);border-color:var(--button-ghost-hover-border)}.btn-ghost:active{background:var(--button-ghost-active-bg)}.btn-ghost:disabled{background:var(--button-ghost-disabled-bg);color:var(--button-ghost-disabled-text);border-color:var(--button-ghost-disabled-border)}.btn-sm{min-height:var(--button-min-height-sm);padding:var(--button-padding-y-sm) var(--button-padding-x-sm);font-size:var(--font-size-xs)}.btn-md{min-height:var(--button-min-height);padding:var(--button-padding-y) var(--button-padding-x);font-size:var(--typography-button-size)}.btn-lg{min-height:var(--button-min-height-lg);padding:var(--button-padding-y-lg) var(--button-padding-x-lg);font-size:var(--font-size-base)}.btn-full{width:100%}.btn-icon-only{aspect-ratio:1;padding-inline:0}.btn-loading{cursor:wait;pointer-events:none}@media(prefers-reduced-motion:reduce){.btn{transition:none}}.accordion,.accordion-item{width:100%}.accordion-trigger{width:100%;display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);padding-block:var(--space-5);background:none;border:0;border-bottom:1px solid var(--border-subtle);color:var(--text-primary);font-family:var(--font-family-body);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);text-align:left;cursor:pointer;transition:var(--transition-fast)}.accordion-trigger:hover{color:var(--text-accent)}.accordion-trigger:focus-visible{outline:var(--focus-ring-width) solid var(--form-border-focus);outline-offset:var(--focus-ring-offset)}.accordion-trigger:disabled{color:var(--text-muted);cursor:not-allowed}.accordion-content{padding-block:var(--space-5);color:var(--text-secondary)}.divider{width:100%;border-top:1px solid var(--border-subtle)}.eyebrow{display:inline-flex;align-items:center;gap:var(--space-2);width:fit-content;color:var(--text-accent);font-family:var(--font-family-body);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);line-height:1;letter-spacing:var(--letter-spacing-wider);text-transform:uppercase}.eyebrow:before{content:"";width:.375rem;height:.375rem;flex:0 0 auto;border-radius:var(--radius-full);background:var(--brand-primary)}.label{display:inline-block;color:var(--text-muted);font-family:var(--font-family-body);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);line-height:var(--line-height-snug);letter-spacing:var(--letter-spacing-wide);text-transform:uppercase}.section-header{display:flex;flex-direction:column;align-items:flex-start;gap:var(--stack-gap);max-width:45rem;margin-bottom:var(--space-12)}.section-header--wide{max-width:62.5rem}.section-header--center{align-items:center;margin-inline:auto;text-align:center}.section-header--center .section-description{margin-inline:auto}.section-title{margin:0;max-width:18ch;color:var(--text-primary);font-family:var(--font-family-display);font-size:clamp(var(--font-size-3xl),4vw,var(--font-size-5xl));font-weight:var(--font-weight-bold);line-height:var(--line-height-tight);letter-spacing:var(--letter-spacing-tight);text-wrap:balance}.section-header--wide .section-title{max-width:24ch}.section-description{max-width:var(--content-width-narrow);margin:0;color:var(--text-secondary);font-family:var(--font-family-body);font-size:var(--font-size-base);font-weight:var(--font-weight-regular);line-height:var(--line-height-relaxed);text-wrap:pretty}.lead{max-width:42rem;margin:0;color:var(--text-secondary);font-family:var(--font-family-body);font-size:clamp(var(--font-size-lg),2vw,var(--font-size-xl));font-weight:var(--font-weight-regular);line-height:var(--line-height-relaxed);text-wrap:pretty}.body-large{color:var(--text-secondary);font-family:var(--font-family-body);font-size:var(--font-size-lg);line-height:var(--line-height-relaxed)}.button-group{display:flex;flex-wrap:wrap;align-items:center;gap:var(--inline-gap)}.button-group--center{justify-content:center}.button-group--end{justify-content:flex-end}.button-group--stack{flex-direction:column;align-items:stretch}.link-arrow{display:inline-flex;align-items:center;gap:var(--space-2);width:fit-content;color:var(--text-primary);font-family:var(--font-family-body);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);line-height:1;text-decoration:none;transition:color var(--motion-duration-fast) var(--motion-ease-out),gap var(--motion-duration-fast) var(--motion-ease-out)}.link-arrow:after{content:"→";transition:transform var(--motion-duration-fast) var(--motion-ease-out)}.link-arrow:hover{gap:var(--space-3);color:var(--text-accent)}.link-arrow:hover:after{transform:translate(.1875rem)}.link-arrow:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset);border-radius:var(--radius-sm)}.media{position:relative;overflow:hidden}.media img,.media video{display:block;width:100%;height:100%;object-fit:cover;border-radius:var(--media-radius)}.media-square{aspect-ratio:1 / 1}.media-video{aspect-ratio:16 / 9}.media-portrait{aspect-ratio:4 / 5}.media-wide{aspect-ratio:21 / 9}.media-contain img,.media-contain video{object-fit:contain}.prose{max-width:var(--content-width-narrow);color:var(--text-secondary);font-family:var(--font-family-body);font-size:var(--font-size-base);line-height:var(--line-height-relaxed)}.prose>*+*{margin-top:var(--space-6)}.prose h2,.prose h3,.prose h4{color:var(--text-primary);font-family:var(--font-family-display);letter-spacing:var(--letter-spacing-tight)}.prose h2{font-size:var(--font-size-3xl);line-height:var(--line-height-tight)}.prose h3{font-size:var(--font-size-2xl);line-height:var(--line-height-tight)}.prose h4{font-size:var(--font-size-xl);line-height:var(--line-height-snug)}.prose a{color:var(--text-link);text-decoration:underline;text-underline-offset:.2em}.prose a:hover{color:var(--text-link-hover)}.prose ul,.prose ol{padding-left:var(--space-6)}.prose li+li{margin-top:var(--space-2)}@media(max-width:768px){.section-header{margin-bottom:var(--space-8)}.section-title{max-width:100%;font-size:var(--font-size-3xl)}.section-header--wide .section-title{max-width:100%}.button-group--stack-mobile{flex-direction:column;align-items:stretch}.button-group--stack-mobile>.btn{width:100%}}.surface{width:100%}.surface-base{background:var(--surface-base)}.surface-raised{background:var(--surface-raised)}.surface-card{background:var(--surface-card)}.surface-elevated-1{background:var(--surface-elevated-1)}.surface-elevated-2{background:var(--surface-elevated-2)}.surface-elevated-3{background:var(--surface-elevated-3)}.surface-glass{background:var(--glass-background);border:1px solid var(--glass-border);backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-saturate));-webkit-backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-saturate));box-shadow:var( --card-highlight, inset 0 1px 0 0 rgb(255 255 255 / .08) )}.surface-glass-strong{background:var(--surface-glass-strong);border:1px solid var(--glass-border);backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-saturate));-webkit-backdrop-filter:blur(var(--glass-blur)) saturate(var(--glass-saturate));box-shadow:var( --card-highlight, inset 0 1px 0 0 rgb(255 255 255 / .08) )}.card{width:100%;padding:var(--card-padding);border-radius:var(--card-radius);background:var(--card-background);color:var(--text-primary)}.card-default{border:1px solid transparent}.card-outlined{border:1px solid var(--card-border)}.card-elevated{border:1px solid var(--card-border);box-shadow:var(--shadow-elevation-medium)}.card-interactive{border:1px solid var(--card-border);transition:border-color var(--motion-duration-normal) var(--motion-ease-out),box-shadow var(--motion-duration-normal) var(--motion-ease-out),transform var(--motion-duration-normal) var(--motion-ease-out)}.card-interactive:hover{border-color:var(--card-border-hover);box-shadow:var(--shadow-elevation-medium);transform:translateY(var(--interaction-lift))}.card-interactive:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}.card-selected{border:1px solid var(--border-focus);box-shadow:var(--shadow-elevation-low)}@media(prefers-reduced-motion:reduce){.card-interactive{transition:none}.card-interactive:hover{transform:none}}.badge{display:inline-flex;align-items:center;gap:var(--badge-gap);min-height:var(--badge-min-height);padding:var(--badge-padding-y) var(--badge-padding-x);background:var(--badge-background);border:1px solid var(--badge-border);border-radius:var(--badge-radius);color:var(--badge-text);font-family:var(--font-family-body);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);line-height:1;white-space:nowrap}.badge-default{background:var(--badge-default-background);border-color:var(--badge-default-border);color:var(--badge-default-text)}.badge-success{background:var(--badge-success-background);border-color:var(--badge-success-border);color:var(--badge-success-text)}.badge-warning{background:var(--badge-warning-background);border-color:var(--badge-warning-border);color:var(--badge-warning-text)}.badge-danger{background:var(--badge-danger-background);border-color:var(--badge-danger-border);color:var(--badge-danger-text)}.badge-info{background:var(--badge-info-background);border-color:var(--badge-info-border);color:var(--badge-info-text)}.badge-brand{background:var(--badge-brand-background);border-color:var(--badge-brand-border);color:var(--badge-brand-text)}.tag{display:inline-flex;align-items:center;gap:var(--tag-gap);width:fit-content;min-height:var(--tag-min-height);padding:var(--tag-padding-y) var(--tag-padding-x);background:var(--tag-background);border:1px solid var(--tag-border);border-radius:var(--tag-radius);color:var(--tag-text);font-family:var(--font-family-body);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);line-height:1;white-space:nowrap}.navbar{position:fixed;top:0;left:0;right:0;height:var(--nav-height);background:var(--nav-background);border-bottom:1px solid var(--nav-border);backdrop-filter:blur(var(--nav-blur));-webkit-backdrop-filter:blur(var(--nav-blur));z-index:var(--z-navbar);display:flex;align-items:center;padding-inline:var(--container-padding)}.navbar-inner{display:flex;align-items:center;justify-content:space-between;width:100%;max-width:var(--container-max-width);margin-inline:auto}.nav-link{color:var(--nav-link);text-decoration:none;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);transition:color var(--motion-duration-fast) ease;padding:.5rem .75rem;border-radius:var(--radius-md)}.nav-link:hover{color:var(--nav-link-hover)}.nav-link-active{color:var(--nav-link-active)}.sidebar{position:sticky;top:0;display:flex;flex-direction:column;width:var(--sidebar-width, 16rem);height:100vh;flex:0 0 auto;background:var(--surface-raised);border-right:1px solid var(--border-subtle);color:var(--text-primary)}.sidebar--collapsed{width:var(--sidebar-width-collapsed, 4.5rem)}.sidebar-header{flex:0 0 auto;padding:var(--space-5)}.sidebar-navigation{display:flex;flex-direction:column;gap:var(--space-2);flex:1 1 auto;min-height:0;padding:var(--space-3) var(--space-3);overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;scrollbar-color:var(--border-default) transparent}.sidebar-footer{flex:0 0 auto;padding:var(--space-3);border-top:1px solid var(--border-subtle)}.sidebar-group{display:flex;flex-direction:column;width:100%}.sidebar-group+.sidebar-group{margin-top:var(--space-4)}.sidebar-group-label{padding:var(--space-2) var(--space-3) var(--space-2);color:var(--text-muted);font-family:var(--font-family-body);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);line-height:var(--line-height-normal);letter-spacing:var(--letter-spacing-wide);text-transform:uppercase}.sidebar-group-items{display:flex;flex-direction:column;gap:var(--space-1)}.sidebar-item-wrapper{display:flex;flex-direction:column;width:100%}.sidebar-item{position:relative;display:flex;align-items:center;width:100%;min-height:2.625rem;padding:var(--space-2) var(--space-3);border:1px solid transparent;border-radius:var(--radius-md);background:transparent;color:var(--text-secondary);font-family:var(--font-family-body);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);line-height:var(--line-height-normal);text-align:left;text-decoration:none;cursor:pointer;transition:background-color var(--motion-duration-fast) var(--motion-ease-out),border-color var(--motion-duration-fast) var(--motion-ease-out),color var(--motion-duration-fast) var(--motion-ease-out),transform var(--motion-duration-fast) var(--motion-ease-out)}.sidebar-item:hover{background:var(--surface-hover);color:var(--text-primary)}.sidebar-item:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}.sidebar-item--active{background:var(--surface-card);border-color:var(--border-subtle);color:var(--text-primary)}.sidebar-item--active:before{content:"";position:absolute;top:50%;left:0;width:.1875rem;height:1.35rem;border-radius:var(--radius-full);background:var(--brand-primary);transform:translateY(-50%)}.sidebar-item--active:hover{background:var(--surface-hover)}.sidebar-item--disabled{opacity:var(--interaction-opacity-disabled);cursor:not-allowed;pointer-events:none}.sidebar-item-icon{display:inline-flex;align-items:center;justify-content:center;width:1.25rem;height:1.25rem;flex:0 0 auto;color:currentColor}.sidebar-item-label{min-width:0;flex:1 1 auto;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.sidebar-item-chevron{display:inline-flex;align-items:center;justify-content:center;width:1.25rem;height:1.25rem;flex:0 0 auto;margin-left:var(--space-2);color:var(--text-muted)}.sidebar-item-chevron>span{display:inline-flex;font-size:var(--font-size-lg);line-height:1;transform:rotate(0);transition:transform var(--motion-duration-fast) var(--motion-ease-out),color var(--motion-duration-fast) var(--motion-ease-out)}.sidebar-item:hover .sidebar-item-chevron{color:var(--text-primary)}.sidebar-item-chevron--expanded{transform:rotate(90deg)}.sidebar-item-children{display:flex;flex-direction:column;gap:var(--space-1);margin-top:var(--space-1);margin-left:var(--space-3);padding-left:var(--space-3);border-left:1px solid var(--border-subtle)}.sidebar-item-children .sidebar-item{min-height:2.375rem;padding:var(--space-2) var(--space-3);font-size:var(--font-size-sm)}.sidebar--collapsed .sidebar-header{padding-inline:var(--space-3)}.sidebar--collapsed .sidebar-navigation,.sidebar--collapsed .sidebar-footer{padding-inline:var(--space-2)}.sidebar--collapsed .sidebar-group-label{display:none}.sidebar--collapsed .sidebar-item{justify-content:center;padding-inline:var(--space-2)}.sidebar--collapsed .sidebar-item-label,.sidebar--collapsed .sidebar-item-chevron{display:none}.sidebar--collapsed .sidebar-item-icon{width:1.5rem;height:1.5rem}.sidebar--collapsed .sidebar-item-children{display:none}.sidebar-navigation::-webkit-scrollbar{width:.35rem}.sidebar-navigation::-webkit-scrollbar-track{background:transparent}.sidebar-navigation::-webkit-scrollbar-thumb{background:var(--border-default);border-radius:var(--radius-full)}.sidebar-navigation::-webkit-scrollbar-thumb:hover{background:var(--border-strong)}@media(prefers-reduced-motion:reduce){.sidebar-item,.sidebar-item-chevron>span{transition:none}}.tabs{width:100%}.tabs-list{display:flex;align-items:center;gap:var(--space-1);width:100%;border-bottom:1px solid var(--border-subtle);overflow-x:auto;scrollbar-width:none}.tabs-list::-webkit-scrollbar{display:none}.tab{position:relative;display:inline-flex;align-items:center;justify-content:center;min-height:2.75rem;padding:var(--space-2) var(--space-3);border:0;border-bottom:2px solid transparent;background:transparent;color:var(--text-muted);font-family:var(--font-family-body);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);line-height:var(--line-height-normal);white-space:nowrap;cursor:pointer;transition:color var(--motion-duration-fast) var(--motion-ease-out),border-color var(--motion-duration-fast) var(--motion-ease-out),background-color var(--motion-duration-fast) var(--motion-ease-out)}.tab:hover{color:var(--text-primary);background:var(--surface-hover)}.tab:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:calc(var(--focus-ring-offset) * -1)}.tab--active{color:var(--text-primary);border-bottom-color:var(--brand-primary)}.tab--disabled{color:var(--text-muted);opacity:var(--interaction-opacity-disabled);cursor:not-allowed;pointer-events:none}.tab-panels,.tab-panel{width:100%}@media(prefers-reduced-motion:reduce){.tab{transition:none}}.breadcrumbs{display:flex;align-items:center;width:100%;color:var(--text-muted);font-family:var(--font-family-body);font-size:var(--font-size-sm);line-height:var(--line-height-normal);overflow-x:auto;white-space:nowrap;scrollbar-width:none}.breadcrumbs::-webkit-scrollbar{display:none}.breadcrumbs-list{display:inline-flex;align-items:center;gap:var(--space-2);min-width:max-content}.breadcrumbs-item{display:inline-flex;align-items:center;gap:var(--space-2)}.breadcrumbs-link{color:var(--text-muted);text-decoration:none;transition:color var(--motion-duration-fast) var(--motion-ease-out)}.breadcrumbs-link:hover{color:var(--text-primary);text-decoration:underline;text-underline-offset:.2em}.breadcrumbs-link:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset);border-radius:var(--radius-sm)}.breadcrumbs-separator{display:inline-flex;align-items:center;justify-content:center;color:var(--text-muted);-webkit-user-select:none;user-select:none}.breadcrumbs-current{color:var(--text-primary);font-weight:var(--font-weight-medium);overflow:hidden;text-overflow:ellipsis}.breadcrumbs-item:last-child .breadcrumbs-separator{display:none}.container{max-width:var(--container-max-width);margin-inline:auto;padding-inline:var(--container-padding)}.container-narrow{max-width:var(--container-narrow);margin-inline:auto;padding-inline:var(--container-padding)}.section{padding-block:var(--section-spacing)}.stack{display:flex;flex-direction:column;align-items:stretch;gap:var(--stack-gap)}.stack-sm{display:flex;flex-direction:column;align-items:stretch;gap:var(--stack-gap-sm)}.stack-lg{display:flex;flex-direction:column;align-items:stretch;gap:var(--stack-gap-lg)}.stack-full{width:100%}.inline{display:flex;flex-wrap:wrap;gap:var(--inline-gap)}.inline-sm{display:flex;flex-wrap:wrap;gap:var(--inline-gap-sm)}.inline-lg{display:flex;flex-wrap:wrap;gap:var(--inline-gap-lg)}.grid{display:grid;gap:var(--grid-gap)}.grid-sm{display:grid;gap:var(--grid-gap-sm)}.grid-lg{display:grid;gap:var(--grid-gap-lg)}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.grid-cols-6{grid-template-columns:repeat(6,minmax(0,1fr))}.grid-rows-1{grid-template-rows:repeat(1,minmax(0,1fr))}.grid-rows-2{grid-template-rows:repeat(2,minmax(0,1fr))}.grid-rows-3{grid-template-rows:repeat(3,minmax(0,1fr))}.grid-rows-4{grid-template-rows:repeat(4,minmax(0,1fr))}.grid-rows-5{grid-template-rows:repeat(5,minmax(0,1fr))}.grid-rows-6{grid-template-rows:repeat(6,minmax(0,1fr))}.gap-0{gap:0}.gap-1{gap:var(--space-1)}.gap-2{gap:var(--space-2)}.gap-3{gap:var(--space-3)}.gap-4{gap:var(--space-4)}.gap-5{gap:var(--space-5)}.gap-6{gap:var(--space-6)}.gap-8{gap:var(--space-8)}.gap-10{gap:var(--space-10)}.gap-12{gap:var(--space-12)}.gap-16{gap:var(--space-16)}.gap-x-2{column-gap:var(--space-2)}.gap-x-4{column-gap:var(--space-4)}.gap-x-6{column-gap:var(--space-6)}.gap-x-8{column-gap:var(--space-8)}.gap-y-2{row-gap:var(--space-2)}.gap-y-4{row-gap:var(--space-4)}.gap-y-6{row-gap:var(--space-6)}.gap-y-8{row-gap:var(--space-8)}.p-0{padding:0}.p-1{padding:var(--space-1)}.p-2{padding:var(--space-2)}.p-3{padding:var(--space-3)}.p-4{padding:var(--space-4)}.p-5{padding:var(--space-5)}.p-6{padding:var(--space-6)}.p-8{padding:var(--space-8)}.p-10{padding:var(--space-10)}.p-12{padding:var(--space-12)}.py-0{padding-block:0}.py-1{padding-block:var(--space-1)}.py-2{padding-block:var(--space-2)}.py-3{padding-block:var(--space-3)}.py-4{padding-block:var(--space-4)}.py-5{padding-block:var(--space-5)}.py-6{padding-block:var(--space-6)}.py-8{padding-block:var(--space-8)}.py-10{padding-block:var(--space-10)}.py-12{padding-block:var(--space-12)}.py-16{padding-block:var(--space-16)}.py-20{padding-block:var(--space-20)}.py-24{padding-block:var(--space-24)}.px-0{padding-inline:0}.px-1{padding-inline:var(--space-1)}.px-2{padding-inline:var(--space-2)}.px-3{padding-inline:var(--space-3)}.px-4{padding-inline:var(--space-4)}.px-5{padding-inline:var(--space-5)}.px-6{padding-inline:var(--space-6)}.px-8{padding-inline:var(--space-8)}.px-10{padding-inline:var(--space-10)}.px-12{padding-inline:var(--space-12)}.text-xs{font-size:var(--font-size-xs);line-height:var(--line-height-snug)}.text-sm{font-size:var(--font-size-sm);line-height:var(--line-height-snug)}.text-md,.text-base{font-size:var(--font-size-base);line-height:var(--line-height-normal)}.text-lg{font-size:var(--font-size-lg);line-height:var(--line-height-relaxed)}.text-xl{font-size:var(--font-size-xl);line-height:var(--line-height-relaxed)}.text-2xl{font-size:var(--font-size-2xl);line-height:var(--line-height-snug)}.text-3xl{font-size:var(--font-size-3xl);line-height:var(--line-height-tight)}.text-4xl{font-size:var(--font-size-4xl);line-height:var(--line-height-tight)}.text-5xl{font-size:var(--font-size-5xl);line-height:var(--line-height-tight)}.text-6xl{font-size:var(--font-size-6xl);line-height:1.05}.heading-xs{font-family:var(--font-family-display);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);line-height:var(--line-height-tight);letter-spacing:var(--letter-spacing-tight);color:var(--text-primary)}.heading-sm{font-family:var(--font-family-display);font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);line-height:var(--line-height-tight);letter-spacing:var(--letter-spacing-tight);color:var(--text-primary)}.heading-md{font-family:var(--font-family-display);font-size:clamp(var(--font-size-xl),3vw,var(--font-size-2xl));font-weight:var(--font-weight-bold);line-height:var(--line-height-tight);letter-spacing:var(--letter-spacing-tight);color:var(--text-primary)}.heading-lg{font-family:var(--font-family-display);font-size:clamp(var(--font-size-2xl),4vw,var(--font-size-4xl));font-weight:var(--font-weight-bold);line-height:var(--line-height-tight);letter-spacing:var(--letter-spacing-tight);color:var(--text-primary)}.heading-xl{font-family:var(--font-family-display);font-size:clamp(var(--font-size-4xl),6vw,var(--font-size-6xl));font-weight:var(--font-weight-bold);line-height:1.05;letter-spacing:var(--letter-spacing-tight);color:var(--text-primary)}.text-primary{color:var(--text-primary)}.text-secondary{color:var(--text-secondary)}.text-muted{color:var(--text-muted)}.text-accent{color:var(--text-accent)}.text-inverse{color:var(--text-inverse)}.text-brand{color:var(--brand-primary)}.text-balance{text-wrap:balance}.text-pretty{text-wrap:pretty}.leading-tight{line-height:var(--line-height-tight)}.leading-snug{line-height:var(--line-height-snug)}.leading-normal{line-height:var(--line-height-normal)}.leading-relaxed{line-height:var(--line-height-relaxed)}.leading-loose{line-height:var(--line-height-loose)}.tracking-tight{letter-spacing:var(--letter-spacing-tight)}.tracking-normal{letter-spacing:var(--letter-spacing-normal)}.tracking-wide{letter-spacing:var(--letter-spacing-wide)}.tracking-wider{letter-spacing:var(--letter-spacing-wider)}.tracking-widest{letter-spacing:var(--letter-spacing-widest)}.font-light{font-weight:var(--font-weight-light)}.font-regular{font-weight:var(--font-weight-regular)}.font-medium{font-weight:var(--font-weight-medium)}.font-semibold{font-weight:var(--font-weight-semibold)}.font-bold{font-weight:var(--font-weight-bold)}.font-extrabold{font-weight:var(--font-weight-extrabold)}.uppercase{text-transform:uppercase}.lowercase{text-transform:lowercase}.capitalize{text-transform:capitalize}.italic{font-style:italic}.form-field{width:100%;display:flex;flex-direction:column;gap:var(--stack-gap-sm)}.checkbox{display:inline-flex;align-items:center;gap:var(--space-2);width:fit-content;color:var(--form-text);font-family:var(--font-family-body);font-size:var(--font-size-sm);line-height:var(--line-height-normal);cursor:pointer;-webkit-user-select:none;user-select:none}.checkbox-control{position:relative;display:inline-flex;align-items:center;justify-content:center;width:var(--icon-button-size-sm);height:var(--icon-button-size-sm);flex:0 0 auto;border:1px solid var(--form-border);border-radius:var(--radius-sm);background:var(--form-background);color:var(--text-on-brand);transition:var(--transition-fast)}.checkbox-control:after{content:"✓";font-size:var(--font-size-xs);font-weight:var(--font-weight-bold);opacity:0;transform:scale(.7);transition:var(--transition-fast)}.checkbox:hover .checkbox-control{border-color:var(--form-border-hover)}.checkbox--checked .checkbox-control{background:var(--brand-primary);border-color:var(--brand-primary)}.checkbox--checked .checkbox-control:after{opacity:1;transform:scale(1)}.checkbox--disabled{opacity:var(--interaction-opacity-disabled);cursor:not-allowed}.checkbox:focus-within .checkbox-control{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}.radio{display:inline-flex;align-items:center;gap:var(--space-2);width:fit-content;color:var(--form-text);font-family:var(--font-family-body);font-size:var(--font-size-sm);line-height:var(--line-height-normal);cursor:pointer;-webkit-user-select:none;user-select:none}.radio-control{position:relative;display:inline-flex;align-items:center;justify-content:center;width:var(--icon-button-size-sm);height:var(--icon-button-size-sm);flex:0 0 auto;border:1px solid var(--form-border);border-radius:var(--radius-full);background:var(--form-background);transition:var(--transition-fast)}.radio-control:after{content:"";width:.5rem;height:.5rem;border-radius:var(--radius-full);background:var(--brand-primary);opacity:0;transform:scale(.5);transition:var(--transition-fast)}.radio:hover .radio-control{border-color:var(--form-border-hover)}.radio--checked .radio-control{border-color:var(--brand-primary)}.radio--checked .radio-control:after{opacity:1;transform:scale(1)}.radio--disabled{opacity:var(--interaction-opacity-disabled);cursor:not-allowed}.radio:focus-within .radio-control{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}.switch{display:inline-flex;align-items:center;gap:var(--space-3);width:fit-content;color:var(--form-text);font-family:var(--font-family-body);font-size:var(--font-size-sm);line-height:var(--line-height-normal);cursor:pointer;-webkit-user-select:none;user-select:none}.switch-control{position:relative;width:2.75rem;height:1.5rem;flex:0 0 auto;border:1px solid var(--form-border);border-radius:var(--radius-full);background:var(--form-background);transition:var(--transition-fast)}.switch-control:after{content:"";position:absolute;top:50%;left:.2rem;width:1rem;height:1rem;border-radius:var(--radius-full);background:var(--text-muted);transform:translateY(-50%);transition:left var(--motion-duration-fast) var(--motion-ease-out),background-color var(--motion-duration-fast) var(--motion-ease-out)}.switch:hover .switch-control{border-color:var(--form-border-hover)}.switch--checked .switch-control{background:var(--brand-primary);border-color:var(--brand-primary)}.switch--checked .switch-control:after{left:calc(100% - 1.2rem);background:var(--text-on-brand)}.switch--disabled{opacity:var(--interaction-opacity-disabled);cursor:not-allowed}.switch:focus-within .switch-control{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}.choice-group{display:grid;gap:var(--space-2);width:100%}.choice{display:flex;align-items:center;justify-content:flex-start;width:100%;min-height:var(--button-min-height);padding:var(--space-3) var(--space-4);border:1px solid var(--form-border);border-radius:var(--radius-md);background:var(--form-background);color:var(--form-text);font-family:var(--font-family-body);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);text-align:left;cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color var(--motion-duration-fast) var(--motion-ease-out),border-color var(--motion-duration-fast) var(--motion-ease-out),color var(--motion-duration-fast) var(--motion-ease-out),transform var(--motion-duration-fast) var(--motion-ease-out)}.choice:hover{border-color:var(--form-border-hover);color:var(--text-primary);transform:translateY(var(--interaction-lift-sm))}.choice--selected{background:var(--surface-raised);border-color:var(--brand-primary);color:var(--text-primary)}.choice--disabled{opacity:var(--interaction-opacity-disabled);cursor:not-allowed;pointer-events:none}.choice:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}.choice-group--multiple .choice--selected{background:var(--brand-primary-muted)}.choice-group--grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.choice-group--grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.choice-group--grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}.checkbox>input,.radio>input,.switch>input{position:absolute;width:1px;height:1px;margin:0;padding:0;opacity:0;-moz-appearance:none;appearance:none;-webkit-appearance:none;pointer-events:none}.checkbox,.radio,.switch{position:relative}.input,.textarea,.select{box-sizing:border-box;width:100%;padding:var(--form-padding-y) var(--form-padding-x);background:var(--form-background);border:1px solid var(--form-border);border-radius:var(--radius-md);color:var(--form-text);font-family:var(--font-family-body);font-size:var(--font-size-sm);line-height:1.5;transition:var(--transition-fast)}.input:hover,.textarea:hover,.select:hover{border-color:var(--form-border-hover)}.input:focus,.textarea:focus,.select:focus{outline:var(--focus-ring-width) solid var(--form-border-focus);outline-offset:var(--focus-ring-offset);border-color:var(--form-border-focus)}.input::placeholder,.textarea::placeholder{color:var(--form-placeholder)}.input:disabled,.textarea:disabled,.select:disabled{background:var(--form-bg-disabled);border-color:var(--form-border-disabled);color:var(--form-text-disabled);cursor:not-allowed}.textarea{min-height:120px;resize:vertical}.input-error,.input-error:hover{border-color:var(--form-border-error)}.input-error:focus{outline:none;border-color:var(--form-border-error);box-shadow:0 0 0 3px color-mix(in srgb,var(--form-border-error) 25%,transparent)}.input-success,.input-success:hover{border-color:var(--form-border-success)}.input-success:focus{outline:none;border-color:var(--form-border-success);box-shadow:0 0 0 3px color-mix(in srgb,var(--form-border-success) 25%,transparent)}.empty-state{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--stack-gap);padding:var(--space-12);text-align:center}.empty-state-icon{display:flex;align-items:center;justify-content:center;width:3rem;height:3rem;color:var(--text-muted)}.empty-state-content{display:flex;flex-direction:column;align-items:center;gap:var(--stack-gap-sm);max-width:var(--text-max-width-sm)}.empty-state-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:var(--inline-gap);margin-top:var(--space-2)}.list{width:100%;display:flex;flex-direction:column;border-top:1px solid var(--border-subtle)}.list-item{position:relative;display:flex;align-items:center;width:100%;padding:var(--space-4) var(--space-5);border-bottom:1px solid var(--border-subtle);background:transparent;color:var(--text-primary);text-align:left;transition:background-color var(--motion-duration-fast) var(--motion-ease-out),border-color var(--motion-duration-fast) var(--motion-ease-out),color var(--motion-duration-fast) var(--motion-ease-out)}.list-item--selectable{cursor:pointer}.list-item--selectable:hover{background:var(--surface-hover)}.list-item--selected{background:var(--surface-card);border-color:var(--border-default)}.list-item--selected:hover{background:var(--surface-hover)}.list-item--disabled{color:var(--text-muted);cursor:not-allowed;opacity:var(--interaction-opacity-disabled)}.list-item--disabled:hover{background:transparent}.list-item--selectable:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:calc(var(--focus-ring-offset) * -1);z-index:1}.pagination{display:flex;align-items:center;gap:var(--space-4);width:100%}.pagination-controls{display:flex;align-items:center;gap:var(--space-1);flex:0 0 auto}.pagination-pages{display:flex;align-items:center;justify-content:center;gap:var(--space-1);flex:1 1 auto}.pagination-item{display:inline-flex;align-items:center;justify-content:center;min-width:var(--button-min-height);height:var(--button-min-height);padding-inline:var(--space-3);border:1px solid transparent;border-radius:var(--radius-md);background:transparent;color:var(--text-secondary);font-family:var(--font-family-body);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);cursor:pointer;transition:background-color var(--motion-duration-fast) var(--motion-ease-out),border-color var(--motion-duration-fast) var(--motion-ease-out),color var(--motion-duration-fast) var(--motion-ease-out)}.pagination-item:hover{background:var(--surface-hover);color:var(--text-primary)}.pagination-item:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}.pagination-item--current{background:var(--surface-card);border-color:var(--border-default);color:var(--text-primary)}.pagination-item--disabled{color:var(--text-muted);opacity:var(--interaction-opacity-disabled);cursor:not-allowed;pointer-events:none}.pagination-ellipsis{display:inline-flex;align-items:center;justify-content:center;min-width:var(--button-min-height);height:var(--button-min-height);color:var(--text-muted);-webkit-user-select:none;user-select:none}.pagination-compact{gap:var(--space-2)}.pagination-compact .pagination-item{min-width:var(--button-min-height-sm);height:var(--button-min-height-sm);padding-inline:var(--space-2);font-size:var(--font-size-xs)}.table{width:100%;overflow-x:auto;border:1px solid var(--border-default);border-radius:var(--card-radius);background:var(--surface-card)}.table table{width:100%;border-collapse:collapse;color:var(--text-primary);font-family:var(--font-family-body);font-size:var(--font-size-sm)}.table th{padding:var(--space-4) var(--space-5);border-bottom:1px solid var(--border-default);background:var(--surface-raised);color:var(--text-muted);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);line-height:var(--line-height-snug);letter-spacing:var(--letter-spacing-wide);text-align:left;text-transform:uppercase;white-space:nowrap}.table th:first-child{border-top-left-radius:calc(var(--card-radius) - 1px)}.table th:last-child{border-top-right-radius:calc(var(--card-radius) - 1px)}.table-header--sortable{cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color var(--motion-duration-fast) var(--motion-ease-out),color var(--motion-duration-fast) var(--motion-ease-out)}.table-header--sortable:hover{background:var(--surface-hover);color:var(--text-primary)}.table-header--sorted{color:var(--text-primary)}.table-header--sortable:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:calc(var(--focus-ring-offset) * -1)}.table td{padding:var(--space-4) var(--space-5);border-bottom:1px solid var(--border-subtle);color:var(--text-secondary);vertical-align:middle}.table tbody tr{transition:background-color var(--motion-duration-fast) var(--motion-ease-out),color var(--motion-duration-fast) var(--motion-ease-out)}.table tbody tr:hover{background:var(--surface-hover)}.table tbody tr:last-child td{border-bottom:0}.table-row--selected{background:var(--surface-raised)}.table-row--selected:hover{background:var(--surface-hover)}.table-row--disabled{opacity:var(--interaction-opacity-disabled)}.table-row--disabled:hover{background:transparent}.table-cell--center{text-align:center}.table-cell--end{text-align:right}.table-loading{position:relative;min-height:10rem}.table-loading:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:var(--surface-card);opacity:.55;pointer-events:none}@media(prefers-reduced-motion:reduce){.list-item,.pagination-item,.table tbody tr,.table-header--sortable{transition:none}}.dialog{position:fixed;top:0;right:0;bottom:0;left:0;z-index:var(--z-modal);display:flex;align-items:center;justify-content:center;padding:var(--space-6);pointer-events:none}.dialog-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--overlay-scrim);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);opacity:0;transition:opacity var(--motion-duration-normal) var(--motion-ease-out)}.dialog--open{pointer-events:auto}.dialog--open .dialog-backdrop{opacity:1}.dialog-content{position:relative;z-index:1;width:min(100%,var(--dialog-width, 32rem));max-height:calc(100vh - var(--space-12));overflow-y:auto;padding:var(--card-padding);border:1px solid var(--card-border);border-radius:var(--card-radius);background:var(--card-background);color:var(--text-primary);box-shadow:var(--shadow-elevation-high);opacity:0;transform:translateY(var(--space-2)) scale(.98);transition:opacity var(--motion-duration-normal) var(--motion-ease-out),transform var(--motion-duration-normal) var(--motion-ease-out)}.dialog--open .dialog-content{opacity:1;transform:translateY(0) scale(1)}.dialog-close{position:absolute;top:var(--space-4);right:var(--space-4);display:inline-flex;align-items:center;justify-content:center;width:var(--button-min-height);height:var(--button-min-height);padding:0;border:0;border-radius:var(--radius-md);background:transparent;color:var(--text-muted);cursor:pointer;transition:background-color var(--motion-duration-fast) var(--motion-ease-out),color var(--motion-duration-fast) var(--motion-ease-out)}.dialog-close:hover{background:var(--surface-hover);color:var(--text-primary)}.dialog-close:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}@media(max-width:40rem){.dialog{align-items:flex-end;padding:var(--space-3)}.dialog-content{width:100%;max-height:calc(100vh - var(--space-6));border-radius:var(--card-radius) var(--card-radius) 0 0;transform:translateY(var(--space-4))}.dialog--open .dialog-content{transform:translateY(0)}}@media(prefers-reduced-motion:reduce){.dialog-backdrop,.dialog-content{transition:none}}.drawer{position:fixed;top:0;right:0;bottom:0;left:0;z-index:var(--z-overlay);pointer-events:none}.drawer--open{pointer-events:auto}.drawer-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;border:0;padding:0;background:var(--overlay-scrim);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);opacity:0;cursor:default;transition:opacity var(--motion-duration-normal) var(--motion-ease-out)}.drawer--open .drawer-backdrop{opacity:1}.drawer-panel{position:absolute;top:0;bottom:0;display:flex;flex-direction:column;width:min(var(--drawer-width, 28rem),100vw);background:var(--card-background);color:var(--text-primary);border-color:var(--border-subtle);border-style:solid;box-shadow:var(--shadow-elevation-high);overflow:hidden;transition:transform var(--motion-duration-normal) var(--motion-ease-out)}.drawer--right .drawer-panel{right:0;border-left-width:1px;transform:translate(100%)}.drawer--left .drawer-panel{left:0;border-right-width:1px;transform:translate(-100%)}.drawer--open .drawer-panel{transform:translate(0)}.drawer-content{flex:1 1 auto;min-height:0;padding:var(--card-padding);overflow-y:auto}.drawer-close{display:inline-flex;align-items:center;justify-content:center;width:var(--button-min-height);height:var(--button-min-height);flex:0 0 auto;padding:0;border:0;border-radius:var(--radius-md);background:transparent;color:var(--text-muted);cursor:pointer;transition:background-color var(--motion-duration-fast) var(--motion-ease-out),color var(--motion-duration-fast) var(--motion-ease-out)}.drawer-close:hover{background:var(--surface-hover);color:var(--text-primary)}.drawer-close:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}@media(max-width:40rem){.drawer-panel{width:100%}}@media(prefers-reduced-motion:reduce){.drawer-backdrop,.drawer-panel{transition:none}}.popover{position:relative;display:inline-block}.popover-trigger{display:inline-flex}.popover-content{position:absolute;z-index:var(--z-popover);width:max-content;max-width:min(22rem,calc(100vw - var(--space-8)));padding:var(--space-4);border:1px solid var(--border-subtle);border-radius:var(--radius-md);background:var(--surface-card);color:var(--text-primary);box-shadow:var(--shadow-elevation-medium);opacity:0;visibility:hidden;transform:translateY(-.25rem) scale(.98);transition:opacity var(--motion-duration-fast) var(--motion-ease-out),transform var(--motion-duration-fast) var(--motion-ease-out),visibility var(--motion-duration-fast) var(--motion-ease-out)}.popover--open .popover-content{opacity:1;visibility:visible;transform:translateY(0) scale(1)}.popover--bottom .popover-content{top:calc(100% + var(--space-2));left:0}.popover--top .popover-content{bottom:calc(100% + var(--space-2));left:0;transform:translateY(.25rem) scale(.98)}.popover--top.popover--open .popover-content{transform:translateY(0) scale(1)}.popover--right .popover-content{top:0;left:calc(100% + var(--space-2))}.popover--left .popover-content{top:0;right:calc(100% + var(--space-2))}.tooltip{position:relative;display:inline-flex}.tooltip-trigger{display:inline-flex}.tooltip-content{position:absolute;z-index:var(--z-tooltip);width:max-content;max-width:18rem;padding:var(--space-2) var(--space-3);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);background:var(--surface-elevated-2);color:var(--text-primary);font-family:var(--font-family-body);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);line-height:var(--line-height-normal);box-shadow:var(--shadow-elevation-low);white-space:normal;text-align:left;pointer-events:none;opacity:0;visibility:hidden;transform:translateY(-.2rem);transition:opacity var(--motion-duration-fast) var(--motion-ease-out),transform var(--motion-duration-fast) var(--motion-ease-out),visibility var(--motion-duration-fast) var(--motion-ease-out)}.tooltip--visible .tooltip-content{opacity:1;visibility:visible;transform:translateY(0)}.tooltip--bottom .tooltip-content{top:calc(100% + var(--space-2));left:50%;transform:translate(-50%,-.2rem)}.tooltip--bottom.tooltip--visible .tooltip-content{transform:translate(-50%)}.tooltip--top .tooltip-content{bottom:calc(100% + var(--space-2));left:50%;transform:translate(-50%,.2rem)}.tooltip--top.tooltip--visible .tooltip-content{transform:translate(-50%)}.tooltip--right .tooltip-content{top:50%;left:calc(100% + var(--space-2));transform:translate(.2rem,-50%)}.tooltip--right.tooltip--visible .tooltip-content{transform:translateY(-50%)}.tooltip--left .tooltip-content{top:50%;right:calc(100% + var(--space-2));transform:translate(-.2rem,-50%)}.tooltip--left.tooltip--visible .tooltip-content{transform:translateY(-50%)}@media(prefers-reduced-motion:reduce){.popover-content,.tooltip-content{transition:none}}.alert{display:flex;align-items:flex-start;gap:var(--space-3);width:100%;padding:var(--space-4);border:1px solid transparent;border-radius:var(--radius-md);background:var(--surface-card);color:var(--text-primary)}.alert-content{display:flex;flex-direction:column;gap:var(--space-1);min-width:0;flex:1 1 auto}.alert-message{color:var(--text-secondary);line-height:var(--line-height-normal)}.alert-actions{display:inline-flex;align-items:center;flex:0 0 auto;margin-top:var(--space-3)}.alert-info{border-color:var(--alert-info-border);background:var(--alert-info-background);color:var(--alert-info-text)}.alert-success{border-color:var(--alert-success-border);background:var(--alert-success-background);color:var(--alert-success-text)}.alert-warning{border-color:var(--alert-warning-border);background:var(--alert-warning-background);color:var(--alert-warning-text)}.alert-danger{border-color:var(--alert-danger-border);background:var(--alert-danger-background);color:var(--alert-danger-text)}.alert-close{display:inline-flex;align-items:center;justify-content:center;width:var(--button-min-height-sm);height:var(--button-min-height-sm);flex:0 0 auto;padding:0;border:0;border-radius:var(--radius-md);background:transparent;color:var(--text-muted);cursor:pointer;transition:background-color var(--motion-duration-fast) var(--motion-ease-out),color var(--motion-duration-fast) var(--motion-ease-out)}.alert-close:hover{background:var(--surface-hover);color:var(--text-primary)}.alert-close:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}@media(prefers-reduced-motion:reduce){.alert-close{transition:none}}.progress{display:flex;flex-direction:column;gap:var(--space-2);width:100%}.progress-track{position:relative;width:100%;height:.5rem;overflow:hidden;border-radius:var(--radius-full);background:var(--surface-raised)}.progress-value{height:100%;width:0;border-radius:inherit;background:var(--brand-primary);transition:width var(--motion-duration-normal) var(--motion-ease-out)}.progress--success .progress-value{background:var(--color-success)}.progress--warning .progress-value{background:var(--color-warning)}.progress--danger .progress-value{background:var(--color-danger)}.progress--indeterminate .progress-value{width:40%;animation:progress-indeterminate 1.4s var(--motion-ease-in-out) infinite}.progress-label{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);color:var(--text-secondary);font-size:var(--font-size-sm);line-height:var(--line-height-normal)}@keyframes progress-indeterminate{0%{transform:translate(-100%)}50%{transform:translate(150%)}to{transform:translate(300%)}}.skeleton{display:block;width:100%;min-height:1rem;border-radius:var(--radius-md);background:linear-gradient(90deg,var(--surface-raised) 25%,var(--surface-hover) 50%,var(--surface-raised) 75%);background-size:200% 100%;animation:skeleton-shimmer 1.6s var(--motion-ease-in-out) infinite}.skeleton--text{height:1rem;min-height:1rem}.skeleton--heading{height:2rem;min-height:2rem;max-width:70%}.skeleton--avatar{width:2.75rem;min-width:2.75rem;height:2.75rem;min-height:2.75rem;border-radius:var(--radius-full)}.skeleton--circle{border-radius:var(--radius-full)}.skeleton--button{width:7rem;min-height:var(--button-min-height);border-radius:var(--button-radius)}@keyframes skeleton-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.toast{position:fixed;right:var(--space-6);bottom:var(--space-6);z-index:var(--z-tooltip);display:flex;align-items:flex-start;gap:var(--space-3);width:min(24rem,calc(100vw - var(--space-8)));padding:var(--space-4);border:1px solid var(--border-default);border-radius:var(--radius-md);background:var(--surface-card);color:var(--text-primary);box-shadow:var(--shadow-elevation-high);transform:translateY(var(--space-3));opacity:0;transition:opacity var(--motion-duration-normal) var(--motion-ease-out),transform var(--motion-duration-normal) var(--motion-ease-out)}.toast--visible{opacity:1;transform:translateY(0)}.toast-info{border-color:var(--alert-info-border)}.toast-success{border-color:var(--alert-success-border)}.toast-warning{border-color:var(--alert-warning-border)}.toast-danger{border-color:var(--alert-danger-border)}.toast-content{display:flex;flex-direction:column;gap:var(--space-1);min-width:0;flex:1 1 auto}.toast-title{color:var(--text-primary);font-weight:var(--font-weight-semibold)}.toast-message{color:var(--text-secondary);line-height:var(--line-height-normal)}.toast-close{display:inline-flex;align-items:center;justify-content:center;width:var(--button-min-height-sm);height:var(--button-min-height-sm);flex:0 0 auto;padding:0;border:0;border-radius:var(--radius-md);background:transparent;color:var(--text-muted);cursor:pointer;transition:background-color var(--motion-duration-fast) var(--motion-ease-out),color var(--motion-duration-fast) var(--motion-ease-out)}.toast-close:hover{background:var(--surface-hover);color:var(--text-primary)}.toast-close:focus-visible{outline:var(--focus-ring-width) solid var(--focus-ring-color);outline-offset:var(--focus-ring-offset)}@media(max-width:40rem){.toast{right:var(--space-3);bottom:var(--space-3);width:calc(100vw - var(--space-6))}}@media(prefers-reduced-motion:reduce){.progress-value,.skeleton,.toast{animation:none;transition:none}.toast{transform:none}}.animate-fade-in{animation:fade-in var(--motion-duration-normal) var(--motion-ease-smooth) forwards}.animate-fade-in-up{animation:fade-in-up var(--motion-duration-normal) var(--motion-ease-smooth) forwards}.animate-slide-in-left{animation:slide-in-left var(--motion-duration-slow) var(--motion-ease-smooth) forwards}.animate-slide-in-right{animation:slide-in-right var(--motion-duration-slow) var(--motion-ease-smooth) forwards}.animate-scale-in{animation:scale-in var(--motion-duration-fast) var(--motion-ease-spring) forwards}
|
|
1
|
+
@import"https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@200;300;400;500;600;700;800&family=JetBrains+Mono:wght@300;400;500;600;700;800&display=swap";:root{--space-0: 0px;--space-px: 1px;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-7: 1.75rem;--space-8: 2rem;--space-9: 2.25rem;--space-10: 2.5rem;--space-11: 2.75rem;--space-12: 3rem;--space-14: 3.5rem;--space-16: 4rem;--space-20: 5rem;--space-24: 6rem;--space-28: 7rem;--space-32: 8rem;--space-36: 9rem;--space-40: 10rem;--space-44: 11rem;--space-48: 12rem;--space-52: 13rem;--space-56: 14rem;--space-60: 15rem;--space-64: 16rem;--space-72: 18rem;--space-80: 20rem;--space-96: 24rem;--section-spacing: var(--space-24);--section-spacing-sm: var(--space-16);--section-spacing-lg: var(--space-32);--container-padding: var(--space-6);--container-padding-lg: var(--space-8);--stack-gap: var(--space-4);--stack-gap-sm: var(--space-2);--stack-gap-lg: var(--space-8);--inline-gap: var(--space-3);--inline-gap-sm: var(--space-2);--inline-gap-lg: var(--space-6);--grid-gap: var(--space-6);--grid-gap-sm: var(--space-4);--grid-gap-lg: var(--space-8);--grid-min: 16rem;--container-max-width: 1280px;--container-wide: 1440px;--container-narrow: 768px;--container-gutter: 1.5rem;--container-gutter-lg: 2rem;--content-width-narrow: 65ch;--content-width-readable: 72ch;--content-width-wide: 80ch;--section-inner-max-width: var(--container-max-width);--section-header-max-width: 720px;--section-header-wide-max-width: 1000px;--section-header-gap: var(--space-4);--section-header-title-gap: var(--space-3);--section-header-description-gap: var(--space-4);--section-header-margin-bottom: var(--space-16);--section-header-margin-bottom-sm: var(--space-12);--section-header-margin-bottom-lg: var(--space-20);--section-content-gap: var(--space-12);--section-radius: var(--radius-3xl);--section-bg-inverse: var(--text-primary);--section-bg-base: var(--background-secondary);--section-bg-raised: var(--surface-raised);--section-bg-surface: var(--surface-card);--section-bg-subtle: var(--surface-base);--section-bg-brand: var(--brand-primary-muted);--z-base: 0;--z-floor: 10;--z-sticky: 30;--z-navbar: 50;--z-dropdown: 70;--z-overlay: 80;--z-modal: 90;--z-popover: 95;--z-tooltip: 100;--font-family-display: "Plus Jakarta Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans";--font-family-body: "Plus Jakarta Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans";--font-family-mono: "JetBrains Mono", "Fira Code", monospace;--font-weight-light: 300;--font-weight-regular: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-weight-extrabold: 800;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 1.875rem;--font-size-4xl: 2.25rem;--font-size-5xl: 3rem;--font-size-6xl: 3.75rem;--font-size-7xl: 4.5rem;--font-size-8xl: 6rem;--font-size-9xl: 8rem;--line-height-none: 1;--line-height-tight: 1.1;--line-height-snug: 1.25;--line-height-normal: 1.5;--line-height-relaxed: 1.625;--line-height-loose: 2;--letter-spacing-tighter: -.04em;--letter-spacing-tight: -.025em;--letter-spacing-normal: 0em;--letter-spacing-wide: .025em;--letter-spacing-wider: .05em;--letter-spacing-widest: .1em;--typography-display-size: var(--font-size-8xl);--typography-display-weight: var(--font-weight-extrabold);--typography-display-lineheight: var(--line-height-tight);--typography-display-letterspacing: var(--letter-spacing-tighter);--typography-h1-size: var(--font-size-6xl);--typography-h2-size: var(--font-size-4xl);--typography-h3-size: var(--font-size-3xl);--typography-h4-size: var(--font-size-2xl);--typography-heading-weight: var(--font-weight-semibold);--typography-heading-lineheight: var(--line-height-tight);--typography-heading-letterspacing: var(--letter-spacing-tight);--typography-lead-size: var(--font-size-xl);--typography-lead-lineheight: var(--line-height-relaxed);--typography-lead-weight: var(--font-weight-regular);--typography-body-size: var(--font-size-base);--typography-body-lineheight: var(--line-height-normal);--typography-body-weight: var(--font-weight-regular);--typography-body-large-size: var(--font-size-lg);--typography-body-large-lineheight: var(--line-height-relaxed);--typography-caption-size: var(--font-size-sm);--typography-caption-lineheight: var(--line-height-normal);--typography-overline-size: var(--font-size-xs);--typography-overline-lineheight: var(--line-height-snug);--typography-overline-weight: var(--font-weight-semibold);--typography-overline-letterspacing: var(--letter-spacing-wider);--typography-eyebrow-size: var(--font-size-sm);--typography-eyebrow-lineheight: var(--line-height-none);--typography-eyebrow-weight: var(--font-weight-bold);--typography-eyebrow-letterspacing: var(--letter-spacing-wider);--typography-label-size: var(--font-size-sm);--typography-label-lineheight: var(--line-height-snug);--typography-label-weight: var(--font-weight-semibold);--typography-label-letterspacing: var(--letter-spacing-wide);--typography-section-title-size: var(--font-size-5xl);--typography-section-title-lineheight: var(--line-height-tight);--typography-section-title-weight: var(--font-weight-bold);--typography-section-title-letterspacing: var(--letter-spacing-tight);--typography-section-description-size: var(--font-size-base);--typography-section-description-lineheight: var(--line-height-relaxed);--typography-nav-size: var(--font-size-sm);--typography-nav-weight: var(--font-weight-medium);--typography-button-size: var(--font-size-sm);--typography-button-weight: var(--font-weight-medium);--typography-button-lineheight: var(--line-height-none);--typography-code-size: var(--font-size-sm);--radius-none: 0px;--radius-sm: .125rem;--radius-base: .25rem;--radius-md: .375rem;--radius-lg: .5rem;--radius-xl: .75rem;--radius-2xl: 1rem;--radius-3xl: 1.5rem;--radius-full: 9999px;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow-base: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--shadow-xl: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / .25);--shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 / .05);--motion-duration-fast: .15s;--motion-duration-normal: .3s;--motion-duration-slow: .5s;--motion-duration-slower: .7s;--motion-duration-slowest: 1s;--motion-ease-in: cubic-bezier(.4, 0, 1, 1);--motion-ease-out: cubic-bezier(0, 0, .2, 1);--motion-ease-in-out: cubic-bezier(.4, 0, .2, 1);--motion-ease-spring: cubic-bezier(.175, .885, .32, 1.275);--motion-ease-smooth: cubic-bezier(.22, 1, .36, 1);--motion-fast: var(--motion-duration-fast) var(--motion-ease-out);--motion-normal: var(--motion-duration-normal) var(--motion-ease-smooth);--motion-slow: var(--motion-duration-slow) var(--motion-ease-smooth);--motion-slower: var(--motion-duration-slower) var(--motion-ease-smooth);--ease-standard: var(--motion-ease-out);--ease-smooth: var(--motion-ease-smooth);--ease-spring: var(--motion-ease-spring);--transition-fast: all var(--motion-duration-fast) var(--motion-ease-out);--transition-normal: all var(--motion-duration-normal) var(--motion-ease-smooth);--transition-slow: all var(--motion-duration-slow) var(--motion-ease-smooth);--alert-info-background: color-mix( in srgb, var(--color-info) 10%, transparent );--alert-info-border: color-mix( in srgb, var(--color-info) 28%, transparent );--alert-info-text: var(--color-info);--alert-success-background: color-mix( in srgb, var(--color-success) 10%, transparent );--alert-success-border: color-mix( in srgb, var(--color-success) 28%, transparent );--alert-success-text: var(--color-success);--alert-warning-background: color-mix( in srgb, var(--color-warning) 10%, transparent );--alert-warning-border: color-mix( in srgb, var(--color-warning) 28%, transparent );--alert-warning-text: var(--color-warning);--alert-danger-background: color-mix( in srgb, var(--color-danger) 10%, transparent );--alert-danger-border: color-mix( in srgb, var(--color-danger) 28%, transparent );--alert-danger-text: var(--color-danger);--badge-background: color-mix( in srgb, var(--surface-raised), var(--text-primary) 8% );--badge-border: var(--border-default);--badge-text: var(--text-secondary);--badge-default-background: color-mix( in srgb, var(--surface-raised), var(--text-primary) 8% );--badge-default-border: var(--border-default);--badge-default-text: var(--text-secondary);--badge-success-background: color-mix( in srgb, var(--color-success) 10%, transparent );--badge-success-border: color-mix( in srgb, var(--color-success) 28%, transparent );--badge-success-text: var(--color-success);--badge-warning-background: color-mix( in srgb, var(--color-warning) 10%, transparent );--badge-warning-border: color-mix( in srgb, var(--color-warning) 28%, transparent );--badge-warning-text: var(--color-warning);--badge-danger-background: color-mix( in srgb, var(--color-danger) 10%, transparent );--badge-danger-border: color-mix( in srgb, var(--color-danger) 28%, transparent );--badge-danger-text: var(--color-danger);--badge-info-background: color-mix( in srgb, var(--color-info) 10%, transparent );--badge-info-border: color-mix( in srgb, var(--color-info) 28%, transparent );--badge-info-text: var(--color-info);--badge-brand-background: color-mix( in srgb, var(--brand-primary) 10%, transparent );--badge-brand-border: color-mix( in srgb, var(--brand-primary) 28%, transparent );--badge-brand-text: var(--brand-primary);--tag-background: var(--surface-raised);--tag-border: var(--border-subtle);--tag-text: var(--text-muted);--button-radius: var(--radius-full);--button-padding-x: 1.5rem;--button-padding-y: .75rem;--button-padding-x-sm: 1rem;--button-padding-y-sm: .5rem;--button-padding-x-lg: 2rem;--button-padding-y-lg: 1rem;--button-gap: .5rem;--button-min-height: 44px;--button-min-height-sm: 36px;--button-min-height-lg: 52px;--button-icon-size: 1rem;--button-icon-size-sm: .875rem;--button-icon-size-lg: 1.125rem;--card-radius: var(--radius-lg);--card-padding: var(--space-6);--card-padding-sm: var(--space-4);--card-padding-lg: var(--space-8);--card-content-gap: var(--space-4);--badge-radius: var(--radius-full);--badge-padding-x: var(--space-3);--badge-padding-y: var(--space-1);--badge-gap: var(--space-1);--badge-min-height: 24px;--tag-radius: var(--radius-md);--tag-padding-x: var(--space-2);--tag-padding-y: var(--space-1);--tag-gap: var(--space-1);--tag-min-height: 24px;--nav-height: 4.5rem;--nav-height-sm: 4rem;--nav-padding-x: var(--container-padding);--nav-padding-x-lg: var(--container-padding-lg);--nav-blur: 12px;--nav-link-padding-x: .75rem;--nav-link-padding-y: .5rem;--nav-link-radius: var(--radius-md);--nav-gap: var(--space-2);--nav-content-gap: var(--space-8);--form-height: 44px;--form-height-sm: 36px;--form-height-lg: 52px;--form-padding-x: 1rem;--form-padding-y: .75rem;--form-radius: var(--radius-md);--form-gap: var(--space-2);--form-label-gap: var(--space-2);--form-field-gap: var(--space-4);--form-textarea-min-height: 120px;--media-radius: var(--radius-lg);--media-radius-sm: var(--radius-md);--media-radius-lg: var(--radius-2xl);--media-aspect-square: 1 / 1;--media-aspect-video: 16 / 9;--media-aspect-wide: 21 / 9;--media-aspect-portrait: 4 / 5;--media-aspect-tall: 3 / 4;--icon-size-xs: .75rem;--icon-size-sm: 1rem;--icon-size-md: 1.25rem;--icon-size-lg: 1.5rem;--icon-size-xl: 2rem;--icon-button-size-sm: 36px;--icon-button-size: 44px;--icon-button-size-lg: 52px;--focus-ring-width: 2px;--focus-ring-offset: 2px;--focus-ring-offset-lg: 4px;--breakpoint-sm: 640px;--breakpoint-md: 768px;--breakpoint-lg: 1024px;--breakpoint-xl: 1280px;--breakpoint-2xl: 1536px;--prose-measure: 65ch;--prose-measure-wide: 75ch;--text-max-width-sm: 36rem;--text-max-width-md: 48rem;--text-max-width-lg: 64rem;--grid-min-width-sm: 12rem;--grid-min-width: 16rem;--grid-min-width-lg: 20rem;--interaction-lift-sm: -1px;--interaction-lift: -2px;--interaction-lift-lg: -4px;--interaction-scale-sm: .98;--interaction-scale: .97;--interaction-opacity-disabled: .5}:root{--brand-primary: #6366f1;--brand-primary-hover: #4f46e5;--brand-primary-active: #4338ca;--brand-primary-light: #a5b4fc;--brand-primary-muted: color-mix(in srgb, var(--brand-primary) 15%, transparent);--brand-glow: color-mix(in srgb, var(--brand-primary) 25%, transparent);--text-on-brand: #ffffff;--color-success: #22c55e;--color-warning: #f59e0b;--color-danger: #ef4444;--color-info: #3b82f6;--background-primary: #09090b;--background-secondary: color-mix(in srgb, var(--background-primary) 92%, white);--surface-base: color-mix(in srgb, var(--background-primary) 92%, white);--surface-raised: color-mix(in srgb, var(--background-primary) 84%, white);--surface-card: color-mix(in srgb, var(--background-primary) 88%, white);--surface-hover: color-mix(in srgb, var(--background-primary) 84%, white);--surface-elevated-1: color-mix(in srgb, var(--background-primary) 84%, white);--surface-elevated-2: color-mix(in srgb, var(--background-primary) 76%, white);--surface-elevated-3: color-mix(in srgb, var(--background-primary) 68%, white);--surface-glass: color-mix(in srgb, white 6%, transparent);--surface-glass-strong: color-mix(in srgb, white 10%, transparent);--text-primary: color-mix(in srgb, white 96%, transparent);--text-secondary: color-mix(in srgb, white 72%, transparent);--text-muted: color-mix(in srgb, white 54%, transparent);--text-inverse: color-mix(in srgb, white 96%, black);--text-accent: var(--brand-primary);--text-link: var(--brand-primary);--text-link-hover: var(--brand-primary-hover);--border-default: color-mix(in srgb, white 12%, transparent);--border-strong: color-mix(in srgb, white 20%, transparent);--border-subtle: color-mix(in srgb, white 6%, transparent);--border-focus: color-mix(in srgb, var(--brand-primary) 45%, transparent);--glass-background: color-mix(in srgb, white 6%, transparent);--glass-border: color-mix(in srgb, white 14%, transparent);--overlay-scrim: color-mix(in srgb, black 60%, transparent);--overlay-scrim-strong: color-mix(in srgb, black 75%, transparent);--focus-ring-color: var(--border-focus);--selection-background: var(--brand-primary);--selection-text: #ffffff;--button-primary-bg: var(--brand-primary);--button-primary-text: var(--text-on-brand);--button-primary-border: transparent;--button-primary-hover-bg: var(--brand-primary-hover);--button-primary-hover-border: transparent;--button-primary-active-bg: var(--brand-primary-active);--button-primary-disabled-bg: color-mix(in srgb, var(--brand-primary) 30%, transparent);--button-primary-disabled-text: color-mix(in srgb, var(--text-primary) 40%, transparent);--button-secondary-bg: color-mix(in srgb, var(--surface-base), var(--text-primary) 10%);--button-secondary-text: var(--text-primary);--button-secondary-border: var(--border-default);--button-secondary-hover-bg: color-mix(in srgb, var(--surface-raised), var(--text-primary) 14%);--button-secondary-hover-border: var(--border-strong);--button-secondary-active-bg: color-mix(in srgb, var(--surface-raised), var(--text-primary) 20%);--button-secondary-disabled-bg: color-mix(in srgb, var(--surface-base), var(--text-primary) 2%);--button-secondary-disabled-text: var(--text-muted);--button-secondary-disabled-border: color-mix(in srgb, var(--border-default), transparent 30%);--button-ghost-bg: transparent;--button-ghost-text: var(--text-primary);--button-ghost-border: transparent;--button-ghost-hover-bg: color-mix(in srgb, var(--surface-base), var(--text-primary) 6%);--button-ghost-hover-border: transparent;--button-ghost-active-bg: color-mix(in srgb, var(--surface-base), var(--text-primary) 12%);--button-ghost-disabled-text: var(--text-muted);--button-outline-bg: transparent;--button-outline-text: var(--text-primary);--button-outline-border: var(--border-strong);--button-outline-hover-bg: color-mix(in srgb, var(--surface-base), var(--text-primary) 6%);--button-outline-hover-border: var(--border-focus);--button-outline-active-bg: color-mix(in srgb, var(--surface-base), var(--text-primary) 12%);--button-outline-disabled-text: var(--text-muted);--button-outline-disabled-border: var(--border-default);--button-destructive-bg: color-mix(in srgb, var(--color-danger) 14%, transparent);--button-destructive-text: color-mix(in srgb, var(--color-danger) 80%, white);--button-destructive-border: color-mix(in srgb, var(--color-danger) 20%, transparent);--button-destructive-hover-bg: color-mix(in srgb, var(--color-danger) 20%, transparent);--button-destructive-hover-border: color-mix(in srgb, var(--color-danger) 28%, transparent);--button-destructive-active-bg: color-mix(in srgb, var(--color-danger) 26%, transparent);--button-destructive-disabled-bg: color-mix(in srgb, var(--color-danger) 6%, transparent);--button-destructive-disabled-text: color-mix(in srgb, var(--color-danger) 40%, transparent);--card-background: var(--surface-card);--card-background-hover: var(--surface-hover);--card-gradient: linear-gradient( 180deg, color-mix(in srgb, var(--brand-primary) 10%, transparent), transparent 40% );--card-highlight: inset 0 1px 0 0 color-mix(in srgb, white 10%, transparent);--card-highlight-inset: inset 0 1px 0 0 color-mix(in srgb, white 10%, transparent);--card-border: var(--border-default);--card-border-hover: color-mix(in srgb, var(--brand-primary) 30%, transparent);--card-shadow: color-mix(in srgb, var(--brand-primary) 12%, rgba(0, 0, 0, .7));--card-shadow-hover: color-mix(in srgb, var(--brand-primary) 18%, rgba(0, 0, 0, .8));--nav-background: color-mix(in srgb, var(--background-primary) 80%, transparent);--nav-border: var(--border-default);--nav-link: var(--text-secondary);--nav-link-hover: var(--text-primary);--nav-link-active: var(--text-primary);--nav-link-active-border: var(--brand-primary);--nav-focus-ring: var(--border-focus);--form-background: color-mix(in srgb, var(--surface-base), var(--text-primary) 3%);--form-border: var(--border-default);--form-border-hover: var(--border-strong);--form-border-focus: var(--border-focus);--form-border-error: var(--color-danger);--form-border-success: var(--color-success);--form-text: var(--text-primary);--form-text-muted: var(--text-muted);--form-text-error: var(--color-danger);--form-text-success: var(--color-success);--form-placeholder: var(--text-muted);--form-bg-disabled: color-mix(in srgb, var(--surface-base), var(--text-primary) 2%);--form-border-disabled: color-mix(in srgb, var(--border-default), transparent 30%);--form-text-disabled: var(--text-muted);--alert-info-background: color-mix( in srgb, var(--color-info) 10%, transparent );--alert-info-border: color-mix( in srgb, var(--color-info) 28%, transparent );--alert-info-text: var(--color-info);--alert-success-background: color-mix( in srgb, var(--color-success) 10%, transparent );--alert-success-border: color-mix( in srgb, var(--color-success) 28%, transparent );--alert-success-text: var(--color-success);--alert-warning-background: color-mix( in srgb, var(--color-warning) 10%, transparent );--alert-warning-border: color-mix( in srgb, var(--color-warning) 28%, transparent );--alert-warning-text: var(--color-warning);--alert-danger-background: color-mix( in srgb, var(--color-danger) 10%, transparent );--alert-danger-border: color-mix( in srgb, var(--color-danger) 28%, transparent );--alert-danger-text: var(--color-danger);--badge-background: color-mix( in srgb, var(--surface-raised), var(--text-primary) 8% );--badge-border: var(--border-default);--badge-text: var(--text-secondary);--badge-default-background: color-mix( in srgb, var(--surface-raised), var(--text-primary) 8% );--badge-default-border: var(--border-default);--badge-default-text: var(--text-secondary);--badge-success-background: color-mix( in srgb, var(--color-success) 10%, transparent );--badge-success-border: color-mix( in srgb, var(--color-success) 28%, transparent );--badge-success-text: var(--color-success);--badge-warning-background: color-mix( in srgb, var(--color-warning) 10%, transparent );--badge-warning-border: color-mix( in srgb, var(--color-warning) 28%, transparent );--badge-warning-text: var(--color-warning);--badge-danger-background: color-mix( in srgb, var(--color-danger) 10%, transparent );--badge-danger-border: color-mix( in srgb, var(--color-danger) 28%, transparent );--badge-danger-text: var(--color-danger);--badge-info-background: color-mix( in srgb, var(--color-info) 10%, transparent );--badge-info-border: color-mix( in srgb, var(--color-info) 28%, transparent );--badge-info-text: var(--color-info);--badge-brand-background: color-mix( in srgb, var(--brand-primary) 10%, transparent );--badge-brand-border: color-mix( in srgb, var(--brand-primary) 28%, transparent );--badge-brand-text: var(--brand-primary);--tag-background: var(--surface-raised);--tag-border: var(--border-subtle);--tag-text: var(--text-muted);--footer-background: color-mix(in srgb, var(--surface-base), var(--text-primary) 3%);--footer-border: var(--border-default);--footer-text: var(--text-muted);--footer-link: var(--text-secondary);--footer-link-hover: var(--text-primary);--shadow-elevation-low: 0 2px 8px color-mix(in srgb, var(--brand-primary) 10%, rgba(0, 0, 0, .6));--shadow-elevation-medium: 0 4px 24px color-mix(in srgb, var(--brand-primary) 14%, rgba(0, 0, 0, .7));--shadow-elevation-high: 0 8px 40px color-mix(in srgb, var(--brand-primary) 18%, rgba(0, 0, 0, .8));--shadow-elevation-modal: 0 20px 60px color-mix(in srgb, var(--brand-primary) 22%, rgba(0, 0, 0, .9))}[data-theme=light]{--brand-primary: #6366f1;--brand-primary-hover: #4f46e5;--brand-primary-active: #4338ca;--brand-primary-light: #c7d2fe;--brand-primary-muted: color-mix(in srgb, var(--brand-primary) 12%, transparent);--brand-glow: color-mix(in srgb, var(--brand-primary) 18%, transparent);--text-on-brand: #ffffff;--background-primary: #ffffff;--background-secondary: color-mix(in srgb, var(--background-primary) 95%, black);--surface-base: color-mix(in srgb, var(--background-primary) 93%, black);--surface-raised: color-mix(in srgb, var(--background-primary) 86%, black);--surface-card: color-mix(in srgb, var(--background-primary) 97%, black);--surface-hover: color-mix(in srgb, var(--background-primary) 90%, black);--surface-elevated-1: color-mix(in srgb, var(--background-primary) 86%, black);--surface-elevated-2: color-mix(in srgb, var(--background-primary) 78%, black);--surface-elevated-3: color-mix(in srgb, var(--background-primary) 70%, black);--surface-glass: color-mix(in srgb, white 60%, transparent);--surface-glass-strong: color-mix(in srgb, white 75%, transparent);--text-primary: color-mix(in srgb, black 92%, white);--text-secondary: color-mix(in srgb, black 70%, white);--text-muted: color-mix(in srgb, black 55%, white);--text-inverse: color-mix(in srgb, white 96%, black);--text-accent: var(--brand-primary);--text-link: var(--brand-primary);--text-link-hover: var(--brand-primary-hover);--border-default: color-mix(in srgb, var(--text-primary) 12%, transparent);--border-strong: color-mix(in srgb, var(--text-primary) 20%, transparent);--border-subtle: color-mix(in srgb, var(--text-primary) 6%, transparent);--border-focus: color-mix(in srgb, var(--brand-primary) 40%, transparent);--glass-background: color-mix(in srgb, white 60%, transparent);--glass-border: color-mix(in srgb, black 12%, transparent);--overlay-scrim: color-mix(in srgb, black 40%, transparent);--overlay-scrim-strong: color-mix(in srgb, black 60%, transparent);--focus-ring-color: var(--border-focus);--selection-background: var(--brand-primary);--selection-text: #ffffff;--nav-background: color-mix(in srgb, var(--background-primary) 80%, transparent);--button-secondary-bg: color-mix(in srgb, var(--surface-base), var(--text-primary) 5%);--button-secondary-hover-bg: color-mix(in srgb, var(--surface-raised), var(--text-primary) 8%);--button-secondary-active-bg: color-mix(in srgb, var(--surface-raised), var(--text-primary) 12%);--button-ghost-hover-bg: color-mix(in srgb, var(--surface-base), var(--text-primary) 5%);--button-ghost-active-bg: color-mix(in srgb, var(--surface-base), var(--text-primary) 10%);--button-outline-hover-bg: color-mix(in srgb, var(--surface-base), var(--text-primary) 5%);--button-outline-active-bg: color-mix(in srgb, var(--surface-base), var(--text-primary) 10%);--button-destructive-bg: color-mix(in srgb, var(--color-danger) 10%, transparent);--button-destructive-text: var(--color-danger);--button-destructive-border: color-mix(in srgb, var(--color-danger) 18%, transparent);--card-gradient: linear-gradient( 180deg, color-mix(in srgb, var(--brand-primary) 7%, transparent), transparent 40% );--card-highlight: inset 0 1px 0 0 color-mix(in srgb, white 24%, transparent);--card-highlight-inset: inset 0 1px 0 0 color-mix(in srgb, white 24%, transparent);--card-border-hover: color-mix(in srgb, var(--brand-primary) 24%, transparent);--card-shadow: color-mix(in srgb, var(--brand-primary) 8%, rgba(0, 0, 0, .5));--card-shadow-hover: color-mix(in srgb, var(--brand-primary) 12%, rgba(0, 0, 0, .6));--form-background: color-mix(in srgb, var(--surface-base), var(--text-primary) 2%);--badge-background: color-mix(in srgb, var(--surface-raised), var(--text-primary) 5%);--shadow-elevation-low: 0 2px 8px color-mix(in srgb, var(--brand-primary) 6%, rgba(0, 0, 0, .4));--shadow-elevation-medium: 0 4px 24px color-mix(in srgb, var(--brand-primary) 8%, rgba(0, 0, 0, .5));--shadow-elevation-high: 0 8px 40px color-mix(in srgb, var(--brand-primary) 12%, rgba(0, 0, 0, .6));--shadow-elevation-modal: 0 20px 60px color-mix(in srgb, var(--brand-primary) 16%, rgba(0, 0, 0, .7))}:root{--font-family-display: "Plus Jakarta Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans";--font-family-body: "Plus Jakarta Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans";--font-family-mono: "JetBrains Mono", "Fira Code", monospace;--font-weight-light: 300;--font-weight-regular: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-weight-extrabold: 800;--font-size-base: 1rem;--space-4: 1rem;--radius-md: .5rem;--motion-duration-normal: .3s;--motion-ease-out: cubic-bezier(0, 0, .2, 1);--motion-ease-spring: cubic-bezier(.175, .885, .32, 1.275);--shadow-elevation-low: 0 2px 8px rgba(0, 0, 0, .15);--glass-blur: 16px;--button-radius: var(--radius-full);--button-padding-x: 1.5rem;--button-padding-y: .75rem;--card-radius: var(--radius-lg);--nav-height: 4.5rem}
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AAIH,wDAAwD;AACxD,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkLd,CAAA;AAEV,qDAAqD;AACrD,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoIpB,CAAA;AAEV,MAAM,MAAM,SAAS,GAAG,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,OAAO,WAAW,CAAC,CAAA;AACtE,MAAM,MAAM,cAAc,GAAG,CAAC,OAAO,iBAAiB,CAAC,CAAC,MAAM,OAAO,iBAAiB,CAAC,CAAA;AAEvF,oEAAoE;AACpE,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAGlB,CAAA;AAEV,kEAAkE;AAClE,wBAAgB,KAAK,CAAC,IAAI,EAAE,SAAS,GAAG,cAAc,GAAG,MAAM,CAE9D;AAED,0EAA0E;AAC1E,OAAO,cAAc,CAAA;AACrB,OAAO,sBAAsB,CAAA;AAC7B,OAAO,uBAAuB,CAAA
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AAIH,wDAAwD;AACxD,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkLd,CAAA;AAEV,qDAAqD;AACrD,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoIpB,CAAA;AAEV,MAAM,MAAM,SAAS,GAAG,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,OAAO,WAAW,CAAC,CAAA;AACtE,MAAM,MAAM,cAAc,GAAG,CAAC,OAAO,iBAAiB,CAAC,CAAC,MAAM,OAAO,iBAAiB,CAAC,CAAA;AAEvF,oEAAoE;AACpE,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAGlB,CAAA;AAEV,kEAAkE;AAClE,wBAAgB,KAAK,CAAC,IAAI,EAAE,SAAS,GAAG,cAAc,GAAG,MAAM,CAE9D;AAED,0EAA0E;AAC1E,OAAO,cAAc,CAAA;AACrB,OAAO,sBAAsB,CAAA;AAC7B,OAAO,uBAAuB,CAAA"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@paraxe/design",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.4.2",
|
|
4
4
|
"description": "Paraxe design system — canonical tokens, themes, and presets. Source of truth for the entire ecosystem.",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/index.js",
|
|
@@ -12,6 +12,7 @@
|
|
|
12
12
|
"types": "./dist/index.d.ts",
|
|
13
13
|
"import": "./dist/index.js"
|
|
14
14
|
},
|
|
15
|
+
"./style.css": "./src/style.css",
|
|
15
16
|
"./tokens.css": "./src/tokens.css",
|
|
16
17
|
"./theme.css": "./src/themes/default.css",
|
|
17
18
|
"./components.css": "./src/components.css",
|
package/src/components.css
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/* ==========================================================================
|
|
2
|
-
|
|
2
|
+
— components.css
|
|
3
3
|
Shared HTML/CSS component classes (framework-agnostic).
|
|
4
4
|
|
|
5
5
|
These classes consume the canonical Loba tokens:
|
|
@@ -8,8 +8,8 @@
|
|
|
8
8
|
- Personality → presets/*.css (--button-radius, etc.)
|
|
9
9
|
|
|
10
10
|
They are the SINGLE source of truth for the framework-agnostic component
|
|
11
|
-
layer.
|
|
12
|
-
class layer). Non
|
|
11
|
+
layer. consumers use the Vue components instead (no duplicate
|
|
12
|
+
class layer). Non- projects consume these classes directly.
|
|
13
13
|
|
|
14
14
|
✅ DO put here:
|
|
15
15
|
- Button classes (.btn, .btn-primary, .btn-secondary, etc.)
|
|
@@ -886,7 +886,6 @@
|
|
|
886
886
|
display: inline-flex;
|
|
887
887
|
align-items: center;
|
|
888
888
|
gap: var(--tag-gap);
|
|
889
|
-
width: fit-content;
|
|
890
889
|
|
|
891
890
|
min-height: var(--tag-min-height);
|
|
892
891
|
padding: var(--tag-padding-y) var(--tag-padding-x);
|
|
@@ -1542,6 +1541,12 @@
|
|
|
1542
1541
|
.stack-full {
|
|
1543
1542
|
width: 100%;
|
|
1544
1543
|
}
|
|
1544
|
+
.badge,
|
|
1545
|
+
.tag,
|
|
1546
|
+
.btn {
|
|
1547
|
+
width: fit-content;
|
|
1548
|
+
}
|
|
1549
|
+
|
|
1545
1550
|
|
|
1546
1551
|
.inline {
|
|
1547
1552
|
display: flex;
|
|
@@ -4151,6 +4156,7 @@ OVERLAYS
|
|
|
4151
4156
|
display: inline-flex;
|
|
4152
4157
|
align-items: center;
|
|
4153
4158
|
gap: var(--badge-gap);
|
|
4159
|
+
width: fit-content;
|
|
4154
4160
|
|
|
4155
4161
|
min-height: var(--badge-min-height);
|
|
4156
4162
|
padding: var(--badge-padding-y) var(--badge-padding-x);
|
package/src/index.ts
CHANGED