@ecopages/radiant-themes 0.3.2 → 0.3.3

package/dist/compiled/themes/zed/compact.css

@@ -0,0 +1,1204 @@
+/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
+@layer properties;
+:root {
+  --shadow-control: 0 1px 2px 0 rgb(0 0 0 / 0.05);
+  --shadow-overlay: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
+  --shadow-modal: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
+  --sheen-highlight: color-mix(in oklab, white 8%, transparent);
+  --sheen-shade: color-mix(in oklab, black 7%, transparent);
+  --sheen-image: linear-gradient(to bottom, var(--sheen-highlight), transparent 55%, var(--sheen-shade));
+}
+:root, :host {
+  --shadow-control: var(--shadow-control);
+  --shadow-overlay: var(--shadow-overlay);
+  --shadow-modal: var(--shadow-modal);
+  --font-sans: var(--font-sans);
+  --font-heading: var(--font-heading);
+  --font-mono: var(--font-mono);
+  --text-xs: var(--text-xs);
+  --text-sm: var(--text-sm);
+  --text-body: var(--text-body);
+  --text-lg: var(--text-lg);
+  --text-xl: var(--text-xl);
+  --text-2xl: var(--text-2xl);
+  --text-3xl: var(--text-3xl);
+  --text-4xl: var(--text-4xl);
+  --text-5xl: var(--text-5xl);
+  --font-weight-medium: var(--weight-medium);
+  --opacity-disabled: var(--opacity-disabled);
+  --opacity-muted: var(--opacity-muted);
+  --spacing-1: var(--space-1);
+  --spacing-2: var(--space-2);
+  --spacing-6: var(--space-6);
+  --spacing-8: var(--space-8);
+  --radius-none: var(--border-radius-none);
+  --radius-sm: var(--border-radius-sm);
+  --radius-control: var(--radius-control);
+  --radius-container: var(--radius-container);
+  --radius-pill: var(--radius-pill);
+}
+:root {
+  --text-xs: 0.75rem;
+  --text-sm: 0.875rem;
+  --text-body: 1rem;
+  --text-lg: 1.125rem;
+  --text-xl: 1.25rem;
+  --text-2xl: 1.5rem;
+  --text-3xl: 1.875rem;
+  --text-4xl: 2.25rem;
+  --text-5xl: 3rem;
+  --text-label: 0.875rem;
+  --text-control: 0.875rem;
+  --text-control-input: 1rem;
+  --leading-body: 1.5;
+  --leading-relaxed: 1.625;
+  --leading-compact: 1.25;
+  --weight-regular: 400;
+  --weight-medium: 500;
+  --weight-semibold: 600;
+  --tracking-wide: 0.025em;
+}
+@media (min-width: 640px) {
+  :root {
+    --text-control-input: var(--text-control);
+  }
+}
+:root {
+  --duration-fast: 150ms;
+  --duration-normal: 200ms;
+  --duration-slow: 300ms;
+  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
+  --ease-out: cubic-bezier(0, 0, 0.2, 1);
+  --ease-out-strong: cubic-bezier(0.23, 1, 0.32, 1);
+  --popup-scale-from: 0.96;
+  --popup-shift: 4px;
+  --popup-enter-duration: var(--duration-fast);
+  --popup-exit-duration: 100ms;
+  --tooltip-duration: 120ms;
+  --hover-card-enter-duration: 180ms;
+  --dialog-enter-duration: var(--duration-normal);
+  --dialog-exit-duration: 120ms;
+  --backdrop-duration: var(--duration-fast);
+  --check-duration: min(120ms, var(--duration-fast));
+  --press-shift: 1px;
+  --color-black: oklch(0% 0 0);
+  --color-white: oklch(100% 0 0);
+  --border-width-hairline: 1px;
+  --border-width-thin: 1px;
+  --border-width-thick: 2px;
+  --rui-track-mix: 45%;
+  --rui-track-fill: var(--on-background);
+  @supports (color: color-mix(in lab, red, red)) {
+    --rui-track-fill: color-mix(in oklab, var(--on-background) var(--rui-track-mix), transparent);
+  }
+  --focus-ring-width: 2px;
+  --focus-ring-offset: 2px;
+  --opacity-disabled: 0.5;
+  --opacity-muted: 0.6;
+  --z-dropdown: 10;
+  --z-popover: 20;
+  --z-overlay: 30;
+  --z-modal: 40;
+  --z-toast: 50;
+  --size-control-sm: var(--space-8, 2rem);
+  --size-control-md: var(--space-10, 2.5rem);
+  --size-control-lg: var(--space-12, 3rem);
+  --size-icon-sm: 1rem;
+  --size-icon-md: 1.25rem;
+}
+:where(:root, .dark) {
+  --color-transparent: transparent;
+  --color-gray-50: var(--gray-50);
+  --color-gray-100: var(--gray-100);
+  --color-gray-200: var(--gray-200);
+  --color-gray-300: var(--gray-300);
+  --color-gray-400: var(--gray-400);
+  --color-gray-500: var(--gray-500);
+  --color-gray-600: var(--gray-600);
+  --color-gray-700: var(--gray-700);
+  --color-gray-800: var(--gray-800);
+  --color-gray-900: var(--gray-900);
+  --color-gray-950: var(--gray-950);
+  --color-primary: var(--primary);
+  --color-primary-light: var(--primary-light);
+  --color-primary-dark: var(--primary-dark);
+  --color-on-primary: var(--on-primary);
+  --color-primary-container: var(--primary-container);
+  --color-on-primary-container: var(--on-primary-container);
+  --color-secondary: var(--secondary);
+  --color-secondary-light: var(--secondary-light);
+  --color-secondary-dark: var(--secondary-dark);
+  --color-on-secondary: var(--on-secondary);
+  --color-secondary-container: var(--secondary-container);
+  --color-on-secondary-container: var(--on-secondary-container);
+  --color-tertiary: var(--tertiary);
+  --color-on-tertiary: var(--on-tertiary);
+  --color-tertiary-container: var(--tertiary-container);
+  --color-on-tertiary-container: var(--on-tertiary-container);
+  --color-error: var(--error);
+  --color-error-light: var(--error-light);
+  --color-error-dark: var(--error-dark);
+  --color-on-error: var(--on-error);
+  --color-error-container: var(--error-container);
+  --color-on-error-container: var(--on-error-container);
+  --color-success: var(--success);
+  --color-success-light: var(--success-light);
+  --color-success-dark: var(--success-dark);
+  --color-on-success: var(--on-success);
+  --color-success-container: var(--success-container);
+  --color-on-success-container: var(--on-success-container);
+  --color-info: var(--info);
+  --color-on-info: var(--on-info);
+  --color-info-container: var(--info-container);
+  --color-on-info-container: var(--on-info-container);
+  --color-info-light: var(--info-light);
+  --color-info-dark: var(--info-dark);
+  --color-warning: var(--warning);
+  --color-on-warning: var(--on-warning);
+  --color-warning-container: var(--warning-container);
+  --color-on-warning-container: var(--on-warning-container);
+  --color-warning-light: var(--warning-light);
+  --color-warning-dark: var(--warning-dark);
+  --color-destructive: var(--error);
+  --color-on-destructive: var(--on-error);
+  --color-destructive-container: var(--error-container);
+  --color-on-destructive-container: var(--on-error-container);
+  --color-neutral: var(--neutral);
+  --color-surface: var(--surface);
+  --color-on-surface: var(--on-surface);
+  --color-surface-container-lowest: var(--surface-container-lowest);
+  --color-on-surface-container-lowest: var(--on-surface-container-lowest);
+  --color-surface-container-low: var(--surface-container-low);
+  --color-on-surface-container-low: var(--on-surface-container-low);
+  --color-surface-container: var(--surface-container);
+  --color-on-surface-container: var(--on-surface-container);
+  --color-surface-container-high: var(--surface-container-high);
+  --color-on-surface-container-high: var(--on-surface-container-high);
+  --color-surface-container-highest: var(--surface-container-highest);
+  --color-on-surface-container-highest: var(--on-surface-container-highest);
+  --color-background: var(--background);
+  --color-on-background: var(--on-background);
+  --color-border: var(--border);
+  --color-focus-ring: var(--focus-ring);
+  --color-on-focus-ring: var(--on-focus-ring);
+  --color-link: var(--link);
+  --color-overlay: var(--overlay);
+  --color-background-code: var(--background-code);
+  --color-on-background-code: var(--on-background-code);
+}
+@layer base {
+  :where(a[href], button, input:not([type='hidden']):not(.sr-only), select, textarea, [tabindex]):not(
+			[data-rui-focus-managed]
+		):focus-visible {
+    outline: var(--focus-ring-width, 3px) solid var(--focus-ring);
+    outline-offset: var(--focus-ring-offset, 2px);
+  }
+}
+@media (prefers-contrast: more) {
+  html:root,
+	html:root[data-rui-theme],
+	html:root.dark[data-rui-theme] {
+    --rui-border-alpha: 100%;
+    --rui-control-border-color: var(--on-background);
+    --border: var(--rui-border-color);
+    @supports (color: color-mix(in lab, red, red)) {
+      --border: color-mix(in oklab, var(--rui-border-color) 45%, var(--on-background));
+    }
+    --opacity-disabled: 0.78;
+    --opacity-muted: 0.78;
+    --focus-ring-width: 3px;
+    --focus-ring-offset: 2px;
+  }
+}
+@media (prefers-reduced-motion: reduce) {
+  :root {
+    --duration-fast: 0ms;
+    --duration-normal: 0ms;
+    --duration-slow: 0ms;
+    --press-shift: 0px;
+    --popup-scale-from: 1;
+    --popup-shift: 0px;
+    --popup-exit-duration: 0ms;
+    --tooltip-duration: 0ms;
+    --hover-card-enter-duration: 0ms;
+    --dialog-exit-duration: 0ms;
+  }
+  *,
+	*::before,
+	*::after {
+    animation-duration: 0.01ms !important;
+    animation-iteration-count: 1 !important;
+    scroll-behavior: auto !important;
+    transition-duration: 0.01ms !important;
+  }
+}
+@media (forced-colors: active) {
+  html:root,
+	html:root.dark,
+	html:root[data-rui-theme],
+	html:root.dark[data-rui-theme] {
+    --primary: Highlight;
+    --on-primary: HighlightText;
+    --primary-container: Highlight;
+    --on-primary-container: HighlightText;
+    --primary-light: LinkText;
+    --primary-dark: Highlight;
+    --secondary: ButtonText;
+    --on-secondary: ButtonFace;
+    --secondary-container: ButtonFace;
+    --on-secondary-container: ButtonText;
+    --tertiary: ButtonText;
+    --on-tertiary: ButtonFace;
+    --tertiary-container: ButtonFace;
+    --on-tertiary-container: ButtonText;
+    --error: CanvasText;
+    --on-error: Canvas;
+    --error-container: Canvas;
+    --on-error-container: CanvasText;
+    --success: CanvasText;
+    --on-success: Canvas;
+    --success-container: Canvas;
+    --on-success-container: CanvasText;
+    --info: LinkText;
+    --on-info: Canvas;
+    --info-container: Canvas;
+    --on-info-container: CanvasText;
+    --warning: CanvasText;
+    --on-warning: Canvas;
+    --warning-container: Canvas;
+    --on-warning-container: CanvasText;
+    --neutral: GrayText;
+    --surface: Canvas;
+    --on-surface: CanvasText;
+    --surface-container-lowest: Canvas;
+    --on-surface-container-lowest: CanvasText;
+    --surface-container-low: Canvas;
+    --on-surface-container-low: CanvasText;
+    --surface-container: Canvas;
+    --on-surface-container: CanvasText;
+    --surface-container-high: Canvas;
+    --on-surface-container-high: CanvasText;
+    --surface-container-highest: Canvas;
+    --on-surface-container-highest: CanvasText;
+    --background: Canvas;
+    --on-background: CanvasText;
+    --border: ButtonText;
+    --focus-ring: Highlight;
+    --on-focus-ring: HighlightText;
+    --link: LinkText;
+    --overlay: Canvas;
+    --background-code: Canvas;
+    --on-background-code: CanvasText;
+  }
+  :where(.rui-button, .rui-input, .rui-textarea, .rui-select, .rui-checkbox__control, .rui-radio__control) {
+    forced-color-adjust: auto;
+    border-color: ButtonText;
+  }
+  :where([aria-selected='true'], [aria-checked='true'], [aria-pressed='true'], [aria-current='page']) {
+    border-color: Highlight;
+  }
+  @layer base {
+    :where(a[href], button, input:not([type='hidden']):not(.sr-only), select, textarea, [tabindex]):not(
+				[data-rui-focus-managed]
+			):focus-visible {
+      outline: 3px solid Highlight !important;
+      outline-offset: 2px !important;
+    }
+  }
+  :disabled,
+	[aria-disabled='true'] {
+    color: GrayText;
+    opacity: 1;
+  }
+}
+:where(:root) {
+  --rui-density: 1;
+}
+:root {
+  --space-1: calc(0.25rem * var(--rui-density));
+  --space-2: calc(0.5rem * var(--rui-density));
+  --space-3: calc(0.75rem * var(--rui-density));
+  --space-4: calc(1rem * var(--rui-density));
+  --space-5: calc(1.25rem * var(--rui-density));
+  --space-6: calc(1.5rem * var(--rui-density));
+  --space-8: calc(2rem * var(--rui-density));
+  --space-10: calc(2.5rem * var(--rui-density));
+  --space-12: calc(3rem * var(--rui-density));
+  --space-16: calc(4rem * var(--rui-density));
+  --space-control-x: var(--space-3);
+  --space-control-y: var(--space-2);
+  --space-inline: var(--space-2);
+  --space-stack: var(--space-4);
+  --space-inset: var(--space-4);
+  --rui-radius-scale: 1;
+  --border-radius-none: 0;
+  --border-radius-xs: calc(0.25rem * var(--rui-radius-scale));
+  --border-radius-sm: calc(0.5rem * var(--rui-radius-scale));
+  --border-radius-md: calc(0.75rem * var(--rui-radius-scale));
+  --border-radius-lg: calc(1rem * var(--rui-radius-scale));
+  --border-radius-xl: calc(1.25rem * var(--rui-radius-scale));
+  --border-radius-2xl: calc(1.5rem * var(--rui-radius-scale));
+  --border-radius-3xl: calc(2rem * var(--rui-radius-scale));
+  --border-radius-full: 9999px;
+  --radius-control: var(--border-radius-md);
+  --radius-container: var(--border-radius-lg);
+  --radius-pill: var(--border-radius-full);
+}
+@layer components {
+  :root .rui-input-group .rui-input {
+    border-width: 0;
+    border-radius: 0;
+    background-color: transparent;
+    box-shadow: none;
+  }
+}
+:where(:root) {
+  color-scheme: light;
+}
+:where(.dark) {
+  color-scheme: dark;
+}
+:where(:root),
+:root[data-rui-theme='zed'] {
+  --color-zed-background: #fafafa;
+  --color-zed-panel: #ebebec;
+  --color-zed-elevated: #dcdcdd;
+  --color-zed-border: #c9c9ca;
+  --color-zed-border-subtle: #dcdcdd;
+  --color-zed-border-strong: #8a8a90;
+  --color-zed-text: #383a41;
+  --color-zed-text-muted: #5d5f68;
+  --color-zed-accent: #5c78e2;
+  --color-zed-accent-solid: #4a62cf;
+  --color-zed-accent-hover: #3f56bd;
+  --color-zed-accent-text: #3b55c4;
+  --color-zed-green: #669f59;
+  --color-zed-red: #d36151;
+  --color-zed-amber: #dec184;
+  --color-zed-purple: #a449ab;
+  --color-zed-teal: #3882b7;
+  --color-zed-hover: var(--color-zed-accent);
+  @supports (color: color-mix(in lab, red, red)) {
+    --color-zed-hover: color-mix(in srgb, var(--color-zed-accent) 10%, transparent);
+  }
+  --color-zed-selected: var(--color-zed-accent);
+  @supports (color: color-mix(in lab, red, red)) {
+    --color-zed-selected: color-mix(in srgb, var(--color-zed-accent) 15%, transparent);
+  }
+}
+:where(.dark),
+:root.dark[data-rui-theme='zed'] {
+  --color-zed-background: #282c33;
+  --color-zed-panel: #2f343e;
+  --color-zed-elevated: #363c46;
+  --color-zed-border: #464b57;
+  --color-zed-border-subtle: #363c46;
+  --color-zed-border-strong: #7d8392;
+  --color-zed-text: #dce0e5;
+  --color-zed-text-muted: #a9afbc;
+  --color-zed-accent: #74ade8;
+  --color-zed-accent-solid: #74ade8;
+  --color-zed-accent-hover: #8bbcee;
+  --color-zed-accent-text: #74ade8;
+  --color-zed-green: #a1c181;
+  --color-zed-red: #d07277;
+  --color-zed-amber: #dfc184;
+  --color-zed-purple: #b477cf;
+  --color-zed-teal: #6eb4bf;
+  --color-zed-hover: var(--color-zed-accent);
+  @supports (color: color-mix(in lab, red, red)) {
+    --color-zed-hover: color-mix(in srgb, var(--color-zed-accent) 10%, transparent);
+  }
+  --color-zed-selected: var(--color-zed-accent);
+  @supports (color: color-mix(in lab, red, red)) {
+    --color-zed-selected: color-mix(in srgb, var(--color-zed-accent) 15%, transparent);
+  }
+}
+:where(:root),
+:root[data-rui-theme='zed'] {
+  --gray-50: #fafafa;
+  --gray-100: #f3f3f4;
+  --gray-200: #ebebec;
+  --gray-300: #dcdcdd;
+  --gray-400: #c9c9ca;
+  --gray-500: #a3a4a9;
+  --gray-600: #7f8089;
+  --gray-700: #5d5f68;
+  --gray-800: #494b53;
+  --gray-900: #383a41;
+  --gray-950: #26282d;
+  --primary: var(--color-zed-accent-solid);
+  --on-primary: white;
+  --primary-light: var(--color-zed-accent);
+  --primary-dark: var(--color-zed-accent-hover);
+  --primary-container: var(--color-zed-accent);
+  @supports (color: color-mix(in lab, red, red)) {
+    --primary-container: color-mix(in oklab, var(--color-zed-accent), white 82%);
+  }
+  --on-primary-container: var(--color-zed-accent);
+  @supports (color: color-mix(in lab, red, red)) {
+    --on-primary-container: color-mix(in oklab, var(--color-zed-accent), black 55%);
+  }
+  --secondary: var(--color-zed-teal);
+  @supports (color: color-mix(in lab, red, red)) {
+    --secondary: color-mix(in oklab, var(--color-zed-teal), black 12%);
+  }
+  --on-secondary: white;
+  --secondary-light: var(--color-zed-teal);
+  @supports (color: color-mix(in lab, red, red)) {
+    --secondary-light: color-mix(in oklab, var(--color-zed-teal), white 30%);
+  }
+  --secondary-dark: var(--color-zed-teal);
+  @supports (color: color-mix(in lab, red, red)) {
+    --secondary-dark: color-mix(in oklab, var(--color-zed-teal), black 30%);
+  }
+  --secondary-container: var(--color-zed-teal);
+  @supports (color: color-mix(in lab, red, red)) {
+    --secondary-container: color-mix(in oklab, var(--color-zed-teal), white 85%);
+  }
+  --on-secondary-container: var(--color-zed-teal);
+  @supports (color: color-mix(in lab, red, red)) {
+    --on-secondary-container: color-mix(in oklab, var(--color-zed-teal), black 60%);
+  }
+  --tertiary: var(--color-zed-purple);
+  --on-tertiary: white;
+  --tertiary-container: var(--color-zed-purple);
+  @supports (color: color-mix(in lab, red, red)) {
+    --tertiary-container: color-mix(in oklab, var(--color-zed-purple), white 85%);
+  }
+  --on-tertiary-container: var(--color-zed-purple);
+  @supports (color: color-mix(in lab, red, red)) {
+    --on-tertiary-container: color-mix(in oklab, var(--color-zed-purple), black 60%);
+  }
+  --error: var(--color-zed-red);
+  @supports (color: color-mix(in lab, red, red)) {
+    --error: color-mix(in oklab, var(--color-zed-red), black 12%);
+  }
+  --on-error: white;
+  --error-light: var(--color-zed-red);
+  @supports (color: color-mix(in lab, red, red)) {
+    --error-light: color-mix(in oklab, var(--color-zed-red), white 30%);
+  }
+  --error-dark: var(--color-zed-red);
+  @supports (color: color-mix(in lab, red, red)) {
+    --error-dark: color-mix(in oklab, var(--color-zed-red), black 30%);
+  }
+  --error-container: var(--color-zed-red);
+  @supports (color: color-mix(in lab, red, red)) {
+    --error-container: color-mix(in oklab, var(--color-zed-red), white 85%);
+  }
+  --on-error-container: var(--color-zed-red);
+  @supports (color: color-mix(in lab, red, red)) {
+    --on-error-container: color-mix(in oklab, var(--color-zed-red), black 60%);
+  }
+  --success: var(--color-zed-green);
+  @supports (color: color-mix(in lab, red, red)) {
+    --success: color-mix(in oklab, var(--color-zed-green), black 15%);
+  }
+  --on-success: white;
+  --success-light: var(--color-zed-green);
+  @supports (color: color-mix(in lab, red, red)) {
+    --success-light: color-mix(in oklab, var(--color-zed-green), white 30%);
+  }
+  --success-dark: var(--color-zed-green);
+  @supports (color: color-mix(in lab, red, red)) {
+    --success-dark: color-mix(in oklab, var(--color-zed-green), black 30%);
+  }
+  --success-container: var(--color-zed-green);
+  @supports (color: color-mix(in lab, red, red)) {
+    --success-container: color-mix(in oklab, var(--color-zed-green), white 85%);
+  }
+  --on-success-container: var(--color-zed-green);
+  @supports (color: color-mix(in lab, red, red)) {
+    --on-success-container: color-mix(in oklab, var(--color-zed-green), black 60%);
+  }
+  --info: var(--color-zed-accent-solid);
+  --on-info: white;
+  --info-light: var(--color-zed-accent);
+  --info-dark: var(--color-zed-accent-hover);
+  --info-container: var(--color-zed-accent);
+  @supports (color: color-mix(in lab, red, red)) {
+    --info-container: color-mix(in oklab, var(--color-zed-accent), white 85%);
+  }
+  --on-info-container: var(--color-zed-accent);
+  @supports (color: color-mix(in lab, red, red)) {
+    --on-info-container: color-mix(in oklab, var(--color-zed-accent), black 60%);
+  }
+  --warning: var(--color-zed-amber);
+  --on-warning: #2e2410;
+  --warning-light: var(--color-zed-amber);
+  @supports (color: color-mix(in lab, red, red)) {
+    --warning-light: color-mix(in oklab, var(--color-zed-amber), white 30%);
+  }
+  --warning-dark: var(--color-zed-amber);
+  @supports (color: color-mix(in lab, red, red)) {
+    --warning-dark: color-mix(in oklab, var(--color-zed-amber), black 30%);
+  }
+  --warning-container: var(--color-zed-amber);
+  @supports (color: color-mix(in lab, red, red)) {
+    --warning-container: color-mix(in oklab, var(--color-zed-amber), white 70%);
+  }
+  --on-warning-container: var(--color-zed-amber);
+  @supports (color: color-mix(in lab, red, red)) {
+    --on-warning-container: color-mix(in oklab, var(--color-zed-amber), black 70%);
+  }
+  --neutral: var(--color-zed-text-muted);
+  --surface: var(--color-zed-background);
+  --on-surface: var(--color-zed-text);
+  --surface-container-lowest: var(--color-zed-background);
+  --on-surface-container-lowest: var(--color-zed-text);
+  --surface-container-low: #f3f3f4;
+  --on-surface-container-low: var(--color-zed-text);
+  --surface-container: var(--color-zed-panel);
+  --on-surface-container: var(--color-zed-text);
+  --surface-container-high: #e3e3e4;
+  --on-surface-container-high: var(--color-zed-text);
+  --surface-container-highest: var(--color-zed-elevated);
+  --on-surface-container-highest: var(--color-zed-text);
+  --background: var(--color-zed-background);
+  --on-background: var(--color-zed-text);
+  --rui-border-color: var(--color-zed-border);
+  --rui-control-border-color: var(--color-zed-border-strong);
+  --rui-border-hover-color: var(--color-zed-text-muted);
+  --rui-border-active-color: var(--color-zed-accent-solid);
+  --border: var(--rui-border-color);
+  @supports (color: color-mix(in lab, red, red)) {
+    --border: color-mix(in srgb, var(--rui-border-color) var(--rui-border-alpha), transparent);
+  }
+  --focus-ring: var(--color-zed-accent-solid);
+  --on-focus-ring: white;
+  --link: var(--color-zed-accent-text);
+  --overlay: oklch(0% 0 0 / 0.35);
+  --background-code: var(--color-zed-panel);
+  --on-background-code: var(--color-zed-text);
+}
+:where(.dark),
+:root.dark[data-rui-theme='zed'] {
+  --gray-50: #23262c;
+  --gray-100: #282c33;
+  --gray-200: #2f343e;
+  --gray-300: #363c46;
+  --gray-400: #464b57;
+  --gray-500: #5c6270;
+  --gray-600: #7d8392;
+  --gray-700: #a9afbc;
+  --gray-800: #c4c9d2;
+  --gray-900: #dce0e5;
+  --gray-950: #eef0f3;
+  --primary: var(--color-zed-accent-solid);
+  --on-primary: #14233a;
+  --primary-light: var(--color-zed-accent-hover);
+  --primary-dark: var(--color-zed-accent);
+  @supports (color: color-mix(in lab, red, red)) {
+    --primary-dark: color-mix(in oklab, var(--color-zed-accent), black 20%);
+  }
+  --primary-container: #2c4466;
+  --on-primary-container: #d5e6fa;
+  --secondary: var(--color-zed-teal);
+  --on-secondary: #0f2428;
+  --secondary-container: #284249;
+  --on-secondary-container: #cfeaee;
+  --tertiary: var(--color-zed-purple);
+  --on-tertiary: #230f2d;
+  --tertiary-container: #442a54;
+  --on-tertiary-container: #ecd6f6;
+  --error: var(--color-zed-red);
+  --on-error: #310c0f;
+  --error-container: #5a2c30;
+  --on-error-container: #fbdadc;
+  --success: var(--color-zed-green);
+  --on-success: #142208;
+  --success-container: #3a4a2c;
+  --on-success-container: #dcecca;
+  --info: var(--color-zed-accent);
+  --on-info: #14233a;
+  --info-container: #2c4466;
+  --on-info-container: #d5e6fa;
+  --warning: var(--color-zed-amber);
+  --on-warning: #2e2410;
+  --warning-container: #4d4126;
+  --on-warning-container: #f5e6c0;
+  --surface: var(--color-zed-background);
+  --on-surface: var(--color-zed-text);
+  --surface-container-lowest: #23262c;
+  --on-surface-container-lowest: var(--color-zed-text);
+  --surface-container-low: #2b2f37;
+  --on-surface-container-low: var(--color-zed-text);
+  --surface-container: var(--color-zed-panel);
+  --on-surface-container: var(--color-zed-text);
+  --surface-container-high: var(--color-zed-elevated);
+  --on-surface-container-high: var(--color-zed-text);
+  --surface-container-highest: #3e444f;
+  --on-surface-container-highest: var(--color-zed-text);
+  --background: var(--color-zed-background);
+  --on-background: var(--color-zed-text);
+  --rui-control-border-color: var(--color-zed-border-strong);
+  --rui-border-hover-color: var(--color-zed-text-muted);
+  --rui-border-active-color: var(--color-zed-accent);
+  --focus-ring: var(--color-zed-accent);
+  --on-focus-ring: #14233a;
+  --link: var(--color-zed-accent);
+  --background-code: #23262c;
+  --on-background-code: var(--color-zed-text);
+}
+:where(:root),
+:root[data-rui-theme='zed'] {
+  --rui-knob-linecap: butt;
+  --font-sans: 'IBM Plex Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
+  --font-heading: 'IBM Plex Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
+  --font-mono: Lilex, 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
+  --rui-border-alpha: 100%;
+  --border-radius-xs: 0.125rem;
+  --border-radius-sm: 0.1875rem;
+  --border-radius-md: 0.25rem;
+  --border-radius-lg: 0.375rem;
+  --border-radius-xl: 0.5rem;
+  --border-radius-2xl: 0.75rem;
+  --border-radius-3xl: 1rem;
+  --radius-control: var(--border-radius-md);
+  --radius-container: var(--border-radius-lg);
+  --size-control-sm: 1.5rem;
+  --size-control-md: 1.75rem;
+  --size-control-lg: 2rem;
+  --text-control: 0.8125rem;
+  --space-control-x: var(--space-2);
+  --space-control-y: var(--space-1);
+  --sheen-image: none;
+}
+:root rui-tooltip {
+  --rui-tooltip-surface: var(--color-zed-elevated);
+  --rui-tooltip-color: var(--color-zed-text);
+  --rui-tooltip-radius: var(--border-radius-md);
+  --rui-tooltip-shadow: 0 0 0 1px var(--color-zed-border);
+}
+@layer components {
+  :root .rui-button {
+    border-radius: var(--radius-control);
+    border-style: var(--tw-border-style);
+    border-width: 1px;
+    border-color: transparent;
+    --tw-font-weight: var(--font-weight-medium);
+    font-weight: var(--font-weight-medium);
+    --tw-shadow: 0 0 #0000;
+    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+    background-image: none;
+  }
+  :root .rui-button--filled {
+    background-color: var(--primary);
+    color: var(--on-primary);
+  }
+  :root .rui-button--filled:hover:not(:disabled) {
+    background-color: var(--color-zed-accent-hover);
+    color: var(--on-primary);
+  }
+  :root .rui-button--outline {
+    background-color: transparent;
+    color: var(--on-surface);
+    --tw-shadow: 0 0 #0000;
+    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+    border-color: var(--rui-control-border-color);
+  }
+  :root .rui-button--outline:hover:not(:disabled),
+	:root .rui-button--ghost:hover:not(:disabled) {
+    background-color: var(--color-zed-hover);
+  }
+  :root .rui-button--outline:active:not(:disabled),
+	:root .rui-button--ghost:active:not(:disabled) {
+    background-color: var(--color-zed-selected);
+  }
+  :root .rui-button:focus-visible,
+	:root .rui-tabs__tab:focus-visible {
+    outline: 1px solid var(--focus-ring);
+    outline-offset: 2px;
+    --tw-ring-shadow: 0 0 #0000;
+    --tw-ring-offset-shadow: 0 0 #0000;
+  }
+  :root .rui-input,
+	:root .rui-textarea,
+	:root .rui-autocomplete__input,
+	:root .rui-combobox__control,
+	:root .rui-date-field__group,
+	:root .rui-date-range-picker__group,
+	:root .rui-input-group,
+	:root .rui-number-field__group,
+	:root rui-date-input:where(:not([data-date-field-input], [data-range-start], [data-range-end])),
+	:root .rui-select__control {
+    border-radius: var(--radius-control);
+    border-style: var(--tw-border-style);
+    border-width: 1px;
+    background-color: var(--surface-container-low);
+    color: var(--on-surface);
+    --tw-shadow: 0 0 #0000;
+    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+    border-color: var(--rui-control-border-color);
+  }
+  :root .rui-input:hover:not(:disabled),
+	:root .rui-textarea:hover:not(:disabled),
+	:root .rui-select__control:hover:not(:disabled) {
+    border-color: var(--rui-border-hover-color);
+  }
+  :root .rui-input:focus-visible,
+	:root .rui-textarea:focus-visible,
+	:root .rui-combobox__control:focus-within,
+	:root .rui-number-field__group:focus-within,
+	:root .rui-input-group:focus-within,
+	:root .rui-select__control:focus-within {
+    border-color: var(--focus-ring);
+    outline: 1px solid var(--focus-ring);
+    outline-offset: 0;
+    --tw-ring-shadow: 0 0 #0000;
+    --tw-ring-offset-shadow: 0 0 #0000;
+  }
+  :root .rui-input-group .rui-input:focus-visible {
+    outline: none;
+  }
+  :root .rui-checkbox__control,
+	:root .rui-radio__control {
+    background-color: var(--surface-container-low);
+    border-color: var(--rui-control-border-color);
+  }
+  :root .rui-checkbox__control {
+    border-radius: var(--radius-sm);
+  }
+  :root .rui-badge {
+    border-radius: var(--radius-sm);
+  }
+  :root .rui-dialog__surface,
+	:root .rui-hover-card__content,
+	:root .rui-calendar,
+	:root rui-tabs[variant='boxed'] {
+    border-radius: var(--radius-container);
+    border-style: var(--tw-border-style);
+    border-width: 1px;
+    border-color: var(--border);
+    background-color: var(--surface-container);
+    color: var(--on-surface);
+    --tw-shadow: 0 0 #0000;
+    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+  }
+  :root .rui-dialog__surface {
+    box-shadow: 0 8px 24px rgb(0 0 0 / 0.18);
+  }
+  :root .rui-popover {
+    --rui-popover-radius: var(--radius-container);
+    --rui-popover-surface: var(--color-zed-panel);
+    --rui-popover-border-color: var(--color-zed-border);
+    --rui-popover-shadow: 0 4px 12px rgb(0 0 0 / 0.14);
+  }
+  :root .rui-menu-button__menu,
+	:root .rui-menubar__menu,
+	:root .rui-select__listbox,
+	:root .rui-combobox__listbox {
+    border-radius: var(--radius-container);
+    border-style: var(--tw-border-style);
+    border-width: 1px;
+    border-color: var(--border);
+    padding: var(--spacing-1);
+    color: var(--on-surface);
+    background-color: var(--color-zed-panel);
+    box-shadow: 0 4px 12px rgb(0 0 0 / 0.14);
+  }
+  :root .rui-select__listbox .rui-listbox,
+	:root .rui-combobox__listbox .rui-listbox {
+    background-color: transparent;
+    padding: 0px;
+  }
+  :root .rui-listbox__option,
+	:root .rui-menu-button__item,
+	:root .rui-menubar__menu-item {
+    border-radius: var(--radius-control);
+  }
+  :root .rui-listbox__option:hover:not([aria-disabled='true']),
+	:root .rui-listbox__option[data-active]:not([aria-disabled='true']),
+	:root .rui-menu-button__item:hover:not([aria-checked='true']):not([aria-disabled='true']),
+	:root .rui-menubar__menu-item:hover:not([aria-expanded='true']):not([aria-disabled='true']) {
+    background-color: var(--color-zed-hover);
+  }
+  :root .rui-listbox__option[aria-selected='true']:not([aria-disabled='true']),
+	:root .rui-listbox__option[aria-selected='true']:focus-visible,
+	:root .rui-menu-button__item[aria-checked='true'],
+	:root .rui-sidebar__menu-button[aria-current='page'],
+	:root .rui-sidebar__menu-button--active {
+    background-color: var(--color-zed-selected);
+    background-image: none;
+    color: var(--color-zed-text);
+  }
+  :root .rui-listbox__option[aria-selected='true'] .rui-listbox__option-indicator {
+    color: var(--color-zed-accent-text);
+  }
+  :root .rui-listbox__option[aria-selected='true'][data-active]:not([aria-disabled='true']) {
+    --tw-ring-color: transparent;
+  }
+  :root rui-tabs[variant='boxed'] .rui-tabs__list {
+    gap: 0px;
+    border-bottom-style: var(--tw-border-style);
+    border-bottom-width: 1px;
+    border-color: var(--border);
+    padding: 0px;
+    background-color: var(--color-zed-panel);
+  }
+  :root rui-tabs[variant='boxed'] .rui-tabs__tab {
+    position: relative;
+    border-radius: var(--radius-none);
+    border-style: var(--tw-border-style);
+    border-width: 0px;
+    border-right-style: var(--tw-border-style);
+    border-right-width: 1px;
+    border-color: var(--border);
+    --tw-font-weight: var(--font-weight-normal, 400);
+    font-weight: var(--font-weight-normal, 400);
+    margin-bottom: -1px;
+    background-color: transparent;
+    color: var(--color-zed-text-muted);
+    transition: none;
+  }
+  :root rui-tabs[variant='boxed'] .rui-tabs__tab[aria-selected='true'] {
+    background-color: var(--color-zed-background);
+    color: var(--color-zed-text);
+  }
+  :root rui-tabs[variant='boxed'] .rui-tabs__panel {
+    background-color: var(--color-zed-background);
+  }
+  :root .rui-button--sm,
+	:root .rui-button--md,
+	:root .rui-button--lg {
+    font-size: var(--text-control);
+  }
+  :root .rui-button--md,
+	:root .rui-button--lg {
+    padding-inline: var(--space-control-x);
+  }
+  :root .rui-button--filled,
+	:root .rui-button--destructive {
+    --tw-font-weight: var(--font-weight-medium);
+    font-weight: var(--font-weight-medium);
+  }
+  :root .rui-button--outline,
+	:root .rui-button--ghost {
+    --tw-font-weight: var(--font-weight-normal, 400);
+    font-weight: var(--font-weight-normal, 400);
+  }
+  :root .rui-pagination__list {
+    gap: calc(var(--spacing, 0.25rem) * 0.5);
+  }
+  :root .rui-pagination__link[aria-current='page'],
+	:root .rui-toolbar .rui-button[aria-pressed='true'] {
+    background-color: var(--color-zed-selected);
+    border-color: transparent;
+    color: var(--color-zed-text);
+    box-shadow: none;
+    --tw-ring-shadow: 0 0 #0000;
+  }
+  :root .rui-pagination__ellipsis,
+	:root .rui-pagination__status-label {
+    font-size: var(--text-control);
+  }
+  :root .rui-button-group {
+    gap: calc(var(--spacing, 0.25rem) * 0.5);
+  }
+  :root .rui-toolbar,
+	:root .rui-menubar {
+    gap: calc(var(--spacing, 0.25rem) * 0.5);
+    border-radius: var(--radius-container);
+    border-style: var(--tw-border-style);
+    border-width: 1px;
+    border-color: var(--border);
+    padding: calc(var(--spacing, 0.25rem) * 0.5);
+    --tw-shadow: 0 0 #0000;
+    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+    background-color: var(--color-zed-panel);
+  }
+  :root .rui-toolbar .rui-separator {
+    margin-inline: calc(var(--spacing, 0.25rem) * 0.5);
+    align-self: stretch;
+  }
+  :root .rui-menubar__item {
+    display: inline-flex;
+    align-items: center;
+    border-radius: var(--radius-control);
+    padding-block: 0px;
+    --tw-font-weight: var(--font-weight-normal, 400);
+    font-weight: var(--font-weight-normal, 400);
+    --tw-shadow: 0 0 #0000;
+    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+    height: var(--size-control-sm);
+    font-size: var(--text-control);
+  }
+  :root .rui-menubar__item[aria-expanded='true'] {
+    --tw-font-weight: var(--font-weight-normal, 400);
+    font-weight: var(--font-weight-normal, 400);
+    --tw-shadow: 0 0 #0000;
+    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+    background-color: var(--color-zed-selected);
+    color: var(--color-zed-text);
+  }
+  :root .rui-menubar__item:focus-visible,
+	:root .rui-menubar__menu-item:focus-visible,
+	:root .rui-menu-button__item:focus-visible {
+    outline: 1px solid var(--focus-ring);
+    outline-offset: -1px;
+    --tw-ring-shadow: 0 0 #0000;
+    --tw-ring-offset-shadow: 0 0 #0000;
+  }
+  :root .rui-menubar__item:active:not(:disabled):not([aria-disabled='true']),
+	:root .rui-menubar__menu-item:active:not(:disabled):not([aria-disabled='true']) {
+    background-color: var(--color-zed-selected);
+  }
+  :root .rui-menubar__menu-item,
+	:root .rui-menu-button__item {
+    padding-block: 0px;
+    min-height: var(--size-control-sm);
+    font-size: var(--text-control);
+  }
+  :root .rui-menubar__menu-item[aria-expanded='true'] {
+    background-color: var(--color-zed-hover);
+  }
+  :root .rui-tabs__tab,
+	:root .rui-tabs__panel {
+    font-size: var(--text-control);
+  }
+  :root rui-tabs[variant='boxed'] .rui-tabs__tab {
+    padding-block: 0px;
+    height: var(--size-control-md);
+    font-size: var(--text-control);
+  }
+  :root rui-table {
+    border-radius: var(--radius-container);
+    border-style: var(--tw-border-style);
+    border-width: 1px;
+    border-color: var(--border);
+    --tw-shadow: 0 0 #0000;
+    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+  }
+  :root .rui-table {
+    font-size: var(--text-control);
+  }
+  :root .rui-table__column,
+	:root .rui-table__cell,
+	:root .rui-table__selection-cell,
+	:root .rui-table__empty-state,
+	:root .rui-table__empty-state-spacer {
+    border-right-style: var(--tw-border-style);
+    border-right-width: 0px;
+    padding-block: 0px;
+    text-align: left;
+    height: var(--size-control-md);
+    padding-inline: var(--space-control-x);
+    border-color: var(--color-zed-border-subtle);
+    background-color: var(--color-zed-background);
+    color: var(--color-zed-text);
+  }
+  :root .rui-table__column {
+    --tw-font-weight: var(--font-weight-medium);
+    font-weight: var(--font-weight-medium);
+    border-color: var(--color-zed-border);
+    background-color: var(--color-zed-panel);
+    color: var(--color-zed-text-muted);
+  }
+  :root .rui-table__selection-cell {
+    width: var(--spacing-8);
+  }
+  :root .rui-table__selection-cell rui-checkbox {
+    min-height: var(--size-control-md);
+  }
+  :root .rui-table__sort {
+    margin-block: 0px;
+    padding-block: 0px;
+    --tw-font-weight: var(--font-weight-medium);
+    font-weight: var(--font-weight-medium);
+    min-height: var(--size-control-md);
+    color: inherit;
+  }
+  :root .rui-table__sort-indicator::before {
+    color: var(--color-zed-text-muted);
+  }
+  :root .rui-table__column[aria-sort='ascending'],
+	:root .rui-table__column[aria-sort='descending'] {
+    color: var(--color-zed-text);
+  }
+  :root .rui-table__body .rui-table__row:last-child > * {
+    border-bottom-style: var(--tw-border-style);
+    border-bottom-width: 0px;
+  }
+  @media (hover: hover) and (pointer: fine) {
+    :root
+			.rui-table__body
+			.rui-table__row:not([aria-disabled='true']):not(.rui-table__row--empty):hover
+			> :is(.rui-table__cell, .rui-table__selection-cell) {
+      background-color: var(--color-zed-hover);
+    }
+  }
+  :root .rui-table__row[aria-selected='true'] > :is(.rui-table__cell, .rui-table__selection-cell) {
+    background-color: var(--color-zed-selected);
+    color: var(--color-zed-text);
+  }
+  :root .rui-table__cell:focus-visible,
+	:root .rui-table__sort:focus-visible {
+    outline: 1px solid var(--focus-ring);
+    outline-offset: -1px;
+    --tw-ring-shadow: 0 0 #0000;
+    --tw-ring-offset-shadow: 0 0 #0000;
+  }
+  :root .rui-table__empty-state {
+    padding-block: var(--spacing-6);
+    height: auto;
+  }
+  :root .rui-treegrid {
+    border-radius: var(--radius-none);
+    border-style: var(--tw-border-style);
+    border-width: 0px;
+    background-color: transparent;
+    --tw-shadow: 0 0 #0000;
+    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+    --rui-treegrid-indent: 0.75rem;
+  }
+  :root .rui-treegrid__cell {
+    border-style: var(--tw-border-style);
+    border-width: 0px;
+    background-color: transparent;
+    padding-inline: var(--spacing-2);
+    padding-block: var(--spacing-1);
+  }
+  :root .rui-treegrid__row--header .rui-treegrid__cell {
+    border-bottom-style: var(--tw-border-style);
+    border-bottom-width: 1px;
+    border-color: var(--border);
+    background-color: transparent;
+    font-size: var(--text-xs);
+    line-height: var(--tw-leading, var(--text-xs--line-height, calc(1 / 0.75)));
+    --tw-font-weight: var(--font-weight-medium);
+    font-weight: var(--font-weight-medium);
+    color: var(--on-surface-container-low);
+  }
+  :root .rui-treegrid__row:not(.rui-treegrid__row--header):hover .rui-treegrid__cell:not([aria-selected='true']) {
+    background-color: var(--color-zed-hover);
+  }
+  :root .rui-treegrid__cell[aria-selected='true'] {
+    background-color: var(--color-zed-selected);
+    color: var(--color-zed-text);
+  }
+  :root .rui-alert,
+	:root .rui-toast {
+    border-radius: var(--radius-control);
+    --tw-shadow: 0 0 #0000;
+    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+    background-image: none;
+  }
+  :root .rui-separator,
+	:root .rui-sidebar__separator {
+    background-color: var(--border);
+  }
+}
+:root {
+  --space-1: calc(0.125rem * var(--rui-density));
+  --space-2: calc(0.25rem * var(--rui-density));
+  --space-3: calc(0.5rem * var(--rui-density));
+  --space-4: calc(0.75rem * var(--rui-density));
+  --space-5: calc(1rem * var(--rui-density));
+  --space-6: calc(1.25rem * var(--rui-density));
+  --space-8: calc(1.5rem * var(--rui-density));
+  --space-10: calc(2rem * var(--rui-density));
+  --space-12: calc(2.5rem * var(--rui-density));
+  --space-16: calc(3rem * var(--rui-density));
+  --space-control-x: var(--space-3);
+  --space-control-y: var(--space-2);
+  --space-inline: var(--space-2);
+  --space-stack: var(--space-3);
+  --space-inset: var(--space-4);
+}
+@property --tw-border-style {
+  syntax: "*";
+  inherits: false;
+  initial-value: solid;
+}
+@property --tw-font-weight {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-shadow {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0 0 #0000;
+}
+@property --tw-shadow-color {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-shadow-alpha {
+  syntax: "<percentage>";
+  inherits: false;
+  initial-value: 100%;
+}
+@property --tw-inset-shadow {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0 0 #0000;
+}
+@property --tw-inset-shadow-color {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-inset-shadow-alpha {
+  syntax: "<percentage>";
+  inherits: false;
+  initial-value: 100%;
+}
+@property --tw-ring-color {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-ring-shadow {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0 0 #0000;
+}
+@property --tw-inset-ring-color {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-inset-ring-shadow {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0 0 #0000;
+}
+@property --tw-ring-inset {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-ring-offset-width {
+  syntax: "<length>";
+  inherits: false;
+  initial-value: 0px;
+}
+@property --tw-ring-offset-color {
+  syntax: "*";
+  inherits: false;
+  initial-value: #fff;
+}
+@property --tw-ring-offset-shadow {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0 0 #0000;
+}
+@layer properties {
+  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
+    *, ::before, ::after, ::backdrop {
+      --tw-border-style: solid;
+      --tw-font-weight: initial;
+      --tw-shadow: 0 0 #0000;
+      --tw-shadow-color: initial;
+      --tw-shadow-alpha: 100%;
+      --tw-inset-shadow: 0 0 #0000;
+      --tw-inset-shadow-color: initial;
+      --tw-inset-shadow-alpha: 100%;
+      --tw-ring-color: initial;
+      --tw-ring-shadow: 0 0 #0000;
+      --tw-inset-ring-color: initial;
+      --tw-inset-ring-shadow: 0 0 #0000;
+      --tw-ring-inset: initial;
+      --tw-ring-offset-width: 0px;
+      --tw-ring-offset-color: #fff;
+      --tw-ring-offset-shadow: 0 0 #0000;
+    }
+  }
+}