@duskmoon-dev/core 1.18.3 → 1.18.5

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.
Files changed (15) hide show
  1. package/README.md +1 -1
  2. package/dist/components/badge.css +29 -0
  3. package/dist/components/button.css +19 -0
  4. package/dist/components/index.css +92 -2
  5. package/dist/components/table.css +44 -2
  6. package/dist/esm/components/badge.js +29 -0
  7. package/dist/esm/components/button.js +19 -0
  8. package/dist/esm/components/table.js +44 -2
  9. package/dist/index.css +92 -2
  10. package/dist/index.min.css +1 -1
  11. package/dist/standalone/duskmoonui-themes.css +1 -1
  12. package/dist/standalone/duskmoonui.css +94 -4
  13. package/dist/standalone/duskmoonui.js +553 -7
  14. package/dist/standalone/duskmoonui.mjs +549 -3
  15. package/package.json +11 -6
package/dist/standalone/duskmoonui.js CHANGED
@@ -1,5 +1,6 @@
1
1
  /**
2
- * @duskmoon-dev/core v1.18.3
2
+ * @duskmoon-dev/core v1.18.5
3
+ * @duskmoon-dev/css-art v1.18.5
3
4
  * Standalone Tailwind CSS v4 plugin bundle
4
5
  * https://github.com/duskmoon-dev/duskmoonui
5
6
  * @license MIT
@@ -42,13 +43,13 @@ var __export = (target, all) => {
42
43
  });
43
44
  };
44
45
 
45
- // src/tailwind-plugin.ts
46
- var exports_tailwind_plugin = {};
47
- __export(exports_tailwind_plugin, {
48
- default: () => tailwind_plugin_default,
49
- duskmoonPlugin: () => duskmoonPlugin
46
+ // dist/standalone/.standalone-entry.ts
47
+ var exports___standalone_entry = {};
48
+ __export(exports___standalone_entry, {
49
+ default: () => __standalone_entry_default,
50
+ duskmoonPlugin: () => duskmoonPlugin2
50
51
  });
51
- module.exports = __toCommonJS(exports_tailwind_plugin);
52
+ module.exports = __toCommonJS(exports___standalone_entry);
52
53
 
53
54
  // ../../node_modules/tailwindcss/dist/plugin.mjs
54
55
  function g(i, n) {
@@ -143,3 +144,548 @@ var duskmoonPlugin = u(({ matchUtilities, theme }) => {
143
144
  }
144
145
  });
145
146
  var tailwind_plugin_default = duskmoonPlugin;
147
+
148
+ // dist/standalone/.standalone-entry.ts
149
+ var baseStyles = { html: { scrollBehavior: "smooth", WebkitTextSizeAdjust: "100%", textSizeAdjust: "100%" }, ":root,\n[data-theme]": { backgroundColor: "var(--color-base-100)", color: "var(--color-base-content)" }, ":focus-visible": { outline: "2px solid var(--color-primary)", outlineOffset: "2px" }, "[disabled],\n.disabled": { pointerEvents: "none", opacity: 0.5 }, "::selection": { backgroundColor: "color-mix(in oklch, var(--color-primary) 20%, transparent)", color: "var(--color-base-content)" }, "::-webkit-scrollbar": { width: "8px", height: "8px" }, "::-webkit-scrollbar-track": { background: "var(--color-base-200)" }, "::-webkit-scrollbar-thumb": { background: "var(--color-base-300)", borderRadius: "4px" }, "::-webkit-scrollbar-thumb:hover": { background: "color-mix(in oklch, var(--color-base-content) 30%, transparent)" }, "*": { scrollbarWidth: "thin", scrollbarColor: "var(--color-base-300) var(--color-base-200)" }, "@media (prefers-reduced-motion: reduce)": { "*,\n *::before,\n *::after": { animationDuration: "0.01ms !important", animationIterationCount: "1 !important", transitionDuration: "0.01ms !important", scrollBehavior: "auto !important" } }, ":root": [{ colorScheme: "light", "--theme-name": '"sunshine"', "--theme-mode": '"light"', "--theme-family": '"duskmoon"', "--theme-pair": '"moonlight"', "--theme-description": '"Warm amber/coral"', "--color-primary": "oklch(52% 0.17 75)", "--color-primary-content": "oklch(100% 0 0)", "--color-primary-container": "oklch(95% 0.035 95.91)", "--color-on-primary-container": "oklch(25% 0.03 95.91)", "--color-secondary": "oklch(55% 0.19 20)", "--color-secondary-content": "oklch(100% 0 0)", "--color-secondary-container": "oklch(94% 0.05 87.01)", "--color-on-secondary-container": "oklch(25% 0.05 87.01)", "--color-tertiary": "oklch(52% 0.085 235)", "--color-tertiary-content": "oklch(100% 0 0)", "--color-tertiary-container": "oklch(95% 0.035 235)", "--color-on-tertiary-container": "oklch(22% 0.012 235)", "--color-accent": "oklch(52% 0.14 327)", "--color-accent-content": "oklch(100% 0 0)", "--color-neutral": "oklch(0% 0 0)", "--color-neutral-content": "oklch(80% 0.015 50)", "--color-neutral-variant": "oklch(50% 0.02 260)", "--color-surface": "oklch(100% 0 0)", "--color-surface-dim": "oklch(96% 0.01 85)", "--color-surface-bright": "oklch(100% 0 0)", "--color-surface-container-lowest": "oklch(100% 0 0)", "--color-surface-container-low": "oklch(99% 0.01 85)", "--color-surface-container": "oklch(97% 0.01 85)", "--color-surface-container-high": "oklch(96% 0.01 85)", "--color-surface-container-highest": "oklch(94% 0.01 85)", "--color-surface-variant": "oklch(94% 0.02 85)", "--color-on-surface": "oklch(27% 0.02 260)", "--color-on-surface-variant": "oklch(50% 0.02 260)", "--color-base-100": "oklch(100% 0.005 255)", "--color-base-200": "oklch(95% 0.008 255)", "--color-base-300": "oklch(90% 0.01 255)", "--color-base-400": "oklch(55% 0.06 255)", "--color-base-500": "oklch(45% 0.05 255)", "--color-base-600": "oklch(35% 0.04 255)", "--color-base-700": "oklch(25% 0.03 255)", "--color-base-800": "oklch(18% 0.02 255)", "--color-base-900": "oklch(12% 0.01 255)", "--color-base-content": "oklch(10% 0 255)", "--color-outline": "oklch(75% 0.01 260)", "--color-outline-variant": "oklch(85% 0.01 260)", "--color-inverse-surface": "oklch(25% 0.02 260)", "--color-inverse-on-surface": "oklch(95% 0.01 260)", "--color-inverse-primary": "oklch(80% 0.14 55)", "--color-shadow": "oklch(0% 0 0)", "--color-scrim": "oklch(0% 0 0 / 50%)", "--color-info": "oklch(41.94% 0.114 254.39)", "--color-info-content": "oklch(91.94% 0.114 254.39)", "--color-info-container": "oklch(95% 0.03 235)", "--color-on-info-container": "oklch(35% 0.08 235)", "--color-success": "oklch(50% 0.19 133.55)", "--color-success-content": "oklch(100% 0 0)", "--color-success-container": "oklch(93% 0.04 150)", "--color-on-success-container": "oklch(30% 0.08 150)", "--color-warning": "oklch(52% 0.203 42.44)", "--color-warning-content": "oklch(100% 0 0)", "--color-warning-container": "oklch(93% 0.05 80)", "--color-on-warning-container": "oklch(38% 0.10 80)", "--color-error": "oklch(52% 0.237 28.15)", "--color-error-content": "oklch(100% 0 0)", "--color-error-container": "oklch(93% 0.04 25)", "--color-on-error-container": "oklch(32% 0.10 25)", "--radius-selector": "0.25rem", "--radius-field": "0.625rem", "--radius-box": "2rem", "--size-selector": "0.1875rem", "--size-field": "0.1875rem", "--border": "0.5px", "--depth": "1", "--noise": "1", "--spacing-0": "0px", "--spacing-1": "4px", "--spacing-2": "8px", "--spacing-3": "12px", "--spacing-4": "16px", "--spacing-5": "20px", "--spacing-6": "24px", "--spacing-7": "28px", "--spacing-8": "32px", "--spacing-10": "40px", "--spacing-12": "48px", "--spacing-16": "64px", "--spacing-20": "80px", "--spacing-24": "96px", "--radius-none": "0px", "--radius-xs": "4px", "--radius-sm": "8px", "--radius-md": "12px", "--radius-lg": "16px", "--radius-xl": "20px", "--radius-2xl": "28px", "--radius-full": "9999px", "--elevation-level0": "0px", "--elevation-level1": "1px", "--elevation-level2": "3px", "--elevation-level3": "6px", "--elevation-level4": "8px", "--elevation-level5": "12px" }, { "--shadow-xs": "0 1px 2px 0 color-mix(in srgb, var(--color-shadow) 5%, transparent)", "--shadow-sm": "0 1px 3px 0 color-mix(in srgb, var(--color-shadow) 10%, transparent), 0 1px 2px -1px color-mix(in srgb, var(--color-shadow) 10%, transparent)", "--shadow-md": "0 4px 6px -1px color-mix(in srgb, var(--color-shadow) 10%, transparent), 0 2px 4px -2px color-mix(in srgb, var(--color-shadow) 10%, transparent)", "--shadow-lg": "0 10px 15px -3px color-mix(in srgb, var(--color-shadow) 10%, transparent), 0 4px 6px -4px color-mix(in srgb, var(--color-shadow) 10%, transparent)", "--shadow-xl": "0 20px 25px -5px color-mix(in srgb, var(--color-shadow) 10%, transparent), 0 8px 10px -6px color-mix(in srgb, var(--color-shadow) 10%, transparent)", "--shadow-2xl": "0 25px 50px -12px color-mix(in srgb, var(--color-shadow) 25%, transparent)", "--shadow-elevation-0": "none", "--shadow-elevation-1": "var(--shadow-xs)", "--shadow-elevation-2": "var(--shadow-sm)", "--shadow-elevation-3": "var(--shadow-md)", "--shadow-elevation-4": "var(--shadow-lg)", "--shadow-elevation-5": "var(--shadow-xl)" }], "@media (prefers-color-scheme: dark)": { ":root:not([data-theme])": { colorScheme: "dark", "--theme-name": '"moonlight"', "--theme-mode": '"dark"', "--theme-family": '"duskmoon"', "--theme-pair": '"sunshine"', "--theme-description": '"Neutral white/gold"', "--color-primary": "oklch(85.45% 0 0)", "--color-primary-content": "oklch(14.94% 0.031 39.947)", "--color-primary-container": "oklch(25% 0.01 0)", "--color-on-primary-container": "oklch(85% 0.01 0)", "--color-secondary": "oklch(83.33% 0.0981 73.78)", "--color-secondary-content": "oklch(14.507% 0.035 2.72)", "--color-secondary-container": "oklch(28% 0.03 73.78)", "--color-on-secondary-container": "oklch(88% 0.03 73.78)", "--color-tertiary": "oklch(72% 0.090 255)", "--color-tertiary-content": "oklch(14% 0.012 255)", "--color-tertiary-container": "oklch(28% 0.030 255)", "--color-on-tertiary-container": "oklch(88% 0.010 255)", "--color-accent": "oklch(75.65% 0.1303 335.51)", "--color-accent-content": "oklch(14.258% 0.033 299.844)", "--color-neutral": "oklch(23% 0 0)", "--color-neutral-content": "oklch(52.43% 0 0)", "--color-neutral-variant": "oklch(55% 0.01 260)", "--color-surface": "oklch(20% 0.02 260)", "--color-surface-dim": "oklch(17% 0.02 260)", "--color-surface-bright": "oklch(28% 0.02 260)", "--color-surface-container-lowest": "oklch(14% 0.02 260)", "--color-surface-container-low": "oklch(20% 0.02 260)", "--color-surface-container": "oklch(22% 0.02 260)", "--color-surface-container-high": "oklch(25% 0.02 260)", "--color-surface-container-highest": "oklch(28% 0.01 260)", "--color-surface-variant": "oklch(30% 0.02 260)", "--color-on-surface": "oklch(95% 0.01 260)", "--color-on-surface-variant": "oklch(75% 0.01 260)", "--color-base-100": "oklch(22% 0.019 237.69)", "--color-base-200": "oklch(20% 0.019 237.69)", "--color-base-300": "oklch(18% 0.019 237.69)", "--color-base-400": "oklch(26% 0.019 237.69)", "--color-base-500": "oklch(32% 0.019 237.69)", "--color-base-600": "oklch(40% 0.018 237.69)", "--color-base-700": "oklch(55% 0.017 237.69)", "--color-base-800": "oklch(70% 0.016 237.69)", "--color-base-900": "oklch(85% 0.015 237.69)", "--color-base-content": "oklch(77.383% 0.043 245.096)", "--color-outline": "oklch(44% 0.01 260)", "--color-outline-variant": "oklch(35% 0.01 260)", "--color-inverse-surface": "oklch(95% 0.01 260)", "--color-inverse-on-surface": "oklch(25% 0.02 260)", "--color-inverse-primary": "oklch(55% 0.16 255)", "--color-shadow": "oklch(0% 0 0)", "--color-scrim": "oklch(0% 0 0 / 60%)", "--color-info": "oklch(82.42% 0.09757279812867503 240.7677443360475)", "--color-info-content": "oklch(17.111% 0.017 206.015)", "--color-info-container": "oklch(32% 0.06 235)", "--color-on-info-container": "oklch(88% 0.06 235)", "--color-success": "oklch(82.19% 0.0621 133.3)", "--color-success-content": "oklch(17.112% 0.017 144.778)", "--color-success-container": "oklch(30% 0.05 150)", "--color-on-success-container": "oklch(85% 0.06 150)", "--color-warning": "oklch(76.36% 0.1752731353930708 61.96388739129725)", "--color-warning-content": "oklch(17.113% 0.016 74.427)", "--color-warning-container": "oklch(35% 0.06 80)", "--color-on-warning-container": "oklch(90% 0.06 80)", "--color-error": "oklch(46.38% 0.1898 29.17)", "--color-error-content": "oklch(86.38% 0.298 39.17)", "--color-error-container": "oklch(30% 0.08 25)", "--color-on-error-container": "oklch(88% 0.06 25)", "--radius-selector": "0.125rem", "--radius-field": "0.375rem", "--radius-box": "1rem", "--size-selector": "0.125rem", "--size-field": "0.125rem", "--border": "1px", "--depth": "0.8", "--noise": "0.6" } }, '[data-theme="sunshine"]': { colorScheme: "light", "--theme-name": '"sunshine"', "--theme-mode": '"light"', "--theme-family": '"duskmoon"', "--theme-pair": '"moonlight"', "--theme-description": '"Warm amber/coral"', "--color-primary": "oklch(52% 0.17 75)", "--color-primary-content": "oklch(100% 0 0)", "--color-primary-container": "oklch(95% 0.035 95.91)", "--color-on-primary-container": "oklch(25% 0.03 95.91)", "--color-secondary": "oklch(55% 0.19 20)", "--color-secondary-content": "oklch(100% 0 0)", "--color-secondary-container": "oklch(94% 0.05 87.01)", "--color-on-secondary-container": "oklch(25% 0.05 87.01)", "--color-tertiary": "oklch(52% 0.085 235)", "--color-tertiary-content": "oklch(100% 0 0)", "--color-tertiary-container": "oklch(95% 0.035 235)", "--color-on-tertiary-container": "oklch(22% 0.012 235)", "--color-accent": "oklch(52% 0.14 327)", "--color-accent-content": "oklch(100% 0 0)", "--color-neutral": "oklch(0% 0 0)", "--color-neutral-content": "oklch(80% 0.015 50)", "--color-neutral-variant": "oklch(50% 0.02 260)", "--color-surface": "oklch(100% 0 0)", "--color-surface-dim": "oklch(96% 0.01 85)", "--color-surface-bright": "oklch(100% 0 0)", "--color-surface-container-lowest": "oklch(100% 0 0)", "--color-surface-container-low": "oklch(99% 0.01 85)", "--color-surface-container": "oklch(97% 0.01 85)", "--color-surface-container-high": "oklch(96% 0.01 85)", "--color-surface-container-highest": "oklch(94% 0.01 85)", "--color-surface-variant": "oklch(94% 0.02 85)", "--color-on-surface": "oklch(27% 0.02 260)", "--color-on-surface-variant": "oklch(50% 0.02 260)", "--color-base-100": "oklch(100% 0.005 255)", "--color-base-200": "oklch(95% 0.008 255)", "--color-base-300": "oklch(90% 0.01 255)", "--color-base-400": "oklch(55% 0.06 255)", "--color-base-500": "oklch(45% 0.05 255)", "--color-base-600": "oklch(35% 0.04 255)", "--color-base-700": "oklch(25% 0.03 255)", "--color-base-800": "oklch(18% 0.02 255)", "--color-base-900": "oklch(12% 0.01 255)", "--color-base-content": "oklch(10% 0 255)", "--color-outline": "oklch(75% 0.01 260)", "--color-outline-variant": "oklch(85% 0.01 260)", "--color-inverse-surface": "oklch(25% 0.02 260)", "--color-inverse-on-surface": "oklch(95% 0.01 260)", "--color-inverse-primary": "oklch(80% 0.14 55)", "--color-shadow": "oklch(0% 0 0)", "--color-scrim": "oklch(0% 0 0 / 50%)", "--color-info": "oklch(41.94% 0.114 254.39)", "--color-info-content": "oklch(91.94% 0.114 254.39)", "--color-info-container": "oklch(95% 0.03 235)", "--color-on-info-container": "oklch(35% 0.08 235)", "--color-success": "oklch(50% 0.19 133.55)", "--color-success-content": "oklch(100% 0 0)", "--color-success-container": "oklch(93% 0.04 150)", "--color-on-success-container": "oklch(30% 0.08 150)", "--color-warning": "oklch(52% 0.203 42.44)", "--color-warning-content": "oklch(100% 0 0)", "--color-warning-container": "oklch(93% 0.05 80)", "--color-on-warning-container": "oklch(38% 0.10 80)", "--color-error": "oklch(52% 0.237 28.15)", "--color-error-content": "oklch(100% 0 0)", "--color-error-container": "oklch(93% 0.04 25)", "--color-on-error-container": "oklch(32% 0.10 25)", "--radius-selector": "0.25rem", "--radius-field": "0.625rem", "--radius-box": "2rem", "--size-selector": "0.1875rem", "--size-field": "0.1875rem", "--border": "0.5px", "--depth": "1", "--noise": "1" }, '[data-theme="moonlight"]': { colorScheme: "dark", "--theme-name": '"moonlight"', "--theme-mode": '"dark"', "--theme-family": '"duskmoon"', "--theme-pair": '"sunshine"', "--theme-description": '"Neutral white/gold"', "--color-primary": "oklch(85.45% 0 0)", "--color-primary-content": "oklch(14.94% 0.031 39.947)", "--color-primary-container": "oklch(25% 0.01 0)", "--color-on-primary-container": "oklch(85% 0.01 0)", "--color-secondary": "oklch(83.33% 0.0981 73.78)", "--color-secondary-content": "oklch(14.507% 0.035 2.72)", "--color-secondary-container": "oklch(28% 0.03 73.78)", "--color-on-secondary-container": "oklch(88% 0.03 73.78)", "--color-tertiary": "oklch(72% 0.090 255)", "--color-tertiary-content": "oklch(14% 0.012 255)", "--color-tertiary-container": "oklch(28% 0.030 255)", "--color-on-tertiary-container": "oklch(88% 0.010 255)", "--color-accent": "oklch(75.65% 0.1303 335.51)", "--color-accent-content": "oklch(14.258% 0.033 299.844)", "--color-neutral": "oklch(23% 0 0)", "--color-neutral-content": "oklch(52.43% 0 0)", "--color-neutral-variant": "oklch(55% 0.01 260)", "--color-surface": "oklch(20% 0.02 260)", "--color-surface-dim": "oklch(17% 0.02 260)", "--color-surface-bright": "oklch(28% 0.02 260)", "--color-surface-container-lowest": "oklch(14% 0.02 260)", "--color-surface-container-low": "oklch(20% 0.02 260)", "--color-surface-container": "oklch(22% 0.02 260)", "--color-surface-container-high": "oklch(25% 0.02 260)", "--color-surface-container-highest": "oklch(28% 0.01 260)", "--color-surface-variant": "oklch(30% 0.02 260)", "--color-on-surface": "oklch(95% 0.01 260)", "--color-on-surface-variant": "oklch(75% 0.01 260)", "--color-base-100": "oklch(22% 0.019 237.69)", "--color-base-200": "oklch(20% 0.019 237.69)", "--color-base-300": "oklch(18% 0.019 237.69)", "--color-base-400": "oklch(26% 0.019 237.69)", "--color-base-500": "oklch(32% 0.019 237.69)", "--color-base-600": "oklch(40% 0.018 237.69)", "--color-base-700": "oklch(55% 0.017 237.69)", "--color-base-800": "oklch(70% 0.016 237.69)", "--color-base-900": "oklch(85% 0.015 237.69)", "--color-base-content": "oklch(77.383% 0.043 245.096)", "--color-outline": "oklch(44% 0.01 260)", "--color-outline-variant": "oklch(35% 0.01 260)", "--color-inverse-surface": "oklch(95% 0.01 260)", "--color-inverse-on-surface": "oklch(25% 0.02 260)", "--color-inverse-primary": "oklch(55% 0.16 255)", "--color-shadow": "oklch(0% 0 0)", "--color-scrim": "oklch(0% 0 0 / 60%)", "--color-info": "oklch(82.42% 0.09757279812867503 240.7677443360475)", "--color-info-content": "oklch(17.111% 0.017 206.015)", "--color-info-container": "oklch(32% 0.06 235)", "--color-on-info-container": "oklch(88% 0.06 235)", "--color-success": "oklch(82.19% 0.0621 133.3)", "--color-success-content": "oklch(17.112% 0.017 144.778)", "--color-success-container": "oklch(30% 0.05 150)", "--color-on-success-container": "oklch(85% 0.06 150)", "--color-warning": "oklch(76.36% 0.1752731353930708 61.96388739129725)", "--color-warning-content": "oklch(17.113% 0.016 74.427)", "--color-warning-container": "oklch(35% 0.06 80)", "--color-on-warning-container": "oklch(90% 0.06 80)", "--color-error": "oklch(46.38% 0.1898 29.17)", "--color-error-content": "oklch(86.38% 0.298 39.17)", "--color-error-container": "oklch(30% 0.08 25)", "--color-on-error-container": "oklch(88% 0.06 25)", "--radius-selector": "0.125rem", "--radius-field": "0.375rem", "--radius-box": "1rem", "--size-selector": "0.125rem", "--size-field": "0.125rem", "--border": "1px", "--depth": "0.8", "--noise": "0.6" }, '[data-theme="ocean"]': { colorScheme: "dark", "--theme-name": '"ocean"', "--theme-mode": '"dark"', "--theme-family": '"ecotone"', "--theme-pair": '"forest"', "--theme-description": '"Cool blue"', "--color-primary": "oklch(72% 0.12 210)", "--color-primary-content": "oklch(15% 0.02 210)", "--color-primary-container": "oklch(30% 0.08 210)", "--color-on-primary-container": "oklch(90% 0.04 210)", "--color-secondary": "oklch(75% 0.10 175)", "--color-secondary-content": "oklch(15% 0.02 175)", "--color-secondary-container": "oklch(28% 0.06 175)", "--color-on-secondary-container": "oklch(90% 0.04 175)", "--color-tertiary": "oklch(72% 0.10 280)", "--color-tertiary-content": "oklch(15% 0.02 280)", "--color-tertiary-container": "oklch(28% 0.06 280)", "--color-on-tertiary-container": "oklch(90% 0.04 280)", "--color-accent": "oklch(70% 0.12 190)", "--color-accent-content": "oklch(15% 0.03 190)", "--color-neutral": "oklch(90% 0.01 210)", "--color-neutral-content": "oklch(16% 0.02 220)", "--color-neutral-variant": "oklch(50% 0.02 220)", "--color-surface": "oklch(16% 0.02 220)", "--color-surface-dim": "oklch(10% 0.015 220)", "--color-surface-bright": "oklch(24% 0.025 220)", "--color-surface-container-lowest": "oklch(8% 0.01 220)", "--color-surface-container-low": "oklch(12% 0.015 220)", "--color-surface-container": "oklch(16% 0.02 220)", "--color-surface-container-high": "oklch(20% 0.022 220)", "--color-surface-container-highest": "oklch(24% 0.025 220)", "--color-surface-variant": "oklch(22% 0.025 220)", "--color-on-surface": "oklch(90% 0.01 210)", "--color-on-surface-variant": "oklch(70% 0.015 210)", "--color-base-100": "oklch(16% 0.02 220)", "--color-base-200": "oklch(14% 0.015 220)", "--color-base-300": "oklch(10% 0.01 220)", "--color-base-400": "oklch(30% 0.02 220)", "--color-base-500": "oklch(40% 0.02 220)", "--color-base-600": "oklch(55% 0.015 220)", "--color-base-700": "oklch(70% 0.01 220)", "--color-base-800": "oklch(82% 0.01 220)", "--color-base-900": "oklch(92% 0.005 220)", "--color-base-content": "oklch(90% 0.01 210)", "--color-outline": "oklch(45% 0.02 220)", "--color-outline-variant": "oklch(32% 0.015 220)", "--color-inverse-surface": "oklch(90% 0.01 210)", "--color-inverse-on-surface": "oklch(16% 0.02 220)", "--color-inverse-primary": "oklch(45% 0.12 210)", "--color-shadow": "oklch(0% 0 0)", "--color-scrim": "oklch(0% 0 0 / 60%)", "--color-info": "oklch(70% 0.12 230)", "--color-info-content": "oklch(15% 0.03 230)", "--color-info-container": "oklch(28% 0.06 230)", "--color-on-info-container": "oklch(88% 0.04 230)", "--color-success": "oklch(72% 0.15 155)", "--color-success-content": "oklch(15% 0.03 155)", "--color-success-container": "oklch(28% 0.06 155)", "--color-on-success-container": "oklch(88% 0.04 155)", "--color-warning": "oklch(75% 0.14 75)", "--color-warning-content": "oklch(18% 0.04 75)", "--color-warning-container": "oklch(30% 0.06 75)", "--color-on-warning-container": "oklch(88% 0.05 75)", "--color-error": "oklch(70% 0.16 20)", "--color-error-content": "oklch(15% 0.03 20)", "--color-error-container": "oklch(28% 0.06 20)", "--color-on-error-container": "oklch(88% 0.05 20)", "--radius-selector": "0.25rem", "--radius-field": "0.75rem", "--radius-box": "1.5rem", "--size-selector": "0.125rem", "--size-field": "0.125rem", "--border": "1px", "--depth": "0.7", "--noise": "0.3" }, '[data-theme="forest"]': { colorScheme: "light", "--theme-name": '"forest"', "--theme-mode": '"light"', "--theme-family": '"ecotone"', "--theme-pair": '"ocean"', "--theme-description": '"Cool green/teal"', "--color-primary": "oklch(50% 0.14 150)", "--color-primary-content": "oklch(98% 0.01 150)", "--color-primary-container": "oklch(92% 0.04 150)", "--color-on-primary-container": "oklch(22% 0.06 150)", "--color-secondary": "oklch(52% 0.10 55)", "--color-secondary-content": "oklch(98% 0.01 55)", "--color-secondary-container": "oklch(92% 0.03 55)", "--color-on-secondary-container": "oklch(24% 0.05 55)", "--color-tertiary": "oklch(58% 0.08 175)", "--color-tertiary-content": "oklch(98% 0.01 175)", "--color-tertiary-container": "oklch(93% 0.03 175)", "--color-on-tertiary-container": "oklch(22% 0.04 175)", "--color-accent": "oklch(60% 0.12 85)", "--color-accent-content": "oklch(20% 0.04 85)", "--color-neutral": "oklch(14% 0.01 100)", "--color-neutral-content": "oklch(92% 0.01 100)", "--color-neutral-variant": "oklch(48% 0.015 100)", "--color-surface": "oklch(99% 0.005 100)", "--color-surface-dim": "oklch(95% 0.01 100)", "--color-surface-bright": "oklch(100% 0 0)", "--color-surface-container-lowest": "oklch(100% 0 0)", "--color-surface-container-low": "oklch(98% 0.008 100)", "--color-surface-container": "oklch(96% 0.01 100)", "--color-surface-container-high": "oklch(94% 0.012 100)", "--color-surface-container-highest": "oklch(92% 0.015 100)", "--color-surface-variant": "oklch(93% 0.02 100)", "--color-on-surface": "oklch(22% 0.02 100)", "--color-on-surface-variant": "oklch(42% 0.02 100)", "--color-base-100": "oklch(99% 0.005 100)", "--color-base-200": "oklch(92% 0.01 100)", "--color-base-300": "oklch(80% 0.01 100)", "--color-base-400": "oklch(60% 0.01 100)", "--color-base-500": "oklch(48% 0.01 100)", "--color-base-600": "oklch(38% 0.01 100)", "--color-base-700": "oklch(28% 0.01 100)", "--color-base-800": "oklch(20% 0.008 100)", "--color-base-900": "oklch(14% 0.005 100)", "--color-base-content": "oklch(14% 0.01 100)", "--color-outline": "oklch(60% 0.015 100)", "--color-outline-variant": "oklch(78% 0.01 100)", "--color-inverse-surface": "oklch(22% 0.02 100)", "--color-inverse-on-surface": "oklch(95% 0.01 100)", "--color-inverse-primary": "oklch(75% 0.10 150)", "--color-shadow": "oklch(0% 0 0)", "--color-scrim": "oklch(0% 0 0 / 40%)", "--color-info": "oklch(48% 0.12 240)", "--color-info-content": "oklch(98% 0.01 240)", "--color-info-container": "oklch(94% 0.03 240)", "--color-on-info-container": "oklch(28% 0.06 240)", "--color-success": "oklch(55% 0.16 145)", "--color-success-content": "oklch(98% 0.01 145)", "--color-success-container": "oklch(93% 0.04 145)", "--color-on-success-container": "oklch(25% 0.07 145)", "--color-warning": "oklch(62% 0.16 65)", "--color-warning-content": "oklch(18% 0.04 65)", "--color-warning-container": "oklch(93% 0.04 65)", "--color-on-warning-container": "oklch(32% 0.08 65)", "--color-error": "oklch(52% 0.18 15)", "--color-error-content": "oklch(98% 0.01 15)", "--color-error-container": "oklch(93% 0.04 15)", "--color-on-error-container": "oklch(28% 0.08 15)", "--radius-selector": "0.125rem", "--radius-field": "0.375rem", "--radius-box": "1rem", "--size-selector": "0.1875rem", "--size-field": "0.1875rem", "--border": "1px", "--depth": "0.5", "--noise": "0.8" }, '\n label[aria-required="true"]::after': { "@layer components": { content: "' *'", color: "var(--color-error)" } }, "@property --art-circular-gallery-rotation": { syntax: '"<angle>"', inherits: "true", initialValue: "0deg" }, "@property --art-gemini-input-rotation": { syntax: "'<angle>'", inherits: "false", initialValue: "0deg" } };
150
+ var componentStyles = { ".btn": [{ "@layer components": { "--btn-p": "1.25rem", "--btn-py": "0.625rem", "--btn-text-color": "var(--color-on-surface)", display: "inline-flex", alignItems: "center", justifyContent: "center", gap: "0.5rem", paddingInline: "var(--btn-p)", paddingBlock: "var(--btn-py)", fontSize: "0.875rem", fontWeight: 500, lineHeight: "1.25rem", textAlign: "center", textDecoration: "none", whiteSpace: "nowrap", verticalAlign: "middle", cursor: "pointer", userSelect: "none", border: "1px solid transparent", borderRadius: "var(--radius-sm)", transition: "all 150ms ease-in-out", backgroundColor: "var(--color-surface-container)", color: "var(--btn-text-color)" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }], ".btn:hover": { "@layer components": { filter: "brightness(0.95)" } }, ".btn:active": { "@layer components": { transform: "scale(0.98)" } }, ".btn:focus": { "@layer components": { outline: "none" } }, ".btn:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".btn:disabled": { "@layer components": { cursor: "not-allowed", opacity: 0.5, pointerEvents: "none" } }, ".btn-primary": { "@layer components": { "--btn-text-color": "var(--color-primary-content)", backgroundColor: "var(--color-primary)", borderColor: "var(--color-primary)" } }, ".btn-primary:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-primary), black 10%)", borderColor: "color-mix(in oklch, var(--color-primary), black 10%)", filter: "none" } }, ".btn-secondary": { "@layer components": { "--btn-text-color": "var(--color-secondary-content)", backgroundColor: "var(--color-secondary)", borderColor: "var(--color-secondary)" } }, ".btn-secondary:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-secondary), black 10%)", borderColor: "color-mix(in oklch, var(--color-secondary), black 10%)", filter: "none" } }, ".btn-tertiary": { "@layer components": { "--btn-text-color": "var(--color-tertiary-content)", backgroundColor: "var(--color-tertiary)", borderColor: "var(--color-tertiary)" } }, ".btn-tertiary:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-tertiary), black 10%)", borderColor: "color-mix(in oklch, var(--color-tertiary), black 10%)", filter: "none" } }, ".btn-accent": { "@layer components": { "--btn-text-color": "var(--color-accent-content)", backgroundColor: "var(--color-accent)", borderColor: "var(--color-accent)" } }, ".btn-accent:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-accent), black 10%)", borderColor: "color-mix(in oklch, var(--color-accent), black 10%)", filter: "none" } }, ".btn-neutral": { "@layer components": { "--btn-text-color": "var(--color-neutral-content)", backgroundColor: "var(--color-neutral)", borderColor: "var(--color-neutral)" } }, ".btn-neutral:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-neutral), black 10%)", borderColor: "color-mix(in oklch, var(--color-neutral), black 10%)", filter: "none" } }, ".btn-base": { "@layer components": { "--btn-text-color": "var(--color-base-content)", backgroundColor: "var(--color-base-100)", borderColor: "var(--color-base-100)" } }, ".btn-base:hover": { "@layer components": { backgroundColor: "var(--color-base-200)", borderColor: "var(--color-base-200)", filter: "none" } }, ".btn-info": { "@layer components": { "--btn-text-color": "var(--color-info-content)", backgroundColor: "var(--color-info)", borderColor: "var(--color-info)" } }, ".btn-info:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-info), black 10%)", borderColor: "color-mix(in oklch, var(--color-info), black 10%)", filter: "none" } }, ".btn-success": { "@layer components": { "--btn-text-color": "var(--color-success-content)", backgroundColor: "var(--color-success)", borderColor: "var(--color-success)" } }, ".btn-success:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-success), black 10%)", borderColor: "color-mix(in oklch, var(--color-success), black 10%)", filter: "none" } }, ".btn-warning": { "@layer components": { "--btn-text-color": "var(--color-warning-content)", backgroundColor: "var(--color-warning)", borderColor: "var(--color-warning)" } }, ".btn-warning:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-warning), black 10%)", borderColor: "color-mix(in oklch, var(--color-warning), black 10%)", filter: "none" } }, ".btn-error": { "@layer components": { "--btn-text-color": "var(--color-error-content)", backgroundColor: "var(--color-error)", borderColor: "var(--color-error)" } }, ".btn-error:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-error), black 10%)", borderColor: "color-mix(in oklch, var(--color-error), black 10%)", filter: "none" } }, ".btn-outline, \n .btn-outlined": { "@layer components": { "--btn-text-color": "var(--color-on-surface)", backgroundColor: "transparent", borderColor: "var(--color-outline)" } }, ".btn-outline:hover, \n .btn-outlined:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)", filter: "none" } }, ".btn-outline.btn-primary, \n .btn-outlined.btn-primary": { "@layer components": { "--btn-text-color": "var(--color-primary)", borderColor: "currentColor" } }, ".btn-outline.btn-primary:hover, \n .btn-outlined.btn-primary:hover": { "@layer components": { "--btn-text-color": "var(--color-primary-content)", backgroundColor: "var(--color-primary)" } }, ".btn-outline.btn-secondary, \n .btn-outlined.btn-secondary": { "@layer components": { "--btn-text-color": "var(--color-secondary)", borderColor: "currentColor" } }, ".btn-outline.btn-secondary:hover, \n .btn-outlined.btn-secondary:hover": { "@layer components": { "--btn-text-color": "var(--color-secondary-content)", backgroundColor: "var(--color-secondary)" } }, ".btn-outline.btn-tertiary, \n .btn-outlined.btn-tertiary": { "@layer components": { "--btn-text-color": "var(--color-tertiary)", borderColor: "currentColor" } }, ".btn-outline.btn-tertiary:hover, \n .btn-outlined.btn-tertiary:hover": { "@layer components": { "--btn-text-color": "var(--color-tertiary-content)", backgroundColor: "var(--color-tertiary)" } }, ".btn-outline.btn-accent, \n .btn-outlined.btn-accent": { "@layer components": { "--btn-text-color": "var(--color-accent)", borderColor: "currentColor" } }, ".btn-outline.btn-accent:hover, \n .btn-outlined.btn-accent:hover": { "@layer components": { "--btn-text-color": "var(--color-accent-content)", backgroundColor: "var(--color-accent)" } }, ".btn-outline.btn-neutral, \n .btn-outlined.btn-neutral": { "@layer components": { "--btn-text-color": "var(--color-neutral)", borderColor: "currentColor" } }, ".btn-outline.btn-neutral:hover, \n .btn-outlined.btn-neutral:hover": { "@layer components": { "--btn-text-color": "var(--color-neutral-content)", backgroundColor: "var(--color-neutral)" } }, ".btn-outline.btn-base, \n .btn-outlined.btn-base": { "@layer components": { "--btn-text-color": "var(--color-base-content)", borderColor: "currentColor" } }, ".btn-outline.btn-base:hover, \n .btn-outlined.btn-base:hover": { "@layer components": { "--btn-text-color": "var(--color-base-content)", backgroundColor: "var(--color-base-100)" } }, ".btn-outline.btn-info, \n .btn-outlined.btn-info": { "@layer components": { "--btn-text-color": "var(--color-info)", borderColor: "currentColor" } }, ".btn-outline.btn-info:hover, \n .btn-outlined.btn-info:hover": { "@layer components": { "--btn-text-color": "var(--color-info-content)", backgroundColor: "var(--color-info)" } }, ".btn-outline.btn-success, \n .btn-outlined.btn-success": { "@layer components": { "--btn-text-color": "var(--color-success)", borderColor: "currentColor" } }, ".btn-outline.btn-success:hover, \n .btn-outlined.btn-success:hover": { "@layer components": { "--btn-text-color": "var(--color-success-content)", backgroundColor: "var(--color-success)" } }, ".btn-outline.btn-warning, \n .btn-outlined.btn-warning": { "@layer components": { "--btn-text-color": "var(--color-warning)", borderColor: "currentColor" } }, ".btn-outline.btn-warning:hover, \n .btn-outlined.btn-warning:hover": { "@layer components": { "--btn-text-color": "var(--color-warning-content)", backgroundColor: "var(--color-warning)" } }, ".btn-outline.btn-error, \n .btn-outlined.btn-error": { "@layer components": { "--btn-text-color": "var(--color-error)", borderColor: "currentColor" } }, ".btn-outline.btn-error:hover, \n .btn-outlined.btn-error:hover": { "@layer components": { "--btn-text-color": "var(--color-error-content)", backgroundColor: "var(--color-error)" } }, ".btn-ghost": { "@layer components": { "--btn-text-color": "var(--color-on-surface)", backgroundColor: "transparent", borderColor: "transparent" } }, ".btn-ghost:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)", filter: "none" } }, ".btn-ghost.btn-primary": { "@layer components": { "--btn-text-color": "var(--color-primary)" } }, ".btn-ghost.btn-primary:hover": { "@layer components": { "--btn-text-color": "var(--color-on-primary-container)", backgroundColor: "var(--color-primary-container)" } }, ".btn-ghost.btn-secondary": { "@layer components": { "--btn-text-color": "var(--color-secondary)" } }, ".btn-ghost.btn-secondary:hover": { "@layer components": { "--btn-text-color": "var(--color-on-secondary-container)", backgroundColor: "var(--color-secondary-container)" } }, ".btn-ghost.btn-tertiary": { "@layer components": { "--btn-text-color": "var(--color-tertiary)" } }, ".btn-ghost.btn-tertiary:hover": { "@layer components": { "--btn-text-color": "var(--color-on-tertiary-container)", backgroundColor: "var(--color-tertiary-container)" } }, ".btn-ghost.btn-info": { "@layer components": { "--btn-text-color": "var(--color-info)" } }, ".btn-ghost.btn-success": { "@layer components": { "--btn-text-color": "var(--color-success)" } }, ".btn-ghost.btn-warning": { "@layer components": { "--btn-text-color": "var(--color-warning)" } }, ".btn-ghost.btn-error": { "@layer components": { "--btn-text-color": "var(--color-error)" } }, ".btn-ghost.btn-accent": { "@layer components": { "--btn-text-color": "var(--color-accent)" } }, ".btn-ghost.btn-neutral": { "@layer components": { "--btn-text-color": "var(--color-neutral)" } }, ".btn-ghost.btn-base": { "@layer components": { "--btn-text-color": "var(--color-base-content)" } }, ".btn-ghost.btn-accent:hover": { "@layer components": { "--btn-text-color": "var(--color-accent)", backgroundColor: "color-mix(in oklch, var(--color-accent) 15%, var(--color-surface))" } }, ".btn-ghost.btn-neutral:hover": { "@layer components": { "--btn-text-color": "var(--color-neutral)", backgroundColor: "color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface))" } }, ".btn-ghost.btn-base:hover": { "@layer components": { "--btn-text-color": "var(--color-base-content)", backgroundColor: "var(--color-base-200)" } }, ".btn-ghost.btn-info:hover": { "@layer components": { "--btn-text-color": "var(--color-on-info-container)", backgroundColor: "var(--color-info-container)" } }, ".btn-ghost.btn-success:hover": { "@layer components": { "--btn-text-color": "var(--color-on-success-container)", backgroundColor: "var(--color-success-container)" } }, ".btn-ghost.btn-warning:hover": { "@layer components": { "--btn-text-color": "var(--color-on-warning-container)", backgroundColor: "var(--color-warning-container)" } }, ".btn-ghost.btn-error:hover": { "@layer components": { "--btn-text-color": "var(--color-on-error-container)", backgroundColor: "var(--color-error-container)" } }, ".btn-text": { "@layer components": { "--btn-text-color": "var(--color-on-surface)", backgroundColor: "transparent", borderColor: "transparent" } }, ".btn-text:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)", filter: "none" } }, ".btn-text.btn-primary": { "@layer components": { "--btn-text-color": "var(--color-primary)" } }, ".btn-text.btn-primary:hover": { "@layer components": { "--btn-text-color": "var(--color-on-primary-container)", backgroundColor: "var(--color-primary-container)" } }, ".btn-text.btn-secondary": { "@layer components": { "--btn-text-color": "var(--color-secondary)" } }, ".btn-text.btn-secondary:hover": { "@layer components": { "--btn-text-color": "var(--color-on-secondary-container)", backgroundColor: "var(--color-secondary-container)" } }, ".btn-text.btn-tertiary": { "@layer components": { "--btn-text-color": "var(--color-tertiary)" } }, ".btn-text.btn-tertiary:hover": { "@layer components": { "--btn-text-color": "var(--color-on-tertiary-container)", backgroundColor: "var(--color-tertiary-container)" } }, ".btn-text.btn-info": { "@layer components": { "--btn-text-color": "var(--color-info)" } }, ".btn-text.btn-success": { "@layer components": { "--btn-text-color": "var(--color-success)" } }, ".btn-text.btn-warning": { "@layer components": { "--btn-text-color": "var(--color-warning)" } }, ".btn-text.btn-error": { "@layer components": { "--btn-text-color": "var(--color-error)" } }, ".btn-text.btn-accent": { "@layer components": { "--btn-text-color": "var(--color-accent)" } }, ".btn-text.btn-neutral": { "@layer components": { "--btn-text-color": "var(--color-neutral)" } }, ".btn-text.btn-base": { "@layer components": { "--btn-text-color": "var(--color-base-content)" } }, ".btn-text.btn-accent:hover": { "@layer components": { "--btn-text-color": "var(--color-accent)", backgroundColor: "color-mix(in oklch, var(--color-accent) 15%, var(--color-surface))" } }, ".btn-text.btn-neutral:hover": { "@layer components": { "--btn-text-color": "var(--color-neutral)", backgroundColor: "color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface))" } }, ".btn-text.btn-base:hover": { "@layer components": { "--btn-text-color": "var(--color-base-content)", backgroundColor: "var(--color-base-200)" } }, ".btn-text.btn-info:hover": { "@layer components": { "--btn-text-color": "var(--color-on-info-container)", backgroundColor: "var(--color-info-container)" } }, ".btn-text.btn-success:hover": { "@layer components": { "--btn-text-color": "var(--color-on-success-container)", backgroundColor: "var(--color-success-container)" } }, ".btn-text.btn-warning:hover": { "@layer components": { "--btn-text-color": "var(--color-on-warning-container)", backgroundColor: "var(--color-warning-container)" } }, ".btn-text.btn-error:hover": { "@layer components": { "--btn-text-color": "var(--color-on-error-container)", backgroundColor: "var(--color-error-container)" } }, ".btn-tonal": { "@layer components": { "--btn-text-color": "var(--color-on-primary-container)", backgroundColor: "var(--color-primary-container)", borderColor: "transparent" } }, ".btn-tonal:hover": { "@layer components": { filter: "brightness(0.95)" } }, ".btn-tonal.btn-primary": { "@layer components": { "--btn-text-color": "var(--color-on-primary-container)", backgroundColor: "var(--color-primary-container)" } }, ".btn-tonal.btn-secondary": { "@layer components": { "--btn-text-color": "var(--color-on-secondary-container)", backgroundColor: "var(--color-secondary-container)" } }, ".btn-tonal.btn-tertiary": { "@layer components": { "--btn-text-color": "var(--color-on-tertiary-container)", backgroundColor: "var(--color-tertiary-container)" } }, ".btn-tonal.btn-accent": { "@layer components": { "--btn-text-color": "var(--color-on-surface)", backgroundColor: "color-mix(in oklch, var(--color-accent) 15%, var(--color-surface))" } }, ".btn-tonal.btn-neutral": { "@layer components": { "--btn-text-color": "var(--color-on-surface)", backgroundColor: "color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface))" } }, ".btn-tonal.btn-base": { "@layer components": { "--btn-text-color": "var(--color-base-content)", backgroundColor: "var(--color-base-200)" } }, ".btn-tonal.btn-info": { "@layer components": { "--btn-text-color": "var(--color-on-info-container)", backgroundColor: "var(--color-info-container)" } }, ".btn-tonal.btn-success": { "@layer components": { "--btn-text-color": "var(--color-on-success-container)", backgroundColor: "var(--color-success-container)" } }, ".btn-tonal.btn-warning": { "@layer components": { "--btn-text-color": "var(--color-on-warning-container)", backgroundColor: "var(--color-warning-container)" } }, ".btn-tonal.btn-error": { "@layer components": { "--btn-text-color": "var(--color-on-error-container)", backgroundColor: "var(--color-error-container)" } }, ".btn-xs": { "@layer components": { "--btn-p": "0.5rem", "--btn-py": "0.25rem", fontSize: "0.75rem", lineHeight: "1rem", borderRadius: "var(--radius-xs)" } }, ".btn-sm": { "@layer components": { "--btn-p": "0.75rem", "--btn-py": "0.375rem", fontSize: "0.8125rem", lineHeight: "1.125rem", borderRadius: "var(--radius-xs)" } }, ".btn-md": { "@layer components": { "--btn-p": "1.25rem", "--btn-py": "0.625rem", fontSize: "0.875rem", lineHeight: "1.25rem", borderRadius: "var(--radius-sm)" } }, ".btn-lg": { "@layer components": { "--btn-p": "1.75rem", "--btn-py": "0.875rem", fontSize: "1rem", lineHeight: "1.5rem", borderRadius: "var(--radius-sm)" } }, ".btn-block": { "@layer components": { display: "flex", width: "100%" } }, ".btn-group": { "@layer components": { display: "inline-flex" } }, ".btn-group .btn": { "@layer components": { borderRadius: "0" } }, ".btn-group .btn:first-child": { "@layer components": { borderTopLeftRadius: "var(--radius-sm)", borderBottomLeftRadius: "var(--radius-sm)" } }, ".btn-group .btn:last-child": { "@layer components": { borderTopRightRadius: "var(--radius-sm)", borderBottomRightRadius: "var(--radius-sm)" } }, ".btn-group .btn:not(:first-child)": { "@layer components": { marginInlineStart: "-1px" } }, ".btn-loading": { "@layer components": { pointerEvents: "none", position: "relative", color: "transparent !important" } }, ".btn-loading::after": [{ "@layer components": { content: "''", position: "absolute", width: "1rem", height: "1rem", border: "2px solid var(--btn-text-color)", borderRightColor: "transparent", borderRadius: "var(--radius-full)", animation: "btn-spin 0.6s linear infinite" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { animation: "none" } } }], "@keyframes btn-spin": { to: { transform: "rotate(360deg)" } }, ".btn-icon": { "@layer components": { padding: "0.75rem", width: "2.5rem", height: "2.5rem", borderRadius: "var(--radius-full)" } }, ".btn-icon-sm": { "@layer components": { padding: "0.5rem", width: "2rem", height: "2rem" } }, ".btn-icon-lg": { "@layer components": { padding: "1rem", width: "3rem", height: "3rem" } }, ".btn-circle": { "@layer components": { "--btn-p": "0.625rem", "--btn-py": "0.625rem", borderRadius: "var(--radius-full)", aspectRatio: "1" } }, ".btn-square": { "@layer components": { "--btn-p": "0.625rem", "--btn-py": "0.625rem", aspectRatio: "1" } }, ".card": [{ "@layer components": { display: "flex", flexDirection: "column", position: "relative", overflow: "hidden", borderRadius: "var(--radius-lg)", backgroundColor: "var(--color-surface)", color: "var(--color-on-surface)", boxShadow: "var(--shadow-sm)", transition: "box-shadow 150ms ease-in-out, transform 150ms ease-in-out" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }], ".card:hover": { "@layer components": { boxShadow: "var(--shadow-md)" } }, ".card figure, \n .card-image": { "@layer components": { overflow: "hidden" } }, ".card figure img, \n .card-image img": { "@layer components": { width: "100%", height: "auto", objectFit: "cover" } }, ".card-body": { "@layer components": { "--card-p": "1.5rem", display: "flex", flexDirection: "column", gap: "0.5rem", padding: "var(--card-p)", flex: 1 } }, ".card-header": { "@layer components": { display: "flex", alignItems: "center", gap: "0.5rem", paddingInline: "var(--card-p, 1.5rem)", paddingBlock: "calc(var(--card-p, 1.5rem) * 0.5)", borderBlockEnd: "1px solid var(--color-outline-variant)" } }, ".card-footer": { "@layer components": { display: "flex", alignItems: "center", gap: "0.5rem", paddingInline: "var(--card-p, 1.5rem)", paddingBlock: "calc(var(--card-p, 1.5rem) * 0.5)", borderBlockStart: "1px solid var(--color-outline-variant)", marginBlockStart: "auto" } }, ".card-title": { "@layer components": { fontSize: "1.25rem", fontWeight: 600, lineHeight: "1.75rem", color: "var(--color-on-surface)" } }, ".card-actions": { "@layer components": { display: "flex", flexWrap: "wrap", alignItems: "center", gap: "0.5rem", marginBlockStart: "auto", paddingBlockStart: "0.5rem" } }, ".card-actions.justify-end": { "@layer components": { justifyContent: "flex-end" } }, ".card-actions.justify-start": { "@layer components": { justifyContent: "flex-start" } }, ".card-actions.justify-center": { "@layer components": { justifyContent: "center" } }, ".card-bordered": { "@layer components": { border: "1px solid var(--color-outline)", boxShadow: "none" } }, ".card-bordered:hover": { "@layer components": { boxShadow: "none", borderColor: "var(--color-outline-variant)" } }, ".card-compact .card-header, \n .card-compact .card-body, \n .card-compact .card-footer": { "@layer components": { "--card-p": "1rem" } }, ".card-compact .card-title": { "@layer components": { fontSize: "1rem" } }, ".card-side": { "@layer components": { flexDirection: "row" } }, ".card-side figure, \n .card-side .card-image": { "@layer components": { width: "40%", flexShrink: 0 } }, ".card-side figure img, \n .card-side .card-image img": { "@layer components": { height: "100%", objectFit: "cover" } }, ".card-primary": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".card-primary .card-title": { "@layer components": { color: "var(--color-on-primary-container)" } }, ".card-secondary": { "@layer components": { backgroundColor: "var(--color-secondary-container)", color: "var(--color-on-secondary-container)" } }, ".card-secondary .card-title": { "@layer components": { color: "var(--color-on-secondary-container)" } }, ".card-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary-container)", color: "var(--color-on-tertiary-container)" } }, ".card-tertiary .card-title": { "@layer components": { color: "var(--color-on-tertiary-container)" } }, ".card-info": { "@layer components": { backgroundColor: "var(--color-info-container)", color: "var(--color-on-info-container)" } }, ".card-info .card-title": { "@layer components": { color: "var(--color-on-info-container)" } }, ".card-success": { "@layer components": { backgroundColor: "var(--color-success-container)", color: "var(--color-on-success-container)" } }, ".card-success .card-title": { "@layer components": { color: "var(--color-on-success-container)" } }, ".card-warning": { "@layer components": { backgroundColor: "var(--color-warning-container)", color: "var(--color-on-warning-container)" } }, ".card-warning .card-title": { "@layer components": { color: "var(--color-on-warning-container)" } }, ".card-error": { "@layer components": { backgroundColor: "var(--color-error-container)", color: "var(--color-on-error-container)" } }, ".card-error .card-title": { "@layer components": { color: "var(--color-on-error-container)" } }, ".card-accent": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-accent) 15%, var(--color-surface))", color: "var(--color-on-surface)" } }, ".card-accent .card-title": { "@layer components": { color: "var(--color-on-surface)" } }, ".card-neutral": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface))", color: "var(--color-on-surface)" } }, ".card-neutral .card-title": { "@layer components": { color: "var(--color-on-surface)" } }, ".card-base": { "@layer components": { backgroundColor: "var(--color-base-200)", color: "var(--color-base-content)" } }, ".card-base .card-title": { "@layer components": { color: "var(--color-base-content)" } }, ".card-glass": { "@layer components": { backgroundColor: "rgb(255 255 255 / 0.1)", backdropFilter: "blur(12px)", border: "1px solid rgb(255 255 255 / 0.2)" } }, ".card-elevated": { "@layer components": { boxShadow: "var(--shadow-lg)" } }, ".card-elevated:hover": { "@layer components": { boxShadow: "var(--shadow-xl)", transform: "translateY(-2px)" } }, ".card-interactive": { "@layer components": { cursor: "pointer" } }, ".card-interactive:active": { "@layer components": { transform: "scale(0.99)" } }, ".card-interactive:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".card-full-image": { "@layer components": { position: "relative" } }, ".card-full-image figure, \n .card-full-image .card-image": { "@layer components": { position: "absolute", inset: "0", zIndex: 0 } }, ".card-full-image .card-body": { "@layer components": { position: "relative", zIndex: 1, background: "linear-gradient(to top, color-mix(in srgb, var(--color-shadow) 70%, transparent), transparent)", color: "white", marginTop: "auto", minHeight: "50%" } }, ".card-full-image .card-title": { "@layer components": { color: "white" } }, ".input": { "@layer components": { display: "flex", width: "100%", padding: "0.75rem 1rem", fontSize: "1rem", lineHeight: "1.5rem", backgroundColor: "var(--color-surface)", color: "var(--color-on-surface)", border: "1px solid currentColor", borderRadius: "var(--radius-sm)", transition: "border-color 150ms ease-in-out, box-shadow 150ms ease-in-out" } }, ".input::placeholder": { "@layer components": { color: "var(--color-on-surface-variant)", opacity: 0.7 } }, ".input:focus": { "@layer components": { outline: "none" } }, ".input:focus-visible": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)", outline: "none" } }, ".input:disabled": { "@layer components": { cursor: "not-allowed", opacity: 0.5, backgroundColor: "var(--color-surface-container)" } }, ".input-bordered": { "@layer components": { borderColor: "var(--color-outline)", backgroundColor: "var(--color-surface)" } }, ".input-bordered:hover:not(:disabled):not(:focus)": { "@layer components": { borderColor: "var(--color-outline-variant)" } }, ".input-primary": { "@layer components": { color: "var(--color-primary)" } }, ".input-secondary": { "@layer components": { color: "var(--color-secondary)" } }, ".input-tertiary": { "@layer components": { color: "var(--color-tertiary)" } }, ".input-info": { "@layer components": { color: "var(--color-info)" } }, ".input-success": { "@layer components": { color: "var(--color-success)" } }, ".input-warning": { "@layer components": { color: "var(--color-warning)" } }, ".input-error": { "@layer components": { color: "var(--color-error)" } }, ".input-accent": { "@layer components": { color: "var(--color-accent)" } }, ".input-neutral": { "@layer components": { color: "var(--color-neutral)" } }, ".input-base": { "@layer components": { color: "var(--color-base-content)" } }, ".input-xs": { "@layer components": { padding: "0.375rem 0.625rem", fontSize: "0.75rem", lineHeight: "1rem", borderRadius: "var(--radius-xs)", height: "1.75rem" } }, ".input-sm": { "@layer components": { padding: "0.5rem 0.75rem", fontSize: "0.875rem", lineHeight: "1.25rem", borderRadius: "var(--radius-xs)", height: "2.25rem" } }, ".input-lg": { "@layer components": { padding: "1rem 1.25rem", fontSize: "1.125rem", lineHeight: "1.75rem", borderRadius: "var(--radius-sm)", height: "3.5rem" } }, ".input-ghost": { "@layer components": { backgroundColor: "transparent", borderColor: "transparent" } }, ".input-ghost:focus-visible": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "transparent", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".input-filled": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "transparent", borderBottom: "2px solid var(--color-outline)", borderRadius: "var(--radius-sm) var(--radius-sm) 0 0" } }, ".input-filled:focus-visible": { "@layer components": { borderBottomColor: "var(--color-primary)", boxShadow: "none" } }, ".input-filled.input-primary:focus-visible": { "@layer components": { borderBottomColor: "var(--color-primary)" } }, ".input-filled.input-secondary:focus-visible": { "@layer components": { borderBottomColor: "var(--color-secondary)" } }, ".input-filled.input-tertiary:focus-visible": { "@layer components": { borderBottomColor: "var(--color-tertiary)" } }, ".input-filled.input-info:focus-visible": { "@layer components": { borderBottomColor: "var(--color-info)" } }, ".input-filled.input-success:focus-visible": { "@layer components": { borderBottomColor: "var(--color-success)" } }, ".input-filled.input-warning:focus-visible": { "@layer components": { borderBottomColor: "var(--color-warning)" } }, ".input-filled.input-error:focus-visible": { "@layer components": { borderBottomColor: "var(--color-error)" } }, ".input-filled.input-accent:focus-visible": { "@layer components": { borderBottomColor: "var(--color-accent)" } }, ".input-filled.input-neutral:focus-visible": { "@layer components": { borderBottomColor: "var(--color-neutral)" } }, ".input-filled.input-base:focus-visible": { "@layer components": { borderBottomColor: "var(--color-base-content)" } }, ".input-group": { "@layer components": { display: "flex", alignItems: "stretch" } }, ".input-group > .input": { "@layer components": { flex: 1, borderRadius: "0" } }, ".input-group > .input:first-child": { "@layer components": { borderTopLeftRadius: "var(--radius-sm)", borderBottomLeftRadius: "var(--radius-sm)" } }, ".input-group > .input:last-child": { "@layer components": { borderTopRightRadius: "var(--radius-sm)", borderBottomRightRadius: "var(--radius-sm)" } }, ".input-group-text": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", padding: "0 1rem", backgroundColor: "var(--color-surface-container)", color: "var(--color-on-surface-variant)", border: "1px solid var(--color-outline)" } }, ".input-group-text:first-child": { "@layer components": { borderTopLeftRadius: "var(--radius-sm)", borderBottomLeftRadius: "var(--radius-sm)", borderRight: "none" } }, ".input-group-text:last-child": { "@layer components": { borderTopRightRadius: "var(--radius-sm)", borderBottomRightRadius: "var(--radius-sm)", borderLeft: "none" } }, ".file-input": { "@layer components": { display: "flex", width: "100%", padding: "0", backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline)", borderRadius: "var(--radius-sm)", overflow: "hidden", cursor: "pointer" } }, ".file-input::file-selector-button": { "@layer components": { padding: "0.75rem 1rem", backgroundColor: "var(--color-surface-container)", color: "var(--color-on-surface)", border: "none", borderRight: "1px solid var(--color-outline)", cursor: "pointer", transition: "background-color 150ms ease-in-out" } }, ".file-input::file-selector-button:hover": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".file-input:focus-visible": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)", outline: "none" } }, ".input, \n .input-filled, \n .file-input": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".form-control": [{ "@layer components": { display: "flex", flexDirection: "column", gap: "0.25rem", width: "100%", marginBottom: "1rem", color: "var(--color-on-surface)" } }, { "@layer components": { display: "flex", flexDirection: "column", gap: "0.25rem" } }], ".label": { "@layer components": { display: "flex", justifyContent: "space-between", alignItems: "center", padding: "0.25rem 0" } }, ".label-text": { "@layer components": { fontSize: "0.875rem", fontWeight: 500, color: "var(--color-on-surface)", paddingBottom: "0.25rem" } }, ".label-text-alt": { "@layer components": { fontSize: "0.75rem", color: "var(--color-on-surface-variant)" } }, ".checkbox": [{ "@layer components": { appearance: "none", width: "1.25rem", height: "1.25rem", border: "2px solid var(--color-outline)", borderRadius: "var(--radius-xs)", backgroundColor: "transparent", cursor: "pointer", transition: "all 150ms ease-in-out", position: "relative" } }, { "@layer components": { "--checkbox-size": "1.25rem", "--checkbox-color": "var(--color-primary)", "--checkbox-border-color": "var(--color-on-surface-variant)", color: "var(--color-on-surface)", position: "relative", display: "inline-grid", placeContent: "center", width: "var(--checkbox-size)", height: "var(--checkbox-size)", margin: "0", cursor: "pointer", appearance: "none", backgroundColor: "transparent", border: "2px solid var(--checkbox-border-color)", borderRadius: "var(--radius-xs)", transition: "background-color 150ms ease-in-out, border-color 150ms ease-in-out" } }], ".checkbox:hover": { "@layer components": { borderColor: "var(--color-primary)" } }, ".checkbox:checked": [{ "@layer components": { backgroundColor: "var(--color-primary)", borderColor: "var(--color-primary)" } }, { "@layer components": { backgroundColor: "var(--checkbox-color)", borderColor: "var(--checkbox-color)" } }], ".checkbox:checked::after": { "@layer components": { content: "''", position: "absolute", left: "0.25rem", top: "0.0625rem", width: "0.375rem", height: "0.625rem", border: "solid var(--color-primary-content)", borderWidth: "0 2px 2px 0", transform: "rotate(45deg)" } }, ".checkbox:focus-visible": [{ "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, var(--checkbox-color) 20%, transparent)" } }], ".checkbox:disabled": [{ "@layer components": { cursor: "not-allowed", opacity: 0.5 } }, { "@layer components": { cursor: "not-allowed", opacity: 0.38 } }], ".checkbox-primary:checked": { "@layer components": { backgroundColor: "var(--color-primary)", borderColor: "var(--color-primary)" } }, ".checkbox-secondary:checked": { "@layer components": { backgroundColor: "var(--color-secondary)", borderColor: "var(--color-secondary)" } }, ".checkbox-success:checked": { "@layer components": { backgroundColor: "var(--color-success)", borderColor: "var(--color-success)" } }, ".checkbox-tertiary:checked": { "@layer components": { backgroundColor: "var(--color-tertiary)", borderColor: "var(--color-tertiary)" } }, ".checkbox-info:checked": { "@layer components": { backgroundColor: "var(--color-info)", borderColor: "var(--color-info)" } }, ".checkbox-warning:checked": { "@layer components": { backgroundColor: "var(--color-warning)", borderColor: "var(--color-warning)" } }, ".checkbox-error:checked": { "@layer components": { backgroundColor: "var(--color-error)", borderColor: "var(--color-error)" } }, ".checkbox-accent:checked": { "@layer components": { backgroundColor: "var(--color-accent)", borderColor: "var(--color-accent)" } }, ".checkbox-accent:checked::after": { "@layer components": { borderColor: "var(--color-accent-content)" } }, ".checkbox-neutral:checked": { "@layer components": { backgroundColor: "var(--color-neutral)", borderColor: "var(--color-neutral)" } }, ".checkbox-neutral:checked::after": { "@layer components": { borderColor: "var(--color-neutral-content)" } }, ".checkbox-base:checked": { "@layer components": { backgroundColor: "var(--color-base-100)", borderColor: "var(--color-base-100)" } }, ".checkbox-base:checked::after": { "@layer components": { borderColor: "var(--color-base-content)" } }, ".checkbox-xs": [{ "@layer components": { width: "0.875rem", height: "0.875rem" } }, { "@layer components": { "--checkbox-size": "0.875rem" } }], ".checkbox-sm": [{ "@layer components": { width: "1rem", height: "1rem" } }, { "@layer components": { "--checkbox-size": "1rem" } }], ".checkbox-lg": [{ "@layer components": { width: "1.5rem", height: "1.5rem" } }, { "@layer components": { "--checkbox-size": "1.5rem" } }], ".radio": [{ "@layer components": { appearance: "none", width: "1.25rem", height: "1.25rem", border: "2px solid var(--color-outline)", borderRadius: "var(--radius-full)", backgroundColor: "transparent", cursor: "pointer", transition: "all 150ms ease-in-out", position: "relative" } }, { "@layer components": { "--radio-size": "1.25rem", "--radio-color": "var(--color-primary)", "--radio-border-color": "var(--color-on-surface-variant)", color: "var(--color-on-surface)", position: "relative", display: "inline-grid", placeContent: "center", width: "var(--radio-size)", height: "var(--radio-size)", margin: "0", cursor: "pointer", appearance: "none", backgroundColor: "transparent", border: "2px solid var(--radio-border-color)", borderRadius: "var(--radius-full)", transition: "border-color 150ms ease-in-out" } }], ".radio:hover": { "@layer components": { borderColor: "var(--color-primary)" } }, ".radio:checked": [{ "@layer components": { borderColor: "var(--color-primary)" } }, { "@layer components": { borderColor: "var(--radio-color)" } }], ".radio:checked::after": { "@layer components": { content: "''", position: "absolute", left: "50%", top: "50%", width: "0.5rem", height: "0.5rem", backgroundColor: "var(--color-primary)", borderRadius: "var(--radius-full)", transform: "translate(-50%, -50%)" } }, ".radio:focus-visible": [{ "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, var(--radio-color) 20%, transparent)" } }], ".radio:disabled": [{ "@layer components": { cursor: "not-allowed", opacity: 0.5 } }, { "@layer components": { cursor: "not-allowed", opacity: 0.38 } }], ".radio-primary:checked": { "@layer components": { borderColor: "var(--color-primary)" } }, ".radio-primary:checked::after": { "@layer components": { backgroundColor: "var(--color-primary)" } }, ".radio-secondary:checked": { "@layer components": { borderColor: "var(--color-secondary)" } }, ".radio-secondary:checked::after": { "@layer components": { backgroundColor: "var(--color-secondary)" } }, ".radio-tertiary:checked": { "@layer components": { borderColor: "var(--color-tertiary)" } }, ".radio-tertiary:checked::after": { "@layer components": { backgroundColor: "var(--color-tertiary)" } }, ".radio-info:checked": { "@layer components": { borderColor: "var(--color-info)" } }, ".radio-info:checked::after": { "@layer components": { backgroundColor: "var(--color-info)" } }, ".radio-success:checked": { "@layer components": { borderColor: "var(--color-success)" } }, ".radio-success:checked::after": { "@layer components": { backgroundColor: "var(--color-success)" } }, ".radio-warning:checked": { "@layer components": { borderColor: "var(--color-warning)" } }, ".radio-warning:checked::after": { "@layer components": { backgroundColor: "var(--color-warning)" } }, ".radio-error:checked": { "@layer components": { borderColor: "var(--color-error)" } }, ".radio-error:checked::after": { "@layer components": { backgroundColor: "var(--color-error)" } }, ".radio-accent:checked": { "@layer components": { borderColor: "var(--color-accent)" } }, ".radio-accent:checked::after": { "@layer components": { backgroundColor: "var(--color-accent)" } }, ".radio-neutral:checked": { "@layer components": { borderColor: "var(--color-neutral)" } }, ".radio-neutral:checked::after": { "@layer components": { backgroundColor: "var(--color-neutral)" } }, ".radio-base:checked": { "@layer components": { borderColor: "var(--color-base-content)" } }, ".radio-base:checked::after": { "@layer components": { backgroundColor: "var(--color-base-content)" } }, ".toggle": { "@layer components": { appearance: "none", width: "3rem", height: "1.5rem", borderRadius: "var(--radius-lg)", backgroundColor: "var(--color-surface-container-highest)", cursor: "pointer", transition: "all 150ms ease-in-out", position: "relative" } }, ".toggle::after": { "@layer components": { content: "''", position: "absolute", left: "0.25rem", top: "50%", transform: "translateY(-50%)", width: "1rem", height: "1rem", backgroundColor: "var(--color-on-surface-variant)", borderRadius: "var(--radius-full)", transition: "all 150ms ease-in-out" } }, ".toggle:checked": { "@layer components": { backgroundColor: "var(--color-primary)" } }, ".toggle:checked::after": { "@layer components": { left: "calc(100% - 1.25rem)", backgroundColor: "var(--color-primary-content)" } }, ".toggle:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".toggle:disabled": { "@layer components": { cursor: "not-allowed", opacity: 0.5 } }, ".toggle-xs": { "@layer components": { width: "2rem", height: "1rem" } }, ".toggle-xs::after": { "@layer components": { width: "0.625rem", height: "0.625rem", left: "0.1875rem" } }, ".toggle-xs:checked::after": { "@layer components": { left: "calc(100% - 0.8125rem)" } }, ".toggle-sm": { "@layer components": { width: "2.5rem", height: "1.25rem" } }, ".toggle-sm::after": { "@layer components": { width: "0.75rem", height: "0.75rem" } }, ".toggle-lg": { "@layer components": { width: "4rem", height: "2rem" } }, ".toggle-lg::after": { "@layer components": { width: "1.5rem", height: "1.5rem" } }, ".select": [{ "@layer components": { appearance: "none", width: "100%", padding: "0.75rem 2.5rem 0.75rem 1rem", fontSize: "1rem", lineHeight: "1.5rem", backgroundColor: "var(--color-surface)", color: "var(--color-on-surface)", border: "1px solid currentColor", borderRadius: "var(--radius-sm)", cursor: "pointer", backgroundImage: `url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e")`, backgroundPosition: "right 0.75rem center", backgroundRepeat: "no-repeat", backgroundSize: "1.25rem", transition: "border-color 150ms ease-in-out" } }, { "@layer components": { display: "block", width: "100%", padding: "0.75rem 2.5rem 0.75rem 1rem", fontSize: "1rem", lineHeight: "1.5rem", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface)", border: "1px solid currentColor", borderRadius: "var(--radius-sm)", outline: "none", cursor: "pointer", appearance: "none", backgroundImage: `url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e")`, backgroundPosition: "right 0.75rem center", backgroundRepeat: "no-repeat", backgroundSize: "1.25rem 1.25rem", transition: "border-color 150ms ease-in-out, box-shadow 150ms ease-in-out" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }], ".select:focus": [{ "@layer components": { outline: "none" } }, { "@layer components": { outline: "none" } }], ".select:focus-visible": [{ "@layer components": { borderColor: "var(--color-primary)", outline: "none" } }, { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }], ".select:disabled": [{ "@layer components": { cursor: "not-allowed", opacity: 0.5 } }, { "@layer components": { cursor: "not-allowed", opacity: 0.5, backgroundColor: "var(--color-surface-container)" } }], ".select-bordered": { "@layer components": { borderColor: "var(--color-outline)" } }, ".select-primary:focus-visible": { "@layer components": { borderColor: "var(--color-primary)" } }, ".select-secondary:focus-visible": { "@layer components": { borderColor: "var(--color-secondary)" } }, ".select-tertiary:focus-visible": { "@layer components": { borderColor: "var(--color-tertiary)" } }, ".select-info:focus-visible": { "@layer components": { borderColor: "var(--color-info)" } }, ".select-success:focus-visible": { "@layer components": { borderColor: "var(--color-success)" } }, ".select-warning:focus-visible": { "@layer components": { borderColor: "var(--color-warning)" } }, ".select-error:focus-visible": { "@layer components": { borderColor: "var(--color-error)" } }, ".select-accent:focus-visible": { "@layer components": { borderColor: "var(--color-accent)" } }, ".select-neutral:focus-visible": { "@layer components": { borderColor: "var(--color-neutral)" } }, ".select-base:focus-visible": { "@layer components": { borderColor: "var(--color-base-content)" } }, ".select-xs": [{ "@layer components": { padding: "0.375rem 2rem 0.375rem 0.625rem", fontSize: "0.75rem", lineHeight: "1rem" } }, { "@layer components": { padding: "0.375rem 2rem 0.375rem 0.625rem", fontSize: "0.75rem", lineHeight: "1rem", borderRadius: "var(--radius-xs)", backgroundSize: "1rem 1rem" } }], ".select-sm": [{ "@layer components": { padding: "0.5rem 2.25rem 0.5rem 0.75rem", fontSize: "0.875rem", lineHeight: "1.25rem" } }, { "@layer components": { padding: "0.5rem 2.25rem 0.5rem 0.75rem", fontSize: "0.875rem", lineHeight: "1.25rem", borderRadius: "var(--radius-xs)", backgroundSize: "1.125rem 1.125rem" } }], ".select-lg": [{ "@layer components": { padding: "1rem 3rem 1rem 1.25rem", fontSize: "1.125rem", lineHeight: "1.75rem" } }, { "@layer components": { padding: "1rem 3rem 1rem 1.25rem", fontSize: "1.125rem", lineHeight: "1.75rem", borderRadius: "var(--radius-sm)", backgroundSize: "1.5rem 1.5rem", backgroundPosition: "right 1rem center" } }], ".textarea": [{ "@layer components": { width: "100%", minHeight: "6rem", padding: "0.75rem 1rem", fontSize: "1rem", lineHeight: "1.5rem", backgroundColor: "var(--color-surface)", color: "var(--color-on-surface)", border: "1px solid currentColor", borderRadius: "var(--radius-sm)", resize: "vertical", fieldSizing: "content", transition: "border-color 150ms ease-in-out" } }, { "@layer components": { display: "block", width: "100%", minHeight: "6rem", padding: "0.75rem 1rem", fontSize: "1rem", lineHeight: "1.5rem", fontFamily: "inherit", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface)", border: "1px solid currentColor", borderRadius: "var(--radius-sm)", outline: "none", resize: "vertical", fieldSizing: "content", transition: "border-color 150ms ease-in-out, box-shadow 150ms ease-in-out" } }], ".textarea::placeholder": [{ "@layer components": { color: "var(--color-on-surface-variant)", opacity: 0.7 } }, { "@layer components": { color: "var(--color-on-surface-variant)", opacity: 0.7 } }], ".textarea:focus": [{ "@layer components": { outline: "none" } }, { "@layer components": { outline: "none" } }], ".textarea:focus-visible": [{ "@layer components": { borderColor: "var(--color-primary)" } }, { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }], ".textarea:disabled": [{ "@layer components": { cursor: "not-allowed", opacity: 0.5, resize: "none" } }, { "@layer components": { cursor: "not-allowed", opacity: 0.5, backgroundColor: "var(--color-surface-container)", resize: "none" } }], ".textarea-bordered": { "@layer components": { borderColor: "var(--color-outline)" } }, ".form-control.error .input, \n .form-control.error .select, \n .form-control.error .textarea, \n .input-error, \n .select-error, \n .textarea-error": { "@layer components": { borderColor: "var(--color-error)" } }, ".form-control.error .input:focus-visible, \n .form-control.error .select:focus-visible, \n .form-control.error .textarea:focus-visible": { "@layer components": { borderColor: "var(--color-error)", boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-error) 10%, transparent)" } }, ".form-control.error .label-text": { "@layer components": { color: "var(--color-error)" } }, ".form-control.success .input, \n .form-control.success .select, \n .form-control.success .textarea, \n .input-success, \n .select-success, \n .textarea-success": { "@layer components": { borderColor: "var(--color-success)" } }, ".form-control.success .input:focus-visible, \n .form-control.success .select:focus-visible, \n .form-control.success .textarea:focus-visible": { "@layer components": { borderColor: "var(--color-success)", boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-success) 10%, transparent)" } }, ".form-control.success .label-text": { "@layer components": { color: "var(--color-success)" } }, ".form-control.warning .input, \n .form-control.warning .select, \n .form-control.warning .textarea, \n .input-warning, \n .select-warning, \n .textarea-warning": { "@layer components": { borderColor: "var(--color-warning)" } }, ".form-control.warning .input:focus-visible, \n .form-control.warning .select:focus-visible, \n .form-control.warning .textarea:focus-visible": { "@layer components": { borderColor: "var(--color-warning)", boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-warning) 10%, transparent)" } }, ".form-control.warning .label-text": { "@layer components": { color: "var(--color-warning)" } }, ".form-control.info .input, \n .form-control.info .select, \n .form-control.info .textarea, \n .input-info, \n .select-info, \n .textarea-info": { "@layer components": { borderColor: "var(--color-info)" } }, ".form-control.info .input:focus-visible, \n .form-control.info .select:focus-visible, \n .form-control.info .textarea:focus-visible": { "@layer components": { borderColor: "var(--color-info)", boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-info) 10%, transparent)" } }, ".form-control.info .label-text": { "@layer components": { color: "var(--color-info)" } }, ".helper-text": [{ "@layer components": { fontSize: "0.75rem", color: "var(--color-on-surface-variant)", marginTop: "0.25rem" } }, { "@layer components": { fontSize: "0.75rem", lineHeight: "1rem", color: "var(--color-on-surface-variant)", marginTop: "0.25rem" } }], ".helper-text.error": { "@layer components": { color: "var(--color-error)" } }, ".helper-text.success": { "@layer components": { color: "var(--color-success)" } }, ".helper-text.warning": { "@layer components": { color: "var(--color-warning)" } }, ".helper-text.info": { "@layer components": { color: "var(--color-info)" } }, ".label-text.required::after": { "@layer components": { content: "' *'", color: "var(--color-error)" } }, ".range": { "@layer components": { appearance: "none", width: "100%", height: "0.5rem", backgroundColor: "var(--color-surface-container-highest)", borderRadius: "var(--radius-xs)", cursor: "pointer" } }, ".range::-webkit-slider-thumb": { "@layer components": { appearance: "none", width: "1.25rem", height: "1.25rem", backgroundColor: "var(--color-primary)", borderRadius: "var(--radius-full)", cursor: "pointer", transition: "transform 150ms ease-in-out" } }, ".range::-webkit-slider-thumb:hover": { "@layer components": { transform: "scale(1.1)" } }, ".range::-moz-range-thumb": { "@layer components": { width: "1.25rem", height: "1.25rem", backgroundColor: "var(--color-primary)", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer" } }, ".range:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".form-control, \n .input, \n .select, \n .textarea, \n .range, \n .label-float .form-control ~ label": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".navbar": { "@layer components": { display: "flex", alignItems: "center", width: "100%", minHeight: "4rem", padding: "0.5rem 1rem", backgroundColor: "var(--color-surface)", color: "var(--color-on-surface)" } }, ".navbar-primary": { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)" } }, ".navbar-secondary": { "@layer components": { backgroundColor: "var(--color-secondary)", color: "var(--color-secondary-content)" } }, ".navbar-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary)", color: "var(--color-tertiary-content)" } }, ".navbar-accent": { "@layer components": { backgroundColor: "var(--color-accent)", color: "var(--color-accent-content)" } }, ".navbar-neutral": { "@layer components": { backgroundColor: "var(--color-neutral)", color: "var(--color-neutral-content)" } }, ".navbar-base": { "@layer components": { backgroundColor: "var(--color-base-100)", color: "var(--color-base-content)" } }, ".navbar-info": { "@layer components": { backgroundColor: "var(--color-info)", color: "var(--color-info-content)" } }, ".navbar-success": { "@layer components": { backgroundColor: "var(--color-success)", color: "var(--color-success-content)" } }, ".navbar-warning": { "@layer components": { backgroundColor: "var(--color-warning)", color: "var(--color-warning-content)" } }, ".navbar-error": { "@layer components": { backgroundColor: "var(--color-error)", color: "var(--color-error-content)" } }, ".navbar a": { "@layer components": { color: "inherit" } }, ".navbar-start": { "@layer components": { display: "flex", alignItems: "center", flex: 1, justifyContent: "flex-start", gap: "0.5rem" } }, ".navbar-center": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", flexShrink: 0, gap: "0.5rem" } }, ".navbar-end": { "@layer components": { display: "flex", alignItems: "center", flex: 1, justifyContent: "flex-end", gap: "0.5rem" } }, ".menu": { "@layer components": { display: "flex", flexWrap: "wrap", listStyle: "none", margin: "0", padding: "0.5rem", gap: "0.25rem" } }, ".menu li": { "@layer components": { display: "flex", flexShrink: 0 } }, ".menu li > a, \n .menu li > button, \n .menu-item": { "@layer components": { display: "flex", alignItems: "center", gap: "0.5rem", padding: "0.5rem 1rem", fontSize: "0.875rem", color: "var(--color-on-surface)", textDecoration: "none", borderRadius: "var(--radius-sm)", cursor: "pointer", transition: "background-color 150ms ease-in-out, color 150ms ease-in-out", whiteSpace: "nowrap" } }, ".menu li > a:hover, \n .menu li > button:hover, \n .menu-item:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".menu li > a:focus-visible, \n .menu li > button:focus-visible, \n .menu-item:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, '.menu li > a.active, \n .menu li > button.active, \n .menu-item.active, \n .menu li > a[aria-current="page"], \n .menu li > button[aria-current="page"]': { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".menu li.disabled > a, \n .menu li.disabled > button, \n .menu-item:disabled": { "@layer components": { opacity: 0.5, pointerEvents: "none" } }, ".menu-horizontal": { "@layer components": { flexDirection: "row" } }, ".menu-vertical": { "@layer components": { flexDirection: "column" } }, ".menu-vertical li": { "@layer components": { width: "100%" } }, ".menu-vertical li > a, \n .menu-vertical li > button, \n .menu-vertical .menu-item": { "@layer components": { width: "100%" } }, ".menu-compact li > a, \n .menu-compact li > button, \n .menu-compact .menu-item": { "@layer components": { padding: "0.375rem 0.75rem", fontSize: "0.8125rem" } }, ".menu-title": { "@layer components": { padding: "0.5rem 1rem", fontSize: "0.75rem", fontWeight: 600, textTransform: "uppercase", letterSpacing: "0.05em", color: "var(--color-on-surface-variant)" } }, ".breadcrumbs": { "@layer components": { display: "flex", alignItems: "center", flexWrap: "wrap", gap: "0.5rem", padding: "0.5rem 0", listStyle: "none", margin: "0", fontSize: "0.875rem" } }, ".breadcrumbs li": { "@layer components": { display: "flex", alignItems: "center", gap: "0.5rem" } }, ".breadcrumbs li::after": { "@layer components": { content: "'/'", color: "var(--color-on-surface-variant)", opacity: 0.5 } }, ".breadcrumbs li:last-child::after": { "@layer components": { display: "none" } }, ".breadcrumbs li > a": { "@layer components": { color: "var(--color-primary)", textDecoration: "none", transition: "color 150ms ease-in-out" } }, ".breadcrumbs li > a:hover": { "@layer components": { textDecoration: "underline" } }, ".breadcrumbs li:last-child": { "@layer components": { color: "var(--color-on-surface-variant)" } }, ".breadcrumb-item": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.375rem", color: "var(--color-on-surface-variant)", textDecoration: "none", transition: "color 150ms ease-in-out" } }, ".breadcrumb-item:hover": { "@layer components": { color: "var(--color-on-surface)" } }, ".breadcrumb-item-active": { "@layer components": { color: "var(--color-on-surface)", fontWeight: 500, pointerEvents: "none" } }, ".breadcrumb-link": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.375rem", color: "var(--color-on-surface-variant)", textDecoration: "none", transition: "color 150ms ease-in-out", cursor: "pointer" } }, ".breadcrumb-link:hover": { "@layer components": { color: "var(--color-primary)", textDecoration: "underline" } }, ".breadcrumb-link:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)", borderRadius: "var(--radius-xs)" } }, ".breadcrumb-separator": { "@layer components": { display: "inline-flex", alignItems: "center", color: "var(--color-on-surface-variant)", fontSize: "0.875rem", userSelect: "none", opacity: 0.6 } }, ".breadcrumb-separator::before": { "@layer components": { content: '"/"' } }, ".breadcrumbs-slash .breadcrumb-separator::before": { "@layer components": { content: '"/"' } }, ".breadcrumbs-chevron .breadcrumb-separator::before": { "@layer components": { content: '"›"', fontSize: "1.125rem" } }, ".breadcrumbs-dot .breadcrumb-separator::before": { "@layer components": { content: '"•"' } }, ".breadcrumbs-arrow .breadcrumb-separator::before": { "@layer components": { content: '"→"' } }, ".breadcrumbs-pipe .breadcrumb-separator::before": { "@layer components": { content: '"|"' } }, ".breadcrumb-icon": { "@layer components": { display: "inline-flex", alignItems: "center", justifyContent: "center", width: "1rem", height: "1rem", flexShrink: 0 } }, ".breadcrumb-icon svg": { "@layer components": { width: "100%", height: "100%" } }, ".breadcrumb-home": { "@layer components": { display: "inline-flex", alignItems: "center", justifyContent: "center", color: "var(--color-on-surface-variant)", textDecoration: "none", transition: "color 150ms ease-in-out" } }, ".breadcrumb-home:hover": { "@layer components": { color: "var(--color-primary)" } }, ".breadcrumb-home-icon": { "@layer components": { width: "1.125rem", height: "1.125rem" } }, ".breadcrumb-ellipsis": { "@layer components": { display: "inline-flex", alignItems: "center", justifyContent: "center", padding: "0.25rem 0.5rem", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-xs)", cursor: "pointer", transition: "background-color 150ms ease-in-out" } }, ".breadcrumb-ellipsis::before": { "@layer components": { content: '"..."' } }, ".breadcrumb-ellipsis:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-on-surface) 8%, transparent)" } }, ".breadcrumbs-primary .breadcrumb-link:hover, \n .breadcrumbs-primary .breadcrumb-item-active": { "@layer components": { color: "var(--color-primary)" } }, ".breadcrumbs-secondary .breadcrumb-link:hover, \n .breadcrumbs-secondary .breadcrumb-item-active": { "@layer components": { color: "var(--color-secondary)" } }, ".breadcrumbs-tertiary .breadcrumb-link:hover, \n .breadcrumbs-tertiary .breadcrumb-item-active": { "@layer components": { color: "var(--color-tertiary)" } }, ".breadcrumbs-sm": { "@layer components": { fontSize: "0.75rem", gap: "0.375rem" } }, ".breadcrumbs-sm .breadcrumb-icon, \n .breadcrumbs-sm .breadcrumb-home-icon": { "@layer components": { width: "0.875rem", height: "0.875rem" } }, ".breadcrumbs-lg": { "@layer components": { fontSize: "1rem", gap: "0.625rem" } }, ".breadcrumbs-lg .breadcrumb-icon, \n .breadcrumbs-lg .breadcrumb-home-icon": { "@layer components": { width: "1.25rem", height: "1.25rem" } }, ".breadcrumbs-contained": { "@layer components": { padding: "0.75rem 1rem", backgroundColor: "var(--color-surface-container)", borderRadius: "var(--radius-sm)" } }, ".breadcrumbs-nowrap": { "@layer components": { flexWrap: "nowrap", overflowX: "auto" } }, ".breadcrumb-item-disabled": { "@layer components": { opacity: 1, pointerEvents: "none", cursor: "not-allowed" } }, ".tabs": { "@layer components": { display: "flex", flexWrap: "wrap", gap: "0.25rem", borderBottom: "1px solid var(--color-outline)" } }, ".tab": { "@layer components": { display: "inline-flex", alignItems: "center", justifyContent: "center", gap: "0.5rem", padding: "0.75rem 1.25rem", fontSize: "0.875rem", fontWeight: 500, color: "var(--color-on-surface-variant)", textDecoration: "none", backgroundColor: "transparent", border: "none", borderBottom: "2px solid transparent", cursor: "pointer", transition: "all 150ms ease-in-out", position: "relative", marginBottom: "-1px" } }, ".tab:hover": { "@layer components": { color: "var(--color-on-surface)", backgroundColor: "var(--color-surface-container)" } }, ".tab:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, '.tab.tab-active, \n .tab[aria-selected="true"]': { "@layer components": { color: "var(--color-primary)", borderBottomColor: "var(--color-primary)" } }, ".tab:disabled": { "@layer components": { opacity: 0.5, cursor: "not-allowed" } }, ".tabs-boxed": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderRadius: "var(--radius-sm)", padding: "0.25rem", border: "none" } }, ".tabs-boxed .tab": { "@layer components": { borderRadius: "var(--radius-xs)", borderBottom: "none", marginBottom: "0" } }, '.tabs-boxed .tab.tab-active, \n .tabs-boxed .tab[aria-selected="true"]': { "@layer components": { backgroundColor: "var(--color-surface)", color: "var(--color-on-surface)", boxShadow: "var(--shadow-xs)" } }, ".tabs-lifted": { "@layer components": { border: "none" } }, ".tabs-lifted .tab": { "@layer components": { border: "1px solid transparent", borderBottom: "none", borderRadius: "var(--radius-sm) var(--radius-sm) 0 0", marginBottom: "-1px" } }, '.tabs-lifted .tab.tab-active, \n .tabs-lifted .tab[aria-selected="true"]': { "@layer components": { backgroundColor: "var(--color-surface)", borderColor: "var(--color-outline)", borderBottomColor: "var(--color-surface)" } }, ".tab-xs": { "@layer components": { padding: "0.375rem 0.625rem", fontSize: "0.75rem" } }, ".tab-sm": { "@layer components": { padding: "0.5rem 0.875rem", fontSize: "0.8125rem" } }, ".tab-lg": { "@layer components": { padding: "1rem 1.5rem", fontSize: "1rem" } }, ".dropdown": { "@layer components": { position: "relative", display: "inline-block" } }, ".dropdown-content": { "@layer components": { position: "absolute", zIndex: 50, minWidth: "12rem", padding: "0.5rem", backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline)", borderRadius: "var(--radius-sm)", boxShadow: "var(--shadow-lg)", opacity: 0, visibility: "hidden", transform: "translateY(-0.5rem)", transition: "all 150ms ease-in-out" } }, ".dropdown:hover .dropdown-content, \n .dropdown:focus-within .dropdown-content, \n .dropdown.dropdown-open .dropdown-content": { "@layer components": { opacity: 1, visibility: "visible", transform: "translateY(0)" } }, ".dropdown-end .dropdown-content": { "@layer components": { right: "0" } }, ".dropdown-top .dropdown-content": { "@layer components": { bottom: "100%", top: "auto", marginBottom: "0.25rem" } }, ".dropdown-left .dropdown-content": { "@layer components": { right: "100%", left: "auto", top: "0", marginRight: "0.25rem" } }, ".dropdown-right .dropdown-content": { "@layer components": { left: "100%", right: "auto", top: "0", marginLeft: "0.25rem" } }, ".pagination": { "@layer components": { display: "flex", alignItems: "center", gap: "0.25rem", listStyle: "none", margin: "0", padding: "0" } }, ".pagination-item, \n .pagination-prev, \n .pagination-next, \n .pagination li > a, \n .pagination li > button": { "@layer components": { display: "inline-flex", alignItems: "center", justifyContent: "center", gap: "0.25rem", minWidth: "2.5rem", height: "2.5rem", padding: "0 0.75rem", fontSize: "0.875rem", color: "var(--color-on-surface)", backgroundColor: "transparent", border: "1px solid var(--color-outline)", borderRadius: "var(--radius-sm)", cursor: "pointer", transition: "all 150ms ease-in-out", whiteSpace: "nowrap" } }, ".pagination-item:hover, \n .pagination-prev:hover, \n .pagination-next:hover, \n .pagination li > a:hover, \n .pagination li > button:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, '.pagination-item-active, \n .pagination-item-active-primary, \n .pagination li > a.active, \n .pagination li > button.active, \n .pagination li > a[aria-current="page"], \n .pagination li > button[aria-current="page"]': { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)", borderColor: "var(--color-primary)" } }, ".pagination-item-active-secondary": { "@layer components": { backgroundColor: "var(--color-secondary)", color: "var(--color-secondary-content)", borderColor: "var(--color-secondary)" } }, ".pagination-item-active-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary)", color: "var(--color-tertiary-content)", borderColor: "var(--color-tertiary)" } }, ".pagination-item:focus-visible, \n .pagination-prev:focus-visible, \n .pagination-next:focus-visible, \n .pagination li > a:focus-visible, \n .pagination li > button:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".pagination-item:disabled, \n .pagination-item-disabled, \n .pagination-prev:disabled, \n .pagination-next:disabled, \n .pagination li > a:disabled, \n .pagination li > button:disabled": { "@layer components": { opacity: 0.5, cursor: "not-allowed", pointerEvents: "none" } }, ".pagination-ellipsis": { "@layer components": { display: "inline-flex", alignItems: "center", justifyContent: "center", minWidth: "2.5rem", height: "2.5rem", color: "var(--color-on-surface-variant)" } }, ".pagination-ellipsis::before": { "@layer components": { content: "'…'" } }, ".pagination-info": { "@layer components": { display: "flex", flexDirection: "row", alignItems: "center", gap: "0.5rem" } }, ".pagination-info-text": { "@layer components": { fontSize: "0.875rem", color: "var(--color-on-surface-variant)" } }, ".pagination-input": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.5rem", fontSize: "0.875rem", color: "var(--color-on-surface-variant)" } }, ".pagination-input input": { "@layer components": { width: "3.5rem", padding: "0.375rem 0.5rem", fontSize: "0.875rem", textAlign: "center", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline)", borderRadius: "var(--radius-xs)" } }, ".pagination-input input:focus": { "@layer components": { outline: "none", borderColor: "var(--color-primary)" } }, ".pagination-outlined .pagination-item, \n .pagination-outlined .pagination-prev, \n .pagination-outlined .pagination-next": { "@layer components": { border: "1px solid var(--color-outline)" } }, ".pagination-tonal .pagination-item-active, \n .pagination-tonal .pagination-item-active-primary": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)", borderColor: "var(--color-primary-container)" } }, ".pagination-sm .pagination-item, \n .pagination-sm .pagination-prev, \n .pagination-sm .pagination-next": { "@layer components": { minWidth: "2rem", height: "2rem", padding: "0 0.5rem", fontSize: "0.75rem" } }, ".pagination-lg .pagination-item, \n .pagination-lg .pagination-prev, \n .pagination-lg .pagination-next": { "@layer components": { minWidth: "3rem", height: "3rem", padding: "0 1rem", fontSize: "1rem" } }, ".pagination-compact": { "@layer components": { gap: "0" } }, ".pagination-compact .pagination-item, \n .pagination-compact .pagination-prev, \n .pagination-compact .pagination-next": { "@layer components": { borderRadius: "0" } }, ".pagination-compact .pagination-item:first-child, \n .pagination-compact .pagination-prev": { "@layer components": { borderRadius: "var(--radius-sm) 0 0 var(--radius-sm)" } }, ".pagination-compact .pagination-item:last-child, \n .pagination-compact .pagination-next": { "@layer components": { borderRadius: "0 var(--radius-sm) var(--radius-sm) 0" } }, ".pagination-responsive": { "@layer components": { flexWrap: "wrap", justifyContent: "center" } }, ".pagination-item, \n .pagination-prev, \n .pagination-next": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".modal": [{ "@layer components": { position: "fixed", inset: "0", zIndex: 999, display: "flex", alignItems: "center", justifyContent: "center", padding: "1rem", visibility: "hidden", opacity: 0, transition: "visibility 200ms ease-out, opacity 200ms ease-out" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "visibility 0ms, opacity 0ms" } } }], ".modal.modal-open, \n .modal:target": { "@layer components": { visibility: "visible", opacity: 1 } }, ".modal-box": [{ "@layer components": { position: "relative", zIndex: 1, maxWidth: "32rem", maxHeight: "calc(100vh - 5rem)", padding: "1.5rem", backgroundColor: "var(--color-surface)", color: "var(--color-on-surface)", borderRadius: "var(--radius-lg)", boxShadow: "var(--shadow-2xl)", overflowY: "auto", transform: "scale(0.95)", transition: "transform 200ms ease-out" } }, { "@layer components": { "@media (max-width: 640px)": { maxWidth: "calc(100vw - 2rem)", margin: "1rem" } } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "transform 0ms" } } }], ".modal.modal-open .modal-box, \n .modal:target .modal-box": { "@layer components": { transform: "scale(1)" } }, ".modal-backdrop": { "@layer components": { position: "fixed", inset: "0", zIndex: -1, backgroundColor: "color-mix(in srgb, var(--color-scrim) 50%, transparent)", cursor: "pointer" } }, ".modal-backdrop::before": { "@layer components": { content: "''", position: "absolute", inset: "0" } }, ".modal-action": { "@layer components": { display: "flex", justifyContent: "flex-end", gap: "0.5rem", marginTop: "1.5rem", paddingTop: "1rem" } }, ".modal-toggle": { "@layer components": { position: "fixed", width: "0", height: "0", appearance: "none", opacity: 0 } }, ".modal-toggle:checked + .modal": { "@layer components": { visibility: "visible", opacity: 1 } }, ".modal-toggle:checked + .modal .modal-box": { "@layer components": { transform: "scale(1)" } }, ".modal-sm .modal-box": { "@layer components": { maxWidth: "20rem" } }, ".modal-lg .modal-box": { "@layer components": { maxWidth: "48rem" } }, ".modal-full .modal-box": { "@layer components": { maxWidth: "calc(100vw - 2rem)", maxHeight: "calc(100vh - 2rem)", width: "100%", height: "100%" } }, ".modal-top": { "@layer components": { alignItems: "flex-start", paddingTop: "2rem" } }, ".modal-bottom": { "@layer components": { alignItems: "flex-end", paddingBottom: "2rem" } }, ".modal-middle": { "@layer components": { alignItems: "center" } }, ".modal-close": { "@layer components": { position: "absolute", top: "0.75rem", right: "0.75rem", display: "flex", alignItems: "center", justifyContent: "center", width: "2rem", height: "2rem", fontSize: "1.25rem", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", transition: "background-color 150ms ease-in-out, color 150ms ease-in-out" } }, ".modal-close:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)", color: "var(--color-on-surface)" } }, ".modal-close:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".modal-header": { "@layer components": { marginBottom: "1rem", paddingRight: "2rem" } }, ".modal-title": { "@layer components": { fontSize: "1.25rem", fontWeight: 600, color: "var(--color-on-surface)", margin: "0" } }, ".modal-body": { "@layer components": { color: "var(--color-on-surface-variant)", lineHeight: 1.5 } }, ".modal-responsive": { "@layer components": { "@media (max-width: 640px)": { alignItems: "flex-end", padding: "0" } } }, ".modal-responsive .modal-box": { "@layer components": { "@media (max-width: 640px)": { maxWidth: "100%", maxHeight: "90vh", margin: "0", borderRadius: "var(--radius-lg) var(--radius-lg) 0 0" } } }, ".drawer-modal": { "@layer components": { alignItems: "stretch", justifyContent: "flex-end", padding: "0" } }, ".drawer-modal .modal-box": { "@layer components": { maxWidth: "20rem", maxHeight: "100vh", height: "100%", margin: "0", borderRadius: "0", transform: "translateX(100%)" } }, ".drawer-modal.modal-open .modal-box, \n .drawer-modal:target .modal-box": { "@layer components": { transform: "translateX(0)" } }, ".drawer-modal-left": { "@layer components": { justifyContent: "flex-start" } }, ".drawer-modal-left .modal-box": { "@layer components": { transform: "translateX(-100%)" } }, ".drawer-modal-left.modal-open .modal-box, \n .drawer-modal-left:target .modal-box": { "@layer components": { transform: "translateX(0)" } }, ".alert-dialog": { "@layer components": { textAlign: "center" } }, ".alert-dialog .modal-box": { "@layer components": { maxWidth: "24rem" } }, ".alert-dialog .modal-icon": { "@layer components": { width: "4rem", height: "4rem", margin: "0 auto 1rem", display: "flex", alignItems: "center", justifyContent: "center", borderRadius: "var(--radius-full)", fontSize: "2rem" } }, ".alert-dialog .modal-icon.info": { "@layer components": { backgroundColor: "var(--color-info-container)", color: "var(--color-on-info-container)" } }, ".alert-dialog .modal-icon.success": { "@layer components": { backgroundColor: "var(--color-success-container)", color: "var(--color-on-success-container)" } }, ".alert-dialog .modal-icon.warning": { "@layer components": { backgroundColor: "var(--color-warning-container)", color: "var(--color-on-warning-container)" } }, ".alert-dialog .modal-icon.error": { "@layer components": { backgroundColor: "var(--color-error-container)", color: "var(--color-on-error-container)" } }, ".alert-dialog .modal-action": { "@layer components": { justifyContent: "center" } }, ".modal-focus-trap": { "@layer components": { position: "absolute", width: "1px", height: "1px", padding: "0", margin: "-1px", overflow: "hidden", clip: "rect(0, 0, 0, 0)", whiteSpace: "nowrap", border: "0" } }, ".avatar": { "@layer components": { display: "inline-flex", alignItems: "center", justifyContent: "center", position: "relative", width: "3rem", height: "3rem", borderRadius: "var(--radius-full)", overflow: "hidden", backgroundColor: "var(--color-surface-container)", color: "var(--color-on-surface)", fontWeight: 500, flexShrink: 0 } }, ".avatar img": { "@layer components": { width: "100%", height: "100%", objectFit: "cover" } }, ".avatar-placeholder": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "100%", height: "100%", fontSize: "1.25rem", textTransform: "uppercase" } }, ".avatar-xs": { "@layer components": { width: "1.5rem", height: "1.5rem", fontSize: "0.625rem" } }, ".avatar-sm": { "@layer components": { width: "2rem", height: "2rem", fontSize: "0.75rem" } }, ".avatar-md": { "@layer components": { width: "3rem", height: "3rem", fontSize: "1rem" } }, ".avatar-lg": { "@layer components": { width: "4rem", height: "4rem", fontSize: "1.5rem" } }, ".avatar-xl": { "@layer components": { width: "6rem", height: "6rem", fontSize: "2rem" } }, ".avatar-rounded": { "@layer components": { borderRadius: "var(--radius-sm)" } }, ".avatar-square": { "@layer components": { borderRadius: "0" } }, ".avatar-primary": { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)" } }, ".avatar-secondary": { "@layer components": { backgroundColor: "var(--color-secondary)", color: "var(--color-secondary-content)" } }, ".avatar-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary)", color: "var(--color-tertiary-content)" } }, ".avatar-info": { "@layer components": { backgroundColor: "var(--color-info)", color: "var(--color-info-content)" } }, ".avatar-success": { "@layer components": { backgroundColor: "var(--color-success)", color: "var(--color-success-content)" } }, ".avatar-warning": { "@layer components": { backgroundColor: "var(--color-warning)", color: "var(--color-warning-content)" } }, ".avatar-error": { "@layer components": { backgroundColor: "var(--color-error)", color: "var(--color-error-content)" } }, ".avatar-accent": { "@layer components": { backgroundColor: "var(--color-accent)", color: "var(--color-accent-content)" } }, ".avatar-neutral": { "@layer components": { backgroundColor: "var(--color-neutral)", color: "var(--color-neutral-content)" } }, ".avatar-base": { "@layer components": { backgroundColor: "var(--color-base-100)", color: "var(--color-base-content)" } }, ".avatar-ring": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".avatar-ring-primary": { "@layer components": { outlineColor: "var(--color-primary)" } }, ".avatar-ring-secondary": { "@layer components": { outlineColor: "var(--color-secondary)" } }, ".avatar-ring-tertiary": { "@layer components": { outlineColor: "var(--color-tertiary)" } }, ".avatar-online::after, \n .avatar-offline::after": { "@layer components": { content: "''", position: "absolute", bottom: "0", right: "0", width: "25%", height: "25%", minWidth: "0.5rem", minHeight: "0.5rem", borderRadius: "var(--radius-full)", border: "2px solid var(--color-surface)" } }, ".avatar-online::after": { "@layer components": { backgroundColor: "var(--color-success)" } }, ".avatar-offline::after": { "@layer components": { backgroundColor: "var(--color-outline)" } }, ".avatar-group": { "@layer components": { display: "flex", flexDirection: "row-reverse", justifyContent: "flex-end" } }, ".avatar-group .avatar": { "@layer components": { border: "2px solid var(--color-surface)", marginLeft: "-0.75rem" } }, ".avatar-group .avatar:last-child": { "@layer components": { marginLeft: "0" } }, ".avatar-group-sm .avatar": { "@layer components": { marginLeft: "-0.5rem" } }, ".avatar-group-lg .avatar": { "@layer components": { marginLeft: "-1rem" } }, ".avatar:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".badge": { "@layer components": { display: "inline-flex", alignItems: "center", justifyContent: "center", padding: "0.125rem 0.5rem", fontSize: "0.75rem", fontWeight: 500, lineHeight: "1rem", whiteSpace: "nowrap", borderRadius: "var(--radius-full)", backgroundColor: "var(--color-surface-container)", color: "var(--color-on-surface)" } }, ".badge-primary": { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)" } }, ".badge-secondary": { "@layer components": { backgroundColor: "var(--color-secondary)", color: "var(--color-secondary-content)" } }, ".badge-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary)", color: "var(--color-tertiary-content)" } }, ".badge-accent": { "@layer components": { backgroundColor: "var(--color-accent)", color: "var(--color-accent-content)" } }, ".badge-neutral": { "@layer components": { backgroundColor: "var(--color-neutral)", color: "var(--color-neutral-content)" } }, ".badge-base": { "@layer components": { backgroundColor: "var(--color-base-100)", color: "var(--color-base-content)" } }, ".badge-info": { "@layer components": { backgroundColor: "var(--color-info)", color: "var(--color-info-content)" } }, ".badge-success": { "@layer components": { backgroundColor: "var(--color-success)", color: "var(--color-success-content)" } }, ".badge-warning": { "@layer components": { backgroundColor: "var(--color-warning)", color: "var(--color-warning-content)" } }, ".badge-error": { "@layer components": { backgroundColor: "var(--color-error)", color: "var(--color-error-content)" } }, ".badge-outlined, \n .badge-outlined-secondary, \n .badge-outlined-tertiary, \n .badge-outline": { "@layer components": { backgroundColor: "transparent", border: "1px solid currentColor" } }, ".badge-outlined, \n .badge-outlined.badge-primary, \n .badge-outline.badge-primary": { "@layer components": { color: "var(--color-primary)", borderColor: "var(--color-primary)" } }, ".badge-outlined.badge-secondary, \n .badge-outlined-secondary, \n .badge-outline.badge-secondary": { "@layer components": { color: "var(--color-secondary)", borderColor: "var(--color-secondary)" } }, ".badge-outlined.badge-tertiary, \n .badge-outlined-tertiary, \n .badge-outline.badge-tertiary": { "@layer components": { color: "var(--color-tertiary)", borderColor: "var(--color-tertiary)" } }, ".badge-outlined.badge-accent, \n .badge-outline.badge-accent": { "@layer components": { color: "var(--color-accent)", borderColor: "var(--color-accent)" } }, ".badge-outlined.badge-neutral, \n .badge-outline.badge-neutral": { "@layer components": { color: "var(--color-neutral)", borderColor: "var(--color-neutral)" } }, ".badge-outlined.badge-base, \n .badge-outline.badge-base": { "@layer components": { color: "var(--color-base-content)", borderColor: "var(--color-base-content)" } }, ".badge-outlined.badge-info, \n .badge-outline.badge-info": { "@layer components": { color: "var(--color-info)", borderColor: "var(--color-info)" } }, ".badge-outlined.badge-success, \n .badge-outline.badge-success": { "@layer components": { color: "var(--color-success)", borderColor: "var(--color-success)" } }, ".badge-outlined.badge-warning, \n .badge-outline.badge-warning": { "@layer components": { color: "var(--color-warning)", borderColor: "var(--color-warning)" } }, ".badge-outlined.badge-error, \n .badge-outline.badge-error": { "@layer components": { color: "var(--color-error)", borderColor: "var(--color-error)" } }, ".badge-tonal, \n .badge-soft": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".badge-tonal.badge-primary, \n .badge-soft.badge-primary": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".badge-tonal.badge-secondary, \n .badge-tonal-secondary, \n .badge-soft.badge-secondary": { "@layer components": { backgroundColor: "var(--color-secondary-container)", color: "var(--color-on-secondary-container)" } }, ".badge-tonal.badge-tertiary, \n .badge-tonal-tertiary, \n .badge-soft.badge-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary-container)", color: "var(--color-on-tertiary-container)" } }, ".badge-tonal.badge-accent, \n .badge-soft.badge-accent": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-accent) 15%, var(--color-surface))", color: "var(--color-on-surface)" } }, ".badge-tonal.badge-neutral, \n .badge-soft.badge-neutral": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface))", color: "var(--color-on-surface)" } }, ".badge-tonal.badge-base, \n .badge-soft.badge-base": { "@layer components": { backgroundColor: "var(--color-base-200)", color: "var(--color-base-content)" } }, ".badge-tonal.badge-info, \n .badge-soft.badge-info": { "@layer components": { backgroundColor: "var(--color-info-container)", color: "var(--color-on-info-container)" } }, ".badge-tonal.badge-success, \n .badge-soft.badge-success": { "@layer components": { backgroundColor: "var(--color-success-container)", color: "var(--color-on-success-container)" } }, ".badge-tonal.badge-warning, \n .badge-soft.badge-warning": { "@layer components": { backgroundColor: "var(--color-warning-container)", color: "var(--color-on-warning-container)" } }, ".badge-tonal.badge-error, \n .badge-soft.badge-error": { "@layer components": { backgroundColor: "var(--color-error-container)", color: "var(--color-on-error-container)" } }, ".badge-sm": { "@layer components": { padding: "0 0.375rem", fontSize: "0.625rem", lineHeight: "0.875rem" } }, ".badge-lg": { "@layer components": { padding: "0.25rem 0.75rem", fontSize: "0.875rem", lineHeight: "1.25rem" } }, ".badge-indicator": { "@layer components": { position: "relative", paddingLeft: "1rem" } }, ".badge-indicator::before": { "@layer components": { content: "''", position: "absolute", left: "0.375rem", top: "50%", transform: "translateY(-50%)", width: "0.375rem", height: "0.375rem", borderRadius: "var(--radius-full)", backgroundColor: "currentColor" } }, ".badge-dot": { "@layer components": { width: "0.5rem", height: "0.5rem", padding: "0", borderRadius: "var(--radius-full)" } }, ".chat-scroll": [{ "@layer components": { "--chat-scroll-indicator-size": "0.875rem", "--chat-scroll-indicator-active-size": "1.125rem", "--chat-scroll-indicator-thickness": "0.1875rem", "--chat-scroll-indicator-gap": "0.3125rem", "--chat-scroll-indicator-hover-scale": "1.55", "--chat-scroll-indicator-neighbor-scale": "1.22", containerType: "size", containerName: "chat-scroll", display: "grid", gridTemplateColumns: "auto minmax(0, 1fr)", columnGap: "0.75rem", alignItems: "start", minHeight: "0", overflowX: "hidden", overflowY: "auto", scrollBehavior: "smooth", overscrollBehaviorY: "contain", timelineScope: `--chat-1,
151
+ --chat-2,
152
+ --chat-3,
153
+ --chat-4,
154
+ --chat-5,
155
+ --chat-6,
156
+ --chat-7,
157
+ --chat-8,
158
+ --chat-9,
159
+ --chat-10,
160
+ --chat-11,
161
+ --chat-12,
162
+ --chat-13,
163
+ --chat-14,
164
+ --chat-15,
165
+ --chat-16,
166
+ --chat-17,
167
+ --chat-18,
168
+ --chat-19,
169
+ --chat-20,
170
+ --chat-21,
171
+ --chat-22,
172
+ --chat-23,
173
+ --chat-24` } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { scrollBehavior: "auto" } } }], ".chat-scroll-track": { "@layer components": { position: "sticky", top: "0", zIndex: 1, display: "flex", flexDirection: "column", justifyContent: "center", alignItems: "center", gap: "var(--chat-scroll-indicator-gap)", width: `calc(
174
+ var(--chat-scroll-indicator-active-size) * var(--chat-scroll-indicator-hover-scale)
175
+ )`, height: "100cqh", margin: "0", padding: "0.75rem 0", overflow: "visible", listStyle: "none", pointerEvents: "none" } }, ".chat-scroll-body": { "@layer components": { display: "flex", flexDirection: "column", minWidth: "0" } }, ".chat-scroll-indicator": [{ "@layer components": { display: "block", flexShrink: 0, width: "var(--chat-scroll-indicator-size)", height: "var(--chat-scroll-indicator-thickness)", border: "0", borderRadius: "999px", padding: "0", appearance: "none", backgroundColor: "color-mix(in oklch, var(--color-on-surface) 28%, transparent)", color: "inherit", font: "inherit", opacity: 0.45, pointerEvents: "auto", textDecoration: "none", cursor: "pointer", transform: "scaleX(1)", transformOrigin: "center", transition: `transform 140ms ease,
176
+ opacity 140ms ease,
177
+ background-color 140ms ease` } }, { "@layer components": { "@supports (animation-timeline: --chat-1)": { animationName: "chat-scroll-indicator-activate", animationDuration: "1ms", animationTimingFunction: "linear", animationFillMode: "both", animationRange: "entry 0% exit 100%" } } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { animation: "none", transition: "none" } } }], ".chat-scroll-indicator:hover, \n .chat-scroll-indicator:focus-visible": { "@layer components": { transform: "scaleX(var(--chat-scroll-indicator-hover-scale)) scaleY(1.35)", backgroundColor: "var(--color-on-surface)", opacity: 1 } }, ".chat-scroll-indicator:hover + .chat-scroll-indicator, \n .chat-scroll-indicator:has(+ .chat-scroll-indicator:hover)": { "@layer components": { transform: "scaleX(var(--chat-scroll-indicator-neighbor-scale)) scaleY(1.15)", backgroundColor: "color-mix(in oklch, var(--color-on-surface) 55%, transparent)", opacity: 0.75 } }, ".chat[data-chat-tl]": { "@layer components": { scrollMarginBlockStart: "0.5rem" } }, ".chat-scroll-indicator:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-primary) 20%, transparent)" } }, '.chat[data-chat-tl="1"]': { "@layer components": { viewTimelineName: "--chat-1", viewTimelineAxis: "block" } }, '.chat[data-chat-tl="2"]': { "@layer components": { viewTimelineName: "--chat-2", viewTimelineAxis: "block" } }, '.chat[data-chat-tl="3"]': { "@layer components": { viewTimelineName: "--chat-3", viewTimelineAxis: "block" } }, '.chat[data-chat-tl="4"]': { "@layer components": { viewTimelineName: "--chat-4", viewTimelineAxis: "block" } }, '.chat[data-chat-tl="5"]': { "@layer components": { viewTimelineName: "--chat-5", viewTimelineAxis: "block" } }, '.chat[data-chat-tl="6"]': { "@layer components": { viewTimelineName: "--chat-6", viewTimelineAxis: "block" } }, '.chat[data-chat-tl="7"]': { "@layer components": { viewTimelineName: "--chat-7", viewTimelineAxis: "block" } }, '.chat[data-chat-tl="8"]': { "@layer components": { viewTimelineName: "--chat-8", viewTimelineAxis: "block" } }, '.chat[data-chat-tl="9"]': { "@layer components": { viewTimelineName: "--chat-9", viewTimelineAxis: "block" } }, '.chat[data-chat-tl="10"]': { "@layer components": { viewTimelineName: "--chat-10", viewTimelineAxis: "block" } }, '.chat[data-chat-tl="11"]': { "@layer components": { viewTimelineName: "--chat-11", viewTimelineAxis: "block" } }, '.chat[data-chat-tl="12"]': { "@layer components": { viewTimelineName: "--chat-12", viewTimelineAxis: "block" } }, '.chat[data-chat-tl="13"]': { "@layer components": { viewTimelineName: "--chat-13", viewTimelineAxis: "block" } }, '.chat[data-chat-tl="14"]': { "@layer components": { viewTimelineName: "--chat-14", viewTimelineAxis: "block" } }, '.chat[data-chat-tl="15"]': { "@layer components": { viewTimelineName: "--chat-15", viewTimelineAxis: "block" } }, '.chat[data-chat-tl="16"]': { "@layer components": { viewTimelineName: "--chat-16", viewTimelineAxis: "block" } }, '.chat[data-chat-tl="17"]': { "@layer components": { viewTimelineName: "--chat-17", viewTimelineAxis: "block" } }, '.chat[data-chat-tl="18"]': { "@layer components": { viewTimelineName: "--chat-18", viewTimelineAxis: "block" } }, '.chat[data-chat-tl="19"]': { "@layer components": { viewTimelineName: "--chat-19", viewTimelineAxis: "block" } }, '.chat[data-chat-tl="20"]': { "@layer components": { viewTimelineName: "--chat-20", viewTimelineAxis: "block" } }, '.chat[data-chat-tl="21"]': { "@layer components": { viewTimelineName: "--chat-21", viewTimelineAxis: "block" } }, '.chat[data-chat-tl="22"]': { "@layer components": { viewTimelineName: "--chat-22", viewTimelineAxis: "block" } }, '.chat[data-chat-tl="23"]': { "@layer components": { viewTimelineName: "--chat-23", viewTimelineAxis: "block" } }, '.chat[data-chat-tl="24"]': { "@layer components": { viewTimelineName: "--chat-24", viewTimelineAxis: "block" } }, '.chat-scroll-indicator[data-chat-tl="1"]': { "@layer components": { animationTimeline: "--chat-1" } }, '.chat-scroll-indicator[data-chat-tl="2"]': { "@layer components": { animationTimeline: "--chat-2" } }, '.chat-scroll-indicator[data-chat-tl="3"]': { "@layer components": { animationTimeline: "--chat-3" } }, '.chat-scroll-indicator[data-chat-tl="4"]': { "@layer components": { animationTimeline: "--chat-4" } }, '.chat-scroll-indicator[data-chat-tl="5"]': { "@layer components": { animationTimeline: "--chat-5" } }, '.chat-scroll-indicator[data-chat-tl="6"]': { "@layer components": { animationTimeline: "--chat-6" } }, '.chat-scroll-indicator[data-chat-tl="7"]': { "@layer components": { animationTimeline: "--chat-7" } }, '.chat-scroll-indicator[data-chat-tl="8"]': { "@layer components": { animationTimeline: "--chat-8" } }, '.chat-scroll-indicator[data-chat-tl="9"]': { "@layer components": { animationTimeline: "--chat-9" } }, '.chat-scroll-indicator[data-chat-tl="10"]': { "@layer components": { animationTimeline: "--chat-10" } }, '.chat-scroll-indicator[data-chat-tl="11"]': { "@layer components": { animationTimeline: "--chat-11" } }, '.chat-scroll-indicator[data-chat-tl="12"]': { "@layer components": { animationTimeline: "--chat-12" } }, '.chat-scroll-indicator[data-chat-tl="13"]': { "@layer components": { animationTimeline: "--chat-13" } }, '.chat-scroll-indicator[data-chat-tl="14"]': { "@layer components": { animationTimeline: "--chat-14" } }, '.chat-scroll-indicator[data-chat-tl="15"]': { "@layer components": { animationTimeline: "--chat-15" } }, '.chat-scroll-indicator[data-chat-tl="16"]': { "@layer components": { animationTimeline: "--chat-16" } }, '.chat-scroll-indicator[data-chat-tl="17"]': { "@layer components": { animationTimeline: "--chat-17" } }, '.chat-scroll-indicator[data-chat-tl="18"]': { "@layer components": { animationTimeline: "--chat-18" } }, '.chat-scroll-indicator[data-chat-tl="19"]': { "@layer components": { animationTimeline: "--chat-19" } }, '.chat-scroll-indicator[data-chat-tl="20"]': { "@layer components": { animationTimeline: "--chat-20" } }, '.chat-scroll-indicator[data-chat-tl="21"]': { "@layer components": { animationTimeline: "--chat-21" } }, '.chat-scroll-indicator[data-chat-tl="22"]': { "@layer components": { animationTimeline: "--chat-22" } }, '.chat-scroll-indicator[data-chat-tl="23"]': { "@layer components": { animationTimeline: "--chat-23" } }, '.chat-scroll-indicator[data-chat-tl="24"]': { "@layer components": { animationTimeline: "--chat-24" } }, "@keyframes chat-scroll-indicator-activate": { "0%,\n 100%": { width: "var(--chat-scroll-indicator-size)", backgroundColor: "color-mix(in oklch, var(--color-on-surface) 28%, transparent)", opacity: 0.45 }, "35%,\n 65%": { width: "var(--chat-scroll-indicator-active-size)", backgroundColor: "var(--color-on-surface)", opacity: 1 } }, ".chat": { "@layer components": { display: "grid", gridTemplateColumns: "auto minmax(0, 1fr)", columnGap: "0.75rem", alignItems: "end", padding: "0.25rem 0" } }, ".chat-start": { "@layer components": { gridTemplateColumns: "auto minmax(0, 1fr)" } }, ".chat-end": { "@layer components": { gridTemplateColumns: "minmax(0, 1fr) auto" } }, ".chat-avatar": { "@layer components": { gridRow: "1 / span 999", gridColumn: "1", alignSelf: "start", justifySelf: "start" } }, ".chat-end .chat-avatar": { "@layer components": { gridColumn: "2", justifySelf: "end" } }, ".chat > :not(.chat-avatar)": { "@layer components": { gridColumn: "2", justifySelf: "start", maxWidth: "100%", marginBottom: "0.25rem" } }, ".chat-end > :not(.chat-avatar)": { "@layer components": { gridColumn: "1", justifySelf: "end" } }, ".chat-header, \n .chat-footer": { "@layer components": { color: "var(--color-on-surface-variant)", fontSize: "0.75rem", lineHeight: "1rem" } }, ".chat-header": { "@layer components": { marginBottom: "0.125rem" } }, ".chat-footer": { "@layer components": { marginTop: "0.125rem", marginBottom: "0" } }, ".chat-bubble": { "@layer components": { "--chat-bubble-bg": "var(--color-surface-container-highest)", "--chat-bubble-fg": "var(--color-on-surface)", position: "relative", display: "flex", flexDirection: "column", alignItems: "stretch", gap: "0.5rem", maxWidth: "min(80ch, 100%)", padding: "0.625rem 0.875rem", borderRadius: "1rem", backgroundColor: "var(--chat-bubble-bg)", color: "var(--chat-bubble-fg)", boxShadow: "inset 0 0 0 1px var(--color-outline-variant)", fontSize: "0.875rem", lineHeight: 1.45, overflowWrap: "anywhere", wordBreak: "break-word" } }, ".chat-bubble-content": { "@layer components": { minWidth: "0" } }, ".chat-start .chat-bubble::before, \n .chat-end .chat-bubble::before": { "@layer components": { content: '""', position: "absolute", top: "0", width: "calc(1rem - 2px)", height: "calc(1rem - 2px)", backgroundColor: "var(--chat-bubble-bg)", clipPath: "polygon(0 0, 100% 0, 100% 100%)", filter: `drop-shadow(-1px 0 0 var(--color-outline-variant))
178
+ drop-shadow(0 -1px 0 var(--color-outline-variant))`, pointerEvents: "none" } }, ".chat-start .chat-bubble::before": { "@layer components": { left: "-0.5rem" } }, ".chat-start .chat-bubble": { "@layer components": { borderTopLeftRadius: "0" } }, ".chat-end .chat-bubble::before": { "@layer components": { right: "-0.5rem", transform: "scaleX(-1)" } }, ".chat-end .chat-bubble": { "@layer components": { borderTopRightRadius: "0" } }, ".chat-bubble-primary": { "@layer components": { "--chat-bubble-bg": "var(--color-primary-container)", "--chat-bubble-fg": "var(--color-on-primary-container)" } }, ".chat-bubble-secondary": { "@layer components": { "--chat-bubble-bg": "var(--color-secondary-container)", "--chat-bubble-fg": "var(--color-on-secondary-container)" } }, ".chat-bubble-tertiary": { "@layer components": { "--chat-bubble-bg": "var(--color-tertiary-container)", "--chat-bubble-fg": "var(--color-on-tertiary-container)" } }, ".chat-bubble-info": { "@layer components": { "--chat-bubble-bg": "var(--color-info-container)", "--chat-bubble-fg": "var(--color-on-info-container)" } }, ".chat-bubble-success": { "@layer components": { "--chat-bubble-bg": "var(--color-success-container)", "--chat-bubble-fg": "var(--color-on-success-container)" } }, ".chat-bubble-warning": { "@layer components": { "--chat-bubble-bg": "var(--color-warning-container)", "--chat-bubble-fg": "var(--color-on-warning-container)" } }, ".chat-bubble-error": { "@layer components": { "--chat-bubble-bg": "var(--color-error-container)", "--chat-bubble-fg": "var(--color-on-error-container)" } }, ".chat-bubble-accent": { "@layer components": { "--chat-bubble-bg": "color-mix(in oklch, var(--color-accent) 15%, var(--color-surface))", "--chat-bubble-fg": "var(--color-on-surface)" } }, ".chat-bubble-neutral": { "@layer components": { "--chat-bubble-bg": "color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface))", "--chat-bubble-fg": "var(--color-on-surface)" } }, ".chat-bubble-base": { "@layer components": { "--chat-bubble-bg": "var(--color-base-200)", "--chat-bubble-fg": "var(--color-base-content)" } }, ".chat-bubble-filled.chat-bubble-primary": { "@layer components": { "--chat-bubble-bg": "var(--color-primary)", "--chat-bubble-fg": "var(--color-primary-content)" } }, ".chat-bubble-filled.chat-bubble-secondary": { "@layer components": { "--chat-bubble-bg": "var(--color-secondary)", "--chat-bubble-fg": "var(--color-secondary-content)" } }, ".chat-bubble-filled.chat-bubble-tertiary": { "@layer components": { "--chat-bubble-bg": "var(--color-tertiary)", "--chat-bubble-fg": "var(--color-tertiary-content)" } }, ".chat-bubble-filled.chat-bubble-info": { "@layer components": { "--chat-bubble-bg": "var(--color-info)", "--chat-bubble-fg": "var(--color-info-content)" } }, ".chat-bubble-filled.chat-bubble-success": { "@layer components": { "--chat-bubble-bg": "var(--color-success)", "--chat-bubble-fg": "var(--color-success-content)" } }, ".chat-bubble-filled.chat-bubble-warning": { "@layer components": { "--chat-bubble-bg": "var(--color-warning)", "--chat-bubble-fg": "var(--color-warning-content)" } }, ".chat-bubble-filled.chat-bubble-error": { "@layer components": { "--chat-bubble-bg": "var(--color-error)", "--chat-bubble-fg": "var(--color-error-content)" } }, ".chat-bubble-filled.chat-bubble-accent": { "@layer components": { "--chat-bubble-bg": "var(--color-accent)", "--chat-bubble-fg": "var(--color-accent-content)" } }, ".chat-bubble-filled.chat-bubble-neutral": { "@layer components": { "--chat-bubble-bg": "var(--color-neutral)", "--chat-bubble-fg": "var(--color-neutral-content)" } }, ".chat-bubble-filled.chat-bubble-base": { "@layer components": { "--chat-bubble-bg": "var(--color-base-100)", "--chat-bubble-fg": "var(--color-base-content)" } }, ".chat-bubble-xs": { "@layer components": { padding: "0.375rem 0.625rem", fontSize: "0.75rem" } }, ".chat-bubble-sm": { "@layer components": { padding: "0.5rem 0.75rem", fontSize: "0.8125rem" } }, ".chat-bubble-md": { "@layer components": { padding: "0.625rem 0.875rem", fontSize: "0.875rem" } }, ".chat-bubble-lg": { "@layer components": { padding: "0.875rem 1.125rem", fontSize: "1rem" } }, ".chat-reasoning, \n .chat-tool": { "@layer components": { width: "min(80ch, 100%)", border: "1px solid var(--color-outline)", borderRadius: "var(--radius-sm)", backgroundColor: "var(--color-surface-container-low)", color: "var(--color-on-surface)", fontSize: "0.8125rem", lineHeight: 1.45, overflow: "hidden" } }, ".chat-bubble > .chat-reasoning, \n .chat-bubble > .chat-tool, \n .chat-reasoning .chat-tool, \n .chat-reasoning-body > .chat-tool": { "@layer components": { width: "100%", maxWidth: "none" } }, ".chat-reasoning > summary, \n .chat-tool > summary": { "@layer components": { cursor: "pointer", listStylePosition: "inside" } }, ".chat-reasoning > summary": { "@layer components": { padding: "0.5rem 0.75rem", color: "var(--color-on-surface-variant)", fontWeight: 500 } }, ".chat-reasoning-body": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.5rem", padding: "0 0.75rem 0.75rem", color: "var(--color-on-surface-variant)" } }, ".chat-reasoning-body > :not(.chat-tool)": { "@layer components": { fontStyle: "italic" } }, ".chat-reasoning > div:not(.chat-tool):not(.chat-reasoning-body)": { "@layer components": { padding: "0 0.75rem 0.75rem", color: "var(--color-on-surface-variant)", fontStyle: "italic" } }, ".chat-reasoning > .chat-tool": { "@layer components": { margin: "0 0.75rem 0.75rem" } }, ".chat-tool-header": { "@layer components": { display: "flex", alignItems: "center", gap: "0.5rem", padding: "0.5rem 0.75rem", color: "var(--color-on-surface)", fontFamily: 'ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace', fontSize: "0.75rem", fontWeight: 600 } }, ".chat-tool-status": { "@layer components": { display: "inline-flex", alignItems: "center", minHeight: "1.25rem", padding: "0.125rem 0.5rem", borderRadius: "999px", marginLeft: "auto", fontFamily: "inherit", fontSize: "0.6875rem", fontWeight: 600, lineHeight: 1 } }, ".chat-tool-call, \n .chat-tool-result": { "@layer components": { padding: "0.75rem", borderTop: "1px solid var(--color-outline)", fontFamily: 'ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace', fontSize: "0.75rem", overflowX: "auto" } }, ".chat-tool-result": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-surface-container) 65%, transparent)" } }, ".chat-tool-pending .chat-tool-status": { "@layer components": { border: "1px solid var(--color-outline)", color: "var(--color-on-surface-variant)" } }, ".chat-tool-running .chat-tool-status": { "@layer components": { backgroundColor: "var(--color-info-container)", color: "var(--color-on-info-container)" } }, ".chat-tool-running .chat-tool-header::before": { "@layer components": { content: '""', width: "0.875rem", height: "0.875rem", border: "2px solid currentColor", borderTopColor: "transparent", borderRadius: "999px", animation: "chat-tool-spin 800ms linear infinite" } }, ".chat-tool-success .chat-tool-status": { "@layer components": { backgroundColor: "var(--color-success-container)", color: "var(--color-on-success-container)" } }, ".chat-tool-error .chat-tool-status": { "@layer components": { backgroundColor: "var(--color-error-container)", color: "var(--color-on-error-container)" } }, ".chat-typing": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.25rem", minWidth: "2.25rem" } }, ".chat-typing::before, \n .chat-typing::after, \n .chat-typing span": { "@layer components": { content: '""', width: "0.375rem", height: "0.375rem", borderRadius: "999px", backgroundColor: "currentColor", opacity: 0.55, animation: "chat-typing-dot 1.4s ease-in-out infinite" } }, ".chat-typing span": { "@layer components": { animationDelay: "150ms" } }, ".chat-typing::after": { "@layer components": { animationDelay: "300ms" } }, ".chat-bubble-streaming::after, \n .chat-bubble-content.chat-bubble-streaming::after": { "@layer components": { content: '""', position: "static", inset: "auto", display: "inline-block", width: "1px", height: "1em", marginLeft: "0.25rem", backgroundColor: "currentColor", clipPath: "none", transform: "none", verticalAlign: "-0.125em", animation: "chat-stream-caret 1s step-end infinite" } }, ".chat-bubble.chat-bubble-streaming:not(:has(.chat-reasoning, .chat-tool, .chat-bubble-content))": { "@layer components": { display: "block" } }, ".chat-bubble.chat-bubble-streaming:has(.chat-reasoning, .chat-tool, .chat-bubble-content)::after": { "@layer components": { content: "none" } }, ".chat-reasoning > summary:focus-visible, \n .chat-tool > summary:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, "@keyframes chat-typing-dot": { "0%,\n 80%,\n 100%": { opacity: 0.45, transform: "translateY(0)" }, "40%": { opacity: 1, transform: "translateY(-0.1875rem)" } }, "@keyframes chat-stream-caret": { "0%,\n 49%": { opacity: 1 }, "50%,\n 100%": { opacity: 0 } }, "@keyframes chat-tool-spin": { to: { transform: "rotate(360deg)" } }, ".chat-typing::before, \n .chat-typing::after, \n .chat-typing span, \n .chat-bubble-streaming::after, \n .chat-bubble-content.chat-bubble-streaming::after, \n .chat-tool-running .chat-tool-header::before": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { animation: "none" } } }, ".chat-bubble-streaming::after, \n .chat-bubble-content.chat-bubble-streaming::after": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { opacity: 1 } } }, ".chip": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.375rem", padding: "0.375rem 0.75rem", fontSize: "0.875rem", fontWeight: 500, lineHeight: "1.25rem", borderRadius: "var(--radius-sm)", backgroundColor: "var(--color-surface-container)", color: "var(--color-on-surface)", border: "1px solid currentColor", cursor: "default", transition: "all 150ms ease-in-out" } }, ".chip-clickable": { "@layer components": { cursor: "pointer" } }, ".chip-clickable:hover": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".chip-clickable:active": { "@layer components": { transform: "scale(0.98)" } }, ".chip:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".chip-primary": { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)", borderColor: "var(--color-primary)" } }, ".chip-primary:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-primary), black 10%)" } }, ".chip-secondary": { "@layer components": { backgroundColor: "var(--color-secondary)", color: "var(--color-secondary-content)", borderColor: "var(--color-secondary)" } }, ".chip-secondary:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-secondary), black 10%)" } }, ".chip-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary)", color: "var(--color-tertiary-content)", borderColor: "var(--color-tertiary)" } }, ".chip-tertiary:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-tertiary), black 10%)" } }, ".chip-accent": { "@layer components": { backgroundColor: "var(--color-accent)", color: "var(--color-accent-content)", borderColor: "var(--color-accent)" } }, ".chip-accent:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-accent), black 10%)" } }, ".chip-neutral": { "@layer components": { backgroundColor: "var(--color-neutral)", color: "var(--color-neutral-content)", borderColor: "var(--color-neutral)" } }, ".chip-neutral:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-neutral), black 10%)" } }, ".chip-base": { "@layer components": { backgroundColor: "var(--color-base-100)", color: "var(--color-base-content)", borderColor: "var(--color-base-100)" } }, ".chip-base:hover": { "@layer components": { backgroundColor: "var(--color-base-200)" } }, ".chip-info": { "@layer components": { backgroundColor: "var(--color-info)", color: "var(--color-info-content)", borderColor: "var(--color-info)" } }, ".chip-info:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-info), black 10%)" } }, ".chip-success": { "@layer components": { backgroundColor: "var(--color-success)", color: "var(--color-success-content)", borderColor: "var(--color-success)" } }, ".chip-success:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-success), black 10%)" } }, ".chip-warning": { "@layer components": { backgroundColor: "var(--color-warning)", color: "var(--color-warning-content)", borderColor: "var(--color-warning)" } }, ".chip-warning:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-warning), black 10%)" } }, ".chip-error": { "@layer components": { backgroundColor: "var(--color-error)", color: "var(--color-error-content)", borderColor: "var(--color-error)" } }, ".chip-error:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-error), black 10%)" } }, ".chip-outlined": { "@layer components": { backgroundColor: "transparent", borderColor: "var(--color-outline)" } }, ".chip-outlined:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".chip-outlined.chip-primary": { "@layer components": { color: "var(--color-primary)" } }, ".chip-outlined.chip-primary:hover": { "@layer components": { backgroundColor: "var(--color-primary-container)" } }, ".chip-outlined.chip-secondary": { "@layer components": { color: "var(--color-secondary)" } }, ".chip-outlined.chip-secondary:hover": { "@layer components": { backgroundColor: "var(--color-secondary-container)" } }, ".chip-outlined.chip-tertiary": { "@layer components": { color: "var(--color-tertiary)" } }, ".chip-outlined.chip-tertiary:hover": { "@layer components": { backgroundColor: "var(--color-tertiary-container)" } }, ".chip-outlined.chip-accent": { "@layer components": { color: "var(--color-accent)" } }, ".chip-outlined.chip-accent:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-accent) 15%, var(--color-surface))" } }, ".chip-outlined.chip-neutral": { "@layer components": { color: "var(--color-neutral)" } }, ".chip-outlined.chip-neutral:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface))" } }, ".chip-outlined.chip-base": { "@layer components": { color: "var(--color-base-content)" } }, ".chip-outlined.chip-base:hover": { "@layer components": { backgroundColor: "var(--color-base-200)" } }, ".chip-outlined.chip-info": { "@layer components": { color: "var(--color-info)" } }, ".chip-outlined.chip-info:hover": { "@layer components": { backgroundColor: "var(--color-info-container)" } }, ".chip-outlined.chip-success": { "@layer components": { color: "var(--color-success)" } }, ".chip-outlined.chip-success:hover": { "@layer components": { backgroundColor: "var(--color-success-container)" } }, ".chip-outlined.chip-warning": { "@layer components": { color: "var(--color-warning)" } }, ".chip-outlined.chip-warning:hover": { "@layer components": { backgroundColor: "var(--color-warning-container)" } }, ".chip-outlined.chip-error": { "@layer components": { color: "var(--color-error)" } }, ".chip-outlined.chip-error:hover": { "@layer components": { backgroundColor: "var(--color-error-container)" } }, ".chip-tonal": { "@layer components": { backgroundColor: "var(--color-surface-container-high)", borderColor: "transparent" } }, ".chip-tonal.chip-primary": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".chip-tonal.chip-secondary": { "@layer components": { backgroundColor: "var(--color-secondary-container)", color: "var(--color-on-secondary-container)" } }, ".chip-tonal.chip-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary-container)", color: "var(--color-on-tertiary-container)" } }, ".chip-tonal.chip-accent": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-accent) 15%, var(--color-surface))", color: "var(--color-on-surface)" } }, ".chip-tonal.chip-neutral": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface))", color: "var(--color-on-surface)" } }, ".chip-tonal.chip-base": { "@layer components": { backgroundColor: "var(--color-base-200)", color: "var(--color-base-content)" } }, ".chip-tonal.chip-info": { "@layer components": { backgroundColor: "var(--color-info-container)", color: "var(--color-on-info-container)" } }, ".chip-tonal.chip-success": { "@layer components": { backgroundColor: "var(--color-success-container)", color: "var(--color-on-success-container)" } }, ".chip-tonal.chip-warning": { "@layer components": { backgroundColor: "var(--color-warning-container)", color: "var(--color-on-warning-container)" } }, ".chip-tonal.chip-error": { "@layer components": { backgroundColor: "var(--color-error-container)", color: "var(--color-on-error-container)" } }, ".chip-ghost": { "@layer components": { backgroundColor: "transparent", borderColor: "transparent" } }, ".chip-ghost:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".chip-ghost.chip-primary": { "@layer components": { backgroundColor: "transparent", color: "var(--color-primary)" } }, ".chip-ghost.chip-secondary": { "@layer components": { backgroundColor: "transparent", color: "var(--color-secondary)" } }, ".chip-ghost.chip-tertiary": { "@layer components": { backgroundColor: "transparent", color: "var(--color-tertiary)" } }, ".chip-ghost.chip-info": { "@layer components": { backgroundColor: "transparent", color: "var(--color-info)" } }, ".chip-ghost.chip-success": { "@layer components": { backgroundColor: "transparent", color: "var(--color-success)" } }, ".chip-ghost.chip-warning": { "@layer components": { backgroundColor: "transparent", color: "var(--color-warning)" } }, ".chip-ghost.chip-error": { "@layer components": { backgroundColor: "transparent", color: "var(--color-error)" } }, ".chip-ghost.chip-accent": { "@layer components": { backgroundColor: "transparent", color: "var(--color-accent)" } }, ".chip-ghost.chip-neutral": { "@layer components": { backgroundColor: "transparent", color: "var(--color-neutral)" } }, ".chip-ghost.chip-base": { "@layer components": { backgroundColor: "transparent", color: "var(--color-base-content)" } }, ".chip-ghost.chip-primary:hover": { "@layer components": { backgroundColor: "var(--color-primary-container)" } }, ".chip-ghost.chip-secondary:hover": { "@layer components": { backgroundColor: "var(--color-secondary-container)" } }, ".chip-ghost.chip-tertiary:hover": { "@layer components": { backgroundColor: "var(--color-tertiary-container)" } }, ".chip-ghost.chip-info:hover": { "@layer components": { backgroundColor: "var(--color-info-container)" } }, ".chip-ghost.chip-success:hover": { "@layer components": { backgroundColor: "var(--color-success-container)" } }, ".chip-ghost.chip-warning:hover": { "@layer components": { backgroundColor: "var(--color-warning-container)" } }, ".chip-ghost.chip-error:hover": { "@layer components": { backgroundColor: "var(--color-error-container)" } }, ".chip-ghost.chip-accent:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-accent) 15%, var(--color-surface))" } }, ".chip-ghost.chip-neutral:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface))" } }, ".chip-ghost.chip-base:hover": { "@layer components": { backgroundColor: "var(--color-base-200)" } }, ".chip-sm": { "@layer components": { padding: "0.25rem 0.5rem", fontSize: "0.75rem", lineHeight: "1rem", gap: "0.25rem" } }, ".chip-lg": { "@layer components": { padding: "0.5rem 1rem", fontSize: "1rem", lineHeight: "1.5rem", gap: "0.5rem" } }, ".chip-icon": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.125rem", height: "1.125rem", fontSize: "1rem" } }, ".chip-label": { "@layer components": { display: "inline-flex" } }, ".chip-close": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.125rem", height: "1.125rem", marginLeft: "0.125rem", fontSize: "1rem", color: "currentColor", opacity: 0.7, backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", transition: "opacity 150ms ease-in-out" } }, ".chip-close:hover": { "@layer components": { opacity: 1 } }, ".chip-selected": { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)", borderColor: "var(--color-primary)" } }, ".chip-selected.chip-outlined": { "@layer components": { backgroundColor: "var(--color-primary)", borderColor: "var(--color-primary)", color: "var(--color-primary-content)" } }, ".chip:disabled, \n .chip-disabled": { "@layer components": { opacity: 0.7, pointerEvents: "none", cursor: "not-allowed" } }, ".chip-group": { "@layer components": { display: "flex", flexWrap: "wrap", gap: "0.5rem" } }, ".chip, \n .chip-delete": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".list": { "@layer components": { display: "flex", flexDirection: "column", margin: "0", padding: "0.5rem 0", listStyle: "none" } }, ".list-item": [{ "@layer components": { display: "flex", alignItems: "center", gap: "1rem", padding: "0.75rem 1rem", color: "var(--color-on-surface)", textDecoration: "none", transition: "background-color 150ms ease-in-out" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }], "a.list-item, \n button.list-item, \n .list-item-clickable": { "@layer components": { cursor: "pointer" } }, "a.list-item:hover, \n button.list-item:hover, \n .list-item-clickable:hover, \n .list-hoverable .list-item:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".list-item:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)", backgroundColor: "var(--color-surface-container)" } }, ".list-item-icon": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.5rem", height: "1.5rem", fontSize: "1.25rem", color: "var(--color-on-surface-variant)", flexShrink: 0 } }, ".list-item-content": { "@layer components": { display: "flex", flexDirection: "column", flex: 1, minWidth: "0" } }, ".list-item-title": { "@layer components": { fontSize: "1rem", fontWeight: 500, lineHeight: "1.5rem", color: "var(--color-on-surface)" } }, ".list-item-subtitle": { "@layer components": { fontSize: "0.875rem", lineHeight: "1.25rem", color: "var(--color-on-surface-variant)" } }, ".list-item-action": { "@layer components": { display: "flex", alignItems: "center", gap: "0.5rem", flexShrink: 0, color: "var(--color-on-surface-variant)" } }, ".list-bordered": { "@layer components": { border: "1px solid var(--color-outline)", borderRadius: "var(--radius-sm)", padding: "0" } }, ".list-bordered .list-item": { "@layer components": { borderBottom: "1px solid var(--color-outline)" } }, ".list-bordered .list-item:last-child": { "@layer components": { borderBottom: "none" } }, ".list-compact .list-item": { "@layer components": { padding: "0.5rem 1rem" } }, ".list-compact .list-item-title": { "@layer components": { fontSize: "0.875rem" } }, ".list-compact .list-item-subtitle": { "@layer components": { fontSize: "0.75rem" } }, ".list-divider": { "@layer components": { height: "1px", margin: "0.5rem 0", backgroundColor: "var(--color-outline-variant)" } }, ".list-divider-inset": { "@layer components": { marginLeft: "3.5rem" } }, ".list-subheader": { "@layer components": { padding: "0.75rem 1rem", fontSize: "0.75rem", fontWeight: 600, textTransform: "uppercase", letterSpacing: "0.05em", color: "var(--color-on-surface-variant)" } }, ".list-item-active, \n .list-item.active": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".list-item-active .list-item-icon, \n .list-item.active .list-item-icon": { "@layer components": { color: "var(--color-on-primary-container)" } }, ".list-item:disabled, \n .list-item-disabled": { "@layer components": { opacity: 0.7, pointerEvents: "none", cursor: "not-allowed" } }, ".list-dense .list-item": { "@layer components": { padding: "0.375rem 1rem" } }, ".list-dense .list-item-icon": { "@layer components": { width: "1.25rem", height: "1.25rem", fontSize: "1rem" } }, ".list-two-line .list-item": { "@layer components": { padding: "0.5rem 1rem" } }, ".list-three-line .list-item": { "@layer components": { alignItems: "flex-start", padding: "0.75rem 1rem" } }, ".list-three-line .list-item-content": { "@layer components": { gap: "0.25rem" } }, ".table": { "@layer components": { width: "100%", borderCollapse: "collapse", borderSpacing: "0", fontSize: "0.875rem", color: "var(--color-on-surface)" } }, ".table-surface": { "@layer components": { backgroundColor: "var(--color-surface)" } }, ".table thead, \n .table-header": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".table th, \n .table-header-cell": { "@layer components": { padding: "0.75rem 1rem", fontWeight: 600, textAlign: "left", color: "var(--color-on-surface)", borderBottom: "2px solid var(--color-outline)" } }, ".table tbody, \n .table-body": { "@layer components": { backgroundColor: "var(--color-surface)" } }, ".table td, \n .table-cell": { "@layer components": { padding: "0.75rem 1rem", borderBottom: "1px solid var(--color-outline-variant)", verticalAlign: "middle" } }, ".table tr:last-child td, \n .table-row:last-child .table-cell": { "@layer components": { borderBottom: "none" } }, ".table tfoot, \n .table-footer": { "@layer components": { backgroundColor: "var(--color-surface-container)", fontWeight: 500 } }, ".table tfoot td": { "@layer components": { borderTop: "2px solid var(--color-outline)", borderBottom: "none" } }, ".table-zebra tbody tr:nth-child(even), \n .table-zebra .table-row:nth-child(even), \n .table-striped tbody tr:nth-child(even), \n .table-striped .table-row:nth-child(even)": { "@layer components": { backgroundColor: "var(--color-surface-container-low)" } }, ".table-hover tbody tr:hover, \n .table-hover .table-row:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".table-bordered": { "@layer components": { border: "1px solid var(--color-outline)", borderRadius: "var(--radius-sm)", overflow: "hidden" } }, ".table-bordered th, \n .table-bordered td": { "@layer components": { border: "1px solid var(--color-outline-variant)" } }, ".table-borderless, \n .table-borderless th, \n .table-borderless td, \n .table-borderless tfoot td, \n .table-borderless .table-header-cell, \n .table-borderless .table-cell": { "@layer components": { border: "none" } }, ".table-compact th, \n .table-compact td": { "@layer components": { padding: "0.5rem 0.75rem", fontSize: "0.8125rem" } }, ".table-comfortable th, \n .table-comfortable td": { "@layer components": { padding: "1rem 1.25rem" } }, ".table-fixed": { "@layer components": { tableLayout: "fixed" } }, ".table-sticky thead, \n .table-sticky .table-header": { "@layer components": { position: "sticky", top: "0", zIndex: 10, backgroundColor: "var(--color-surface-container)", boxShadow: "var(--shadow-xs)" } }, ".table-sortable th": { "@layer components": { cursor: "pointer", userSelect: "none" } }, ".table-sortable th:hover": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".table-sort-asc::after": { "@layer components": { content: "' ↑'", opacity: 0.7 } }, ".table-sort-desc::after": { "@layer components": { content: "' ↓'", opacity: 0.7 } }, ".table-selectable tbody tr, \n .table-selectable .table-row": { "@layer components": { cursor: "pointer" } }, ".table-selectable tbody tr:hover, \n .table-selectable .table-row:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-on-surface) 8%, transparent)" } }, ".table-row-selected, \n .table tr.selected, \n .table-selectable tbody tr.table-row-selected, \n .table-selectable .table-row.table-row-selected, \n .table-selectable tbody tr.selected, \n .table-selectable .table-row.selected": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".table-row-clickable, \n .table tbody tr[data-href]": { "@layer components": { cursor: "pointer" } }, ".table-responsive": { "@layer components": { display: "block", width: "100%", overflowX: "auto", WebkitOverflowScrolling: "touch" } }, ".table-responsive .table": { "@layer components": { minWidth: "100%" } }, ".table caption, \n .table-caption": { "@layer components": { padding: "0.75rem", fontSize: "0.875rem", color: "var(--color-on-surface-variant)", textAlign: "left", captionSide: "bottom" } }, ".table-empty": { "@layer components": { textAlign: "center", padding: "2rem", color: "var(--color-on-surface-variant)" } }, ".table-loading": { "@layer components": { position: "relative" } }, ".table-loading::after": { "@layer components": { content: "''", position: "absolute", inset: "0", backgroundColor: "var(--color-surface)", opacity: 0.7 } }, ".table-pin-left": { "@layer components": { position: "sticky", left: "0", backgroundColor: "inherit", zIndex: 1 } }, ".table-pin-right": { "@layer components": { position: "sticky", right: "0", backgroundColor: "inherit", zIndex: 1 } }, ".table tr:focus-visible, \n .table-row:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".autocomplete": { "@layer components": { position: "relative", display: "inline-block", width: "100%" } }, ".autocomplete-input": { "@layer components": { width: "100%", padding: "0.75rem 1rem", fontSize: "0.875rem", lineHeight: 1.5, color: "var(--color-on-surface)", backgroundColor: "var(--color-surface)", border: "1px solid currentColor", borderRadius: "var(--radius-sm)", transition: "border-color 150ms ease-in-out, box-shadow 150ms ease-in-out" } }, ".autocomplete-input:focus": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".autocomplete-input:disabled": { "@layer components": { backgroundColor: "var(--color-surface-container)", color: "var(--color-on-surface-variant)", cursor: "not-allowed", opacity: 0.6 } }, ".autocomplete-dropdown": [{ "@layer components": { position: "absolute", top: "100%", left: "0", right: "0", zIndex: 1000, maxHeight: "15rem", marginTop: "0.25rem", backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline)", borderRadius: "var(--radius-sm)", boxShadow: "var(--shadow-lg)", overflowY: "auto", opacity: 0, visibility: "hidden", transform: "translateY(-0.5rem)", transition: "opacity 150ms ease-out, visibility 150ms ease-out, transform 150ms ease-out" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }], ".autocomplete.autocomplete-open .autocomplete-dropdown, \n .autocomplete-dropdown.show": { "@layer components": { opacity: 1, visibility: "visible", transform: "translateY(0)" } }, ".autocomplete-option": { "@layer components": { display: "flex", alignItems: "center", gap: "0.75rem", padding: "0.75rem 1rem", fontSize: "0.875rem", color: "var(--color-on-surface)", cursor: "pointer", transition: "background-color 150ms ease-in-out" } }, ".autocomplete-option:hover, \n .autocomplete-option:focus, \n .autocomplete-option.highlighted": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".autocomplete-option.selected": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".autocomplete-option:disabled, \n .autocomplete-option.disabled": { "@layer components": { color: "var(--color-on-surface-variant)", cursor: "not-allowed", opacity: 0.6 } }, ".autocomplete-option-icon": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.25rem", height: "1.25rem", flexShrink: 0 } }, ".autocomplete-option-content": { "@layer components": { flex: 1, minWidth: "0" } }, ".autocomplete-option-label": { "@layer components": { fontWeight: 500, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, ".autocomplete-option-description": { "@layer components": { fontSize: "0.75rem", color: "var(--color-on-surface-variant)", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, ".autocomplete-highlight": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)", fontWeight: 600, borderRadius: "var(--radius-xs)" } }, ".autocomplete-group-header": { "@layer components": { padding: "0.5rem 1rem", fontSize: "0.75rem", fontWeight: 600, textTransform: "uppercase", color: "var(--color-on-surface-variant)", backgroundColor: "var(--color-surface-container)", borderBottom: "1px solid var(--color-outline-variant)" } }, ".autocomplete-no-results": { "@layer components": { padding: "1rem", textAlign: "center", fontSize: "0.875rem", color: "var(--color-on-surface-variant)" } }, ".autocomplete-loading": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", gap: "0.5rem", padding: "1rem", color: "var(--color-on-surface-variant)" } }, ".autocomplete-clear": { "@layer components": { position: "absolute", right: "0.75rem", top: "50%", transform: "translateY(-50%)", display: "flex", alignItems: "center", justifyContent: "center", width: "1.5rem", height: "1.5rem", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", transition: "background-color 150ms ease-in-out, color 150ms ease-in-out" } }, ".autocomplete-clear:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)", color: "var(--color-on-surface)" } }, ".autocomplete-clearable .autocomplete-input": { "@layer components": { paddingRight: "2.5rem" } }, ".autocomplete-tags": { "@layer components": { display: "flex", flexWrap: "wrap", gap: "0.25rem", padding: "0.375rem", paddingRight: "2.5rem", minHeight: "2.75rem", backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline)", borderRadius: "var(--radius-sm)" } }, ".autocomplete-tags:focus-within": { "@layer components": { borderColor: "var(--color-primary)", boxShadow: "0 0 0 3px var(--color-primary-container)" } }, ".autocomplete-tag": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.25rem", padding: "0.25rem 0.5rem", fontSize: "0.75rem", backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)", borderRadius: "var(--radius-xs)" } }, ".autocomplete-tag-remove": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1rem", height: "1rem", fontSize: "0.75rem", backgroundColor: "transparent", border: "none", cursor: "pointer", borderRadius: "var(--radius-full)", transition: "background-color 150ms ease-in-out" } }, ".autocomplete-tag-remove:hover": { "@layer components": { backgroundColor: "var(--color-on-primary-container)", color: "var(--color-primary-container)" } }, ".autocomplete-tags-input": { "@layer components": { flex: 1, minWidth: "5rem", padding: "0.25rem", fontSize: "0.875rem", backgroundColor: "transparent", border: "none", outline: "none" } }, ".autocomplete-primary .autocomplete-input": { "@layer components": { color: "var(--color-primary)" } }, ".autocomplete-primary .autocomplete-input:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-primary) 10%, transparent)" } }, ".autocomplete-secondary .autocomplete-input": { "@layer components": { color: "var(--color-secondary)" } }, ".autocomplete-secondary .autocomplete-input:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-secondary) 10%, transparent)" } }, ".autocomplete-tertiary .autocomplete-input": { "@layer components": { color: "var(--color-tertiary)" } }, ".autocomplete-tertiary .autocomplete-input:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-tertiary) 10%, transparent)" } }, ".autocomplete-info .autocomplete-input": { "@layer components": { color: "var(--color-info)" } }, ".autocomplete-info .autocomplete-input:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-info) 10%, transparent)" } }, ".autocomplete-success .autocomplete-input": { "@layer components": { color: "var(--color-success)" } }, ".autocomplete-success .autocomplete-input:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-success) 10%, transparent)" } }, ".autocomplete-warning .autocomplete-input": { "@layer components": { color: "var(--color-warning)" } }, ".autocomplete-warning .autocomplete-input:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-warning) 10%, transparent)" } }, ".autocomplete-error .autocomplete-input": { "@layer components": { color: "var(--color-error)" } }, ".autocomplete-error .autocomplete-input:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-error) 10%, transparent)" } }, ".autocomplete-accent .autocomplete-input": { "@layer components": { color: "var(--color-accent)" } }, ".autocomplete-accent .autocomplete-input:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-accent) 10%, transparent)" } }, ".autocomplete-neutral .autocomplete-input": { "@layer components": { color: "var(--color-neutral)" } }, ".autocomplete-neutral .autocomplete-input:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-neutral) 10%, transparent)" } }, ".autocomplete-base .autocomplete-input": { "@layer components": { color: "var(--color-base-content)" } }, ".autocomplete-base .autocomplete-input:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-base-content) 10%, transparent)" } }, ".autocomplete-ghost .autocomplete-input": { "@layer components": { backgroundColor: "transparent", borderColor: "transparent" } }, ".autocomplete-ghost .autocomplete-input:focus": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "transparent", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".autocomplete-sm .autocomplete-input": { "@layer components": { padding: "0.5rem 0.75rem", fontSize: "0.75rem" } }, ".autocomplete-lg .autocomplete-input": { "@layer components": { padding: "1rem 1.25rem", fontSize: "1rem" } }, ".cascader": [{ "@layer components": { position: "relative", display: "inline-flex", flexDirection: "column", width: "100%" } }, { "@layer components": { "@supports not (anchor-name: --anchor)": { position: "relative" } } }], ".cascader-trigger": [{ "@layer components": { display: "flex", alignItems: "center", justifyContent: "space-between", width: "100%", padding: "0.75rem 1rem", fontSize: "1rem", lineHeight: "1.5rem", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface)", border: "1px solid currentColor", borderRadius: "var(--radius-sm)", cursor: "pointer", transition: "border-color 150ms ease-in-out, box-shadow 150ms ease-in-out" } }, { "@layer components": { "@supports (anchor-name: --anchor)": { anchorName: "--cascader-anchor" } } }], ".cascader-trigger:hover:not(:disabled)": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".cascader-trigger:focus": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".cascader-trigger:disabled": { "@layer components": { cursor: "not-allowed", opacity: 0.5, backgroundColor: "var(--color-surface-container)" } }, ".cascader-value": { "@layer components": { flex: 1, display: "flex", alignItems: "center", gap: "0.5rem", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap", color: "var(--color-on-surface)" } }, ".cascader-placeholder": { "@layer components": { color: "var(--color-on-surface-variant)" } }, ".cascader-path": { "@layer components": { display: "flex", alignItems: "center", gap: "0.25rem", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, ".cascader-path-separator": { "@layer components": { color: "var(--color-on-surface-variant)", fontSize: "0.875rem" } }, ".cascader-arrow": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.25rem", height: "1.25rem", color: "var(--color-on-surface-variant)", flexShrink: 0, transition: "transform 150ms ease-in-out" } }, ".cascader-open .cascader-arrow": { "@layer components": { transform: "rotate(180deg)" } }, ".cascader-clear": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.25rem", height: "1.25rem", padding: "0", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", flexShrink: 0, transition: "background-color 150ms ease-in-out" } }, ".cascader-clear:hover": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".cascader-dropdown": { "@layer components": { position: "absolute", top: "100%", left: "0", zIndex: 50, display: "none", marginTop: "0.25rem", backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline-variant)", borderRadius: "var(--radius-sm)", boxShadow: "var(--shadow-md)", overflow: "hidden" } }, ".cascader-open .cascader-dropdown": { "@layer components": { display: "flex" } }, ".cascader-dropdown[popover]": [{ "@layer components": { inset: "unset", margin: "0", border: "1px solid var(--color-outline-variant)" } }, { "@layer components": { "@supports (anchor-name: --anchor)": { positionAnchor: "--cascader-anchor", top: "anchor(bottom)", left: "anchor(left)", marginTop: "0.25rem", positionTryFallbacks: "flip-block" } } }], ".cascader-dropdown[popover]:popover-open": [{ "@layer components": { display: "flex" } }, { "@layer components": { "@supports not (anchor-name: --anchor)": { position: "absolute", top: "100%", left: "0", marginTop: "0.25rem" } } }], ".cascader-panels": { "@layer components": { display: "flex", maxHeight: "16rem" } }, ".cascader-panel": { "@layer components": { display: "flex", flexDirection: "column", minWidth: "10rem", maxWidth: "14rem", overflowY: "auto", borderRight: "1px solid var(--color-outline-variant)" } }, ".cascader-panel:last-child": { "@layer components": { borderRight: "none" } }, ".cascader-panel-header": { "@layer components": { padding: "0.5rem 0.75rem", fontSize: "0.75rem", fontWeight: 600, color: "var(--color-on-surface-variant)", textTransform: "uppercase", letterSpacing: "0.05em", backgroundColor: "var(--color-surface-container)", borderBottom: "1px solid var(--color-outline-variant)" } }, ".cascader-options": { "@layer components": { display: "flex", flexDirection: "column", padding: "0.25rem", flex: 1, overflowY: "auto" } }, ".cascader-option": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "space-between", gap: "0.5rem", padding: "0.5rem 0.75rem", fontSize: "0.875rem", color: "var(--color-on-surface)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-xs)", cursor: "pointer", textAlign: "left", width: "100%", transition: "background-color 150ms ease-in-out" } }, ".cascader-option:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".cascader-option-active": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".cascader-option-selected": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".cascader-option-selected:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-primary-container), black 5%)" } }, ".cascader-option-disabled": { "@layer components": { opacity: 0.5, cursor: "not-allowed" } }, ".cascader-option-disabled:hover": { "@layer components": { backgroundColor: "transparent" } }, ".cascader-option-label": { "@layer components": { flex: 1, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, ".cascader-option-arrow": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1rem", height: "1rem", color: "var(--color-on-surface-variant)", flexShrink: 0 } }, ".cascader-option-selected .cascader-option-arrow": { "@layer components": { color: "var(--color-on-primary-container)" } }, ".cascader-search": { "@layer components": { display: "flex", padding: "0.5rem", borderBottom: "1px solid var(--color-outline-variant)" } }, ".cascader-search-input": { "@layer components": { flex: 1, padding: "0.5rem 0.75rem", fontSize: "0.875rem", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface-container)", border: "none", borderRadius: "var(--radius-xs)", outline: "none" } }, ".cascader-search-input:focus": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".cascader-search-input::placeholder": { "@layer components": { color: "var(--color-on-surface-variant)" } }, ".cascader-empty": { "@layer components": { padding: "1.5rem", textAlign: "center", color: "var(--color-on-surface-variant)", fontSize: "0.875rem" } }, ".cascader-sm .cascader-trigger": { "@layer components": { padding: "0.5rem 0.75rem", fontSize: "0.875rem", borderRadius: "var(--radius-xs)" } }, ".cascader-sm .cascader-panel": { "@layer components": { minWidth: "8rem", maxWidth: "12rem" } }, ".cascader-sm .cascader-option": { "@layer components": { padding: "0.375rem 0.5rem", fontSize: "0.8125rem" } }, ".cascader-lg .cascader-trigger": { "@layer components": { padding: "1rem 1.25rem", fontSize: "1.125rem", borderRadius: "var(--radius-sm)" } }, ".cascader-lg .cascader-panel": { "@layer components": { minWidth: "12rem", maxWidth: "16rem" } }, ".cascader-lg .cascader-option": { "@layer components": { padding: "0.625rem 1rem", fontSize: "1rem" } }, ".cascader-outlined .cascader-trigger": { "@layer components": { backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline)" } }, ".cascader-filled .cascader-trigger": { "@layer components": { backgroundColor: "var(--color-surface-container)", border: "none", borderBottom: "2px solid var(--color-outline)", borderRadius: "var(--radius-sm) var(--radius-sm) 0 0" } }, ".cascader-filled .cascader-trigger:focus": { "@layer components": { borderBottomColor: "currentColor", boxShadow: "none" } }, ".cascader-primary .cascader-trigger": { "@layer components": { color: "var(--color-primary)" } }, ".cascader-primary .cascader-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-primary) 10%, transparent)" } }, ".cascader-secondary .cascader-trigger": { "@layer components": { color: "var(--color-secondary)" } }, ".cascader-secondary .cascader-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-secondary) 10%, transparent)" } }, ".cascader-tertiary .cascader-trigger": { "@layer components": { color: "var(--color-tertiary)" } }, ".cascader-tertiary .cascader-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-tertiary) 10%, transparent)" } }, ".cascader-info .cascader-trigger": { "@layer components": { color: "var(--color-info)" } }, ".cascader-info .cascader-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-info) 10%, transparent)" } }, ".cascader-success .cascader-trigger": { "@layer components": { color: "var(--color-success)" } }, ".cascader-success .cascader-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-success) 10%, transparent)" } }, ".cascader-warning .cascader-trigger": { "@layer components": { color: "var(--color-warning)" } }, ".cascader-warning .cascader-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-warning) 10%, transparent)" } }, ".cascader-error .cascader-trigger": { "@layer components": { color: "var(--color-error)" } }, ".cascader-error .cascader-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-error) 10%, transparent)" } }, ".cascader-accent .cascader-trigger": { "@layer components": { color: "var(--color-accent)" } }, ".cascader-accent .cascader-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-accent) 10%, transparent)" } }, ".cascader-neutral .cascader-trigger": { "@layer components": { color: "var(--color-neutral)" } }, ".cascader-neutral .cascader-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-neutral) 10%, transparent)" } }, ".cascader-base .cascader-trigger": { "@layer components": { color: "var(--color-base-content)" } }, ".cascader-base .cascader-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-base-content) 10%, transparent)" } }, ".cascader-ghost .cascader-trigger": { "@layer components": { backgroundColor: "transparent", borderColor: "transparent" } }, ".cascader-ghost .cascader-trigger:focus": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "transparent", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".cascader-disabled .cascader-trigger": { "@layer components": { cursor: "not-allowed", opacity: 0.5, backgroundColor: "var(--color-surface-container)" } }, ".cascader-loading .cascader-trigger": { "@layer components": { cursor: "wait" } }, ".cascader-spinner": [{ "@layer components": { display: "inline-block", width: "1rem", height: "1rem", border: "2px solid var(--color-outline)", borderTopColor: "var(--color-primary)", borderRadius: "var(--radius-full)", animation: "cascader-spin 0.8s linear infinite" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { animation: "none" } } }], "@keyframes cascader-spin": { to: { transform: "rotate(360deg)" } }, ".cascader-trigger, \n .cascader-arrow, \n .cascader-option, \n .cascader-clear": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".checkbox::before": { "@layer components": { content: '""', width: "0.65em", height: "0.35em", transform: "scale(0) rotate(-45deg)", transformOrigin: "center", borderBottom: "2px solid var(--color-primary-content)", borderLeft: "2px solid var(--color-primary-content)", transition: "transform 150ms ease-in-out" } }, ".checkbox:checked::before": { "@layer components": { transform: "scale(1) rotate(-45deg)" } }, ".checkbox:indeterminate": { "@layer components": { backgroundColor: "var(--checkbox-color)", borderColor: "var(--checkbox-color)" } }, ".checkbox:indeterminate::before": { "@layer components": { width: "0.5em", height: "0", borderBottom: "2px solid var(--color-primary-content)", borderLeft: "0", transform: "scale(1) rotate(0deg)" } }, ".checkbox:hover:not(:disabled):not(:checked)": { "@layer components": { borderColor: "var(--color-on-surface)" } }, ".checkbox:checked:hover:not(:disabled), \n .checkbox:indeterminate:hover:not(:disabled)": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--checkbox-color), black 10%)", borderColor: "color-mix(in oklch, var(--checkbox-color), black 10%)" } }, ".checkbox-md": { "@layer components": { "--checkbox-size": "1.25rem" } }, ".checkbox-xl": { "@layer components": { "--checkbox-size": "1.75rem" } }, ".checkbox-primary": { "@layer components": { "--checkbox-color": "var(--color-primary)" } }, ".checkbox-primary:checked::before, \n .checkbox-primary:indeterminate::before": { "@layer components": { borderColor: "var(--color-primary-content)" } }, ".checkbox-secondary": { "@layer components": { "--checkbox-color": "var(--color-secondary)" } }, ".checkbox-secondary:checked::before, \n .checkbox-secondary:indeterminate::before": { "@layer components": { borderColor: "var(--color-secondary-content)" } }, ".checkbox-tertiary": { "@layer components": { "--checkbox-color": "var(--color-tertiary)" } }, ".checkbox-tertiary:checked::before, \n .checkbox-tertiary:indeterminate::before": { "@layer components": { borderColor: "var(--color-tertiary-content)" } }, ".checkbox-success": { "@layer components": { "--checkbox-color": "var(--color-success)" } }, ".checkbox-success:checked::before, \n .checkbox-success:indeterminate::before": { "@layer components": { borderColor: "var(--color-success-content)" } }, ".checkbox-warning": { "@layer components": { "--checkbox-color": "var(--color-warning)" } }, ".checkbox-warning:checked::before, \n .checkbox-warning:indeterminate::before": { "@layer components": { borderColor: "var(--color-warning-content)" } }, ".checkbox-error": { "@layer components": { "--checkbox-color": "var(--color-error)" } }, ".checkbox-error:checked::before, \n .checkbox-error:indeterminate::before": { "@layer components": { borderColor: "var(--color-error-content)" } }, ".checkbox-info": { "@layer components": { "--checkbox-color": "var(--color-info)" } }, ".checkbox-info:checked::before, \n .checkbox-info:indeterminate::before": { "@layer components": { borderColor: "var(--color-info-content)" } }, ".checkbox-accent": { "@layer components": { "--checkbox-color": "var(--color-accent)" } }, ".checkbox-accent:checked::before, \n .checkbox-accent:indeterminate::before": { "@layer components": { borderColor: "var(--color-accent-content)" } }, ".checkbox-neutral": { "@layer components": { "--checkbox-color": "var(--color-neutral)" } }, ".checkbox-neutral:checked::before, \n .checkbox-neutral:indeterminate::before": { "@layer components": { borderColor: "var(--color-neutral-content)" } }, ".checkbox-base": { "@layer components": { "--checkbox-color": "var(--color-base-100)" } }, ".checkbox-base:checked::before, \n .checkbox-base:indeterminate::before": { "@layer components": { borderColor: "var(--color-base-content)" } }, ".checkbox-ghost": { "@layer components": { "--checkbox-border-color": "transparent" } }, ".checkbox-ghost:hover:not(:disabled):not(:checked)": { "@layer components": { borderColor: "transparent" } }, ".checkbox-label": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.5rem", cursor: "pointer", userSelect: "none", fontSize: "0.875rem", color: "var(--color-on-surface)" } }, ".checkbox-label:has(.checkbox:disabled)": { "@layer components": { cursor: "not-allowed", opacity: 0.38 } }, ".checkbox-group": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.75rem" } }, ".checkbox-group-horizontal": { "@layer components": { flexDirection: "row", flexWrap: "wrap", gap: "1.5rem" } }, ".checkbox-group-label": { "@layer components": { fontSize: "0.875rem", fontWeight: 500, color: "var(--color-on-surface)", marginBottom: "0.5rem" } }, ".checkbox, \n .checkbox::before": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".datepicker": { "@layer components": { position: "relative", display: "inline-block", width: "100%" } }, ".datepicker-input": { "@layer components": { width: "100%", padding: "0.75rem 2.5rem 0.75rem 1rem", fontSize: "0.875rem", lineHeight: 1.5, color: "var(--color-on-surface)", backgroundColor: "var(--color-surface)", border: "1px solid currentColor", borderRadius: "var(--radius-sm)", transition: "border-color 150ms ease-in-out, box-shadow 150ms ease-in-out" } }, '.datepicker-input-container .datepicker-input[type="date"]::-webkit-calendar-picker-indicator': { "@layer components": { display: "none", WebkitAppearance: "none" } }, '.datepicker-input-container .datepicker-input[type="date"]::-webkit-inner-spin-button, \n .datepicker-input-container .datepicker-input[type="date"]::-webkit-clear-button': { "@layer components": { display: "none", WebkitAppearance: "none" } }, ".datepicker-input:focus": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".datepicker-input:disabled": { "@layer components": { backgroundColor: "var(--color-surface-container)", color: "var(--color-on-surface-variant)", cursor: "not-allowed", opacity: 0.6 } }, ".datepicker-icon": { "@layer components": { position: "absolute", right: "0.75rem", top: "50%", transform: "translateY(-50%)", display: "flex", alignItems: "center", justifyContent: "center", width: "1.25rem", height: "1.25rem", color: "var(--color-on-surface-variant)", pointerEvents: "none" } }, ".datepicker-input-container": { "@layer components": { position: "relative", display: "flex", alignItems: "center", width: "100%" } }, ".datepicker-input-container .datepicker-input": { "@layer components": { paddingRight: "2.5rem" } }, ".datepicker-trigger": { "@layer components": { position: "absolute", right: "0.5rem", top: "50%", transform: "translateY(-50%)", zIndex: 1, display: "flex", alignItems: "center", justifyContent: "center", width: "2rem", height: "2rem", padding: "0", background: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", color: "var(--color-on-surface-variant)", transition: "background-color 150ms ease-in-out" } }, ".datepicker-trigger:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".datepicker-trigger .datepicker-icon": { "@layer components": { position: "static", transform: "none" } }, ".datepicker-dropdown:not([popover])": { "@layer components": { position: "absolute", top: "100%", left: "0", zIndex: 1000, marginTop: "0.25rem", backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline)", borderRadius: "var(--radius-md)", boxShadow: "var(--shadow-lg)", opacity: 0, visibility: "hidden", transform: "translateY(-0.5rem)", transition: "opacity 150ms ease-out, visibility 150ms ease-out, transform 150ms ease-out" } }, ".datepicker.datepicker-open .datepicker-dropdown:not([popover]), \n .datepicker-dropdown:not([popover]).show, \n .datepicker-dropdown-open:not([popover])": { "@layer components": { opacity: 1, visibility: "visible", transform: "translateY(0)" } }, ".datepicker-dropdown[popover]": { "@layer components": { inset: "unset", margin: "0", padding: "0", minWidth: "18rem", backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline)", borderRadius: "var(--radius-md)", boxShadow: "var(--shadow-lg)" } }, ".datepicker-header": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "space-between", padding: "0.75rem", borderBottom: "1px solid var(--color-outline-variant)" } }, ".datepicker-title": { "@layer components": { fontSize: "0.875rem", fontWeight: 600, color: "var(--color-on-surface)" } }, ".datepicker-nav": { "@layer components": { display: "flex", gap: "0.25rem" } }, ".datepicker-nav-btn": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "2rem", height: "2rem", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", transition: "background-color 150ms ease-in-out, color 150ms ease-in-out" } }, ".datepicker-nav-btn:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)", color: "var(--color-on-surface)" } }, ".datepicker-nav-btn:disabled": { "@layer components": { opacity: 0.4, cursor: "not-allowed" } }, ".datepicker-calendar": { "@layer components": { display: "grid", gridTemplateColumns: "repeat(7, 1fr)", gap: "0.125rem", padding: "0.5rem" } }, ".datepicker-weekdays": { "@layer components": { display: "grid", gridTemplateColumns: "repeat(7, 1fr)", gap: "0.125rem", marginBottom: "0.25rem" } }, ".datepicker-weekday": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", aspectRatio: "1", fontSize: "0.75rem", fontWeight: 500, color: "var(--color-on-surface-variant)" } }, ".datepicker-days": { "@layer components": { display: "grid", gridTemplateColumns: "repeat(7, 1fr)", gap: "0.125rem" } }, ".datepicker-day": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", aspectRatio: "1", fontSize: "0.875rem", color: "var(--color-on-surface)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", transition: "background-color 150ms ease-in-out, color 150ms ease-in-out" } }, ".datepicker-day:hover:not(:disabled):not(.datepicker-day-selected)": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".datepicker-day:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".datepicker-day-other-month": { "@layer components": { color: "var(--color-on-surface-variant)", opacity: 0.9 } }, ".datepicker-day-today": { "@layer components": { border: "1px solid var(--color-primary)" } }, ".datepicker-day-selected": { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)" } }, ".datepicker-day-selected:hover": { "@layer components": { backgroundColor: "var(--color-primary)", opacity: 0.9 } }, ".datepicker-day:disabled": { "@layer components": { color: "var(--color-on-surface-variant)", opacity: 0.4, cursor: "not-allowed" } }, ".datepicker-day-in-range": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)", borderRadius: "0" } }, ".datepicker-day-range-start": { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)", borderRadius: "var(--radius-full) 0 0 var(--radius-full)" } }, ".datepicker-day-range-end": { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)", borderRadius: "0 var(--radius-full) var(--radius-full) 0" } }, ".datepicker-months, \n .datepicker-years": { "@layer components": { display: "grid", gridTemplateColumns: "repeat(3, 1fr)", gap: "0.5rem", padding: "0.5rem", minWidth: "16rem" } }, ".datepicker-month, \n .datepicker-year": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", padding: "0.75rem 1rem", fontSize: "0.875rem", color: "var(--color-on-surface)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-sm)", cursor: "pointer", transition: "background-color 150ms ease-in-out" } }, ".datepicker-month:hover, \n .datepicker-year:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".datepicker-month.selected, \n .datepicker-month-selected, \n .datepicker-year.selected, \n .datepicker-year-selected": { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)" } }, ".datepicker-day-disabled": { "@layer components": { color: "var(--color-on-surface-variant)", opacity: 0.9, cursor: "not-allowed", pointerEvents: "none" } }, ".datepicker-footer": { "@layer components": { display: "flex", justifyContent: "flex-end", gap: "0.5rem", padding: "0.75rem", borderTop: "1px solid var(--color-outline-variant)" } }, ".datepicker-time": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", gap: "0.25rem", padding: "0.75rem", borderTop: "1px solid var(--color-outline-variant)" } }, ".datepicker-time-input": { "@layer components": { width: "3rem", padding: "0.5rem", fontSize: "1rem", textAlign: "center", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface-container)", border: "1px solid var(--color-outline)", borderRadius: "var(--radius-xs)" } }, ".datepicker-time-input:focus": { "@layer components": { outline: "none", borderColor: "var(--color-primary)" } }, ".datepicker-time-separator": { "@layer components": { fontSize: "1rem", fontWeight: 600, color: "var(--color-on-surface)" } }, ".datepicker-time-period": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.125rem", marginLeft: "0.5rem" } }, ".datepicker-time-period-btn": { "@layer components": { padding: "0.25rem 0.5rem", fontSize: "0.625rem", fontWeight: 500, color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "1px solid var(--color-outline)", cursor: "pointer", transition: "background-color 150ms ease-in-out" } }, ".datepicker-time-period-btn:first-child": { "@layer components": { borderRadius: "var(--radius-xs) var(--radius-xs) 0 0" } }, ".datepicker-time-period-btn:last-child": { "@layer components": { borderRadius: "0 0 var(--radius-xs) var(--radius-xs)", borderTop: "none" } }, ".datepicker-time-period-btn.active": { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)", borderColor: "var(--color-primary)" } }, ".datepicker-sm .datepicker-input": { "@layer components": { padding: "0.5rem 2rem 0.5rem 0.75rem", fontSize: "0.75rem" } }, ".datepicker-lg .datepicker-input": { "@layer components": { padding: "1rem 3rem 1rem 1.25rem", fontSize: "1rem" } }, ".datepicker-range": { "@layer components": { display: "flex", alignItems: "center", gap: "0.5rem" } }, ".datepicker-range-separator": { "@layer components": { color: "var(--color-on-surface-variant)", fontSize: "0.875rem" } }, ".datepicker-range-input": { "@layer components": { flex: 1 } }, ".datepicker-dual-calendar": { "@layer components": { display: "flex", gap: "1rem", padding: "0.5rem" } }, ".datepicker-dual-calendar .datepicker-calendar": { "@layer components": { flex: 1 } }, ".datepicker-presets": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.25rem", padding: "0.5rem", borderRight: "1px solid var(--color-outline-variant)", minWidth: "8rem" } }, ".datepicker-preset": { "@layer components": { padding: "0.5rem 0.75rem", fontSize: "0.75rem", color: "var(--color-on-surface)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-xs)", cursor: "pointer", textAlign: "left", transition: "background-color 150ms ease-in-out" } }, ".datepicker-preset:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".datepicker-preset-active": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".datepicker-range-display": { "@layer components": { display: "flex", alignItems: "center", gap: "0.75rem", padding: "0.75rem", backgroundColor: "var(--color-surface-container-lowest)", borderBottom: "1px solid var(--color-outline-variant)" } }, ".datepicker-range-date": { "@layer components": { flex: 1, textAlign: "center" } }, ".datepicker-range-date-label": { "@layer components": { fontSize: "0.625rem", fontWeight: 500, color: "var(--color-on-surface-variant)", textTransform: "uppercase", marginBottom: "0.25rem" } }, ".datepicker-range-date-value": { "@layer components": { fontSize: "0.875rem", fontWeight: 500, color: "var(--color-on-surface)" } }, ".datepicker-range-arrow": { "@layer components": { color: "var(--color-on-surface-variant)" } }, ".datetime-picker": { "@layer components": { position: "relative", display: "inline-block", width: "100%" } }, ".datetime-picker-input": { "@layer components": { width: "100%", padding: "0.75rem 2.5rem 0.75rem 1rem", fontSize: "0.875rem", lineHeight: 1.5, color: "var(--color-on-surface)", backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline)", borderRadius: "var(--radius-sm)", transition: "border-color 150ms ease-in-out, box-shadow 150ms ease-in-out" } }, ".datetime-picker-input:focus": { "@layer components": { outline: "none", borderColor: "var(--color-primary)", boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-primary) 10%, transparent)" } }, ".datetime-picker-dropdown": { "@layer components": { display: "flex", flexDirection: "column" } }, ".datetime-picker-body": { "@layer components": { display: "flex" } }, ".datetime-picker-calendar": { "@layer components": { flex: 1 } }, ".datetime-picker-time-panel": { "@layer components": { display: "flex", flexDirection: "column", minWidth: "5rem", borderLeft: "1px solid var(--color-outline-variant)" } }, ".datetime-picker-time-header": { "@layer components": { padding: "0.5rem", fontSize: "0.75rem", fontWeight: 500, color: "var(--color-on-surface-variant)", textAlign: "center", borderBottom: "1px solid var(--color-outline-variant)" } }, ".datetime-picker-time-columns": { "@layer components": { display: "flex", flex: 1, maxHeight: "16rem" } }, ".datetime-picker-time-column": { "@layer components": { flex: 1, display: "flex", flexDirection: "column", overflowY: "auto", borderRight: "1px solid var(--color-outline-variant)" } }, ".datetime-picker-time-column:last-child": { "@layer components": { borderRight: "none" } }, ".datetime-picker-time-option": { "@layer components": { padding: "0.375rem 0.5rem", fontSize: "0.75rem", textAlign: "center", color: "var(--color-on-surface)", backgroundColor: "transparent", border: "none", cursor: "pointer", transition: "background-color 150ms ease-in-out" } }, ".datetime-picker-time-option:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".datetime-picker-time-option-selected": { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)" } }, ".datetime-picker-time-option:disabled": { "@layer components": { opacity: 0.4, cursor: "not-allowed" } }, ".datetime-range-picker": { "@layer components": { position: "relative", display: "inline-block", width: "100%" } }, ".datetime-range-picker-inputs": { "@layer components": { display: "flex", alignItems: "center", gap: "0.5rem" } }, ".datetime-range-picker-input": { "@layer components": { flex: 1, padding: "0.75rem 1rem", fontSize: "0.875rem", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline)", borderRadius: "var(--radius-sm)", transition: "border-color 150ms ease-in-out" } }, ".datetime-range-picker-input:focus": { "@layer components": { outline: "none", borderColor: "var(--color-primary)", boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-primary) 10%, transparent)" } }, ".datetime-range-picker-dropdown": { "@layer components": { minWidth: "40rem" } }, ".datetime-range-picker-body": { "@layer components": { display: "flex" } }, ".datetime-range-picker-panel": { "@layer components": { flex: 1, borderRight: "1px solid var(--color-outline-variant)" } }, ".datetime-range-picker-panel:last-child": { "@layer components": { borderRight: "none" } }, ".datetime-range-picker-panel-header": { "@layer components": { padding: "0.5rem 0.75rem", fontSize: "0.75rem", fontWeight: 500, color: "var(--color-on-surface-variant)", textAlign: "center", backgroundColor: "var(--color-surface-container-lowest)", borderBottom: "1px solid var(--color-outline-variant)" } }, ".datepicker-inline": { "@layer components": { position: "static" } }, ".datepicker-inline .datepicker-dropdown, \n .datepicker-dropdown.datepicker-inline": { "@layer components": { position: "static", display: "block", opacity: 1, visibility: "visible", transform: "none", marginTop: "0", boxShadow: "none" } }, ".datepicker-primary .datepicker-input": { "@layer components": { color: "var(--color-primary)" } }, ".datepicker-primary .datepicker-input:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-primary) 10%, transparent)" } }, ".datepicker-secondary .datepicker-input": { "@layer components": { color: "var(--color-secondary)" } }, ".datepicker-secondary .datepicker-input:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-secondary) 10%, transparent)" } }, ".datepicker-tertiary .datepicker-input": { "@layer components": { color: "var(--color-tertiary)" } }, ".datepicker-tertiary .datepicker-input:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-tertiary) 10%, transparent)" } }, ".datepicker-info .datepicker-input": { "@layer components": { color: "var(--color-info)" } }, ".datepicker-info .datepicker-input:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-info) 10%, transparent)" } }, ".datepicker-info .datepicker-day-selected, \n .datepicker-info .datepicker-day-range-start, \n .datepicker-info .datepicker-day-range-end": { "@layer components": { backgroundColor: "var(--color-info)", color: "var(--color-info-content)" } }, ".datepicker-success .datepicker-input": { "@layer components": { color: "var(--color-success)" } }, ".datepicker-success .datepicker-input:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-success) 10%, transparent)" } }, ".datepicker-success .datepicker-day-selected, \n .datepicker-success .datepicker-day-range-start, \n .datepicker-success .datepicker-day-range-end": { "@layer components": { backgroundColor: "var(--color-success)", color: "var(--color-success-content)" } }, ".datepicker-warning .datepicker-input": { "@layer components": { color: "var(--color-warning)" } }, ".datepicker-warning .datepicker-input:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-warning) 10%, transparent)" } }, ".datepicker-warning .datepicker-day-selected, \n .datepicker-warning .datepicker-day-range-start, \n .datepicker-warning .datepicker-day-range-end": { "@layer components": { backgroundColor: "var(--color-warning)", color: "var(--color-warning-content)" } }, ".datepicker-accent .datepicker-input": { "@layer components": { color: "var(--color-accent)" } }, ".datepicker-accent .datepicker-input:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-accent) 10%, transparent)" } }, ".datepicker-accent .datepicker-day-selected, \n .datepicker-accent .datepicker-day-range-start, \n .datepicker-accent .datepicker-day-range-end": { "@layer components": { backgroundColor: "var(--color-accent)", color: "var(--color-accent-content)" } }, ".datepicker-neutral .datepicker-input": { "@layer components": { color: "var(--color-neutral)" } }, ".datepicker-neutral .datepicker-input:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-neutral) 10%, transparent)" } }, ".datepicker-neutral .datepicker-day-selected, \n .datepicker-neutral .datepicker-day-range-start, \n .datepicker-neutral .datepicker-day-range-end": { "@layer components": { backgroundColor: "var(--color-neutral)", color: "var(--color-neutral-content)" } }, ".datepicker-base .datepicker-input": { "@layer components": { color: "var(--color-base-content)" } }, ".datepicker-base .datepicker-input:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-base-content) 10%, transparent)" } }, ".datepicker-base .datepicker-day-selected, \n .datepicker-base .datepicker-day-range-start, \n .datepicker-base .datepicker-day-range-end": { "@layer components": { backgroundColor: "var(--color-base-100)", color: "var(--color-base-content)" } }, ".datepicker-primary .datepicker-day-selected, \n .datepicker-primary .datepicker-day-range-start, \n .datepicker-primary .datepicker-day-range-end": { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)" } }, ".datepicker-secondary .datepicker-day-selected, \n .datepicker-secondary .datepicker-day-range-start, \n .datepicker-secondary .datepicker-day-range-end": { "@layer components": { backgroundColor: "var(--color-secondary)", color: "var(--color-secondary-content)" } }, ".datepicker-tertiary .datepicker-day-selected, \n .datepicker-tertiary .datepicker-day-range-start, \n .datepicker-tertiary .datepicker-day-range-end": { "@layer components": { backgroundColor: "var(--color-tertiary)", color: "var(--color-tertiary-content)" } }, ".datepicker-error .datepicker-input, \n .datetime-picker-error .datetime-picker-input": { "@layer components": { color: "var(--color-error)" } }, ".datepicker-error .datepicker-input:focus, \n .datetime-picker-error .datetime-picker-input:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-error) 10%, transparent)" } }, ".datepicker-ghost .datepicker-input": { "@layer components": { backgroundColor: "transparent", borderColor: "transparent" } }, ".datepicker-ghost .datepicker-input:focus": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "transparent", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".datepicker-dropdown, \n .datepicker-nav-btn, \n .datepicker-day, \n .datepicker-month, \n .datepicker-year, \n .datepicker-preset, \n .datetime-picker-time-option": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".file-upload": { "@layer components": { position: "relative", display: "flex", flexDirection: "column", gap: "0.75rem" } }, ".file-upload-dropzone": { "@layer components": { display: "flex", flexDirection: "column", alignItems: "center", justifyContent: "center", gap: "0.75rem", minHeight: "10rem", padding: "2rem", backgroundColor: "var(--color-surface)", border: "2px dashed currentColor", borderRadius: "var(--radius-md)", cursor: "pointer", transition: "border-color 150ms ease-in-out, background-color 150ms ease-in-out" } }, ".file-upload-dropzone:hover": { "@layer components": { borderColor: "currentColor", backgroundColor: "var(--color-surface-container)" } }, ".file-upload-dropzone:focus-within": { "@layer components": { borderColor: "currentColor", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".file-upload-dropzone.dragging": { "@layer components": { borderColor: "currentColor", backgroundColor: "color-mix(in oklch, currentColor 10%, var(--color-surface))" } }, ".file-upload-dropzone.disabled": { "@layer components": { opacity: 0.6, cursor: "not-allowed", pointerEvents: "none" } }, ".file-upload-input": { "@layer components": { position: "absolute", width: "0", height: "0", opacity: 0, overflow: "hidden" } }, ".file-upload-icon": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "3rem", height: "3rem", fontSize: "2rem" } }, ".file-upload-text": { "@layer components": { textAlign: "center" } }, ".file-upload-title": { "@layer components": { fontSize: "0.875rem", fontWeight: 500, color: "var(--color-on-surface)", marginBottom: "0.25rem" } }, ".file-upload-subtitle": { "@layer components": { fontSize: "0.75rem", color: "var(--color-on-surface-variant)" } }, ".file-upload-browse": { "@layer components": { color: "currentColor", fontWeight: 500, textDecoration: "underline", cursor: "pointer" } }, ".file-upload-list": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.5rem" } }, ".file-upload-item": { "@layer components": { display: "flex", alignItems: "center", gap: "0.75rem", padding: "0.75rem", backgroundColor: "var(--color-surface-container)", borderRadius: "var(--radius-sm)" } }, ".file-upload-item-icon": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "2.5rem", height: "2.5rem", backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)", borderRadius: "var(--radius-sm)", fontSize: "1.25rem", flexShrink: 0 } }, ".file-upload-item-info": { "@layer components": { flex: 1, minWidth: "0" } }, ".file-upload-item-name": { "@layer components": { fontSize: "0.875rem", fontWeight: 500, color: "var(--color-on-surface)", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, ".file-upload-item-size": { "@layer components": { fontSize: "0.75rem", color: "var(--color-on-surface-variant)" } }, ".file-upload-item-remove": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.5rem", height: "1.5rem", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", transition: "background-color 150ms ease-in-out, color 150ms ease-in-out", flexShrink: 0 } }, ".file-upload-item-remove:hover": { "@layer components": { backgroundColor: "var(--color-error-container)", color: "var(--color-on-error-container)" } }, ".file-upload-progress": { "@layer components": { position: "relative", height: "0.25rem", marginTop: "0.5rem", backgroundColor: "var(--color-surface-container-highest)", borderRadius: "var(--radius-full)", overflow: "hidden" } }, ".file-upload-progress-bar": { "@layer components": { position: "absolute", top: "0", left: "0", height: "100%", backgroundColor: "var(--color-primary)", borderRadius: "var(--radius-full)", transition: "width 150ms ease-in-out" } }, ".file-upload-item.uploading .file-upload-item-icon": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".file-upload-item.success .file-upload-item-icon": { "@layer components": { backgroundColor: "var(--color-success-container)", color: "var(--color-on-success-container)" } }, ".file-upload-item.error .file-upload-item-icon": { "@layer components": { backgroundColor: "var(--color-error-container)", color: "var(--color-on-error-container)" } }, ".file-upload-item.error .file-upload-progress-bar": { "@layer components": { backgroundColor: "var(--color-error)" } }, ".file-upload-error": { "@layer components": { fontSize: "0.75rem", color: "var(--color-error)" } }, ".file-upload-preview": { "@layer components": { display: "grid", gridTemplateColumns: "repeat(auto-fill, minmax(6rem, 1fr))", gap: "0.75rem" } }, ".file-upload-preview-item": { "@layer components": { position: "relative", aspectRatio: "1", borderRadius: "var(--radius-sm)", overflow: "hidden", backgroundColor: "var(--color-surface-container)" } }, ".file-upload-preview-image": { "@layer components": { width: "100%", height: "100%", objectFit: "cover" } }, ".file-upload-preview-remove": { "@layer components": { position: "absolute", top: "0.25rem", right: "0.25rem", display: "flex", alignItems: "center", justifyContent: "center", width: "1.5rem", height: "1.5rem", backgroundColor: "var(--color-on-surface)", color: "var(--color-surface)", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", opacity: 0, transition: "opacity 150ms ease-in-out" } }, ".file-upload-preview-item:hover .file-upload-preview-remove": { "@layer components": { opacity: 1 } }, ".file-upload-compact .file-upload-dropzone": { "@layer components": { flexDirection: "row", minHeight: "auto", padding: "1rem", gap: "1rem" } }, ".file-upload-compact .file-upload-icon": { "@layer components": { width: "2rem", height: "2rem", fontSize: "1.5rem" } }, ".file-upload-compact .file-upload-text": { "@layer components": { textAlign: "left" } }, ".file-upload-button": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.5rem", padding: "0.75rem 1.5rem", fontSize: "0.875rem", fontWeight: 500, color: "var(--color-primary-content)", backgroundColor: "var(--color-primary)", border: "none", borderRadius: "var(--radius-sm)", cursor: "pointer", transition: "background-color 150ms ease-in-out, box-shadow 150ms ease-in-out" } }, ".file-upload-button:hover": { "@layer components": { boxShadow: "var(--shadow-md)" } }, ".file-upload-button:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".file-upload-button:disabled": { "@layer components": { opacity: 0.6, cursor: "not-allowed" } }, ".file-upload-primary .file-upload-dropzone": { "@layer components": { color: "var(--color-primary)" } }, ".file-upload-primary .file-upload-dropzone:focus-within": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-primary) 10%, transparent)" } }, ".file-upload-secondary .file-upload-dropzone": { "@layer components": { color: "var(--color-secondary)" } }, ".file-upload-secondary .file-upload-dropzone:focus-within": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-secondary) 10%, transparent)" } }, ".file-upload-tertiary .file-upload-dropzone": { "@layer components": { color: "var(--color-tertiary)" } }, ".file-upload-tertiary .file-upload-dropzone:focus-within": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-tertiary) 10%, transparent)" } }, ".file-upload-info .file-upload-dropzone": { "@layer components": { color: "var(--color-info)" } }, ".file-upload-info .file-upload-dropzone:focus-within": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-info) 10%, transparent)" } }, ".file-upload-success .file-upload-dropzone": { "@layer components": { color: "var(--color-success)" } }, ".file-upload-success .file-upload-dropzone:focus-within": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-success) 10%, transparent)" } }, ".file-upload-warning .file-upload-dropzone": { "@layer components": { color: "var(--color-warning)" } }, ".file-upload-warning .file-upload-dropzone:focus-within": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-warning) 10%, transparent)" } }, ".file-upload-error .file-upload-dropzone": { "@layer components": { color: "var(--color-error)" } }, ".file-upload-error .file-upload-dropzone:focus-within": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-error) 10%, transparent)" } }, ".file-upload-accent .file-upload-dropzone": { "@layer components": { color: "var(--color-accent)" } }, ".file-upload-accent .file-upload-dropzone:focus-within": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-accent) 10%, transparent)" } }, ".file-upload-neutral .file-upload-dropzone": { "@layer components": { color: "var(--color-neutral)" } }, ".file-upload-neutral .file-upload-dropzone:focus-within": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-neutral) 10%, transparent)" } }, ".file-upload-base .file-upload-dropzone": { "@layer components": { color: "var(--color-base-content)" } }, ".file-upload-base .file-upload-dropzone:focus-within": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-base-content) 10%, transparent)" } }, ".file-upload-ghost .file-upload-dropzone": { "@layer components": { backgroundColor: "transparent", borderColor: "transparent" } }, ".file-upload-ghost .file-upload-dropzone:focus-within": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "transparent", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".file-upload-sm .file-upload-dropzone": { "@layer components": { minHeight: "6rem", padding: "1rem" } }, ".file-upload-lg .file-upload-dropzone": { "@layer components": { minHeight: "14rem", padding: "3rem" } }, ".file-upload-dropzone, \n .file-upload-progress-bar, \n .file-upload-preview-remove": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".form-group": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.25rem", width: "100%" } }, ".form-group-horizontal": { "@layer components": { flexDirection: "row", alignItems: "flex-start", gap: "1rem" } }, ".form-group-horizontal .form-label": { "@layer components": { minWidth: "8rem", paddingTop: "0.75rem" } }, ".form-group-horizontal .form-control": { "@layer components": { flex: 1 } }, ".form-label": { "@layer components": { display: "block", fontSize: "0.875rem", fontWeight: 500, lineHeight: "1.25rem", color: "var(--color-on-surface)", marginBottom: "0.25rem" } }, ".form-label-required::after": { "@layer components": { content: "' *'", color: "var(--color-error)" } }, ".form-label-optional::after": { "@layer components": { content: "' (optional)'", fontSize: "0.75rem", fontWeight: 400, color: "var(--color-on-surface-variant)" } }, ".form-label-sm": { "@layer components": { fontSize: "0.75rem", lineHeight: "1rem" } }, ".form-label-lg": { "@layer components": { fontSize: "1rem", lineHeight: "1.5rem" } }, ".helper-text-error": { "@layer components": { color: "var(--color-error)" } }, ".helper-text-success": { "@layer components": { color: "var(--color-success)" } }, ".helper-text-warning": { "@layer components": { color: "var(--color-warning)" } }, ".helper-text-info": { "@layer components": { color: "var(--color-info)" } }, ".helper-text-icon": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.25rem" } }, ".helper-text-icon svg, \n .helper-text-icon .icon": { "@layer components": { width: "0.875rem", height: "0.875rem" } }, ".form-hint": { "@layer components": { fontSize: "0.75rem", lineHeight: "1rem", color: "var(--color-on-surface-variant)", marginBottom: "0.25rem" } }, ".fieldset": { "@layer components": { display: "flex", flexDirection: "column", gap: "1rem", padding: "1rem", margin: "0", border: "1px solid var(--color-outline-variant)", borderRadius: "var(--radius-sm)", backgroundColor: "transparent" } }, ".fieldset-legend": { "@layer components": { padding: "0 0.5rem", fontSize: "0.875rem", fontWeight: 600, lineHeight: "1.25rem", color: "var(--color-on-surface)" } }, ".fieldset-filled": { "@layer components": { backgroundColor: "var(--color-surface-container-lowest)", borderColor: "transparent" } }, ".fieldset-borderless": { "@layer components": { border: "none", padding: "0" } }, ".fieldset-card": { "@layer components": { backgroundColor: "var(--color-surface)", borderColor: "transparent", boxShadow: "var(--shadow-xs)", padding: "1.5rem" } }, ".form-row": { "@layer components": { display: "flex", flexWrap: "wrap", gap: "1rem" } }, ".form-row > .form-group": { "@layer components": { flex: 1, minWidth: "200px" } }, ".form-grid": { "@layer components": { display: "grid", gap: "1rem" } }, ".form-grid-2": { "@layer components": { gridTemplateColumns: "repeat(2, 1fr)" } }, ".form-grid-3": { "@layer components": { gridTemplateColumns: "repeat(3, 1fr)" } }, ".form-grid-4": { "@layer components": { gridTemplateColumns: "repeat(4, 1fr)" } }, ".form-grid-2, \n .form-grid-3, \n .form-grid-4": { "@layer components": { "@media (max-width: 640px)": { gridTemplateColumns: "1fr" } } }, ".form-actions": { "@layer components": { display: "flex", alignItems: "center", gap: "0.75rem", marginTop: "1rem" } }, ".form-actions-right": { "@layer components": { justifyContent: "flex-end" } }, ".form-actions-center": { "@layer components": { justifyContent: "center" } }, ".form-actions-between": { "@layer components": { justifyContent: "space-between" } }, ".form-divider": { "@layer components": { height: "1px", backgroundColor: "var(--color-outline-variant)", margin: "1rem 0" } }, ".form-divider-text": { "@layer components": { display: "flex", alignItems: "center", gap: "1rem", color: "var(--color-on-surface-variant)", fontSize: "0.75rem", textTransform: "uppercase" } }, ".form-divider-text::before, \n .form-divider-text::after": { "@layer components": { content: "''", flex: 1, height: "1px", backgroundColor: "var(--color-outline-variant)" } }, ".form-section": { "@layer components": { display: "flex", flexDirection: "column", gap: "1rem" } }, ".form-section-title": { "@layer components": { fontSize: "1rem", fontWeight: 600, color: "var(--color-on-surface)", marginBottom: "0.5rem" } }, ".form-section-description": { "@layer components": { fontSize: "0.875rem", color: "var(--color-on-surface-variant)", marginBottom: "1rem" } }, ".form-inline": { "@layer components": { display: "flex", flexWrap: "wrap", alignItems: "flex-end", gap: "0.75rem" } }, ".form-inline .form-group": { "@layer components": { flex: "none", width: "auto" } }, ".form-counter": { "@layer components": { fontSize: "0.75rem", color: "var(--color-on-surface-variant)", textAlign: "right", marginTop: "0.25rem" } }, ".form-counter-error": { "@layer components": { color: "var(--color-error)" } }, ".form-group-error .form-label": { "@layer components": { color: "var(--color-error)" } }, ".form-group-error .input, \n .form-group-error .select, \n .form-group-error .textarea": { "@layer components": { borderColor: "var(--color-error)" } }, ".form-group-error .input:focus-visible, \n .form-group-error .select:focus-visible, \n .form-group-error .textarea:focus-visible": { "@layer components": { borderColor: "var(--color-error)", boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-error) 10%, transparent)" } }, ".form-group-success .form-label": { "@layer components": { color: "var(--color-success)" } }, ".form-group-success .input, \n .form-group-success .select, \n .form-group-success .textarea": { "@layer components": { borderColor: "var(--color-success)" } }, ".form-group-success .input:focus-visible, \n .form-group-success .select:focus-visible, \n .form-group-success .textarea:focus-visible": { "@layer components": { borderColor: "var(--color-success)", boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-success) 10%, transparent)" } }, ".form-group-warning .form-label": { "@layer components": { color: "var(--color-warning)" } }, ".form-group-warning .input, \n .form-group-warning .select, \n .form-group-warning .textarea": { "@layer components": { borderColor: "var(--color-warning)" } }, ".form-group-warning .input:focus-visible, \n .form-group-warning .select:focus-visible, \n .form-group-warning .textarea:focus-visible": { "@layer components": { borderColor: "var(--color-warning)", boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-warning) 10%, transparent)" } }, ".form-group-info .form-label": { "@layer components": { color: "var(--color-info)" } }, ".form-group-info .input, \n .form-group-info .select, \n .form-group-info .textarea": { "@layer components": { borderColor: "var(--color-info)" } }, ".form-group-info .input:focus-visible, \n .form-group-info .select:focus-visible, \n .form-group-info .textarea:focus-visible": { "@layer components": { borderColor: "var(--color-info)", boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-info) 10%, transparent)" } }, ".form-group-disabled": { "@layer components": { opacity: 0.5, pointerEvents: "none" } }, '.input[aria-invalid="true"], \n .select[aria-invalid="true"], \n .textarea[aria-invalid="true"]': { "@layer components": { borderColor: "var(--color-error)", color: "var(--color-error)" } }, '.input[aria-invalid="true"]:focus-visible, \n .select[aria-invalid="true"]:focus-visible, \n .textarea[aria-invalid="true"]:focus-visible': { "@layer components": { borderColor: "var(--color-error)", boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-error) 10%, transparent)" } }, '.checkbox[aria-invalid="true"], \n .radio[aria-invalid="true"], \n .file-input[aria-invalid="true"]': { "@layer components": { borderColor: "var(--color-error)" } }, '.checkbox[aria-invalid="true"]:focus-visible, \n .radio[aria-invalid="true"]:focus-visible, \n .file-input[aria-invalid="true"]:focus-visible': { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-error) 20%, transparent)" } }, '.switch[aria-invalid="true"]': { "@layer components": { borderColor: "var(--color-error)" } }, '.switch[aria-invalid="true"]:focus-visible': { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-error) 20%, transparent)" } }, '.form-label[aria-required="true"]::after': { "@layer components": { content: "' *'", color: "var(--color-error)" } }, ".validate .input:invalid, \n .validate .select:invalid, \n .validate .textarea:invalid": { "@layer components": { borderColor: "var(--color-error)" } }, ".validate .input:valid, \n .validate .select:valid, \n .validate .textarea:valid": { "@layer components": { borderColor: "var(--color-success)" } }, ".input:user-invalid, \n .select:user-invalid, \n .textarea:user-invalid": { "@layer components": { borderColor: "var(--color-error)" } }, ".input:user-invalid:focus-visible, \n .select:user-invalid:focus-visible, \n .textarea:user-invalid:focus-visible": { "@layer components": { borderColor: "var(--color-error)", boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-error) 10%, transparent)" } }, ".input:user-valid, \n .select:user-valid, \n .textarea:user-valid": { "@layer components": { borderColor: "var(--color-success)" } }, ".input:user-valid:focus-visible, \n .select:user-valid:focus-visible, \n .textarea:user-valid:focus-visible": { "@layer components": { borderColor: "var(--color-success)", boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-success) 10%, transparent)" } }, ".checkbox:user-invalid, \n .radio:user-invalid": { "@layer components": { borderColor: "var(--color-error)" } }, ".checkbox:user-invalid:focus-visible, \n .radio:user-invalid:focus-visible": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-error) 20%, transparent)" } }, ".checkbox:user-valid:checked, \n .radio:user-valid:checked": { "@layer components": { borderColor: "var(--color-success)", backgroundColor: "var(--color-success)" } }, ".switch:user-invalid": { "@layer components": { borderColor: "var(--color-error)" } }, ".switch:user-invalid:focus-visible": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-error) 20%, transparent)" } }, ".switch:user-valid:checked": { "@layer components": { backgroundColor: "var(--color-success)", borderColor: "var(--color-success)" } }, ".file-input:user-invalid": { "@layer components": { borderColor: "var(--color-error)" } }, ".file-input:user-invalid:focus-visible": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-error) 20%, transparent)" } }, ".input-filled:user-invalid": { "@layer components": { borderBottomColor: "var(--color-error)" } }, ".input-filled:user-invalid:focus-visible": { "@layer components": { borderBottomColor: "var(--color-error)", boxShadow: "none" } }, ".input-filled:user-valid": { "@layer components": { borderBottomColor: "var(--color-success)" } }, ".input-filled:user-valid:focus-visible": { "@layer components": { borderBottomColor: "var(--color-success)", boxShadow: "none" } }, ".multi-select": { "@layer components": { position: "relative", display: "inline-flex", flexDirection: "column", width: "100%" } }, ".multi-select-trigger": { "@layer components": { display: "flex", alignItems: "center", gap: "0.5rem", minHeight: "2.75rem", width: "100%", padding: "0.5rem 0.75rem", fontSize: "1rem", lineHeight: "1.5rem", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface)", border: "1px solid currentColor", borderRadius: "var(--radius-sm)", cursor: "pointer", transition: "border-color 150ms ease-in-out, box-shadow 150ms ease-in-out" } }, ".multi-select-trigger:hover:not(:disabled)": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".multi-select-trigger:focus-within": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".multi-select-placeholder": { "@layer components": { flex: 1, color: "var(--color-on-surface-variant)" } }, ".multi-select-tags": { "@layer components": { display: "flex", flexWrap: "wrap", alignItems: "center", gap: "0.25rem", flex: 1, minWidth: "0" } }, ".multi-select-tag": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.25rem", maxWidth: "100%", padding: "0.125rem 0.375rem 0.125rem 0.5rem", fontSize: "0.75rem", lineHeight: "1.25rem", backgroundColor: "var(--color-surface-container-high)", color: "var(--color-on-surface)", borderRadius: "var(--radius-lg)" } }, ".multi-select-tag-text": { "@layer components": { overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, ".multi-select-tag-remove": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1rem", height: "1rem", padding: "0", fontSize: "0.875rem", color: "inherit", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", opacity: 0.7, transition: "opacity 150ms ease-in-out, background-color 150ms ease-in-out" } }, ".multi-select-tag-remove:hover": { "@layer components": { opacity: 1, backgroundColor: "color-mix(in oklch, currentColor 15%, transparent)" } }, ".multi-select-tag-primary": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".multi-select-tag-outlined": { "@layer components": { backgroundColor: "transparent", border: "1px solid var(--color-outline)", color: "var(--color-on-surface)" } }, ".multi-select-tag-overflow": { "@layer components": { display: "inline-flex", alignItems: "center", padding: "0.125rem 0.5rem", fontSize: "0.75rem", lineHeight: "1.25rem", backgroundColor: "var(--color-surface-container)", color: "var(--color-on-surface-variant)", borderRadius: "var(--radius-lg)" } }, ".multi-select-input": { "@layer components": { flex: 1, minWidth: "4rem", padding: "0.125rem 0", fontSize: "0.875rem", color: "var(--color-on-surface)", backgroundColor: "transparent", border: "none", outline: "none" } }, ".multi-select-input::placeholder": { "@layer components": { color: "var(--color-on-surface-variant)", opacity: 0.7 } }, ".multi-select-arrow": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.25rem", height: "1.25rem", marginLeft: "auto", color: "var(--color-on-surface-variant)", flexShrink: 0, transition: "transform 150ms ease-in-out" } }, ".multi-select-open .multi-select-arrow": { "@layer components": { transform: "rotate(180deg)" } }, ".multi-select-clear-all": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.25rem", height: "1.25rem", padding: "0", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", flexShrink: 0, transition: "background-color 150ms ease-in-out" } }, ".multi-select-clear-all:hover": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".multi-select-dropdown": { "@layer components": { position: "absolute", top: "100%", left: "0", right: "0", zIndex: 50, display: "none", maxHeight: "16rem", marginTop: "0.25rem", backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline-variant)", borderRadius: "var(--radius-sm)", boxShadow: "var(--shadow-md)", overflow: "hidden" } }, ".multi-select-open .multi-select-dropdown": { "@layer components": { display: "flex", flexDirection: "column" } }, ".multi-select-dropdown[popover]": { "@layer components": { inset: "unset", margin: "0", padding: "0", border: "1px solid var(--color-outline-variant)" } }, ".multi-select-dropdown[popover]:popover-open": { "@layer components": { display: "flex", flexDirection: "column" } }, ".multi-select-search": { "@layer components": { padding: "0.5rem", borderBottom: "1px solid var(--color-outline-variant)" } }, ".multi-select-search-input": { "@layer components": { width: "100%", padding: "0.5rem 0.75rem", fontSize: "0.875rem", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface-container)", border: "none", borderRadius: "var(--radius-xs)", outline: "none" } }, ".multi-select-search-input:focus": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".multi-select-search-input::placeholder": { "@layer components": { color: "var(--color-on-surface-variant)", opacity: 0.7 } }, ".multi-select-options": { "@layer components": { flex: 1, overflowY: "auto", padding: "0.25rem" } }, ".multi-select-option": { "@layer components": { display: "flex", alignItems: "center", gap: "0.75rem", width: "100%", padding: "0.625rem 0.75rem", fontSize: "0.875rem", color: "var(--color-on-surface)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-xs)", cursor: "pointer", textAlign: "left", transition: "background-color 150ms ease-in-out" } }, ".multi-select-option:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".multi-select-option-selected": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".multi-select-option-selected:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-primary-container), black 5%)" } }, ".multi-select-option-disabled": { "@layer components": { opacity: 0.5, cursor: "not-allowed" } }, ".multi-select-option-disabled:hover": { "@layer components": { backgroundColor: "transparent" } }, ".multi-select-option-focused": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".multi-select-option-checkbox": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1rem", height: "1rem", backgroundColor: "transparent", border: "2px solid var(--color-on-surface-variant)", borderRadius: "var(--radius-xs)", flexShrink: 0 } }, ".multi-select-option-selected .multi-select-option-checkbox": { "@layer components": { backgroundColor: "var(--color-primary)", borderColor: "var(--color-primary)" } }, ".multi-select-option-selected .multi-select-option-checkbox svg": { "@layer components": { color: "var(--color-primary-content)" } }, ".multi-select-option-icon": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.25rem", height: "1.25rem", color: "var(--color-on-surface-variant)" } }, ".multi-select-option-text": { "@layer components": { flex: 1, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, ".multi-select-option-description": { "@layer components": { fontSize: "0.75rem", color: "var(--color-on-surface-variant)" } }, ".multi-select-group": { "@layer components": { padding: "0.25rem 0" } }, ".multi-select-group-header": { "@layer components": { padding: "0.5rem 0.75rem", fontSize: "0.75rem", fontWeight: 600, color: "var(--color-on-surface-variant)", textTransform: "uppercase", letterSpacing: "0.05em" } }, ".multi-select-empty": { "@layer components": { padding: "1.5rem", textAlign: "center", color: "var(--color-on-surface-variant)", fontSize: "0.875rem" } }, ".multi-select-actions": { "@layer components": { display: "flex", gap: "0.5rem", padding: "0.5rem", borderBottom: "1px solid var(--color-outline-variant)" } }, ".multi-select-action": { "@layer components": { padding: "0.375rem 0.75rem", fontSize: "0.75rem", fontWeight: 500, color: "var(--color-primary)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-xs)", cursor: "pointer", transition: "background-color 150ms ease-in-out" } }, ".multi-select-action:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-primary) 10%, transparent)" } }, ".multi-select-counter": { "@layer components": { display: "inline-flex", alignItems: "center", justifyContent: "center", minWidth: "1.25rem", height: "1.25rem", padding: "0 0.375rem", fontSize: "0.625rem", fontWeight: 600, color: "var(--color-primary-content)", backgroundColor: "var(--color-primary)", borderRadius: "var(--radius-sm)" } }, ".multi-select-sm .multi-select-trigger": { "@layer components": { minHeight: "2.25rem", padding: "0.375rem 0.5rem", fontSize: "0.875rem", borderRadius: "var(--radius-xs)" } }, ".multi-select-sm .multi-select-tag": { "@layer components": { fontSize: "0.625rem", padding: "0 0.25rem 0 0.375rem" } }, ".multi-select-lg .multi-select-trigger": { "@layer components": { minHeight: "3.25rem", padding: "0.625rem 1rem", fontSize: "1.125rem", borderRadius: "var(--radius-sm)" } }, ".multi-select-outlined .multi-select-trigger": { "@layer components": { backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline)" } }, ".multi-select-filled .multi-select-trigger": { "@layer components": { backgroundColor: "var(--color-surface-container)", border: "none", borderBottom: "2px solid var(--color-outline)", borderRadius: "var(--radius-sm) var(--radius-sm) 0 0" } }, ".multi-select-filled .multi-select-trigger:focus-within": { "@layer components": { borderBottomColor: "currentColor", boxShadow: "none" } }, ".multi-select-primary .multi-select-trigger": { "@layer components": { color: "var(--color-primary)" } }, ".multi-select-primary .multi-select-trigger:focus-within": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-primary) 10%, transparent)" } }, ".multi-select-secondary .multi-select-trigger": { "@layer components": { color: "var(--color-secondary)" } }, ".multi-select-secondary .multi-select-trigger:focus-within": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-secondary) 10%, transparent)" } }, ".multi-select-tertiary .multi-select-trigger": { "@layer components": { color: "var(--color-tertiary)" } }, ".multi-select-tertiary .multi-select-trigger:focus-within": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-tertiary) 10%, transparent)" } }, ".multi-select-info .multi-select-trigger": { "@layer components": { color: "var(--color-info)" } }, ".multi-select-info .multi-select-trigger:focus-within": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-info) 10%, transparent)" } }, ".multi-select-success .multi-select-trigger": { "@layer components": { color: "var(--color-success)" } }, ".multi-select-success .multi-select-trigger:focus-within": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-success) 10%, transparent)" } }, ".multi-select-warning .multi-select-trigger": { "@layer components": { color: "var(--color-warning)" } }, ".multi-select-warning .multi-select-trigger:focus-within": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-warning) 10%, transparent)" } }, ".multi-select-error .multi-select-trigger": { "@layer components": { color: "var(--color-error)" } }, ".multi-select-error .multi-select-trigger:focus-within": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-error) 10%, transparent)" } }, ".multi-select-accent .multi-select-trigger": { "@layer components": { color: "var(--color-accent)" } }, ".multi-select-accent .multi-select-trigger:focus-within": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-accent) 10%, transparent)" } }, ".multi-select-neutral .multi-select-trigger": { "@layer components": { color: "var(--color-neutral)" } }, ".multi-select-neutral .multi-select-trigger:focus-within": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-neutral) 10%, transparent)" } }, ".multi-select-base .multi-select-trigger": { "@layer components": { color: "var(--color-base-content)" } }, ".multi-select-base .multi-select-trigger:focus-within": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-base-content) 10%, transparent)" } }, ".multi-select-ghost .multi-select-trigger": { "@layer components": { backgroundColor: "transparent", borderColor: "transparent" } }, ".multi-select-ghost .multi-select-trigger:focus-within": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "transparent", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".multi-select-disabled .multi-select-trigger": { "@layer components": { cursor: "not-allowed", opacity: 0.5, backgroundColor: "var(--color-surface-container)" } }, ".multi-select-disabled .multi-select-tag-remove": { "@layer components": { pointerEvents: "none" } }, ".multi-select-loading .multi-select-trigger": { "@layer components": { cursor: "wait" } }, ".multi-select-spinner": [{ "@layer components": { display: "inline-block", width: "1rem", height: "1rem", border: "2px solid var(--color-outline)", borderTopColor: "var(--color-primary)", borderRadius: "var(--radius-full)", animation: "multi-select-spin 0.8s linear infinite" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { animation: "none" } } }], "@keyframes multi-select-spin": { to: { transform: "rotate(360deg)" } }, ".multi-select-trigger, \n .multi-select-arrow, \n .multi-select-tag-remove, \n .multi-select-clear-all, \n .multi-select-option": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".otp-input": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.5rem" } }, ".otp-input-field": [{ "@layer components": { width: "3rem", height: "3.5rem", padding: "0", fontSize: "1.5rem", fontWeight: 600, textAlign: "center", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface)", border: "2px solid currentColor", borderRadius: "var(--radius-sm)", outline: "none", transition: "border-color 150ms ease-in-out, box-shadow 150ms ease-in-out", caretColor: "var(--color-primary)" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }], ".otp-input-field::placeholder": { "@layer components": { color: "var(--color-on-surface-variant)", opacity: 0.5 } }, ".otp-input-field:hover:not(:disabled):not(:focus)": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".otp-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".otp-input-field:disabled": { "@layer components": { opacity: 0.38, cursor: "not-allowed", backgroundColor: "var(--color-surface-container)" } }, ".otp-input-field-filled": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "var(--color-primary)" } }, ".otp-separator": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1rem", height: "0.25rem", backgroundColor: "var(--color-outline)", borderRadius: "var(--radius-xs)" } }, ".otp-input-sm .otp-input-field": { "@layer components": { width: "2.5rem", height: "3rem", fontSize: "1.25rem", borderRadius: "var(--radius-xs)" } }, ".otp-input-lg .otp-input-field": { "@layer components": { width: "3.5rem", height: "4rem", fontSize: "1.75rem", borderRadius: "var(--radius-sm)" } }, ".otp-input-compact": { "@layer components": { gap: "0.25rem" } }, ".otp-input-wide": { "@layer components": { gap: "1rem" } }, ".otp-input-filled .otp-input-field": { "@layer components": { backgroundColor: "var(--color-surface-container)", border: "none", borderBottom: "2px solid var(--color-outline)", borderRadius: "var(--radius-sm) var(--radius-sm) 0 0" } }, ".otp-input-filled .otp-input-field:focus": { "@layer components": { borderBottomColor: "var(--color-primary)", boxShadow: "none" } }, ".otp-input-outlined .otp-input-field": { "@layer components": { backgroundColor: "transparent" } }, ".otp-input-underline .otp-input-field": { "@layer components": { backgroundColor: "transparent", border: "none", borderBottom: "2px solid var(--color-outline)", borderRadius: "0" } }, ".otp-input-underline .otp-input-field:focus": { "@layer components": { borderBottomColor: "var(--color-primary)", boxShadow: "none" } }, ".otp-input-primary .otp-input-field": { "@layer components": { color: "var(--color-primary)" } }, ".otp-input-primary .otp-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-primary) 10%, transparent)" } }, ".otp-input-secondary .otp-input-field": { "@layer components": { color: "var(--color-secondary)" } }, ".otp-input-secondary .otp-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-secondary) 10%, transparent)" } }, ".otp-input-tertiary .otp-input-field": { "@layer components": { color: "var(--color-tertiary)" } }, ".otp-input-tertiary .otp-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-tertiary) 10%, transparent)" } }, ".otp-input-info .otp-input-field": { "@layer components": { color: "var(--color-info)" } }, ".otp-input-info .otp-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-info) 10%, transparent)" } }, ".otp-input-success .otp-input-field": { "@layer components": { color: "var(--color-success)" } }, ".otp-input-success .otp-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-success) 10%, transparent)" } }, ".otp-input-warning .otp-input-field": { "@layer components": { color: "var(--color-warning)" } }, ".otp-input-warning .otp-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-warning) 10%, transparent)" } }, ".otp-input-error .otp-input-field": { "@layer components": { color: "var(--color-error)" } }, ".otp-input-error .otp-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-error) 10%, transparent)" } }, ".otp-input-accent .otp-input-field": { "@layer components": { color: "var(--color-accent)" } }, ".otp-input-accent .otp-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-accent) 10%, transparent)" } }, ".otp-input-neutral .otp-input-field": { "@layer components": { color: "var(--color-neutral)" } }, ".otp-input-neutral .otp-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-neutral) 10%, transparent)" } }, ".otp-input-base .otp-input-field": { "@layer components": { color: "var(--color-base-content)" } }, ".otp-input-base .otp-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-base-content) 10%, transparent)" } }, ".otp-input-ghost .otp-input-field": { "@layer components": { backgroundColor: "transparent", borderColor: "transparent" } }, ".otp-input-ghost .otp-input-field:focus": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "transparent", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".otp-input-masked .otp-input-field": { "@layer components": { WebkitTextSecurity: "disc", fontFamily: "text-security-disc" } }, ".otp-group": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.5rem" } }, ".otp-label": { "@layer components": { fontSize: "0.875rem", fontWeight: 500, color: "var(--color-on-surface)" } }, ".otp-helper": { "@layer components": { fontSize: "0.75rem", color: "var(--color-on-surface-variant)" } }, ".otp-error-message": { "@layer components": { fontSize: "0.75rem", color: "var(--color-error)" } }, ".pin-input": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.5rem" } }, ".pin-input-field": [{ "@layer components": { width: "3rem", height: "3.5rem", padding: "0", fontSize: "1.5rem", fontWeight: 600, textAlign: "center", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface)", border: "2px solid currentColor", borderRadius: "var(--radius-sm)", outline: "none", transition: "border-color 150ms ease-in-out, box-shadow 150ms ease-in-out", caretColor: "var(--color-primary)", WebkitTextSecurity: "disc" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }], ".pin-input-field::placeholder": { "@layer components": { color: "var(--color-on-surface-variant)", opacity: 0.3 } }, ".pin-input-field:hover:not(:disabled):not(:focus)": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".pin-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".pin-input-field:disabled": { "@layer components": { opacity: 0.38, cursor: "not-allowed", backgroundColor: "var(--color-surface-container)" } }, ".pin-input-visible .pin-input-field": { "@layer components": { WebkitTextSecurity: "none" } }, ".pin-input-sm .pin-input-field": { "@layer components": { width: "2.5rem", height: "3rem", fontSize: "1.25rem", borderRadius: "var(--radius-xs)" } }, ".pin-input-lg .pin-input-field": { "@layer components": { width: "3.5rem", height: "4rem", fontSize: "1.75rem", borderRadius: "var(--radius-sm)" } }, ".pin-input-compact": { "@layer components": { gap: "0.25rem" } }, ".pin-input-filled .pin-input-field": { "@layer components": { backgroundColor: "var(--color-surface-container)", border: "none", borderBottom: "2px solid var(--color-outline)", borderRadius: "var(--radius-sm) var(--radius-sm) 0 0" } }, ".pin-input-filled .pin-input-field:focus": { "@layer components": { borderBottomColor: "var(--color-primary)", boxShadow: "none" } }, ".pin-input-circle .pin-input-field": { "@layer components": { width: "3rem", height: "3rem", borderRadius: "var(--radius-full)" } }, ".pin-input-circle.pin-input-sm .pin-input-field": { "@layer components": { width: "2.5rem", height: "2.5rem" } }, ".pin-input-circle.pin-input-lg .pin-input-field": { "@layer components": { width: "3.5rem", height: "3.5rem" } }, ".pin-input-dots .pin-input-field": { "@layer components": { fontSize: "2rem", letterSpacing: "-0.25rem" } }, ".pin-input-primary .pin-input-field": { "@layer components": { color: "var(--color-primary)" } }, ".pin-input-primary .pin-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-primary) 10%, transparent)" } }, ".pin-input-secondary .pin-input-field": { "@layer components": { color: "var(--color-secondary)" } }, ".pin-input-secondary .pin-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-secondary) 10%, transparent)" } }, ".pin-input-tertiary .pin-input-field": { "@layer components": { color: "var(--color-tertiary)" } }, ".pin-input-tertiary .pin-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-tertiary) 10%, transparent)" } }, ".pin-input-info .pin-input-field": { "@layer components": { color: "var(--color-info)" } }, ".pin-input-info .pin-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-info) 10%, transparent)" } }, ".pin-input-success .pin-input-field": { "@layer components": { color: "var(--color-success)" } }, ".pin-input-success .pin-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-success) 10%, transparent)" } }, ".pin-input-warning .pin-input-field": { "@layer components": { color: "var(--color-warning)" } }, ".pin-input-warning .pin-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-warning) 10%, transparent)" } }, ".pin-input-error .pin-input-field": [{ "@layer components": { color: "var(--color-error)", animation: "pin-shake 300ms ease-in-out" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { animation: "none" } } }], ".pin-input-error .pin-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-error) 10%, transparent)" } }, ".pin-input-accent .pin-input-field": { "@layer components": { color: "var(--color-accent)" } }, ".pin-input-accent .pin-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-accent) 10%, transparent)" } }, ".pin-input-neutral .pin-input-field": { "@layer components": { color: "var(--color-neutral)" } }, ".pin-input-neutral .pin-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-neutral) 10%, transparent)" } }, ".pin-input-base .pin-input-field": { "@layer components": { color: "var(--color-base-content)" } }, ".pin-input-base .pin-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-base-content) 10%, transparent)" } }, "@keyframes pin-shake": { "0%, 100%": { transform: "translateX(0)" }, "20%, 60%": { transform: "translateX(-4px)" }, "40%, 80%": { transform: "translateX(4px)" } }, ".pin-input-ghost .pin-input-field": { "@layer components": { backgroundColor: "transparent", borderColor: "transparent" } }, ".pin-input-ghost .pin-input-field:focus": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "transparent", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".pin-group": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.5rem" } }, ".pin-label": { "@layer components": { fontSize: "0.875rem", fontWeight: 500, color: "var(--color-on-surface)" } }, ".pin-helper": { "@layer components": { fontSize: "0.75rem", color: "var(--color-on-surface-variant)" } }, ".pin-error-message": { "@layer components": { fontSize: "0.75rem", color: "var(--color-error)" } }, ".radio::before": { "@layer components": { content: '""', width: "0.5em", height: "0.5em", borderRadius: "var(--radius-full)", backgroundColor: "var(--radio-color)", transform: "scale(0)", transition: "transform 150ms ease-in-out" } }, ".radio:checked::before": { "@layer components": { transform: "scale(1)" } }, ".radio:hover:not(:disabled):not(:checked)": { "@layer components": { borderColor: "var(--color-on-surface)" } }, ".radio:checked:hover:not(:disabled)": { "@layer components": { borderColor: "color-mix(in oklch, var(--radio-color), black 10%)" } }, ".radio:checked:hover:not(:disabled)::before": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--radio-color), black 10%)" } }, ".radio-xs": { "@layer components": { "--radio-size": "0.875rem" } }, ".radio-sm": { "@layer components": { "--radio-size": "1rem" } }, ".radio-md": { "@layer components": { "--radio-size": "1.25rem" } }, ".radio-lg": { "@layer components": { "--radio-size": "1.5rem" } }, ".radio-xl": { "@layer components": { "--radio-size": "1.75rem" } }, ".radio-primary": { "@layer components": { "--radio-color": "var(--color-primary)" } }, ".radio-secondary": { "@layer components": { "--radio-color": "var(--color-secondary)" } }, ".radio-tertiary": { "@layer components": { "--radio-color": "var(--color-tertiary)" } }, ".radio-success": { "@layer components": { "--radio-color": "var(--color-success)" } }, ".radio-warning": { "@layer components": { "--radio-color": "var(--color-warning)" } }, ".radio-error": { "@layer components": { "--radio-color": "var(--color-error)" } }, ".radio-info": { "@layer components": { "--radio-color": "var(--color-info)" } }, ".radio-accent": { "@layer components": { "--radio-color": "var(--color-accent)" } }, ".radio-neutral": { "@layer components": { "--radio-color": "var(--color-neutral)" } }, ".radio-base": { "@layer components": { "--radio-color": "var(--color-base-content)" } }, ".radio-ghost": { "@layer components": { "--radio-border-color": "transparent" } }, ".radio-ghost:hover:not(:disabled):not(:checked)": { "@layer components": { borderColor: "transparent" } }, ".radio-label": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.5rem", cursor: "pointer", userSelect: "none", fontSize: "0.875rem", color: "var(--color-on-surface)" } }, ".radio-label:has(.radio:disabled)": { "@layer components": { cursor: "not-allowed", opacity: 0.38 } }, ".radio-group": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.75rem" } }, ".radio-group-horizontal": { "@layer components": { flexDirection: "row", flexWrap: "wrap", gap: "1.5rem" } }, ".radio-group-label": { "@layer components": { fontSize: "0.875rem", fontWeight: 500, color: "var(--color-on-surface)", marginBottom: "0.5rem" } }, ".radio, \n .radio::before": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".rating": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.125rem", color: "var(--color-on-surface)" } }, ".rating-item": { "@layer components": { position: "relative", display: "flex", alignItems: "center", justifyContent: "center", color: "var(--color-outline)", cursor: "pointer", transition: "color 150ms ease-in-out, transform 150ms ease-in-out" } }, ".rating-item:hover": { "@layer components": { transform: "scale(1.1)" } }, ".rating-item.active": { "@layer components": { color: "var(--color-warning-container)" } }, ".rating-item.filled": { "@layer components": { color: "var(--color-warning)" } }, ".rating-input": { "@layer components": { position: "absolute", width: "0", height: "0", opacity: 0, overflow: "hidden" } }, ".rating-icon": { "@layer components": { width: "1.5rem", height: "1.5rem", fontSize: "1.5rem", lineHeight: 1 } }, ".rating-half": { "@layer components": { position: "relative", overflow: "hidden" } }, ".rating-half .rating-icon-empty": { "@layer components": { color: "var(--color-outline)" } }, ".rating-half .rating-icon-filled": { "@layer components": { position: "absolute", left: "0", top: "0", width: "50%", overflow: "hidden", color: "var(--color-warning)" } }, ".rating-xs .rating-icon": { "@layer components": { width: "0.875rem", height: "0.875rem", fontSize: "0.875rem" } }, ".rating-sm .rating-icon": { "@layer components": { width: "1.25rem", height: "1.25rem", fontSize: "1.25rem" } }, ".rating-lg .rating-icon": { "@layer components": { width: "2rem", height: "2rem", fontSize: "2rem" } }, ".rating-xl .rating-icon": { "@layer components": { width: "2.5rem", height: "2.5rem", fontSize: "2.5rem" } }, ".rating-primary .rating-item.filled": { "@layer components": { color: "var(--color-primary)" } }, ".rating-secondary .rating-item.filled": { "@layer components": { color: "var(--color-secondary)" } }, ".rating-error .rating-item.filled": { "@layer components": { color: "var(--color-error)" } }, ".rating-success .rating-item.filled": { "@layer components": { color: "var(--color-success)" } }, ".rating-tertiary .rating-item.filled": { "@layer components": { color: "var(--color-tertiary)" } }, ".rating-info .rating-item.filled": { "@layer components": { color: "var(--color-info)" } }, ".rating-warning .rating-item.filled": { "@layer components": { color: "var(--color-warning)" } }, ".rating-accent .rating-item.filled": { "@layer components": { color: "var(--color-accent)" } }, ".rating-neutral .rating-item.filled": { "@layer components": { color: "var(--color-neutral)" } }, ".rating-base .rating-item.filled": { "@layer components": { color: "var(--color-base-content)" } }, ".rating-readonly .rating-item": { "@layer components": { cursor: "default" } }, ".rating-readonly .rating-item:hover": { "@layer components": { transform: "none" } }, ".rating-disabled": { "@layer components": { opacity: 0.6, pointerEvents: "none" } }, ".rating-labeled": { "@layer components": { display: "flex", alignItems: "center", gap: "0.5rem" } }, ".rating-label": { "@layer components": { fontSize: "0.875rem", color: "var(--color-on-surface-variant)" } }, ".rating-count": { "@layer components": { fontSize: "0.75rem", color: "var(--color-on-surface-variant)", marginLeft: "0.25rem" } }, ".rating:not(.rating-readonly) .rating-item:hover ~ .rating-item": { "@layer components": { color: "var(--color-outline)" } }, ".rating:not(.rating-readonly):hover .rating-item": { "@layer components": { color: "var(--color-warning)" } }, ".rating-primary:not(.rating-readonly):hover .rating-item": { "@layer components": { color: "var(--color-primary)" } }, ".rating-secondary:not(.rating-readonly):hover .rating-item": { "@layer components": { color: "var(--color-secondary)" } }, ".rating-tertiary:not(.rating-readonly):hover .rating-item": { "@layer components": { color: "var(--color-tertiary)" } }, ".rating-info:not(.rating-readonly):hover .rating-item": { "@layer components": { color: "var(--color-info)" } }, ".rating-success:not(.rating-readonly):hover .rating-item": { "@layer components": { color: "var(--color-success)" } }, ".rating-error:not(.rating-readonly):hover .rating-item": { "@layer components": { color: "var(--color-error)" } }, ".rating-accent:not(.rating-readonly):hover .rating-item": { "@layer components": { color: "var(--color-accent)" } }, ".rating-neutral:not(.rating-readonly):hover .rating-item": { "@layer components": { color: "var(--color-neutral)" } }, ".rating-base:not(.rating-readonly):hover .rating-item": { "@layer components": { color: "var(--color-base-content)" } }, ".rating-item:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-warning) 20%, transparent)", borderRadius: "var(--radius-xs)" } }, ".rating-primary .rating-item:focus-visible": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-primary) 20%, transparent)" } }, ".rating-secondary .rating-item:focus-visible": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-secondary) 20%, transparent)" } }, ".rating-tertiary .rating-item:focus-visible": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-tertiary) 20%, transparent)" } }, ".rating-info .rating-item:focus-visible": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-info) 20%, transparent)" } }, ".rating-success .rating-item:focus-visible": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-success) 20%, transparent)" } }, ".rating-error .rating-item:focus-visible": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-error) 20%, transparent)" } }, ".rating-warning .rating-item:focus-visible": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-warning) 20%, transparent)" } }, ".rating-accent .rating-item:focus-visible": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-accent) 20%, transparent)" } }, ".rating-neutral .rating-item:focus-visible": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-neutral) 20%, transparent)" } }, ".rating-base .rating-item:focus-visible": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-base-content) 20%, transparent)" } }, ".rating-display": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.375rem" } }, ".rating-display-value": { "@layer components": { fontSize: "0.875rem", fontWeight: 600, color: "var(--color-on-surface)" } }, ".rating-display-stars": { "@layer components": { display: "flex", gap: "0.0625rem", color: "var(--color-warning)" } }, ".rating-display-max": { "@layer components": { fontSize: "0.75rem", color: "var(--color-on-surface-variant)" } }, ".rating-compact": { "@layer components": { gap: "0" } }, ".rating-compact .rating-item": { "@layer components": { padding: "0.125rem" } }, ".rating-animated .rating-item": { "@layer components": { transition: "color 150ms ease-in-out, transform 200ms cubic-bezier(0.34, 1.56, 0.64, 1)" } }, ".rating-animated .rating-item.filled": [{ "@layer components": { animation: "rating-pop 300ms ease-out" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { animation: "none" } } }], "@keyframes rating-pop": { "0%": { transform: "scale(1)" }, "50%": { transform: "scale(1.3)" }, "100%": { transform: "scale(1)" } }, ".rating-item, \n .rating-animated .rating-item": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "color 0ms" } } }, ".segment-control": { "@layer components": { display: "inline-flex", alignItems: "stretch", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface-container)", border: "1px solid var(--color-outline)", borderRadius: "var(--radius-xl)", padding: "0.25rem", gap: "0.25rem" } }, ".segment-item": [{ "@layer components": { position: "relative", display: "inline-flex", alignItems: "center", justifyContent: "center", gap: "0.5rem", padding: "0.5rem 1rem", fontSize: "0.875rem", fontWeight: 500, lineHeight: "1.25rem", color: "var(--color-on-surface)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-lg)", cursor: "pointer", transition: "background-color 150ms ease-in-out, color 150ms ease-in-out", userSelect: "none", whiteSpace: "nowrap" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }], ".segment-item:hover:not(:disabled):not(.segment-item-active)": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".segment-item:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".segment-item:disabled": { "@layer components": { opacity: 0.38, cursor: "not-allowed" } }, ".segment-item-active": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".segment-item-active:hover:not(:disabled)": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-primary-container), black 5%)" } }, ".segment-icon": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.125rem", height: "1.125rem" } }, ".segment-control-sm": { "@layer components": { padding: "0.125rem", gap: "0.125rem", borderRadius: "var(--radius-lg)" } }, ".segment-control-sm .segment-item": { "@layer components": { padding: "0.375rem 0.75rem", fontSize: "0.75rem", lineHeight: "1rem", borderRadius: "var(--radius-md)" } }, ".segment-control-lg": { "@layer components": { padding: "0.375rem", gap: "0.375rem", borderRadius: "var(--radius-2xl)" } }, ".segment-control-lg .segment-item": { "@layer components": { padding: "0.75rem 1.5rem", fontSize: "1rem", lineHeight: "1.5rem", borderRadius: "var(--radius-xl)" } }, ".segment-control-primary .segment-item-active": { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)" } }, ".segment-control-secondary .segment-item-active": { "@layer components": { backgroundColor: "var(--color-secondary-container)", color: "var(--color-on-secondary-container)" } }, ".segment-control-tertiary .segment-item-active": { "@layer components": { backgroundColor: "var(--color-tertiary-container)", color: "var(--color-on-tertiary-container)" } }, ".segment-control-info .segment-item-active": { "@layer components": { backgroundColor: "var(--color-info-container)", color: "var(--color-on-info-container)" } }, ".segment-control-success .segment-item-active": { "@layer components": { backgroundColor: "var(--color-success-container)", color: "var(--color-on-success-container)" } }, ".segment-control-warning .segment-item-active": { "@layer components": { backgroundColor: "var(--color-warning-container)", color: "var(--color-on-warning-container)" } }, ".segment-control-error .segment-item-active": { "@layer components": { backgroundColor: "var(--color-error-container)", color: "var(--color-on-error-container)" } }, ".segment-control-accent .segment-item-active": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-accent) 15%, var(--color-surface))", color: "var(--color-on-surface)" } }, ".segment-control-neutral .segment-item-active": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface))", color: "var(--color-on-surface)" } }, ".segment-control-base .segment-item-active": { "@layer components": { backgroundColor: "var(--color-base-200)", color: "var(--color-base-content)" } }, ".segment-control-full": { "@layer components": { display: "flex", width: "100%" } }, ".segment-control-full .segment-item": { "@layer components": { flex: 1 } }, ".segment-control-outlined": { "@layer components": { backgroundColor: "transparent", padding: "0", gap: "0" } }, ".segment-control-outlined .segment-item": { "@layer components": { border: "1px solid var(--color-outline)", borderRadius: "0", marginLeft: "-1px" } }, ".segment-control-outlined .segment-item:first-child": { "@layer components": { marginLeft: "0", borderTopLeftRadius: "1.25rem", borderBottomLeftRadius: "1.25rem" } }, ".segment-control-outlined .segment-item:last-child": { "@layer components": { borderTopRightRadius: "1.25rem", borderBottomRightRadius: "1.25rem" } }, ".segment-control-outlined .segment-item-active": { "@layer components": { backgroundColor: "var(--color-primary-container)", borderColor: "var(--color-primary)", zIndex: 1 } }, ".segment-control-ghost": { "@layer components": { backgroundColor: "transparent", borderColor: "transparent" } }, ".segment-control-icon-only .segment-item": { "@layer components": { padding: "0.625rem" } }, ".segment-control-icon-only.segment-control-sm .segment-item": { "@layer components": { padding: "0.5rem" } }, ".segment-control-icon-only.segment-control-lg .segment-item": { "@layer components": { padding: "0.75rem" } }, ".segment-control-multi .segment-item-active": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".select:hover:not(:disabled)": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".select-filled": { "@layer components": { backgroundColor: "var(--color-surface-container)", border: "none", borderBottom: "2px solid var(--color-outline)", borderRadius: "var(--radius-sm) var(--radius-sm) 0 0" } }, ".select-filled:hover:not(:disabled)": { "@layer components": { backgroundColor: "var(--color-surface-container-high)", borderBottomColor: "var(--color-on-surface)" } }, ".select-filled:focus-visible": { "@layer components": { borderBottomColor: "var(--color-primary)", boxShadow: "none" } }, ".select-filled.select-primary:focus-visible": { "@layer components": { borderBottomColor: "var(--color-primary)" } }, ".select-filled.select-secondary:focus-visible": { "@layer components": { borderBottomColor: "var(--color-secondary)" } }, ".select-filled.select-tertiary:focus-visible": { "@layer components": { borderBottomColor: "var(--color-tertiary)" } }, ".select-filled.select-info:focus-visible": { "@layer components": { borderBottomColor: "var(--color-info)" } }, ".select-filled.select-success:focus-visible": { "@layer components": { borderBottomColor: "var(--color-success)" } }, ".select-filled.select-warning:focus-visible": { "@layer components": { borderBottomColor: "var(--color-warning)" } }, ".select-filled.select-error:focus-visible": { "@layer components": { borderBottomColor: "var(--color-error)" } }, ".select-filled.select-accent:focus-visible": { "@layer components": { borderBottomColor: "var(--color-accent)" } }, ".select-filled.select-neutral:focus-visible": { "@layer components": { borderBottomColor: "var(--color-neutral)" } }, ".select-filled.select-base:focus-visible": { "@layer components": { borderBottomColor: "var(--color-base-content)" } }, ".select-outlined": { "@layer components": { backgroundColor: "transparent", border: "1px solid var(--color-outline)", borderRadius: "var(--radius-sm)" } }, ".select-primary": { "@layer components": { color: "var(--color-primary)" } }, ".select-secondary": { "@layer components": { color: "var(--color-secondary)" } }, ".select-tertiary": { "@layer components": { color: "var(--color-tertiary)" } }, ".select-info": { "@layer components": { color: "var(--color-info)" } }, ".select-success": { "@layer components": { color: "var(--color-success)" } }, ".select-warning": { "@layer components": { color: "var(--color-warning)" } }, ".select-error": { "@layer components": { color: "var(--color-error)" } }, ".select-accent": { "@layer components": { color: "var(--color-accent)" } }, ".select-neutral": { "@layer components": { color: "var(--color-neutral)" } }, ".select-base": { "@layer components": { color: "var(--color-base-content)" } }, ".select-container": { "@layer components": { position: "relative", display: "flex", flexDirection: "column", gap: "0.25rem", width: "100%" } }, ".select-label": { "@layer components": { fontSize: "0.875rem", fontWeight: 500, color: "var(--color-on-surface)" } }, ".select-helper": { "@layer components": { fontSize: "0.75rem", color: "var(--color-on-surface-variant)" } }, ".select-container-error .select-helper": { "@layer components": { color: "var(--color-error)" } }, ".select-group": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.25rem" } }, ".select-multiple": { "@layer components": { padding: "0.5rem", height: "auto", minHeight: "6rem", backgroundImage: "none" } }, ".select-multiple option": { "@layer components": { padding: "0.5rem 0.75rem", borderRadius: "var(--radius-xs)" } }, ".select-multiple option:checked": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".select-ghost": { "@layer components": { backgroundColor: "transparent", borderColor: "transparent" } }, ".select-ghost:hover:not(:disabled)": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "transparent" } }, ".select-ghost:focus-visible": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "transparent", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".slider": { "@layer components": { position: "relative", display: "flex", alignItems: "center", width: "100%", height: "2.5rem", touchAction: "none", userSelect: "none", color: "var(--color-on-surface)" } }, ".slider-track": { "@layer components": { position: "relative", width: "100%", height: "0.25rem", backgroundColor: "var(--color-surface-container-highest)", borderRadius: "var(--radius-full)" } }, ".slider-track-filled": { "@layer components": { position: "absolute", top: "0", left: "0", height: "100%", backgroundColor: "var(--color-primary)", borderRadius: "var(--radius-full)" } }, ".slider-thumb": { "@layer components": { position: "absolute", top: "50%", width: "1.25rem", height: "1.25rem", backgroundColor: "var(--color-primary)", border: "none", borderRadius: "var(--radius-full)", boxShadow: "0 2px 4px color-mix(in srgb, var(--color-shadow) 20%, transparent)", transform: "translate(-50%, -50%)", cursor: "grab", transition: "box-shadow 150ms ease-in-out, transform 150ms ease-in-out" } }, ".slider-thumb:hover": { "@layer components": { boxShadow: "0 0 0 8px var(--color-primary-container), 0 2px 4px color-mix(in srgb, var(--color-shadow) 20%, transparent)" } }, ".slider-thumb:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 8px var(--color-primary-container), 0 2px 4px color-mix(in srgb, var(--color-shadow) 20%, transparent)" } }, ".slider-thumb:active": { "@layer components": { cursor: "grabbing", transform: "translate(-50%, -50%) scale(1.1)" } }, ".slider-thumb-label": { "@layer components": { position: "absolute", bottom: "100%", left: "50%", transform: "translateX(-50%)", padding: "0.25rem 0.5rem", marginBottom: "0.5rem", fontSize: "0.75rem", fontWeight: 500, color: "var(--color-primary-content)", backgroundColor: "var(--color-primary)", borderRadius: "var(--radius-xs)", whiteSpace: "nowrap", opacity: 0, visibility: "hidden", transition: "opacity 150ms ease-out, visibility 150ms ease-out" } }, ".slider-thumb-label::after": { "@layer components": { content: "''", position: "absolute", top: "100%", left: "50%", transform: "translateX(-50%)", border: "0.25rem solid transparent", borderTopColor: "var(--color-primary)" } }, ".slider-thumb:hover .slider-thumb-label, \n .slider-thumb:focus-visible .slider-thumb-label, \n .slider-thumb:active .slider-thumb-label": { "@layer components": { opacity: 1, visibility: "visible" } }, ".slider-labels-always .slider-thumb-label": { "@layer components": { opacity: 1, visibility: "visible" } }, ".slider-marks": { "@layer components": { position: "absolute", top: "50%", left: "0", right: "0", display: "flex", justifyContent: "space-between", transform: "translateY(-50%)", pointerEvents: "none" } }, ".slider-mark": { "@layer components": { position: "relative", width: "0.125rem", height: "0.5rem", backgroundColor: "var(--color-outline)", borderRadius: "var(--radius-full)" } }, ".slider-mark-active": { "@layer components": { backgroundColor: "var(--color-primary-content)" } }, ".slider-mark-label": { "@layer components": { position: "absolute", top: "1rem", left: "50%", transform: "translateX(-50%)", fontSize: "0.75rem", color: "var(--color-on-surface-variant)", whiteSpace: "nowrap" } }, ".slider-labels": { "@layer components": { display: "flex", justifyContent: "space-between", marginTop: "0.25rem", fontSize: "0.75rem", color: "var(--color-on-surface-variant)" } }, ".slider-sm": { "@layer components": { height: "2rem" } }, ".slider-sm .slider-track": { "@layer components": { height: "0.125rem" } }, ".slider-sm .slider-thumb": { "@layer components": { width: "1rem", height: "1rem" } }, ".slider-lg": { "@layer components": { height: "3rem" } }, ".slider-lg .slider-track": { "@layer components": { height: "0.375rem" } }, ".slider-lg .slider-thumb": { "@layer components": { width: "1.5rem", height: "1.5rem" } }, ".slider-primary .slider-track-filled, \n .slider-primary .slider-thumb": { "@layer components": { backgroundColor: "var(--color-primary)" } }, ".slider-primary .slider-mark-active": { "@layer components": { backgroundColor: "var(--color-primary-content)" } }, ".slider-primary .slider-thumb:hover, \n .slider-primary .slider-thumb:focus-visible": { "@layer components": { boxShadow: "0 0 0 8px var(--color-primary-container), 0 2px 4px color-mix(in srgb, var(--color-shadow) 20%, transparent)" } }, ".slider-primary .slider-thumb-label": { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)" } }, ".slider-primary .slider-thumb-label::after": { "@layer components": { borderTopColor: "var(--color-primary)" } }, ".slider-secondary .slider-track-filled, \n .slider-secondary .slider-thumb": { "@layer components": { backgroundColor: "var(--color-secondary)" } }, ".slider-secondary .slider-thumb:hover, \n .slider-secondary .slider-thumb:focus-visible": { "@layer components": { boxShadow: "0 0 0 8px var(--color-secondary-container), 0 2px 4px color-mix(in srgb, var(--color-shadow) 20%, transparent)" } }, ".slider-secondary .slider-mark-active": { "@layer components": { backgroundColor: "var(--color-secondary-content)" } }, ".slider-secondary .slider-thumb-label": { "@layer components": { backgroundColor: "var(--color-secondary)", color: "var(--color-secondary-content)" } }, ".slider-secondary .slider-thumb-label::after": { "@layer components": { borderTopColor: "var(--color-secondary)" } }, ".slider-tertiary .slider-track-filled, \n .slider-tertiary .slider-thumb": { "@layer components": { backgroundColor: "var(--color-tertiary)" } }, ".slider-tertiary .slider-thumb:hover, \n .slider-tertiary .slider-thumb:focus-visible": { "@layer components": { boxShadow: "0 0 0 8px var(--color-tertiary-container), 0 2px 4px color-mix(in srgb, var(--color-shadow) 20%, transparent)" } }, ".slider-tertiary .slider-mark-active": { "@layer components": { backgroundColor: "var(--color-tertiary-content)" } }, ".slider-tertiary .slider-thumb-label": { "@layer components": { backgroundColor: "var(--color-tertiary)", color: "var(--color-tertiary-content)" } }, ".slider-tertiary .slider-thumb-label::after": { "@layer components": { borderTopColor: "var(--color-tertiary)" } }, ".slider-info .slider-track-filled, \n .slider-info .slider-thumb": { "@layer components": { backgroundColor: "var(--color-info)" } }, ".slider-info .slider-thumb:hover, \n .slider-info .slider-thumb:focus-visible": { "@layer components": { boxShadow: "0 0 0 8px var(--color-info-container), 0 2px 4px color-mix(in srgb, var(--color-shadow) 20%, transparent)" } }, ".slider-info .slider-mark-active": { "@layer components": { backgroundColor: "var(--color-info-content)" } }, ".slider-info .slider-thumb-label": { "@layer components": { backgroundColor: "var(--color-info)", color: "var(--color-info-content)" } }, ".slider-info .slider-thumb-label::after": { "@layer components": { borderTopColor: "var(--color-info)" } }, ".slider-success .slider-track-filled, \n .slider-success .slider-thumb": { "@layer components": { backgroundColor: "var(--color-success)" } }, ".slider-success .slider-thumb:hover, \n .slider-success .slider-thumb:focus-visible": { "@layer components": { boxShadow: "0 0 0 8px var(--color-success-container), 0 2px 4px color-mix(in srgb, var(--color-shadow) 20%, transparent)" } }, ".slider-success .slider-mark-active": { "@layer components": { backgroundColor: "var(--color-success-content)" } }, ".slider-success .slider-thumb-label": { "@layer components": { backgroundColor: "var(--color-success)", color: "var(--color-success-content)" } }, ".slider-success .slider-thumb-label::after": { "@layer components": { borderTopColor: "var(--color-success)" } }, ".slider-warning .slider-track-filled, \n .slider-warning .slider-thumb": { "@layer components": { backgroundColor: "var(--color-warning)" } }, ".slider-warning .slider-thumb:hover, \n .slider-warning .slider-thumb:focus-visible": { "@layer components": { boxShadow: "0 0 0 8px var(--color-warning-container), 0 2px 4px color-mix(in srgb, var(--color-shadow) 20%, transparent)" } }, ".slider-warning .slider-mark-active": { "@layer components": { backgroundColor: "var(--color-warning-content)" } }, ".slider-warning .slider-thumb-label": { "@layer components": { backgroundColor: "var(--color-warning)", color: "var(--color-warning-content)" } }, ".slider-warning .slider-thumb-label::after": { "@layer components": { borderTopColor: "var(--color-warning)" } }, ".slider-error .slider-track-filled, \n .slider-error .slider-thumb": { "@layer components": { backgroundColor: "var(--color-error)" } }, ".slider-error .slider-thumb:hover, \n .slider-error .slider-thumb:focus-visible": { "@layer components": { boxShadow: "0 0 0 8px var(--color-error-container), 0 2px 4px color-mix(in srgb, var(--color-shadow) 20%, transparent)" } }, ".slider-error .slider-mark-active": { "@layer components": { backgroundColor: "var(--color-error-content)" } }, ".slider-error .slider-thumb-label": { "@layer components": { backgroundColor: "var(--color-error)", color: "var(--color-error-content)" } }, ".slider-error .slider-thumb-label::after": { "@layer components": { borderTopColor: "var(--color-error)" } }, ".slider-accent .slider-track-filled, \n .slider-accent .slider-thumb": { "@layer components": { backgroundColor: "var(--color-accent)" } }, ".slider-accent .slider-thumb:hover, \n .slider-accent .slider-thumb:focus-visible": { "@layer components": { boxShadow: "0 0 0 8px color-mix(in oklch, var(--color-accent) 15%, var(--color-surface)), 0 2px 4px color-mix(in srgb, var(--color-shadow) 20%, transparent)" } }, ".slider-accent .slider-mark-active": { "@layer components": { backgroundColor: "var(--color-accent-content)" } }, ".slider-accent .slider-thumb-label": { "@layer components": { backgroundColor: "var(--color-accent)", color: "var(--color-accent-content)" } }, ".slider-accent .slider-thumb-label::after": { "@layer components": { borderTopColor: "var(--color-accent)" } }, ".slider-neutral .slider-track-filled, \n .slider-neutral .slider-thumb": { "@layer components": { backgroundColor: "var(--color-neutral)" } }, ".slider-neutral .slider-thumb:hover, \n .slider-neutral .slider-thumb:focus-visible": { "@layer components": { boxShadow: "0 0 0 8px color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface)), 0 2px 4px color-mix(in srgb, var(--color-shadow) 20%, transparent)" } }, ".slider-neutral .slider-mark-active": { "@layer components": { backgroundColor: "var(--color-neutral-content)" } }, ".slider-neutral .slider-thumb-label": { "@layer components": { backgroundColor: "var(--color-neutral)", color: "var(--color-neutral-content)" } }, ".slider-neutral .slider-thumb-label::after": { "@layer components": { borderTopColor: "var(--color-neutral)" } }, ".slider-base .slider-track-filled, \n .slider-base .slider-thumb": { "@layer components": { backgroundColor: "var(--color-base-100)" } }, ".slider-base .slider-thumb:hover, \n .slider-base .slider-thumb:focus-visible": { "@layer components": { boxShadow: "0 0 0 8px var(--color-base-200), 0 2px 4px color-mix(in srgb, var(--color-shadow) 20%, transparent)" } }, ".slider-base .slider-mark-active": { "@layer components": { backgroundColor: "var(--color-base-content)" } }, ".slider-base .slider-thumb-label": { "@layer components": { backgroundColor: "var(--color-base-100)", color: "var(--color-base-content)" } }, ".slider-base .slider-thumb-label::after": { "@layer components": { borderTopColor: "var(--color-base-100)" } }, ".slider-disabled": { "@layer components": { opacity: 0.6, pointerEvents: "none" } }, ".slider-disabled .slider-thumb": { "@layer components": { cursor: "not-allowed" } }, ".slider-range .slider-track-filled": { "@layer components": { left: "var(--slider-start, 0%)", width: "var(--slider-range, 100%)" } }, ".slider-vertical": { "@layer components": { flexDirection: "column", width: "2.5rem", height: "12rem" } }, ".slider-vertical .slider-track": { "@layer components": { width: "0.25rem", height: "100%" } }, ".slider-vertical .slider-track-filled": { "@layer components": { width: "100%", height: "auto", bottom: "0", top: "auto" } }, ".slider-vertical .slider-thumb": { "@layer components": { left: "50%", top: "auto", transform: "translate(-50%, 50%)" } }, ".slider-vertical .slider-thumb-label": { "@layer components": { bottom: "auto", left: "100%", top: "50%", transform: "translateY(-50%)", marginLeft: "0.5rem", marginBottom: "0" } }, ".slider-vertical .slider-thumb-label::after": { "@layer components": { top: "50%", left: "auto", right: "100%", transform: "translateY(-50%)", borderTopColor: "transparent", borderRightColor: "var(--color-primary)" } }, ".slider-secondary.slider-vertical .slider-thumb-label::after": { "@layer components": { borderRightColor: "var(--color-secondary)" } }, ".slider-tertiary.slider-vertical .slider-thumb-label::after": { "@layer components": { borderRightColor: "var(--color-tertiary)" } }, ".slider-info.slider-vertical .slider-thumb-label::after": { "@layer components": { borderRightColor: "var(--color-info)" } }, ".slider-success.slider-vertical .slider-thumb-label::after": { "@layer components": { borderRightColor: "var(--color-success)" } }, ".slider-warning.slider-vertical .slider-thumb-label::after": { "@layer components": { borderRightColor: "var(--color-warning)" } }, ".slider-error.slider-vertical .slider-thumb-label::after": { "@layer components": { borderRightColor: "var(--color-error)" } }, ".slider-accent.slider-vertical .slider-thumb-label::after": { "@layer components": { borderRightColor: "var(--color-accent)" } }, ".slider-neutral.slider-vertical .slider-thumb-label::after": { "@layer components": { borderRightColor: "var(--color-neutral)" } }, ".slider-base.slider-vertical .slider-thumb-label::after": { "@layer components": { borderRightColor: "var(--color-base-100)" } }, ".slider-vertical .slider-marks": { "@layer components": { flexDirection: "column", top: "0", bottom: "0", left: "50%", right: "auto", transform: "translateX(-50%)" } }, ".slider-vertical .slider-mark-label": { "@layer components": { top: "50%", left: "1rem", transform: "translateY(-50%)" } }, ".slider-with-input": { "@layer components": { display: "flex", alignItems: "center", gap: "1rem" } }, ".slider-with-input .slider": { "@layer components": { flex: 1 } }, ".slider-input": { "@layer components": { width: "4rem", padding: "0.5rem", fontSize: "0.875rem", textAlign: "center", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline)", borderRadius: "var(--radius-xs)" } }, ".slider-input:focus": { "@layer components": { outline: "none", borderColor: "currentColor", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".slider-thumb, \n .slider-thumb-label": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".switch": { "@layer components": { "--switch-width": "3.25rem", "--switch-height": "2rem", color: "var(--color-on-surface)", "--switch-thumb-size": "1rem", "--switch-color": "var(--color-primary)", "--switch-content-color": "var(--color-primary-content)", "--switch-container-color": "var(--color-primary-container)", "--switch-track-color": "var(--color-surface-container-highest)", "--switch-border-color": "var(--color-outline)", "--switch-thumb-color": "var(--color-outline)", position: "relative", display: "inline-grid", gridTemplateColumns: "0fr 1fr 1fr", alignItems: "center", width: "var(--switch-width)", height: "var(--switch-height)", margin: "0", padding: "0.25rem", cursor: "pointer", appearance: "none", backgroundColor: "var(--switch-track-color)", border: "2px solid var(--switch-border-color)", borderRadius: "var(--switch-height)", transition: `background-color 200ms ease-in-out,
179
+ border-color 200ms ease-in-out,
180
+ grid-template-columns 200ms ease-in-out !important` } }, ".switch::before": { "@layer components": { content: '""', gridColumn: "2", width: "var(--switch-thumb-size)", height: "var(--switch-thumb-size)", backgroundColor: "var(--switch-thumb-color)", borderRadius: "var(--radius-full)", transition: `background-color 200ms ease-in-out,
181
+ width 200ms ease-in-out,
182
+ margin 200ms ease-in-out !important` } }, ".switch:checked": { "@layer components": { gridTemplateColumns: "1fr 1fr 0fr", backgroundColor: "var(--switch-color)", borderColor: "var(--switch-color)" } }, ".switch:checked::before": { "@layer components": { backgroundColor: "var(--switch-content-color)" } }, ".switch:hover:not(:disabled):not(:checked)": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".switch:hover:not(:disabled):not(:checked)::before": { "@layer components": { backgroundColor: "var(--color-on-surface-variant)" } }, ".switch:checked:hover:not(:disabled)": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--switch-color), black 10%)", borderColor: "color-mix(in oklch, var(--switch-color), black 10%)" } }, ".switch:checked:hover:not(:disabled)::before": { "@layer components": { backgroundColor: "var(--switch-container-color)" } }, ".switch:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, var(--switch-color) 20%, transparent)" } }, ".switch:active:not(:disabled)::before": { "@layer components": { width: "calc(var(--switch-thumb-size) + 0.25rem)" } }, ".switch:checked:active:not(:disabled)::before": { "@layer components": { marginLeft: "-0.25rem" } }, ".switch:disabled": { "@layer components": { cursor: "not-allowed", opacity: 0.38 } }, ".switch:disabled:not(:checked)": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-surface-container-highest) 12%, transparent)", borderColor: "color-mix(in oklch, var(--color-on-surface) 12%, transparent)" } }, ".switch:disabled:not(:checked)::before": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-on-surface) 38%, transparent)" } }, ".switch:disabled:checked": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-on-surface) 12%, transparent)", borderColor: "transparent" } }, ".switch:disabled:checked::before": { "@layer components": { backgroundColor: "var(--color-surface)" } }, ".switch-xs": { "@layer components": { "--switch-width": "2rem", "--switch-height": "1.25rem", "--switch-thumb-size": "0.5rem" } }, ".switch-sm": { "@layer components": { "--switch-width": "2.5rem", "--switch-height": "1.5rem", "--switch-thumb-size": "0.75rem" } }, ".switch-md": { "@layer components": { "--switch-width": "3.25rem", "--switch-height": "2rem", "--switch-thumb-size": "1rem" } }, ".switch-lg": { "@layer components": { "--switch-width": "4rem", "--switch-height": "2.5rem", "--switch-thumb-size": "1.25rem" } }, ".switch-xl": { "@layer components": { "--switch-width": "4.75rem", "--switch-height": "3rem", "--switch-thumb-size": "1.5rem" } }, ".switch-primary": { "@layer components": { "--switch-color": "var(--color-primary)", "--switch-content-color": "var(--color-primary-content)", "--switch-container-color": "var(--color-primary-container)" } }, ".switch-secondary": { "@layer components": { "--switch-color": "var(--color-secondary)", "--switch-content-color": "var(--color-secondary-content)", "--switch-container-color": "var(--color-secondary-container)" } }, ".switch-tertiary": { "@layer components": { "--switch-color": "var(--color-tertiary)", "--switch-content-color": "var(--color-tertiary-content)", "--switch-container-color": "var(--color-tertiary-container)" } }, ".switch-success": { "@layer components": { "--switch-color": "var(--color-success)", "--switch-content-color": "var(--color-success-content)", "--switch-container-color": "var(--color-success-container)" } }, ".switch-warning": { "@layer components": { "--switch-color": "var(--color-warning)", "--switch-content-color": "var(--color-warning-content)", "--switch-container-color": "var(--color-warning-container)" } }, ".switch-error": { "@layer components": { "--switch-color": "var(--color-error)", "--switch-content-color": "var(--color-error-content)", "--switch-container-color": "var(--color-error-container)" } }, ".switch-info": { "@layer components": { "--switch-color": "var(--color-info)", "--switch-content-color": "var(--color-info-content)", "--switch-container-color": "var(--color-info-container)" } }, ".switch-accent": { "@layer components": { "--switch-color": "var(--color-accent)", "--switch-content-color": "var(--color-accent-content)", "--switch-container-color": "color-mix(in oklch, var(--color-accent) 20%, var(--color-surface))" } }, ".switch-neutral": { "@layer components": { "--switch-color": "var(--color-neutral)", "--switch-content-color": "var(--color-neutral-content)", "--switch-container-color": "color-mix(in oklch, var(--color-neutral) 20%, var(--color-surface))" } }, ".switch-base": { "@layer components": { "--switch-color": "var(--color-base-100)", "--switch-content-color": "var(--color-base-content)", "--switch-container-color": "color-mix(in oklch, var(--color-base-100) 20%, var(--color-surface))" } }, ".switch-ghost": { "@layer components": { "--switch-border-color": "transparent", "--switch-track-color": "transparent" } }, ".switch-label": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.75rem", cursor: "pointer", userSelect: "none", fontSize: "0.875rem", color: "var(--color-on-surface)" } }, ".switch-label:has(.switch:disabled)": { "@layer components": { cursor: "not-allowed", opacity: 0.38 } }, ".switch-group": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.75rem" } }, ".switch-group-horizontal": { "@layer components": { flexDirection: "row", flexWrap: "wrap", gap: "1.5rem" } }, ".switch, \n .switch::before": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none !important" } } }, ".textarea-container": { "@layer components": { position: "relative", display: "flex", flexDirection: "column", gap: "0.25rem", width: "100%" } }, ".textarea-label": { "@layer components": { display: "block", fontSize: "0.875rem", fontWeight: 500, lineHeight: "1.25rem", color: "var(--color-on-surface)", marginBottom: "0.25rem" } }, ".textarea-label-floating": { "@layer components": { position: "absolute", top: "0.75rem", left: "1rem", fontSize: "1rem", fontWeight: 400, color: "var(--color-on-surface-variant)", pointerEvents: "none", transition: "all 150ms ease-in-out", transformOrigin: "left top", zIndex: 1 } }, ".textarea:focus ~ .textarea-label-floating, \n .textarea:not(:placeholder-shown) ~ .textarea-label-floating": { "@layer components": { top: "-0.5rem", left: "0.75rem", fontSize: "0.75rem", fontWeight: 500, color: "var(--color-primary)", backgroundColor: "var(--color-surface)", padding: "0 0.25rem" } }, ".textarea-filled ~ .textarea-label-floating": { "@layer components": { backgroundColor: "transparent" } }, ".textarea-filled:focus ~ .textarea-label-floating, \n .textarea-filled:not(:placeholder-shown) ~ .textarea-label-floating": { "@layer components": { top: "0.25rem", left: "0.75rem", backgroundColor: "transparent" } }, ".textarea-helper": { "@layer components": { fontSize: "0.75rem", lineHeight: "1rem", color: "var(--color-on-surface-variant)", marginTop: "0.25rem" } }, ".textarea:hover:not(:disabled)": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".textarea[readonly]": { "@layer components": { backgroundColor: "var(--color-surface-container)", cursor: "default" } }, ".textarea-full": { "@layer components": { width: "100%" } }, ".textarea-filled": { "@layer components": { backgroundColor: "var(--color-surface-container)", border: "none", borderBottom: "2px solid var(--color-outline)", borderRadius: "var(--radius-sm) var(--radius-sm) 0 0" } }, ".textarea-filled:hover:not(:disabled)": { "@layer components": { backgroundColor: "var(--color-surface-container-high)", borderBottomColor: "var(--color-on-surface)" } }, ".textarea-filled:focus-visible": { "@layer components": { borderBottomColor: "var(--color-primary)", boxShadow: "none" } }, ".textarea-filled.textarea-primary:focus-visible": { "@layer components": { borderBottomColor: "var(--color-primary)" } }, ".textarea-filled.textarea-secondary:focus-visible": { "@layer components": { borderBottomColor: "var(--color-secondary)" } }, ".textarea-filled.textarea-tertiary:focus-visible": { "@layer components": { borderBottomColor: "var(--color-tertiary)" } }, ".textarea-filled.textarea-info:focus-visible": { "@layer components": { borderBottomColor: "var(--color-info)" } }, ".textarea-filled.textarea-success:focus-visible": { "@layer components": { borderBottomColor: "var(--color-success)" } }, ".textarea-filled.textarea-warning:focus-visible": { "@layer components": { borderBottomColor: "var(--color-warning)" } }, ".textarea-filled.textarea-error:focus-visible": { "@layer components": { borderBottomColor: "var(--color-error)" } }, ".textarea-filled.textarea-accent:focus-visible": { "@layer components": { borderBottomColor: "var(--color-accent)" } }, ".textarea-filled.textarea-neutral:focus-visible": { "@layer components": { borderBottomColor: "var(--color-neutral)" } }, ".textarea-filled.textarea-base:focus-visible": { "@layer components": { borderBottomColor: "var(--color-base-content)" } }, ".textarea-outlined": { "@layer components": { backgroundColor: "transparent", border: "1px solid var(--color-outline)", borderRadius: "var(--radius-sm)" } }, ".textarea-ghost": { "@layer components": { backgroundColor: "transparent", borderColor: "transparent" } }, ".textarea-ghost:hover:not(:disabled)": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "transparent" } }, ".textarea-ghost:focus-visible": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "transparent", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".textarea-primary": { "@layer components": { color: "var(--color-primary)" } }, ".textarea-secondary": { "@layer components": { color: "var(--color-secondary)" } }, ".textarea-tertiary": { "@layer components": { color: "var(--color-tertiary)" } }, ".textarea-info": { "@layer components": { color: "var(--color-info)" } }, ".textarea-success": { "@layer components": { color: "var(--color-success)" } }, ".textarea-warning": { "@layer components": { color: "var(--color-warning)" } }, ".textarea-error": { "@layer components": { color: "var(--color-error)" } }, ".textarea-accent": { "@layer components": { color: "var(--color-accent)" } }, ".textarea-neutral": { "@layer components": { color: "var(--color-neutral)" } }, ".textarea-base": { "@layer components": { color: "var(--color-base-content)" } }, ".textarea-sm": { "@layer components": { minHeight: "4rem", padding: "0.5rem 0.75rem", fontSize: "0.875rem", lineHeight: "1.25rem", borderRadius: "var(--radius-xs)" } }, ".textarea-lg": { "@layer components": { minHeight: "8rem", padding: "1rem 1.25rem", fontSize: "1.125rem", lineHeight: "1.75rem", borderRadius: "var(--radius-sm)" } }, ".textarea-resize-none": { "@layer components": { resize: "none" } }, ".textarea-resize-vertical": { "@layer components": { resize: "vertical" } }, ".textarea-resize-horizontal": { "@layer components": { resize: "horizontal" } }, ".textarea-resize-both": { "@layer components": { resize: "both" } }, ".textarea-auto-resize, \n .textarea-autosize": { "@layer components": { resize: "none", overflow: "hidden", minHeight: "3rem", fieldSizing: "content" } }, ".textarea-counter": { "@layer components": { fontSize: "0.75rem", lineHeight: "1rem", color: "var(--color-on-surface-variant)", textAlign: "right" } }, ".textarea-counter-error, \n .textarea-counter-exceeded": { "@layer components": { color: "var(--color-error)" } }, ".textarea-container-error .textarea-label": { "@layer components": { color: "var(--color-error)" } }, ".textarea-container-error .textarea-helper": { "@layer components": { color: "var(--color-error)" } }, ".textarea-container-error .textarea-label-floating": { "@layer components": { color: "var(--color-error)" } }, ".textarea-container-error .textarea:focus ~ .textarea-label-floating": { "@layer components": { color: "var(--color-error)" } }, ".textarea-container-success .textarea-label": { "@layer components": { color: "var(--color-success)" } }, ".textarea-container-success .textarea-helper": { "@layer components": { color: "var(--color-success)" } }, ".textarea-container-success .textarea-label-floating": { "@layer components": { color: "var(--color-success)" } }, ".textarea-container-success .textarea:focus ~ .textarea-label-floating": { "@layer components": { color: "var(--color-success)" } }, ".textarea, \n .textarea-label-floating": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".theme-controller-item": { "@layer components": { position: "absolute", width: "1px", height: "1px", padding: "0", margin: "-1px", overflow: "hidden", clip: "rect(0, 0, 0, 0)", whiteSpace: "nowrap", border: "0" } }, ".theme-controller-label": { "@layer components": { display: "inline-flex", alignItems: "center", justifyContent: "center", gap: "0.5rem", padding: "0.5rem 1rem", fontSize: "0.875rem", fontWeight: 500, lineHeight: "1.25rem", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", borderRadius: "calc(var(--radius-box, 1.5rem) - 0.25rem)", cursor: "pointer", transition: `background-color 150ms ease-in-out, color 150ms ease-in-out,
183
+ box-shadow 150ms ease-in-out`, userSelect: "none", whiteSpace: "nowrap" } }, ".theme-controller-label:hover": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".theme-controller-item:focus-visible + .theme-controller-label": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".theme-controller-item:checked + .theme-controller-label": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)", boxShadow: "var(--shadow-xs)" } }, ".theme-controller-item:checked + .theme-controller-label:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-primary-container), black 5%)" } }, ".theme-controller": { "@layer components": { display: "inline-flex", alignItems: "stretch", backgroundColor: "var(--color-surface-container)", border: "1px solid var(--color-outline-variant)", borderRadius: "var(--radius-box, 1.5rem)", padding: "0.25rem", gap: "0.125rem" } }, ".theme-controller-sm": { "@layer components": { padding: "0.125rem", borderRadius: "calc(var(--radius-box, 1.5rem) * 0.75)" } }, ".theme-controller-sm .theme-controller-label": { "@layer components": { padding: "0.375rem 0.75rem", fontSize: "0.75rem", lineHeight: "1rem", borderRadius: "calc(var(--radius-box, 1.5rem) * 0.75 - 0.125rem)" } }, ".theme-controller-lg": { "@layer components": { padding: "0.375rem", gap: "0.25rem", borderRadius: "calc(var(--radius-box, 1.5rem) * 1.25)" } }, ".theme-controller-lg .theme-controller-label": { "@layer components": { padding: "0.75rem 1.5rem", fontSize: "1rem", lineHeight: "1.5rem", borderRadius: "calc(var(--radius-box, 1.5rem) * 1.25 - 0.375rem)" } }, ".theme-controller-icon .theme-controller-label": { "@layer components": { padding: "0.5rem" } }, ".theme-controller-icon.theme-controller-sm .theme-controller-label": { "@layer components": { padding: "0.375rem" } }, ".theme-controller-icon.theme-controller-lg .theme-controller-label": { "@layer components": { padding: "0.75rem" } }, ".theme-controller-dropdown": { "@layer components": { position: "relative", display: "inline-block" } }, ".theme-controller-trigger": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.5rem", padding: "0.5rem 0.75rem", fontSize: "0.875rem", fontWeight: 500, lineHeight: "1.25rem", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface-container)", border: "1px solid var(--color-outline-variant)", borderRadius: "var(--radius-field, 0.5rem)", cursor: "pointer", userSelect: "none", transition: "background-color 150ms ease-in-out", listStyle: "none" } }, ".theme-controller-trigger::-webkit-details-marker": { "@layer components": { display: "none" } }, ".theme-controller-trigger:hover": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".theme-controller-trigger:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".theme-controller-trigger::after": { "@layer components": { content: "''", display: "inline-block", width: "0.5rem", height: "0.5rem", borderRight: "2px solid currentColor", borderBottom: "2px solid currentColor", transform: "rotate(45deg)", marginTop: "-0.125rem", transition: "transform 150ms ease-in-out" } }, ".theme-controller-dropdown[open] .theme-controller-trigger::after": { "@layer components": { transform: "rotate(-135deg)", marginTop: "0.125rem" } }, ".theme-controller-menu": { "@layer components": { position: "absolute", top: "calc(100% + 0.25rem)", left: "0", zIndex: 50, minWidth: "100%", backgroundColor: "var(--color-surface-container)", border: "1px solid var(--color-outline-variant)", borderRadius: "var(--radius-field, 0.5rem)", padding: "0.25rem", boxShadow: "var(--shadow-md)", display: "flex", flexDirection: "column", gap: "0.125rem" } }, ".theme-controller-menu .theme-controller-label": { "@layer components": { width: "100%", justifyContent: "flex-start", borderRadius: "calc(var(--radius-field, 0.5rem) - 0.25rem)" } }, ".theme-controller-dropdown-sm .theme-controller-trigger": { "@layer components": { padding: "0.375rem 0.625rem", fontSize: "0.75rem", lineHeight: "1rem" } }, ".theme-controller-dropdown-sm .theme-controller-menu": { "@layer components": { padding: "0.125rem" } }, ".theme-controller-dropdown-sm .theme-controller-menu .theme-controller-label": { "@layer components": { padding: "0.375rem 0.75rem", fontSize: "0.75rem", lineHeight: "1rem" } }, ".theme-controller-dropdown-lg .theme-controller-trigger": { "@layer components": { padding: "0.75rem 1rem", fontSize: "1rem", lineHeight: "1.5rem" } }, ".theme-controller-dropdown-lg .theme-controller-menu": { "@layer components": { padding: "0.375rem" } }, ".theme-controller-dropdown-lg .theme-controller-menu .theme-controller-label": { "@layer components": { padding: "0.75rem 1.5rem", fontSize: "1rem", lineHeight: "1.5rem" } }, ".theme-controller-dropdown-icon .theme-controller-trigger": { "@layer components": { padding: "0.5rem" } }, ".theme-controller-dropdown-icon .theme-controller-trigger::after": { "@layer components": { display: "none" } }, ".theme-controller-dropdown-icon.theme-controller-dropdown-sm .theme-controller-trigger": { "@layer components": { padding: "0.375rem" } }, ".theme-controller-dropdown-icon.theme-controller-dropdown-lg .theme-controller-trigger": { "@layer components": { padding: "0.75rem" } }, ".theme-controller-dropdown-end .theme-controller-menu": { "@layer components": { left: "auto", right: "0" } }, ".theme-controller-label, \n .theme-controller-trigger, \n .theme-controller-trigger::after": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".toggle-btn": [{ "@layer components": { display: "inline-flex", alignItems: "center", justifyContent: "center", gap: "0.5rem", padding: "0.625rem 1rem", fontSize: "0.875rem", fontWeight: 500, lineHeight: "1.25rem", color: "var(--color-on-surface)", backgroundColor: "transparent", border: "1px solid currentColor", borderRadius: "var(--radius-sm)", cursor: "pointer", transition: "all 0.2s cubic-bezier(0.4, 0, 0.2, 1)", userSelect: "none" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }], ".toggle-btn:hover:not(:disabled)": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-surface-variant) 50%, transparent)" } }, ".toggle-btn-active, \n .toggle-btn.active": { "@layer components": { color: "var(--color-on-primary-container)", backgroundColor: "var(--color-primary-container)", borderColor: "var(--color-primary)" } }, ".toggle-btn-active:hover:not(:disabled), \n .toggle-btn.active:hover:not(:disabled)": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-primary-container) 90%, transparent)" } }, ".toggle-btn-primary.toggle-btn-active, \n .toggle-btn-primary.active": { "@layer components": { color: "var(--color-on-primary-container)", backgroundColor: "var(--color-primary-container)", borderColor: "var(--color-primary)" } }, ".toggle-btn-secondary.toggle-btn-active, \n .toggle-btn-secondary.active": { "@layer components": { color: "var(--color-on-secondary-container)", backgroundColor: "var(--color-secondary-container)", borderColor: "var(--color-secondary)" } }, ".toggle-btn-tertiary.toggle-btn-active, \n .toggle-btn-tertiary.active": { "@layer components": { color: "var(--color-on-tertiary-container)", backgroundColor: "var(--color-tertiary-container)", borderColor: "var(--color-tertiary)" } }, ".toggle-btn-info.toggle-btn-active, \n .toggle-btn-info.active": { "@layer components": { color: "var(--color-on-info-container)", backgroundColor: "var(--color-info-container)", borderColor: "var(--color-info)" } }, ".toggle-btn-success.toggle-btn-active, \n .toggle-btn-success.active": { "@layer components": { color: "var(--color-on-success-container)", backgroundColor: "var(--color-success-container)", borderColor: "var(--color-success)" } }, ".toggle-btn-warning.toggle-btn-active, \n .toggle-btn-warning.active": { "@layer components": { color: "var(--color-on-warning-container)", backgroundColor: "var(--color-warning-container)", borderColor: "var(--color-warning)" } }, ".toggle-btn-error.toggle-btn-active, \n .toggle-btn-error.active": { "@layer components": { color: "var(--color-on-error-container)", backgroundColor: "var(--color-error-container)", borderColor: "var(--color-error)" } }, ".toggle-btn-accent.toggle-btn-active, \n .toggle-btn-accent.active": { "@layer components": { color: "var(--color-on-surface)", backgroundColor: "color-mix(in oklch, var(--color-accent) 15%, var(--color-surface))", borderColor: "var(--color-accent)" } }, ".toggle-btn-neutral.toggle-btn-active, \n .toggle-btn-neutral.active": { "@layer components": { color: "var(--color-on-surface)", backgroundColor: "color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface))", borderColor: "var(--color-neutral)" } }, ".toggle-btn-base.toggle-btn-active, \n .toggle-btn-base.active": { "@layer components": { color: "var(--color-base-content)", backgroundColor: "var(--color-base-200)", borderColor: "var(--color-base-content)" } }, ".toggle-btn-ghost": { "@layer components": { backgroundColor: "transparent", borderColor: "transparent" } }, ".toggle-btn-ghost:hover:not(:disabled)": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "transparent" } }, ".toggle-btn-ghost.toggle-btn-primary": { "@layer components": { color: "var(--color-primary)" } }, ".toggle-btn-ghost.toggle-btn-secondary": { "@layer components": { color: "var(--color-secondary)" } }, ".toggle-btn-ghost.toggle-btn-tertiary": { "@layer components": { color: "var(--color-tertiary)" } }, ".toggle-btn-ghost.toggle-btn-info": { "@layer components": { color: "var(--color-info)" } }, ".toggle-btn-ghost.toggle-btn-success": { "@layer components": { color: "var(--color-success)" } }, ".toggle-btn-ghost.toggle-btn-warning": { "@layer components": { color: "var(--color-warning)" } }, ".toggle-btn-ghost.toggle-btn-error": { "@layer components": { color: "var(--color-error)" } }, ".toggle-btn-ghost.toggle-btn-accent": { "@layer components": { color: "var(--color-accent)" } }, ".toggle-btn-ghost.toggle-btn-neutral": { "@layer components": { color: "var(--color-neutral)" } }, ".toggle-btn-ghost.toggle-btn-base": { "@layer components": { color: "var(--color-base-content)" } }, ".toggle-btn:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".toggle-btn:disabled, \n .toggle-btn-disabled": { "@layer components": { opacity: 0.38, cursor: "not-allowed", pointerEvents: "none" } }, ".toggle-btn-sm": { "@layer components": { padding: "0.375rem 0.75rem", fontSize: "0.8125rem", gap: "0.375rem" } }, ".toggle-btn-lg": { "@layer components": { padding: "0.75rem 1.25rem", fontSize: "1rem", gap: "0.625rem" } }, ".toggle-group": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0", border: "1px solid var(--color-outline)", borderRadius: "var(--radius-sm)", padding: "0.25rem", backgroundColor: "color-mix(in oklch, var(--color-surface-variant) 30%, transparent)" } }, ".toggle-group .toggle-btn": { "@layer components": { border: "none", borderRadius: "var(--radius-xs)", margin: "0" } }, ".toggle-group .toggle-btn:not(:last-child)": { "@layer components": { marginRight: "0.125rem" } }, ".toggle-group-vertical": { "@layer components": { flexDirection: "column" } }, ".toggle-group-vertical .toggle-btn:not(:last-child)": { "@layer components": { marginRight: "0", marginBottom: "0.125rem" } }, ".toggle-group-exclusive .toggle-btn": { "@layer components": { flex: 1 } }, ".toggle-btn-icon-only": { "@layer components": { padding: "0.625rem", aspectRatio: "1" } }, ".toggle-btn-icon-only.toggle-btn-sm": { "@layer components": { padding: "0.5rem" } }, ".toggle-btn-icon-only.toggle-btn-lg": { "@layer components": { padding: "0.875rem" } }, ".toggle-icon": { "@layer components": { width: "1.125rem", height: "1.125rem", flexShrink: 0 } }, ".toggle-segmented": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0", backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline-variant)", borderRadius: "var(--radius-sm)", padding: "0.25rem" } }, ".toggle-segmented .toggle-btn": { "@layer components": { border: "none", backgroundColor: "transparent", borderRadius: "var(--radius-xs)" } }, ".toggle-segmented .toggle-btn.toggle-btn-active, \n .toggle-segmented .toggle-btn.active": { "@layer components": { backgroundColor: "var(--color-surface-variant)", borderColor: "transparent", boxShadow: "var(--shadow-sm)" } }, ".toggle-chip": { "@layer components": { borderRadius: "var(--radius-lg)", padding: "0.5rem 1rem" } }, ".toggle-chip.toggle-btn-active, \n .toggle-chip.active": { "@layer components": { backgroundColor: "var(--color-primary-container)", borderColor: "var(--color-primary-container)" } }, ".toggle-outlined": { "@layer components": { backgroundColor: "transparent" } }, ".toggle-outlined.toggle-btn-active, \n .toggle-outlined.active": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-primary) 10%, transparent)" } }, ".toggle-filled": { "@layer components": { backgroundColor: "var(--color-surface-variant)", border: "none" } }, ".toggle-filled.toggle-btn-active, \n .toggle-filled.active": { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)" } }, ".toggle-badge": { "@layer components": { position: "relative" } }, ".toggle-badge::after": { "@layer components": { content: '""', position: "absolute", top: "0.25rem", right: "0.25rem", width: "0.5rem", height: "0.5rem", backgroundColor: "var(--color-error)", borderRadius: "var(--radius-full)", border: "2px solid var(--color-surface)" } }, ".toggle-full": { "@layer components": { width: "100%" } }, ".toggle-group-full": { "@layer components": { width: "100%" } }, ".toggle-group-full .toggle-btn": { "@layer components": { flex: 1 } }, ".toggle-loading": { "@layer components": { position: "relative", pointerEvents: "none" } }, ".toggle-loading::after": [{ "@layer components": { content: '""', position: "absolute", top: "50%", left: "50%", width: "1rem", height: "1rem", marginTop: "-0.5rem", marginLeft: "-0.5rem", border: "2px solid currentColor", borderTopColor: "transparent", borderRadius: "var(--radius-full)", animation: "toggle-spin 0.6s linear infinite" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { animation: "none" } } }], "@keyframes toggle-spin": { "0%": { transform: "rotate(0deg)" }, "100%": { transform: "rotate(360deg)" } }, ".time-input": { "@layer components": { position: "relative", display: "inline-flex", alignItems: "center", width: "100%" } }, ".time-input-field": { "@layer components": { display: "flex", width: "100%", padding: "0.75rem 2.5rem 0.75rem 1rem", fontSize: "1rem", lineHeight: "1.5rem", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface)", border: "1px solid currentColor", borderRadius: "var(--radius-sm)", outline: "none", transition: "border-color 150ms ease-in-out, box-shadow 150ms ease-in-out" } }, ".time-input-field:hover:not(:disabled)": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".time-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".time-input-field:disabled": { "@layer components": { cursor: "not-allowed", opacity: 0.5, backgroundColor: "var(--color-surface-container)" } }, ".time-input-icon": { "@layer components": { position: "absolute", right: "0.75rem", display: "flex", alignItems: "center", justifyContent: "center", width: "1.25rem", height: "1.25rem", color: "var(--color-on-surface-variant)", pointerEvents: "none" } }, ".time-input-segments": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.125rem", padding: "0.75rem 1rem", backgroundColor: "var(--color-surface)", border: "1px solid currentColor", borderRadius: "var(--radius-sm)" } }, ".time-input-segment": { "@layer components": { width: "2rem", padding: "0.25rem", fontSize: "1rem", fontWeight: 500, textAlign: "center", color: "var(--color-on-surface)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-xs)", outline: "none", transition: "background-color 150ms ease-in-out" } }, ".time-input-segment:focus": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".time-input-separator": { "@layer components": { fontSize: "1rem", fontWeight: 500, color: "var(--color-on-surface-variant)" } }, ".time-input-period": { "@layer components": { display: "inline-flex", marginLeft: "0.5rem", backgroundColor: "var(--color-surface-container)", borderRadius: "var(--radius-xs)", padding: "0.125rem" } }, ".time-input-period-btn": { "@layer components": { padding: "0.375rem 0.625rem", fontSize: "0.75rem", fontWeight: 500, color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-xs)", cursor: "pointer", transition: "background-color 150ms ease-in-out, color 150ms ease-in-out" } }, ".time-input-period-btn:hover": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".time-input-period-btn-active": { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)" } }, ".time-input-sm .time-input-field": { "@layer components": { padding: "0.5rem 2rem 0.5rem 0.75rem", fontSize: "0.875rem", borderRadius: "var(--radius-xs)" } }, ".time-input-sm .time-input-segment": { "@layer components": { width: "1.75rem", fontSize: "0.875rem" } }, ".time-input-lg .time-input-field": { "@layer components": { padding: "1rem 3rem 1rem 1.25rem", fontSize: "1.125rem", borderRadius: "var(--radius-sm)" } }, ".time-input-lg .time-input-segment": { "@layer components": { width: "2.5rem", fontSize: "1.125rem" } }, ".time-input-filled .time-input-field, \n .time-input-filled .time-input-segments": { "@layer components": { backgroundColor: "var(--color-surface-container)", border: "none", borderBottom: "2px solid var(--color-outline)", borderRadius: "var(--radius-sm) var(--radius-sm) 0 0" } }, ".time-input-filled .time-input-field:focus, \n .time-input-filled .time-input-segments:focus-within": { "@layer components": { borderBottomColor: "currentColor", boxShadow: "none" } }, ".time-input-primary .time-input-field, \n .time-input-primary .time-input-segments": { "@layer components": { color: "var(--color-primary)" } }, ".time-input-primary .time-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-primary) 10%, transparent)" } }, ".time-input-secondary .time-input-field, \n .time-input-secondary .time-input-segments": { "@layer components": { color: "var(--color-secondary)" } }, ".time-input-secondary .time-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-secondary) 10%, transparent)" } }, ".time-input-tertiary .time-input-field, \n .time-input-tertiary .time-input-segments": { "@layer components": { color: "var(--color-tertiary)" } }, ".time-input-tertiary .time-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-tertiary) 10%, transparent)" } }, ".time-input-info .time-input-field, \n .time-input-info .time-input-segments": { "@layer components": { color: "var(--color-info)" } }, ".time-input-info .time-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-info) 10%, transparent)" } }, ".time-input-success .time-input-field, \n .time-input-success .time-input-segments": { "@layer components": { color: "var(--color-success)" } }, ".time-input-success .time-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-success) 10%, transparent)" } }, ".time-input-warning .time-input-field, \n .time-input-warning .time-input-segments": { "@layer components": { color: "var(--color-warning)" } }, ".time-input-warning .time-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-warning) 10%, transparent)" } }, ".time-input-error .time-input-field, \n .time-input-error .time-input-segments": { "@layer components": { color: "var(--color-error)" } }, ".time-input-error .time-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-error) 10%, transparent)" } }, ".time-input-accent .time-input-field, \n .time-input-accent .time-input-segments": { "@layer components": { color: "var(--color-accent)" } }, ".time-input-accent .time-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-accent) 10%, transparent)" } }, ".time-input-neutral .time-input-field, \n .time-input-neutral .time-input-segments": { "@layer components": { color: "var(--color-neutral)" } }, ".time-input-neutral .time-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-neutral) 10%, transparent)" } }, ".time-input-base .time-input-field, \n .time-input-base .time-input-segments": { "@layer components": { color: "var(--color-base-content)" } }, ".time-input-base .time-input-field:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-base-content) 10%, transparent)" } }, ".time-input-ghost .time-input-field, \n .time-input-ghost .time-input-segments": { "@layer components": { backgroundColor: "transparent", borderColor: "transparent" } }, ".time-input-ghost .time-input-field:focus": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "transparent", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".time-picker-dropdown": { "@layer components": { position: "absolute", top: "100%", left: "0", zIndex: 50, display: "none", minWidth: "12rem", marginTop: "0.25rem", padding: "0.5rem", backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline-variant)", borderRadius: "var(--radius-sm)", boxShadow: "var(--shadow-md)" } }, ".time-picker-dropdown-open": { "@layer components": { display: "block" } }, ".time-picker-columns": { "@layer components": { display: "flex", gap: "0.5rem", maxHeight: "12rem" } }, ".time-picker-column": { "@layer components": { flex: 1, display: "flex", flexDirection: "column", gap: "0.125rem", overflowY: "auto" } }, ".time-picker-option": { "@layer components": { padding: "0.375rem 0.5rem", fontSize: "0.875rem", textAlign: "center", color: "var(--color-on-surface)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-xs)", cursor: "pointer", transition: "background-color 150ms ease-in-out" } }, ".time-picker-option:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".time-picker-option-selected": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".time-input-field, \n .time-input-segment, \n .time-input-period-btn, \n .time-picker-option": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".tree-select": [{ "@layer components": { position: "relative", display: "inline-flex", flexDirection: "column", width: "100%" } }, { "@layer components": { "@supports (anchor-name: --tree-select)": { anchorName: "--tree-select" } } }], ".tree-select-trigger": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "space-between", width: "100%", padding: "0.75rem 1rem", fontSize: "1rem", lineHeight: "1.5rem", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface)", border: "1px solid currentColor", borderRadius: "var(--radius-sm)", cursor: "pointer", transition: "border-color 150ms ease-in-out, box-shadow 150ms ease-in-out" } }, ".tree-select-trigger:hover:not(:disabled)": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".tree-select-trigger:focus": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, '.tree-select-trigger:disabled, \n .tree-select-trigger[aria-disabled="true"]': { "@layer components": { cursor: "not-allowed", opacity: 0.5, backgroundColor: "var(--color-surface-container)" } }, "div.tree-select-trigger": { "@layer components": { userSelect: "none" } }, "div.tree-select-trigger:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".tree-select-value": { "@layer components": { flex: 1, display: "flex", alignItems: "center", gap: "0.5rem", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap", color: "var(--color-on-surface-variant)" } }, ".tree-select-value-selected": { "@layer components": { color: "var(--color-on-surface)" } }, ".tree-select-path": { "@layer components": { overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, ".tree-select-arrow": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.25rem", height: "1.25rem", color: "var(--color-on-surface-variant)", flexShrink: 0, transition: "transform 150ms ease-in-out" } }, ".tree-select-open .tree-select-arrow": { "@layer components": { transform: "rotate(180deg)" } }, ".tree-select-clear": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.25rem", height: "1.25rem", padding: "0", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", flexShrink: 0, transition: "background-color 150ms ease-in-out" } }, ".tree-select-clear:hover": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".tree-select-clear svg": { "@layer components": { width: "1rem", height: "1rem" } }, ".tree-select-dropdown": { "@layer components": { position: "absolute", top: "100%", left: "0", right: "0", zIndex: 50, display: "none", maxHeight: "20rem", marginTop: "0.25rem", padding: "0.5rem", backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline-variant)", borderRadius: "var(--radius-sm)", boxShadow: "var(--shadow-md)", overflowY: "auto" } }, ".tree-select-open .tree-select-dropdown": { "@layer components": { display: "block" } }, ".tree-select-dropdown[popover]": [{ "@layer components": { position: "absolute", inset: "unset", margin: "0", border: "1px solid var(--color-outline-variant)" } }, { "@layer components": { "@supports (anchor-name: --tree-select)": { positionAnchor: "--tree-select", top: "anchor(bottom)", left: "anchor(left)", right: "anchor(right)", positionTryFallbacks: "flip-block" } } }], ".tree-select-dropdown[popover]:popover-open": { "@layer components": { display: "block" } }, ".tree-select-search": { "@layer components": { display: "flex", padding: "0.5rem", marginBottom: "0.5rem", borderBottom: "1px solid var(--color-outline-variant)" } }, ".tree-select-search-input": { "@layer components": { flex: 1, padding: "0.5rem 0.75rem", fontSize: "0.875rem", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface-container)", border: "none", borderRadius: "var(--radius-xs)", outline: "none" } }, ".tree-select-search-input:focus": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".tree-select-options": { "@layer components": { display: "flex", flexDirection: "column" } }, ".tree-select-node": { "@layer components": { display: "flex", alignItems: "center", gap: "0.5rem", padding: "0.5rem 0.75rem", fontSize: "0.875rem", color: "var(--color-on-surface)", backgroundColor: "transparent", borderRadius: "var(--radius-xs)", cursor: "pointer", transition: "background-color 150ms ease-in-out" } }, ".tree-select-node:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".tree-select-node-selected": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".tree-select-node-selected:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-primary-container), black 5%)" } }, ".tree-select-node-leaf": { "@layer components": { paddingLeft: "2rem" } }, ".tree-select-node-toggle": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.25rem", height: "1.25rem", padding: "0", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-xs)", cursor: "pointer", flexShrink: 0, transition: "transform 150ms ease-in-out" } }, ".tree-select-node-toggle:hover": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".tree-select-node-expanded .tree-select-node-toggle, \n .tree-select-node-expanded > .tree-select-node-toggle": { "@layer components": { transform: "rotate(90deg)" } }, ".tree-select-node-icon": { "@layer components": { width: "1rem", height: "1rem" } }, ".tree-select-node-label": { "@layer components": { flex: 1, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, ".tree-select-node-custom-icon": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.25rem", height: "1.25rem", color: "var(--color-on-surface-variant)", flexShrink: 0 } }, ".tree-select-children": { "@layer components": { display: "none", paddingLeft: "1.5rem" } }, ".tree-select-node-expanded + .tree-select-children": { "@layer components": { display: "block" } }, ".tree-select-checkbox": { "@layer components": { display: "flex", alignItems: "center", cursor: "pointer" } }, ".tree-select-checkbox-input": { "@layer components": { position: "absolute", width: "0", height: "0", opacity: 0 } }, ".tree-select-checkbox-box": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1rem", height: "1rem", backgroundColor: "transparent", border: "2px solid var(--color-on-surface-variant)", borderRadius: "var(--radius-xs)", transition: "background-color 150ms ease-in-out, border-color 150ms ease-in-out" } }, ".tree-select-checkbox-input:checked + .tree-select-checkbox-box": { "@layer components": { backgroundColor: "var(--color-primary)", borderColor: "var(--color-primary)" } }, ".tree-select-checkbox-input:checked + .tree-select-checkbox-box::after": { "@layer components": { content: "''", display: "block", width: "0.375rem", height: "0.625rem", border: "2px solid var(--color-primary-content)", borderWidth: "0 2px 2px 0", transform: "rotate(45deg) translateY(-1px)" } }, ".tree-select-empty": { "@layer components": { padding: "1rem", textAlign: "center", color: "var(--color-on-surface-variant)", fontSize: "0.875rem" } }, ".tree-select-sm .tree-select-trigger": { "@layer components": { padding: "0.5rem 0.75rem", fontSize: "0.875rem", borderRadius: "var(--radius-xs)" } }, ".tree-select-lg .tree-select-trigger": { "@layer components": { padding: "1rem 1.25rem", fontSize: "1.125rem", borderRadius: "var(--radius-sm)" } }, ".tree-select-outlined .tree-select-trigger": { "@layer components": { backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline)" } }, ".tree-select-filled .tree-select-trigger": { "@layer components": { backgroundColor: "var(--color-surface-container)", border: "none", borderBottom: "2px solid var(--color-outline)", borderRadius: "var(--radius-sm) var(--radius-sm) 0 0" } }, ".tree-select-filled .tree-select-trigger:focus": { "@layer components": { borderBottomColor: "currentColor", boxShadow: "none" } }, ".tree-select-multiple .tree-select-value": { "@layer components": { flexWrap: "wrap", gap: "0.25rem" } }, ".tree-select-primary .tree-select-trigger": { "@layer components": { color: "var(--color-primary)" } }, ".tree-select-primary .tree-select-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-primary) 10%, transparent)" } }, ".tree-select-secondary .tree-select-trigger": { "@layer components": { color: "var(--color-secondary)" } }, ".tree-select-secondary .tree-select-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-secondary) 10%, transparent)" } }, ".tree-select-tertiary .tree-select-trigger": { "@layer components": { color: "var(--color-tertiary)" } }, ".tree-select-tertiary .tree-select-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-tertiary) 10%, transparent)" } }, ".tree-select-info .tree-select-trigger": { "@layer components": { color: "var(--color-info)" } }, ".tree-select-info .tree-select-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-info) 10%, transparent)" } }, ".tree-select-success .tree-select-trigger": { "@layer components": { color: "var(--color-success)" } }, ".tree-select-success .tree-select-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-success) 10%, transparent)" } }, ".tree-select-warning .tree-select-trigger": { "@layer components": { color: "var(--color-warning)" } }, ".tree-select-warning .tree-select-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-warning) 10%, transparent)" } }, ".tree-select-error .tree-select-trigger": { "@layer components": { color: "var(--color-error)" } }, ".tree-select-error .tree-select-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-error) 10%, transparent)" } }, ".tree-select-accent .tree-select-trigger": { "@layer components": { color: "var(--color-accent)" } }, ".tree-select-accent .tree-select-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-accent) 10%, transparent)" } }, ".tree-select-neutral .tree-select-trigger": { "@layer components": { color: "var(--color-neutral)" } }, ".tree-select-neutral .tree-select-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-neutral) 10%, transparent)" } }, ".tree-select-base .tree-select-trigger": { "@layer components": { color: "var(--color-base-content)" } }, ".tree-select-base .tree-select-trigger:focus": { "@layer components": { boxShadow: "0 0 0 3px color-mix(in oklch, var(--color-base-content) 10%, transparent)" } }, ".tree-select-ghost .tree-select-trigger": { "@layer components": { backgroundColor: "transparent", borderColor: "transparent" } }, ".tree-select-ghost .tree-select-trigger:focus": { "@layer components": { backgroundColor: "var(--color-surface-container)", borderColor: "transparent", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".tree-select-disabled .tree-select-trigger": { "@layer components": { cursor: "not-allowed", opacity: 0.5, backgroundColor: "var(--color-surface-container)" } }, ".tree-select-loading .tree-select-trigger": { "@layer components": { cursor: "wait" } }, ".tree-select-spinner": [{ "@layer components": { display: "inline-block", width: "1rem", height: "1rem", border: "2px solid var(--color-outline)", borderTopColor: "var(--color-primary)", borderRadius: "var(--radius-full)", animation: "tree-select-spin 0.8s linear infinite" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { animation: "none" } } }], "@keyframes tree-select-spin": { to: { transform: "rotate(360deg)" } }, ".tree-select-tags": { "@layer components": { display: "flex", flexWrap: "wrap", gap: "0.25rem", flex: 1 } }, ".tree-select-tag": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.25rem", padding: "0.125rem 0.5rem", fontSize: "0.75rem", backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)", borderRadius: "var(--radius-lg)" } }, ".tree-select-tag-remove": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "0.875rem", height: "0.875rem", padding: "0", color: "inherit", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", opacity: 0.7 } }, ".tree-select-tag-remove:hover": { "@layer components": { opacity: 1, backgroundColor: "color-mix(in oklch, currentColor 10%, transparent)" } }, ".tree-select-trigger, \n .tree-select-arrow, \n .tree-select-node-toggle, \n .tree-select-node, \n .tree-select-checkbox-box": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".alert": { "@layer components": { display: "flex", alignItems: "flex-start", gap: "0.75rem", padding: "1rem", borderRadius: "var(--radius-sm)", backgroundColor: "var(--color-surface-container)", color: "var(--color-on-surface)", border: "1px solid var(--color-outline)" } }, ".alert-icon": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.5rem", height: "1.5rem", fontSize: "1.25rem", flexShrink: 0 } }, ".alert-content": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.25rem", flex: 1, minWidth: "0" } }, ".alert-title": { "@layer components": { fontSize: "0.875rem", fontWeight: 600, lineHeight: "1.25rem" } }, ".alert-description": { "@layer components": { fontSize: "0.875rem", lineHeight: "1.25rem", opacity: 0.9 } }, ".alert-close": [{ "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.5rem", height: "1.5rem", fontSize: "1rem", color: "currentColor", opacity: 0.7, backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-xs)", cursor: "pointer", transition: "opacity 150ms ease-in-out", flexShrink: 0, marginLeft: "auto" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }], ".alert-close:hover": { "@layer components": { opacity: 1 } }, ".alert-close:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".alert-info": { "@layer components": { backgroundColor: "var(--color-info-container)", color: "var(--color-on-info-container)", borderColor: "transparent" } }, ".alert-success": { "@layer components": { backgroundColor: "var(--color-success-container)", color: "var(--color-on-success-container)", borderColor: "transparent" } }, ".alert-warning": { "@layer components": { backgroundColor: "var(--color-warning-container)", color: "var(--color-on-warning-container)", borderColor: "transparent" } }, ".alert-error": { "@layer components": { backgroundColor: "var(--color-error-container)", color: "var(--color-on-error-container)", borderColor: "transparent" } }, ".alert-primary": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)", borderColor: "transparent" } }, ".alert-secondary": { "@layer components": { backgroundColor: "var(--color-secondary-container)", color: "var(--color-on-secondary-container)", borderColor: "transparent" } }, ".alert-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary-container)", color: "var(--color-on-tertiary-container)", borderColor: "transparent" } }, ".alert-accent": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-accent) 15%, var(--color-surface))", color: "var(--color-on-surface)", borderColor: "transparent" } }, ".alert-neutral": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface))", color: "var(--color-on-surface)", borderColor: "transparent" } }, ".alert-base": { "@layer components": { backgroundColor: "var(--color-base-200)", color: "var(--color-base-content)", borderColor: "transparent" } }, ".alert-filled.alert-info": { "@layer components": { backgroundColor: "var(--color-info)", color: "var(--color-info-content)" } }, ".alert-filled.alert-success": { "@layer components": { backgroundColor: "var(--color-success)", color: "var(--color-success-content)" } }, ".alert-filled.alert-warning": { "@layer components": { backgroundColor: "var(--color-warning)", color: "var(--color-warning-content)" } }, ".alert-filled.alert-error": { "@layer components": { backgroundColor: "var(--color-error)", color: "var(--color-error-content)" } }, ".alert-filled.alert-primary": { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)" } }, ".alert-filled.alert-secondary": { "@layer components": { backgroundColor: "var(--color-secondary)", color: "var(--color-secondary-content)" } }, ".alert-filled.alert-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary)", color: "var(--color-tertiary-content)" } }, ".alert-filled.alert-accent": { "@layer components": { backgroundColor: "var(--color-accent)", color: "var(--color-accent-content)" } }, ".alert-filled.alert-neutral": { "@layer components": { backgroundColor: "var(--color-neutral)", color: "var(--color-neutral-content)" } }, ".alert-filled.alert-base": { "@layer components": { backgroundColor: "var(--color-base-100)", color: "var(--color-base-content)" } }, ".alert-outlined": { "@layer components": { backgroundColor: "transparent" } }, ".alert-outlined.alert-info": { "@layer components": { borderColor: "var(--color-info)", color: "var(--color-info)" } }, ".alert-outlined.alert-success": { "@layer components": { borderColor: "var(--color-success)", color: "var(--color-success)" } }, ".alert-outlined.alert-warning": { "@layer components": { borderColor: "var(--color-warning)", color: "var(--color-warning)" } }, ".alert-outlined.alert-error": { "@layer components": { borderColor: "var(--color-error)", color: "var(--color-error)" } }, ".alert-outlined.alert-primary": { "@layer components": { borderColor: "var(--color-primary)", color: "var(--color-primary)" } }, ".alert-outlined.alert-secondary": { "@layer components": { borderColor: "var(--color-secondary)", color: "var(--color-secondary)" } }, ".alert-outlined.alert-tertiary": { "@layer components": { borderColor: "var(--color-tertiary)", color: "var(--color-tertiary)" } }, ".alert-outlined.alert-accent": { "@layer components": { borderColor: "var(--color-accent)", color: "var(--color-accent)" } }, ".alert-outlined.alert-neutral": { "@layer components": { borderColor: "var(--color-neutral)", color: "var(--color-neutral)" } }, ".alert-outlined.alert-base": { "@layer components": { borderColor: "var(--color-base-content)", color: "var(--color-base-content)" } }, ".alert-ghost": { "@layer components": { backgroundColor: "transparent", borderColor: "transparent" } }, ".alert-ghost.alert-primary": { "@layer components": { color: "var(--color-primary)" } }, ".alert-ghost.alert-secondary": { "@layer components": { color: "var(--color-secondary)" } }, ".alert-ghost.alert-tertiary": { "@layer components": { color: "var(--color-tertiary)" } }, ".alert-ghost.alert-info": { "@layer components": { color: "var(--color-info)" } }, ".alert-ghost.alert-success": { "@layer components": { color: "var(--color-success)" } }, ".alert-ghost.alert-warning": { "@layer components": { color: "var(--color-warning)" } }, ".alert-ghost.alert-error": { "@layer components": { color: "var(--color-error)" } }, ".alert-ghost.alert-accent": { "@layer components": { color: "var(--color-accent)" } }, ".alert-ghost.alert-neutral": { "@layer components": { color: "var(--color-neutral)" } }, ".alert-ghost.alert-base": { "@layer components": { color: "var(--color-base-content)" } }, ".alert-dismissible": { "@layer components": { paddingRight: "2.5rem", position: "relative" } }, ".alert-dismissible .alert-close": { "@layer components": { position: "absolute", top: "0.75rem", right: "0.75rem" } }, ".alert-compact": { "@layer components": { padding: "0.625rem 0.875rem", gap: "0.5rem" } }, ".alert-compact .alert-icon": { "@layer components": { width: "1.25rem", height: "1.25rem", fontSize: "1rem" } }, ".alert-compact .alert-title, \n .alert-compact .alert-description": { "@layer components": { fontSize: "0.8125rem" } }, ".alert-actions": { "@layer components": { display: "flex", gap: "0.5rem", marginTop: "0.5rem" } }, ".alert-filled .alert-actions .btn-text": { "@layer components": { color: "inherit" } }, ".alert-filled .alert-actions .btn-text:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, currentColor 12%, transparent)" } }, ".alert-banner": { "@layer components": { borderRadius: "0", borderLeft: "none", borderRight: "none" } }, "dialog.dialog": { "@layer components": { position: "fixed", margin: "auto", padding: "0", border: "none", width: "100%", maxWidth: "28rem", maxHeight: "calc(100vh - 4rem)", backgroundColor: "var(--color-surface)", color: "var(--color-on-surface)", borderRadius: "var(--radius-2xl)", boxShadow: "var(--shadow-2xl)", overflow: "hidden" } }, "dialog.dialog::backdrop": { "@layer components": { backgroundColor: "color-mix(in srgb, var(--color-scrim) 50%, transparent)" } }, ".dialog-box": [{ "@layer components": { display: "flex", flexDirection: "column", maxHeight: "calc(100vh - 4rem)", overflow: "hidden" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "transform 0ms" } } }], ".dialog-header": { "@layer components": { display: "flex", alignItems: "center", gap: "1rem", padding: "1.5rem 1.5rem 0" } }, ".dialog-title": { "@layer components": { flex: 1, fontSize: "1.25rem", fontWeight: 600, lineHeight: "1.75rem", margin: "0", color: "var(--color-on-surface)" } }, ".dialog-close": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "2rem", height: "2rem", fontSize: "1.25rem", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", transition: "background-color 150ms ease-in-out, color 150ms ease-in-out", flexShrink: 0 } }, ".dialog-close:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)", color: "var(--color-on-surface)" } }, ".dialog-close:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".dialog-body": { "@layer components": { padding: "1rem 1.5rem", overflowY: "auto", color: "var(--color-on-surface-variant)", lineHeight: 1.5 } }, ".dialog-footer": { "@layer components": { display: "flex", justifyContent: "flex-end", gap: "0.5rem", padding: "1rem 1.5rem 1.5rem" } }, ".dialog-footer-start": { "@layer components": { justifyContent: "flex-start" } }, ".dialog-footer-center": { "@layer components": { justifyContent: "center" } }, ".dialog-footer-between": { "@layer components": { justifyContent: "space-between" } }, "dialog.dialog.dialog-sm": { "@layer components": { maxWidth: "20rem" } }, "dialog.dialog.dialog-lg": { "@layer components": { maxWidth: "40rem" } }, "dialog.dialog.dialog-xl": { "@layer components": { maxWidth: "56rem" } }, "dialog.dialog.dialog-fullscreen": { "@layer components": { maxWidth: "100%", maxHeight: "100%", width: "100%", height: "100%", borderRadius: "0", margin: "0" } }, "dialog.dialog.dialog-fullscreen .dialog-box": { "@layer components": { maxHeight: "100%" } }, "dialog.dialog.dialog-top": { "@layer components": { marginTop: "2rem", marginBottom: "auto" } }, "dialog.dialog.dialog-bottom": { "@layer components": { marginTop: "auto", marginBottom: "2rem" } }, ".dialog-scrollable .dialog-body": { "@layer components": { maxHeight: "50vh", overflowY: "auto" } }, ".dialog-divider .dialog-header": { "@layer components": { borderBottom: "1px solid var(--color-outline-variant)", paddingBottom: "1rem" } }, ".dialog-divider .dialog-footer": { "@layer components": { borderTop: "1px solid var(--color-outline-variant)", paddingTop: "1rem" } }, ".dialog": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "visibility 0ms, opacity 0ms" } } }, ".progress": { "@layer components": { position: "relative", width: "100%", height: "0.5rem", backgroundColor: "var(--color-surface-container-highest)", borderRadius: "var(--radius-full)", overflow: "hidden" } }, ".progress-bar": { "@layer components": { position: "absolute", top: "0", left: "0", height: "100%", backgroundColor: "var(--color-primary)", borderRadius: "var(--radius-full)", transition: "width 300ms ease-in-out" } }, ".progress-primary .progress-bar": { "@layer components": { backgroundColor: "var(--color-primary)" } }, ".progress-secondary .progress-bar": { "@layer components": { backgroundColor: "var(--color-secondary)" } }, ".progress-tertiary .progress-bar": { "@layer components": { backgroundColor: "var(--color-tertiary)" } }, ".progress-info .progress-bar": { "@layer components": { backgroundColor: "var(--color-info)" } }, ".progress-success .progress-bar": { "@layer components": { backgroundColor: "var(--color-success)" } }, ".progress-warning .progress-bar": { "@layer components": { backgroundColor: "var(--color-warning)" } }, ".progress-error .progress-bar": { "@layer components": { backgroundColor: "var(--color-error)" } }, ".progress-accent .progress-bar": { "@layer components": { backgroundColor: "var(--color-accent)" } }, ".progress-neutral .progress-bar": { "@layer components": { backgroundColor: "var(--color-neutral)" } }, ".progress-base .progress-bar": { "@layer components": { backgroundColor: "var(--color-base-content)" } }, ".progress-xs": { "@layer components": { height: "0.25rem" } }, ".progress-sm": { "@layer components": { height: "0.375rem" } }, ".progress-lg": { "@layer components": { height: "0.75rem" } }, ".progress-xl": { "@layer components": { height: "1rem" } }, ".progress-indeterminate .progress-bar": { "@layer components": { width: "30%", animation: "progress-indeterminate 1.5s infinite ease-in-out" } }, "@keyframes progress-indeterminate": { "0%": { left: "-30%" }, "100%": { left: "100%" } }, ".progress-labeled": { "@layer components": { position: "relative" } }, ".progress-label": { "@layer components": { position: "absolute", top: "50%", left: "50%", transform: "translate(-50%, -50%)", fontSize: "0.625rem", fontWeight: 600, color: "var(--color-on-surface)" } }, ".progress-striped .progress-bar": { "@layer components": { backgroundImage: `linear-gradient(
184
+ 45deg,
185
+ rgba(255, 255, 255, 0.15) 25%,
186
+ transparent 25%,
187
+ transparent 50%,
188
+ rgba(255, 255, 255, 0.15) 50%,
189
+ rgba(255, 255, 255, 0.15) 75%,
190
+ transparent 75%,
191
+ transparent
192
+ )`, backgroundSize: "1rem 1rem" } }, ".progress-striped.progress-animated .progress-bar": { "@layer components": { animation: "progress-striped 1s linear infinite" } }, "@keyframes progress-striped": { from: { backgroundPosition: "1rem 0" }, to: { backgroundPosition: "0 0" } }, ".progress-circular": { "@layer components": { position: "relative", width: "3rem", height: "3rem", display: "inline-flex", alignItems: "center", justifyContent: "center" } }, ".progress-circular svg": { "@layer components": { width: "100%", height: "100%", transform: "rotate(-90deg)" } }, ".progress-circular-track": { "@layer components": { fill: "none", stroke: "var(--color-surface-container-highest)", strokeWidth: 4 } }, ".progress-circular-bar": { "@layer components": { fill: "none", stroke: "var(--color-primary)", strokeWidth: 4, strokeLinecap: "round", transition: "stroke-dashoffset 300ms ease-in-out" } }, ".progress-circular-label": { "@layer components": { position: "absolute", fontSize: "0.75rem", fontWeight: 600, color: "var(--color-on-surface)" } }, ".progress-circular-sm": { "@layer components": { width: "2rem", height: "2rem" } }, ".progress-circular-sm .progress-circular-label": { "@layer components": { fontSize: "0.5rem" } }, ".progress-circular-lg": { "@layer components": { width: "4rem", height: "4rem" } }, ".progress-circular-lg .progress-circular-label": { "@layer components": { fontSize: "1rem" } }, ".progress-circular-xl": { "@layer components": { width: "6rem", height: "6rem" } }, ".progress-circular-xl .progress-circular-label": { "@layer components": { fontSize: "1.25rem" } }, ".progress-circular-indeterminate svg": { "@layer components": { animation: "progress-circular-rotate 2s linear infinite" } }, ".progress-circular-indeterminate .progress-circular-bar": { "@layer components": { strokeDasharray: "80, 200", strokeDashoffset: 0, animation: "progress-circular-dash 1.5s ease-in-out infinite" } }, "@keyframes progress-circular-rotate": { "100%": { transform: "rotate(270deg)" } }, "@keyframes progress-circular-dash": { "0%": { strokeDasharray: "1, 200", strokeDashoffset: 0 }, "50%": { strokeDasharray: "100, 200", strokeDashoffset: -15 }, "100%": { strokeDasharray: "100, 200", strokeDashoffset: -125 } }, ".progress-indeterminate .progress-bar, \n .progress-striped.progress-animated .progress-bar, \n .progress-circular-indeterminate svg, \n .progress-circular-indeterminate .progress-circular-bar": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { animation: "none" } } }, ".skeleton": [{ "@layer components": { backgroundColor: "var(--color-surface-container-high)", borderRadius: "var(--radius-xs)", animation: "skeleton-pulse 2s ease-in-out infinite" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { animation: "none" } } }], ".skeleton-text": { "@layer components": { height: "1rem", width: "100%", borderRadius: "var(--radius-xs)" } }, ".skeleton-circle": { "@layer components": { borderRadius: "var(--radius-full)", aspectRatio: "1" } }, ".skeleton-rect": { "@layer components": { borderRadius: "var(--radius-sm)" } }, ".skeleton-rounded": { "@layer components": { borderRadius: "var(--radius-sm)" } }, ".skeleton-xs": { "@layer components": { height: "0.5rem" } }, ".skeleton-sm": { "@layer components": { height: "0.75rem" } }, ".skeleton-md": { "@layer components": { height: "1rem" } }, ".skeleton-lg": { "@layer components": { height: "1.5rem" } }, ".skeleton-xl": { "@layer components": { height: "2rem" } }, ".skeleton-avatar": { "@layer components": { width: "3rem", height: "3rem", borderRadius: "var(--radius-full)" } }, ".skeleton-avatar-sm": { "@layer components": { width: "2rem", height: "2rem" } }, ".skeleton-avatar-lg": { "@layer components": { width: "4rem", height: "4rem" } }, ".skeleton-button": { "@layer components": { height: "2.5rem", width: "6rem", borderRadius: "var(--radius-sm)" } }, ".skeleton-image": { "@layer components": { aspectRatio: "16 / 9", width: "100%", borderRadius: "var(--radius-sm)" } }, ".skeleton-card": { "@layer components": { width: "100%", borderRadius: "var(--radius-lg)", padding: "1rem" } }, ".skeleton-line": { "@layer components": { height: "0.875rem", width: "100%", marginBottom: "0.5rem", borderRadius: "var(--radius-xs)" } }, ".skeleton-line:last-child": { "@layer components": { width: "75%", marginBottom: "0" } }, ".skeleton-line-short": { "@layer components": { width: "40%" } }, ".skeleton-line-medium": { "@layer components": { width: "70%" } }, "@keyframes skeleton-pulse": { "0%, 100%": { opacity: 1 }, "50%": { opacity: 0.4 } }, ".skeleton-wave": { "@layer components": { position: "relative", overflow: "hidden", animation: "none" } }, ".skeleton-wave::after": [{ "@layer components": { content: "''", position: "absolute", inset: "0", transform: "translateX(-100%)", background: `linear-gradient(
193
+ 90deg,
194
+ transparent,
195
+ rgba(255, 255, 255, 0.3),
196
+ transparent
197
+ )`, animation: "skeleton-wave 1.5s infinite" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { animation: "none" } } }], "@keyframes skeleton-wave": { "100%": { transform: "translateX(100%)" } }, ".skeleton-group": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.75rem" } }, ".skeleton-card-content": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.75rem" } }, ".skeleton-card-header": { "@layer components": { display: "flex", alignItems: "center", gap: "0.75rem" } }, ".skeleton-card-body": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.5rem" } }, ".skeleton-table": { "@layer components": { width: "100%" } }, ".skeleton-table-row": { "@layer components": { display: "flex", gap: "1rem", padding: "0.75rem 0", borderBottom: "1px solid var(--color-outline-variant)" } }, ".skeleton-table-cell": { "@layer components": { flex: 1, height: "1rem", borderRadius: "var(--radius-xs)" } }, ".skeleton-list": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.5rem" } }, ".skeleton-list-item": { "@layer components": { display: "flex", alignItems: "center", gap: "0.75rem", padding: "0.5rem 0" } }, ".snackbar-container": [{ "@layer components": { position: "fixed", zIndex: 1100, display: "flex", flexDirection: "column", gap: "0.5rem", padding: "1rem", pointerEvents: "none" } }, { "@layer components": { "@media (max-width: 640px)": { left: "0", right: "0", transform: "none" } } }], ".snackbar-container-bottom": { "@layer components": { bottom: "0", left: "50%", transform: "translateX(-50%)", alignItems: "center" } }, ".snackbar-container-bottom-left": { "@layer components": { bottom: "0", left: "0", alignItems: "flex-start" } }, ".snackbar-container-bottom-right": { "@layer components": { bottom: "0", right: "0", alignItems: "flex-end" } }, ".snackbar-container-top": { "@layer components": { top: "0", left: "50%", transform: "translateX(-50%)", alignItems: "center" } }, ".snackbar-container-top-left": { "@layer components": { top: "0", left: "0", alignItems: "flex-start" } }, ".snackbar-container-top-right": { "@layer components": { top: "0", right: "0", alignItems: "flex-end" } }, ".snackbar": [{ "@layer components": { display: "flex", alignItems: "center", gap: "0.75rem", minWidth: "20rem", maxWidth: "40rem", padding: "0.875rem 1rem", backgroundColor: "var(--color-surface-container-highest)", color: "var(--color-on-surface)", borderRadius: "var(--radius-sm)", boxShadow: "var(--shadow-md)", pointerEvents: "auto", opacity: 0, transform: "translateY(100%)", transition: "opacity 200ms ease-out, transform 200ms ease-out" } }, { "@layer components": { "@media (max-width: 640px)": { minWidth: "calc(100vw - 2rem)", maxWidth: "calc(100vw - 2rem)" } } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "opacity 0ms, transform 0ms" } } }], ".snackbar-container-top .snackbar, \n .snackbar-container-top-left .snackbar, \n .snackbar-container-top-right .snackbar": { "@layer components": { transform: "translateY(-100%)" } }, ".snackbar.snackbar-open, \n .snackbar.snackbar-show, \n .snackbar.show": { "@layer components": { opacity: 1, transform: "translateY(0)" } }, ".snackbar.snackbar-bottom": { "@layer components": { position: "fixed", bottom: "1rem", left: "50%", transform: "translateX(-50%) translateY(100%)", zIndex: 1100 } }, ".snackbar.snackbar-bottom.snackbar-show": { "@layer components": { transform: "translateX(-50%) translateY(0)" } }, ".snackbar.snackbar-bottom-left": { "@layer components": { position: "fixed", bottom: "1rem", left: "1rem", zIndex: 1100 } }, ".snackbar.snackbar-bottom-right": { "@layer components": { position: "fixed", bottom: "1rem", right: "1rem", zIndex: 1100 } }, ".snackbar.snackbar-top": { "@layer components": { position: "fixed", top: "1rem", left: "50%", transform: "translateX(-50%) translateY(-100%)", zIndex: 1100 } }, ".snackbar.snackbar-top.snackbar-show": { "@layer components": { transform: "translateX(-50%) translateY(0)" } }, ".snackbar.snackbar-top-left": { "@layer components": { position: "fixed", top: "1rem", left: "1rem", transform: "translateY(-100%)", zIndex: 1100 } }, ".snackbar.snackbar-top-left.snackbar-show": { "@layer components": { transform: "translateY(0)" } }, ".snackbar.snackbar-top-right": { "@layer components": { position: "fixed", top: "1rem", right: "1rem", transform: "translateY(-100%)", zIndex: 1100 } }, ".snackbar.snackbar-top-right.snackbar-show": { "@layer components": { transform: "translateY(0)" } }, ".snackbar.snackbar-bottom-left.snackbar-show, \n .snackbar.snackbar-bottom-right.snackbar-show": { "@layer components": { transform: "translateY(0)" } }, ".snackbar-message": { "@layer components": { flex: 1, fontSize: "0.875rem", lineHeight: "1.25rem" } }, ".snackbar-action": { "@layer components": { display: "inline-flex", alignItems: "center", padding: "0.375rem 0.75rem", fontSize: "0.875rem", fontWeight: 500, color: "var(--color-primary)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-xs)", cursor: "pointer", transition: "background-color 150ms ease-in-out", whiteSpace: "nowrap", flexShrink: 0 } }, ".snackbar-action:hover": { "@layer components": { backgroundColor: "var(--color-primary-container)" } }, ".snackbar-action:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".snackbar-close": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.5rem", height: "1.5rem", fontSize: "1rem", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", transition: "background-color 150ms ease-in-out", flexShrink: 0 } }, ".snackbar-close:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".snackbar-info": { "@layer components": { backgroundColor: "var(--color-info-container)", color: "var(--color-on-info-container)" } }, ".snackbar-success": { "@layer components": { backgroundColor: "var(--color-success-container)", color: "var(--color-on-success-container)" } }, ".snackbar-warning": { "@layer components": { backgroundColor: "var(--color-warning-container)", color: "var(--color-on-warning-container)" } }, ".snackbar-error": { "@layer components": { backgroundColor: "var(--color-error-container)", color: "var(--color-on-error-container)" } }, ".snackbar-primary": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".snackbar-secondary": { "@layer components": { backgroundColor: "var(--color-secondary-container)", color: "var(--color-on-secondary-container)" } }, ".snackbar-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary-container)", color: "var(--color-on-tertiary-container)" } }, ".snackbar-accent": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-accent) 15%, var(--color-surface))", color: "var(--color-on-surface)" } }, ".snackbar-neutral": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface))", color: "var(--color-on-surface)" } }, ".snackbar-base": { "@layer components": { backgroundColor: "var(--color-base-200)", color: "var(--color-base-content)" } }, ".snackbar-dark": { "@layer components": { backgroundColor: "var(--color-on-surface)", color: "var(--color-surface)" } }, ".snackbar-dark .snackbar-action": { "@layer components": { color: "var(--color-primary-container)" } }, ".snackbar-dark .snackbar-close": { "@layer components": { color: "var(--color-surface)" } }, ".snackbar-icon": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", flexShrink: 0, fontSize: "1.25rem" } }, ".snackbar-multiline": { "@layer components": { flexWrap: "wrap", minHeight: "4rem" } }, ".snackbar-multiline .snackbar-message": { "@layer components": { width: "100%", marginBottom: "0.5rem" } }, ".snackbar-multiline .snackbar-action": { "@layer components": { marginLeft: "auto" } }, ".snackbar-container-bottom, \n .snackbar-container-top": { "@layer components": { "@media (max-width: 640px)": { alignItems: "stretch" } } }, ".toast-container": { "@layer components": { position: "fixed", zIndex: 1200, display: "flex", flexDirection: "column", gap: "0.5rem", padding: "1rem", pointerEvents: "none" } }, ".toast-container-top-right": { "@layer components": { top: "0", right: "0", alignItems: "flex-end" } }, ".toast-container-top-left": { "@layer components": { top: "0", left: "0", alignItems: "flex-start" } }, ".toast-container-top-center": { "@layer components": { top: "0", left: "50%", transform: "translateX(-50%)", alignItems: "center" } }, ".toast-container-bottom-right": { "@layer components": { bottom: "0", right: "0", alignItems: "flex-end" } }, ".toast-container-bottom-left": { "@layer components": { bottom: "0", left: "0", alignItems: "flex-start" } }, ".toast-container-bottom-center": { "@layer components": { bottom: "0", left: "50%", transform: "translateX(-50%)", alignItems: "center" } }, ".toast": [{ "@layer components": { display: "flex", alignItems: "flex-start", gap: "0.75rem", width: "22rem", maxWidth: "calc(100vw - 2rem)", padding: "1rem", backgroundColor: "var(--color-surface)", color: "var(--color-on-surface)", border: "1px solid var(--color-outline)", borderRadius: "var(--radius-md)", boxShadow: "var(--shadow-lg)", pointerEvents: "auto", opacity: 0, transform: "translateX(100%)", transition: "opacity 300ms ease-out, transform 300ms ease-out" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "opacity 0ms", transform: "none" } } }], ".toast-container-top-left .toast, \n .toast-container-bottom-left .toast": { "@layer components": { transform: "translateX(-100%)" } }, ".toast-container-top-center .toast, \n .toast-container-bottom-center .toast": { "@layer components": { transform: "translateY(-20px)" } }, ".toast.toast-open, \n .toast.show, \n .toast-show": { "@layer components": { opacity: 1, transform: "translateX(0) translateY(0)" } }, ".toast-icon": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.5rem", height: "1.5rem", fontSize: "1.25rem", flexShrink: 0 } }, ".toast-content": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.25rem", flex: 1, minWidth: "0" } }, ".toast-title": { "@layer components": { fontSize: "0.875rem", fontWeight: 600, lineHeight: "1.25rem", color: "var(--color-on-surface)" } }, ".toast-message": { "@layer components": { fontSize: "0.875rem", lineHeight: "1.25rem", color: "var(--color-on-surface-variant)" } }, ".toast-close": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.5rem", height: "1.5rem", fontSize: "1rem", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-xs)", cursor: "pointer", transition: "background-color 150ms ease-in-out, color 150ms ease-in-out", flexShrink: 0, marginLeft: "auto" } }, ".toast-close:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)", color: "var(--color-on-surface)" } }, ".toast-close:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".toast-actions": { "@layer components": { display: "flex", gap: "0.5rem", marginTop: "0.5rem" } }, ".toast-info": { "@layer components": { borderColor: "var(--color-info)" } }, ".toast-info .toast-icon": { "@layer components": { color: "var(--color-info)" } }, ".toast-success": { "@layer components": { borderColor: "var(--color-success)" } }, ".toast-success .toast-icon": { "@layer components": { color: "var(--color-success)" } }, ".toast-warning": { "@layer components": { borderColor: "var(--color-warning)" } }, ".toast-warning .toast-icon": { "@layer components": { color: "var(--color-warning)" } }, ".toast-error": { "@layer components": { borderColor: "var(--color-error)" } }, ".toast-error .toast-icon": { "@layer components": { color: "var(--color-error)" } }, ".toast-primary": { "@layer components": { borderColor: "var(--color-primary)" } }, ".toast-primary .toast-icon": { "@layer components": { color: "var(--color-primary)" } }, ".toast-secondary": { "@layer components": { borderColor: "var(--color-secondary)" } }, ".toast-secondary .toast-icon": { "@layer components": { color: "var(--color-secondary)" } }, ".toast-tertiary": { "@layer components": { borderColor: "var(--color-tertiary)" } }, ".toast-tertiary .toast-icon": { "@layer components": { color: "var(--color-tertiary)" } }, ".toast-accent": { "@layer components": { borderColor: "var(--color-accent)" } }, ".toast-accent .toast-icon": { "@layer components": { color: "var(--color-accent)" } }, ".toast-neutral": { "@layer components": { borderColor: "var(--color-neutral)" } }, ".toast-neutral .toast-icon": { "@layer components": { color: "var(--color-neutral)" } }, ".toast-base": { "@layer components": { borderColor: "var(--color-base-content)" } }, ".toast-base .toast-icon": { "@layer components": { color: "var(--color-base-content)" } }, ".toast-filled.toast-info": { "@layer components": { backgroundColor: "var(--color-info-container)", borderColor: "transparent", color: "var(--color-on-info-container)" } }, ".toast-filled.toast-success": { "@layer components": { backgroundColor: "var(--color-success-container)", borderColor: "transparent", color: "var(--color-on-success-container)" } }, ".toast-filled.toast-warning": { "@layer components": { backgroundColor: "var(--color-warning-container)", borderColor: "transparent", color: "var(--color-on-warning-container)" } }, ".toast-filled.toast-error": { "@layer components": { backgroundColor: "var(--color-error-container)", borderColor: "transparent", color: "var(--color-on-error-container)" } }, ".toast-filled.toast-primary": { "@layer components": { backgroundColor: "var(--color-primary-container)", borderColor: "transparent", color: "var(--color-on-primary-container)" } }, ".toast-filled.toast-secondary": { "@layer components": { backgroundColor: "var(--color-secondary-container)", borderColor: "transparent", color: "var(--color-on-secondary-container)" } }, ".toast-filled.toast-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary-container)", borderColor: "transparent", color: "var(--color-on-tertiary-container)" } }, ".toast-filled.toast-accent": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-accent) 15%, var(--color-surface))", borderColor: "transparent", color: "var(--color-on-surface)" } }, ".toast-filled.toast-neutral": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface))", borderColor: "transparent", color: "var(--color-on-surface)" } }, ".toast-filled.toast-base": { "@layer components": { backgroundColor: "var(--color-base-200)", borderColor: "transparent", color: "var(--color-base-content)" } }, ".toast-filled .toast-title, \n .toast-filled .toast-message": { "@layer components": { color: "inherit" } }, ".toast-ghost": { "@layer components": { backgroundColor: "transparent", borderColor: "transparent" } }, ".toast-ghost.toast-primary": { "@layer components": { color: "var(--color-primary)" } }, ".toast-ghost.toast-secondary": { "@layer components": { color: "var(--color-secondary)" } }, ".toast-ghost.toast-tertiary": { "@layer components": { color: "var(--color-tertiary)" } }, ".toast-ghost.toast-info": { "@layer components": { color: "var(--color-info)" } }, ".toast-ghost.toast-success": { "@layer components": { color: "var(--color-success)" } }, ".toast-ghost.toast-warning": { "@layer components": { color: "var(--color-warning)" } }, ".toast-ghost.toast-error": { "@layer components": { color: "var(--color-error)" } }, ".toast-ghost.toast-accent": { "@layer components": { color: "var(--color-accent)" } }, ".toast-ghost.toast-neutral": { "@layer components": { color: "var(--color-neutral)" } }, ".toast-ghost.toast-base": { "@layer components": { color: "var(--color-base-content)" } }, ".toast-ghost .toast-title, \n .toast-ghost .toast-message": { "@layer components": { color: "inherit" } }, ".toast-progress": [{ "@layer components": { position: "absolute", bottom: "0", left: "0", height: "3px", backgroundColor: "currentColor", borderRadius: "0 0 var(--radius-md) var(--radius-md)", animation: "toast-progress linear forwards" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { animation: "none" } } }], "@keyframes toast-progress": { from: { width: "100%" }, to: { width: "0%" } }, ".tooltip[popover]": [{ "@layer components": { "--tooltip-bg": "var(--color-on-surface)", "--tooltip-fg": "var(--color-surface)", position: "absolute", inset: "auto", zIndex: 1000, margin: "0.5rem", padding: "0.375rem 0.75rem", fontSize: "0.75rem", fontWeight: 500, lineHeight: "1rem", whiteSpace: "nowrap", backgroundColor: "var(--tooltip-bg)", color: "var(--tooltip-fg)", border: "none", borderRadius: "var(--radius-xs)", boxShadow: "var(--shadow-md)", pointerEvents: "none", opacity: 0, transform: "scale(0.95)", positionArea: "top", positionTryFallbacks: "flip-block, flip-inline, flip-block flip-inline", transition: `opacity 150ms ease-out,
198
+ transform 150ms ease-out,
199
+ overlay 150ms ease-out allow-discrete,
200
+ display 150ms ease-out allow-discrete` } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }], ".tooltip[popover]:popover-open": [{ "@layer components": { opacity: 1, transform: "scale(1)" } }, { "@layer components": { "@starting-style": { opacity: 0, transform: "scale(0.95)" } } }], ".tooltip-top[popover]": { "@layer components": { positionArea: "top" } }, ".tooltip-bottom[popover]": { "@layer components": { positionArea: "bottom" } }, ".tooltip-left[popover]": { "@layer components": { positionArea: "left" } }, ".tooltip-right[popover]": { "@layer components": { positionArea: "right" } }, ".tooltip[popover]::before": { "@layer components": { content: "''", position: "absolute", width: "0", height: "0", border: "0.375rem solid transparent" } }, ".tooltip-top[popover]::before, \n .tooltip[popover]:not(.tooltip-bottom):not(.tooltip-left):not(.tooltip-right)::before": { "@layer components": { top: "100%", left: "50%", transform: "translateX(-50%)", borderTopColor: "var(--tooltip-bg)" } }, ".tooltip-bottom[popover]::before": { "@layer components": { bottom: "100%", top: "auto", left: "50%", transform: "translateX(-50%)", borderBottomColor: "var(--tooltip-bg)", borderTopColor: "transparent" } }, ".tooltip-left[popover]::before": { "@layer components": { left: "100%", top: "50%", bottom: "auto", transform: "translateY(-50%)", borderLeftColor: "var(--tooltip-bg)", borderTopColor: "transparent" } }, ".tooltip-right[popover]::before": { "@layer components": { right: "100%", left: "auto", top: "50%", bottom: "auto", transform: "translateY(-50%)", borderRightColor: "var(--tooltip-bg)", borderTopColor: "transparent" } }, ".tooltip-light[popover]": { "@layer components": { "--tooltip-bg": "var(--color-surface)", "--tooltip-fg": "var(--color-on-surface)", border: "1px solid var(--color-outline)" } }, ".tooltip-primary[popover]": { "@layer components": { "--tooltip-bg": "var(--color-primary)", "--tooltip-fg": "var(--color-primary-content)" } }, ".tooltip-secondary[popover]": { "@layer components": { "--tooltip-bg": "var(--color-secondary)", "--tooltip-fg": "var(--color-secondary-content)" } }, ".tooltip-tertiary[popover]": { "@layer components": { "--tooltip-bg": "var(--color-tertiary)", "--tooltip-fg": "var(--color-tertiary-content)" } }, ".tooltip-info[popover]": { "@layer components": { "--tooltip-bg": "var(--color-info)", "--tooltip-fg": "var(--color-info-content)" } }, ".tooltip-success[popover]": { "@layer components": { "--tooltip-bg": "var(--color-success)", "--tooltip-fg": "var(--color-success-content)" } }, ".tooltip-warning[popover]": { "@layer components": { "--tooltip-bg": "var(--color-warning)", "--tooltip-fg": "var(--color-warning-content)" } }, ".tooltip-error[popover]": { "@layer components": { "--tooltip-bg": "var(--color-error)", "--tooltip-fg": "var(--color-error-content)" } }, ".tooltip-accent[popover]": { "@layer components": { "--tooltip-bg": "var(--color-accent)", "--tooltip-fg": "var(--color-accent-content)" } }, ".tooltip-neutral[popover]": { "@layer components": { "--tooltip-bg": "var(--color-neutral)", "--tooltip-fg": "var(--color-neutral-content)" } }, ".tooltip-base[popover]": { "@layer components": { "--tooltip-bg": "var(--color-base-100)", "--tooltip-fg": "var(--color-base-content)" } }, ".tooltip-multiline[popover]": { "@layer components": { whiteSpace: "normal", maxWidth: "16rem", textAlign: "center" } }, ".tooltip-rich[popover]": { "@layer components": { padding: "0.75rem 1rem", maxWidth: "20rem", whiteSpace: "normal", textAlign: "left" } }, ".tooltip-rich-title": { "@layer components": { fontSize: "0.8125rem", fontWeight: 600, marginBottom: "0.25rem" } }, ".tooltip-rich-description": { "@layer components": { fontSize: "0.75rem", fontWeight: 400, opacity: 0.9 } }, ".tooltip-delay": { "@layer components": { interestDelay: "300ms" } }, ".tooltip-delay-long": { "@layer components": { interestDelay: "500ms" } }, ".tooltip-interactive[popover]": { "@layer components": { pointerEvents: "auto" } }, ".appbar": [{ "@layer components": { display: "flex", alignItems: "center", gap: "0.5rem", width: "100%", minHeight: "4rem", padding: "0 1rem", backgroundColor: "var(--color-surface)", color: "var(--color-on-surface)", boxShadow: "var(--shadow-sm)" } }, { "@layer components": { "@media (max-width: 640px)": { padding: "0 0.5rem" } } }], ".appbar-static": { "@layer components": { position: "static" } }, ".appbar-fixed": { "@layer components": { position: "fixed", top: "0", left: "0", right: "0", zIndex: 1000 } }, ".appbar-sticky": { "@layer components": { position: "sticky", top: "0", zIndex: 1000 } }, ".appbar-top": { "@layer components": { top: "0" } }, ".appbar-bottom": { "@layer components": { position: "fixed", bottom: "0", left: "0", right: "0", top: "auto", zIndex: 1000 } }, ".appbar-elevated": { "@layer components": { boxShadow: "var(--shadow-sm)" } }, ".appbar-flat": { "@layer components": { boxShadow: "none" } }, ".appbar-bordered": { "@layer components": { borderBottom: "1px solid var(--color-outline-variant)", boxShadow: "none" } }, ".appbar-transparent": { "@layer components": { backgroundColor: "transparent", boxShadow: "none" } }, ".appbar-blur": { "@layer components": { backdropFilter: "blur(8px)", WebkitBackdropFilter: "blur(8px)" } }, ".appbar-nav": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "2.5rem", height: "2.5rem", color: "var(--color-on-surface)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", transition: "background-color 150ms ease-in-out", flexShrink: 0 } }, ".appbar-nav:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".appbar-nav:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".appbar-title": [{ "@layer components": { flex: 1, fontSize: "1.25rem", fontWeight: 500, lineHeight: "1.75rem", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, { "@layer components": { "@media (max-width: 640px)": { fontSize: "1rem" } } }], ".appbar-subtitle": { "@layer components": { fontSize: "0.75rem", color: "var(--color-on-surface-variant)", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, ".appbar-title-group": { "@layer components": { flex: 1, minWidth: "0" } }, ".appbar-title-group .appbar-title": { "@layer components": { fontSize: "1rem", lineHeight: "1.25rem" } }, ".appbar-actions": { "@layer components": { display: "flex", alignItems: "center", gap: "0.25rem", flexShrink: 0 } }, ".appbar-action": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "2.5rem", height: "2.5rem", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", transition: "background-color 150ms ease-in-out, color 150ms ease-in-out" } }, ".appbar-action:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)", color: "var(--color-on-surface)" } }, ".appbar-action:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".appbar-brand": { "@layer components": { display: "flex", alignItems: "center", gap: "0.75rem", flexShrink: 0 } }, ".appbar-logo": { "@layer components": { height: "2rem", width: "auto" } }, ".appbar-sm": { "@layer components": { minHeight: "3rem", padding: "0 0.75rem" } }, ".appbar-sm .appbar-title": { "@layer components": { fontSize: "1rem" } }, ".appbar-lg": { "@layer components": { minHeight: "5rem", padding: "0 1.5rem" } }, ".appbar-lg .appbar-title": { "@layer components": { fontSize: "1.5rem" } }, ".appbar-compact": { "@layer components": { minHeight: "3rem", padding: "0 0.75rem" } }, ".appbar-compact .appbar-title, \n .appbar-compact .appbar-heading": { "@layer components": { fontSize: "1rem", lineHeight: "1.5rem" } }, ".appbar-compact .appbar-nav, \n .appbar-compact .appbar-action, \n .appbar-compact .appbar-back": { "@layer components": { width: "2rem", height: "2rem" } }, ".appbar-comfortable": { "@layer components": { minHeight: "5rem", padding: "0 1.5rem" } }, ".appbar-comfortable .appbar-title, \n .appbar-comfortable .appbar-heading": { "@layer components": { fontSize: "1.5rem", lineHeight: "2rem" } }, ".appbar-leading": { "@layer components": { display: "flex", alignItems: "center", gap: "0.25rem", flexShrink: 0 } }, ".appbar-trailing": { "@layer components": { display: "flex", alignItems: "center", gap: "0.25rem", flexGrow: 1, justifyContent: "flex-end", marginLeft: "auto" } }, ".appbar-heading": { "@layer components": { fontSize: "1.25rem", fontWeight: 500, lineHeight: "1.75rem", margin: "0", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, ".appbar-back": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "2.5rem", height: "2.5rem", color: "var(--color-on-surface)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", transition: "background-color 150ms ease-in-out", flexShrink: 0 } }, ".appbar-back:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".appbar-back:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".appbar .appbar-search, \n input.appbar-search": { "@layer components": { flex: 1, maxWidth: "32rem", padding: "0.5rem 1rem", fontSize: "0.875rem", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface-container)", border: "none", borderRadius: "var(--radius-full)", transition: "background-color 150ms ease-in-out" } }, ".appbar .appbar-search:focus, \n input.appbar-search:focus": { "@layer components": { outline: "none", backgroundColor: "var(--color-surface-container-high)" } }, ".appbar .appbar-search::placeholder, \n input.appbar-search::placeholder": { "@layer components": { color: "var(--color-on-surface-variant)" } }, ".appbar-primary": { "@layer components": { backgroundColor: "var(--color-primary)", color: "var(--color-primary-content)" } }, ".appbar-primary .appbar-nav, \n .appbar-primary .appbar-action, \n .appbar-primary .appbar-back": { "@layer components": { color: "var(--color-primary-content)" } }, ".appbar-primary .appbar-nav:hover, \n .appbar-primary .appbar-action:hover, \n .appbar-primary .appbar-back:hover": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".appbar-primary .appbar-subtitle": { "@layer components": { color: "var(--color-primary-content)", opacity: 0.8 } }, ".appbar-secondary": { "@layer components": { backgroundColor: "var(--color-secondary)", color: "var(--color-secondary-content)" } }, ".appbar-secondary .appbar-nav, \n .appbar-secondary .appbar-action, \n .appbar-secondary .appbar-back": { "@layer components": { color: "var(--color-secondary-content)" } }, ".appbar-secondary .appbar-nav:hover, \n .appbar-secondary .appbar-action:hover, \n .appbar-secondary .appbar-back:hover": { "@layer components": { backgroundColor: "var(--color-secondary-container)", color: "var(--color-on-secondary-container)" } }, ".appbar-secondary .appbar-subtitle": { "@layer components": { color: "var(--color-secondary-content)", opacity: 0.8 } }, ".appbar-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary)", color: "var(--color-tertiary-content)" } }, ".appbar-tertiary .appbar-nav, \n .appbar-tertiary .appbar-action, \n .appbar-tertiary .appbar-back": { "@layer components": { color: "var(--color-tertiary-content)" } }, ".appbar-tertiary .appbar-nav:hover, \n .appbar-tertiary .appbar-action:hover, \n .appbar-tertiary .appbar-back:hover": { "@layer components": { backgroundColor: "var(--color-tertiary-container)", color: "var(--color-on-tertiary-container)" } }, ".appbar-tertiary .appbar-subtitle": { "@layer components": { color: "var(--color-tertiary-content)", opacity: 0.8 } }, ".appbar-accent": { "@layer components": { backgroundColor: "var(--color-accent)", color: "var(--color-accent-content)" } }, ".appbar-accent .appbar-nav, \n .appbar-accent .appbar-action, \n .appbar-accent .appbar-back": { "@layer components": { color: "var(--color-accent-content)" } }, ".appbar-accent .appbar-nav:hover, \n .appbar-accent .appbar-action:hover, \n .appbar-accent .appbar-back:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-accent) 15%, var(--color-surface))", color: "var(--color-accent)" } }, ".appbar-accent .appbar-subtitle": { "@layer components": { color: "var(--color-accent-content)", opacity: 0.8 } }, ".appbar-neutral": { "@layer components": { backgroundColor: "var(--color-neutral)", color: "var(--color-neutral-content)" } }, ".appbar-neutral .appbar-nav, \n .appbar-neutral .appbar-action, \n .appbar-neutral .appbar-back": { "@layer components": { color: "var(--color-neutral-content)" } }, ".appbar-neutral .appbar-nav:hover, \n .appbar-neutral .appbar-action:hover, \n .appbar-neutral .appbar-back:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface))", color: "var(--color-neutral)" } }, ".appbar-neutral .appbar-subtitle": { "@layer components": { color: "var(--color-neutral-content)", opacity: 0.8 } }, ".appbar-base": { "@layer components": { backgroundColor: "var(--color-base-100)", color: "var(--color-base-content)" } }, ".appbar-base .appbar-nav, \n .appbar-base .appbar-action, \n .appbar-base .appbar-back": { "@layer components": { color: "var(--color-base-content)" } }, ".appbar-base .appbar-nav:hover, \n .appbar-base .appbar-action:hover, \n .appbar-base .appbar-back:hover": { "@layer components": { backgroundColor: "var(--color-base-200)", color: "var(--color-base-content)" } }, ".appbar-base .appbar-subtitle": { "@layer components": { color: "var(--color-base-content)", opacity: 0.8 } }, ".appbar-info": { "@layer components": { backgroundColor: "var(--color-info)", color: "var(--color-info-content)" } }, ".appbar-info .appbar-nav, \n .appbar-info .appbar-action, \n .appbar-info .appbar-back": { "@layer components": { color: "var(--color-info-content)" } }, ".appbar-info .appbar-nav:hover, \n .appbar-info .appbar-action:hover, \n .appbar-info .appbar-back:hover": { "@layer components": { backgroundColor: "var(--color-info-container)", color: "var(--color-on-info-container)" } }, ".appbar-info .appbar-subtitle": { "@layer components": { color: "var(--color-info-content)", opacity: 0.8 } }, ".appbar-success": { "@layer components": { backgroundColor: "var(--color-success)", color: "var(--color-success-content)" } }, ".appbar-success .appbar-nav, \n .appbar-success .appbar-action, \n .appbar-success .appbar-back": { "@layer components": { color: "var(--color-success-content)" } }, ".appbar-success .appbar-nav:hover, \n .appbar-success .appbar-action:hover, \n .appbar-success .appbar-back:hover": { "@layer components": { backgroundColor: "var(--color-success-container)", color: "var(--color-on-success-container)" } }, ".appbar-success .appbar-subtitle": { "@layer components": { color: "var(--color-success-content)", opacity: 0.8 } }, ".appbar-warning": { "@layer components": { backgroundColor: "var(--color-warning)", color: "var(--color-warning-content)" } }, ".appbar-warning .appbar-nav, \n .appbar-warning .appbar-action, \n .appbar-warning .appbar-back": { "@layer components": { color: "var(--color-warning-content)" } }, ".appbar-warning .appbar-nav:hover, \n .appbar-warning .appbar-action:hover, \n .appbar-warning .appbar-back:hover": { "@layer components": { backgroundColor: "var(--color-warning-container)", color: "var(--color-on-warning-container)" } }, ".appbar-warning .appbar-subtitle": { "@layer components": { color: "var(--color-warning-content)", opacity: 0.8 } }, ".appbar-error": { "@layer components": { backgroundColor: "var(--color-error)", color: "var(--color-error-content)" } }, ".appbar-error .appbar-nav, \n .appbar-error .appbar-action, \n .appbar-error .appbar-back": { "@layer components": { color: "var(--color-error-content)" } }, ".appbar-error .appbar-nav:hover, \n .appbar-error .appbar-action:hover, \n .appbar-error .appbar-back:hover": { "@layer components": { backgroundColor: "var(--color-error-container)", color: "var(--color-on-error-container)" } }, ".appbar-error .appbar-subtitle": { "@layer components": { color: "var(--color-error-content)", opacity: 0.8 } }, ".appbar-surface": { "@layer components": { backgroundColor: "var(--color-surface)" } }, ".appbar-surface-container": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".appbar-surface-container-low": { "@layer components": { backgroundColor: "var(--color-surface-container-low)" } }, ".appbar-surface-container-high": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".appbar-surface-container-highest": { "@layer components": { backgroundColor: "var(--color-surface-container-highest)" } }, ".appbar-center": { "@layer components": { justifyContent: "space-between" } }, ".appbar-center .appbar-title": { "@layer components": { position: "absolute", left: "50%", transform: "translateX(-50%)", flex: "none" } }, ".appbar-dense": { "@layer components": { minHeight: "3rem", padding: "0 0.5rem" } }, ".appbar-dense .appbar-nav, \n .appbar-dense .appbar-action": { "@layer components": { width: "2rem", height: "2rem" } }, ".appbar-prominent": { "@layer components": { flexDirection: "column", alignItems: "flex-start", minHeight: "8rem", padding: "1rem" } }, ".appbar-prominent .appbar-row": { "@layer components": { display: "flex", alignItems: "center", width: "100%", gap: "0.5rem" } }, ".appbar-prominent .appbar-title": { "@layer components": { fontSize: "2rem", fontWeight: 400, marginTop: "auto", paddingBottom: "0.5rem" } }, ".appbar-search": [{ "@layer components": { flex: 1, maxWidth: "32rem", margin: "0 1rem" } }, { "@layer components": { "@media (max-width: 640px)": { margin: "0 0.5rem" } } }], ".appbar-search-input": { "@layer components": { width: "100%", padding: "0.5rem 1rem", fontSize: "0.875rem", color: "var(--color-on-surface)", backgroundColor: "var(--color-surface-container)", border: "none", borderRadius: "var(--radius-full)", transition: "background-color 150ms ease-in-out" } }, ".appbar-search-input:focus": { "@layer components": { outline: "none", backgroundColor: "var(--color-surface-container-high)" } }, ".appbar-search-input::placeholder": { "@layer components": { color: "var(--color-on-surface-variant)" } }, ".appbar-nav, \n .appbar-action, \n .appbar-search-input": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".divider": { "@layer components": { display: "flex", flexDirection: "row", alignItems: "center", gap: "0", width: "100%", margin: "1rem 0", whiteSpace: "nowrap" } }, ".divider:not(:empty)": { "@layer components": { gap: "1rem" } }, ".divider::before, \n .divider::after": { "@layer components": { content: "''", flex: 1, height: "1px", backgroundColor: "var(--color-outline-variant)" } }, ".divider-vertical": { "@layer components": { flexDirection: "column", width: "auto", margin: "0 1rem", alignSelf: "stretch" } }, ".divider-vertical::before, \n .divider-vertical::after": { "@layer components": { width: "1px", height: "unset" } }, ".divider-thin::before, \n .divider-thin::after": { "@layer components": { height: "1px" } }, ".divider-thin.divider-vertical::before, \n .divider-thin.divider-vertical::after": { "@layer components": { width: "1px", height: "unset" } }, ".divider-medium::before, \n .divider-medium::after": { "@layer components": { height: "2px" } }, ".divider-medium.divider-vertical::before, \n .divider-medium.divider-vertical::after": { "@layer components": { width: "2px", height: "unset" } }, ".divider-thick::before, \n .divider-thick::after": { "@layer components": { height: "4px" } }, ".divider-thick.divider-vertical::before, \n .divider-thick.divider-vertical::after": { "@layer components": { width: "4px", height: "unset" } }, ".divider-dashed::before, \n .divider-dashed::after": { "@layer components": { backgroundColor: "transparent", backgroundImage: `linear-gradient(
201
+ to right,
202
+ var(--color-outline-variant) 50%,
203
+ transparent 50%
204
+ )`, backgroundSize: "8px 1px", backgroundRepeat: "repeat-x" } }, ".divider-dashed.divider-vertical::before, \n .divider-dashed.divider-vertical::after": { "@layer components": { backgroundImage: `linear-gradient(
205
+ to bottom,
206
+ var(--color-outline-variant) 50%,
207
+ transparent 50%
208
+ )`, backgroundSize: "1px 8px", backgroundRepeat: "repeat-y" } }, ".divider-dotted::before, \n .divider-dotted::after": { "@layer components": { backgroundColor: "transparent", backgroundImage: `linear-gradient(
209
+ to right,
210
+ var(--color-outline-variant) 25%,
211
+ transparent 25%
212
+ )`, backgroundSize: "4px 1px", backgroundRepeat: "repeat-x" } }, ".divider-dotted.divider-vertical::before, \n .divider-dotted.divider-vertical::after": { "@layer components": { backgroundImage: `linear-gradient(
213
+ to bottom,
214
+ var(--color-outline-variant) 25%,
215
+ transparent 25%
216
+ )`, backgroundSize: "1px 4px", backgroundRepeat: "repeat-y" } }, ".divider-primary::before, \n .divider-primary::after": { "@layer components": { backgroundColor: "var(--color-primary)" } }, ".divider-primary.divider-dashed::before, \n .divider-primary.divider-dashed::after": { "@layer components": { backgroundImage: `linear-gradient(
217
+ to right,
218
+ var(--color-primary) 50%,
219
+ transparent 50%
220
+ )` } }, ".divider-primary.divider-dashed.divider-vertical::before, \n .divider-primary.divider-dashed.divider-vertical::after": { "@layer components": { backgroundImage: `linear-gradient(
221
+ to bottom,
222
+ var(--color-primary) 50%,
223
+ transparent 50%
224
+ )` } }, ".divider-secondary::before, \n .divider-secondary::after": { "@layer components": { backgroundColor: "var(--color-secondary)" } }, ".divider-tertiary::before, \n .divider-tertiary::after": { "@layer components": { backgroundColor: "var(--color-tertiary)" } }, ".divider-info::before, \n .divider-info::after": { "@layer components": { backgroundColor: "var(--color-info)" } }, ".divider-success::before, \n .divider-success::after": { "@layer components": { backgroundColor: "var(--color-success)" } }, ".divider-warning::before, \n .divider-warning::after": { "@layer components": { backgroundColor: "var(--color-warning)" } }, ".divider-error::before, \n .divider-error::after": { "@layer components": { backgroundColor: "var(--color-error)" } }, ".divider-accent::before, \n .divider-accent::after": { "@layer components": { backgroundColor: "var(--color-accent)" } }, ".divider-neutral::before, \n .divider-neutral::after": { "@layer components": { backgroundColor: "var(--color-neutral)" } }, ".divider-base::before, \n .divider-base::after": { "@layer components": { backgroundColor: "var(--color-base-content)" } }, ".divider-gradient::before, \n .divider-gradient::after": { "@layer components": { background: `linear-gradient(
225
+ to right,
226
+ transparent,
227
+ var(--color-outline-variant) 20%,
228
+ var(--color-outline-variant) 80%,
229
+ transparent
230
+ )` } }, ".divider-gradient.divider-vertical::before, \n .divider-gradient.divider-vertical::after": { "@layer components": { background: `linear-gradient(
231
+ to bottom,
232
+ transparent,
233
+ var(--color-outline-variant) 20%,
234
+ var(--color-outline-variant) 80%,
235
+ transparent
236
+ )` } }, ".divider-start::before": { "@layer components": { flex: "0 0 2rem" } }, ".divider-end::after": { "@layer components": { flex: "0 0 2rem" } }, ".divider-vertical.divider-start::before": { "@layer components": { flex: "0 0 2rem" } }, ".divider-vertical.divider-end::after": { "@layer components": { flex: "0 0 2rem" } }, ".divider-compact": { "@layer components": { margin: "0.25rem 0" } }, ".divider-compact:not(:empty)": { "@layer components": { gap: "0.5rem" } }, ".divider-compact.divider-vertical": { "@layer components": { margin: "0 0.25rem" } }, ".divider-comfortable": { "@layer components": { margin: "1.5rem 0" } }, ".divider-comfortable.divider-vertical": { "@layer components": { margin: "0 1.5rem" } }, ".divider-spacious": { "@layer components": { margin: "2rem 0" } }, ".divider-spacious:not(:empty)": { "@layer components": { gap: "1.5rem" } }, ".divider-spacious.divider-vertical": { "@layer components": { margin: "0 2rem" } }, ".divider-none": { "@layer components": { margin: "0" } }, ".divider-xs": { "@layer components": { margin: "0.25rem 0" } }, ".divider-xs.divider-vertical": { "@layer components": { margin: "0 0.25rem" } }, ".divider-sm": { "@layer components": { margin: "0.5rem 0" } }, ".divider-sm.divider-vertical": { "@layer components": { margin: "0 0.5rem" } }, ".divider-lg": { "@layer components": { margin: "1.5rem 0" } }, ".divider-lg.divider-vertical": { "@layer components": { margin: "0 1.5rem" } }, ".divider-xl": { "@layer components": { margin: "2rem 0" } }, ".divider-xl.divider-vertical": { "@layer components": { margin: "0 2rem" } }, ".divider-inset": { "@layer components": { paddingLeft: "4rem" } }, ".divider-inset-right": { "@layer components": { paddingRight: "4rem" } }, ".divider-inset-both": { "@layer components": { paddingLeft: "4rem", paddingRight: "4rem" } }, ".divider-list": { "@layer components": { margin: "0", paddingLeft: "1rem" } }, ".divider-card": { "@layer components": { margin: "0", marginLeft: "-1rem", marginRight: "-1rem" } }, ".divider-text": { "@layer components": { display: "flex", flexDirection: "row", alignItems: "center", gap: "0", width: "100%", margin: "1rem 0", whiteSpace: "nowrap" } }, ".divider-text:not(:empty)": { "@layer components": { gap: "1rem" } }, ".divider-text::before, \n .divider-text::after": { "@layer components": { content: "''", flex: 1, height: "1px", backgroundColor: "var(--color-outline-variant)" } }, ".divider-text-left::before, \n .divider-text-left.divider-text::before": { "@layer components": { flex: "0 0 2rem" } }, ".divider-text-right::after, \n .divider-text-right.divider-text::after": { "@layer components": { flex: "0 0 2rem" } }, ".bottom-nav": { "@layer components": { position: "fixed", bottom: "0", left: "0", right: "0", zIndex: 1000, display: "flex", alignItems: "stretch", justifyContent: "space-around", minHeight: "5rem", paddingBottom: "env(safe-area-inset-bottom, 0)", backgroundColor: "var(--color-surface)", boxShadow: "0 -1px 3px 0 color-mix(in srgb, var(--color-shadow) 10%, transparent)" } }, ".bottom-nav-item": { "@layer components": { display: "flex", flexDirection: "column", alignItems: "center", justifyContent: "center", flex: 1, minWidth: "4rem", maxWidth: "10rem", padding: "0.75rem 0.25rem", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", cursor: "pointer", transition: "color 150ms ease-in-out", textDecoration: "none", gap: "0.25rem" } }, ".bottom-nav-item:hover": { "@layer components": { color: "var(--color-on-surface)" } }, ".bottom-nav-item:focus-visible": { "@layer components": { outline: "none" } }, ".bottom-nav-item:focus-visible .bottom-nav-indicator": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".bottom-nav-item.active": { "@layer components": { color: "var(--color-on-surface)" } }, ".bottom-nav-indicator": { "@layer components": { position: "relative", display: "flex", alignItems: "center", justifyContent: "center", width: "4rem", height: "2rem", borderRadius: "var(--radius-lg)", transition: "background-color 150ms ease-in-out" } }, ".bottom-nav-item:hover .bottom-nav-indicator": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".bottom-nav-item.active .bottom-nav-indicator": { "@layer components": { backgroundColor: "var(--color-secondary-container)" } }, ".bottom-nav-icon": { "@layer components": { fontSize: "1.5rem", lineHeight: 1, transition: "font-size 150ms ease-in-out" } }, ".bottom-nav-label": { "@layer components": { fontSize: "0.75rem", fontWeight: 500, lineHeight: "1rem", textAlign: "center", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap", maxWidth: "100%" } }, ".bottom-nav-item.active .bottom-nav-label": { "@layer components": { fontWeight: 600 } }, ".bottom-nav-badge": { "@layer components": { position: "absolute", top: "0", right: "0.5rem", minWidth: "1rem", height: "1rem", padding: "0 0.25rem", fontSize: "0.625rem", fontWeight: 600, lineHeight: "1rem", color: "var(--color-error-content)", backgroundColor: "var(--color-error)", borderRadius: "var(--radius-full)", textAlign: "center" } }, ".bottom-nav-badge-dot": { "@layer components": { minWidth: "0.5rem", width: "0.5rem", height: "0.5rem", padding: "0", top: "0.125rem", right: "0.75rem" } }, ".bottom-nav-elevated": { "@layer components": { boxShadow: "0 -4px 6px -1px color-mix(in srgb, var(--color-shadow) 10%, transparent)" } }, ".bottom-nav-bordered": { "@layer components": { boxShadow: "none", borderTop: "1px solid var(--color-outline-variant)" } }, ".bottom-nav-filled": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".bottom-nav-primary .bottom-nav-item.active .bottom-nav-indicator": { "@layer components": { backgroundColor: "var(--color-primary-container)" } }, ".bottom-nav-primary .bottom-nav-item.active": { "@layer components": { color: "var(--color-on-primary-container)" } }, ".bottom-nav-icons-only .bottom-nav-label": { "@layer components": { display: "none" } }, ".bottom-nav-icons-only .bottom-nav-item": { "@layer components": { padding: "1rem 0.25rem" } }, ".bottom-nav-labels-active .bottom-nav-label": { "@layer components": { opacity: 0, maxHeight: "0", overflow: "hidden", transition: "opacity 150ms ease-in-out, max-height 150ms ease-in-out" } }, ".bottom-nav-labels-active .bottom-nav-item.active .bottom-nav-label": { "@layer components": { opacity: 1, maxHeight: "1rem" } }, ".bottom-nav-shifting .bottom-nav-item": { "@layer components": { flex: "0 1 4rem", transition: "flex 200ms ease-in-out" } }, ".bottom-nav-shifting .bottom-nav-item.active": { "@layer components": { flex: "1 1 6rem" } }, ".bottom-nav-shifting .bottom-nav-label": { "@layer components": { opacity: 0, transform: "translateY(0.5rem)", transition: "opacity 150ms ease-in-out, transform 150ms ease-in-out" } }, ".bottom-nav-shifting .bottom-nav-item.active .bottom-nav-label": { "@layer components": { opacity: 1, transform: "translateY(0)" } }, ".nav-rail": { "@layer components": { position: "fixed", left: "0", top: "0", bottom: "0", zIndex: 1000, display: "flex", flexDirection: "column", alignItems: "center", width: "5rem", padding: "1rem 0", backgroundColor: "var(--color-surface)", borderRight: "1px solid var(--color-outline-variant)" } }, ".nav-rail .bottom-nav-item": { "@layer components": { width: "100%", padding: "0.5rem", margin: "0.25rem 0" } }, ".nav-rail .bottom-nav-indicator": { "@layer components": { width: "3.5rem", height: "2rem" } }, ".bottom-nav-responsive": { "@layer components": { "@media (min-width: 768px)": { position: "relative", bottom: "auto", justifyContent: "flex-start", gap: "0.5rem", minHeight: "3rem", padding: "0 1rem", boxShadow: "none", borderBottom: "1px solid var(--color-outline-variant)" } } }, ".bottom-nav-responsive .bottom-nav-item": { "@layer components": { "@media (min-width: 768px)": { flex: "0 0 auto", flexDirection: "row", gap: "0.5rem", padding: "0.75rem 1rem" } } }, ".bottom-nav-responsive .bottom-nav-indicator": { "@layer components": { "@media (min-width: 768px)": { width: "auto", height: "auto", backgroundColor: "transparent !important" } } }, ".bottom-nav-responsive .bottom-nav-item.active": { "@layer components": { "@media (min-width: 768px)": { borderBottom: "2px solid var(--color-primary)" } } }, ".bottom-nav-item, \n .bottom-nav-indicator, \n .bottom-nav-icon, \n .bottom-nav-label, \n .bottom-nav-shifting .bottom-nav-item": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".circle-menu": { "@layer components": { "--circle-menu-size": "3rem", "--circle-menu-item-size": "3rem", "--circle-menu-radius": "5.5rem", "--circle-menu-icon-size": "1.25rem", "--circle-menu-bar-width": "1.125rem", "--circle-menu-bar-height": "0.1875rem", "--circle-menu-bar-gap": "0.375rem", "--circle-menu-btn-bg": "var(--color-primary-container)", "--circle-menu-bar-color": "var(--color-on-primary-container)", "--circle-menu-item-bg": "var(--color-primary-container)", "--circle-menu-item-color": "var(--color-on-primary-container)", "--circle-menu-item-ring": "color-mix(in oklch, var(--color-primary) 30%, transparent)", position: "relative", display: "inline-flex", alignItems: "center", justifyContent: "center", width: "var(--circle-menu-size)", height: "var(--circle-menu-size)" } }, ".circle-menu-toggler": { "@layer components": { position: "absolute", inset: "0", margin: "auto", width: "var(--circle-menu-size)", height: "var(--circle-menu-size)", zIndex: 10, opacity: 0, cursor: "pointer" } }, ".circle-menu-label": [{ "@layer components": { position: "absolute", inset: "0", margin: "auto", display: "block", width: "var(--circle-menu-size)", height: "var(--circle-menu-size)", borderRadius: "var(--radius-full)", backgroundColor: "var(--circle-menu-btn-bg)", zIndex: 1, pointerEvents: "none", transition: "background-color 0.3s ease" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }], ".circle-menu-label::before": { "@layer components": { content: "''", position: "absolute", top: "50%", left: "50%", width: "var(--circle-menu-bar-width)", height: "var(--circle-menu-bar-height)", borderRadius: "var(--radius-full)", backgroundColor: "var(--circle-menu-bar-color)", boxShadow: `0 var(--circle-menu-bar-gap) 0 var(--circle-menu-bar-color),
237
+ 0 calc(-1 * var(--circle-menu-bar-gap)) 0 var(--circle-menu-bar-color)`, transform: "translate(-50%, -50%)", transition: `transform 0.35s cubic-bezier(0.4, 0, 0.2, 1),
238
+ box-shadow 0.35s cubic-bezier(0.4, 0, 0.2, 1)` } }, ".circle-menu-label::after": { "@layer components": { content: "''", position: "absolute", top: "50%", left: "50%", width: "var(--circle-menu-bar-width)", height: "var(--circle-menu-bar-height)", borderRadius: "var(--radius-full)", backgroundColor: "var(--circle-menu-bar-color)", transform: "translate(-50%, -50%) rotate(-45deg)", opacity: 0, transition: "opacity 0.25s ease" } }, ".circle-menu-toggler:hover + .circle-menu-label": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--circle-menu-btn-bg) 80%, var(--circle-menu-bar-color))" } }, ".circle-menu-toggler:focus-visible + .circle-menu-label": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px var(--circle-menu-item-ring)" } }, ".circle-menu-toggler:checked + .circle-menu-label::before": { "@layer components": { boxShadow: "none", transform: "translate(-50%, -50%) rotate(45deg)" } }, ".circle-menu-toggler:checked + .circle-menu-label::after": { "@layer components": { opacity: 1 } }, ".circle-menu-list": { "@layer components": { position: "absolute", inset: "0", margin: "0", padding: "0", listStyle: "none", pointerEvents: "none" } }, ".circle-menu-item": [{ "@layer components": { position: "absolute", inset: "0", margin: "auto", width: "var(--circle-menu-item-size)", height: "var(--circle-menu-item-size)", opacity: 0, transition: `transform 0.4s cubic-bezier(0.4, 0, 0.2, 1),
239
+ opacity 0.3s ease` } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }], ".circle-menu-item a, \n .circle-menu-item button": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "100%", height: "100%", borderRadius: "var(--radius-full)", textDecoration: "none", fontSize: "var(--circle-menu-icon-size)", color: "var(--circle-menu-item-color)", backgroundColor: "var(--circle-menu-item-bg)", border: "none", cursor: "pointer", pointerEvents: "none", transition: `box-shadow 0.2s ease,
240
+ background-color 0.2s ease` } }, ".circle-menu-item a:hover, \n .circle-menu-item button:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--circle-menu-item-bg) 80%, var(--circle-menu-item-color))", boxShadow: "0 0 0 3px var(--circle-menu-item-ring)" } }, ".circle-menu-item a:focus-visible, \n .circle-menu-item button:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px var(--circle-menu-item-ring)" } }, ".circle-menu-item:nth-child(1) a, \n .circle-menu-item:nth-child(1) button": { "@layer components": { transform: "rotate(0deg)" } }, ".circle-menu-item:nth-child(2) a, \n .circle-menu-item:nth-child(2) button": { "@layer components": { transform: "rotate(-60deg)" } }, ".circle-menu-item:nth-child(3) a, \n .circle-menu-item:nth-child(3) button": { "@layer components": { transform: "rotate(-120deg)" } }, ".circle-menu-item:nth-child(4) a, \n .circle-menu-item:nth-child(4) button": { "@layer components": { transform: "rotate(-180deg)" } }, ".circle-menu-item:nth-child(5) a, \n .circle-menu-item:nth-child(5) button": { "@layer components": { transform: "rotate(-240deg)" } }, ".circle-menu-item:nth-child(6) a, \n .circle-menu-item:nth-child(6) button": { "@layer components": { transform: "rotate(-300deg)" } }, ".circle-menu-toggler:checked ~ .circle-menu-list": { "@layer components": { pointerEvents: "auto" } }, ".circle-menu-toggler:checked ~ .circle-menu-list .circle-menu-item": { "@layer components": { opacity: 1 } }, ".circle-menu-toggler:checked ~ .circle-menu-list .circle-menu-item a, \n .circle-menu-toggler:checked ~ .circle-menu-list .circle-menu-item button": { "@layer components": { pointerEvents: "auto" } }, ".circle-menu-toggler:checked ~ .circle-menu-list .circle-menu-item:nth-child(1)": { "@layer components": { transform: "rotate(0deg) translateX(calc(-1 * var(--circle-menu-radius)))" } }, ".circle-menu-toggler:checked ~ .circle-menu-list .circle-menu-item:nth-child(2)": { "@layer components": { transform: "rotate(60deg) translateX(calc(-1 * var(--circle-menu-radius)))" } }, ".circle-menu-toggler:checked ~ .circle-menu-list .circle-menu-item:nth-child(3)": { "@layer components": { transform: "rotate(120deg) translateX(calc(-1 * var(--circle-menu-radius)))" } }, ".circle-menu-toggler:checked ~ .circle-menu-list .circle-menu-item:nth-child(4)": { "@layer components": { transform: "rotate(180deg) translateX(calc(-1 * var(--circle-menu-radius)))" } }, ".circle-menu-toggler:checked ~ .circle-menu-list .circle-menu-item:nth-child(5)": { "@layer components": { transform: "rotate(240deg) translateX(calc(-1 * var(--circle-menu-radius)))" } }, ".circle-menu-toggler:checked ~ .circle-menu-list .circle-menu-item:nth-child(6)": { "@layer components": { transform: "rotate(300deg) translateX(calc(-1 * var(--circle-menu-radius)))" } }, ".circle-menu-sm": { "@layer components": { "--circle-menu-size": "2.5rem", "--circle-menu-item-size": "2.5rem", "--circle-menu-radius": "4.5rem", "--circle-menu-icon-size": "1rem", "--circle-menu-bar-width": "0.9375rem", "--circle-menu-bar-gap": "0.3125rem" } }, ".circle-menu-lg": { "@layer components": { "--circle-menu-size": "3.5rem", "--circle-menu-item-size": "3.5rem", "--circle-menu-radius": "6.5rem", "--circle-menu-icon-size": "1.5rem", "--circle-menu-bar-width": "1.3125rem", "--circle-menu-bar-gap": "0.4375rem" } }, ".circle-menu-primary": { "@layer components": { "--circle-menu-btn-bg": "var(--color-primary)", "--circle-menu-bar-color": "var(--color-primary-content)", "--circle-menu-item-bg": "var(--color-primary)", "--circle-menu-item-color": "var(--color-primary-content)", "--circle-menu-item-ring": "color-mix(in oklch, var(--color-primary) 40%, transparent)" } }, ".circle-menu-secondary": { "@layer components": { "--circle-menu-btn-bg": "var(--color-secondary)", "--circle-menu-bar-color": "var(--color-secondary-content)", "--circle-menu-item-bg": "var(--color-secondary)", "--circle-menu-item-color": "var(--color-secondary-content)", "--circle-menu-item-ring": "color-mix(in oklch, var(--color-secondary) 40%, transparent)" } }, ".circle-menu-tertiary": { "@layer components": { "--circle-menu-btn-bg": "var(--color-tertiary)", "--circle-menu-bar-color": "var(--color-tertiary-content)", "--circle-menu-item-bg": "var(--color-tertiary)", "--circle-menu-item-color": "var(--color-tertiary-content)", "--circle-menu-item-ring": "color-mix(in oklch, var(--color-tertiary) 40%, transparent)" } }, ".circle-menu-info": { "@layer components": { "--circle-menu-btn-bg": "var(--color-info)", "--circle-menu-bar-color": "var(--color-info-content)", "--circle-menu-item-bg": "var(--color-info)", "--circle-menu-item-color": "var(--color-info-content)", "--circle-menu-item-ring": "color-mix(in oklch, var(--color-info) 40%, transparent)" } }, ".circle-menu-success": { "@layer components": { "--circle-menu-btn-bg": "var(--color-success)", "--circle-menu-bar-color": "var(--color-success-content)", "--circle-menu-item-bg": "var(--color-success)", "--circle-menu-item-color": "var(--color-success-content)", "--circle-menu-item-ring": "color-mix(in oklch, var(--color-success) 40%, transparent)" } }, ".circle-menu-warning": { "@layer components": { "--circle-menu-btn-bg": "var(--color-warning)", "--circle-menu-bar-color": "var(--color-warning-content)", "--circle-menu-item-bg": "var(--color-warning)", "--circle-menu-item-color": "var(--color-warning-content)", "--circle-menu-item-ring": "color-mix(in oklch, var(--color-warning) 40%, transparent)" } }, ".circle-menu-error": { "@layer components": { "--circle-menu-btn-bg": "var(--color-error)", "--circle-menu-bar-color": "var(--color-error-content)", "--circle-menu-item-bg": "var(--color-error)", "--circle-menu-item-color": "var(--color-error-content)", "--circle-menu-item-ring": "color-mix(in oklch, var(--color-error) 40%, transparent)" } }, ".circle-menu-accent": { "@layer components": { "--circle-menu-btn-bg": "var(--color-accent)", "--circle-menu-bar-color": "var(--color-accent-content)", "--circle-menu-item-bg": "var(--color-accent)", "--circle-menu-item-color": "var(--color-accent-content)", "--circle-menu-item-ring": "color-mix(in oklch, var(--color-accent) 40%, transparent)" } }, ".circle-menu-neutral": { "@layer components": { "--circle-menu-btn-bg": "var(--color-neutral)", "--circle-menu-bar-color": "var(--color-neutral-content)", "--circle-menu-item-bg": "var(--color-neutral)", "--circle-menu-item-color": "var(--color-neutral-content)", "--circle-menu-item-ring": "color-mix(in oklch, var(--color-neutral) 40%, transparent)" } }, ".circle-menu-base": { "@layer components": { "--circle-menu-btn-bg": "var(--color-base-100)", "--circle-menu-bar-color": "var(--color-base-content)", "--circle-menu-item-bg": "var(--color-base-100)", "--circle-menu-item-color": "var(--color-base-content)", "--circle-menu-item-ring": "color-mix(in oklch, var(--color-base-content) 40%, transparent)" } }, ".circle-menu-label::before, \n .circle-menu-label::after": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".circle-menu-item a, \n .circle-menu-item button": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".drawer-backdrop": { "@layer components": { position: "fixed", inset: "0", zIndex: 1100, backgroundColor: "color-mix(in srgb, var(--color-scrim) 50%, transparent)", opacity: 0, visibility: "hidden", transition: "opacity 300ms ease-out, visibility 300ms ease-out" } }, ".drawer-backdrop-show": { "@layer components": { opacity: 1, visibility: "visible" } }, ".drawer": { "@layer components": { position: "fixed", zIndex: 1200, display: "flex", flexDirection: "column", backgroundColor: "var(--color-surface-container-low)", boxShadow: "var(--shadow-2xl)", transition: "transform 300ms ease-out" } }, ".drawer-surface": { "@layer components": { backgroundColor: "var(--color-surface)" } }, ".drawer-surface-container": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".drawer-surface-container-low": { "@layer components": { backgroundColor: "var(--color-surface-container-low)" } }, ".drawer-surface-container-high": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".drawer-left": { "@layer components": { top: "0", left: "0", bottom: "0", width: "20rem", maxWidth: "calc(100vw - 3.5rem)", transform: "translateX(-100%)", borderRadius: "0 var(--radius-lg) var(--radius-lg) 0" } }, ".drawer-left.drawer-open": { "@layer components": { transform: "translateX(0)" } }, ".drawer-right": { "@layer components": { top: "0", right: "0", bottom: "0", width: "20rem", maxWidth: "calc(100vw - 3.5rem)", transform: "translateX(100%)", borderRadius: "var(--radius-lg) 0 0 var(--radius-lg)" } }, ".drawer-right.drawer-open": { "@layer components": { transform: "translateX(0)" } }, ".drawer-top": { "@layer components": { top: "0", left: "0", right: "0", height: "auto", maxHeight: "80vh", transform: "translateY(-100%)", borderRadius: "0 0 var(--radius-lg) var(--radius-lg)" } }, ".drawer-top.drawer-open": { "@layer components": { transform: "translateY(0)" } }, ".drawer-bottom": { "@layer components": { bottom: "0", left: "0", right: "0", height: "auto", maxHeight: "80vh", transform: "translateY(100%)", borderRadius: "var(--radius-lg) var(--radius-lg) 0 0" } }, ".drawer-bottom.drawer-open": { "@layer components": { transform: "translateY(0)" } }, ".drawer-header": { "@layer components": { display: "flex", alignItems: "center", gap: "0.75rem", padding: "1rem", borderBottom: "1px solid var(--color-outline-variant)", flexShrink: 0 } }, ".drawer-title": { "@layer components": { flex: 1, fontSize: "1.125rem", fontWeight: 500, color: "var(--color-on-surface)" } }, ".drawer-close": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "2.5rem", height: "2.5rem", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", transition: "background-color 150ms ease-in-out" } }, ".drawer-close:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".drawer-close:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".drawer-body": { "@layer components": { flex: 1, overflowY: "auto", padding: "0.5rem 0.75rem" } }, ".drawer-footer": { "@layer components": { display: "flex", alignItems: "center", gap: "0.75rem", padding: "1rem", borderTop: "1px solid var(--color-outline-variant)", flexShrink: 0 } }, ".drawer-item": { "@layer components": { display: "flex", alignItems: "center", gap: "0.75rem", padding: "0.75rem 1rem", fontSize: "0.875rem", fontWeight: 500, color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-2xl)", cursor: "pointer", textDecoration: "none", transition: "background-color 150ms ease-in-out, color 150ms ease-in-out", width: "100%" } }, ".drawer-item:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)", color: "var(--color-on-surface)" } }, ".drawer-item:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".drawer-item-active, \n .drawer-item-active-primary": { "@layer components": { backgroundColor: "var(--color-secondary-container)", color: "var(--color-on-secondary-container)" } }, ".drawer-item-active-secondary": { "@layer components": { backgroundColor: "var(--color-secondary-container)", color: "var(--color-on-secondary-container)" } }, ".drawer-item-active-tertiary": { "@layer components": { backgroundColor: "var(--color-tertiary-container)", color: "var(--color-on-tertiary-container)" } }, ".drawer-item-icon": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.5rem", height: "1.5rem", fontSize: "1.25rem", flexShrink: 0 } }, ".drawer-item-badge": { "@layer components": { padding: "0.125rem 0.5rem", fontSize: "0.75rem", fontWeight: 500, backgroundColor: "var(--color-error-container)", color: "var(--color-on-error-container)", borderRadius: "var(--radius-full)", marginLeft: "auto" } }, ".drawer-item-nested": { "@layer components": { paddingLeft: "3rem" } }, ".drawer-item-nested-2": { "@layer components": { paddingLeft: "4.5rem" } }, ".drawer-label": { "@layer components": { padding: "0.75rem 1rem 0.5rem", fontSize: "0.6875rem", fontWeight: 600, textTransform: "uppercase", letterSpacing: "0.05em", color: "var(--color-on-surface-variant)" } }, ".drawer-divider": { "@layer components": { height: "1px", margin: "0.5rem 1rem", backgroundColor: "var(--color-outline-variant)" } }, ".drawer-profile": { "@layer components": { display: "flex", alignItems: "center", gap: "0.75rem", padding: "1rem", borderBottom: "1px solid var(--color-outline-variant)" } }, ".drawer-profile-avatar": { "@layer components": { width: "2.5rem", height: "2.5rem", borderRadius: "var(--radius-full)", backgroundColor: "var(--color-primary-container)", display: "flex", alignItems: "center", justifyContent: "center", fontWeight: 600, color: "var(--color-on-primary-container)", flexShrink: 0 } }, ".drawer-profile-info": { "@layer components": { flex: 1, minWidth: "0" } }, ".drawer-profile-name": { "@layer components": { fontSize: "0.875rem", fontWeight: 500, color: "var(--color-on-surface)", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, ".drawer-profile-email": { "@layer components": { fontSize: "0.75rem", color: "var(--color-on-surface-variant)", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, ".drawer-permanent": { "@layer components": { position: "relative", transform: "none", boxShadow: "none", borderRadius: "0", borderRight: "1px solid var(--color-outline-variant)" } }, ".drawer-permanent.drawer-right": { "@layer components": { borderRight: "none", borderLeft: "1px solid var(--color-outline-variant)" } }, ".drawer-rail": { "@layer components": { width: "5rem", overflow: "hidden", transition: "width 300ms ease-out" } }, ".drawer-rail:hover, \n .drawer-rail.expanded": { "@layer components": { width: "20rem" } }, ".drawer-rail .drawer-item span:not(.drawer-item-icon)": { "@layer components": { opacity: 0, transition: "opacity 150ms ease-out" } }, ".drawer-rail:hover .drawer-item span:not(.drawer-item-icon), \n .drawer-rail.expanded .drawer-item span:not(.drawer-item-icon)": { "@layer components": { opacity: 1 } }, ".drawer-sm": { "@layer components": { width: "12rem" } }, ".drawer-md": { "@layer components": { width: "16rem" } }, ".drawer-lg": { "@layer components": { width: "20rem" } }, ".drawer-xl": { "@layer components": { width: "24rem" } }, ".drawer-full": { "@layer components": { width: "100%", maxWidth: "100%", borderRadius: "0" } }, ".drawer, \n .drawer-backdrop, \n .drawer-close, \n .drawer-item, \n .drawer-rail": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".nested-menu": { "@layer components": { display: "flex", flexDirection: "column", listStyle: "none", margin: "0", padding: "0.5rem", gap: "0.125rem", fontSize: "0.875rem", color: "var(--color-on-surface)" } }, ".nested-menu-title": { "@layer components": { padding: "0.75rem 0.75rem 0.25rem", fontSize: "0.6875rem", fontWeight: 600, textTransform: "uppercase", letterSpacing: "0.05em", color: "var(--color-on-surface-variant)", userSelect: "none" } }, ".nested-menu li > a, \n .nested-menu li > button": { "@layer components": { display: "flex", alignItems: "center", gap: "0.5rem", width: "100%", padding: "0.5rem 0.75rem", fontSize: "inherit", color: "var(--color-on-surface)", textDecoration: "none", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-field, 0.375rem)", cursor: "pointer", transition: "background-color 150ms ease-in-out, color 150ms ease-in-out" } }, ".nested-menu li > a:hover, \n .nested-menu li > button:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".nested-menu li > a:focus-visible, \n .nested-menu li > button:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, '.nested-menu li > a.active, \n .nested-menu li > button.active, \n .nested-menu li > a[aria-current="page"], \n .nested-menu li > button[aria-current="page"]': { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, '.nested-menu li > a.active:hover, \n .nested-menu li > button.active:hover, \n .nested-menu li > a[aria-current="page"]:hover, \n .nested-menu li > button[aria-current="page"]:hover': { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-primary-container), var(--color-on-primary-container) 8%)" } }, ".nested-menu li.disabled": { "@layer components": { opacity: "1 !important", pointerEvents: "none" } }, ".nested-menu li.disabled > a, \n .nested-menu li.disabled > button": { "@layer components": { color: "var(--color-on-surface-variant)" } }, ".nested-menu details": { "@layer components": { width: "100%" } }, ".nested-menu summary": { "@layer components": { display: "flex", alignItems: "center", gap: "0.5rem", width: "100%", padding: "0.5rem 0.75rem", fontSize: "inherit", color: "var(--color-on-surface)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-field, 0.375rem)", cursor: "pointer", listStyle: "none", transition: "background-color 150ms ease-in-out" } }, ".nested-menu summary::-webkit-details-marker": { "@layer components": { display: "none" } }, ".nested-menu summary::marker": { "@layer components": { display: "none", content: '""' } }, ".nested-menu summary:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".nested-menu summary:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".nested-menu summary::after": { "@layer components": { content: '""', display: "inline-block", marginLeft: "auto", width: "0.375rem", height: "0.375rem", borderRight: "1.5px solid currentColor", borderBottom: "1.5px solid currentColor", transform: "rotate(-45deg)", transition: "transform 200ms ease-in-out", flexShrink: 0, opacity: 0.6 } }, ".nested-menu details[open] > summary::after": { "@layer components": { transform: "rotate(45deg)" } }, ".nested-menu details > ul": { "@layer components": { listStyle: "none", margin: "0", padding: "0.125rem 0 0.125rem 1rem", display: "flex", flexDirection: "column", gap: "0.125rem" } }, ".nested-menu-xs": { "@layer components": { fontSize: "0.75rem", padding: "0.25rem" } }, ".nested-menu-xs li > a, \n .nested-menu-xs li > button, \n .nested-menu-xs summary": { "@layer components": { padding: "0.25rem 0.5rem", gap: "0.375rem" } }, ".nested-menu-xs .nested-menu-title": { "@layer components": { padding: "0.5rem 0.5rem 0.125rem", fontSize: "0.625rem" } }, ".nested-menu-sm": { "@layer components": { fontSize: "0.8125rem", padding: "0.375rem" } }, ".nested-menu-sm li > a, \n .nested-menu-sm li > button, \n .nested-menu-sm summary": { "@layer components": { padding: "0.375rem 0.625rem", gap: "0.375rem" } }, ".nested-menu-sm .nested-menu-title": { "@layer components": { padding: "0.625rem 0.625rem 0.1875rem", fontSize: "0.625rem" } }, ".nested-menu-lg": { "@layer components": { fontSize: "1rem", padding: "0.625rem" } }, ".nested-menu-lg li > a, \n .nested-menu-lg li > button, \n .nested-menu-lg summary": { "@layer components": { padding: "0.625rem 1rem", gap: "0.625rem" } }, ".nested-menu-lg .nested-menu-title": { "@layer components": { padding: "0.875rem 1rem 0.375rem", fontSize: "0.75rem" } }, ".nested-menu-bordered": { "@layer components": { backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline-variant)", borderRadius: "var(--radius-card, 0.75rem)", boxShadow: "var(--shadow-sm)" } }, ".nested-menu-compact": { "@layer components": { padding: "0.25rem", gap: "0" } }, ".nested-menu-compact li > a, \n .nested-menu-compact li > button, \n .nested-menu-compact summary": { "@layer components": { padding: "0.3125rem 0.625rem" } }, ".nested-menu-compact .nested-menu-title": { "@layer components": { padding: "0.5rem 0.625rem 0.125rem" } }, ".nested-menu-compact details > ul": { "@layer components": { padding: "0 0 0 0.75rem" } }, ".nested-menu li > a, \n .nested-menu li > button, \n .nested-menu summary, \n .nested-menu summary::after": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".stepper": { "@layer components": { display: "flex", alignItems: "flex-start", gap: "0" } }, ".stepper-step": { "@layer components": { display: "flex", flexDirection: "column", alignItems: "center", flex: 1, position: "relative" } }, ".stepper-step-connector": { "@layer components": { position: "absolute", top: "1.25rem", left: "calc(50% + 1.25rem)", width: "calc(100% - 2.5rem)", height: "2px", backgroundColor: "var(--color-outline-variant)" } }, ".stepper-step:last-child .stepper-step-connector": { "@layer components": { display: "none" } }, ".stepper-step-completed .stepper-step-connector": { "@layer components": { backgroundColor: "var(--color-primary)" } }, ".stepper-step-button": { "@layer components": { display: "flex", flexDirection: "column", alignItems: "center", gap: "0.5rem", cursor: "pointer", zIndex: 1, background: "none", border: "none", padding: "0" } }, ".stepper-step-button:focus-visible": { "@layer components": { outline: "none" } }, ".stepper-step-button:focus-visible .stepper-step-icon": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".stepper-step-icon": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "2.5rem", height: "2.5rem", fontSize: "0.875rem", fontWeight: 500, color: "var(--color-on-surface-variant)", backgroundColor: "var(--color-surface)", border: "2px solid var(--color-outline-variant)", borderRadius: "var(--radius-full)", transition: "background-color 150ms ease-in-out, border-color 150ms ease-in-out, color 150ms ease-in-out" } }, ".stepper-step-active .stepper-step-icon": { "@layer components": { backgroundColor: "var(--color-primary)", borderColor: "var(--color-primary)", color: "var(--color-primary-content)" } }, ".stepper-step-completed .stepper-step-icon": { "@layer components": { backgroundColor: "var(--color-primary)", borderColor: "var(--color-primary)", color: "var(--color-primary-content)" } }, ".stepper-step-error .stepper-step-icon": { "@layer components": { backgroundColor: "var(--color-error)", borderColor: "var(--color-error)", color: "var(--color-error-content)" } }, ".stepper-step-disabled .stepper-step-icon": { "@layer components": { opacity: 0.7, cursor: "not-allowed" } }, ".stepper-step-label": { "@layer components": { fontSize: "0.875rem", fontWeight: 500, color: "var(--color-on-surface)", textAlign: "center" } }, ".stepper-step-active .stepper-step-label": { "@layer components": { color: "var(--color-primary)" } }, ".stepper-step-error .stepper-step-label": { "@layer components": { color: "var(--color-error)" } }, ".stepper-step-description": { "@layer components": { fontSize: "0.75rem", color: "var(--color-on-surface-variant)", marginTop: "0.125rem", textAlign: "center" } }, ".stepper-step-content": { "@layer components": { marginTop: "1.5rem", padding: "0 1rem", width: "100%" } }, ".stepper-step-optional::after": { "@layer components": { content: "'(Optional)'", display: "block", fontSize: "0.6875rem", color: "var(--color-on-surface-variant)", marginTop: "0.125rem" } }, ".stepper-vertical": { "@layer components": { flexDirection: "column", alignItems: "flex-start" } }, ".stepper-vertical .stepper-step": { "@layer components": { flexDirection: "row", alignItems: "flex-start", width: "100%" } }, ".stepper-vertical .stepper-step-connector": { "@layer components": { top: "2.5rem", left: "1.25rem", width: "2px", height: "calc(100% - 2.5rem)", transform: "translateX(-50%)" } }, ".stepper-vertical .stepper-step-button": { "@layer components": { flexDirection: "row", alignItems: "center" } }, ".stepper-vertical .stepper-step-label, \n .stepper-vertical .stepper-step-description": { "@layer components": { textAlign: "left", marginLeft: "1rem" } }, ".stepper-vertical .stepper-step-content": { "@layer components": { marginTop: "0", marginLeft: "3.5rem", padding: "1rem 0 1.5rem" } }, ".stepper-secondary .stepper-step-active .stepper-step-icon, \n .stepper-secondary .stepper-step-completed .stepper-step-icon": { "@layer components": { backgroundColor: "var(--color-secondary)", borderColor: "var(--color-secondary)", color: "var(--color-secondary-content)" } }, ".stepper-secondary .stepper-step-completed .stepper-step-connector": { "@layer components": { backgroundColor: "var(--color-secondary)" } }, ".stepper-secondary .stepper-step-active .stepper-step-label": { "@layer components": { color: "var(--color-secondary)" } }, ".stepper-tertiary .stepper-step-active .stepper-step-icon, \n .stepper-tertiary .stepper-step-completed .stepper-step-icon": { "@layer components": { backgroundColor: "var(--color-tertiary)", borderColor: "var(--color-tertiary)", color: "var(--color-tertiary-content)" } }, ".stepper-tertiary .stepper-step-completed .stepper-step-connector": { "@layer components": { backgroundColor: "var(--color-tertiary)" } }, ".stepper-tertiary .stepper-step-active .stepper-step-label": { "@layer components": { color: "var(--color-tertiary)" } }, ".stepper-sm .stepper-step-icon": { "@layer components": { width: "2rem", height: "2rem", fontSize: "0.75rem" } }, ".stepper-sm .stepper-step-connector": { "@layer components": { top: "1rem", left: "calc(50% + 1rem)", width: "calc(100% - 2rem)" } }, ".stepper-sm .stepper-step-label": { "@layer components": { fontSize: "0.75rem" } }, ".stepper-sm .stepper-step-description": { "@layer components": { fontSize: "0.625rem" } }, ".stepper-lg .stepper-step-icon": { "@layer components": { width: "3rem", height: "3rem", fontSize: "1rem" } }, ".stepper-lg .stepper-step-connector": { "@layer components": { top: "1.5rem", left: "calc(50% + 1.5rem)", width: "calc(100% - 3rem)" } }, ".stepper-alt-labels .stepper-step-connector": { "@layer components": { top: "1.25rem", left: "calc(50% + 2rem)", width: "calc(100% - 4rem)" } }, ".stepper-dots": { "@layer components": { gap: "0.5rem" } }, ".stepper-dots .stepper-step-icon": { "@layer components": { width: "0.75rem", height: "0.75rem", fontSize: "0", borderWidth: "0", backgroundColor: "var(--color-outline-variant)" } }, ".stepper-dots .stepper-step-active .stepper-step-icon": { "@layer components": { width: "1.5rem", borderRadius: "var(--radius-full)", backgroundColor: "var(--color-primary)" } }, ".stepper-dots .stepper-step-completed .stepper-step-icon": { "@layer components": { backgroundColor: "var(--color-primary)" } }, ".stepper-dots .stepper-step-connector": { "@layer components": { display: "none" } }, ".stepper-dots .stepper-step-label, \n .stepper-dots .stepper-step-description": { "@layer components": { display: "none" } }, ".stepper-clickable .stepper-step-button": { "@layer components": { cursor: "pointer" } }, ".stepper-clickable .stepper-step-button:hover .stepper-step-icon": { "@layer components": { borderColor: "var(--color-primary)" } }, ".stepper-clickable .stepper-step-completed .stepper-step-button:hover .stepper-step-icon": { "@layer components": { backgroundColor: "var(--color-primary-container)" } }, ".stepper-step-disabled .stepper-step-button": { "@layer components": { cursor: "not-allowed", opacity: 0.7 } }, ".stepper-icons .stepper-step-icon": { "@layer components": { fontSize: "1.25rem" } }, ".stepper-step-icon, \n .stepper-dots .stepper-step-icon": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".accordion": { "@layer components": { display: "flex", flexDirection: "column", borderRadius: "var(--radius-md)", overflow: "hidden" } }, ".accordion-item": { "@layer components": { backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline-variant)", marginTop: "-1px" } }, ".accordion-item:first-child": { "@layer components": { marginTop: "0", borderTopLeftRadius: "var(--radius-md)", borderTopRightRadius: "var(--radius-md)" } }, ".accordion-item:last-child": { "@layer components": { borderBottomLeftRadius: "var(--radius-md)", borderBottomRightRadius: "var(--radius-md)" } }, ".accordion-header": { "@layer components": { display: "flex", alignItems: "center", width: "100%", padding: "1rem", fontSize: "0.875rem", fontWeight: 500, color: "var(--color-on-surface)", backgroundColor: "transparent", border: "none", cursor: "pointer", textAlign: "left", transition: "background-color 150ms ease-in-out" } }, ".accordion-header:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".accordion-header:focus-visible": { "@layer components": { outline: "none", backgroundColor: "var(--color-surface-container)", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".accordion-item.open .accordion-header": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".accordion-icon": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.5rem", height: "1.5rem", marginRight: "0.75rem", color: "var(--color-on-surface-variant)", flexShrink: 0 } }, ".accordion-title": { "@layer components": { flex: 1 } }, ".accordion-subtitle": { "@layer components": { fontSize: "0.75rem", fontWeight: 400, color: "var(--color-on-surface-variant)", marginTop: "0.125rem" } }, ".accordion-expand": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.5rem", height: "1.5rem", marginLeft: "auto", color: "var(--color-on-surface-variant)", transition: "transform 200ms ease-in-out", flexShrink: 0 } }, ".accordion-item.open .accordion-expand": { "@layer components": { transform: "rotate(180deg)" } }, ".accordion-content": { "@layer components": { display: "grid", gridTemplateRows: "0fr", transition: "grid-template-rows 200ms ease-in-out" } }, ".accordion-item.open .accordion-content": { "@layer components": { gridTemplateRows: "1fr" } }, ".accordion-body": { "@layer components": { overflow: "hidden" } }, ".accordion-body-inner": { "@layer components": { padding: "0 1rem 1rem", fontSize: "0.875rem", color: "var(--color-on-surface-variant)", lineHeight: 1.5 } }, ".accordion-borderless .accordion-item": { "@layer components": { border: "none", borderBottom: "1px solid var(--color-outline-variant)", borderRadius: "0" } }, ".accordion-borderless .accordion-item:last-child": { "@layer components": { borderBottom: "none" } }, ".accordion-separated .accordion-item": { "@layer components": { marginTop: "0.5rem", borderRadius: "var(--radius-md)" } }, ".accordion-separated .accordion-item:first-child": { "@layer components": { marginTop: "0" } }, ".accordion-filled .accordion-item": { "@layer components": { backgroundColor: "var(--color-surface-container)", border: "none" } }, ".accordion-filled .accordion-header:hover, \n .accordion-filled .accordion-item.open .accordion-header": { "@layer components": { backgroundColor: "var(--color-surface-container-high)" } }, ".accordion-compact .accordion-header": { "@layer components": { padding: "0.75rem" } }, ".accordion-compact .accordion-body-inner": { "@layer components": { padding: "0 0.75rem 0.75rem" } }, ".accordion-lg .accordion-header": { "@layer components": { padding: "1.25rem", fontSize: "1rem" } }, ".accordion-lg .accordion-body-inner": { "@layer components": { padding: "0 1.25rem 1.25rem", fontSize: "1rem" } }, ".accordion-item.disabled .accordion-header": { "@layer components": { cursor: "not-allowed", opacity: 0.6, backgroundColor: "transparent" } }, ".accordion-item.disabled .accordion-header:hover": { "@layer components": { backgroundColor: "transparent" } }, ".accordion-flush": { "@layer components": { borderRadius: "0" } }, ".accordion-flush .accordion-item:first-child, \n .accordion-flush .accordion-item:last-child": { "@layer components": { borderRadius: "0" } }, ".accordion-multiple .accordion-item.open + .accordion-item.open": { "@layer components": { borderTopColor: "transparent" } }, ".accordion-actions": { "@layer components": { display: "flex", gap: "0.5rem", padding: "0.75rem 1rem", backgroundColor: "var(--color-surface-container)", borderTop: "1px solid var(--color-outline-variant)" } }, ".accordion-nested": { "@layer components": { margin: "0 -1rem", borderRadius: "0" } }, ".accordion-nested .accordion-item": { "@layer components": { borderLeft: "none", borderRight: "none", borderRadius: "0" } }, ".accordion-primary .accordion-item.open .accordion-header": { "@layer components": { backgroundColor: "var(--color-primary-container)", color: "var(--color-on-primary-container)" } }, ".accordion-primary .accordion-item.open .accordion-expand": { "@layer components": { color: "var(--color-on-primary-container)" } }, ".accordion-content, \n .accordion-expand, \n .accordion-header": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".bottomsheet-backdrop": { "@layer components": { position: "fixed", inset: "0", zIndex: 1100, backgroundColor: "color-mix(in srgb, var(--color-scrim) 50%, transparent)", opacity: 0, visibility: "hidden", transition: "opacity 300ms ease-out, visibility 300ms ease-out" } }, ".bottomsheet-backdrop.show": { "@layer components": { opacity: 1, visibility: "visible" } }, ".bottomsheet": { "@layer components": { position: "fixed", bottom: "0", left: "0", right: "0", zIndex: 1200, display: "flex", flexDirection: "column", maxHeight: "90vh", backgroundColor: "var(--color-surface)", borderRadius: "var(--radius-2xl) var(--radius-2xl) 0 0", boxShadow: "0 -25px 50px -12px color-mix(in srgb, var(--color-shadow) 25%, transparent)", transform: "translateY(100%)", transition: "transform 300ms ease-out", paddingBottom: "env(safe-area-inset-bottom, 0)" } }, ".bottomsheet.show": { "@layer components": { transform: "translateY(0)" } }, ".bottomsheet-handle": { "@layer components": { display: "flex", justifyContent: "center", padding: "1rem", cursor: "grab", touchAction: "none" } }, ".bottomsheet-handle::before": { "@layer components": { content: "''", width: "2rem", height: "0.25rem", backgroundColor: "var(--color-outline-variant)", borderRadius: "var(--radius-full)" } }, ".bottomsheet-handle:active": { "@layer components": { cursor: "grabbing" } }, ".bottomsheet-header": { "@layer components": { display: "flex", alignItems: "center", gap: "0.75rem", padding: "0 1.5rem 1rem", flexShrink: 0 } }, ".bottomsheet-title": { "@layer components": { flex: 1, fontSize: "1.25rem", fontWeight: 500, color: "var(--color-on-surface)" } }, ".bottomsheet-close": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "2.5rem", height: "2.5rem", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-full)", cursor: "pointer", transition: "background-color 150ms ease-in-out" } }, ".bottomsheet-close:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".bottomsheet-close:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".bottomsheet-content": { "@layer components": { flex: 1, overflowY: "auto", padding: "0 1.5rem", overscrollBehavior: "contain" } }, ".bottomsheet-footer": { "@layer components": { display: "flex", alignItems: "center", gap: "0.75rem", padding: "1rem 1.5rem", borderTop: "1px solid var(--color-outline-variant)", flexShrink: 0 } }, ".bottomsheet-list": { "@layer components": { display: "flex", flexDirection: "column", margin: "0 -1.5rem" } }, ".bottomsheet-item": { "@layer components": { display: "flex", alignItems: "center", gap: "1rem", width: "100%", padding: "1rem 1.5rem", fontSize: "0.875rem", color: "var(--color-on-surface)", backgroundColor: "transparent", border: "none", cursor: "pointer", textAlign: "left", textDecoration: "none", transition: "background-color 150ms ease-in-out" } }, ".bottomsheet-item:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".bottomsheet-item:focus-visible": { "@layer components": { outline: "none", backgroundColor: "var(--color-surface-container)", boxShadow: "inset 0 0 0 2px var(--color-primary)" } }, ".bottomsheet-item-icon": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.5rem", height: "1.5rem", color: "var(--color-on-surface-variant)", fontSize: "1.25rem", flexShrink: 0 } }, ".bottomsheet-item-content": { "@layer components": { flex: 1, minWidth: "0" } }, ".bottomsheet-item-label": { "@layer components": { fontWeight: 500, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, ".bottomsheet-item-description": { "@layer components": { fontSize: "0.75rem", color: "var(--color-on-surface-variant)", marginTop: "0.125rem", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, ".bottomsheet-grid": { "@layer components": { display: "grid", gridTemplateColumns: "repeat(3, 1fr)", gap: "0.5rem", padding: "0.5rem 0" } }, ".bottomsheet-grid-item": { "@layer components": { display: "flex", flexDirection: "column", alignItems: "center", gap: "0.5rem", padding: "1rem 0.5rem", fontSize: "0.75rem", color: "var(--color-on-surface)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-md)", cursor: "pointer", transition: "background-color 150ms ease-in-out" } }, ".bottomsheet-grid-item:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".bottomsheet-grid-item-icon": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "3rem", height: "3rem", fontSize: "1.5rem", backgroundColor: "var(--color-surface-container-high)", borderRadius: "var(--radius-full)", color: "var(--color-on-surface-variant)" } }, ".bottomsheet-sm": { "@layer components": { maxHeight: "50vh" } }, ".bottomsheet-lg": { "@layer components": { maxHeight: "95vh" } }, ".bottomsheet-full": { "@layer components": { maxHeight: "100vh", height: "100vh", borderRadius: "0" } }, ".bottomsheet-persistent": { "@layer components": { position: "absolute", boxShadow: "0 -4px 6px -1px color-mix(in srgb, var(--color-shadow) 10%, transparent)" } }, ".bottomsheet-peek": { "@layer components": { maxHeight: "30vh" } }, ".bottomsheet-half": { "@layer components": { maxHeight: "50vh" } }, ".bottomsheet-expanded": { "@layer components": { maxHeight: "90vh" } }, ".bottomsheet-detents": { "@layer components": { position: "absolute", right: "1rem", top: "50%", transform: "translateY(-50%)", display: "flex", flexDirection: "column", gap: "0.25rem" } }, ".bottomsheet-detent": { "@layer components": { width: "0.25rem", height: "1rem", backgroundColor: "var(--color-outline-variant)", borderRadius: "var(--radius-full)", cursor: "pointer" } }, ".bottomsheet-detent.active": { "@layer components": { backgroundColor: "var(--color-primary)" } }, ".bottomsheet-divider": { "@layer components": { height: "1px", margin: "0.5rem 0", backgroundColor: "var(--color-outline-variant)" } }, ".bottomsheet-section-title": { "@layer components": { padding: "0.75rem 0", fontSize: "0.75rem", fontWeight: 600, textTransform: "uppercase", letterSpacing: "0.05em", color: "var(--color-on-surface-variant)" } }, ".bottomsheet-responsive": { "@layer components": { "@media (min-width: 768px)": { left: "auto", right: "0", top: "0", bottom: "0", width: "24rem", maxWidth: "calc(100vw - 3.5rem)", maxHeight: "100vh", borderRadius: "var(--radius-lg) 0 0 var(--radius-lg)", transform: "translateX(100%)" } } }, ".bottomsheet-responsive.show": { "@layer components": { "@media (min-width: 768px)": { transform: "translateX(0)" } } }, ".bottomsheet-responsive .bottomsheet-handle": { "@layer components": { "@media (min-width: 768px)": { display: "none" } } }, ".bottomsheet, \n .bottomsheet-backdrop, \n .bottomsheet-close, \n .bottomsheet-item, \n .bottomsheet-grid-item": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".collapse": { "@layer components": { display: "flex", flexDirection: "column", borderRadius: "var(--radius-sm)", backgroundColor: "var(--color-surface)", visibility: "visible !important" } }, ".collapse-trigger": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "space-between", width: "100%", padding: "0.75rem 1rem", fontSize: "1rem", fontWeight: 500, color: "var(--color-on-surface)", backgroundColor: "transparent", border: "none", cursor: "pointer", transition: "background-color 150ms ease-in-out", textAlign: "left" } }, ".collapse-trigger:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".collapse-trigger:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".collapse-icon": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.5rem", height: "1.5rem", transition: "transform 300ms ease-in-out", flexShrink: 0 } }, ".collapse-content": { "@layer components": { display: "grid", gridTemplateRows: "0fr", transition: "grid-template-rows 300ms ease-in-out", overflow: "hidden" } }, ".collapse-content > *": { "@layer components": { overflow: "hidden", padding: "0 1rem" } }, ".collapse-open .collapse-content": { "@layer components": { gridTemplateRows: "1fr" } }, ".collapse-open .collapse-content > *": { "@layer components": { padding: "0 1rem 1rem" } }, ".collapse-open .collapse-icon": { "@layer components": { transform: "rotate(180deg)" } }, ".collapse-closed .collapse-content": { "@layer components": { gridTemplateRows: "0fr" } }, ".collapse.show .collapse-content": { "@layer components": { gridTemplateRows: "1fr" } }, ".collapse.show .collapse-content > *": { "@layer components": { padding: "0 1rem 1rem" } }, ".collapse.show .collapse-icon": { "@layer components": { transform: "rotate(180deg)" } }, ".collapse-inner": { "@layer components": {} }, ".collapse-fade": { "@layer components": { opacity: 0, transition: "grid-template-rows 300ms ease-in-out, opacity 200ms ease-in-out" } }, ".collapse-fade.show": { "@layer components": { opacity: 1, transition: "grid-template-rows 300ms ease-in-out, opacity 300ms ease-in-out 100ms" } }, ".collapse-toggle": { "@layer components": { display: "inline-flex", alignItems: "center", gap: "0.5rem", padding: "0.5rem 1rem", fontSize: "0.875rem", fontWeight: 500, color: "var(--color-primary)", backgroundColor: "transparent", border: "none", cursor: "pointer", transition: "background-color 150ms ease-in-out", borderRadius: "var(--radius-sm)" } }, ".collapse-toggle:hover": { "@layer components": { backgroundColor: "var(--color-primary-container)" } }, ".collapse-toggle:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".collapse-toggle-icon": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.25rem", height: "1.25rem", transition: "transform 200ms ease-in-out" } }, '.collapse-toggle[aria-expanded="true"] .collapse-toggle-icon': { "@layer components": { transform: "rotate(180deg)" } }, ".collapse-card": { "@layer components": { backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline-variant)", borderRadius: "var(--radius-md)", overflow: "hidden", boxShadow: "var(--shadow-sm)" } }, ".collapse-card .collapse-toggle, \n .collapse-card .collapse-trigger": { "@layer components": { width: "100%", justifyContent: "space-between", padding: "1rem", borderRadius: "0", color: "var(--color-on-surface)" } }, ".collapse-card .collapse-toggle:hover, \n .collapse-card .collapse-trigger:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".collapse-card .collapse-inner, \n .collapse-card .collapse-content > *": { "@layer components": { color: "var(--color-on-surface-variant)" } }, ".collapse-card.collapse-open .collapse-inner, \n .collapse-card.collapse-open .collapse-content > *, \n .collapse-card.show .collapse-inner, \n .collapse-card.show .collapse-content > *": { "@layer components": { padding: "0 1rem 1rem" } }, ".collapse-bordered": { "@layer components": { border: "1px solid var(--color-outline-variant)", borderRadius: "var(--radius-sm)" } }, ".collapse-ghost": { "@layer components": { backgroundColor: "transparent" } }, ".collapse-ghost .collapse-trigger:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-on-surface) 5%, transparent)" } }, ".collapse-primary .collapse-trigger": { "@layer components": { color: "var(--color-primary)" } }, ".collapse-primary .collapse-trigger:hover": { "@layer components": { backgroundColor: "var(--color-primary-container)" } }, ".collapse-secondary .collapse-trigger": { "@layer components": { color: "var(--color-secondary)" } }, ".collapse-secondary .collapse-trigger:hover": { "@layer components": { backgroundColor: "var(--color-secondary-container)" } }, ".collapse-tertiary .collapse-trigger": { "@layer components": { color: "var(--color-tertiary)" } }, ".collapse-tertiary .collapse-trigger:hover": { "@layer components": { backgroundColor: "var(--color-tertiary-container)" } }, ".collapse-info .collapse-trigger": { "@layer components": { color: "var(--color-info)" } }, ".collapse-info .collapse-trigger:hover": { "@layer components": { backgroundColor: "var(--color-info-container)" } }, ".collapse-success .collapse-trigger": { "@layer components": { color: "var(--color-success)" } }, ".collapse-success .collapse-trigger:hover": { "@layer components": { backgroundColor: "var(--color-success-container)" } }, ".collapse-warning .collapse-trigger": { "@layer components": { color: "var(--color-warning)" } }, ".collapse-warning .collapse-trigger:hover": { "@layer components": { backgroundColor: "var(--color-warning-container)" } }, ".collapse-error .collapse-trigger": { "@layer components": { color: "var(--color-error)" } }, ".collapse-error .collapse-trigger:hover": { "@layer components": { backgroundColor: "var(--color-error-container)" } }, ".collapse-accent .collapse-trigger": { "@layer components": { color: "var(--color-accent)" } }, ".collapse-accent .collapse-trigger:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-accent) 15%, var(--color-surface))" } }, ".collapse-neutral .collapse-trigger": { "@layer components": { color: "var(--color-neutral)" } }, ".collapse-neutral .collapse-trigger:hover": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-neutral) 15%, var(--color-surface))" } }, ".collapse-base .collapse-trigger": { "@layer components": { color: "var(--color-base-content)" } }, ".collapse-base .collapse-trigger:hover": { "@layer components": { backgroundColor: "var(--color-base-200)" } }, ".collapse-sm .collapse-trigger": { "@layer components": { padding: "0.5rem 0.75rem", fontSize: "0.875rem" } }, ".collapse-sm .collapse-content > *": { "@layer components": { padding: "0 0.75rem" } }, ".collapse-sm.collapse-open .collapse-content > *": { "@layer components": { padding: "0 0.75rem 0.75rem" } }, ".collapse-lg .collapse-trigger": { "@layer components": { padding: "1rem 1.25rem", fontSize: "1.125rem" } }, ".collapse-lg .collapse-content > *": { "@layer components": { padding: "0 1.25rem" } }, ".collapse-lg.collapse-open .collapse-content > *": { "@layer components": { padding: "0 1.25rem 1.25rem" } }, ".collapse-divider .collapse-trigger": { "@layer components": { borderBottom: "1px solid var(--color-outline-variant)" } }, ".collapse-divider.collapse-open .collapse-trigger": { "@layer components": { borderBottomColor: "var(--color-outline-variant)" } }, ".collapse-disabled": { "@layer components": { opacity: 0.7, pointerEvents: "none" } }, ".collapse-disabled .collapse-trigger": { "@layer components": { cursor: "not-allowed" } }, ".collapse-loading .collapse-trigger::after": [{ "@layer components": { content: "''", display: "inline-block", width: "1rem", height: "1rem", marginLeft: "0.5rem", border: "2px solid var(--color-outline)", borderTopColor: "var(--color-primary)", borderRadius: "var(--radius-full)", animation: "collapse-spin 0.8s linear infinite" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { animation: "none" } } }], "@keyframes collapse-spin": { to: { transform: "rotate(360deg)" } }, ".collapse-slide .collapse-content > *": { "@layer components": { transform: "translateY(-0.5rem)", opacity: 0, transition: "transform 300ms ease-in-out, opacity 200ms ease-in-out" } }, ".collapse-slide.collapse-open .collapse-content > *": { "@layer components": { transform: "translateY(0)", opacity: 1 } }, ".collapse-horizontal": { "@layer components": { display: "grid", gridTemplateColumns: "0fr", transition: "grid-template-columns 300ms ease-in-out" } }, ".collapse-horizontal.show": { "@layer components": { gridTemplateColumns: "1fr" } }, ".collapse-horizontal .collapse-content": { "@layer components": { overflow: "hidden", whiteSpace: "nowrap" } }, ".collapse-horizontal-fixed": { "@layer components": { display: "block", width: "0", overflow: "hidden", transition: "width 300ms ease-in-out" } }, ".collapse-horizontal-fixed.show": { "@layer components": { width: "var(--collapse-width, 20rem)" } }, ".collapse-nested": { "@layer components": { marginLeft: "1rem", paddingLeft: "1rem", borderLeft: "2px solid var(--color-outline-variant)" } }, ".collapse-showmore": { "@layer components": { position: "relative" } }, ".collapse-showmore:not(.show)::after": { "@layer components": { content: "''", position: "absolute", bottom: "0", left: "0", right: "0", height: "3rem", background: "linear-gradient(to bottom, transparent, var(--color-surface))", pointerEvents: "none" } }, ".collapse-showmore-toggle": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", gap: "0.25rem", width: "100%", padding: "0.5rem", marginTop: "0.5rem", fontSize: "0.75rem", fontWeight: 500, color: "var(--color-primary)", backgroundColor: "transparent", border: "none", cursor: "pointer" } }, ".collapse-showmore-toggle:hover": { "@layer components": { textDecoration: "underline" } }, ".collapse-group": { "@layer components": { display: "flex", flexDirection: "column", gap: "0.5rem" } }, ".collapse-fast": { "@layer components": { transitionDuration: "150ms" } }, ".collapse-slow": { "@layer components": { transitionDuration: "500ms" } }, ".collapse-ease-in": { "@layer components": { transitionTimingFunction: "ease-in" } }, ".collapse-ease-out": { "@layer components": { transitionTimingFunction: "ease-out" } }, ".collapse-ease-in-out": { "@layer components": { transitionTimingFunction: "ease-in-out" } }, ".collapse-spring": { "@layer components": { transitionTimingFunction: "cubic-bezier(0.34, 1.56, 0.64, 1)" } }, ".collapse-hidden": { "@layer components": { display: "none" } }, ".collapse-sr-only": { "@layer components": { position: "absolute", width: "1px", height: "1px", padding: "0", margin: "-1px", overflow: "hidden", clip: "rect(0, 0, 0, 0)", whiteSpace: "nowrap", border: "0" } }, ".collapse-maxheight": { "@layer components": { maxHeight: "0", overflow: "hidden", transition: "max-height 300ms ease-in-out" } }, ".collapse-maxheight.show": { "@layer components": { maxHeight: "var(--collapse-max-height, 100rem)" } }, ".collapse-animating": { "@layer components": { overflow: "hidden", transition: "height 300ms ease-in-out" } }, ".collapse, \n .collapse-content, \n .collapse-icon, \n .collapse-fade, \n .collapse-horizontal, \n .collapse-horizontal-fixed, \n .collapse-toggle-icon, \n .collapse-maxheight, \n .collapse-animating, \n .collapse-slide .collapse-content > *": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".popover": { "@layer components": { "--popover-color-intensity": "30%" } }, ".popover[popover]": { "@layer components": { position: "absolute", inset: "auto", zIndex: 1050, minWidth: "12rem", maxWidth: "20rem", padding: "1rem", margin: "0.5rem", backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline-variant)", borderRadius: "var(--radius-md)", boxShadow: "var(--shadow-lg)", opacity: 0, transform: "scale(0.95)", positionArea: "bottom", positionTryFallbacks: "flip-block, flip-inline, flip-block flip-inline", transition: `opacity 150ms ease-out,
241
+ transform 150ms ease-out,
242
+ overlay 150ms ease-out allow-discrete,
243
+ display 150ms ease-out allow-discrete` } }, ".popover[popover]:popover-open": [{ "@layer components": { opacity: 1, visibility: "visible", transform: "scale(1)" } }, { "@layer components": { "@starting-style": { opacity: 0, transform: "scale(0.95)" } } }], ".popover[popover]:popover-open::backdrop": [{ "@layer components": { "@starting-style": { backgroundColor: "transparent" } } }, { "@layer components": { backgroundColor: "color-mix(in srgb, var(--color-scrim) 10%, transparent)" } }], ".popover-modal[popover]:popover-open::backdrop": [{ "@layer components": { "@starting-style": { backgroundColor: "transparent" } } }, { "@layer components": { backgroundColor: "color-mix(in srgb, var(--color-scrim) 30%, transparent)" } }], ".popover-top[popover]": { "@layer components": { positionArea: "top" } }, ".popover-bottom[popover]": { "@layer components": { positionArea: "bottom" } }, ".popover-left[popover]": { "@layer components": { positionArea: "left" } }, ".popover-right[popover]": { "@layer components": { positionArea: "right" } }, ".popover-start[popover]": { "@layer components": { positionArea: "bottom span-right" } }, ".popover-end[popover]": { "@layer components": { positionArea: "bottom span-left" } }, ".popover-top.popover-start[popover]": { "@layer components": { positionArea: "top span-right" } }, ".popover-top.popover-end[popover]": { "@layer components": { positionArea: "top span-left" } }, ".popover-bottom.popover-start[popover]": { "@layer components": { positionArea: "bottom span-right" } }, ".popover-bottom.popover-end[popover]": { "@layer components": { positionArea: "bottom span-left" } }, ".popover-left.popover-start[popover]": { "@layer components": { positionArea: "left span-bottom" } }, ".popover-left.popover-end[popover]": { "@layer components": { positionArea: "left span-top" } }, ".popover-right.popover-start[popover]": { "@layer components": { positionArea: "right span-bottom" } }, ".popover-right.popover-end[popover]": { "@layer components": { positionArea: "right span-top" } }, ".popover[popover]::backdrop": { "@layer components": { backgroundColor: "transparent", transition: `background-color 150ms ease-out,
244
+ overlay 150ms ease-out allow-discrete,
245
+ display 150ms ease-out allow-discrete` } }, ".popover-modal[popover]::backdrop": { "@layer components": { backgroundColor: "transparent", transition: `background-color 150ms ease-out,
246
+ overlay 150ms ease-out allow-discrete,
247
+ display 150ms ease-out allow-discrete` } }, ".popover-arrow": { "@layer components": { position: "absolute", width: "0.75rem", height: "0.75rem", backgroundColor: "var(--color-surface)", border: "1px solid var(--color-outline-variant)", transform: "rotate(45deg)" } }, ".popover-top[popover] > .popover-arrow, \n .popover[popover]:not(.popover-bottom):not(.popover-left):not(.popover-right) > .popover-arrow": { "@layer components": { bottom: "-0.375rem", left: "50%", transform: "translateX(-50%) rotate(45deg)", borderTop: "none", borderLeft: "none" } }, ".popover-bottom[popover] > .popover-arrow": { "@layer components": { top: "-0.375rem", left: "50%", transform: "translateX(-50%) rotate(45deg)", borderBottom: "none", borderRight: "none" } }, ".popover-left[popover] > .popover-arrow": { "@layer components": { right: "-0.375rem", top: "50%", transform: "translateY(-50%) rotate(45deg)", borderLeft: "none", borderBottom: "none" } }, ".popover-right[popover] > .popover-arrow": { "@layer components": { left: "-0.375rem", top: "50%", transform: "translateY(-50%) rotate(45deg)", borderRight: "none", borderTop: "none" } }, ".popover-no-arrow > .popover-arrow": { "@layer components": { display: "none" } }, ".popover-header": { "@layer components": { display: "flex", alignItems: "center", gap: "0.5rem", paddingBottom: "0.75rem", marginBottom: "0.75rem", borderBottom: "1px solid var(--color-outline-variant)" } }, ".popover-title": { "@layer components": { flex: 1, minWidth: "0", margin: "0", fontSize: "0.875rem", fontWeight: 600, lineHeight: "1.5rem", color: "var(--color-on-surface)" } }, ".popover-close": { "@layer components": { display: "inline-flex", flexShrink: 0, alignItems: "center", justifyContent: "center", width: "1.5rem", height: "1.5rem", marginInlineStart: "auto", padding: "0", color: "var(--color-on-surface-variant)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-xs)", cursor: "pointer", transition: "background-color 150ms ease-in-out" } }, ".popover[popover] > .popover-close": { "@layer components": { position: "absolute", top: "1rem", right: "1rem", marginInlineStart: "0" } }, ".popover[popover]:has(> .popover-close) > .popover-header": { "@layer components": { paddingRight: "1.75rem" } }, ".popover-close:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".popover-close:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".popover-body": { "@layer components": { fontSize: "0.875rem", color: "var(--color-on-surface-variant)", lineHeight: 1.5 } }, ".popover-footer": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "flex-end", gap: "0.5rem", paddingTop: "0.75rem", marginTop: "0.75rem", borderTop: "1px solid var(--color-outline-variant)" } }, ".popover-sm[popover]": { "@layer components": { minWidth: "8rem", maxWidth: "14rem", padding: "0.75rem" } }, ".popover-lg[popover]": { "@layer components": { minWidth: "16rem", maxWidth: "28rem", padding: "1.25rem" } }, ".popover-full[popover]": { "@layer components": { minWidth: "0", maxWidth: "none", width: "max-content" } }, ".popover-dark[popover]": { "@layer components": { backgroundColor: "var(--color-on-surface)", color: "var(--color-surface)", borderColor: "transparent" } }, ".popover-dark[popover] > .popover-arrow": { "@layer components": { backgroundColor: "var(--color-on-surface)", borderColor: "transparent" } }, ".popover-dark[popover] .popover-title": { "@layer components": { color: "var(--color-surface)" } }, ".popover-dark[popover] .popover-body": { "@layer components": { color: "var(--color-surface)", opacity: 0.9 } }, ".popover-primary[popover]": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-primary) var(--popover-color-intensity), var(--color-surface))", borderColor: "var(--color-primary)" } }, ".popover-primary[popover] > .popover-arrow": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-primary) var(--popover-color-intensity), var(--color-surface))", borderColor: "var(--color-primary)" } }, ".popover-primary[popover] .popover-body, \n .popover-primary[popover] .popover-title": { "@layer components": { color: "var(--color-on-surface)" } }, ".popover-secondary[popover]": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-secondary) var(--popover-color-intensity), var(--color-surface))", borderColor: "var(--color-secondary)" } }, ".popover-secondary[popover] > .popover-arrow": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-secondary) var(--popover-color-intensity), var(--color-surface))", borderColor: "var(--color-secondary)" } }, ".popover-secondary[popover] .popover-body, \n .popover-secondary[popover] .popover-title": { "@layer components": { color: "var(--color-on-surface)" } }, ".popover-tertiary[popover]": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-tertiary) var(--popover-color-intensity), var(--color-surface))", borderColor: "var(--color-tertiary)" } }, ".popover-tertiary[popover] > .popover-arrow": { "@layer components": { backgroundColor: "color-mix(in oklch, var(--color-tertiary) var(--popover-color-intensity), var(--color-surface))", borderColor: "var(--color-tertiary)" } }, ".popover-tertiary[popover] .popover-body, \n .popover-tertiary[popover] .popover-title": { "@layer components": { color: "var(--color-on-surface)" } }, ".popover-surface-highest[popover]": { "@layer components": { backgroundColor: "var(--color-surface-container-highest)", borderColor: "var(--color-outline-variant)" } }, ".popover-surface-highest[popover] > .popover-arrow": { "@layer components": { backgroundColor: "var(--color-surface-container-highest)", borderColor: "var(--color-outline-variant)" } }, ".popover-menu[popover]": { "@layer components": { padding: "0.5rem" } }, ".popover-menu-item": { "@layer components": { display: "flex", alignItems: "center", gap: "0.75rem", width: "100%", padding: "0.5rem 0.75rem", fontSize: "0.875rem", color: "var(--color-on-surface)", backgroundColor: "transparent", border: "none", borderRadius: "var(--radius-sm)", cursor: "pointer", textAlign: "left", transition: "background-color 150ms ease-in-out" } }, ".popover-menu-item:hover": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".popover-menu-item:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".popover-menu-item-icon": { "@layer components": { display: "flex", alignItems: "center", justifyContent: "center", width: "1.25rem", height: "1.25rem", color: "var(--color-on-surface-variant)" } }, ".popover-menu-divider": { "@layer components": { height: "1px", margin: "0.5rem 0", backgroundColor: "var(--color-outline-variant)" } }, ".popover-confirm[popover]": { "@layer components": { textAlign: "center" } }, ".popover-confirm[popover] .popover-footer": { "@layer components": { justifyContent: "center" } }, ".popover-close, \n .popover-menu-item, \n .popover[popover], \n .popover[popover]::backdrop": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".timeline": { "@layer components": { position: "relative", display: "flex", flexDirection: "column", gap: "0" } }, ".timeline::before": { "@layer components": { content: "''", position: "absolute", top: "0", left: "1.25rem", width: "2px", height: "100%", backgroundColor: "var(--color-outline-variant)" } }, ".timeline-item": { "@layer components": { position: "relative", display: "flex", gap: "1rem", paddingBottom: "1.5rem" } }, ".timeline-item:last-child": { "@layer components": { paddingBottom: "0" } }, ".timeline-marker": { "@layer components": { position: "relative", display: "flex", alignItems: "center", justifyContent: "center", width: "2.5rem", height: "2.5rem", backgroundColor: "var(--color-surface)", border: "2px solid var(--color-outline-variant)", borderRadius: "var(--radius-full)", flexShrink: 0, zIndex: 1 } }, ".timeline-marker-icon": { "@layer components": { fontSize: "1rem", color: "var(--color-on-surface-variant)" } }, ".timeline-marker-dot": { "@layer components": { width: "0.75rem", height: "0.75rem", backgroundColor: "var(--color-outline-variant)", borderRadius: "var(--radius-full)" } }, ".timeline-content": { "@layer components": { flex: 1, paddingTop: "0.375rem", minWidth: "0" } }, ".timeline-title": { "@layer components": { fontSize: "0.875rem", fontWeight: 600, color: "var(--color-on-surface)", marginBottom: "0.25rem" } }, ".timeline-time": { "@layer components": { fontSize: "0.75rem", color: "var(--color-on-surface-variant)", marginBottom: "0.5rem" } }, ".timeline-description": { "@layer components": { fontSize: "0.875rem", color: "var(--color-on-surface-variant)", lineHeight: 1.5 } }, ".timeline-card": { "@layer components": { padding: "1rem", backgroundColor: "var(--color-surface-container)", borderRadius: "var(--radius-md)", marginTop: "0.5rem" } }, ".timeline-item-primary .timeline-marker": { "@layer components": { borderColor: "var(--color-primary)", backgroundColor: "var(--color-primary-container)" } }, ".timeline-item-primary .timeline-marker-icon, \n .timeline-item-primary .timeline-marker-dot": { "@layer components": { color: "var(--color-on-primary-container)", backgroundColor: "var(--color-primary)" } }, ".timeline-item-secondary .timeline-marker": { "@layer components": { borderColor: "var(--color-secondary)", backgroundColor: "var(--color-secondary-container)" } }, ".timeline-item-success .timeline-marker": { "@layer components": { borderColor: "var(--color-success)", backgroundColor: "var(--color-success-container)" } }, ".timeline-item-success .timeline-marker-dot": { "@layer components": { backgroundColor: "var(--color-success)" } }, ".timeline-item-warning .timeline-marker": { "@layer components": { borderColor: "var(--color-warning)", backgroundColor: "var(--color-warning-container)" } }, ".timeline-item-warning .timeline-marker-dot": { "@layer components": { backgroundColor: "var(--color-warning)" } }, ".timeline-item-error .timeline-marker": { "@layer components": { borderColor: "var(--color-error)", backgroundColor: "var(--color-error-container)" } }, ".timeline-item-error .timeline-marker-dot": { "@layer components": { backgroundColor: "var(--color-error)" } }, ".timeline-item.completed .timeline-marker": { "@layer components": { borderColor: "var(--color-primary)", backgroundColor: "var(--color-primary)" } }, ".timeline-item.completed .timeline-marker-icon": { "@layer components": { color: "var(--color-primary-content)" } }, ".timeline-item.active .timeline-marker": { "@layer components": { borderColor: "var(--color-primary)", backgroundColor: "var(--color-primary)", boxShadow: "0 0 0 4px var(--color-primary-container)" } }, ".timeline-item.active .timeline-marker-icon, \n .timeline-item.active .timeline-marker-dot": { "@layer components": { color: "var(--color-primary-content)", backgroundColor: "var(--color-primary-content)" } }, ".timeline-sm::before": { "@layer components": { left: "0.75rem" } }, ".timeline-sm .timeline-marker": { "@layer components": { width: "1.5rem", height: "1.5rem" } }, ".timeline-sm .timeline-marker-icon": { "@layer components": { fontSize: "0.75rem" } }, ".timeline-sm .timeline-marker-dot": { "@layer components": { width: "0.5rem", height: "0.5rem" } }, ".timeline-lg::before": { "@layer components": { left: "1.5rem" } }, ".timeline-lg .timeline-marker": { "@layer components": { width: "3rem", height: "3rem" } }, ".timeline-lg .timeline-marker-icon": { "@layer components": { fontSize: "1.25rem" } }, ".timeline-alternate": { "@layer components": { paddingLeft: "0" } }, ".timeline-alternate::before": [{ "@layer components": { left: "50%", transform: "translateX(-50%)" } }, { "@layer components": { "@media (max-width: 640px)": { left: "1.25rem", transform: "none" } } }], ".timeline-alternate .timeline-item": { "@layer components": { width: "50%", paddingRight: "2rem" } }, ".timeline-alternate .timeline-item:nth-child(even)": { "@layer components": { marginLeft: "50%", paddingRight: "0", paddingLeft: "2rem", flexDirection: "row-reverse" } }, ".timeline-alternate .timeline-item:nth-child(even) .timeline-content": [{ "@layer components": { textAlign: "right" } }, { "@layer components": { "@media (max-width: 640px)": { textAlign: "left" } } }], ".timeline-alternate .timeline-marker": { "@layer components": { position: "absolute", left: "100%", transform: "translateX(-50%)" } }, ".timeline-alternate .timeline-item:nth-child(even) .timeline-marker": { "@layer components": { left: "0", transform: "translateX(-50%)" } }, ".timeline-right": { "@layer components": { alignItems: "flex-end" } }, ".timeline-right::before": { "@layer components": { left: "auto", right: "1.25rem" } }, ".timeline-right .timeline-item": { "@layer components": { flexDirection: "row-reverse" } }, ".timeline-right .timeline-content": { "@layer components": { textAlign: "right" } }, ".timeline-horizontal": { "@layer components": { flexDirection: "row", overflowX: "auto", paddingBottom: "1rem" } }, ".timeline-horizontal::before": { "@layer components": { top: "1.25rem", left: "0", width: "100%", height: "2px" } }, ".timeline-horizontal .timeline-item": { "@layer components": { flexDirection: "column", paddingBottom: "0", paddingRight: "2rem", minWidth: "10rem" } }, ".timeline-horizontal .timeline-item:last-child": { "@layer components": { paddingRight: "0" } }, ".timeline-horizontal .timeline-content": { "@layer components": { paddingTop: "1rem", textAlign: "center" } }, ".timeline-collapsible .timeline-item": { "@layer components": { cursor: "pointer" } }, ".timeline-collapsible .timeline-description": { "@layer components": { display: "none" } }, ".timeline-collapsible .timeline-item.expanded .timeline-description": { "@layer components": { display: "block" } }, ".timeline-item.loading .timeline-marker": [{ "@layer components": { animation: "timeline-pulse 1.5s ease-in-out infinite" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { animation: "none" } } }], "@keyframes timeline-pulse": { "0%, 100%": { opacity: 1 }, "50%": { opacity: 0.5 } }, ".timeline-progress::before": { "@layer components": { background: `linear-gradient(
248
+ to bottom,
249
+ var(--color-primary) var(--timeline-progress, 0%),
250
+ var(--color-outline-variant) var(--timeline-progress, 0%)
251
+ )` } }, ".timeline-alternate .timeline-item, \n .timeline-alternate .timeline-item:nth-child(even)": { "@layer components": { "@media (max-width: 640px)": { width: "100%", marginLeft: "0", paddingLeft: "0", paddingRight: "0", flexDirection: "row" } } }, ".timeline-alternate .timeline-marker, \n .timeline-alternate .timeline-item:nth-child(even) .timeline-marker": { "@layer components": { "@media (max-width: 640px)": { position: "relative", left: "0", transform: "none" } } }, ".code-block": { "@layer components": { border: "1px solid var(--color-outline)", borderRadius: "var(--radius-sm)", overflow: "hidden" } }, ".code-header": { "@layer components": { display: "flex", alignItems: "center", gap: "0.5rem", padding: "0.5rem 1rem", backgroundColor: "var(--color-surface-container-highest)", borderBottom: "1px solid var(--color-outline)", fontSize: "0.75rem" } }, ".code-title": { "@layer components": { color: "var(--color-on-surface)", fontWeight: 600, marginRight: "auto" } }, ".code-language": { "@layer components": { color: "var(--color-on-surface-variant)", textTransform: "uppercase", letterSpacing: "0.05em", fontWeight: 500 } }, ".code-language:first-child": { "@layer components": { marginRight: "auto" } }, ".code-block .copy-button": [{ "@layer components": { display: "flex", alignItems: "center", gap: "0.375rem", padding: "0.25rem 0.5rem", border: "none", borderRadius: "var(--radius-xs)", background: "transparent", color: "var(--color-on-surface-variant)", fontSize: "0.75rem", cursor: "pointer", transition: "background-color 0.15s ease, color 0.15s ease" } }, { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }], ".code-block .copy-button:hover": { "@layer components": { backgroundColor: "var(--color-outline-variant)", color: "var(--color-on-surface)" } }, ".code-block .copy-icon": { "@layer components": { flexShrink: 0 } }, ".code-content": { "@layer components": { backgroundColor: "var(--color-surface-container)", overflowX: "auto" } }, ".code-content pre": { "@layer components": { margin: "0", padding: "1rem", background: "transparent", borderRadius: "0", overflowX: "auto" } }, ".code-content code": { "@layer components": { background: "transparent", padding: "0", fontFamily: "ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace", fontSize: "0.875rem", lineHeight: 1.6 } }, ".code-block-compact .code-header": { "@layer components": { padding: "0.375rem 0.75rem" } }, ".code-block-compact .code-content pre": { "@layer components": { padding: "0.75rem" } }, ".code-block-borderless": { "@layer components": { border: "none" } }, ".code-block-borderless .code-header": { "@layer components": { borderBottom: "none" } }, ".markdown-body": { "@layer components": { fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"', fontSize: "16px", lineHeight: 1.5, wordWrap: "break-word", color: "var(--color-on-surface)" } }, ".markdown-body h1, \n .markdown-body h2, \n .markdown-body h3, \n .markdown-body h4, \n .markdown-body h5, \n .markdown-body h6": { "@layer components": { marginBlockStart: "1.5rem", marginBlockEnd: "1rem", fontWeight: 600, lineHeight: 1.25 } }, ".markdown-body h1": { "@layer components": { fontSize: "2em", paddingBlockEnd: "0.3em", borderBottom: "1px solid var(--color-outline-variant)" } }, ".markdown-body h2": { "@layer components": { fontSize: "1.5em", paddingBlockEnd: "0.3em", borderBottom: "1px solid var(--color-outline-variant)" } }, ".markdown-body h3": { "@layer components": { fontSize: "1.25em" } }, ".markdown-body h4": { "@layer components": { fontSize: "1em" } }, ".markdown-body h5": { "@layer components": { fontSize: "0.875em" } }, ".markdown-body h6": { "@layer components": { fontSize: "0.85em", color: "var(--color-on-surface-variant)" } }, ".markdown-body p": { "@layer components": { marginBlockEnd: "1rem" } }, ".markdown-body a": { "@layer components": { color: "var(--color-primary)", textDecoration: "none" } }, ".markdown-body a:hover": { "@layer components": { textDecoration: "underline" } }, ".markdown-body a:focus-visible": { "@layer components": { outline: "none", boxShadow: "0 0 0 3px color-mix(in oklch, currentColor 20%, transparent)" } }, ".markdown-body strong, \n .markdown-body b": { "@layer components": { fontWeight: 600 } }, ".markdown-body em, \n .markdown-body i": { "@layer components": { fontStyle: "italic" } }, ".markdown-body ul, \n .markdown-body ol": { "@layer components": { marginBlockEnd: "1rem", paddingInlineStart: "2em" } }, ".markdown-body ul": { "@layer components": { listStyleType: "disc" } }, ".markdown-body ol": { "@layer components": { listStyleType: "decimal" } }, ".markdown-body li": { "@layer components": { marginBlockEnd: "0.25rem" } }, ".markdown-body li > ul, \n .markdown-body li > ol": { "@layer components": { marginBlockStart: "0.25rem", marginBlockEnd: "0" } }, ".markdown-body ul ul": { "@layer components": { listStyleType: "circle" } }, ".markdown-body ul ul ul": { "@layer components": { listStyleType: "square" } }, ".markdown-body ol ol": { "@layer components": { listStyleType: "lower-alpha" } }, ".markdown-body ol ol ol": { "@layer components": { listStyleType: "lower-roman" } }, ".markdown-body small": { "@layer components": { fontSize: "0.875em" } }, ".markdown-body sub, \n .markdown-body sup": { "@layer components": { fontSize: "0.75em", lineHeight: 0, position: "relative", verticalAlign: "baseline" } }, ".markdown-body sub": { "@layer components": { bottom: "-0.25em" } }, ".markdown-body sup": { "@layer components": { top: "-0.5em" } }, ".markdown-body del, \n .markdown-body s": { "@layer components": { textDecoration: "line-through", color: "var(--color-on-surface-variant)" } }, ".markdown-body code": { "@layer components": { fontFamily: "ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace", fontSize: "0.85em", paddingBlock: "0.2em", paddingInline: "0.4em", backgroundColor: "var(--color-surface-container-high)", borderRadius: "var(--radius-xs)" } }, ".markdown-body pre": { "@layer components": { fontFamily: "ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace", fontSize: "0.85em", lineHeight: 1.45, padding: "1rem", marginBlockEnd: "1rem", overflowX: "auto", backgroundColor: "var(--color-surface-container)", borderRadius: "var(--radius-xs)" } }, ".markdown-body pre > code": { "@layer components": { fontSize: "inherit", padding: "0", backgroundColor: "transparent", borderRadius: "0" } }, ".markdown-body kbd": { "@layer components": { fontFamily: "ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace", fontSize: "0.85em", paddingBlock: "0.2em", paddingInline: "0.4em", backgroundColor: "var(--color-surface-container)", border: "1px solid var(--color-outline-variant)", borderRadius: "var(--radius-xs)", boxShadow: "inset 0 -1px 0 var(--color-outline-variant)" } }, ".markdown-body samp": { "@layer components": { fontFamily: "ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace", fontSize: "0.85em" } }, ".markdown-body table": { "@layer components": { width: "100%", borderCollapse: "collapse", marginBlockEnd: "1rem", overflowX: "auto", display: "block" } }, ".markdown-body th": { "@layer components": { fontWeight: 600, backgroundColor: "var(--color-surface-container)" } }, ".markdown-body th, \n .markdown-body td": { "@layer components": { paddingBlock: "0.5rem", paddingInline: "0.75rem", border: "1px solid var(--color-outline-variant)", textAlign: "start" } }, ".markdown-body tr:nth-child(2n)": { "@layer components": { backgroundColor: "var(--color-surface-container)" } }, ".markdown-body blockquote": { "@layer components": { marginBlockEnd: "1rem", marginInline: "0", paddingInlineStart: "1em", borderInlineStart: "0.25em solid var(--color-outline-variant)", color: "var(--color-on-surface-variant)" } }, ".markdown-body blockquote > :first-child": { "@layer components": { marginBlockStart: "0" } }, ".markdown-body blockquote > :last-child": { "@layer components": { marginBlockEnd: "0" } }, ".markdown-body blockquote blockquote": { "@layer components": { marginBlockStart: "1rem" } }, ".markdown-body img": { "@layer components": { maxWidth: "100%", height: "auto", boxSizing: "border-box" } }, ".markdown-body figure": { "@layer components": { marginBlockEnd: "1rem", marginInline: "0" } }, ".markdown-body figcaption": { "@layer components": { fontSize: "0.875em", color: "var(--color-on-surface-variant)", marginBlockStart: "0.5rem", textAlign: "center" } }, '.markdown-body img[align="left"]': { "@layer components": { marginInlineEnd: "1rem", marginBlockEnd: "0.5rem" } }, '.markdown-body img[align="right"]': { "@layer components": { marginInlineStart: "1rem", marginBlockEnd: "0.5rem" } }, ".markdown-body .task-list-item": { "@layer components": { listStyleType: "none" } }, '.markdown-body .task-list-item input[type="checkbox"]': { "@layer components": { marginInlineStart: "-1.5em", marginInlineEnd: "0.5em", verticalAlign: "middle" } }, ".markdown-body hr": { "@layer components": { height: "0.25em", marginBlock: "1.5rem", padding: "0", backgroundColor: "var(--color-outline-variant)", border: "0" } }, ".markdown-body dl": { "@layer components": { marginBlockEnd: "1rem" } }, ".markdown-body dt": { "@layer components": { fontWeight: 600, marginBlockStart: "1rem" } }, ".markdown-body dt:first-child": { "@layer components": { marginBlockStart: "0" } }, ".markdown-body dd": { "@layer components": { marginBlockStart: "0.25rem", marginInlineStart: "0", paddingInlineStart: "1rem" } }, ".markdown-body abbr[title]": { "@layer components": { textDecoration: "underline dotted", cursor: "help", borderBottom: "none" } }, ".markdown-body mark": { "@layer components": { backgroundColor: "var(--color-tertiary-container)", color: "var(--color-on-tertiary-container)", paddingBlock: "0.1em", paddingInline: "0.2em", borderRadius: "var(--radius-xs)" } }, ".markdown-body details": { "@layer components": { marginBlockEnd: "1rem" } }, ".markdown-body summary": { "@layer components": { fontWeight: 600, cursor: "pointer" } }, ".markdown-body details[open] > summary": { "@layer components": { marginBlockEnd: "0.5rem" } }, ".markdown-body > :first-child": { "@layer components": { marginBlockStart: "0" } }, ".markdown-body > :last-child": { "@layer components": { marginBlockEnd: "0" } }, ".markdown-body *": { "@layer components": { "@media (prefers-reduced-motion: reduce)": { transition: "none" } } }, ".art-moon": { "@layer css-art": { "--art-moon-size": "8rem", "--art-moon-color": "oklch(92% 0.06 90)", "--art-moon-shadow": "oklch(85% 0.04 90)", "--art-moon-glow": "oklch(95% 0.03 90 / 0.4)", position: "relative", width: "var(--art-moon-size)", height: "var(--art-moon-size)", aspectRatio: "1", borderRadius: "50%", background: `radial-gradient(
252
+ circle at 35% 35%,
253
+ var(--art-moon-color) 0%,
254
+ var(--art-moon-shadow) 100%
255
+ )`, boxShadow: `0 0 calc(var(--art-moon-size) * 0.25) var(--art-moon-glow),
256
+ 0 0 calc(var(--art-moon-size) * 0.5) var(--art-moon-glow)` } }, ".art-moon-crescent": { "@layer css-art": { overflow: "hidden" } }, ".art-moon-crescent::after": { "@layer css-art": { content: "''", position: "absolute", top: "-10%", right: "-20%", width: "85%", height: "85%", borderRadius: "50%", background: "oklch(15% 0.02 260)", boxShadow: "inset 0 0 1rem oklch(20% 0.02 260)" } }, ".art-moon::before": { "@layer css-art": { content: "''", position: "absolute", width: "20%", height: "20%", top: "25%", left: "40%", borderRadius: "50%", background: `radial-gradient(
257
+ circle,
258
+ oklch(82% 0.03 90 / 0.6) 0%,
259
+ transparent 70%
260
+ )`, boxShadow: `calc(var(--art-moon-size) * -0.15) calc(var(--art-moon-size) * 0.2) 0 -2px oklch(82% 0.03 90 / 0.4),
261
+ calc(var(--art-moon-size) * 0.1) calc(var(--art-moon-size) * -0.05) 0 -3px oklch(82% 0.03 90 / 0.3),
262
+ calc(var(--art-moon-size) * -0.08) calc(var(--art-moon-size) * -0.12) 0 -1px oklch(82% 0.03 90 / 0.35)` } }, ".art-moon-sm": { "@layer css-art": { "--art-moon-size": "4rem" } }, ".art-moon-lg": { "@layer css-art": { "--art-moon-size": "12rem" } }, ".art-moon-xl": { "@layer css-art": { "--art-moon-size": "16rem" } }, ".art-moon-glow": { "@layer css-art": { animation: "art-moon-pulse 4s ease-in-out infinite" } }, "@keyframes art-moon-pulse": { "0%, 100%": { boxShadow: `0 0 calc(var(--art-moon-size) * 0.25) var(--art-moon-glow),
263
+ 0 0 calc(var(--art-moon-size) * 0.5) var(--art-moon-glow)` }, "50%": { boxShadow: `0 0 calc(var(--art-moon-size) * 0.35) var(--art-moon-glow),
264
+ 0 0 calc(var(--art-moon-size) * 0.7) var(--art-moon-glow)` } }, ".art-sun": { "@layer css-art": { "--art-sun-size": "8rem", "--art-sun-color": "oklch(85% 0.18 85)", "--art-sun-corona": "oklch(90% 0.15 75)", "--art-sun-glow": "oklch(90% 0.12 80 / 0.4)", position: "relative", width: "var(--art-sun-size)", height: "var(--art-sun-size)", borderRadius: "50%", background: `radial-gradient(
265
+ circle at 40% 40%,
266
+ oklch(95% 0.12 90) 0%,
267
+ var(--art-sun-color) 50%,
268
+ var(--art-sun-corona) 100%
269
+ )`, boxShadow: `0 0 calc(var(--art-sun-size) * 0.2) var(--art-sun-glow),
270
+ 0 0 calc(var(--art-sun-size) * 0.5) var(--art-sun-glow),
271
+ 0 0 calc(var(--art-sun-size) * 0.8) oklch(90% 0.1 80 / 0.15)` } }, ".art-sun-rays::before, \n .art-sun-rays::after": { "@layer css-art": { content: "''", position: "absolute", top: "50%", left: "50%", width: "140%", height: "140%", transform: "translate(-50%, -50%)", borderRadius: "50%" } }, ".art-sun-rays::before": { "@layer css-art": { background: `repeating-conic-gradient(
272
+ from 0deg,
273
+ oklch(90% 0.14 85 / 0.3) 0deg 5deg,
274
+ transparent 5deg 30deg
275
+ )`, animation: "art-sun-rotate 30s linear infinite" } }, ".art-sun-rays::after": { "@layer css-art": { background: `repeating-conic-gradient(
276
+ from 15deg,
277
+ oklch(90% 0.14 85 / 0.15) 0deg 3deg,
278
+ transparent 3deg 30deg
279
+ )`, animation: "art-sun-rotate 45s linear infinite reverse" } }, "@keyframes art-sun-rotate": { from: { transform: "translate(-50%, -50%) rotate(0deg)" }, to: { transform: "translate(-50%, -50%) rotate(360deg)" } }, ".art-sun-sunset": { "@layer css-art": { "--art-sun-color": "oklch(75% 0.2 40)", "--art-sun-corona": "oklch(70% 0.22 30)", "--art-sun-glow": "oklch(80% 0.18 40 / 0.4)" } }, ".art-sun-sm": { "@layer css-art": { "--art-sun-size": "4rem" } }, ".art-sun-lg": { "@layer css-art": { "--art-sun-size": "12rem" } }, ".art-sun-xl": { "@layer css-art": { "--art-sun-size": "16rem" } }, ".art-sun-pulse": { "@layer css-art": { animation: "art-sun-breathe 3s ease-in-out infinite" } }, "@keyframes art-sun-breathe": { "0%, 100%": { boxShadow: `0 0 calc(var(--art-sun-size) * 0.2) var(--art-sun-glow),
280
+ 0 0 calc(var(--art-sun-size) * 0.5) var(--art-sun-glow),
281
+ 0 0 calc(var(--art-sun-size) * 0.8) oklch(90% 0.1 80 / 0.15)` }, "50%": { boxShadow: `0 0 calc(var(--art-sun-size) * 0.3) var(--art-sun-glow),
282
+ 0 0 calc(var(--art-sun-size) * 0.6) var(--art-sun-glow),
283
+ 0 0 calc(var(--art-sun-size) * 1) oklch(90% 0.1 80 / 0.2)` } }, "@keyframes art-mountain-slide": { "0%": { transform: "translateX(-2%)" }, "50%": { transform: "translateX(2%)" }, "100%": { transform: "translateX(-2%)" } }, "@keyframes art-mountain-grow": { "50%": { width: "2%", opacity: 0.4 } }, "@keyframes art-mountain-slide-right": { "0%": { transform: "translateX(-200%)" }, "100%": { transform: "translateX(2000%)" } }, "@keyframes art-mountain-slide-left": { "0%": { transform: "translateX(200%)" }, "100%": { transform: "translateX(-2000%)" } }, ".art-mountain": { "@layer css-art": { "--art-mountain-size": "600px", position: "relative", width: "var(--art-mountain-size)", height: "var(--art-mountain-size)", overflow: "hidden", background: `linear-gradient(transparent, rgba(31, 164, 152, 0.6)) 0 100% / 100% 60%,
284
+
285
+ radial-gradient(rgba(255, 250, 250, 0.9) 70%, transparent 70%) 3% 70% / 0.2% 0.25%,
286
+ radial-gradient(rgba(255, 250, 250, 0.9) 70%, transparent 70%) 7% 60% / 0.2% 0.25%,
287
+ radial-gradient(rgba(255, 250, 250, 0.5) 70%, transparent 70%) 3% 47% / 0.2% 0.25%,
288
+ radial-gradient(rgba(255, 250, 250, 0.9) 70%, transparent 70%) 26% 65% / 0.2% 0.25%,
289
+ radial-gradient(rgba(255, 250, 250, 0.9) 70%, transparent 70%) 20% 50% / 0.2% 0.25%,
290
+ radial-gradient(rgba(255, 250, 250, 0.9) 70%, transparent 70%) 12% 53% / 0.2% 0.25%,
291
+ radial-gradient(rgba(255, 250, 250, 0.9) 70%, transparent 70%) 10% 40% / 0.2% 0.25%,
292
+ radial-gradient(rgba(255, 250, 250, 0.9) 70%, transparent 70%) 24% 34% / 0.2% 0.25%,
293
+ radial-gradient(rgba(255, 250, 250, 0.5) 70%, transparent 70%) 38% 35% / 0.2% 0.25%,
294
+ radial-gradient(rgba(255, 250, 250, 0.5) 70%, transparent 70%) 24% 48% / 0.2% 0.25%,
295
+ radial-gradient(rgba(255, 250, 250, 0.9) 70%, transparent 70%) 7% 30% / 0.2% 0.25%,
296
+ radial-gradient(rgba(255, 250, 250, 0.5) 70%, transparent 70%) 2% 20% / 0.2% 0.25%,
297
+ radial-gradient(rgba(255, 250, 250, 0.5) 70%, transparent 70%) 5% 4% / 0.2% 0.25%,
298
+ radial-gradient(rgba(255, 250, 250, 0.9) 70%, transparent 70%) 10% 15% / 0.2% 0.25%,
299
+ radial-gradient(rgba(255, 250, 250, 0.5) 70%, transparent 70%) 15% 8% / 0.2% 0.25%,
300
+ radial-gradient(rgba(255, 250, 250, 0.9) 70%, transparent 70%) 20% 20% / 0.2% 0.25%,
301
+ radial-gradient(rgba(255, 250, 250, 0.5) 70%, transparent 70%) 80% 36% / 0.2% 0.25%,
302
+ radial-gradient(rgba(255, 250, 250, 0.9) 70%, transparent 70%) 84% 50% / 0.2% 0.25%,
303
+ radial-gradient(rgba(255, 250, 250, 0.5) 70%, transparent 70%) 97% 50% / 0.2% 0.25%,
304
+ radial-gradient(rgba(255, 250, 250, 0.5) 70%, transparent 70%) 85% 40% / 0.2% 0.25%,
305
+ radial-gradient(rgba(255, 250, 250, 0.5) 70%, transparent 70%) 90% 54% / 0.2% 0.25%,
306
+ radial-gradient(rgba(255, 250, 250, 0.5) 70%, transparent 70%) 50% 40% / 0.2% 0.25%,
307
+ radial-gradient(rgba(255, 250, 250, 0.5) 70%, transparent 70%) 55% 49% / 0.2% 0.25%,
308
+ radial-gradient(rgba(255, 250, 250, 0.5) 70%, transparent 70%) 48% 55% / 0.2% 0.25%,
309
+ radial-gradient(rgba(255, 250, 250, 0.5) 70%, transparent 70%) 33% 45% / 0.2% 0.25%,
310
+ radial-gradient(rgba(255, 250, 250, 0.9) 70%, transparent 70%) 80% 60% / 0.2% 0.25%,
311
+ radial-gradient(rgba(255, 250, 250, 0.9) 70%, transparent 70%) 88% 70% / 0.2% 0.25%,
312
+ radial-gradient(rgba(255, 250, 250, 0.5) 70%, transparent 70%) 30% 24% / 0.2% 0.25%,
313
+ radial-gradient(rgba(255, 250, 250, 0.9) 70%, transparent 70%) 30% 10% / 0.2% 0.25%,
314
+ radial-gradient(rgba(255, 250, 250, 0.5) 70%, transparent 70%) 15% 30% / 0.2% 0.25%,
315
+ radial-gradient(rgba(255, 250, 250, 0.5) 70%, transparent 70%) 38% 3% / 0.2% 0.25%,
316
+ radial-gradient(rgba(255, 250, 250, 0.9) 70%, transparent 70%) 68% 30% / 0.2% 0.2%,
317
+ radial-gradient(rgba(255, 250, 250, 0.9) 70%, transparent 70%) 90% 32% / 0.2% 0.25%,
318
+ radial-gradient(rgba(255, 250, 250, 0.5) 70%, transparent 70%) 85% 10% / 0.2% 0.25%,
319
+ radial-gradient(rgba(255, 250, 250, 0.5) 70%, transparent 70%) 60% 16% / 0.2% 0.25%,
320
+ radial-gradient(rgba(255, 250, 250, 0.9) 70%, transparent 70%) 88% 12% / 0.2% 0.25%,
321
+ radial-gradient(rgba(255, 250, 250, 0.9) 70%, transparent 70%) 96% 5% / 0.2% 0.25%,
322
+ radial-gradient(rgba(255, 250, 250, 0.9) 70%, transparent 70%) 75% 18% / 0.2% 0.25%,
323
+ radial-gradient(rgba(255, 250, 250, 0.9) 70%, transparent 70%) 47% 14% / 0.2% 0.25%,
324
+ radial-gradient(rgba(255, 250, 250, 0.5) 70%, transparent 70%) 54% 10% / 0.2% 0.25%,
325
+ radial-gradient(rgba(255, 250, 250, 0.5) 70%, transparent 70%) 53% 23% / 0.2% 0.25%,
326
+
327
+ linear-gradient(rgb(20, 21, 33), #022e4e, #03518a)`, backgroundRepeat: "no-repeat", zIndex: 1 } }, ".art-mountain .mountain": { "@layer css-art": { position: "absolute", clipPath: "polygon(49% 0, 51% 0, 100% 100%, 0% 100%)", borderRadius: "50% 50% 0 0", zIndex: 2 } }, ".art-mountain .mountain::before": { "@layer css-art": { content: '""', position: "absolute", width: "100%", height: "100%", right: "5%", background: "inherit", clipPath: "inherit", borderRadius: "inherit" } }, ".art-mountain .mountain::after": { "@layer css-art": { content: '""', position: "absolute", width: "100%", height: "15%", background: "linear-gradient(rgba(255, 250, 250, 0.5), transparent)" } }, ".art-mountain .mountain:nth-of-type(1)": { "@layer css-art": { background: "linear-gradient(#02284a, transparent)", width: "50%", height: "40%", left: "-10%", bottom: "0" } }, ".art-mountain .mountain:nth-of-type(2)": { "@layer css-art": { background: "linear-gradient(#022e4e, rgba(20, 21, 33, 0.8))", width: "60%", height: "50%", left: "10%", bottom: "0", zIndex: 3 } }, ".art-mountain .mountain:nth-of-type(3)": { "@layer css-art": { background: "linear-gradient(#02284a, transparent)", width: "50%", height: "65%", left: "40%", bottom: "0" } }, ".art-mountain .mountain:nth-of-type(4)": { "@layer css-art": { background: "linear-gradient(#022e4e, rgba(20, 21, 33, 0.8))", width: "30%", height: "40%", right: "-10%", bottom: "0" } }, ".art-mountain .tree": { "@layer css-art": { position: "absolute", width: "0.5%", bottom: "0", background: "linear-gradient(rgb(4, 24, 22), rgb(20, 21, 33))", zIndex: 4 } }, ".art-mountain .tree::before": { "@layer css-art": { content: '""', position: "absolute", width: "800%", height: "100%", top: "-5%", left: "-350%", background: "rgb(4, 24, 22)", clipPath: `polygon(
328
+ 50% 0%,
329
+ 0% 30%,
330
+ 50% 30%,
331
+ 0% 60%,
332
+ 50% 60%,
333
+ 0% 90%,
334
+ 50% 90%,
335
+ 100% 90%,
336
+ 50% 60%,
337
+ 100% 60%,
338
+ 50% 30%,
339
+ 100% 30%
340
+ )` } }, ".art-mountain .tree:nth-of-type(1)": { "@layer css-art": { height: "20%", right: "25%" } }, ".art-mountain .tree:nth-of-type(2)": { "@layer css-art": { height: "15%", right: "20%" } }, ".art-mountain .tree:nth-of-type(3)": { "@layer css-art": { height: "12%", right: "28%" } }, ".art-mountain .lights": { "@layer css-art": { height: "100%", width: "100%", animation: "art-mountain-slide 15s ease-in-out infinite" } }, ".art-mountain .borealis": { "@layer css-art": { position: "absolute", width: "5%", height: "100%", bottom: "8%", filter: "blur(40px)", background: "radial-gradient(rgb(31, 164, 152) 40%, transparent)", opacity: 0.6 } }, ".art-mountain .borealis:nth-of-type(1)": { "@layer css-art": { left: "0%", animation: "art-mountain-grow 30s ease-in-out infinite" } }, ".art-mountain .borealis:nth-of-type(2)": { "@layer css-art": { left: "20%", animation: "art-mountain-grow 25s 10s ease-in-out infinite" } }, ".art-mountain .borealis:nth-of-type(3)": { "@layer css-art": { left: "40%", animation: "art-mountain-grow 30s ease-in-out infinite" } }, ".art-mountain .borealis:nth-of-type(4)": { "@layer css-art": { left: "60%", animation: "art-mountain-grow 20s 3s ease-in-out infinite" } }, ".art-mountain .borealis:nth-of-type(5)": { "@layer css-art": { left: "80%", animation: "art-mountain-grow 25s ease-in-out infinite" } }, ".art-mountain .borealis:nth-of-type(6)": { "@layer css-art": { left: "97%", animation: "art-mountain-grow 20s 8s ease-in-out infinite" } }, ".art-mountain .borealis:nth-of-type(7)": { "@layer css-art": { background: "radial-gradient(rgb(157, 78, 221) 40%, transparent)", transform: "translateX(-200%)", animation: "art-mountain-slide-right 25s infinite" } }, ".art-mountain .borealis:nth-of-type(8)": { "@layer css-art": { background: "radial-gradient(rgb(157, 78, 221) 40%, transparent)", transform: "translateX(-200%)", animation: "art-mountain-slide-right 25s 8s infinite" } }, ".art-mountain .borealis:nth-of-type(9)": { "@layer css-art": { left: "unset", right: "0%", transform: "translateX(200%)", background: "radial-gradient(#045fa0 40%, transparent)", animation: "art-mountain-slide-left 18s 5s ease-in-out infinite" } }, ".art-mountain-sm": { "@layer css-art": { "--art-mountain-size": "300px" } }, ".art-mountain-lg": { "@layer css-art": { "--art-mountain-size": "900px" } }, ".art-atom": { "@layer css-art": { "--art-atom-size": "360px", "--art-atom-color": "#00d8ff", "--art-atom-nucleus-size": "calc(var(--art-atom-size) / 5)", "--art-atom-electron-color": "#99f8ff", "--art-atom-electron-size": "calc(var(--art-atom-size) / 25)", "--art-atom-orbit-size": "calc(var(--art-atom-size) / 2.5)", "--art-atom-speed": "1.2s", "--art-atom-speed-alpha": "1s", "--art-atom-speed-omega": ".8s", position: "relative", width: "var(--art-atom-size)", height: "var(--art-atom-size)", animation: "8s art-atom-rotate infinite cubic-bezier(1, .25, 0, .75)", boxSizing: "border-box", overflow: "hidden", "*, *:before, *::after": { boxSizing: "border-box" }, "&::before": { content: "''", display: "block", position: "absolute", top: "50%", left: "50%", width: "var(--art-atom-nucleus-size)", height: "var(--art-atom-nucleus-size)", marginTop: "calc(var(--art-atom-nucleus-size) / -2)", marginLeft: "calc(var(--art-atom-nucleus-size) / -2)", background: "color-mix(in srgb, var(--art-atom-color) 70%, transparent)", borderRadius: "100%", boxShadow: "0 0 3px 0 color-mix(in srgb, var(--art-atom-color) 70%, transparent)", animation: "2s art-atom-nucleus infinite cubic-bezier(.65, 0, .35, 1)" }, '& > [class^="electron"]': { borderTop: "solid color-mix(in srgb, var(--art-atom-color) 50%, transparent) 1px", borderRight: "solid color-mix(in srgb, var(--art-atom-color) 35%, transparent) 2px", borderBottom: "solid color-mix(in srgb, var(--art-atom-color) 20%, transparent) 4px", borderLeft: "solid color-mix(in srgb, var(--art-atom-color) 0%, transparent) 2px", borderRadius: "100%", width: "100%", height: "var(--art-atom-orbit-size)", position: "absolute", top: "50%", marginTop: "calc(var(--art-atom-orbit-size) / -2)", animation: "var(--art-atom-speed) art-atom-electron-orbit infinite linear" }, "& > .electron-alpha": { transform: "rotate(60deg)", animation: "var(--art-atom-speed-alpha) art-atom-electron-orbit infinite linear" }, "& > .electron-omega": { transform: "rotate(-60deg)", animation: "var(--art-atom-speed-omega) art-atom-electron-orbit infinite linear" }, '[class^="electron"]::after': { content: "''", display: "block", width: "var(--art-atom-electron-size)", height: "var(--art-atom-electron-size)", background: "var(--art-atom-electron-color)", borderRadius: "50%", marginTop: "calc(var(--art-atom-electron-size) / -2)", position: "absolute", top: "50%", left: "calc(var(--art-atom-electron-size) / -1)", transform: "scale(1)", animation: "calc(var(--art-atom-speed) * 2) art-atom-electron infinite ease-in-out" }, ".electron-alpha::after": { animation: "calc(var(--art-atom-speed-alpha) * 2) art-atom-electron infinite ease-in-out" }, ".electron-omega::after": { animation: "calc(var(--art-atom-speed-omega) * 2) art-atom-electron infinite ease-in-out" } } }, ".art-atom-sm": { "@layer css-art": { "--art-atom-size": "180px" } }, ".art-atom-lg": { "@layer css-art": { "--art-atom-size": "480px" } }, "@keyframes art-atom-electron-orbit": { "0%": { borderTop: "solid color-mix(in srgb, var(--art-atom-color) 50%, transparent) 1px", borderRight: "solid color-mix(in srgb, var(--art-atom-color) 35%, transparent) 2px", borderBottom: "solid color-mix(in srgb, var(--art-atom-color) 20%, transparent) 4px", borderLeft: "solid color-mix(in srgb, var(--art-atom-color) 0%, transparent) 2px" }, "25%": { borderTop: "solid color-mix(in srgb, var(--art-atom-color) 35%, transparent) 1px", borderRight: "solid color-mix(in srgb, var(--art-atom-color) 20%, transparent) 2px", borderBottom: "solid color-mix(in srgb, var(--art-atom-color) 0%, transparent) 4px", borderLeft: "solid color-mix(in srgb, var(--art-atom-color) 50%, transparent) 2px" }, "50%": { borderTop: "solid color-mix(in srgb, var(--art-atom-color) 20%, transparent) 1px", borderRight: "solid color-mix(in srgb, var(--art-atom-color) 0%, transparent) 2px", borderBottom: "solid color-mix(in srgb, var(--art-atom-color) 50%, transparent) 4px", borderLeft: "solid color-mix(in srgb, var(--art-atom-color) 35%, transparent) 2px" }, "75%": { borderTop: "solid color-mix(in srgb, var(--art-atom-color) 0%, transparent) 1px", borderRight: "solid color-mix(in srgb, var(--art-atom-color) 50%, transparent) 2px", borderBottom: "solid color-mix(in srgb, var(--art-atom-color) 35%, transparent) 4px", borderLeft: "solid color-mix(in srgb, var(--art-atom-color) 20%, transparent) 2px" }, "100%": { borderTop: "solid color-mix(in srgb, var(--art-atom-color) 50%, transparent) 1px", borderRight: "solid color-mix(in srgb, var(--art-atom-color) 35%, transparent) 2px", borderBottom: "solid color-mix(in srgb, var(--art-atom-color) 20%, transparent) 4px", borderLeft: "solid color-mix(in srgb, var(--art-atom-color) 0%, transparent) 2px" } }, "@keyframes art-atom-rotate": { "0%": { transform: "rotate(0deg) scale(1)" }, "12.5%": { transform: "rotate(-45deg) scale(.9)" }, "25%": { transform: "rotate(-90deg) scale(1)" }, "37.5%": { transform: "rotate(-135deg) scale(.9)" }, "50%": { transform: "rotate(-180deg) scale(1)" }, "62.5%": { transform: "rotate(-225deg) scale(.9)" }, "75%": { transform: "rotate(-270deg) scale(1)" }, "87.5%": { transform: "rotate(-315deg) scale(.9)" }, "100%": { transform: "rotate(-360deg) scale(1)" } }, "@keyframes art-atom-nucleus": { "0%": { transform: "scale(1)" }, "25%": { transform: "scale(.9)" }, "50%": { transform: "scale(1)" }, "75%": { transform: "scale(.85)" }, "100%": { transform: "scale(1)" } }, "@keyframes art-atom-electron": { "0%": { left: "calc(var(--art-atom-electron-size) / -1)", transform: "scale(1)" }, "12.5%": { top: "100%", transform: "scale(1.5)" }, "25%": { left: "100%", transform: "scale(1)" }, "37.5%": { top: "0%", transform: "scale(.25)" }, "50%": { left: "calc(var(--art-atom-electron-size) / -1)", transform: "scale(1)" }, "62.5%": { top: "100%", transform: "scale(1.5)" }, "75%": { left: "100%", transform: "scale(1)" }, "87.5%": { top: "0%", transform: "scale(.25)" }, "100%": { left: "calc(var(--art-atom-electron-size) / -1)", transform: "scale(1)" } }, ".art-eclipse": { "@layer css-art": { "--art-eclipse-bg": "#09090b", "--art-eclipse-size": "600px", width: "var(--art-eclipse-size)", height: "var(--art-eclipse-size)", position: "relative", overflow: "hidden", background: "var(--art-eclipse-bg)", ".layer": { position: "absolute", inset: "0" }, ".layer-1": { animation: "30s linear art-eclipse-rotate infinite", transformOrigin: "66% 40%", background: `repeating-conic-gradient(from 0deg at 50% 50%, rgba(255,255,255,0) 0%, rgba(255,248,176,0.46) 3.96%, rgba(69,168,255,0) 8.33%, rgba(69,168,255,0) 8.33%) 69.5% 37.7% / 17.2% 17.2% no-repeat,
341
+ radial-gradient(ellipse at 50% 50%, rgba(255,248,176,1) 0%, rgba(69,168,255,0) 47.22%) 74.1% 35.6% / 33.6% 36.6% no-repeat` }, ".layer-2": { animation: "20s linear art-eclipse-rotate infinite reverse", transformOrigin: "66% 40%", background: `radial-gradient(ellipse at 50% 50%, rgba(69,168,255,0) 20%, var(--art-eclipse-bg) 29%) 77.4% 33.8% / 40% 40% no-repeat,
342
+ repeating-conic-gradient(from 15deg at 50% 50%, rgba(255,255,255,0) 0%, rgba(255,248,176,0.51) 2.64%, rgba(69,168,255,0) 5.56%, rgba(69,168,255,0) 5.56%) 69.5% 37.7% / 17.2% 17.2% no-repeat` }, ".layer-3": { animation: "20s linear art-eclipse-rotate infinite", background: "repeating-conic-gradient(from 355deg at 50% 50%, rgba(255,255,255,0) 0%, rgba(255,198,69,0.26) 8.1%, rgba(69,168,255,0) 16.67%, rgba(69,168,255,0) 16.67%) 0 0 / 100% 100% no-repeat" }, ".layer-4": { animation: "40s linear art-eclipse-rotate infinite reverse", background: "repeating-conic-gradient(from 355deg at 50% 50%, rgba(255,255,255,0) 0%, rgba(255,198,69,0.26) 2.86%, rgba(69,168,255,0) 5.88%, rgba(69,168,255,0) 5.88%) 0% 0% / 100% 100% no-repeat" }, ".layer-5": { animation: "40s linear art-eclipse-rotate infinite", background: "repeating-conic-gradient(from 0deg at 50% 50%, rgba(255,255,255,0) 0%, rgba(255,198,69,0.26) 6.62%, rgba(69,168,255,0) 7.69%, rgba(69,168,255,0) 7.69%) 0% 0% / 100% 100% no-repeat" }, ".layer-6": { background: `radial-gradient(ellipse at 50% 50%, rgba(255,248,176,0.27) 0%, rgba(69,168,255,0) 63.54%) 67% 39.3% / 5.8% 5.8% no-repeat,
343
+ radial-gradient(ellipse at 50% 50%, rgba(69,168,255,0) 40.28%, rgba(255,183,163,0.05) 52.43%, rgba(69,168,255,0) 63.54%) 68% 38.6% / 13% 13% no-repeat,
344
+ radial-gradient(ellipse at 50% 50%, rgba(255,248,176,0.55) 0%, rgba(69,168,255,0) 63.54%) 66.9% 39.3% / 3.4% 3.4% no-repeat,
345
+ radial-gradient(ellipse at 50% 50%, rgba(255,248,176,0.2) 0%, rgba(69,168,255,0) 66.67%) 70.7% 36.5% / 25.6% 25.6% no-repeat,
346
+ radial-gradient(ellipse at 50% 50%, var(--art-eclipse-bg) 26%, rgba(69,168,255,0) 26.4%) 0% 0% / 100% 100% no-repeat,
347
+ radial-gradient(ellipse at 50% 50%, rgba(255,212,148,0.04) 0%, rgba(69,168,255,0) 69.79%) 0% 0% / 100% 100% no-repeat,
348
+ radial-gradient(ellipse at 50% 50%, rgba(255,240,148,0.11) 0%, rgba(69,168,255,0) 52.43%) 0% 0% / 100% 100% no-repeat,
349
+ radial-gradient(ellipse at 51% 49%, rgba(69,168,255,0) 23.96%, var(--art-eclipse-bg) 40.63%) 0% 0% / 100% 100% no-repeat,
350
+ repeating-conic-gradient(from 0deg at 50% 50%, rgba(255,255,255,0) 0%, rgba(255,239,69,0.14) 11.04%, rgba(69,168,255,0) 20%, rgba(69,168,255,0) 20%) 0% 0% / 100% 100% no-repeat,
351
+ radial-gradient(ellipse at 52% 48%, rgba(69,168,255,0) 23.96%, var(--art-eclipse-bg) 34.03%) 0% 0% / 100% 100% no-repeat,
352
+ radial-gradient(ellipse at 50% 50%, rgba(255,185,147,0.29) 28%, rgba(69,168,255,0) 30%) 0% 0% / 100% 100% no-repeat` } } }, ".art-eclipse-sm": { "@layer css-art": { "--art-eclipse-size": "300px" } }, ".art-eclipse-lg": { "@layer css-art": { "--art-eclipse-size": "800px" } }, "@keyframes art-eclipse-rotate": { from: { transform: "rotate(0deg)" }, to: { transform: "rotate(360deg)" } }, ".art-plasma-ball": { "@layer css-art": { "--art-plasma-ball-size": "350px", "--art-plasma-ball-base-color": "#222222", "--art-plasma-ball-switch-size": "calc(var(--art-plasma-ball-size) * 37 / 350)", position: "relative", isolation: "isolate", margin: "0 auto", width: "var(--art-plasma-ball-size)", height: "calc(var(--art-plasma-ball-size) * 1.6)", boxSizing: "border-box", "*": { boxSizing: "border-box" }, ".base": { position: "absolute", background: "var(--art-plasma-ball-base-color)", width: "calc(var(--art-plasma-ball-size) * 6 / 7)", height: "calc(var(--art-plasma-ball-size) * 4 / 7)", margin: "calc(var(--art-plasma-ball-size) * 48 / 350) auto", top: "calc(var(--art-plasma-ball-size) * 286 / 350)", left: "calc(var(--art-plasma-ball-size) * 25 / 350)", zIndex: -2 }, ".base:before": { position: "absolute", top: "calc(var(--art-plasma-ball-size) * -44 / 350)", width: "calc(var(--art-plasma-ball-size) * 300 / 350)", height: "calc(var(--art-plasma-ball-size) * 80 / 350)", borderRadius: "100%", content: '""', background: ["radial-gradient(#222 20%, #353535)", "conic-gradient(from 167deg, #666666, #232323, #232323, #666666)"], border: "2px solid #597481", boxSizing: "border-box", left: "0", zIndex: 0 }, ".base:after": { position: "absolute", left: "calc(var(--art-plasma-ball-size) * -35 / 350)", bottom: "calc(var(--art-plasma-ball-size) * -65 / 350)", width: "calc(var(--art-plasma-ball-size) * 370 / 350)", height: "calc(var(--art-plasma-ball-size) * 110 / 350)", borderRadius: "30% 30% 50% 50%", content: '""', background: "var(--art-plasma-ball-base-color)", zIndex: -1 }, ".base div": { background: "var(--art-plasma-ball-base-color)", height: "calc(var(--art-plasma-ball-size) * 100 / 350)", marginTop: "calc(var(--art-plasma-ball-size) * 48 / 350)", cssFloat: "left", marginLeft: "calc(var(--art-plasma-ball-size) * -53 / 350)", width: "63%", transform: "rotate(-85deg)", zIndex: -1, position: "relative" }, ".base div + div": { marginTop: "calc(var(--art-plasma-ball-size) * -99 / 350)", marginLeft: "calc(var(--art-plasma-ball-size) * 164 / 350)", transform: "rotate(85deg)" }, ".base span": { position: "absolute", left: "calc(var(--art-plasma-ball-size) * -51 / 350)", bottom: "calc(var(--art-plasma-ball-size) * -4 / 350)", width: "calc(var(--art-plasma-ball-size) * 402 / 350)", height: "calc(var(--art-plasma-ball-size) * 160 / 350)", borderRadius: "0% 0% 80% 80%", content: '""', background: "#242f3400", zIndex: 0, border: "2px solid transparent", borderBottomColor: "#435761" }, "input.switcher": { width: "calc(var(--art-plasma-ball-size) * 48 / 350)", height: "calc(var(--art-plasma-ball-size) * 48 / 350)", opacity: 0, position: "absolute", zIndex: 3333, margin: "0", cursor: "pointer", outline: "none", borderRadius: "calc(var(--art-plasma-ball-size) * 50 / 350) !important", top: "calc(var(--art-plasma-ball-size) * 425 / 350)", left: "calc(var(--art-plasma-ball-size) * 151 / 350)" }, ".glassball": { position: "absolute", overflow: "hidden", margin: "0 auto", width: "var(--art-plasma-ball-size)", height: "var(--art-plasma-ball-size)", borderRadius: "100%", backgroundColor: "rgb(255 255 255 / 0.15)", top: "0%", boxShadow: `0 20px 30px rgba(0, 0, 0, 0.2),
353
+ inset 0px 10px 30px 5px rgba(255, 255, 255, 1)`, zIndex: 1 }, ".glassball:after": { background: `radial-gradient(
354
+ ellipse at center,
355
+ rgba(255, 255, 255, 0.5) 0%,
356
+ rgba(255, 255, 255, 0) 70%
357
+ )`, borderRadius: "50%", boxShadow: "inset 0 20px 30px rgb(255 255 255 / 30%)", content: '""', height: "96%", left: "2%", position: "absolute", width: "96%", top: "2%", zIndex: 1 }, ".glassball:hover": { cursor: "grab" }, ".glassball:before": { position: "absolute", left: "48%", top: "50%", width: "0px", height: "0px", background: "radial-gradient(circle closest-side, #9c27b0, transparent)", transform: "translate(-45%, -48%)", transition: "width 0.2s ease, height 0.2s ease", animation: "art-plasma-ball-spark 5ms ease 0s infinite alternate", border: "8px dotted #24e6ff", filter: "blur(15px)", borderRadius: "100%", zIndex: 2, fontSize: "10em", color: "#d6faff", textAlign: "center", lineHeight: 1, content: '"s"', display: "none", opacity: 0.75 }, ".glassball:hover:before": { width: "calc(var(--art-plasma-ball-size) * 120 / 350)", height: "calc(var(--art-plasma-ball-size) * 150 / 350)" }, "input.switcher:checked + .glassball:before,\n input.switcher:checked + .glassball:after": { display: "block" }, "input.switcher:checked + .glassball:after": { width: "97%", height: "97%", left: "1.5%", top: "1.5%" }, "input.switcher:checked + .glassball:hover:after": { animation: "art-plasma-ball-rotation 3s ease 0s infinite alternate", background: `radial-gradient(
358
+ ellipse at center,
359
+ #ffffff7d 0%,
360
+ #54ecff94 10%,
361
+ transparent 100%
362
+ )`, filter: "brightness(1.75)", opacity: 0.5 }, "input.switcher:checked + .glassball": { transform: "translate3d(0, 0, 0)", backfaceVisibility: "hidden", perspective: "calc(var(--art-plasma-ball-size) * 1000 / 350)", background: `radial-gradient(
363
+ circle,
364
+ #ff5affb8 0%,
365
+ #ff5affb8 20%,
366
+ #5493d2a8 70%,
367
+ #5493d2a8 100%
368
+ )`, animation: `art-plasma-ball-innerlight 5s linear 0s infinite,
369
+ art-plasma-ball-shake 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both`, transition: "background 0.4s ease 0s", boxShadow: "0 0 15px 5px #5493d2a8", border: "1px solid transparent" }, ".switch": { background: "#1b1b1b", width: "var(--art-plasma-ball-switch-size)", height: "var(--art-plasma-ball-switch-size)", position: "absolute", left: "calc(50% - var(--art-plasma-ball-switch-size) / 2)", top: "calc(var(--art-plasma-ball-size) * 430 / 350)", border: "3px solid #4e4e4e", zIndex: 5, borderRadius: "100%", boxShadow: "0 0 10px 0px #000000, 0 0 5px 1px #2d2d2d, 0 0 3px 1px #000 inset" }, ".switch::before": { content: '""', position: "absolute", width: "calc(var(--art-plasma-ball-switch-size) * 16 / 37)", height: "calc(var(--art-plasma-ball-switch-size) * 16 / 37)", bottom: "calc(var(--art-plasma-ball-switch-size) * 6 / 37)", border: "calc(var(--art-plasma-ball-switch-size) * 3 / 37) solid #4e4e4e", borderTopColor: "transparent", borderRadius: "100%", left: "calc(var(--art-plasma-ball-switch-size) * 5.5 / 37)" }, ".switch::after": { content: '""', position: "absolute", width: "calc(var(--art-plasma-ball-switch-size) * 3 / 37)", height: "calc(var(--art-plasma-ball-switch-size) * 9 / 37)", bottom: "calc(var(--art-plasma-ball-switch-size) * 14 / 37)", left: "calc(var(--art-plasma-ball-switch-size) * 11.5 / 37)", background: "#4e4e4e" }, "input:checked + div + div + .switch": { background: "linear-gradient(to bottom, #171717, #404040)", color: "#fff", boxShadow: "0 0 10px 0px #03a9f4, 0 0 5px 1px #03a9f4", borderColor: "#222222d1" }, "input:checked + div + div + .switch:before": { borderColor: "transparent #03a9f4 #03a9f4 #03a9f4" }, "input:checked + div + div + .switch:after": { background: "#03a9f4" }, ".electrode": { width: "calc(var(--art-plasma-ball-size) * 16 / 350)", height: "calc(var(--art-plasma-ball-size) * 140 / 350)", bottom: "calc(var(--art-plasma-ball-size) * 20 / 350)", left: "calc(50% - 0.5em)", position: "absolute", overflow: "visible" }, ".electrode:not(.hide-electrode)": { background: "linear-gradient(75deg, #3a3a3a 20%, #2d2d2d)", borderBottom: "1px solid #657882", borderRadius: "0 0 6px 5px" }, ".electrode:before": { position: "absolute", left: "calc(var(--art-plasma-ball-size) * -16 / 350)", top: "calc(var(--art-plasma-ball-size) * -40 / 350)", width: "calc(var(--art-plasma-ball-size) * 48 / 350)", height: "calc(var(--art-plasma-ball-size) * 48 / 350)", borderRadius: "100%", content: '""', background: "radial-gradient(at top left, #4a4949 20%, #2d2d2d)", border: "1px solid #758e99", boxSizing: "border-box" }, ".electrode:not(.hide-electrode):after": { position: "absolute", left: "calc(var(--art-plasma-ball-size) * -3 / 350)", bottom: "calc(var(--art-plasma-ball-size) * -11 / 350)", width: "calc(var(--art-plasma-ball-size) * 22 / 350)", height: "calc(var(--art-plasma-ball-size) * 16 / 350)", borderRadius: "calc(var(--art-plasma-ball-size) * 140 / 350) / calc(var(--art-plasma-ball-size) * 50 / 350)", content: '""', background: "linear-gradient(-263deg, #191919 20%, #0a0a0a)", zIndex: -1 }, "input.switcher:checked + .glassball .electrode:after": { background: "linear-gradient(-263deg, #3a3a3a 20%, #2d2d2d)" }, "input.switcher:checked + .glassball .electrode:before": { background: `radial-gradient(
370
+ ellipse farthest-corner at calc(var(--art-plasma-ball-size) * 30 / 350) calc(var(--art-plasma-ball-size) * 30 / 350),
371
+ #999,
372
+ #e449ff,
373
+ #e449ff,
374
+ #9763ff,
375
+ #62edff,
376
+ #fff
377
+ )`, boxShadow: `0 0 10px 2px #e449ffb3, 0 0 10px 2px #fff,
378
+ 0 0 50px -10px #fff inset`, borderColor: "#ffffff94" }, "input.switcher + .glassball .rays": { display: "none" }, "input.switcher:checked + .glassball .rays": { display: "block", cssFloat: "left", width: "100%", height: "100%", position: "absolute" }, ".ray": { width: "calc(var(--art-plasma-ball-size) * 160 / 350)", height: "calc(var(--art-plasma-ball-size) * 32 / 350)", position: "absolute", bottom: "calc(var(--art-plasma-ball-size) * 144 / 350)", filter: "drop-shadow(0px 0px 7px #9660f7) drop-shadow(0px 0px 2px #fff)" }, ".ray:before": { content: '""', width: "calc(var(--art-plasma-ball-size) * 8 / 350)", height: "calc(var(--art-plasma-ball-size) * 7.2 / 350)", border: "2px dashed #03a9f4", position: "absolute", borderWidth: "3px 3px 1px 1px", transform: "rotate(87deg)", top: "calc(var(--art-plasma-ball-size) * 4.8 / 350)", left: "calc(var(--art-plasma-ball-size) * 3 / 350)", borderRadius: "10px 5px 8px 7px", filter: "blur(2px)", boxShadow: "0 0 10px -1px black" }, ".ray:after": { content: '"s"', cssFloat: "left", width: "calc(var(--art-plasma-ball-size) * 32 / 350)", height: "calc(var(--art-plasma-ball-size) * 96 / 350)", marginTop: "calc(var(--art-plasma-ball-size) * 20 / 350)", marginLeft: "0px", animation: "art-plasma-ball-blink 1s linear 0s infinite alternate", background: "radial-gradient(circle closest-side, #9c27b0, transparent)", transform: "translate(-45%, -48%)", transition: "width 0.2s ease, height 0.2s ease", border: "calc(var(--art-plasma-ball-size) * 8 / 350) dotted #24e6ff", filter: "blur(5px)", borderRadius: "100%", zIndex: 2, fontSize: "calc(var(--art-plasma-ball-size) * 64 / 350)", color: "#d6faff", textAlign: "center", lineHeight: 1 }, ".ray span": { width: "calc(var(--art-plasma-ball-size) * 64 / 350)", height: "calc(var(--art-plasma-ball-size) * 16 / 350)", border: "solid calc(var(--art-plasma-ball-size) * 4 / 350) #000", borderRadius: "238%/50px 50px 0 0", position: "absolute", top: "calc(var(--art-plasma-ball-size) * 8 / 350)", left: "0", borderColor: "#6bbdff transparent transparent transparent" }, ".ray span + span": { left: "30%", transform: "rotate(180deg)", top: "calc(var(--art-plasma-ball-size) * 2.4 / 350)" }, ".ray span + span + span": { left: "60%", transform: "rotate(0deg)", top: "calc(var(--art-plasma-ball-size) * 8 / 350)" }, ".ray span:last-of-type:before": { content: '""', cssFloat: "right", width: "calc(var(--art-plasma-ball-size) * 8 / 350)", height: "calc(var(--art-plasma-ball-size) * 8 / 350)", background: "#d1eefb", borderRadius: "100%", boxShadow: "0 0 4px 3px #fff", filter: "blur(1px)", marginTop: "calc(var(--art-plasma-ball-size) * -2 / 350)", left: "calc(var(--art-plasma-ball-size) * 3 / 350)", position: "relative" }, ".ray.bigwave span:last-of-type:before": { content: '""', cssFloat: "left", width: "calc(var(--art-plasma-ball-size) * 8 / 350)", height: "calc(var(--art-plasma-ball-size) * 8 / 350)", background: "#d1eefb", borderRadius: "100%", boxShadow: "0 0 4px 3px #fff", filter: "blur(1px)", marginTop: "calc(var(--art-plasma-ball-size) * -3 / 350)", left: "calc(var(--art-plasma-ball-size) * -2 / 350)", position: "relative" }, ".ray.bigwave span": { width: "55%", borderWidth: "calc(var(--art-plasma-ball-size) * 4 / 350)" }, ".ray.bigwave span + span": { width: "60%", left: "40%", borderWidth: "calc(var(--art-plasma-ball-size) * 5 / 350)", marginLeft: "calc(var(--art-plasma-ball-size) * 4 / 350)", marginTop: "calc(var(--art-plasma-ball-size) * 2 / 350)" }, ".rays + .rays": { transform: "rotate(180deg)" }, ".rays + .rays + .rays": { transform: "rotate(90deg)" }, ".rays + .rays + .rays + .rays": { transform: "rotate(270deg)" }, ".rays + .rays + .rays + .rays + .rays": { transform: "skew(-187deg, 0deg) scale(0.675) rotate(0deg)", display: "none", animation: "art-plasma-ball-touchray1 2.5s ease 0.1s infinite alternate" }, ".rays + .rays + .rays + .rays + .rays + .rays": { transform: "skew(-140deg, -40deg) scale(0.675) rotate(180deg)", display: "none", animation: "art-plasma-ball-touchray2 1s ease 0.25s infinite" }, "input.switcher:checked\n + .glassball:hover\n .rays\n + .rays\n + .rays\n + .rays\n + .rays": { display: "block" }, ".rays + .rays + .rays + .rays + .rays .ray": { width: "calc(var(--art-plasma-ball-size) * 136 / 350)", animation: "art-plasma-ball-ray1 0.5s linear 0s infinite alternate" }, ".rays + .rays + .rays + .rays + .rays .ray span": { borderTopWidth: "calc(var(--art-plasma-ball-size) * 8 / 350)" }, ".ray:nth-of-type(1)": { animation: "art-plasma-ball-ray1 0.5s linear 0s infinite" }, ".ray:nth-of-type(2)": { animation: "art-plasma-ball-ray1 0.75s linear 0s infinite alternate" }, ".ray:nth-of-type(3)": { animation: "art-plasma-ball-ray1 0.65s linear 0s infinite reverse" }, ".ray:nth-of-type(4)": { animation: "art-plasma-ball-ray1 0.95s linear 0s infinite alternate" }, ".ray:nth-of-type(5)": { animation: "art-plasma-ball-ray1 0.85s linear 0s infinite reverse" }, ".rays + .rays .ray:nth-of-type(1)": { animationDuration: "1.55s" }, ".rays + .rays .ray:nth-of-type(2)": { animationDuration: "1.75s" }, ".rays + .rays .ray:nth-of-type(3)": { animationDuration: "0.65s" }, ".rays + .rays .ray:nth-of-type(4)": { animationDuration: "1.85s" }, ".rays + .rays .ray:nth-of-type(5)": { animationDuration: "1.6s" }, ".rays + .rays + .rays .ray:nth-of-type(1)": { animationDuration: "1.15s" }, ".rays + .rays + .rays .ray:nth-of-type(2)": { animationDuration: "1.5s" }, ".rays + .rays + .rays .ray:nth-of-type(3)": { animationDuration: "1.35s" }, ".rays + .rays + .rays .ray:nth-of-type(4)": { animationDuration: "1s" }, ".rays + .rays + .rays .ray:nth-of-type(5)": { animationDuration: "1.25s" }, ".rays + .rays + .rays + .rays .ray:nth-of-type(1)": { animationDuration: "1.05s" }, ".rays + .rays + .rays + .rays .ray:nth-of-type(2)": { animationDuration: "1.35s" }, ".rays + .rays + .rays + .rays .ray:nth-of-type(3)": { animationDuration: "1.25s" }, ".rays + .rays + .rays + .rays .ray:nth-of-type(4)": { animationDuration: "1.15s" }, ".rays + .rays + .rays + .rays .ray:nth-of-type(5)": { animationDuration: "1.45s" }, ".rays + .rays + .rays + .rays + .rays .ray:nth-of-type(1)": { animationDuration: "0.85s" }, ".rays + .rays + .rays + .rays + .rays .ray:nth-of-type(2)": { animationDuration: "0.95s" }, ".rays + .rays + .rays + .rays + .rays .ray:nth-of-type(3)": { animationDuration: "0.75s" }, ".rays + .rays + .rays + .rays + .rays + .rays .ray:nth-of-type(1)": { animationDuration: "1.1s" }, ".rays + .rays + .rays + .rays + .rays + .rays .ray:nth-of-type(2)": { animationDuration: "1.25s" }, ".rays + .rays + .rays + .rays + .rays + .rays .ray:nth-of-type(3)": { animationDuration: "1.35s" } } }, ".art-plasma-ball-sm": { "@layer css-art": { "--art-plasma-ball-size": "200px" } }, ".art-plasma-ball-lg": { "@layer css-art": { "--art-plasma-ball-size": "500px" } }, ".art-plasma-ball-no-base": { "@layer css-art": { height: "var(--art-plasma-ball-size)" } }, ".art-plasma-ball-no-base .base, \n .art-plasma-ball-no-base .switch": { "@layer css-art": { display: "none" } }, ".art-plasma-ball-no-base input.switcher": { "@layer css-art": { top: "0", left: "0", width: "100%", height: "100%", borderRadius: "100% !important" } }, "@keyframes art-plasma-ball-rotation": { "50%": { transform: "rotate(360deg)" } }, "@keyframes art-plasma-ball-blink": { "0%": { background: "radial-gradient(circle closest-side, #ff5affb8, #5493d2a8)", transform: "translate(-50%, -50%) scale(0.75) rotate(6deg)" }, "50%": { background: "radial-gradient(circle closest-side, #5493d2a8, #ff5affb8)", transform: "translate(-50%, -50%) scale(0.5) rotate(2deg)" }, "100%": { background: "radial-gradient(circle closest-side, #ffffffa8, #5493d2a8)", transform: "translate(-50%, -50%) scale(0.35) rotate(11deg)" } }, "@keyframes art-plasma-ball-innerlight": { "0%": { backgroundSize: "105% 105%", backgroundPosition: "center center", boxShadow: "0 0 15px 5px #5493d2a8" }, "25%": { boxShadow: "0 0 15px 5px #ff5aff30" }, "50%": { backgroundSize: "85% 85%", backgroundPosition: "center center", boxShadow: "0 0 15px 5px #5493d2a8" }, "75%": { boxShadow: "0 0 15px 5px #ff5aff30" }, "100%": { backgroundSize: "105% 105%", backgroundPosition: "center center", boxShadow: "0 0 15px 5px #5493d2a8" } }, "@keyframes art-plasma-ball-touchray1": { "0%": { transform: "skew(-187deg, 0deg) scale(0.675) rotate(0deg)" }, "50%": { transform: "skew(-185deg, 2deg) scale(0.525) rotate(180deg)", opacity: 1 }, "51%": { opacity: 0 }, "52%": { opacity: 1 }, "100%": { transform: "skew(-188deg, -2deg) scale(0.625) rotate(360deg)" } }, "@keyframes art-plasma-ball-touchray2": { "0%": { transform: "skew(-140deg, -40deg) scale(0.675) rotate(140deg)" }, "50%": { transform: "skew(-143deg, -42deg) scale(0.525) rotate(0deg)", opacity: 1 }, "51%": { opacity: 0 }, "52%": { opacity: 1 }, "100%": { transform: "skew(-145deg, -38deg) scale(0.625) rotate(210deg)" } }, "@keyframes art-plasma-ball-spark": { "0%": { background: "radial-gradient(circle closest-side, #ff5affb8, #5493d2a8)", transform: "translate(-50%, -50%) scale(0.75) rotate(0deg)" }, "50%": { background: "radial-gradient(circle closest-side, #5493d2a8, #ff5affb8)", transform: "translate(-50%, -50%) scale(0.5) rotate(180deg)" }, "100%": { background: "radial-gradient(circle closest-side, #ffffffa8, #5493d2a8)", transform: "translate(-50%, -50%) scale(1) rotate(360deg)" } }, "@keyframes art-plasma-ball-ray1": { "0%": { opacity: 0, transform: "rotate(0deg) translate(0px, 0px)" }, "12%": { opacity: 1, transform: "rotate(22deg) translate(0px, calc(var(--art-plasma-ball-size) * -35 / 350))", filter: "brightness(1.75)" }, "25%": { opacity: 0, transform: "rotate(45deg) translate(calc(var(--art-plasma-ball-size) * -33 / 350), calc(var(--art-plasma-ball-size) * -69 / 350))" }, "37%": { opacity: 1, transform: "rotate(67deg) translate(calc(var(--art-plasma-ball-size) * -64 / 350), calc(var(--art-plasma-ball-size) * -86 / 350))", filter: "brightness(1.15)" }, "50%": { opacity: 0, transform: "rotate(90deg) translate(calc(var(--art-plasma-ball-size) * -108 / 350), calc(var(--art-plasma-ball-size) * -93 / 350))" }, "62%": { opacity: 1, transform: "rotate(112deg) translate(calc(var(--art-plasma-ball-size) * -140 / 350), calc(var(--art-plasma-ball-size) * -90 / 350))", filter: "brightness(1.25)" }, "75%": { opacity: 0, transform: "rotate(135deg) translate(calc(var(--art-plasma-ball-size) * -169 / 350), calc(var(--art-plasma-ball-size) * -69 / 350))" }, "87%": { opacity: 1, transform: "rotate(157deg) translate(calc(var(--art-plasma-ball-size) * -185 / 350), calc(var(--art-plasma-ball-size) * -36 / 350))", filter: "brightness(1.75)" }, "100%": { opacity: 0, transform: "rotate(180deg) translate(calc(var(--art-plasma-ball-size) * -192 / 350), calc(var(--art-plasma-ball-size) * 6 / 350))" } }, ".art-snowflake": { "@layer css-art": { position: "absolute", width: "var(--art-snowflake-size, 10px)", height: "var(--art-snowflake-size, 10px)", borderRadius: "50%", pointerEvents: "none", "&:not(.art-snowflake-unicode)": { background: "var(--art-snowflake-color, #FFFFFF)", filter: "drop-shadow(0 0 var(--art-snowflake-size, 10px) var(--art-snowflake-color, #FFFFFF))" } } }, ".art-snowflake.art-snowflake-unicode::after": { "@layer css-art": { content: '"\\2746"', color: "var(--art-snowflake-color, #FFFFFF)", fontSize: "var(--art-snowflake-size, 10px)", filter: "drop-shadow(0 0 var(--art-snowflake-size, 10px) var(--art-snowflake-color, #FFFFFF))" } }, ".art-snowflake-fall": { "@layer css-art": { animation: "art-snowflake-fall var(--art-snowflake-duration, 5s) linear infinite" } }, "@keyframes art-snowflake-fall": { "0%": { transform: "translateY(-10%) rotate(0deg)", opacity: 1 }, "100%": { transform: "translateY(100vh) rotate(360deg)", opacity: 0.3 } }, "@keyframes art-cat-stargazer-blink": { "0%, 25%, 28%, 100%": { height: "0" }, "26.5%": { height: "100%" } }, ".art-cat-stargazer": { "@layer css-art": { "--art-cat-stargazer-size": "500px", position: "relative", fontSize: "calc(var(--art-cat-stargazer-size) / 90)", width: "var(--art-cat-stargazer-size)", aspectRatio: "1", overflow: "hidden", background: `radial-gradient(circle at 20% 20%, #ffc8 0.20em, #0000 0),
379
+ radial-gradient(circle at 70% 50%, #ffc8 0.25em, #0000 0),
380
+ radial-gradient(circle at 10% 80%, #ffc8 0.20em, #0000 0),
381
+ radial-gradient(circle at 80% 30%, #ffc8 0.30em, #0000 0),
382
+ radial-gradient(circle at 80% 80%, #ffc8 0.23em, #0000 0),
383
+ radial-gradient(circle at 50% 10%, #ff8b 0.3em, #0000 0),
384
+ radial-gradient(circle at 40% 60%, #ffc8 0.20em, #0000 0),
385
+ radial-gradient(circle at 30% 30%, #ffc8 0.20em, #0000 0) 0 0 / 70% 70%,
386
+ radial-gradient(circle at 30% 30%, #ffc8 0.20em, #0000 0) 40% 30% / 50% 70%,
387
+ linear-gradient(#0002, #0000),
388
+ radial-gradient(at 50% 80%, #fcc2, #fff0),
389
+ #023`, "*, *::before, *::after": { position: "absolute", boxSizing: "border-box" }, ".moon": { width: "120%", height: "40%", left: "50%", bottom: "0", translate: "-50% 60%", borderRadius: "50% / 100% 100% 0 0", boxShadow: `0 0 3em #ffc,
390
+ 0 0 9em #ffc8`, background: `radial-gradient(at 38% 20%, #0001 2%, #0000 0),
391
+ radial-gradient(13% 8% at 50% 0, #0001 99%, #0000),
392
+ #ffc`, "&::before": { content: '""', width: "18%", height: "15%", background: "#0001", borderRadius: "50%", boxShadow: "inset 0 1em #0002", rotate: "-15deg", top: "15%", left: "20%", scale: "0.8" }, "&::after": { content: '""', width: "4%", height: "5%", background: "#0001", borderRadius: "50%", boxShadow: "-7em 3em 0 2em #0001", rotate: "30deg", top: "25%", left: "80%", scale: "0.8" } }, ".cat": { "--fur": "#111", "--fur-dark": "#000", "--skin": "pink", "--suit": "#fff", "--suit-dark": "#ddd", fontSize: "0.4em", width: "80em", aspectRatio: "1", bottom: "15%", left: "50%", translate: "-50%", ".bubble": { width: "119%", height: "103%", borderRadius: "50%", bottom: "25%", left: "49%", translate: "-50%", background: `radial-gradient(circle at 25% 25%, #fff3, #fff0 25%),
393
+ radial-gradient(circle at 15% 45%, #fff1, #fff0 15%),
394
+ radial-gradient(circle at 75% 35%, #fff1, #fff0 50%),
395
+ #fff1`, boxShadow: `inset 0 0 1em 1em #acf,
396
+ inset 0 0 5em #fff` }, ".backpack": { width: "40%", left: "50%", height: "30%", background: "#bcd", bottom: "0", translate: "-50%", borderRadius: "3em" }, ".tail": { width: "50%", height: "50%", borderRadius: "50%", border: "7em solid #0000", borderTopColor: "var(--suit-dark)", borderLeftColor: "var(--suit-dark)", clipPath: "polygon(100% 0, 100% 100%, 0 30%, 0 0)", top: "75%", left: "52%", "&::before": { content: '""', width: "7em", aspectRatio: "1", background: "var(--suit-dark)", borderRadius: "50%", left: "81%", top: "-9%" } }, ".body": { left: "50%", translate: "-50%", bottom: "0", width: "35%", height: "40%", background: `radial-gradient(circle at 17% 55%, #36c 2em, #0000 0),
397
+ radial-gradient(100% 70% at 50% 0, var(--fur-dark) 50%, #0000 0),
398
+ radial-gradient(150% 70% at 49% 0, var(--fur) 50%, #d99 0 59%, #0000 calc(59% + 1px)),
399
+ var(--suit)`, borderRadius: "100% / 200% 200% 20% 20%", ".leg": { width: "165%", height: "38%", bottom: "0", left: "50%", translate: "-50%", borderRadius: "8em 8em 100% 100% / 10em 10em 16em 16em", scale: "1 -1", background: `radial-gradient(20% 200% at 2% 10%, var(--suit-dark) 20%, #0000 0),
400
+ radial-gradient(20% 200% at 98% 10%, var(--suit-dark) 20%, #0000 0),
401
+ var(--suit)` }, ".paw": { width: "35%", height: "49%", border: "0.75em solid #777", borderTop: "0", borderRadius: "0 0 5em 5em", top: "51%", rotate: "-10deg", left: "10%", clipPath: "polygon(0 20%, 100% 30%, 100% 100%, 0 100%)", "& + &": { right: "7%", height: "50%", left: "auto", rotate: "13deg", scale: "-1 1", clipPath: "polygon(0 25%, 100% 15%, 100% 100%, 0 100%)" } } }, ".ear": { width: "40%", aspectRatio: "1", border: "4em solid var(--fur)", borderRadius: "5% 90% 10% 80%", background: "var(--skin)", top: "5%", left: "10%", "& + &": { scale: "-1 1", left: "auto", right: "10%" } }, ".head": { width: "80%", aspectRatio: "1.1", background: `linear-gradient(#0003, #0000 50%),
402
+ var(--fur)`, left: "50%", translate: "-50%", borderRadius: "100% / 125% 125% 80% 75%", ".whisker": { width: "30%", height: "30%", borderRadius: "50%", border: "2em solid #0000", borderTopColor: "var(--fur)", borderLeftColor: "var(--fur)", clipPath: "polygon(100% 0, 100% 100%, 0 30%, 0 0)", "&:nth-child(1)": { top: "45%", translate: "-65%" }, "&:nth-child(2)": { top: "55%", translate: "-40%", rotate: "-20deg" }, "&:nth-child(3)": { right: "0%", top: "45%", translate: "65%", rotate: "10deg" }, "&:nth-child(4)": { right: "-2%", top: "55%", translate: "40%", rotate: "24deg" } }, ".nose": { width: "10%", height: "7%", background: "var(--skin)", borderRadius: "50%", left: "50%", translate: "-50% -50%", top: "55%" }, ".eye": { "--pos": "25%", "--x1": "50%", "--x2": "42%", width: "35%", aspectRatio: "1", borderRadius: "50%", background: `radial-gradient(50% 50% at var(--x1) 32%, #fff 25%, #0000 calc(25% + 1px)),
403
+ radial-gradient(50% 50% at var(--x2) 51%, #fff 12%, #0000 calc(12% + 1px)),
404
+ radial-gradient(circle at 60% 40%, #000 35%, #0000 calc(35% + 1px)),
405
+ white`, left: "var(--pos)", translate: "-50% -50%", top: "43%", overflow: "hidden", "& + &": { "--x1": "70%", "--x2": "78%", left: "calc(100% - var(--pos))", scale: "-1 1" }, "&::before": { content: '""', top: "-30%", left: "50%", translate: "-50%", width: "150%", height: "0%", background: "var(--fur)", rotate: "-10deg", animation: "art-cat-stargazer-blink 10s linear infinite" }, "&::after": { content: '""', bottom: "-10%", left: "50%", translate: "-50%", width: "150%", height: "0%", background: "var(--fur)", rotate: "-10deg", animation: "art-cat-stargazer-blink 10s linear infinite" } } } } } }, ".art-cat-stargazer-sm": { "@layer css-art": { "--art-cat-stargazer-size": "300px" } }, ".art-cat-stargazer-lg": { "@layer css-art": { "--art-cat-stargazer-size": "700px" } }, "@keyframes art-color-spin-spin": { "0%,\n 1%": { transform: `translateX(-50%) translateY(calc(var(--art-color-spin-size) * 0.026))
406
+ rotateY(0deg) scale(1.05)` }, "99%,\n 100%": { transform: `translateX(-50%) translateY(calc(var(--art-color-spin-size) * 0.026))
407
+ rotateY(360deg) scale(1.05)` } }, ".art-color-spin": { "@layer css-art": { "--art-color-spin-size": "770px", "--art-color-spin-color1": "#ffd700", "--art-color-spin-color2": "#20a7db", "--art-color-spin-color3": "#8fce00", "--art-color-spin-color4": "#ff0000", position: "relative", width: "var(--art-color-spin-size)", height: "calc(var(--art-color-spin-size) * 0.26)", background: `repeating-linear-gradient(
408
+ -45deg,
409
+ #000,
410
+ #000 5px,
411
+ #111 5px,
412
+ #111 10px
413
+ )`, perspective: "calc(var(--art-color-spin-size) * 1.039)", fontFamily: '"Google Sans", sans-serif', fontWeight: 440, overflow: "visible" } }, ".art-color-spin *": { "@layer css-art": { boxSizing: "border-box" } }, ".art-color-spin::before": { "@layer css-art": { content: '"c"', fontSize: "calc(var(--art-color-spin-size) * 0.461)", color: "#eee", position: "absolute", top: "calc(var(--art-color-spin-size) * -0.169)", left: "0", textIndent: "calc(var(--art-color-spin-size) * -0.026)", lineHeight: "calc(var(--art-color-spin-size) * 0.519)", zIndex: 2, WebkitBoxReflect: `below calc(var(--art-color-spin-size) * -0.169)
414
+ linear-gradient(transparent, rgb(255 255 255 / 0.06))` } }, ".art-color-spin::after": { "@layer css-art": { content: '"r"', fontSize: "calc(var(--art-color-spin-size) * 0.461)", color: "#eee", position: "absolute", top: "calc(var(--art-color-spin-size) * -0.169)", right: "calc(var(--art-color-spin-size) * 0.039)", lineHeight: "calc(var(--art-color-spin-size) * 0.519)", zIndex: 2, WebkitBoxReflect: `below calc(var(--art-color-spin-size) * -0.169)
415
+ linear-gradient(transparent, rgb(255 255 255 / 0.06))` } }, ".art-color-spin > ul": { "@layer css-art": { width: "0", height: "calc(var(--art-color-spin-size) * 0.195)", display: "block", left: "50%", position: "relative", transformStyle: "preserve-3d", transformOrigin: "center center", zIndex: 3, margin: "0", padding: "0", listStyle: "none", animation: "art-color-spin-spin 11s linear infinite alternate-reverse" } }, ".art-color-spin > ul *": { "@layer css-art": { transformStyle: "preserve-3d" } }, ".art-color-spin > ul::before, \n .art-color-spin > ul::after": { "@layer css-art": { content: '""', display: "block", position: "absolute", width: "calc(var(--art-color-spin-size) * 0.052)", height: "calc(var(--art-color-spin-size) * 0.286)", borderRadius: "calc(var(--art-color-spin-size) * 0.026)", top: "calc(var(--art-color-spin-size) * -0.039)", left: "calc(var(--art-color-spin-size) * -0.026)", background: "#fff" } }, ".art-color-spin > ul::before": { "@layer css-art": { background: "#eee", transform: "rotateY(-90deg)" } }, ".art-color-spin > ul > li": { "@layer css-art": { display: "block", width: "calc(var(--art-color-spin-size) * 0.234)", height: "calc(var(--art-color-spin-size) * 0.234)", border: "solid calc(var(--art-color-spin-size) * 0.032) #fff", borderRadius: "50%", top: "calc(var(--art-color-spin-size) * -0.013)", left: "0", position: "absolute", transform: `rotateY(calc(var(--i) * -90deg)) translateZ(0px)
416
+ translateX(calc(var(--art-color-spin-size) * 0.052))`, transformOrigin: "top left", WebkitBoxReflect: "below 2px linear-gradient(transparent, rgb(255 255 255 / 0.1))", margin: "0", padding: "0", listStyle: "none" } }, ".art-color-spin > ul > li::before, \n .art-color-spin > ul > li::after": { "@layer css-art": { content: '""', width: "calc(var(--art-color-spin-size) * 0.13)", height: "calc(var(--art-color-spin-size) * 0.13)", display: "block", opacity: 0.75, borderRadius: "50%", position: "absolute", left: "50%", top: "50%", mixBlendMode: "color-burn" } }, ".art-color-spin > ul > li::after": { "@layer css-art": { transform: "translate3d(-50%, -50%, 1px)" } }, ".art-color-spin > ul > li::before": { "@layer css-art": { transform: "translate3d(-50%, -50%, -1px)" } }, ".art-color-spin > ul > li:nth-child(1)": { "@layer css-art": { outline: "solid 1px var(--art-color-spin-color1)", outlineOffset: "1px" } }, ".art-color-spin > ul > li:nth-child(1)::after": { "@layer css-art": { background: "var(--art-color-spin-color1)" } }, ".art-color-spin > ul > li:nth-child(1)::before": { "@layer css-art": { background: "color-mix(in hsl, var(--art-color-spin-color1), white 30%)" } }, ".art-color-spin > ul > li:nth-child(2)": { "@layer css-art": { outline: "solid 1px var(--art-color-spin-color2)", outlineOffset: "1px" } }, ".art-color-spin > ul > li:nth-child(2)::after": { "@layer css-art": { background: "var(--art-color-spin-color2)" } }, ".art-color-spin > ul > li:nth-child(2)::before": { "@layer css-art": { background: "color-mix(in hsl, var(--art-color-spin-color2), white 30%)" } }, ".art-color-spin > ul > li:nth-child(3)": { "@layer css-art": { outline: "solid 1px var(--art-color-spin-color3)", outlineOffset: "1px" } }, ".art-color-spin > ul > li:nth-child(3)::after": { "@layer css-art": { background: "var(--art-color-spin-color3)" } }, ".art-color-spin > ul > li:nth-child(3)::before": { "@layer css-art": { background: "color-mix(in hsl, var(--art-color-spin-color3), white 30%)" } }, ".art-color-spin > ul > li:nth-child(4)": { "@layer css-art": { outline: "solid 1px var(--art-color-spin-color4)", outlineOffset: "1px" } }, ".art-color-spin > ul > li:nth-child(4)::after": { "@layer css-art": { background: "var(--art-color-spin-color4)" } }, ".art-color-spin > ul > li:nth-child(4)::before": { "@layer css-art": { background: "color-mix(in hsl, var(--art-color-spin-color4), white 30%)" } }, ".art-color-spin-sm": { "@layer css-art": { "--art-color-spin-size": "385px" } }, ".art-color-spin-lg": { "@layer css-art": { "--art-color-spin-size": "1000px" } }, "@keyframes art-synthwave-starfield-color": { "0%": { filter: "hue-rotate(1deg)" }, "100%": { filter: "hue-rotate(360deg)" } }, "@keyframes art-synthwave-starfield-lines-x": { "0%": { backgroundPosition: "calc(var(--art-synthwave-starfield-size) * 0.12) center" }, "100%": { backgroundPosition: "0 center" } }, "@keyframes art-synthwave-starfield-lines-y": { "0%": { backgroundPosition: "center calc(var(--art-synthwave-starfield-size) * 0.12)" }, "100%": { backgroundPosition: "center 0" } }, "@keyframes art-synthwave-starfield-stars": { "0%": { transform: "translateZ(calc(var(--art-synthwave-starfield-size) * -0.4))", opacity: 0 }, "30%,\n 80%": { opacity: 1 }, "100%": { transform: "translateZ(calc(var(--art-synthwave-starfield-size) * 0.5)) rotate(15deg)", opacity: 0 } }, "@keyframes art-synthwave-starfield-stars2": { "0%": { transform: "translateZ(calc(var(--art-synthwave-starfield-size) * -0.4)) rotate(180deg)", opacity: 0 }, "30%,\n 80%": { opacity: 1 }, "100%": { transform: "translateZ(calc(var(--art-synthwave-starfield-size) * 0.5)) rotate(195deg)", opacity: 0 } }, ".art-synthwave-starfield": { "@layer css-art": { "--art-synthwave-starfield-size": "600px", "--art-synthwave-starfield-line-color": "#6bd600", position: "relative", width: "var(--art-synthwave-starfield-size)", height: "var(--art-synthwave-starfield-size)", overflow: "hidden", perspective: "calc(var(--art-synthwave-starfield-size) * 0.5)", transformStyle: "preserve-3d", backgroundImage: `radial-gradient(#0000, #673ab72e),
417
+ linear-gradient(-90deg, #2000587d, #000, #9c27b02b),
418
+ linear-gradient(0deg, #ff98002e, #000, #8bc34a5e)`, backgroundColor: "#000", boxShadow: `0 0 calc(var(--art-synthwave-starfield-size) * 1.5)
419
+ calc(var(--art-synthwave-starfield-size) * 0.11) #000 inset`, fontFamily: '"Press Start 2P", system-ui' } }, ".art-synthwave-starfield::before": { "@layer css-art": { content: '""', position: "absolute", width: "100%", height: "100%", background: `radial-gradient(#0000, #0a123a),
420
+ linear-gradient(180deg, #2000587d, #000, #9c27b02b),
421
+ linear-gradient(0deg, #ff980054, #000, #009688ba)`, opacity: 0.25, zIndex: 0 } }, ".art-synthwave-starfield *": { "@layer css-art": { boxSizing: "border-box", position: "absolute", transformStyle: "preserve-3d" } }, ".art-synthwave-starfield *::before, \n .art-synthwave-starfield *::after": { "@layer css-art": { boxSizing: "border-box", transformStyle: "preserve-3d", position: "absolute", content: '""' } }, ".art-synthwave-starfield-sides": { "@layer css-art": { width: "100%", height: "100%", background: "radial-gradient(#0f0015 10%, #000000e0 35%, #fff0 75% 100%)" } }, ".art-synthwave-starfield-sides::before, \n .art-synthwave-starfield-sides::after": { "@layer css-art": { width: "100%", height: "100%", transform: "rotateY(90deg)", transformOrigin: "left center", backgroundImage: `repeating-linear-gradient(
422
+ 90deg,
423
+ #fff0 0,
424
+ #fff0 calc(var(--art-synthwave-starfield-size) * 0.1),
425
+ var(--art-synthwave-starfield-line-color) calc(var(--art-synthwave-starfield-size) * 0.1)
426
+ calc(var(--art-synthwave-starfield-size) * 0.1035),
427
+ #fff0 calc(var(--art-synthwave-starfield-size) * 0.1035)
428
+ ),
429
+ repeating-linear-gradient(
430
+ 180deg,
431
+ #fff0 0,
432
+ #fff0 calc(var(--art-synthwave-starfield-size) * 0.1),
433
+ var(--art-synthwave-starfield-line-color) calc(var(--art-synthwave-starfield-size) * 0.1)
434
+ calc(var(--art-synthwave-starfield-size) * 0.1035),
435
+ #fff0 calc(var(--art-synthwave-starfield-size) * 0.1035)
436
+ )`, backgroundColor: "transparent", animation: `art-synthwave-starfield-lines-x 0.5s linear 0s infinite,
437
+ art-synthwave-starfield-color 5s linear 0s infinite`, backgroundRepeat: "repeat", backgroundPosition: "center center", backgroundSize: `calc(var(--art-synthwave-starfield-size) * 0.12)
438
+ calc(var(--art-synthwave-starfield-size) * 0.12)`, boxShadow: `0 0 calc(var(--art-synthwave-starfield-size) * 0.08)
439
+ calc(var(--art-synthwave-starfield-size) * 0.1) #000 inset` } }, ".art-synthwave-starfield-lefrig::after": { "@layer css-art": { transform: "rotateY(-90deg)", transformOrigin: "right center", animation: `art-synthwave-starfield-lines-x 0.5s linear 0s infinite reverse,
440
+ art-synthwave-starfield-color 5s linear 2s infinite`, zIndex: -1 } }, ".art-synthwave-starfield-topbot::before": { "@layer css-art": { height: "100%", transform: "rotateX(90deg)", transformOrigin: "center bottom", bottom: "0", animation: `art-synthwave-starfield-lines-y 0.5s linear 0s infinite reverse,
441
+ art-synthwave-starfield-color 5s linear 1s infinite` } }, ".art-synthwave-starfield-topbot::after": { "@layer css-art": { height: "100%", transform: "rotateX(-90deg)", transformOrigin: "center top", bottom: "auto", animation: `art-synthwave-starfield-lines-y 0.5s linear 0s infinite,
442
+ art-synthwave-starfield-color 5s linear 3s infinite` } }, ".art-synthwave-starfield-stars": { "@layer css-art": { width: "100%", height: "100%", zIndex: 3 } }, ".art-synthwave-starfield-stars::before, \n .art-synthwave-starfield-stars::after": { "@layer css-art": { width: "200%", height: "200%", background: "transparent", borderRadius: "100%", backgroundImage: `repeating-conic-gradient(
443
+ #fff8 0%,
444
+ transparent 0.0002%,
445
+ transparent 0.075%,
446
+ transparent 0.65%
447
+ ),
448
+ repeating-conic-gradient(
449
+ #fff 0%,
450
+ transparent 0.0004%,
451
+ transparent 0.05%,
452
+ transparent 0.495%
453
+ )`, transform: "translateZ(calc(var(--art-synthwave-starfield-size) * -0.4))", opacity: 0, animation: "art-synthwave-starfield-stars 4s ease-in -1s infinite", zIndex: 1, left: "-50%", top: "-50%" } }, ".art-synthwave-starfield-stars::after": { "@layer css-art": { animationName: "art-synthwave-starfield-stars2", animationDelay: "-2s" } }, ".art-synthwave-starfield-stars + .art-synthwave-starfield-stars::before": { "@layer css-art": { animationDelay: "-3s" } }, ".art-synthwave-starfield-stars + .art-synthwave-starfield-stars::after": { "@layer css-art": { animationDelay: "-4s" } }, ".art-synthwave-starfield.art-synthwave-starfield-paused *::before, \n .art-synthwave-starfield.art-synthwave-starfield-paused *::after": { "@layer css-art": { animationPlayState: "paused !important" } }, ".art-synthwave-starfield-sm": { "@layer css-art": { "--art-synthwave-starfield-size": "300px" } }, ".art-synthwave-starfield-lg": { "@layer css-art": { "--art-synthwave-starfield-size": "900px" } }, ".art-circular-gallery": { "@layer css-art": { "--art-circular-gallery-size": "600px", "--art-circular-gallery-radius": "calc(var(--art-circular-gallery-size) * 0.42)", "--art-circular-gallery-card-width": "calc(var(--art-circular-gallery-size) * 0.09)", "--art-circular-gallery-card-border-radius": "calc(var(--art-circular-gallery-size) * 0.012)", "--art-circular-gallery-arc-size": "0.95", "--art-circular-gallery-arc-center": "0.275", "--art-circular-gallery-arc-start": `calc(
454
+ var(--art-circular-gallery-arc-center) - var(--art-circular-gallery-arc-size) / 2
455
+ )`, "--art-circular-gallery-arc-shift-delta": "0.0075", "--art-circular-gallery-card-trans-duration": "1000ms", "--art-circular-gallery-card-trans-easing": `linear(
456
+ 0,
457
+ 0.01 0.8%,
458
+ 0.038 1.6%,
459
+ 0.154 3.4%,
460
+ 0.781 9.7%,
461
+ 1.01 12.5%,
462
+ 1.089 13.8%,
463
+ 1.153 15.2%,
464
+ 1.195 16.6%,
465
+ 1.219 18%,
466
+ 1.224 19.7%,
467
+ 1.208 21.6%,
468
+ 1.172 23.6%,
469
+ 1.057 28.6%,
470
+ 1.007 31.2%,
471
+ 0.969 34.1%,
472
+ 0.951 37.1%,
473
+ 0.953 40.9%,
474
+ 0.998 50.4%,
475
+ 1.011 56%,
476
+ 0.998 74.7%,
477
+ 1
478
+ )`, anchorName: "--art-circular-gallery-center", transform: "rotate(var(--art-circular-gallery-rotation))", transition: "transform 700ms linear", position: "relative", width: "var(--art-circular-gallery-size)", height: "var(--art-circular-gallery-size)", aspectRatio: "1", display: "grid", placeContent: "center", fontFamily: "sans-serif", h1: { margin: "0", textAlign: "center", fontSize: "clamp(1rem, calc(var(--art-circular-gallery-size) * 0.035), 2.5rem)", fontWeight: 300, letterSpacing: "0.05em", transform: "rotate(calc(var(--art-circular-gallery-rotation) * -1))" }, div: { "--arc-step": "calc(var(--art-circular-gallery-arc-size) / 19)", "--arc-shift": "calc(var(--art-circular-gallery-arc-shift-delta) * var(--d, 1))", "--card-offset-distance": `calc(
479
+ (
480
+ var(--art-circular-gallery-arc-start) + (var(--i) - 1) * var(--arc-step) +
481
+ var(--arc-shift)
482
+ ) * 100%
483
+ )`, "&:has(a:hover),\n &:target": { "--title-opacity": "1" }, "&:target": { "--zindex": "2", "--center-opacity": "1", "--center-scale": "1", "--image-outline-color": "rgba(255 255 255 / 0.5)" }, "&::before": { content: '""', position: "fixed", positionAnchor: "--art-circular-gallery-center", positionArea: "span-all", transform: "rotate(calc(var(--art-circular-gallery-rotation) * -1))", width: "calc(var(--art-circular-gallery-size) * 0.4)", aspectRatio: "1", borderRadius: "9in", background: "var(--bg-img)", boxSizing: "border-box", outline: "10px solid rgba(255 255 255 / 0.3)", outlineOffset: "-10px", backgroundSize: "cover", backgroundRepeat: "no-repeat", opacity: "var(--center-opacity, 0)", scale: "var(--center-scale, 0)", pointerEvents: "none", transitionProperty: "scale, opacity", transitionDuration: "300ms, 150ms" }, "&::after": { content: "attr(data-title)", position: "fixed", positionAnchor: "--art-circular-gallery-card", positionArea: "center span-all", zIndex: 2, pointerEvents: "none", opacity: "var(--title-opacity, 0)", transitionProperty: "opacity, transform", transitionDuration: "150ms", border: "1px solid rgb(255 255 255 / 0.75)", background: "rgb(0 0 0 / 0.25)", backdropFilter: "blur(3px)", padding: "0.25em 1em", borderRadius: "5px", fontSize: "clamp(0.55rem, calc(var(--art-circular-gallery-size) * 0.012), 0.85rem)", whiteSpace: "nowrap", "@starting-style": { opacity: 0 } }, a: { position: "absolute", display: "block", width: "var(--art-circular-gallery-card-width)", aspectRatio: "4 / 6", borderRadius: "var(--art-circular-gallery-card-border-radius)", border: "2px solid rgba(255 255 255 / 0.6)", offsetPath: "circle(var(--art-circular-gallery-radius) at 50% 50%)", offsetDistance: "var(--card-offset-distance)", offsetRotate: "auto", offsetAnchor: "50% 0%", transition: `offset var(--art-circular-gallery-card-trans-duration)
484
+ var(--art-circular-gallery-card-trans-easing),
485
+ scale 200ms ease`, zIndex: "var(--zindex, 1)", anchorName: "--art-circular-gallery-card", "&:hover": { scale: "2.5", zIndex: 3 }, img: { width: "100%", height: "100%", objectFit: "cover", display: "block", borderRadius: "inherit", outline: "5px solid var(--image-outline-color, transparent)", outlineOffset: "-5px", transition: "outline 300ms ease-in-out" } } } } }, ".art-circular-gallery:has(> *:hover) > *:hover + *, \n .art-circular-gallery:has(> :last-child:hover) > :nth-child(1)": { "@layer css-art": { "--d": "3" } }, ".art-circular-gallery:has(> *:hover) > *:hover + * + *, \n .art-circular-gallery:has(> :last-child:hover) > :nth-child(2), \n .art-circular-gallery:has(> :nth-last-child(2):hover) > :nth-child(1)": { "@layer css-art": { "--d": "2" } }, ".art-circular-gallery:has(> *:hover) > *:hover + * + * + *, \n .art-circular-gallery:has(> :last-child:hover) > :nth-child(3), \n .art-circular-gallery:has(> :nth-last-child(2):hover) > :nth-child(2), \n .art-circular-gallery:has(> :nth-last-child(3):hover) > :nth-child(1)": { "@layer css-art": { "--d": "1" } }, ".art-circular-gallery:has(> *:hover) > *:hover + * + * + * + *, \n .art-circular-gallery:has(> :last-child:hover) > :nth-child(4), \n .art-circular-gallery:has(> :nth-last-child(2):hover) > :nth-child(3), \n .art-circular-gallery:has(> :nth-last-child(3):hover) > :nth-child(2), \n .art-circular-gallery:has(> :nth-last-child(4):hover) > :nth-child(1)": { "@layer css-art": { "--d": "0.5" } }, ".art-circular-gallery *:has(+ *:hover), \n .art-circular-gallery:has(> :nth-child(1):hover) :nth-last-child(1)": { "@layer css-art": { "--d": "-3" } }, ".art-circular-gallery *:has(+ * + *:hover), \n .art-circular-gallery:has(> :nth-child(1):hover) :nth-last-child(2), \n .art-circular-gallery:has(> :nth-child(2):hover) :nth-last-child(1)": { "@layer css-art": { "--d": "-2" } }, ".art-circular-gallery *:has(+ * + * + *:hover), \n .art-circular-gallery:has(> :nth-child(1):hover) :nth-last-child(3), \n .art-circular-gallery:has(> :nth-child(2):hover) :nth-last-child(2), \n .art-circular-gallery:has(> :nth-child(3):hover) :nth-last-child(1)": { "@layer css-art": { "--d": "-1" } }, ".art-circular-gallery *:has(+ * + * + * + *:hover), \n .art-circular-gallery:has(> :nth-child(1):hover) :nth-last-child(4), \n .art-circular-gallery:has(> :nth-child(2):hover) :nth-last-child(3), \n .art-circular-gallery:has(> :nth-child(3):hover) :nth-last-child(2), \n .art-circular-gallery:has(> :nth-child(4):hover) :nth-last-child(1)": { "@layer css-art": { "--d": "-0.5" } }, ".art-circular-gallery-sm": { "@layer css-art": { "--art-circular-gallery-size": "400px" } }, ".art-circular-gallery-lg": { "@layer css-art": { "--art-circular-gallery-size": "800px" } }, "@keyframes art-flower-animation-moving-flower-1": { "0%, 100%": { transform: "rotate(3deg)" }, "50%": { transform: "rotate(0deg)" } }, "@keyframes art-flower-animation-moving-flower-2": { "0%, 100%": { transform: "rotate(20deg)" }, "50%": { transform: "rotate(23deg)" } }, "@keyframes art-flower-animation-moving-flower-3": { "0%, 100%": { transform: "rotate(-15deg)" }, "50%": { transform: "rotate(-18deg)" } }, "@keyframes art-flower-animation-blooming-leaf-right": { "0%": { transformOrigin: "left", transform: "rotate(70deg) rotateY(30deg) scaleX(0)" } }, "@keyframes art-flower-animation-blooming-leaf-left": { "0%": { transformOrigin: "right", transform: "rotate(-70deg) rotateY(30deg) scaleX(0)" } }, "@keyframes art-flower-animation-blooming-flower": { "0%": { transform: "scale(0)", opacity: 0 } }, "@keyframes art-flower-animation-light-ans": { "0%": { opacity: 0, transform: "translateY(0)" }, "25%": { opacity: 1 }, "100%": { opacity: 0, transform: "translateY(-15em) translateX(3em)" } }, "@keyframes art-flower-animation-grow-flower-tree": { "0%": { transform: "scaleY(0)", transformOrigin: "bottom center" } }, "@keyframes art-flower-animation-grow-ans": { "0%": { transform: "scaleY(0)", transformOrigin: "bottom center" } }, "@keyframes art-flower-animation-moving-grass": { "0%, 100%": { transform: "rotate(-48deg) rotateY(40deg)" }, "50%": { transform: "rotate(-50deg) rotateY(40deg)" } }, "@keyframes art-flower-animation-moving-grass--2": { "0%, 100%": { transform: "scale(0.5) rotate(75deg) rotateX(10deg) rotateY(-200deg)" }, "50%": { transform: "scale(0.5) rotate(80deg) rotateX(10deg) rotateY(-200deg)" } }, "@keyframes art-flower-animation-flower-g-long-ans": { "0%, 100%": { transform: "rotate(-30deg) rotateY(-20deg)" }, "50%": { transform: "rotate(-32deg) rotateY(-20deg)" } }, "@keyframes art-flower-animation-flower-g-right-ans": { "0%, 100%": { transform: "rotate(20deg)" }, "50%": { transform: "rotate(24deg) rotateX(-20deg)" } }, "@keyframes art-flower-animation-flower-g-right-ans--2": { "0%, 100%": { transform: "rotateY(-180deg) rotate(0deg) rotateX(-20deg)" }, "50%": { transform: "rotateY(-180deg) rotate(6deg) rotateX(-20deg)" } }, "@keyframes art-flower-animation-flower-g-front-ans": { "0%, 100%": { transform: "rotate(-28deg) rotateY(30deg) scale(1.04)" }, "50%": { transform: "rotate(-35deg) rotateY(40deg) scale(1.04)" } }, "@keyframes art-flower-animation-flower-g-front-leaf-ans": { "0%": { transform: "rotate(10deg) scale(0)" } }, "@keyframes art-flower-animation-flower-g-front-leaf-left-ans": { "0%": { transform: "rotateY(-180deg) rotate(5deg) scale(0)" } }, "@keyframes art-flower-animation-flower-g-front-leaf-left-ans-2": { "0%": { transform: "rotateY(-180deg) scale(0)" } }, "@keyframes art-flower-animation-flower-g-fr-ans": { "0%, 100%": { transform: "rotate(2deg)" }, "50%": { transform: "rotate(4deg)" } }, "@keyframes art-flower-animation-flower-g-fr-leaf-ans-1": { "0%": { transformOrigin: "left", transform: "rotate(45deg) scale(0)" } }, "@keyframes art-flower-animation-flower-g-fr-leaf-ans-5": { "0%": { transformOrigin: "left", transform: "rotate(55deg) scale(0)" } }, "@keyframes art-flower-animation-flower-g-fr-leaf-ans-6": { "0%": { transformOrigin: "right", transform: "rotate(25deg) rotateY(-180deg) scale(0)" } }, "@keyframes art-flower-animation-flower-g-fr-leaf-ans-7": { "0%": { transformOrigin: "left", transform: "rotate(45deg) scale(0)" } }, "@keyframes art-flower-animation-flower-g-fr-leaf-ans-8": { "0%": { transformOrigin: "right", transform: "rotate(15deg) rotateY(-180deg) scale(0)" } }, "@keyframes art-flower-animation-growing-grass-1": { "0%": { transformOrigin: "bottom left", transform: "rotate(-20deg) scale(0)" } }, "@keyframes art-flower-animation-growing-grass-2": { "0%": { transformOrigin: "bottom right", transform: "rotate(10deg) scale(0)" } }, "@keyframes art-flower-animation-growing-grass-3": { "0%": { transformOrigin: "bottom left", transform: "rotate(-18deg) rotateX(-20deg) scale(0)" } }, "@keyframes art-flower-animation-growing-grass-4": { "0%": { transformOrigin: "bottom right", transform: "rotate(2deg) scale(0)" } }, "@keyframes art-flower-animation-growing-grass-5": { "0%": { transformOrigin: "bottom left", transform: "rotate(-24deg) rotateX(-20deg) scale(0)" } }, "@keyframes art-flower-animation-growing-grass-6": { "0%": { transformOrigin: "bottom right", transform: "rotate(10deg) scale(0)" } }, "@keyframes art-flower-animation-growing-grass-7": { "0%": { transformOrigin: "bottom left", transform: "rotate(-10deg) scale(0)" } }, "@keyframes art-flower-animation-growing-grass-8": { "0%": { transformOrigin: "bottom right", transform: "rotate(10deg) scale(0)" } }, "@keyframes art-flower-animation-bubble": { "0%": { transform: "translateY(0) scale(0.3)", opacity: 0 }, "10%": { opacity: 1 }, "80%": { opacity: 0.6 }, "100%": { transform: "translateY(-70em) scale(1)", opacity: 0 } }, ".art-flower-animation": { "@layer css-art": { "--art-flower-animation-size": "600px", "--art-flower-animation-bg": "#010113", position: "relative", fontSize: "calc(var(--art-flower-animation-size) / 100)", width: "var(--art-flower-animation-size)", height: "calc(var(--art-flower-animation-size) * 1.1)", overflow: "hidden", backgroundColor: "var(--art-flower-animation-bg)", perspective: "1000px", display: "flex", alignItems: "flex-end", justifyContent: "center" } }, ".art-flower-animation-sm": { "@layer css-art": { "--art-flower-animation-size": "300px" } }, ".art-flower-animation-lg": { "@layer css-art": { "--art-flower-animation-size": "900px" } }, ".art-flower-animation .night": { "@layer css-art": { position: "absolute", left: "50%", top: "0", transform: "translateX(-50%)", width: "100%", height: "100%", filter: "blur(0.1em)", backgroundImage: `radial-gradient(ellipse at top, transparent 0%, var(--art-flower-animation-bg)),
486
+ radial-gradient(ellipse at bottom, var(--art-flower-animation-bg), rgba(145, 233, 255, 0.2)),
487
+ repeating-linear-gradient(220deg, rgb(0, 0, 0) 0px, rgb(0, 0, 0) 19px, transparent 19px, transparent 22px),
488
+ repeating-linear-gradient(189deg, rgb(0, 0, 0) 0px, rgb(0, 0, 0) 19px, transparent 19px, transparent 22px),
489
+ repeating-linear-gradient(148deg, rgb(0, 0, 0) 0px, rgb(0, 0, 0) 19px, transparent 19px, transparent 22px),
490
+ linear-gradient(90deg, rgb(255, 94, 0), rgb(240, 240, 240))` } }, ".art-flower-animation .flowers": { "@layer css-art": { position: "relative", transform: "scale(0.9)" } }, ".art-flower-animation .flower": { "@layer css-art": { position: "absolute", bottom: "10em", transformOrigin: "bottom center", zIndex: 10, "--fl-speed": "0.8s" } }, ".art-flower-animation .flower--1": { "@layer css-art": { animation: "art-flower-animation-moving-flower-1 4s linear infinite" } }, ".art-flower-animation .flower--1 .flower__line": { "@layer css-art": { height: "70em", animationDelay: "0.3s" } }, ".art-flower-animation .flower--1 .flower__line__leaf--1": { "@layer css-art": { animation: "art-flower-animation-blooming-leaf-right var(--fl-speed) 1.6s backwards" } }, ".art-flower-animation .flower--1 .flower__line__leaf--2": { "@layer css-art": { animation: "art-flower-animation-blooming-leaf-right var(--fl-speed) 1.4s backwards" } }, ".art-flower-animation .flower--1 .flower__line__leaf--3": { "@layer css-art": { animation: "art-flower-animation-blooming-leaf-left var(--fl-speed) 1.2s backwards" } }, ".art-flower-animation .flower--1 .flower__line__leaf--4": { "@layer css-art": { animation: "art-flower-animation-blooming-leaf-left var(--fl-speed) 1s backwards" } }, ".art-flower-animation .flower--1 .flower__line__leaf--5": { "@layer css-art": { animation: "art-flower-animation-blooming-leaf-right var(--fl-speed) 1.8s backwards" } }, ".art-flower-animation .flower--1 .flower__line__leaf--6": { "@layer css-art": { animation: "art-flower-animation-blooming-leaf-left var(--fl-speed) 2s backwards" } }, ".art-flower-animation .flower--2": { "@layer css-art": { left: "50%", transform: "rotate(20deg)", animation: "art-flower-animation-moving-flower-2 4s linear infinite" } }, ".art-flower-animation .flower--2 .flower__line": { "@layer css-art": { height: "60em", animationDelay: "0.6s" } }, ".art-flower-animation .flower--2 .flower__line__leaf--1": { "@layer css-art": { animation: "art-flower-animation-blooming-leaf-right var(--fl-speed) 1.9s backwards" } }, ".art-flower-animation .flower--2 .flower__line__leaf--2": { "@layer css-art": { animation: "art-flower-animation-blooming-leaf-right var(--fl-speed) 1.7s backwards" } }, ".art-flower-animation .flower--2 .flower__line__leaf--3": { "@layer css-art": { animation: "art-flower-animation-blooming-leaf-left var(--fl-speed) 1.5s backwards" } }, ".art-flower-animation .flower--2 .flower__line__leaf--4": { "@layer css-art": { animation: "art-flower-animation-blooming-leaf-left var(--fl-speed) 1.3s backwards" } }, ".art-flower-animation .flower--3": { "@layer css-art": { left: "50%", transform: "rotate(-15deg)", animation: "art-flower-animation-moving-flower-3 4s linear infinite" } }, ".art-flower-animation .flower--3 .flower__line": { "@layer css-art": { animationDelay: "0.9s" } }, ".art-flower-animation .flower--3 .flower__line__leaf--1": { "@layer css-art": { animation: "art-flower-animation-blooming-leaf-right var(--fl-speed) 2.5s backwards" } }, ".art-flower-animation .flower--3 .flower__line__leaf--2": { "@layer css-art": { animation: "art-flower-animation-blooming-leaf-right var(--fl-speed) 2.3s backwards" } }, ".art-flower-animation .flower--3 .flower__line__leaf--3": { "@layer css-art": { animation: "art-flower-animation-blooming-leaf-left var(--fl-speed) 2.1s backwards" } }, ".art-flower-animation .flower--3 .flower__line__leaf--4": { "@layer css-art": { animation: "art-flower-animation-blooming-leaf-left var(--fl-speed) 1.9s backwards" } }, ".art-flower-animation .flower--4": { "@layer css-art": { left: "-30%", transform: "rotate(-15deg) scaleX(-1)", animation: "art-flower-animation-moving-flower-3 4s linear infinite" } }, ".art-flower-animation .flower--4 .flower__line": { "@layer css-art": { animationDelay: "1.2s" } }, ".art-flower-animation .flower--4 .flower__line__leaf--1": { "@layer css-art": { animation: "art-flower-animation-blooming-leaf-right var(--fl-speed) 2.8s backwards" } }, ".art-flower-animation .flower--4 .flower__line__leaf--2": { "@layer css-art": { animation: "art-flower-animation-blooming-leaf-right var(--fl-speed) 2.6s backwards" } }, ".art-flower-animation .flower--4 .flower__line__leaf--3": { "@layer css-art": { animation: "art-flower-animation-blooming-leaf-left var(--fl-speed) 2.4s backwards" } }, ".art-flower-animation .flower--4 .flower__line__leaf--4": { "@layer css-art": { animation: "art-flower-animation-blooming-leaf-left var(--fl-speed) 2.2s backwards" } }, ".art-flower-animation .flower__leafs": { "@layer css-art": { position: "relative", animation: "art-flower-animation-blooming-flower 2s backwards" } }, ".art-flower-animation .flower__leafs--1": { "@layer css-art": { animationDelay: "1.1s" } }, ".art-flower-animation .flower__leafs--2": { "@layer css-art": { animationDelay: "1.4s" } }, ".art-flower-animation .flower__leafs--3": { "@layer css-art": { animationDelay: "1.7s" } }, ".art-flower-animation .flower__leafs::after": { "@layer css-art": { content: '""', position: "absolute", left: "0", top: "0", transform: "translate(-50%, -100%)", width: "8em", height: "8em", backgroundColor: "#e7b201", filter: "blur(10em)" } }, ".art-flower-animation .flower__leaf": { "@layer css-art": { position: "absolute", bottom: "0", left: "50%", width: "8em", height: "11em", borderRadius: "51% 49% 47% 53% / 44% 45% 55% 69%", backgroundColor: "#e6f331", backgroundImage: "linear-gradient(to top, #e6f331, #e6f331)", transformOrigin: "bottom center", opacity: 0.9, boxShadow: "inset 0 0 2em rgba(255, 255, 255, 0.5)" } }, ".art-flower-animation .flower__leaf--1": { "@layer css-art": { transform: "translate(-10%, 1%) rotateY(40deg) rotateX(-50deg)" } }, ".art-flower-animation .flower__leaf--2": { "@layer css-art": { transform: "translate(-50%, -4%) rotateX(40deg)" } }, ".art-flower-animation .flower__leaf--3": { "@layer css-art": { transform: "translate(-90%, 0%) rotateY(45deg) rotateX(50deg)" } }, ".art-flower-animation .flower__leaf--4": { "@layer css-art": { width: "8em", height: "8em", transformOrigin: "bottom left", borderRadius: "4em 10em 4em 4em", transform: "translate(0%, 18%) rotateX(70deg) rotate(-43deg)", backgroundImage: "linear-gradient(to top, #e6f331, #e6f331)", zIndex: 1, opacity: 0.8 } }, ".art-flower-animation .flower__white-circle": { "@layer css-art": { position: "absolute", left: "-3.5em", top: "-3em", width: "9em", height: "4em", borderRadius: "50%", backgroundColor: "#fff" } }, ".art-flower-animation .flower__white-circle::after": { "@layer css-art": { content: '""', position: "absolute", left: "50%", top: "45%", transform: "translate(-50%, -50%)", width: "60%", height: "60%", borderRadius: "inherit", backgroundImage: `repeating-linear-gradient(135deg, rgba(0,0,0,0.03) 0px, rgba(0,0,0,0.03) 1px, transparent 1px, transparent 12px),
491
+ repeating-linear-gradient(45deg, rgba(0,0,0,0.03) 0px, rgba(0,0,0,0.03) 1px, transparent 1px, transparent 12px),
492
+ repeating-linear-gradient(67.5deg, rgba(0,0,0,0.03) 0px, rgba(0,0,0,0.03) 1px, transparent 1px, transparent 12px),
493
+ repeating-linear-gradient(112.5deg, rgba(0,0,0,0.03) 0px, rgba(0,0,0,0.03) 1px, transparent 1px, transparent 12px),
494
+ repeating-linear-gradient(157.5deg, rgba(0,0,0,0.03) 0px, rgba(0,0,0,0.03) 1px, transparent 1px, transparent 12px),
495
+ repeating-linear-gradient(22.5deg, rgba(0,0,0,0.03) 0px, rgba(0,0,0,0.03) 1px, transparent 1px, transparent 12px),
496
+ linear-gradient(90deg, rgb(255, 235, 18), rgb(255, 206, 0))` } }, ".art-flower-animation .flower__line": { "@layer css-art": { height: "55em", width: "1.5em", backgroundImage: `linear-gradient(to left, rgba(0,0,0,0.2), transparent, rgba(255,255,255,0.2)),
497
+ linear-gradient(to top, transparent 10%, #056d24, #028137)`, boxShadow: "inset 0 0 2px rgba(0, 0, 0, 0.5)", animation: "art-flower-animation-grow-flower-tree 4s backwards" } }, ".art-flower-animation .flower__line__leaf": { "@layer css-art": { "--w": "7em", "--h": "calc(var(--w) + 2em)", position: "absolute", top: "20%", left: "90%", width: "var(--w)", height: "var(--h)", borderTopRightRadius: "var(--h)", borderBottomLeftRadius: "var(--h)", backgroundImage: "linear-gradient(to top, rgba(12, 94, 32, 0.4), #028137)" } }, ".art-flower-animation .flower__line__leaf--1": { "@layer css-art": { transform: "rotate(70deg) rotateY(30deg)" } }, ".art-flower-animation .flower__line__leaf--2": { "@layer css-art": { top: "45%", transform: "rotate(70deg) rotateY(30deg)" } }, ".art-flower-animation .flower__line__leaf--3, \n .art-flower-animation .flower__line__leaf--4, \n .art-flower-animation .flower__line__leaf--6": { "@layer css-art": { borderTopRightRadius: "0", borderBottomLeftRadius: "0", borderTopLeftRadius: "var(--h)", borderBottomRightRadius: "var(--h)", left: "-460%", top: "12%", transform: "rotate(-70deg) rotateY(30deg)" } }, ".art-flower-animation .flower__line__leaf--4": { "@layer css-art": { top: "40%" } }, ".art-flower-animation .flower__line__leaf--5": { "@layer css-art": { top: "0", transformOrigin: "left", transform: "rotate(70deg) rotateY(30deg) scale(0.6)" } }, ".art-flower-animation .flower__line__leaf--6": { "@layer css-art": { top: "-2%", left: "-450%", transformOrigin: "right", transform: "rotate(-70deg) rotateY(30deg) scale(0.6)" } }, ".art-flower-animation .flower__light": { "@layer css-art": { position: "absolute", bottom: "0", width: "1em", height: "1em", backgroundColor: "rgb(255, 251, 0)", borderRadius: "50%", filter: "blur(0.2em)", animation: "art-flower-animation-light-ans 4s linear infinite backwards" } }, ".art-flower-animation .flower__light:nth-child(odd)": { "@layer css-art": { backgroundColor: "#028137" } }, ".art-flower-animation .flower__light--1": { "@layer css-art": { left: "-2em", animationDelay: "1s" } }, ".art-flower-animation .flower__light--2": { "@layer css-art": { left: "3em", animationDelay: "0.5s" } }, ".art-flower-animation .flower__light--3": { "@layer css-art": { left: "-6em", animationDelay: "0.3s" } }, ".art-flower-animation .flower__light--4": { "@layer css-art": { left: "6em", animationDelay: "0.9s" } }, ".art-flower-animation .flower__light--5": { "@layer css-art": { left: "-1em", animationDelay: "1.5s" } }, ".art-flower-animation .flower__light--6": { "@layer css-art": { left: "-4em", animationDelay: "3s" } }, ".art-flower-animation .flower__light--7": { "@layer css-art": { left: "3em", animationDelay: "2s" } }, ".art-flower-animation .flower__light--8": { "@layer css-art": { left: "-6em", animationDelay: "3.5s" } }, ".art-flower-animation .flower__grass": { "@layer css-art": { "--c": "#028137", "--line-w": "1.5em", position: "absolute", bottom: "12em", left: "-7em", display: "flex", flexDirection: "column", alignItems: "flex-end", zIndex: 20, transformOrigin: "bottom center", transform: "rotate(-48deg) rotateY(40deg)" } }, ".art-flower-animation .flower__grass--1": { "@layer css-art": { animation: "art-flower-animation-moving-grass 2s linear infinite" } }, ".art-flower-animation .flower__grass--2": { "@layer css-art": { left: "2em", bottom: "10em", transform: "scale(0.5) rotate(75deg) rotateX(10deg) rotateY(-200deg)", opacity: 0.8, zIndex: 0, animation: "art-flower-animation-moving-grass--2 1.5s linear infinite" } }, ".art-flower-animation .flower__grass--top": { "@layer css-art": { width: "7em", height: "10em", borderTopRightRadius: "100%", borderRight: "var(--line-w) solid var(--c)", transformOrigin: "bottom center", transform: "rotate(-2deg)" } }, ".art-flower-animation .flower__grass--bottom": { "@layer css-art": { marginTop: "-2px", width: "var(--line-w)", height: "25em", backgroundImage: "linear-gradient(to top, transparent, var(--c))" } }, ".art-flower-animation .flower__grass__leaf": { "@layer css-art": { "--size": "10em", position: "absolute", width: "calc(var(--size) * 2.1)", height: "var(--size)", borderTopLeftRadius: "var(--size)", borderTopRightRadius: "var(--size)", backgroundImage: "linear-gradient(to top, transparent, transparent 30%, var(--c))", zIndex: 100 } }, ".art-flower-animation .flower__grass__leaf--1": { "@layer css-art": { top: "-6%", left: "30%", "--size": "6em", transform: "rotate(-20deg)", animation: "art-flower-animation-growing-grass-1 2s 2.6s backwards" } }, ".art-flower-animation .flower__grass__leaf--2": { "@layer css-art": { top: "-5%", left: "-110%", "--size": "6em", transform: "rotate(10deg)", animation: "art-flower-animation-growing-grass-2 2s 2.4s linear backwards" } }, ".art-flower-animation .flower__grass__leaf--3": { "@layer css-art": { top: "5%", left: "60%", "--size": "8em", transform: "rotate(-18deg) rotateX(-20deg)", animation: "art-flower-animation-growing-grass-3 2s 2.2s linear backwards" } }, ".art-flower-animation .flower__grass__leaf--4": { "@layer css-art": { top: "6%", left: "-135%", "--size": "8em", transform: "rotate(2deg)", animation: "art-flower-animation-growing-grass-4 2s 2s linear backwards" } }, ".art-flower-animation .flower__grass__leaf--5": { "@layer css-art": { top: "20%", left: "60%", "--size": "10em", transform: "rotate(-24deg) rotateX(-20deg)", animation: "art-flower-animation-growing-grass-5 2s 1.8s linear backwards" } }, ".art-flower-animation .flower__grass__leaf--6": { "@layer css-art": { top: "22%", left: "-180%", "--size": "10em", transform: "rotate(10deg)", animation: "art-flower-animation-growing-grass-6 2s 1.6s linear backwards" } }, ".art-flower-animation .flower__grass__leaf--7": { "@layer css-art": { top: "39%", left: "70%", "--size": "10em", transform: "rotate(-10deg)", animation: "art-flower-animation-growing-grass-7 2s 1.4s linear backwards" } }, ".art-flower-animation .flower__grass__leaf--8": { "@layer css-art": { top: "40%", left: "-215%", "--size": "11em", transform: "rotate(10deg)", animation: "art-flower-animation-growing-grass-8 2s 1.2s linear backwards" } }, ".art-flower-animation .flower__grass__overlay": { "@layer css-art": { position: "absolute", top: "-10%", right: "0%", width: "100%", height: "100%", backgroundColor: "rgba(0, 0, 0, 0.6)", filter: "blur(1.5em)", zIndex: 100 } }, ".art-flower-animation .flower__g-long": { "@layer css-art": { "--w": "2em", "--h": "6em", "--c": "#0d6632", position: "absolute", bottom: "10em", left: "-3em", transformOrigin: "bottom center", transform: "rotate(-30deg) rotateY(-20deg)", display: "flex", flexDirection: "column", alignItems: "flex-end", animation: "art-flower-animation-flower-g-long-ans 3s linear infinite" } }, ".art-flower-animation .flower__g-long__top": { "@layer css-art": { width: "calc(var(--w) + 1em)", height: "var(--h)", borderTopRightRadius: "100%", borderRight: "0.7em solid var(--c)", transform: "translate(-0.7em, 1em)" } }, ".art-flower-animation .flower__g-long__bottom": { "@layer css-art": { width: "var(--w)", height: "50em", transformOrigin: "bottom center", backgroundImage: "linear-gradient(to top, transparent 30%, var(--c))", boxShadow: "inset 0 0 2px rgba(0, 0, 0, 0.5)", clipPath: "polygon(35% 0, 65% 1%, 100% 100%, 0% 100%)" } }, ".art-flower-animation .flower__g-right": { "@layer css-art": { position: "absolute", bottom: "6em", left: "-2em", transformOrigin: "bottom left", transform: "rotate(20deg)" } }, ".art-flower-animation .flower__g-right .leaf": { "@layer css-art": { width: "30em", height: "50em", borderTopLeftRadius: "100%", borderLeft: "2em solid #028137", backgroundImage: "linear-gradient(to bottom, transparent, var(--art-flower-animation-bg) 60%)", WebkitMaskImage: "linear-gradient(to top, transparent 30%, #028137 60%)", maskImage: "linear-gradient(to top, transparent 30%, #028137 60%)" } }, ".art-flower-animation .flower__g-right--1": { "@layer css-art": { animation: "art-flower-animation-flower-g-right-ans 2.5s linear infinite" } }, ".art-flower-animation .flower__g-right--2": { "@layer css-art": { left: "5em", transform: "rotateY(-180deg)", animation: "art-flower-animation-flower-g-right-ans--2 3s linear infinite" } }, ".art-flower-animation .flower__g-right--2 .leaf": { "@layer css-art": { height: "75em", filter: "blur(0.3em)", opacity: 0.8 } }, ".art-flower-animation .flower__g-front": { "@layer css-art": { position: "absolute", bottom: "6em", left: "2.5em", zIndex: 100, transformOrigin: "bottom center", transform: "rotate(-28deg) rotateY(30deg) scale(1.04)", animation: "art-flower-animation-flower-g-front-ans 2s linear infinite" } }, ".art-flower-animation .flower__g-front__line": { "@layer css-art": { width: "0.3em", height: "20em", backgroundImage: "linear-gradient(to top, transparent, #028137, transparent 100%)", position: "relative" } }, ".art-flower-animation .flower__g-front__leaf-wrapper": { "@layer css-art": { position: "absolute", top: "0", left: "0", transformOrigin: "bottom left", transform: "rotate(10deg)" } }, ".art-flower-animation .flower__g-front__leaf-wrapper:nth-child(even)": { "@layer css-art": { left: "0", transform: "rotateY(-180deg) rotate(5deg)", animation: "art-flower-animation-flower-g-front-leaf-left-ans 1s ease-in backwards" } }, ".art-flower-animation .flower__g-front__leaf-wrapper:nth-child(odd)": { "@layer css-art": { animation: "art-flower-animation-flower-g-front-leaf-ans 1s ease-in backwards" } }, ".art-flower-animation .flower__g-front__leaf-wrapper--1": { "@layer css-art": { top: "-8em", transform: "scale(0.7)", animation: "art-flower-animation-flower-g-front-leaf-ans 1s 5.5s ease-in backwards !important" } }, ".art-flower-animation .flower__g-front__leaf-wrapper--2": { "@layer css-art": { top: "-8em", transform: "rotateY(-180deg) scale(0.7) !important", animation: "art-flower-animation-flower-g-front-leaf-left-ans-2 1s 5.2s ease-in backwards !important" } }, ".art-flower-animation .flower__g-front__leaf-wrapper--3": { "@layer css-art": { top: "-3em", animation: "art-flower-animation-flower-g-front-leaf-ans 1s 4.9s ease-in backwards !important" } }, ".art-flower-animation .flower__g-front__leaf-wrapper--4": { "@layer css-art": { top: "-3em", transform: "rotateY(-180deg) scale(0.9) !important", animation: "art-flower-animation-flower-g-front-leaf-left-ans-2 1s 4.6s ease-in backwards !important" } }, ".art-flower-animation .flower__g-front__leaf-wrapper--5, \n .art-flower-animation .flower__g-front__leaf-wrapper--6": { "@layer css-art": { top: "2em" } }, ".art-flower-animation .flower__g-front__leaf-wrapper--7, \n .art-flower-animation .flower__g-front__leaf-wrapper--8": { "@layer css-art": { top: "6.5em" } }, ".art-flower-animation .flower__g-front__leaf-wrapper--5": { "@layer css-art": { animationDelay: "4.3s !important" } }, ".art-flower-animation .flower__g-front__leaf-wrapper--6": { "@layer css-art": { animationDelay: "4.1s !important" } }, ".art-flower-animation .flower__g-front__leaf-wrapper--7": { "@layer css-art": { animationDelay: "3.8s !important" } }, ".art-flower-animation .flower__g-front__leaf-wrapper--8": { "@layer css-art": { animationDelay: "3.5s !important" } }, ".art-flower-animation .flower__g-front__leaf": { "@layer css-art": { width: "10em", height: "10em", borderRadius: "100% 0% 0% 100% / 100% 100% 0% 0%", boxShadow: "inset 0 2px 1em hsla(150, 97%, 14%, 0.2)", backgroundImage: `linear-gradient(to bottom left, transparent, var(--art-flower-animation-bg)),
498
+ linear-gradient(to bottom right, #028137 50%, transparent 50%, transparent)`, WebkitMaskImage: "linear-gradient(to bottom right, #028137 50%, transparent 50%, transparent)", maskImage: "linear-gradient(to bottom right, #028137 50%, transparent 50%, transparent)" } }, ".art-flower-animation .flower__g-fr": { "@layer css-art": { position: "absolute", bottom: "-4em", left: "0", transformOrigin: "bottom left", zIndex: 10, animation: "art-flower-animation-flower-g-fr-ans 2s linear infinite" } }, ".art-flower-animation .flower__g-fr .leaf": { "@layer css-art": { width: "30em", height: "50em", borderTopLeftRadius: "100%", borderLeft: "2em solid #028137", WebkitMaskImage: "linear-gradient(to top, transparent 25%, #028137 50%)", maskImage: "linear-gradient(to top, transparent 25%, #028137 50%)", position: "relative", zIndex: 1 } }, ".art-flower-animation .flower__g-fr__leaf": { "@layer css-art": { position: "absolute", top: "0", left: "0", width: "10em", height: "10em", borderRadius: "100% 0% 0% 100% / 100% 100% 0% 0%", boxShadow: "inset 0 2px 1em hsla(184deg, 97%, 58%, 0.2)", backgroundImage: `linear-gradient(to bottom left, transparent, var(--art-flower-animation-bg) 98%),
499
+ linear-gradient(to bottom right, #028137 45%, transparent 50%, transparent)`, WebkitMaskImage: "linear-gradient(135deg, #028137 40%, transparent 50%, transparent)", maskImage: "linear-gradient(135deg, #028137 40%, transparent 50%, transparent)" } }, ".art-flower-animation .flower__g-fr__leaf--1": { "@layer css-art": { left: "20em", transform: "rotate(45deg)", animation: "art-flower-animation-flower-g-fr-leaf-ans-1 0.5s 5.2s linear backwards" } }, ".art-flower-animation .flower__g-fr__leaf--2": { "@layer css-art": { left: "12em", top: "-7em", transform: "rotate(25deg) rotateY(-180deg)", animation: "art-flower-animation-flower-g-fr-leaf-ans-6 0.5s 5s linear backwards" } }, ".art-flower-animation .flower__g-fr__leaf--3": { "@layer css-art": { left: "15em", top: "6em", transform: "rotate(55deg)", animation: "art-flower-animation-flower-g-fr-leaf-ans-5 0.5s 4.8s linear backwards" } }, ".art-flower-animation .flower__g-fr__leaf--4": { "@layer css-art": { left: "6em", top: "-2em", transform: "rotate(25deg) rotateY(-180deg)", animation: "art-flower-animation-flower-g-fr-leaf-ans-6 0.5s 4.6s linear backwards" } }, ".art-flower-animation .flower__g-fr__leaf--5": { "@layer css-art": { left: "10em", top: "14em", transform: "rotate(55deg)", animation: "art-flower-animation-flower-g-fr-leaf-ans-5 0.5s 4.4s linear backwards" } }, ".art-flower-animation .flower__g-fr__leaf--6": { "@layer css-art": { left: "0", top: "6em", transform: "rotate(25deg) rotateY(-180deg)", animation: "art-flower-animation-flower-g-fr-leaf-ans-6 0.5s 4.2s linear backwards" } }, ".art-flower-animation .flower__g-fr__leaf--7": { "@layer css-art": { left: "5em", top: "22em", transform: "rotate(45deg)", animation: "art-flower-animation-flower-g-fr-leaf-ans-7 0.5s 4s linear backwards" } }, ".art-flower-animation .flower__g-fr__leaf--8": { "@layer css-art": { left: "-4em", top: "15em", transform: "rotate(15deg) rotateY(-180deg)", animation: "art-flower-animation-flower-g-fr-leaf-ans-8 0.5s 3.8s linear backwards" } }, ".art-flower-animation .long-g": { "@layer css-art": { position: "absolute", bottom: "25em", left: "-42em", transformOrigin: "bottom left" } }, ".art-flower-animation .long-g .leaf": { "@layer css-art": { "--w": "3em", "--h": "40em", position: "absolute", bottom: "0", left: "0", width: "var(--w)", backgroundImage: "linear-gradient(to top, transparent 10%, #056d24 60%, #028137)", clipPath: "polygon(50% 0%, 100% 100%, 0% 100%)", transformOrigin: "bottom center", height: "var(--h)" } }, ".art-flower-animation .long-g .leaf--0": { "@layer css-art": { "--h": "40em", transform: "rotate(-5deg) rotateX(5deg)" } }, ".art-flower-animation .long-g .leaf--1": { "@layer css-art": { "--h": "45em", left: "2em", transform: "rotate(3deg) rotateX(5deg)" } }, ".art-flower-animation .long-g .leaf--2": { "@layer css-art": { "--h": "38em", left: "1em", transform: "rotate(-8deg) rotateX(5deg)" } }, ".art-flower-animation .long-g .leaf--3": { "@layer css-art": { "--h": "35em", left: "3em", transform: "rotate(6deg) rotateX(5deg)" } }, ".art-flower-animation .long-g--1": { "@layer css-art": { bottom: "0", transform: "scale(0.8) rotate(-5deg)" } }, ".art-flower-animation .long-g--1 .leaf": { "@layer css-art": { WebkitMaskImage: "linear-gradient(to top, transparent 40%, #028137 80%) !important", maskImage: "linear-gradient(to top, transparent 40%, #028137 80%) !important" } }, ".art-flower-animation .long-g--1 .leaf--1": { "@layer css-art": { "--w": "5em", "--h": "60em", left: "-2em", transform: "rotate(3deg) rotateY(-180deg)" } }, ".art-flower-animation .long-g--2": { "@layer css-art": { bottom: "-3em", left: "-35em", transform: "rotate(3deg)" } }, ".art-flower-animation .long-g--3": { "@layer css-art": { bottom: "-3em", left: "-25em", transform: "rotate(0deg)" } }, ".art-flower-animation .long-g--4": { "@layer css-art": { bottom: "0", left: "-23em", transform: "rotate(-3deg)" } }, ".art-flower-animation .long-g--5": { "@layer css-art": { bottom: "-3em", left: "-17em", transform: "scale(0.8) rotate(-5deg)" } }, ".art-flower-animation .long-g--6": { "@layer css-art": { bottom: "0", left: "-12em", transform: "rotate(-4deg)" } }, ".art-flower-animation .long-g--7": { "@layer css-art": { bottom: "0", left: "-5em", transform: "rotate(2deg)" } }, ".art-flower-animation .grow-ans": { "@layer css-art": { animation: "art-flower-animation-grow-ans 2s var(--d, 0s) backwards" } }, ".art-flower-animation .growing-grass": { "@layer css-art": { position: "absolute", bottom: "0" } }, ".art-flower-animation .bubbles": { "@layer css-art": { position: "absolute", bottom: "10em", left: "50%", transform: "translateX(-50%)", width: "40em", height: "0", zIndex: 20 } }, ".art-flower-animation .bubble": { "@layer css-art": { position: "absolute", bottom: "0", animation: "art-flower-animation-bubble 8s ease-in infinite", opacity: 0 } }, ".art-flower-animation .bubble .heart": { "@layer css-art": { width: "2em", height: "2em", fill: "rgba(255, 100, 150, 0.8)", filter: "drop-shadow(0 0 0.5em rgba(255, 100, 150, 0.5))" } }, ".art-flower-animation .bubble:nth-child(1)": { "@layer css-art": { left: "5%", animationDelay: "0s", animationDuration: "7s" } }, ".art-flower-animation .bubble:nth-child(2)": { "@layer css-art": { left: "10%", animationDelay: "0.5s", animationDuration: "8s" } }, ".art-flower-animation .bubble:nth-child(3)": { "@layer css-art": { left: "20%", animationDelay: "1s", animationDuration: "6.5s" } }, ".art-flower-animation .bubble:nth-child(4)": { "@layer css-art": { left: "30%", animationDelay: "1.5s", animationDuration: "9s" } }, ".art-flower-animation .bubble:nth-child(5)": { "@layer css-art": { left: "40%", animationDelay: "2s", animationDuration: "7.5s" } }, ".art-flower-animation .bubble:nth-child(6)": { "@layer css-art": { left: "50%", animationDelay: "2.5s", animationDuration: "8.5s" } }, ".art-flower-animation .bubble:nth-child(7)": { "@layer css-art": { left: "60%", animationDelay: "3s", animationDuration: "7s" } }, ".art-flower-animation .bubble:nth-child(8)": { "@layer css-art": { left: "70%", animationDelay: "3.5s", animationDuration: "9.5s" } }, ".art-flower-animation .bubble:nth-child(9)": { "@layer css-art": { left: "75%", animationDelay: "4s", animationDuration: "6s" } }, ".art-flower-animation .bubble:nth-child(10)": { "@layer css-art": { left: "80%", animationDelay: "4.5s", animationDuration: "8s" } }, ".art-flower-animation .bubble:nth-child(11)": { "@layer css-art": { left: "15%", animationDelay: "5s", animationDuration: "7.5s" } }, ".art-flower-animation .bubble:nth-child(12)": { "@layer css-art": { left: "25%", animationDelay: "5.5s", animationDuration: "9s" } }, ".art-flower-animation .bubble:nth-child(13)": { "@layer css-art": { left: "35%", animationDelay: "6s", animationDuration: "8s" } }, ".art-flower-animation .bubble:nth-child(14)": { "@layer css-art": { left: "45%", animationDelay: "6.5s", animationDuration: "7s" } }, ".art-flower-animation .bubble:nth-child(15)": { "@layer css-art": { left: "55%", animationDelay: "0.3s", animationDuration: "9.5s" } }, ".art-flower-animation .bubble:nth-child(16)": { "@layer css-art": { left: "65%", animationDelay: "1.3s", animationDuration: "6.5s" } }, ".art-flower-animation .bubble:nth-child(17)": { "@layer css-art": { left: "72%", animationDelay: "2.2s", animationDuration: "8.5s" } }, ".art-flower-animation .bubble:nth-child(18)": { "@layer css-art": { left: "8%", animationDelay: "3.3s", animationDuration: "7.5s" } }, ".art-flower-animation .bubble:nth-child(19)": { "@layer css-art": { left: "88%", animationDelay: "4.2s", animationDuration: "9s" } }, ".art-flower-animation .bubble:nth-child(20)": { "@layer css-art": { left: "93%", animationDelay: "5.8s", animationDuration: "6s" } }, "@keyframes art-gemini-input-rotate": { to: { "--art-gemini-input-rotation": "360deg" } }, ".art-gemini-input": { "@layer css-art": { "--art-gemini-input-width": "450px", "--art-gemini-input-border-size": "4px", "--art-gemini-input-gradient": `conic-gradient(
500
+ from var(--art-gemini-input-rotation) at 52% 49% in oklab,
501
+ oklch(0.63 0.2 251.22) 27%,
502
+ oklch(0.67 0.21 25.81) 33%,
503
+ oklch(0.9 0.19 93.93) 41%,
504
+ oklch(0.79 0.25 150.49) 49%,
505
+ oklch(0.63 0.2 251.22) 65%,
506
+ oklch(0.72 0.21 150.89) 93%,
507
+ oklch(0.63 0.2 251.22)
508
+ )`, colorScheme: "light dark", position: "relative", width: "var(--art-gemini-input-width)", animation: "art-gemini-input-rotate 5s infinite linear", borderRadius: "4rem", background: "none", padding: "0", border: "var(--art-gemini-input-border-size) solid lightgray", "&::after": { content: "''", position: "absolute", display: "block", width: "100%", height: "100%", background: "var(--art-gemini-input-gradient)", top: "50%", left: "50%", translate: "-50% -50%", zIndex: 1, animation: "art-gemini-input-rotate 5s infinite linear", filter: "blur(15px)" }, "& .art-gemini-input-inner": { background: "light-dark(white, #1a1c1e)", color: "light-dark(#222, hsl(210, 8%, 66%))", padding: "0.75rem 0.5rem", position: "relative", zIndex: 3, borderRadius: "inherit", display: "grid", gridTemplateColumns: "auto 1fr auto", alignItems: "end", gap: "0.75rem" }, "& .art-gemini-input-border": { position: "absolute", inset: "calc(var(--art-gemini-input-border-size) * -1)", mask: "linear-gradient(white)", borderRadius: "inherit", overflow: "hidden", zIndex: 2, "&::after": { content: "''", position: "absolute", width: "100%", height: "100%", background: "var(--art-gemini-input-gradient)", top: "50%", left: "50%", translate: "-50% -50%", animation: "art-gemini-input-rotate 5s infinite linear", filter: "blur(5px)" } }, "& .art-gemini-input-btn": { color: "light-dark(#222, hsl(210, 8%, 66%))", background: "none", border: "none", cursor: "pointer", padding: "0", lineHeight: 1, fontSize: "1.25rem", display: "inline-flex", alignItems: "center", justifyContent: "center", userSelect: "none" }, "& .art-gemini-input-field": { color: "light-dark(#222, hsl(210, 8%, 66%))", background: "none", border: "none", cursor: "text", fontSize: "1rem", fontFamily: "system-ui", fontWeight: 300, lineHeight: 1.5, width: "100%", resize: "none", fieldSizing: "content", minHeight: "1.5em", maxHeight: "8rem", overflowY: "auto", "&:focus,\n &:focus-visible": { outline: "none !important" }, "&:not(:placeholder-shown)": { color: "light-dark(black, white)" } } } }, ".art-gemini-input-sm": { "@layer css-art": { "--art-gemini-input-width": "280px" } }, ".art-gemini-input-lg": { "@layer css-art": { "--art-gemini-input-width": "640px" } }, "@keyframes art-snowball-preloader-ball": { from: { transform: "rotate(0) translateY(-6.5em)" }, "50%": { transform: "rotate(180deg) translateY(-6em)" }, to: { transform: "rotate(360deg) translateY(-6.5em)" } }, "@keyframes art-snowball-preloader-inner-shadow": { from: { transform: "rotate(0)" }, to: { transform: "rotate(-360deg)" } }, "@keyframes art-snowball-preloader-outer-shadow": { from: { transform: "rotate(20deg)" }, to: { transform: "rotate(-340deg)" } }, "@keyframes art-snowball-preloader-texture": { from: { transform: "translateX(0)" }, to: { transform: "translateX(50%)" } }, "@keyframes art-snowball-preloader-track-cover": { from: { transform: "rotate(0)" }, to: { transform: "rotate(360deg)" } }, ".art-snowball-preloader": { "@layer css-art": { "--art-snowball-preloader-size": "256px", "--art-snowball-preloader-bg": "hsl(223, 90%, 95%)", fontSize: "calc(var(--art-snowball-preloader-size) / 16)", position: "relative", width: "16em", height: "16em", backgroundColor: "var(--art-snowball-preloader-bg)", "*, *::before, *::after": { boxSizing: "border-box", border: "0", margin: "0", padding: "0" }, ".art-snowball-preloader-outer-ring,\n .art-snowball-preloader-inner-ring,\n .art-snowball-preloader-track-cover,\n .art-snowball-preloader-ball,\n .art-snowball-preloader-ball-inner-shadow,\n .art-snowball-preloader-ball-side-shadows,\n .art-snowball-preloader-ball-texture": { borderRadius: "50%" }, ".art-snowball-preloader-outer-ring,\n .art-snowball-preloader-inner-ring,\n .art-snowball-preloader-track-cover,\n .art-snowball-preloader-ball,\n .art-snowball-preloader-ball-inner-shadow,\n .art-snowball-preloader-ball-outer-shadow,\n .art-snowball-preloader-ball-side-shadows,\n .art-snowball-preloader-ball-texture,\n .art-snowball-preloader-ball-texture::before": { position: "absolute" }, ".art-snowball-preloader-ball": { animation: "art-snowball-preloader-ball 3s linear infinite", top: "calc(50% - 1.25em)", left: "calc(50% - 1.25em)", transform: "rotate(0) translateY(-6.5em)", width: "2.5em", height: "2.5em" }, ".art-snowball-preloader-ball-inner-shadow": { animation: "art-snowball-preloader-inner-shadow 3s linear infinite", boxShadow: `0 0.1em 0.2em hsla(0, 0%, 0%, 0.3),
509
+ 0 0 0.2em hsla(0, 0%, 0%, 0.1) inset,
510
+ 0 -1em 0.5em hsla(0, 0%, 0%, 0.15) inset`, width: "100%", height: "100%" }, ".art-snowball-preloader-ball-outer-shadow": { animation: "art-snowball-preloader-outer-shadow 3s linear infinite", backgroundImage: "linear-gradient(hsla(0, 0%, 0%, 0.15), hsla(0, 0%, 0%, 0))", borderRadius: "0 0 50% 50% / 0 0 100% 100%", filter: "blur(2px)", top: "50%", left: "0", width: "100%", height: "250%", transform: "rotate(20deg)", transformOrigin: "50% 0", zIndex: -2 }, ".art-snowball-preloader-ball-side-shadows": { backgroundColor: "hsla(0, 0%, 0%, 0.1)", filter: "blur(2px)", width: "100%", height: "100%", transform: "scale(0.75, 1.1)", zIndex: -1 }, ".art-snowball-preloader-ball-texture": { overflow: "hidden", width: "100%", height: "100%", transform: "translate3d(0, 0, 0)", "&::before": { animation: "art-snowball-preloader-texture 0.25s linear infinite", background: "url(https://assets.codepen.io/416221/snow.jpg) 0 0 / 50% 100%", content: '""', display: "block", filter: "brightness(1.05)", top: "0", right: "0", width: "200%", height: "100%" } }, ".art-snowball-preloader-inner-ring": { boxShadow: `0 -0.25em 0.5em hsla(0, 0%, 100%, 0.4),
511
+ 0 0.5em 0.75em hsla(0, 0%, 100%, 0.4) inset,
512
+ 0 0.5em 0.375em hsla(0, 0%, 0%, 0.15),
513
+ 0 -0.5em 0.75em hsla(0, 0%, 0%, 0.15) inset`, top: "2.375em", left: "2.375em", width: "calc(100% - 4.75em)", height: "calc(100% - 4.75em)" }, ".art-snowball-preloader-outer-ring": { boxShadow: `0 -0.45em 0.375em hsla(0, 0%, 0%, 0.15),
514
+ 0 0.5em 0.75em hsla(0, 0%, 0%, 0.15) inset,
515
+ 0 0.25em 0.5em hsla(0, 0%, 100%, 0.4),
516
+ 0 -0.5em 0.75em hsla(0, 0%, 100%, 0.4) inset`, top: "0.75em", left: "0.75em", width: "calc(100% - 1.5em)", height: "calc(100% - 1.5em)" }, ".art-snowball-preloader-track-cover": { animation: "art-snowball-preloader-track-cover 3s linear infinite", backgroundImage: `conic-gradient(
517
+ var(--art-snowball-preloader-bg) 210deg,
518
+ oklch(from var(--art-snowball-preloader-bg) l c h / 0) 270deg
519
+ )`, top: "0", left: "0", width: "100%", height: "100%" } } }, ".art-snowball-preloader-sm": { "@layer css-art": { "--art-snowball-preloader-size": "192px" } }, ".art-snowball-preloader-lg": { "@layer css-art": { "--art-snowball-preloader-size": "384px" } }, ".art-csswitch": [{ "@layer css-art": { "--art-csswitch-size": "800px", "--joycon-left": "#00c5e2", "--joycon-left-shadow": "#0128", "--joycon-right": "#ff6658", "--joycon-right-shadow": "#c218", position: "relative", isolation: "isolate", fontSize: "var(--art-csswitch-size)", width: "var(--art-csswitch-size)", maxWidth: "var(--art-csswitch-size)", height: "calc(var(--art-csswitch-size) * 0.4256)", background: "#f000" } }, { "@layer css-art": { "@media (max-width: 1010px)": { width: "calc(var(--art-csswitch-size) * 0.663)" } } }, { "@layer css-art": { "@media (max-width: 670px)": { width: "calc(var(--art-csswitch-size) * 0.45)" } } }, { "@layer css-art": { "@media (max-width: 460px)": { width: "90%", minWidth: "320px" } } }, { "@layer css-art": { "@media (max-width: 360px)": { width: "0.151em", minWidth: "0.151em" } } }], ".art-csswitch *, \n .art-csswitch *::before, \n .art-csswitch *::after": { "@layer css-art": { position: "absolute", boxSizing: "border-box" } }, ".art-csswitch :focus": { "@layer css-art": { outline: "1px dashed", outlineOffset: "2px" } }, ".art-csswitch .round": { "@layer css-art": { borderRadius: "50%" } }, ".art-csswitch .comfort-grip, \n .art-csswitch .connector": { "@layer css-art": { display: "none" } }, ".art-csswitch .body": [{ "@layer css-art": { bottom: "0", left: "50%", transform: "translateX(-50%)", width: "0.721em", height: "99%" } }, { "@layer css-art": { "@media (max-width: 1010px)": { display: "none" } } }], ".art-csswitch .frame": { "@layer css-art": { width: "100%", height: "100%", borderRadius: "2px", background: `radial-gradient(farthest-side, #2f3638 50%, #0000) -1% 3% / 2% 2%,
520
+ radial-gradient(farthest-side, #2f3638, #0000) 1% -0.75% / 2% 2%,
521
+ radial-gradient(95% 70% at 0% 0%, #2f3638 85%, #fff3, #f000) 0.5% 0.75% / 1.55% 5.25% no-repeat,
522
+ radial-gradient(farthest-side, #2f3638 50%, #0000) 101% 3% / 2% 2%,
523
+ radial-gradient(farthest-side, #2f3638, #0000) 99% -0.75% / 2% 2%,
524
+ radial-gradient(95% 70% at 100% 0%, #2f3638 85%, #fff3, #f000) 99.5% 0.75% / 1.55% 5.25% no-repeat,
525
+ linear-gradient(#0000 1%, #fff3 2%, #0000 4%),
526
+ linear-gradient(#0000 95%, #0008),
527
+ #2f3638`, backgroundRepeat: "no-repeat", boxShadow: `inset -1.5px 0 0.75px -0.75px #fff5,
528
+ inset 1.5px 0 0.75px -0.75px #fff6`, WebkitMask: `radial-gradient(farthest-side at 100% 100%, #f00 99.99%, #f000) 0 3.9% / 0.6% 1% no-repeat,
529
+ radial-gradient(farthest-side at 100% 100%, #f00 99.99%, #f000) 1.7% 0% / 0.4% 1% no-repeat,
530
+ radial-gradient(78.33% 60.33% at 0% 0%, #f000 99%, #f00) 0.5% 0.75% / 1.55% 5.25% no-repeat,
531
+ radial-gradient(farthest-side at 0% 100%, #f00 99.99%, #f000) 100% 3.9% / 0.6% 1% no-repeat,
532
+ radial-gradient(farthest-side at 0% 100%, #f00 99.99%, #f000) 98.3% 0% / 0.4% 1% no-repeat,
533
+ radial-gradient(78.33% 60.33% at 100% 0%, #f000 99%, #f00) 99.5% 0.75% / 1.55% 5.25% no-repeat,
534
+ linear-gradient(#0000 4.7%, #000 0),
535
+ linear-gradient(90deg, #0000 1.9%, #000 0 98.1%, #0000 0)` } }, ".art-csswitch .frame::before": { "@layer css-art": { content: '""', top: "50%", left: "50%", transform: "translate(-50%, -50%)", width: "94%", height: "93%", borderRadius: "11px", border: "0.3px solid #000", boxShadow: `0 0.45px 1px #fff8,
536
+ inset 0 0.6px 1.5px -0.25px #000,
537
+ inset 0 0.7px 1.5px -0.25px #fffc`, background: `radial-gradient(circle at 32.7% 98%, #0e0e0e 0.9%, #000 0 1%, #0e0e0e 0 1.2%, #0000 0),
538
+ linear-gradient(#0e0e0e 0 0) 32.33% 100% / 2.1% 2% no-repeat,
539
+ #000` } }, ".art-csswitch .screen": { "@layer css-art": { top: "50%", left: "50%", transform: "translate(-50%, -50%)", width: "80%", height: "77.5%", borderRadius: "1.5px", background: "#292d30", boxShadow: "inset 0 1.5px 5px -1.5px #000c" } }, ".art-csswitch .controller": [{ "@layer css-art": { "--color": "var(--joycon-left)", "--color-shadow": "var(--joycon-left-shadow)", "--connection": "0.02em 0.0105em 0 -0.0123em #020100", width: "0.1385em", height: "99%", bottom: "0", left: "0", borderRadius: "90px 4px 2px 90px", background: "var(--color)", boxShadow: `var(--connection),
540
+ inset 1px -9px 10px -3px #0125,
541
+ inset 35px 0 25px -25px #0002,
542
+ inset -2px 0 4px var(--color),
543
+ inset 6px 16px 5px -8px var(--color),
544
+ inset 0 17px 5px -8px #fff,
545
+ inset 5px -5px 10px -4px var(--color-shadow)` } }, { "@layer css-art": { "@media (max-width: 1010px)": { left: "0.102em" } } }, { "@layer css-art": { "@media (max-width: 670px)": { "--connection": "0 0 0 #0000", left: "0" } } }], ".art-csswitch .controller::before": [{ "@layer css-art": { content: '""', width: "0.00275em", aspectRatio: "1", background: "#393537", boxShadow: "inset 0.1px 0.75px 0.4px #fff3", left: "100%", top: "97.75%", borderRadius: "50%" } }, { "@layer css-art": { "@media (max-width: 670px)": { content: "none" } } }], ".art-csswitch .controller.right": [{ "@layer css-art": { "--color": "var(--joycon-right)", "--color-shadow": "var(--joycon-right-shadow)", "--connection": "-0.02em 0.0105em 0 -0.0123em #020100", left: "auto", right: "0", borderRadius: "4px 90px 90px 2px", boxShadow: `var(--connection),
546
+ inset -0.001em -0.009em 0.01em -0.003em #2107,
547
+ inset -0.035em 0 0.025em -0.025em #0002,
548
+ inset 0.002em 0 0.004em var(--color),
549
+ inset -0.006em 0.016em 0.005em -0.008em var(--color),
550
+ inset 0 0.017em 0.005em -0.008em #fff,
551
+ inset -0.01em 0 0.01em -0.004em var(--color-shadow)` } }, { "@layer css-art": { "@media (max-width: 1010px)": { right: "0.102em" } } }, { "@layer css-art": { "@media (max-width: 670px)": { "--connection": "0 0 0 #0000", right: "0" } } }, { "@layer css-art": { "@media (max-width: 360px)": { display: "none" } } }], ".art-csswitch .controller.right::before": { "@layer css-art": { left: "auto", right: "100%", boxShadow: "inset -0.0001em 0.00075em 0.0004em #fff3" } }, ".art-csswitch button": { "@layer css-art": { border: "0", fontSize: "1em", padding: "0" } }, ".art-csswitch .bar": [{ "@layer css-art": { display: "none" } }, { "@layer css-art": { "@media (max-width: 670px)": { display: "block", top: "0.25%", left: "100%", width: "0.05em", height: "98%" } } }, { "@layer css-art": { "@media (max-width: 460px)": { display: "none" } } }], ".art-csswitch .minus": { "@layer css-art": { "--c": "#404040", width: "17%", height: "1.8%", background: "var(--c)", top: "8.9%", right: "7.7%", borderRadius: "0.0015em", border: "0.001em solid var(--color-shadow)", boxShadow: `inset 1px -1px 1px #0008,
552
+ inset -1px 0 1px #0003,
553
+ inset 0 1px 1px #fff6,
554
+ 0 2px 2px -1px #0006` } }, ".art-csswitch .plus": { "@layer css-art": { left: "7.7%", right: "auto" } }, ".art-csswitch .plus::before": { "@layer css-art": { content: '""', width: "37.5%", height: "410%", background: "var(--c)", top: "50%", left: "50%", transform: "translate(-50%, -50%)", borderRadius: "0.0015em", border: "0.001em solid var(--color-shadow)", boxShadow: `0 0.004em 0.02em var(--color-shadow),
555
+ inset -0.0006em 0 0.0004em #0007,
556
+ inset 0.0006em 0 0.0004em #0007,
557
+ inset 0 -0.001em 0.0005em -0.0002em #0008,
558
+ inset 0 0.00075em 0.0005em -0.0002em #fff6` } }, ".art-csswitch .plus::after": { "@layer css-art": { content: '""', width: "35%", aspectRatio: "1", background: `radial-gradient(circle at 0 0, #834 20%, #0000 20% 35%, var(--c) 0) 0 0 / 50% 50%,
559
+ conic-gradient(at 0 0, #000, #fff) 1% 1% / 40% 40%,
560
+ radial-gradient(circle at 100% 0, #834 20%, #0000 20% 35%, var(--c) 0) 100% 0 / 50% 50%,
561
+ conic-gradient(at 100% 0, #fff 25%, #000) 99% 1% / 40% 40%,
562
+ radial-gradient(circle at 0% 100%, #834 20%, #0000 20% 35%, var(--c) 0) 1% 99% / 50% 50%,
563
+ radial-gradient(at 0% 100%, #0008, #0000) 1% 99% / 40% 40%,
564
+ radial-gradient(circle at 100% 100%, #834 20%, #0000 20% 35%, var(--c) 0) 99% 99% / 50% 50%,
565
+ radial-gradient(at 100% 100%, #0008, #0000) 100% 99% / 40% 40%,
566
+ var(--c)`, backgroundRepeat: "no-repeat", top: "50%", left: "50%", transform: "translate(-50%, -50%)" } }, ".art-csswitch .mushroom": { "@layer css-art": { width: "47%", aspectRatio: "1", border: "0.001em solid var(--color-shadow)", top: "17.5%", left: "30%", background: `radial-gradient(circle at 50% 0, #6669, #6660 60%),
567
+ #2a2e31`, boxShadow: `inset 0 0.0001em 0.00125em -0.0005em var(--color),
568
+ inset 0 0.003em 0.003em #0004,
569
+ inset 0 -0.005em 0.003em #0006,
570
+ 0 -0.0009em 0.001em 0.001em #0003,
571
+ 0 0.00075em 0.001em 0.001em #0003,
572
+ 0 0.01em 0.01em -0.0025em #0004,
573
+ 0 0.025em 0.035em var(--color-shadow)` } }, ".art-csswitch .right .mushroom": { "@layer css-art": { top: "45.25%", left: "23.25%" } }, ".art-csswitch .mushroom::before": { "@layer css-art": { content: '""', width: "80%", aspectRatio: "1", top: "50%", left: "50%", transform: "translate(-50%, -50%)", borderRadius: "50%", background: "radial-gradient(circle at 50% 0, #6669, #6660 60%)", boxShadow: `inset 0 0 0.001em #0008,
574
+ inset 0 0.002em 0.002em #0008,
575
+ inset 0 -0.001em 0.001em 0.001em #fff4,
576
+ 0 0.001em 0.001em #fff2,
577
+ 0 -0.0007em 0.001em 0.0006em #0008,
578
+ 0 -0.0025em 0.0015em 0.0006em #fff2` } }, ".art-csswitch .mushroom::after": { "@layer css-art": { content: '""', width: "95%", aspectRatio: "1", top: "50%", left: "50%", transform: "translate(-50%, -50%)", borderRadius: "50%", background: `linear-gradient(90deg, #000, #0000 20% 80%, #000) 50% 0 / 3% 12%,
579
+ linear-gradient(#000 5%, #444 15% 30%, #666 50%, #3c3c3c, #484848) 50% 0 / 3% 12%,
580
+ linear-gradient(#0000 30% 90%, #fff) 0% 50% / 12% 3%,
581
+ linear-gradient(#000, #0000 30% 70%, #000) 0% 50% / 12% 3%,
582
+ linear-gradient(90deg, #fff4, #222 10% 50%, #444) 0% 50% / 12% 3%,
583
+ linear-gradient(#0000 30% 90%, #fff) 100% 50% / 12% 3%,
584
+ linear-gradient(#000, #0000 30% 70%, #000) 100% 50% / 12% 3%,
585
+ linear-gradient(to left, #fff4, #222 10% 50%, #444) 100% 50% / 12% 3%,
586
+ linear-gradient(90deg, #000, #0000 20% 80%, #000) 50% 100% / 3% 12%,
587
+ linear-gradient(to top, #fff4, #111 15% 50%, #444) 50% 100% / 3% 12%,
588
+ #f000`, backgroundRepeat: "no-repeat" } }, ".art-csswitch .direction": { "@layer css-art": { display: "grid", placeItems: "center", width: "23%", aspectRatio: "1", border: "0.0007em solid var(--color-shadow)", background: `linear-gradient(#fff2, #fff0),
589
+ #35393c`, boxShadow: `0 0.002em 0.007em var(--color-shadow),
590
+ inset 0 0.0001em 0.0015em -0.0005em var(--color),
591
+ inset 0 0 0.0005em 0.001em #323439,
592
+ inset 0 0.002em 0.001em 0.0002em #def5,
593
+ inset 0 -0.001em 0.0005em 0.0002em #000,
594
+ inset 0 -0.001em 0.001em 0.002em #000c` } }, ".art-csswitch .direction::before": { "@layer css-art": { fontSize: "0.0175em", fontFamily: "Helvetica, sans-serif", color: "#fffa" } }, ".art-csswitch .arrow::before, \n .art-csswitch .arrow::after": { "@layer css-art": { content: '""', width: "40%", top: "50%", left: "50%", transform: "translate(-50%, -50%)", aspectRatio: "1", borderRadius: "50%", background: "#252525", clipPath: "polygon(52% -2%, 100% 80%, 0 80%, 48% -2%)" } }, ".art-csswitch .arrow::before": { "@layer css-art": { top: "51.5%", background: "#fff3", filter: "blur(0.01em)" } }, ".art-csswitch .arrow.right::before, \n .art-csswitch .arrow.right::after": { "@layer css-art": { transform: "translate(-50%, -50%) rotate(90deg)" } }, ".art-csswitch .arrow.left::before, \n .art-csswitch .arrow.left::after": { "@layer css-art": { transform: "translate(-50%, -50%) rotate(-90deg)" } }, ".art-csswitch .arrow.down::before, \n .art-csswitch .arrow.down::after": { "@layer css-art": { transform: "translate(-50%, -50%) rotate(180deg)" } }, ".art-csswitch .direction.up": { "@layer css-art": { top: "41.75%", left: "41.9%" } }, ".art-csswitch .direction.down": { "@layer css-art": { top: "56.6%", left: "41.9%" } }, ".art-csswitch .direction.left": { "@layer css-art": { left: "18.25%", top: "49.25%" } }, ".art-csswitch .direction.right": { "@layer css-art": { left: "65.75%", top: "49.25%" } }, ".art-csswitch .direction.x": { "@layer css-art": { top: "14%", left: "35%" } }, ".art-csswitch .direction.x::before": { "@layer css-art": { content: '"X"' } }, ".art-csswitch .direction.y": { "@layer css-art": { top: "21.5%", left: "11.25%" } }, ".art-csswitch .direction.y::before": { "@layer css-art": { content: '"Y"' } }, ".art-csswitch .direction.a": { "@layer css-art": { top: "21.5%", left: "59%" } }, ".art-csswitch .direction.a::before": { "@layer css-art": { content: '"A"' } }, ".art-csswitch .direction.b": { "@layer css-art": { top: "29%", left: "35%" } }, ".art-csswitch .direction.b::before": { "@layer css-art": { content: '"B"' } }, ".art-csswitch .menu": { "@layer css-art": { width: "19.35%", aspectRatio: "1", border: "0.0009em solid var(--color-shadow)", top: "68.5%", left: "60.5%", borderRadius: "0.003em", background: "#464b50", boxShadow: `inset 0 0.001em 0.001em -0.0005em #fff6,
595
+ inset 0 -0.001em 0.001em -0.0005em #0006` } }, ".art-csswitch .menu::before": { "@layer css-art": { content: '""', width: "67%", aspectRatio: "1", background: "#33393c", left: "50%", top: "50%", transform: "translate(-50%, -50%)", borderRadius: "50%", boxShadow: `inset 0 0.0009em 0.00075em #0008,
596
+ 0 0.0008em 0.00075em #fff5` } }, ".art-csswitch .lr": { "@layer css-art": { background: "linear-gradient(#4c5153 50%, #030405 60%)", top: "-1%", right: "18%", width: "83.5%", height: "21%", borderRadius: "100em 2em 0 0", clipPath: "ellipse(140% 87% at 100% 0%)", boxShadow: `inset -0.004em 0 0.003em -0.003em #333,
597
+ inset -0.007em 0 0.003em -0.003em #4c5153,
598
+ inset 0 0.0015em 0.001em #444,
599
+ inset -0.001em 0.00175em 0.001em #fff`, zIndex: -1 } }, ".art-csswitch .lr.rr": { "@layer css-art": { left: "18%", right: "auto", transform: "scaleX(-1)" } }, ".art-csswitch .volume": { "@layer css-art": { width: "8.5%", height: "0.7%", background: "linear-gradient(#444, #222)", left: "13.3%", top: "-0.6%", borderRadius: "0.0005em 0.0005em 0 0", clipPath: "polygon(-20% -100%, 32% -100%, 32% 0, 33% 35%, 66% 35%, 67% 0%, 67% -100%, 110% -100%, 110% 120%, -20% 120%)", zIndex: -1 } }, ".art-csswitch .home": { "@layer css-art": { top: "67.6%", left: "17.5%", display: "grid", placeItems: "center", width: "25%", aspectRatio: "1", border: "0.0007em solid var(--color-shadow)", background: `linear-gradient(#0001, #0005),
600
+ radial-gradient(#0000 52.5%, #9c9a9a 54%),
601
+ #404547` } }, ".art-csswitch .home::before": { "@layer css-art": { content: '""', top: "23%", left: "50%", transform: "translate(-50%, 0)", width: "50%", height: "24.5%", background: "conic-gradient(at 50% 0, #0000 132deg, #010202 0 228deg, #0000 0)", boxShadow: "0 0.5px 0.75px -0.25px #fff8" } }, ".art-csswitch .home::after": { "@layer css-art": { content: '""', color: "#010202", top: "46%", left: "50%", transform: "translate(-50%, 0)", width: "39%", height: "24.5%", boxShadow: `inset -0.004em 0,
602
+ inset 0.004em 0,
603
+ inset 0 -0.004em 0,
604
+ 0 0.5px 0.75px -0.25px #fff5` } }, ".art-csswitch button:active, \n .art-csswitch .plus:active::before, \n .art-csswitch .plus:active::after, \n .art-csswitch .active": { "@layer css-art": { background: "yellow !important" } }, ".art-csswitch .comfort-grip": [{ "@layer css-art": { "@media (max-width: 1010px)": { display: "block", width: "100%", height: "0.461em" } } }, { "@layer css-art": { "@media (max-width: 670px)": { display: "none" } } }], ".art-csswitch .grip": { "@layer css-art": { "@media (max-width: 1010px)": { width: "24%", height: "82.5%", bottom: "7.5%", left: "0%", transform: "rotate(12deg)", background: `radial-gradient(50% 100% at 69% 50%, #fff1, #fff0 50%),
605
+ radial-gradient(100% 100% at 60% 60%, #ffffff18, #fff0 30%),
606
+ linear-gradient(#0000, #0003),
607
+ #2f3638`, borderRadius: "120% 120% 170% 125% / 120% 120% 140% 110%", transformOrigin: "50% 100%", boxShadow: `inset 25px 20px 20px -10px #00050ccc,
608
+ inset -20px -10px 30px -10px #0008,
609
+ inset 32px 50px 15px -15px #fff5,
610
+ inset 0 0 50px #0008` } } }, ".art-csswitch .grip.right": { "@layer css-art": { "@media (max-width: 1010px)": { left: "auto", right: "0", transform: "scaleX(-1) rotate(12deg)" } } }, ".art-csswitch .comfort-grip ~ .comfort-grip": { "@layer css-art": { "@media (max-width: 1010px)": { height: "100%" } } }, ".art-csswitch .holder": { "@layer css-art": { "@media (max-width: 1010px)": { width: "70%", height: "0.365em", background: "#2f3638", top: "13%", left: "50%", transform: "translateX(-50%)", borderRadius: "7% 7% 250px 250px / 10% 10% 26% 26%", boxShadow: `inset 2px -10px 2px -1px #000,
611
+ inset -2px -10px 2px 0px #000,
612
+ -1px 1px 2px -1.5px #fffc,
613
+ 0 40px 0 -20px #000c,
614
+ -3px 10px 10px 3px #2f3638,
615
+ 1px 1px 2px -1.5px #fffc,
616
+ 2px 10px 10px 3px #2f3638`, clipPath: "polygon(-100% 0%, 200% 0%, 200% 100%, 66% 100%, 65.75% 100.75%, 34.25% 100.75%, 34% 100%, -100% 100%)" } } }, ".art-csswitch .main-frame": { "@layer css-art": { "@media (max-width: 1010px)": { width: "0.181em", height: "99%", bottom: "0%", left: "50%", transform: "translate(-50%, 0)", borderRadius: "2px", WebkitMask: `radial-gradient(farthest-side at 100% 100%, #f00 99.99%, #f000) 0 3.9% / 2.4% 1% no-repeat,
617
+ radial-gradient(farthest-side at 100% 100%, #f00 99.99%, #f000) 6.8% 0% / 1.6% 1% no-repeat,
618
+ radial-gradient(78.33% 60.33% at 0% 0%, #f000 99%, #f00) 2% 0.75% / 6.2% 5.25% no-repeat,
619
+ radial-gradient(farthest-side at 0% 100%, #f00 99.99%, #f000) 100% 3.9% / 2.4% 1% no-repeat,
620
+ radial-gradient(farthest-side at 0% 100%, #f00 99.99%, #f000) 93.2% 0% / 1.6% 1% no-repeat,
621
+ radial-gradient(78.33% 60.33% at 100% 0%, #f000 99%, #f00) 98% 0.75% / 6.2% 5.25% no-repeat,
622
+ linear-gradient(#0000 4.7%, #000 0),
623
+ linear-gradient(90deg, #0000 7.5%, #000 0 92.5%, #0000 0)`, background: `radial-gradient(farthest-side, #2f3638 50%, #0000) -1% 3% / 2% 2%,
624
+ radial-gradient(farthest-side, #2f3638, #0000) 1% -0.75% / 2% 2%,
625
+ radial-gradient(95% 70% at 0% 0%, #2f3638 85%, #fff3, #f000) 0.5% 0.75% / 1.55% 5.25% no-repeat,
626
+ radial-gradient(farthest-side, #2f3638 50%, #0000) 101% 3% / 2% 2%,
627
+ radial-gradient(farthest-side, #2f3638, #0000) 99% -0.75% / 2% 2%,
628
+ radial-gradient(95% 70% at 100% 0%, #2f3638 85%, #fff3, #f000) 99.5% 0.75% / 1.55% 5.25% no-repeat,
629
+ linear-gradient(#0000 1%, #fff3 2%, #0000 4%),
630
+ linear-gradient(#0000 97%, #0008),
631
+ radial-gradient(at 0 100%, #2f3638 1%, #0000 10%),
632
+ radial-gradient(at 100% 100%, #2f3638 1%, #0000 10%),
633
+ linear-gradient(#fff0 96%, #ffffff08, #fff0 98.5%),
634
+ linear-gradient(#0000, #0013 5%, #0000 50%),
635
+ #2f3638`, boxShadow: `inset 4px 0 3px -3.5px #fff5,
636
+ inset -4px 0 3px -3.5px #fff5,
637
+ inset 3px 0 4px -3.5px,
638
+ inset -3px 0 4px -3.5px`, backgroundRepeat: "no-repeat" } } }, ".art-csswitch .logo": { "@layer css-art": { "@media (max-width: 1010px)": { width: "0.0325em", height: "0.065em", background: "radial-gradient(circle at 53.5% 26.5%, #1a1c21 6px, #1a1c2100 0)", left: "0.057em", top: "0.1385em", border: "0.005em solid #1a1c21", borderRadius: "0.02em 0 0 0.02em", boxShadow: "1px 0.5px 2px -1.5px #fff3" } } }, ".art-csswitch .logo.right": { "@layer css-art": { "@media (max-width: 1010px)": { left: "0.0955em", width: "0.029em", background: "radial-gradient(circle at 48% 55%, #1a1c2100 6px, #1a1c21 0)", border: "0", borderRadius: "0 0.0175em 0.0175em 0" } } }, ".art-csswitch .nintendo": { "@layer css-art": { "@media (max-width: 1010px)": { fontSize: "0.012em", left: "51.5%", top: "51.75%", transform: "translate(-50%, -50%)", fontFamily: "Helvetica, sans-serif", fontWeight: 700, letterSpacing: "0.0055em", color: "#1a1c21" } } }, ".art-csswitch .switch": { "@layer css-art": { "@media (max-width: 1010px)": { fontSize: "0.021em", left: "51%", top: "55.75%", transform: "translate(-50%, -50%)", fontFamily: "Helvetica, sans-serif", fontWeight: 700, letterSpacing: "0.004em", color: "#1a1c21" } } }, ".art-csswitch .light": { "@layer css-art": { "@media (max-width: 1010px)": { top: "37.5%", left: "10.25%", border: "0.00075em solid #000c", width: "0.0065em", height: "0.0065em", borderRadius: "0.0015em", background: `radial-gradient(at 0 0, #0004, #0000),
639
+ #53565b`, boxShadow: `inset -1px -1px 2px -1.5px #ffd3,
640
+ 1px 1.5px 1px -1.25px #fff3` } } }, ".art-csswitch .light:nth-child(3n), \n .art-csswitch .light:nth-child(7n)": { "@layer css-art": { "@media (max-width: 1010px)": { top: "45.5%" } } }, ".art-csswitch .light:nth-child(2n), \n .art-csswitch .light:nth-child(6n)": { "@layer css-art": { "@media (max-width: 1010px)": { top: "41.5%" } } }, ".art-csswitch .light:nth-child(4n), \n .art-csswitch .light:nth-child(8n)": { "@layer css-art": { "@media (max-width: 1010px)": { top: "49.5%" } } }, ".art-csswitch .light:nth-child(n + 5)": { "@layer css-art": { "@media (max-width: 1010px)": { left: "auto", right: "10.25%" } } }, ".art-csswitch .controller.right .bar": { "@layer css-art": { "@media (max-width: 670px)": { left: "auto", right: "100%", transform: "scalex(-1)" } } }, ".art-csswitch .bar button": { "@layer css-art": { "@media (max-width: 670px)": { width: "100%", height: "14.25%", left: "0.01em", borderRadius: "4px", background: `radial-gradient(20% 100% at 100% 50%, #0008 30%, #31333800 40%),
641
+ radial-gradient(20% 100% at 100% 50%, #232629 40%, #23262900 60%),
642
+ linear-gradient(#232629 5%, #fff7, #414649 25% 75%, #232629)` } } }, ".art-csswitch .sub-lr": { "@layer css-art": { "@media (max-width: 670px)": { top: "19.75%" } } }, ".art-csswitch .sub-rr": { "@layer css-art": { "@media (max-width: 670px)": { top: "60.25%" } } }, ".art-csswitch .minus-sign": { "@layer css-art": { "@media (max-width: 670px)": { width: "0.021em", height: "0.0055em", background: "#343a3b", top: "0.038em", left: "0.00725em", borderRadius: "0.00075em", boxShadow: `inset 0 0 2px #2f3638,
643
+ 0 1px 3px -1.5px #fff4` } } }, ".art-csswitch .controller.right .minus-sign::before": { "@layer css-art": { "@media (max-width: 670px)": { content: '""', width: "0.0055em", height: "0.021em", top: "50%", left: "50%", transform: "translate(-50%, -50%)", background: "inherit", boxShadow: `inset 0 0 2px #2f3638,
644
+ 0 3px 3px -2px #fff4` } } }, ".art-csswitch .peripheral": { "@layer css-art": { "@media (max-width: 670px)": { top: "0", left: "0", width: "100%", height: "100%", borderRadius: "3px 120px 110px 0 / 6px 120px 110px 0", background: "#3f4648", boxShadow: `inset 2px 0 3px -1px #000c,
645
+ inset -5px 5px 5px #303538,
646
+ inset -10px -5px 5px #303538,
647
+ inset -5px 9px 5px #fff4`, WebkitMask: `radial-gradient(95% 250% at 100% 64%, #0000 7%, #f00 7.5%) 100% 0 / 100% 42% no-repeat,
648
+ radial-gradient(95% 250% at 100% 67.5%, #0000 7%, #f00 7.5%) 100% 67.25% / 100% 42% no-repeat,
649
+ radial-gradient(160% 20% at 0 100%, #0000 38%, #f00 38.5%) 0 100% / 40% 50% no-repeat,
650
+ radial-gradient(160% 30% at 110% 101%, #0000 65%, #f00 0) 100% 100% / 62% 25% no-repeat`, clipPath: "polygon(0 0, 100% 0, 100% 100%, 29% 100%, 0% 96%)" } } }, ".art-csswitch .cord": { "@layer css-art": { "@media (max-width: 670px)": { width: "12px", height: "100vh", left: "47%", top: "30%", background: `linear-gradient(#000 33%, #0000 34%) 50% 50% / 11px 100%,
651
+ linear-gradient(#0009 32%, #0000 38%) 50% 50% / 11px 100%,
652
+ linear-gradient(90deg, #0000, #6666, #0000),
653
+ linear-gradient(45deg, #253a3e, #21212c, #656a6e, #253a3e) 0.5px 0 / 6px 6px,
654
+ linear-gradient(-45deg, #253a3e, #31313c, #707070, #253a3e) 5.5px 3px / 6px 6px,
655
+ radial-gradient(farthest-side, #353a3ecc 99.99%, #f000) 50% 50% / 12px 8px`, backgroundRepeat: "repeat-y" } } }, ".art-csswitch .connector": { "@layer css-art": { "@media (max-width: 460px)": { display: "block", top: "0.022em", left: "calc(100% - 1px)", width: "0.0135em", height: "0.358em", zIndex: -1 } } }, ".art-csswitch .controller.right .connector": { "@layer css-art": { "@media (max-width: 460px)": { transform: "scaleX(-1)", left: "auto", right: "calc(100% - 1px)" } } }, ".art-csswitch .con-lr, \n .art-csswitch .con-rr": { "@layer css-art": { "@media (max-width: 460px)": { width: "90%", height: "9.75%", background: "var(--color)", top: "25.25%", right: "0", transform: "translateY(-50%)", borderRadius: "2px", boxShadow: `inset -1.5px -2px 4px -1px #0005,
656
+ inset -1px 1px 2px -1.5px #0006` } } }, ".art-csswitch .con-rr": { "@layer css-art": { "@media (max-width: 460px)": { top: "73%" } } }, ".art-csswitch .con-part": { "@layer css-art": { "@media (max-width: 460px)": { width: "100%", height: "100%", top: "0", left: "0px" } } }, ".art-csswitch .con-part::after": { "@layer css-art": { "@media (max-width: 460px)": { content: '""', width: "60%", right: "0", height: "100%", top: "0", boxShadow: `inset -3px 2px 2px -1px #0008,
657
+ inset 0 4px 1px -2px #0007,
658
+ inset 0 3px 1px #fff7`, background: `linear-gradient(#0002, #0000, #0002),
659
+ #42484d`, borderRadius: "2px 4px 3px 3px / 2px 4px 3px 10px", clipPath: "polygon(0 0, 100% 0, 100% 18%, 70% 20%, 70% 31%, 100% 33%, 100% 65.5%, 70% 67.5%, 70% 78.5%, 100% 80.5%, 100% 100%, 0 100%)" } } }, ".art-csswitch .con-part::before": { "@layer css-art": { "@media (max-width: 460px)": { content: '""', width: "60%", left: "0", height: "95%", top: "0", background: `linear-gradient(90deg, #000, #0000 20% 40%, #000 60%),
660
+ linear-gradient(#6e7474 0.66%, #0008 0, #6e7474cc 1.5%, #000c 2.5%, #0000 0),
661
+ #1b2827` } } }, ".art-csswitch-sm": { "@layer css-art": { "--art-csswitch-size": "500px" } }, ".art-csswitch-lg": { "@layer css-art": { "--art-csswitch-size": "1000px" } } };
662
+ var utilityStyles = { ".bg-primary": { "@layer utilities": { backgroundColor: "var(--color-primary)" } }, ".bg-primary-focus": { "@layer utilities": { backgroundColor: "color-mix(in oklch, var(--color-primary), black 10%)" } }, ".bg-primary-container": { "@layer utilities": { backgroundColor: "var(--color-primary-container)" } }, ".bg-secondary": { "@layer utilities": { backgroundColor: "var(--color-secondary)" } }, ".bg-secondary-focus": { "@layer utilities": { backgroundColor: "color-mix(in oklch, var(--color-secondary), black 10%)" } }, ".bg-secondary-container": { "@layer utilities": { backgroundColor: "var(--color-secondary-container)" } }, ".bg-tertiary": { "@layer utilities": { backgroundColor: "var(--color-tertiary)" } }, ".bg-tertiary-focus": { "@layer utilities": { backgroundColor: "color-mix(in oklch, var(--color-tertiary), black 10%)" } }, ".bg-tertiary-container": { "@layer utilities": { backgroundColor: "var(--color-tertiary-container)" } }, ".bg-surface": { "@layer utilities": { backgroundColor: "var(--color-surface)" } }, ".bg-surface-dim": { "@layer utilities": { backgroundColor: "var(--color-surface-dim)" } }, ".bg-surface-bright": { "@layer utilities": { backgroundColor: "var(--color-surface-bright)" } }, ".bg-surface-container-lowest": { "@layer utilities": { backgroundColor: "var(--color-surface-container-lowest)" } }, ".bg-surface-container-low": { "@layer utilities": { backgroundColor: "var(--color-surface-container-low)" } }, ".bg-surface-container": { "@layer utilities": { backgroundColor: "var(--color-surface-container)" } }, ".bg-surface-container-high": { "@layer utilities": { backgroundColor: "var(--color-surface-container-high)" } }, ".bg-surface-container-highest": { "@layer utilities": { backgroundColor: "var(--color-surface-container-highest)" } }, ".bg-info": { "@layer utilities": { backgroundColor: "var(--color-info)" } }, ".bg-info-container": { "@layer utilities": { backgroundColor: "var(--color-info-container)" } }, ".bg-success": { "@layer utilities": { backgroundColor: "var(--color-success)" } }, ".bg-success-container": { "@layer utilities": { backgroundColor: "var(--color-success-container)" } }, ".bg-warning": { "@layer utilities": { backgroundColor: "var(--color-warning)" } }, ".bg-warning-container": { "@layer utilities": { backgroundColor: "var(--color-warning-container)" } }, ".bg-error": { "@layer utilities": { backgroundColor: "var(--color-error)" } }, ".bg-error-container": { "@layer utilities": { backgroundColor: "var(--color-error-container)" } }, ".bg-base-100": { "@layer utilities": { backgroundColor: "var(--color-base-100)" } }, ".bg-base-200": { "@layer utilities": { backgroundColor: "var(--color-base-200)" } }, ".bg-base-300": { "@layer utilities": { backgroundColor: "var(--color-base-300)" } }, ".bg-base-400": { "@layer utilities": { backgroundColor: "var(--color-base-400)" } }, ".bg-base-500": { "@layer utilities": { backgroundColor: "var(--color-base-500)" } }, ".bg-base-600": { "@layer utilities": { backgroundColor: "var(--color-base-600)" } }, ".bg-base-700": { "@layer utilities": { backgroundColor: "var(--color-base-700)" } }, ".bg-base-800": { "@layer utilities": { backgroundColor: "var(--color-base-800)" } }, ".bg-base-900": { "@layer utilities": { backgroundColor: "var(--color-base-900)" } }, ".text-primary": { "@layer utilities": { color: "var(--color-primary)" } }, ".text-primary-content": { "@layer utilities": { color: "var(--color-primary-content)" } }, ".text-on-primary-container": { "@layer utilities": { color: "var(--color-on-primary-container)" } }, ".text-secondary": { "@layer utilities": { color: "var(--color-secondary)" } }, ".text-secondary-content": { "@layer utilities": { color: "var(--color-secondary-content)" } }, ".text-on-secondary-container": { "@layer utilities": { color: "var(--color-on-secondary-container)" } }, ".text-tertiary": { "@layer utilities": { color: "var(--color-tertiary)" } }, ".text-tertiary-content": { "@layer utilities": { color: "var(--color-tertiary-content)" } }, ".text-on-tertiary-container": { "@layer utilities": { color: "var(--color-on-tertiary-container)" } }, ".text-on-surface": { "@layer utilities": { color: "var(--color-on-surface)" } }, ".text-on-surface-variant": { "@layer utilities": { color: "var(--color-on-surface-variant)" } }, ".text-info": { "@layer utilities": { color: "var(--color-info)" } }, ".text-info-content": { "@layer utilities": { color: "var(--color-info-content)" } }, ".text-on-info-container": { "@layer utilities": { color: "var(--color-on-info-container)" } }, ".text-success": { "@layer utilities": { color: "var(--color-success)" } }, ".text-success-content": { "@layer utilities": { color: "var(--color-success-content)" } }, ".text-on-success-container": { "@layer utilities": { color: "var(--color-on-success-container)" } }, ".text-warning": { "@layer utilities": { color: "var(--color-warning)" } }, ".text-warning-content": { "@layer utilities": { color: "var(--color-warning-content)" } }, ".text-on-warning-container": { "@layer utilities": { color: "var(--color-on-warning-container)" } }, ".text-error": { "@layer utilities": { color: "var(--color-error)" } }, ".text-error-content": { "@layer utilities": { color: "var(--color-error-content)" } }, ".text-on-error-container": { "@layer utilities": { color: "var(--color-on-error-container)" } }, ".text-base-content": { "@layer utilities": { color: "var(--color-base-content)" } }, ".border-primary": { "@layer utilities": { borderColor: "var(--color-primary)" } }, ".border-secondary": { "@layer utilities": { borderColor: "var(--color-secondary)" } }, ".border-tertiary": { "@layer utilities": { borderColor: "var(--color-tertiary)" } }, ".border-outline": { "@layer utilities": { borderColor: "var(--color-outline)" } }, ".border-outline-variant": { "@layer utilities": { borderColor: "var(--color-outline-variant)" } }, ".border-info": { "@layer utilities": { borderColor: "var(--color-info)" } }, ".border-success": { "@layer utilities": { borderColor: "var(--color-success)" } }, ".border-warning": { "@layer utilities": { borderColor: "var(--color-warning)" } }, ".border-error": { "@layer utilities": { borderColor: "var(--color-error)" } }, ".ring-primary": { "@layer utilities": { "--tw-ring-color": "var(--color-primary)" } }, ".ring-secondary": { "@layer utilities": { "--tw-ring-color": "var(--color-secondary)" } }, ".ring-tertiary": { "@layer utilities": { "--tw-ring-color": "var(--color-tertiary)" } }, ".ring-info": { "@layer utilities": { "--tw-ring-color": "var(--color-info)" } }, ".ring-success": { "@layer utilities": { "--tw-ring-color": "var(--color-success)" } }, ".ring-warning": { "@layer utilities": { "--tw-ring-color": "var(--color-warning)" } }, ".ring-error": { "@layer utilities": { "--tw-ring-color": "var(--color-error)" } }, ".bg-accent": { "@layer utilities": { backgroundColor: "var(--color-accent)" } }, ".bg-accent-focus": { "@layer utilities": { backgroundColor: "color-mix(in oklch, var(--color-accent), black 10%)" } }, ".text-accent": { "@layer utilities": { color: "var(--color-accent)" } }, ".text-accent-content": { "@layer utilities": { color: "var(--color-accent-content)" } }, ".border-accent": { "@layer utilities": { borderColor: "var(--color-accent)" } }, ".ring-accent": { "@layer utilities": { "--tw-ring-color": "var(--color-accent)" } }, ".bg-neutral": { "@layer utilities": { backgroundColor: "var(--color-neutral)" } }, ".bg-neutral-focus": { "@layer utilities": { backgroundColor: "color-mix(in oklch, var(--color-neutral), black 10%)" } }, ".text-neutral": { "@layer utilities": { color: "var(--color-neutral)" } }, ".text-neutral-content": { "@layer utilities": { color: "var(--color-neutral-content)" } }, ".border-neutral": { "@layer utilities": { borderColor: "var(--color-neutral)" } }, ".ring-neutral": { "@layer utilities": { "--tw-ring-color": "var(--color-neutral)" } }, ".bg-surface-variant": { "@layer utilities": { backgroundColor: "var(--color-surface-variant)" } }, ".bg-inverse-surface": { "@layer utilities": { backgroundColor: "var(--color-inverse-surface)" } }, ".text-inverse-on-surface": { "@layer utilities": { color: "var(--color-inverse-on-surface)" } }, ".text-inverse-primary": { "@layer utilities": { color: "var(--color-inverse-primary)" } }, ".elevation-0": { "@layer utilities": { boxShadow: "var(--shadow-elevation-0)" } }, ".elevation-1": { "@layer utilities": { boxShadow: "var(--shadow-elevation-1)" } }, ".elevation-2": { "@layer utilities": { boxShadow: "var(--shadow-elevation-2)" } }, ".elevation-3": { "@layer utilities": { boxShadow: "var(--shadow-elevation-3)" } }, ".elevation-4": { "@layer utilities": { boxShadow: "var(--shadow-elevation-4)" } }, ".elevation-5": { "@layer utilities": { boxShadow: "var(--shadow-elevation-5)" } }, ".sr-only": { position: "absolute", width: "1px", height: "1px", padding: "0", margin: "-1px", overflow: "hidden", clip: "rect(0, 0, 0, 0)", whiteSpace: "nowrap", border: "0" }, ".not-sr-only": { position: "static", width: "auto", height: "auto", padding: "0", margin: "0", overflow: "visible", clip: "auto", whiteSpace: "normal" } };
663
+ var baseConfig = tailwind_plugin_default.config ?? {};
664
+ var baseTheme = baseConfig.theme ?? {};
665
+ var baseExtend = baseTheme.extend ?? {};
666
+ var duskmoonPlugin2 = {
667
+ handler(api) {
668
+ tailwind_plugin_default.handler(api);
669
+ api.addBase(baseStyles);
670
+ api.addComponents(componentStyles);
671
+ api.addUtilities(utilityStyles);
672
+ },
673
+ config: {
674
+ ...baseConfig,
675
+ theme: {
676
+ ...baseTheme,
677
+ extend: {
678
+ ...baseExtend,
679
+ borderRadius: {
680
+ ...baseExtend.borderRadius ?? {},
681
+ ...{ none: "var(--radius-none)", xs: "var(--radius-xs)", sm: "var(--radius-sm)", md: "var(--radius-md)", lg: "var(--radius-lg)", xl: "var(--radius-xl)", "2xl": "var(--radius-2xl)", full: "var(--radius-full)", selector: "var(--radius-selector)", field: "var(--radius-field)", box: "var(--radius-box)" }
682
+ },
683
+ boxShadow: {
684
+ ...baseExtend.boxShadow ?? {},
685
+ ...{ xs: "var(--shadow-xs)", sm: "var(--shadow-sm)", md: "var(--shadow-md)", lg: "var(--shadow-lg)", xl: "var(--shadow-xl)", "2xl": "var(--shadow-2xl)", "elevation-0": "var(--shadow-elevation-0)", "elevation-1": "var(--shadow-elevation-1)", "elevation-2": "var(--shadow-elevation-2)", "elevation-3": "var(--shadow-elevation-3)", "elevation-4": "var(--shadow-elevation-4)", "elevation-5": "var(--shadow-elevation-5)" }
686
+ }
687
+ }
688
+ }
689
+ }
690
+ };
691
+ var __standalone_entry_default = duskmoonPlugin2;