@dynamic-mockups/design-system 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Dynamic Mockups LTD
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,396 @@
+# 🎨 Professional Design System - Complete
+
+## ✅ Project Successfully Created
+
+A production-ready, scalable design system built with modern best practices.
+
+### 📦 Tech Stack
+- **React 18.3.1** - Latest React with hooks
+- **TypeScript 5.9.3** - Full type safety
+- **Radix UI Themes 3.2.1** - Accessible primitives
+- **SCSS** - Enhanced styling with nesting and variables  
+- **Vite 6.0.7** - Lightning-fast build tool
+- **Storybook 10.1.4** - Component documentation
+- **Vitest** - Testing framework
+
+---
+
+## 📁 Final Project Structure
+
+```
+design-system/
+├── src/
+│   ├── tokens/                    # Design tokens (Type-safe)
+│   │   ├── colors.ts             # Brand & semantic colors (50-950 scales)
+│   │   ├── spacing.ts            # 8px grid system (0-96)
+│   │   ├── typography.ts         # Font families, sizes, weights
+│   │   ├── radii.ts              # Border radius values
+│   │   ├── shadows.ts            # Elevation shadows
+│   │   └── index.ts              # Token exports
+│   │
+│   ├── theme/                     # Theme system
+│   │   ├── theme.ts              # Theme configuration
+│   │   ├── ThemeProvider.tsx     # React context provider
+│   │   └── index.ts
+│   │
+│   ├── components/                # Component library
+│   │   ├── Button/
+│   │   │   ├── Button.tsx        # Component logic
+│   │   │   ├── Button.scss       # SCSS styles
+│   │   │   ├── Button.stories.tsx # Storybook stories
+│   │   │   └── index.ts
+│   │   │
+│   │   ├── Input/                # Text input with labels, icons, errors
+│   │   ├── Switch/               # Toggle switch
+│   │   ├── Checkbox/             # Checkbox with labels
+│   │   ├── Select/               # Dropdown select
+│   │   └── index.ts              # Component exports
+│   │
+│   └── index.ts                   # Main entry point
+│
+├── dist/                          # Build output
+│   ├── index.js                  # CommonJS bundle
+│   ├── index.mjs                 # ESM bundle
+│   ├── index.d.ts                # TypeScript declarations
+│   ├── design-system.css         # Compiled CSS from SCSS
+│   └── [component folders]/      # Individual declarations
+│
+├── stories/                       # Storybook files
+├── .storybook/                   # Storybook config
+├── tsconfig.json                 # TypeScript config
+├── vite.config.ts                # Vite build config
+├── package.json                  # Package manifest
+└── README.md                     # Usage documentation
+```
+
+---
+
+## 🎨 Components Built
+
+### 1. **Button** - Full-featured button component
+   - **Variants**: solid, soft, outline, ghost, surface
+   - **Colors**: primary, secondary, accent, success, error, warning, info + Radix colors
+   - **Sizes**: 1-4
+   - **Features**: Loading states, left/right icons, full width, disabled states
+   - **SCSS File**: `Button.scss` with CSS variables for customization
+
+### 2. **Input** - Professional text input
+   - **Variants**: surface, classic, soft
+   - **Sizes**: 1-3
+   - **Colors**: Custom focus colors (primary, secondary, accent, etc.)
+   - **Features**: Labels, helper text, error states, left/right icons, full width
+   - **SCSS File**: `Input.scss` with focus states and variants
+
+### 3. **Switch** - Toggle switch
+   - **Sizes**: 1-3
+   - **Colors**: Custom colors beyond Radix defaults
+   - **Features**: Labels, helper text, left/right label positions
+   - **SCSS File**: `Switch.scss`
+
+### 4. **Checkbox** - Checkbox input
+   - **Sizes**: 1-3
+   - **Colors**: Custom colors
+   - **Features**: Labels, helper text, error states, indeterminate state
+   - **SCSS File**: `Checkbox.scss`
+
+### 5. **Select** - Dropdown select
+   - **Variants**: surface, classic, soft, ghost
+   - **Sizes**: 1-3
+   - **Colors**: Custom focus colors
+   - **Features**: Labels, helper text, error states, disabled options, full width
+   - **SCSS File**: `Select.scss`
+
+---
+
+## 🎯 Design Tokens System
+
+### Colors
+```typescript
+import { colors } from 'design-system';
+
+// Brand colors with 50-950 scales
+colors.brand.primary[500]    // #0ea5e9
+colors.brand.secondary[600]  // #475569
+colors.brand.accent[500]     // #d946ef
+
+// Semantic colors
+colors.semantic.success.main  // #059669
+colors.semantic.error.main    // #dc2626
+colors.semantic.warning.main  // #d97706
+colors.semantic.info.main     // #2563eb
+```
+
+### Spacing (8px grid)
+```typescript
+import { spacing } from 'design-system';
+
+spacing[4]   // 1rem (16px)
+spacing[8]   // 2rem (32px)
+spacing[16]  // 4rem (64px)
+```
+
+### Typography
+```typescript
+import { typography } from 'design-system';
+
+typography.fontFamily.sans
+typography.fontSize.base    // 1rem (16px)
+typography.fontWeight.bold  // 700
+```
+
+---
+
+## 🚀 How to Use in Your Primary Project
+
+### Installation
+
+```bash
+# Option 1: Install from npm (after publishing)
+npm install design-system
+
+# Option 2: Local development (link package)
+cd /path/to/design-system
+npm link
+
+cd /path/to/your-app
+npm link design-system
+```
+
+### Setup
+
+**1. Import Radix Themes CSS**
+```tsx
+// In your main App.tsx or index.tsx
+import '@radix-ui/themes/styles.css';
+```
+
+**2. Wrap with ThemeProvider**
+```tsx
+import { ThemeProvider } from 'design-system';
+
+function App() {
+  return (
+    <ThemeProvider
+      appearance="light"
+      accentColor="blue"
+      radius="medium"
+    >
+      <YourApp />
+    </ThemeProvider>
+  );
+}
+```
+
+**3. Use Components**
+```tsx
+import { Button, Input, Select, Switch, Checkbox } from 'design-system';
+
+function MyPage() {
+  return (
+    <form>
+      <Input
+        label="Email"
+        type="email"
+        placeholder="you@example.com"
+        required
+      />
+
+      <Select
+        label="Country"
+        options={[
+          { value: 'us', label: 'United States' },
+          { value: 'uk', label: 'United Kingdom' },
+        ]}
+      />
+
+      <Switch label="Remember me" />
+
+      <Checkbox label="I agree to the terms" />
+
+      <Button color="primary" type="submit">
+        Submit
+      </Button>
+    </form>
+  );
+}
+```
+
+---
+
+## 🎨 SCSS Customization
+
+### Method 1: Override CSS Variables
+
+Create a `custom-theme.scss` in your project:
+
+```scss
+:root {
+  // Brand colors
+  --color-primary: #0ea5e9;
+  --color-primary-hover: #0284c7;
+  --color-primary-soft: #e0f2fe;
+  
+  --color-secondary: #64748b;
+  --color-accent: #d946ef;
+  
+  // Semantic colors
+  --color-success: #10b981;
+  --color-error: #ef4444;
+  --color-warning: #f59e0b;
+  --color-info: #3b82f6;
+}
+```
+
+### Method 2: Use Design Tokens
+
+```scss
+@use 'design-system' as ds;
+
+.my-component {
+  // Use tokens directly in your SCSS
+  color: var(--color-primary);
+  padding: var(--spacing-4);
+  border-radius: var(--radii-lg);
+  
+  &:hover {
+    background-color: var(--color-primary-soft);
+  }
+}
+```
+
+### Method 3: Import Component SCSS
+
+If you want to customize component styles:
+
+```scss
+// Import and override
+@use 'design-system/components/Button/Button.scss' with (
+  $button-primary-bg: #your-color
+);
+```
+
+---
+
+## 📚 Available Scripts
+
+```bash
+# Development
+yarn storybook          # Run Storybook on port 6006
+yarn dev                # Run Vite dev server
+
+# Building
+yarn build              # Build the library (TS + Vite)
+yarn build-storybook    # Build Storybook for deployment
+
+# Quality
+yarn typecheck          # Run TypeScript type checking
+```
+
+---
+
+## 📦 Build Output
+
+### Package Exports
+```json
+{
+  "main": "dist/index.js",       // CommonJS
+  "module": "dist/index.mjs",    // ESM
+  "types": "dist/index.d.ts",    // TypeScript
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.js"
+    },
+    "./styles.css": "./dist/design-system.css"
+  }
+}
+```
+
+### Bundle Sizes
+- **ESM**: ~186 KB (50 KB gzipped)
+- **CJS**: ~127 KB (41 KB gzipped)
+- **CSS**: ~11 KB (1.8 KB gzipped)
+
+---
+
+## 🎯 Key Features
+
+✅ **Type-Safe** - Full TypeScript support with exported types
+✅ **Tree-Shakeable** - Import only what you need
+✅ **Customizable** - SCSS variables and CSS custom properties
+✅ **Accessible** - Built on Radix UI primitives (WCAG compliant)
+✅ **Token-Based** - Consistent design with design tokens
+✅ **Documented** - Comprehensive Storybook documentation
+✅ **Production Ready** - Tested, built, and ready to publish
+
+---
+
+## 🔥 What Makes This Professional
+
+1. **Proper Token System** - Centralized colors, spacing, typography
+2. **Extends Radix UI** - More colors & variants than default
+3. **SCSS Architecture** - Clean, maintainable styles with nesting
+4. **Full TypeScript** - Type-safe props and exports
+5. **Component Variants** - Multiple styles per component
+6. **Error States** - Proper validation and error handling
+7. **Storybook Docs** - Every component fully documented
+8. **Build Optimization** - Tree-shaking, source maps, dual formats
+
+---
+
+## 🚢 Publishing to NPM
+
+```bash
+# 1. Update package.json name
+"name": "@yourcompany/design-system"
+
+# 2. Login to npm
+npm login
+
+# 3. Build
+yarn build
+
+# 4. Publish
+npm publish --access public
+```
+
+---
+
+## 📖 Next Steps
+
+1. **Run Storybook** to see all components:
+   ```bash
+   yarn storybook
+   ```
+
+2. **Customize colors** in `src/tokens/colors.ts`
+
+3. **Add more components** following the same pattern:
+   - Create component folder
+   - Add TypeScript component
+   - Add SCSS styles
+   - Create Storybook stories
+   - Export from `src/components/index.ts`
+
+4. **Test in your primary project** using `npm link`
+
+5. **Publish to npm** when ready
+
+---
+
+## 🎉 Summary
+
+You now have a **professional, production-ready design system** with:
+
+- ✅ 5 fully-functional components
+- ✅ Complete token system
+- ✅ SCSS styling architecture
+- ✅ TypeScript types
+- ✅ Storybook documentation
+- ✅ Build system configured
+- ✅ Ready to install as npm package
+
+The system is scalable, maintainable, and follows industry best practices used by companies like Shopify, Atlassian, and GitHub.
+
+**You're ready to use this in your primary project!** 🚀

package/dist/.storybook/ColorTokenSelect.d.ts

@@ -0,0 +1,14 @@
+/**
+ * ColorTokenSelect Component
+ * A custom color token selector with visual color swatches for Storybook
+ */
+import React from "react";
+import type { ColorToken } from "../src/tokens";
+import "./ColorTokenSelect.css";
+interface ColorTokenSelectProps {
+    value?: ColorToken;
+    onChange: (value: ColorToken) => void;
+    label?: string;
+}
+export declare const ColorTokenSelect: React.FC<ColorTokenSelectProps>;
+export {};

package/dist/.storybook/colorTokenOptions.d.ts

@@ -0,0 +1,28 @@
+/**
+ * Centralized color token options for Storybook controls
+ * Provides both array and hierarchical formats for color token selection
+ */
+import type { ColorToken } from "../src/tokens";
+/**
+ * All available color tokens as a flat array
+ * Use this for simple select controls in Storybook
+ */
+export declare const colorTokenOptions: ColorToken[];
+/**
+ * Creates hierarchical color token options organized by color family and type
+ * Use this for grouped/hierarchical select controls in Storybook
+ *
+ * @returns Record of label to ColorToken mappings (e.g., "Blue / Solid / blue-9" -> "blue-9")
+ *
+ * @example
+ * ```ts
+ * const options = createColorTokenOptions();
+ * // Use Object.values(options) for the select control options
+ * ```
+ */
+export declare const createColorTokenOptions: () => Record<string, ColorToken>;
+/**
+ * Pre-created hierarchical color token options
+ * Use Object.values() to get the array of tokens for select controls
+ */
+export declare const hierarchicalColorTokenOptions: Record<string, ColorToken>;

package/dist/.storybook/iconOptions.d.ts

@@ -0,0 +1,54 @@
+/**
+ * Centralized icon options for Storybook controls
+ * Uses Solar icons via Iconify - supports all 7400+ Solar icons
+ */
+import React from "react";
+/**
+ * Popular Solar icon names for quick selection
+ * Users can also type any Solar icon name directly
+ */
+export declare const popularIcons: readonly ["none", "check-circle-bold", "check-square-bold", "close-circle-bold", "close-square-bold", "danger-circle-bold", "danger-triangle-bold", "info-circle-bold", "info-square-bold", "arrow-left-bold", "arrow-right-bold", "arrow-up-bold", "arrow-down-bold", "alt-arrow-left-bold", "alt-arrow-right-bold", "alt-arrow-up-bold", "alt-arrow-down-bold", "add-circle-bold", "add-square-bold", "minus-circle-bold", "minus-square-bold", "trash-bin-trash-bold", "trash-bin-minimalistic-bold", "pen-bold", "pen-new-square-bold", "user-bold", "user-circle-bold", "user-rounded-bold", "users-group-rounded-bold", "home-bold", "home-angle-bold", "settings-bold", "settings-minimalistic-bold", "letter-bold", "letter-opened-bold", "phone-bold", "phone-calling-bold", "chat-round-dots-bold", "chat-square-dots-bold", "bell-bold", "bell-bing-bold", "document-bold", "document-add-bold", "folder-bold", "folder-open-bold", "clipboard-bold", "clipboard-check-bold", "magnifer-bold", "calendar-bold", "calendar-add-bold", "star-bold", "star-circle-bold", "heart-bold", "heart-angle-bold", "eye-bold", "eye-closed-bold", "download-bold", "download-minimalistic-bold", "upload-bold", "upload-minimalistic-bold", "link-bold", "link-circle-bold", "filter-bold", "sort-bold", "refresh-bold", "refresh-circle-bold", "lock-bold", "lock-unlocked-bold", "logout-bold", "login-bold"];
+export type PopularIconName = (typeof popularIcons)[number];
+/**
+ * Render a Solar icon by name
+ * @param iconName - Solar icon name (e.g., "user-bold", "arrow-right-bold")
+ * @param width - Icon width (default: 16)
+ * @param height - Icon height (default: 16)
+ */
+export declare const renderSolarIcon: (iconName: string | null | undefined, width?: number, height?: number) => React.ReactNode;
+/**
+ * Get icon component for a given name
+ * @param iconName - Solar icon name or null
+ */
+export declare const getIcon: (iconName: string | null | undefined) => React.ReactNode;
+/**
+ * Popular icon options for Storybook select control
+ * Includes 'none' and common icons
+ */
+export declare const iconSelectOptions: readonly ["none", "check-circle-bold", "check-square-bold", "close-circle-bold", "close-square-bold", "danger-circle-bold", "danger-triangle-bold", "info-circle-bold", "info-square-bold", "arrow-left-bold", "arrow-right-bold", "arrow-up-bold", "arrow-down-bold", "alt-arrow-left-bold", "alt-arrow-right-bold", "alt-arrow-up-bold", "alt-arrow-down-bold", "add-circle-bold", "add-square-bold", "minus-circle-bold", "minus-square-bold", "trash-bin-trash-bold", "trash-bin-minimalistic-bold", "pen-bold", "pen-new-square-bold", "user-bold", "user-circle-bold", "user-rounded-bold", "users-group-rounded-bold", "home-bold", "home-angle-bold", "settings-bold", "settings-minimalistic-bold", "letter-bold", "letter-opened-bold", "phone-bold", "phone-calling-bold", "chat-round-dots-bold", "chat-square-dots-bold", "bell-bold", "bell-bing-bold", "document-bold", "document-add-bold", "folder-bold", "folder-open-bold", "clipboard-bold", "clipboard-check-bold", "magnifer-bold", "calendar-bold", "calendar-add-bold", "star-bold", "star-circle-bold", "heart-bold", "heart-angle-bold", "eye-bold", "eye-closed-bold", "download-bold", "download-minimalistic-bold", "upload-bold", "upload-minimalistic-bold", "link-bold", "link-circle-bold", "filter-bold", "sort-bold", "refresh-bold", "refresh-circle-bold", "lock-bold", "lock-unlocked-bold", "logout-bold", "login-bold"];
+/**
+ * Create icon mapping for Storybook
+ * Maps icon names to React components
+ */
+export declare const createIconMapping: () => Record<string, React.ReactNode>;
+/**
+ * Icon mapping for Storybook controls
+ */
+export declare const iconMapping: Record<string, React.ReactNode>;
+/**
+ * Helper to get all Solar icon names for documentation
+ * Note: Browse all 7400+ icons at https://icon-sets.iconify.design/solar/
+ */
+export declare const SOLAR_ICON_SET_URL = "https://icon-sets.iconify.design/solar/";
+/**
+ * Instructions for using custom Solar icons not in the popular list:
+ *
+ * 1. Browse icons at: https://icon-sets.iconify.design/solar/
+ * 2. Find your icon (e.g., "database-bold")
+ * 3. Use it in your story:
+ *    ```tsx
+ *    import { renderSolarIcon } from '../../../../.storybook/iconOptions';
+ *
+ *    <Component icon={renderSolarIcon('database-bold')} />
+ *    ```
+ */

package/dist/design-system.css

@@ -0,0 +1 @@
+.ds-accordion{background-color:var(--accordion-bg-color, transparent);border-radius:6px}.ds-accordion__item{border-bottom:1px solid var(--accordion-border-color, var(--gray-6))}.ds-accordion__item:last-child{border-bottom:none}.ds-accordion__header{display:flex}.ds-accordion__trigger{all:unset;box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;width:100%;padding:1rem;font-size:15px;line-height:1;color:var(--accordion-trigger-color, var(--gray-12));cursor:pointer;background-color:transparent;transition:background-color .2s ease}.ds-accordion__trigger:hover{background-color:var(--gray-2)}.ds-accordion__trigger:focus-visible{outline:2px solid var(--blue-8);outline-offset:-2px}.ds-accordion__trigger[data-state=open] .ds-accordion__chevron{transform:rotate(180deg)}.ds-accordion__chevron{transition:transform .3s cubic-bezier(.87,0,.13,1)}.ds-accordion__content{overflow:hidden;color:var(--accordion-content-color, var(--gray-11))}.ds-accordion__content[data-state=open]{animation:ds-accordion-slide-down .3s cubic-bezier(.87,0,.13,1)}.ds-accordion__content[data-state=closed]{animation:ds-accordion-slide-up .3s cubic-bezier(.87,0,.13,1)}.ds-accordion__content-inner{padding:1rem}@keyframes ds-accordion-slide-down{0%{height:0}to{height:var(--radix-accordion-content-height)}}@keyframes ds-accordion-slide-up{0%{height:var(--radix-accordion-content-height)}to{height:0}}.ds-alert-dialog__overlay{background-color:var(--alert-dialog-overlay-color, rgba(0, 0, 0, .5));position:fixed;top:0;right:0;bottom:0;left:0;animation:ds-alert-dialog-overlay-show .15s cubic-bezier(.16,1,.3,1);z-index:9999}.ds-alert-dialog__content{background-color:var(--alert-dialog-bg-color, var(--gray-1));border-radius:8px;box-shadow:0 10px 38px -10px #00000059,0 10px 20px -15px #0003;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:90vw;max-width:450px;max-height:85vh;padding:1.5rem;animation:ds-alert-dialog-content-show .15s cubic-bezier(.16,1,.3,1);z-index:10000}.ds-alert-dialog__content:focus{outline:none}.ds-alert-dialog__title{margin:0 0 1rem;font-weight:600;font-size:17px;color:var(--alert-dialog-title-color, var(--gray-12))}.ds-alert-dialog__description{margin:0 0 1.5rem;font-size:15px;line-height:1.5;color:var(--alert-dialog-desc-color, var(--gray-11))}.ds-alert-dialog__actions{display:flex;gap:.75rem;justify-content:flex-end}.ds-alert-dialog__button{all:unset;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;border-radius:4px;padding:.5rem 1rem;font-size:15px;line-height:1;font-weight:500;cursor:pointer;transition:background-color .2s ease}.ds-alert-dialog__button:focus-visible{outline:2px solid var(--blue-8);outline-offset:2px}.ds-alert-dialog__button--cancel{background-color:var(--gray-4);color:var(--gray-12)}.ds-alert-dialog__button--cancel:hover{background-color:var(--gray-5)}.ds-alert-dialog__button--cancel:active{background-color:var(--gray-6)}.ds-alert-dialog__button--action{background-color:var(--alert-dialog-action-color, var(--red-9));color:#fff}.ds-alert-dialog__button--action:hover{background-color:var(--red-10)}.ds-alert-dialog__button--action:active{background-color:var(--red-11)}@keyframes ds-alert-dialog-overlay-show{0%{opacity:0}to{opacity:1}}@keyframes ds-alert-dialog-content-show{0%{opacity:0;transform:translate(-50%,-48%) scale(.96)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}.ds-avatar{background-color:var(--avatar-bg-color);color:var(--avatar-text-color)}.ds-badge{display:inline-flex;align-items:center;gap:.25rem}.ds-badge[style*=--badge-bg-color]{background-color:var(--badge-bg-color)!important}.ds-badge[style*=--badge-text-color]{color:var(--badge-text-color)!important}.ds-badge[style*=--badge-border-color]{box-shadow:inset 0 0 0 1px var(--badge-border-color)!important}.ds-badge--with-icon .ds-badge__icon{display:inline-flex;align-items:center;justify-content:center;line-height:1}.ds-badge--with-icon .ds-badge__icon svg{width:.75rem;height:.75rem}.ds-badge--accent[data-variant=solid]{background-color:var(--accent-9);color:var(--accent-contrast)}.ds-badge--accent[data-variant=soft]{background-color:var(--accent-a3);color:var(--accent-a11)}.ds-badge--accent[data-variant=surface]{background-color:var(--accent-a2);color:var(--accent-a11)}.ds-badge--accent[data-variant=outline]{box-shadow:inset 0 0 0 1px var(--accent-a7);color:var(--accent-a11)}.ds-badge--accent[data-high-contrast=true][data-variant=soft],.ds-badge--accent[data-high-contrast=true][data-variant=surface]{color:var(--accent-12)}.ds-badge--accent[data-high-contrast=true][data-variant=outline]{box-shadow:inset 0 0 0 1px var(--accent-a8);color:var(--accent-12)}.ds-badge--neutral[data-variant=solid]{background-color:var(--gray-9);color:var(--gray-contrast)}.ds-badge--neutral[data-variant=soft]{background-color:var(--gray-a3);color:var(--gray-a11)}.ds-badge--neutral[data-variant=surface]{background-color:var(--gray-a2);color:var(--gray-a11)}.ds-badge--neutral[data-variant=outline]{box-shadow:inset 0 0 0 1px var(--gray-a7);color:var(--gray-a11)}.ds-badge--neutral[data-high-contrast=true][data-variant=soft],.ds-badge--neutral[data-high-contrast=true][data-variant=surface]{color:var(--gray-12)}.ds-badge--neutral[data-high-contrast=true][data-variant=outline]{box-shadow:inset 0 0 0 1px var(--gray-a8);color:var(--gray-12)}.ds-badge--error[data-variant=solid]{background-color:var(--red-9);color:#fff}.ds-badge--error[data-variant=soft]{background-color:var(--red-a3);color:var(--red-a11)}.ds-badge--error[data-variant=surface]{background-color:var(--red-a2);color:var(--red-a11)}.ds-badge--error[data-variant=outline]{box-shadow:inset 0 0 0 1px var(--red-a7);color:var(--red-a11)}.ds-badge--error[data-high-contrast=true][data-variant=soft],.ds-badge--error[data-high-contrast=true][data-variant=surface]{color:var(--red-12)}.ds-badge--error[data-high-contrast=true][data-variant=outline]{box-shadow:inset 0 0 0 1px var(--red-a8);color:var(--red-12)}.ds-badge--success[data-variant=solid]{background-color:var(--green-9);color:#fff}.ds-badge--success[data-variant=soft]{background-color:var(--green-a3);color:var(--green-a11)}.ds-badge--success[data-variant=surface]{background-color:var(--green-a2);color:var(--green-a11)}.ds-badge--success[data-variant=outline]{box-shadow:inset 0 0 0 1px var(--green-a7);color:var(--green-a11)}.ds-badge--success[data-high-contrast=true][data-variant=soft],.ds-badge--success[data-high-contrast=true][data-variant=surface]{color:var(--green-12)}.ds-badge--success[data-high-contrast=true][data-variant=outline]{box-shadow:inset 0 0 0 1px var(--green-a8);color:var(--green-12)}.ds-badge--warning[data-variant=solid]{background-color:var(--orange-9);color:#fff}.ds-badge--warning[data-variant=soft]{background-color:var(--orange-a3);color:var(--orange-a11)}.ds-badge--warning[data-variant=surface]{background-color:var(--orange-a2);color:var(--orange-a11)}.ds-badge--warning[data-variant=outline]{box-shadow:inset 0 0 0 1px var(--orange-a7);color:var(--orange-a11)}.ds-badge--warning[data-high-contrast=true][data-variant=soft],.ds-badge--warning[data-high-contrast=true][data-variant=surface]{color:var(--orange-12)}.ds-badge--warning[data-high-contrast=true][data-variant=outline]{box-shadow:inset 0 0 0 1px var(--orange-a8);color:var(--orange-12)}.ds-badge--info[data-variant=solid]{background-color:var(--blue-9);color:#fff}.ds-badge--info[data-variant=soft]{background-color:var(--blue-a3);color:var(--blue-a11)}.ds-badge--info[data-variant=surface]{background-color:var(--blue-a2);color:var(--blue-a11)}.ds-badge--info[data-variant=outline]{box-shadow:inset 0 0 0 1px var(--blue-a7);color:var(--blue-a11)}.ds-badge--info[data-high-contrast=true][data-variant=soft],.ds-badge--info[data-high-contrast=true][data-variant=surface]{color:var(--blue-12)}.ds-badge--info[data-high-contrast=true][data-variant=outline]{box-shadow:inset 0 0 0 1px var(--blue-a8);color:var(--blue-12)}.ds-button{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;transition:all .15s ease-in-out;cursor:pointer;font-weight:500}.ds-button[style*=--button-bg-color]{background-color:var(--button-bg-color)!important}.ds-button[style*=--button-text-color]{color:var(--button-text-color)!important}.ds-button[style*=--button-border-color]{border-color:var(--button-border-color)!important}.ds-button--full-width{width:100%}.ds-button[data-loading=true]{cursor:wait;pointer-events:none}.ds-button--primary[data-variant=solid],.ds-button.ds-button--primary.rt-Button[data-variant=solid]{background-color:var(--color-primary, #0190ff)!important;color:#fff!important;border-color:var(--color-primary, #0190ff)!important}.ds-button--primary[data-variant=solid]:hover:not(:disabled),.ds-button.ds-button--primary.rt-Button[data-variant=solid]:hover:not(:disabled){background-color:var(--color-primary-hover, #0180e6)!important;border-color:var(--color-primary-hover, #0180e6)!important}.ds-button--primary[data-variant=soft],.ds-button.ds-button--primary.rt-Button[data-variant=soft]{background-color:var(--color-primary-soft, #e6f5ff)!important;color:var(--color-primary, #0190ff)!important}.ds-button--primary[data-variant=outline],.ds-button.ds-button--primary.rt-Button[data-variant=outline]{border:1px solid var(--color-primary, #0190ff)!important;color:var(--color-primary, #0190ff)!important;background-color:transparent!important}.ds-button--primary[data-variant=ghost],.ds-button.ds-button--primary.rt-Button[data-variant=ghost]{background-color:transparent!important;color:var(--color-primary, #0190ff)!important}.ds-button--primary[data-variant=ghost]:hover:not(:disabled),.ds-button.ds-button--primary.rt-Button[data-variant=ghost]:hover:not(:disabled){background-color:var(--color-primary-soft, #e6f5ff)!important}.ds-button--secondary[data-variant=solid],.ds-button.ds-button--secondary.rt-Button[data-variant=solid]{background-color:var(--color-secondary, #64748b)!important;color:#fff!important;border-color:var(--color-secondary, #64748b)!important}.ds-button--secondary[data-variant=solid]:hover:not(:disabled),.ds-button.ds-button--secondary.rt-Button[data-variant=solid]:hover:not(:disabled){background-color:var(--color-secondary-hover, #475569)!important;border-color:var(--color-secondary-hover, #475569)!important}.ds-button--secondary[data-variant=soft],.ds-button.ds-button--secondary.rt-Button[data-variant=soft]{background-color:var(--color-secondary-soft, #f1f5f9)!important;color:var(--color-secondary, #64748b)!important}.ds-button--accent[data-variant=solid],.ds-button.ds-button--accent.rt-Button[data-variant=solid]{background-color:var(--color-accent, #d946ef)!important;color:#fff!important;border-color:var(--color-accent, #d946ef)!important}.ds-button--accent[data-variant=solid]:hover:not(:disabled),.ds-button.ds-button--accent.rt-Button[data-variant=solid]:hover:not(:disabled){background-color:var(--color-accent-hover, #c026d3)!important;border-color:var(--color-accent-hover, #c026d3)!important}.ds-button--accent[data-variant=soft],.ds-button.ds-button--accent.rt-Button[data-variant=soft]{background-color:var(--color-accent-soft, #fae8ff)!important;color:var(--color-accent, #d946ef)!important}.ds-button--success[data-variant=solid],.ds-button.ds-button--success.rt-Button[data-variant=solid]{background-color:var(--color-success, #10b981)!important;color:#fff!important;border-color:var(--color-success, #10b981)!important}.ds-button--success[data-variant=solid]:hover:not(:disabled),.ds-button.ds-button--success.rt-Button[data-variant=solid]:hover:not(:disabled){background-color:var(--color-success-hover, #059669)!important;border-color:var(--color-success-hover, #059669)!important}.ds-button--success[data-variant=soft],.ds-button.ds-button--success.rt-Button[data-variant=soft]{background-color:var(--color-success-soft, #d1fae5)!important;color:var(--color-success, #059669)!important}.ds-button--error[data-variant=solid],.ds-button.ds-button--error.rt-Button[data-variant=solid]{background-color:var(--color-error, #ef4444)!important;color:#fff!important;border-color:var(--color-error, #ef4444)!important}.ds-button--error[data-variant=solid]:hover:not(:disabled),.ds-button.ds-button--error.rt-Button[data-variant=solid]:hover:not(:disabled){background-color:var(--color-error-hover, #dc2626)!important;border-color:var(--color-error-hover, #dc2626)!important}.ds-button--error[data-variant=soft],.ds-button.ds-button--error.rt-Button[data-variant=soft]{background-color:var(--color-error-soft, #fee2e2)!important;color:var(--color-error, #dc2626)!important}.ds-button--warning[data-variant=solid],.ds-button.ds-button--warning.rt-Button[data-variant=solid]{background-color:var(--color-warning, #f59e0b)!important;color:#fff!important;border-color:var(--color-warning, #f59e0b)!important}.ds-button--warning[data-variant=solid]:hover:not(:disabled),.ds-button.ds-button--warning.rt-Button[data-variant=solid]:hover:not(:disabled){background-color:var(--color-warning-hover, #d97706)!important;border-color:var(--color-warning-hover, #d97706)!important}.ds-button--warning[data-variant=soft],.ds-button.ds-button--warning.rt-Button[data-variant=soft]{background-color:var(--color-warning-soft, #fed7aa)!important;color:var(--color-warning, #d97706)!important}.ds-button--info[data-variant=solid],.ds-button.ds-button--info.rt-Button[data-variant=solid]{background-color:var(--color-info, #3b82f6)!important;color:#fff!important;border-color:var(--color-info, #3b82f6)!important}.ds-button--info[data-variant=solid]:hover:not(:disabled),.ds-button.ds-button--info.rt-Button[data-variant=solid]:hover:not(:disabled){background-color:var(--color-info-hover, #2563eb)!important;border-color:var(--color-info-hover, #2563eb)!important}.ds-button--info[data-variant=soft],.ds-button.ds-button--info.rt-Button[data-variant=soft]{background-color:var(--color-info-soft, #dbeafe)!important;color:var(--color-info, #2563eb)!important}.ds-button__spinner{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center}.ds-button__spinner-icon{width:1em;height:1em;animation:spin 1s linear infinite}.ds-button__spinner-circle{opacity:.25}.ds-button__spinner-path{opacity:.75}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.ds-button[data-loading=true]>*:not(.ds-button__spinner){opacity:0}.ds-button__icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}.ds-button__icon--left{margin-right:-.25rem}.ds-button__icon--right{margin-left:-.25rem}.ds-button:disabled{opacity:.5;cursor:not-allowed}.ds-card{background-color:var(--card-bg-color);border-color:var(--card-border-color);color:var(--card-text-color)}.ds-checkbox-wrapper{display:inline-flex;flex-direction:column}.ds-checkbox[style*=--checkbox-bg-color]{background-color:var(--checkbox-bg-color)!important}.ds-checkbox[style*=--checkbox-checked-color][data-state=checked]{background-color:var(--checkbox-checked-color)!important}.ds-checkbox[style*=--checkbox-border-color]{border-color:var(--checkbox-border-color)!important}.ds-checkbox[style*=--checkbox-checkmark-color] .rt-CheckboxIndicator{color:var(--checkbox-checkmark-color)!important}.ds-checkbox-container{display:inline-flex;align-items:flex-start;gap:.75rem}.ds-checkbox-label-container{display:flex;flex-direction:column;gap:.25rem}.ds-checkbox-label{font-size:.875rem;font-weight:500;color:var(--gray-12);cursor:pointer;-webkit-user-select:none;user-select:none;line-height:1.5}.ds-checkbox-helper{font-size:.75rem;color:var(--gray-11);line-height:1.4}.ds-checkbox-helper--error{color:var(--color-error, #ef4444)}.ds-checkbox-wrapper--primary .rt-CheckboxButton[data-state=checked]{background-color:var(--color-primary, #0ea5e9);border-color:var(--color-primary, #0ea5e9)}.ds-checkbox-wrapper--secondary .rt-CheckboxButton[data-state=checked]{background-color:var(--color-secondary, #64748b);border-color:var(--color-secondary, #64748b)}.ds-checkbox-wrapper--accent .rt-CheckboxButton[data-state=checked]{background-color:var(--color-accent, #d946ef);border-color:var(--color-accent, #d946ef)}.ds-checkbox-wrapper--success .rt-CheckboxButton[data-state=checked]{background-color:var(--color-success, #10b981);border-color:var(--color-success, #10b981)}.ds-checkbox-wrapper--error .rt-CheckboxButton{border-color:var(--color-error, #ef4444)}.ds-checkbox-wrapper--error .rt-CheckboxButton[data-state=checked]{background-color:var(--color-error, #ef4444);border-color:var(--color-error, #ef4444)}.ds-checkbox-wrapper--warning .rt-CheckboxButton[data-state=checked]{background-color:var(--color-warning, #f59e0b);border-color:var(--color-warning, #f59e0b)}.ds-checkbox-wrapper--primary .rt-CheckboxButton[data-state=indeterminate]{background-color:var(--color-primary, #0ea5e9);border-color:var(--color-primary, #0ea5e9)}.ds-checkbox:disabled{opacity:.5;cursor:not-allowed}.ds-checkbox:disabled~.ds-checkbox-label-container .ds-checkbox-label{opacity:.5;cursor:not-allowed}.ds-dialog__overlay{background-color:var(--dialog-overlay-color, rgba(0, 0, 0, .5));position:fixed;top:0;right:0;bottom:0;left:0;animation:ds-dialog-overlay-show .15s cubic-bezier(.16,1,.3,1);z-index:9999}.ds-dialog__content{background-color:var(--dialog-bg-color, var(--gray-1));border-radius:8px;box-shadow:0 10px 38px -10px #00000059,0 10px 20px -15px #0003;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:90vw;max-width:500px;max-height:85vh;padding:1.5rem;animation:ds-dialog-content-show .15s cubic-bezier(.16,1,.3,1);overflow-y:auto;z-index:10000}.ds-dialog__content:focus{outline:none}.ds-dialog__title{margin:0 0 .75rem;font-weight:600;font-size:18px;color:var(--dialog-title-color, var(--gray-12))}.ds-dialog__description{margin:0 0 1.25rem;font-size:15px;line-height:1.5;color:var(--dialog-desc-color, var(--gray-11))}.ds-dialog__close{all:unset;box-sizing:border-box;font-family:inherit;border-radius:4px;height:25px;width:25px;display:inline-flex;align-items:center;justify-content:center;color:var(--gray-11);position:absolute;top:1rem;right:1rem;cursor:pointer;transition:background-color .2s ease}.ds-dialog__close:hover{background-color:var(--gray-4)}.ds-dialog__close:focus-visible{outline:2px solid var(--blue-8);outline-offset:2px}@keyframes ds-dialog-overlay-show{0%{opacity:0}to{opacity:1}}@keyframes ds-dialog-content-show{0%{opacity:0;transform:translate(-50%,-48%) scale(.96)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}.ds-dropdown-menu{background-color:var(--dropdown-menu-bg-color);color:var(--dropdown-menu-text-color)}.ds-hover-card{background-color:var(--hover-card-bg-color);color:var(--hover-card-text-color)}.ds-label{color:var(--label-text-color, var(--gray-12));cursor:pointer;display:inline-block}.ds-label__required{color:var(--red-9);margin-left:.25rem}.ds-popover{background-color:var(--popover-bg-color);color:var(--popover-text-color)}.ds-progress{background-color:var(--progress-bg-color)}.ds-progress>div{background-color:var(--progress-fill-color)}.ds-progress-bar[style*=--progress-bg-color]{background-color:var(--progress-bg-color)!important}.ds-progress-bar[style*=--progress-fill-color] .rt-ProgressIndicator{background-color:var(--progress-fill-color)!important}.ds-progress-bar--indeterminate .rt-ProgressIndicator{animation:progress-indeterminate 1.5s ease-in-out infinite}.ds-progress-bar--primary[data-variant=classic] .rt-ProgressIndicator,.ds-progress-bar--primary[data-variant=surface] .rt-ProgressIndicator,.ds-progress-bar--primary[data-variant=soft] .rt-ProgressIndicator{background-color:var(--accent-9)}.ds-progress-bar--primary[data-high-contrast=true] .rt-ProgressIndicator{background-color:var(--accent-12)}.ds-progress-bar--secondary[data-variant=classic] .rt-ProgressIndicator,.ds-progress-bar--secondary[data-variant=surface] .rt-ProgressIndicator,.ds-progress-bar--secondary[data-variant=soft] .rt-ProgressIndicator{background-color:var(--gray-9)}.ds-progress-bar--secondary[data-high-contrast=true] .rt-ProgressIndicator{background-color:var(--gray-12)}.ds-progress-bar--accent[data-variant=classic] .rt-ProgressIndicator,.ds-progress-bar--accent[data-variant=surface] .rt-ProgressIndicator,.ds-progress-bar--accent[data-variant=soft] .rt-ProgressIndicator{background-color:var(--accent-9)}.ds-progress-bar--accent[data-high-contrast=true] .rt-ProgressIndicator{background-color:var(--accent-12)}.ds-progress-bar--success[data-variant=classic] .rt-ProgressIndicator,.ds-progress-bar--success[data-variant=surface] .rt-ProgressIndicator,.ds-progress-bar--success[data-variant=soft] .rt-ProgressIndicator{background-color:var(--green-9)}.ds-progress-bar--success[data-high-contrast=true] .rt-ProgressIndicator{background-color:var(--green-12)}.ds-progress-bar--error[data-variant=classic] .rt-ProgressIndicator,.ds-progress-bar--error[data-variant=surface] .rt-ProgressIndicator,.ds-progress-bar--error[data-variant=soft] .rt-ProgressIndicator{background-color:var(--red-9)}.ds-progress-bar--error[data-high-contrast=true] .rt-ProgressIndicator{background-color:var(--red-12)}.ds-progress-bar--warning[data-variant=classic] .rt-ProgressIndicator,.ds-progress-bar--warning[data-variant=surface] .rt-ProgressIndicator,.ds-progress-bar--warning[data-variant=soft] .rt-ProgressIndicator{background-color:var(--orange-9)}.ds-progress-bar--warning[data-high-contrast=true] .rt-ProgressIndicator{background-color:var(--orange-12)}.ds-progress-bar--info[data-variant=classic] .rt-ProgressIndicator,.ds-progress-bar--info[data-variant=surface] .rt-ProgressIndicator,.ds-progress-bar--info[data-variant=soft] .rt-ProgressIndicator{background-color:var(--cyan-9)}.ds-progress-bar--info[data-high-contrast=true] .rt-ProgressIndicator{background-color:var(--cyan-12)}.ds-progress-bar--neutral[data-variant=classic] .rt-ProgressIndicator,.ds-progress-bar--neutral[data-variant=surface] .rt-ProgressIndicator,.ds-progress-bar--neutral[data-variant=soft] .rt-ProgressIndicator{background-color:var(--gray-9)}.ds-progress-bar--neutral[data-high-contrast=true] .rt-ProgressIndicator{background-color:var(--gray-12)}@keyframes progress-indeterminate{0%{transform:translate(-100%)}to{transform:translate(400%)}}.ds-radio-group{color:var(--radio-group-text-color)}.ds-radio-group button[role=radio]{background-color:var(--radio-group-color);border-color:var(--radio-group-color)}.ds-scroll-area [data-radix-scroll-area-thumb]{background-color:var(--scroll-area-scrollbar-color)}.ds-select{background-color:var(--select-bg-color);color:var(--select-text-color)}.ds-separator{background-color:var(--separator-color, var(--gray-6))}.ds-separator[data-orientation=horizontal]{width:100%}.ds-separator[data-orientation=vertical]{height:100%}.ds-slider [data-radix-slider-track]{background-color:var(--slider-track-color)}.ds-slider [data-radix-slider-thumb]{background-color:var(--slider-thumb-color)}.ds-stepper{display:flex;width:100%}.ds-stepper--text-top-left,.ds-stepper--text-top-center,.ds-stepper--text-top-right,.ds-stepper--text-bottom-left,.ds-stepper--text-bottom-center,.ds-stepper--text-bottom-right{flex-direction:column;gap:.5rem}.ds-stepper--text-bottom-left .ds-stepper__text-container,.ds-stepper--text-bottom-center .ds-stepper__text-container,.ds-stepper--text-bottom-right .ds-stepper__text-container{order:2}.ds-stepper--text-bottom-left .ds-stepper__progress,.ds-stepper--text-bottom-center .ds-stepper__progress,.ds-stepper--text-bottom-right .ds-stepper__progress{order:1}.ds-stepper--text-left{flex-direction:column;gap:.5rem}.ds-stepper--text-right{flex-direction:row;align-items:center;gap:.75rem}.ds-stepper--text-right .ds-stepper__text-container{order:2}.ds-stepper--text-right .ds-stepper__progress{order:1;flex:1}.ds-stepper__text-container{display:flex;align-items:center;gap:.5rem}.ds-stepper--text-top-left .ds-stepper__text-container{justify-content:flex-start}.ds-stepper--text-top-center .ds-stepper__text-container{justify-content:center}.ds-stepper--text-top-right .ds-stepper__text-container{justify-content:flex-end}.ds-stepper--text-bottom-left .ds-stepper__text-container{justify-content:flex-start}.ds-stepper--text-bottom-center .ds-stepper__text-container{justify-content:center}.ds-stepper--text-bottom-right .ds-stepper__text-container{justify-content:flex-end}.ds-stepper__text{font-size:12px;font-weight:500;color:var(--stepper-text-color, var(--gray-12));line-height:1.5}.ds-stepper__text[data-size="1"]{font-size:11px}.ds-stepper__text[data-size="2"]{font-size:12px}.ds-stepper__text[data-size="3"]{font-size:13px}.ds-stepper__start-text,.ds-stepper__end-text{font-size:12px;font-weight:400;color:var(--stepper-text-color, var(--gray-11))}.ds-stepper__progress{background-color:var(--stepper-bg-color, var(--gray-a3))}.ds-stepper__progress .rt-ProgressIndicator{border-radius:9999px 0 0 9999px!important;background-color:var(--stepper-bar-color)!important}.ds-stepper--primary:not([style*=--stepper-bar-color]) .ds-stepper__progress[data-variant=classic] .rt-ProgressIndicator,.ds-stepper--primary:not([style*=--stepper-bar-color]) .ds-stepper__progress[data-variant=surface] .rt-ProgressIndicator,.ds-stepper--primary:not([style*=--stepper-bar-color]) .ds-stepper__progress[data-variant=soft] .rt-ProgressIndicator{background-color:var(--accent-9)!important}.ds-stepper--primary:not([style*=--stepper-bar-color]) .ds-stepper__progress[data-high-contrast=true] .rt-ProgressIndicator{background-color:var(--accent-12)!important}.ds-stepper--secondary:not([style*=--stepper-bar-color]) .ds-stepper__progress[data-variant=classic] .rt-ProgressIndicator,.ds-stepper--secondary:not([style*=--stepper-bar-color]) .ds-stepper__progress[data-variant=surface] .rt-ProgressIndicator,.ds-stepper--secondary:not([style*=--stepper-bar-color]) .ds-stepper__progress[data-variant=soft] .rt-ProgressIndicator{background-color:var(--gray-9)!important}.ds-stepper--secondary:not([style*=--stepper-bar-color]) .ds-stepper__progress[data-high-contrast=true] .rt-ProgressIndicator{background-color:var(--gray-12)!important}.ds-stepper--accent:not([style*=--stepper-bar-color]) .ds-stepper__progress[data-variant=classic] .rt-ProgressIndicator,.ds-stepper--accent:not([style*=--stepper-bar-color]) .ds-stepper__progress[data-variant=surface] .rt-ProgressIndicator,.ds-stepper--accent:not([style*=--stepper-bar-color]) .ds-stepper__progress[data-variant=soft] .rt-ProgressIndicator{background-color:var(--accent-9)!important}.ds-stepper--accent:not([style*=--stepper-bar-color]) .ds-stepper__progress[data-high-contrast=true] .rt-ProgressIndicator{background-color:var(--accent-12)!important}.ds-stepper--success:not([style*=--stepper-bar-color]) .ds-stepper__progress[data-variant=classic] .rt-ProgressIndicator,.ds-stepper--success:not([style*=--stepper-bar-color]) .ds-stepper__progress[data-variant=surface] .rt-ProgressIndicator,.ds-stepper--success:not([style*=--stepper-bar-color]) .ds-stepper__progress[data-variant=soft] .rt-ProgressIndicator{background-color:var(--green-9)!important}.ds-stepper--success:not([style*=--stepper-bar-color]) .ds-stepper__progress[data-high-contrast=true] .rt-ProgressIndicator{background-color:var(--green-12)!important}.ds-stepper--error:not([style*=--stepper-bar-color]) .ds-stepper__progress[data-variant=classic] .rt-ProgressIndicator,.ds-stepper--error:not([style*=--stepper-bar-color]) .ds-stepper__progress[data-variant=surface] .rt-ProgressIndicator,.ds-stepper--error:not([style*=--stepper-bar-color]) .ds-stepper__progress[data-variant=soft] .rt-ProgressIndicator{background-color:var(--red-9)!important}.ds-stepper--error:not([style*=--stepper-bar-color]) .ds-stepper__progress[data-high-contrast=true] .rt-ProgressIndicator{background-color:var(--red-12)!important}.ds-stepper--warning:not([style*=--stepper-bar-color]) .ds-stepper__progress[data-variant=classic] .rt-ProgressIndicator,.ds-stepper--warning:not([style*=--stepper-bar-color]) .ds-stepper__progress[data-variant=surface] .rt-ProgressIndicator,.ds-stepper--warning:not([style*=--stepper-bar-color]) .ds-stepper__progress[data-variant=soft] .rt-ProgressIndicator{background-color:var(--orange-9)!important}.ds-stepper--warning:not([style*=--stepper-bar-color]) .ds-stepper__progress[data-high-contrast=true] .rt-ProgressIndicator{background-color:var(--orange-12)!important}.ds-stepper--info:not([style*=--stepper-bar-color]) .ds-stepper__progress[data-variant=classic] .rt-ProgressIndicator,.ds-stepper--info:not([style*=--stepper-bar-color]) .ds-stepper__progress[data-variant=surface] .rt-ProgressIndicator,.ds-stepper--info:not([style*=--stepper-bar-color]) .ds-stepper__progress[data-variant=soft] .rt-ProgressIndicator{background-color:var(--cyan-9)!important}.ds-stepper--info:not([style*=--stepper-bar-color]) .ds-stepper__progress[data-high-contrast=true] .rt-ProgressIndicator{background-color:var(--cyan-12)!important}.ds-stepper--neutral:not([style*=--stepper-bar-color]) .ds-stepper__progress[data-variant=classic] .rt-ProgressIndicator,.ds-stepper--neutral:not([style*=--stepper-bar-color]) .ds-stepper__progress[data-variant=surface] .rt-ProgressIndicator,.ds-stepper--neutral:not([style*=--stepper-bar-color]) .ds-stepper__progress[data-variant=soft] .rt-ProgressIndicator{background-color:var(--gray-9)!important}.ds-stepper--neutral:not([style*=--stepper-bar-color]) .ds-stepper__progress[data-high-contrast=true] .rt-ProgressIndicator{background-color:var(--gray-12)!important}.ds-switch-wrapper{display:inline-flex;flex-direction:column;gap:.375rem}.ds-switch[style*=--switch-bg-color]{background-color:var(--switch-bg-color)!important}.ds-switch[style*=--switch-checked-color][data-state=checked]{background-color:var(--switch-checked-color)!important}.ds-switch[style*=--switch-thumb-color] .rt-SwitchThumb{background-color:var(--switch-thumb-color)!important}.ds-switch-container{display:inline-flex;align-items:center;gap:.75rem}.ds-switch-wrapper--label-left .ds-switch-container{flex-direction:row-reverse;justify-content:flex-end}.ds-switch-label{font-size:.875rem;font-weight:500;color:var(--gray-12);cursor:pointer;-webkit-user-select:none;user-select:none}.ds-switch-helper{font-size:.75rem;color:var(--gray-11);line-height:1.4;padding-left:2.5rem}.ds-switch-wrapper--label-left .ds-switch-helper{padding-left:0;padding-right:2.5rem;text-align:right}.ds-switch-wrapper--primary .rt-SwitchButton[data-state=checked]{background-color:var(--color-primary, #0ea5e9)}.ds-switch-wrapper--secondary .rt-SwitchButton[data-state=checked]{background-color:var(--color-secondary, #64748b)}.ds-switch-wrapper--accent .rt-SwitchButton[data-state=checked]{background-color:var(--color-accent, #d946ef)}.ds-switch-wrapper--success .rt-SwitchButton[data-state=checked]{background-color:var(--color-success, #10b981)}.ds-switch-wrapper--error .rt-SwitchButton[data-state=checked]{background-color:var(--color-error, #ef4444)}.ds-switch-wrapper--warning .rt-SwitchButton[data-state=checked]{background-color:var(--color-warning, #f59e0b)}.ds-switch:disabled{opacity:.5;cursor:not-allowed}.ds-switch:disabled~.ds-switch-label{opacity:.5;cursor:not-allowed}.ds-tabs{color:var(--tabs-text-color)}.ds-tabs [data-state=active]{color:var(--tabs-active-color)}.ds-toast{background-color:var(--toast-bg-color);color:var(--toast-text-color)}.ds-toast__title{font-weight:600;margin-bottom:.25rem}.ds-toast__message{font-size:.9em;opacity:.9}.ds-toggle--primary[data-state=checked]{background-color:var(--toggle-active-color, var(--blue-9))}.ds-toggle--secondary[data-state=checked]{background-color:var(--toggle-active-color, var(--gray-9))}.ds-toggle--accent[data-state=checked]{background-color:var(--toggle-active-color, var(--purple-9))}.ds-toggle--success[data-state=checked]{background-color:var(--toggle-active-color, var(--green-9))}.ds-toggle--error[data-state=checked]{background-color:var(--toggle-active-color, var(--red-9))}.ds-toggle--warning[data-state=checked]{background-color:var(--toggle-active-color, var(--orange-9))}.ds-toggle{background-color:var(--toggle-bg-color);color:var(--toggle-text-color)}.ds-toggle-wrapper{display:inline-flex;align-items:center;gap:.5rem}.ds-toggle-label{color:var(--toggle-text-color, var(--gray-12));cursor:pointer;-webkit-user-select:none;user-select:none}.ds-tooltip{background-color:var(--tooltip-bg-color);color:var(--tooltip-text-color)}.ds-radio-selector{display:flex;align-items:center;gap:var(--spacing-4, 16px);padding:var(--spacing-4, 16px);width:590px;border-radius:var(--radius-3, 6px);cursor:pointer;transition:all .2s ease;position:relative;overflow:hidden;border:1px solid var(--radio-selector-default-border, var(--slate-5, #e0e1e6));background:transparent}.ds-radio-selector--active{border-color:var(--radio-selector-active-border, var(--blue-9, #0090ff));background:var(--radio-selector-active-bg, var(--blue-a2, rgba(0, 140, 255, .04)))}.ds-radio-selector--disabled{opacity:.5;cursor:not-allowed}.ds-radio-selector:not(.ds-radio-selector--active):not(.ds-radio-selector--disabled):hover{border-color:var(--slate-7, #b6bcc6)}.ds-radio-selector:focus-visible{outline:2px solid var(--blue-9, #0090ff);outline-offset:2px}.ds-radio-selector__icon{display:flex;align-items:center;justify-content:center;width:24px;height:24px;flex-shrink:0;color:var(--slate-10, #80838d)}.ds-radio-selector--active .ds-radio-selector__icon{color:var(--radio-selector-active-text, var(--blue-9, #0090ff))}.ds-radio-selector__content{display:flex;flex-direction:column;gap:8px;flex:1;min-width:0}.ds-radio-selector__title{font-family:var(--typography-font-family-text, "SF Pro", sans-serif);font-size:var(--typography-font-size-2, 14px);font-weight:700;line-height:var(--typography-line-height-2, 20px);letter-spacing:var(--typography-letter-spacing-2, 0px);color:var(--radio-selector-default-text, var(--slate-dark-8, #4c5155));font-variation-settings:"wdth" 100}.ds-radio-selector--active .ds-radio-selector__title{color:var(--radio-selector-active-text, var(--blue-9, #0090ff))}.ds-radio-selector__subtext{font-family:var(--typography-font-family-text, "SF Pro", sans-serif);font-size:var(--typography-font-size-1, 12px);font-weight:510;line-height:var(--typography-line-height-1, 16px);letter-spacing:var(--typography-letter-spacing-1, .04px);color:var(--slate-10, #80838d);font-variation-settings:"wdth" 100}.ds-radio-selector--active .ds-radio-selector__subtext{color:var(--blue-8, #5eb1ef)}.ds-radio-selector__check{display:flex;align-items:center;justify-content:center;padding:7px;flex-shrink:0;color:var(--radio-selector-active-text, var(--blue-9, #0090ff))}.ds-checkbox-chip{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:var(--spacing-4, 16px);border-radius:var(--radius-4, 8px);cursor:pointer;transition:border-color .15s ease,background-color .15s ease;border:1px solid var(--checkbox-chip-default-border, var(--slate-5, #e0e1e6));background:transparent;white-space:nowrap;font-family:inherit;font-size:inherit;outline:none}.ds-checkbox-chip--checked{border-color:var(--checkbox-chip-checked-border, var(--blue-9, #0090ff));background:var(--checkbox-chip-checked-bg, var(--blue-a2, rgba(0, 140, 255, .04)))}.ds-checkbox-chip--disabled{opacity:.5;cursor:not-allowed}.ds-checkbox-chip:not(.ds-checkbox-chip--checked):not(.ds-checkbox-chip--disabled):hover{border-color:var(--slate-7, #b6bcc6)}.ds-checkbox-chip:focus-visible{outline:2px solid var(--blue-9, #0090ff);outline-offset:2px}.ds-checkbox-chip__icon{display:flex;align-items:center;justify-content:center;width:20px;height:20px;padding:7px;flex-shrink:0;color:var(--checkbox-chip-default-icon, var(--slate-dark-8, #5a6169));transition:color .15s ease}.ds-checkbox-chip--checked .ds-checkbox-chip__icon{color:var(--checkbox-chip-checked-icon, var(--blue-9, #0090ff))}.ds-checkbox-chip__label{font-family:var(--typography-font-family-text, "SF Pro", sans-serif);font-size:var(--typography-font-size-2, 14px);font-weight:700;line-height:var(--typography-line-height-2, 20px);letter-spacing:var(--typography-letter-spacing-2, 0px);color:var(--checkbox-chip-default-text, var(--slate-dark-8, #5a6169));font-variation-settings:"wdth" 100;transition:color .15s ease,padding-right .15s ease}.ds-checkbox-chip--checked .ds-checkbox-chip__label{color:var(--checkbox-chip-checked-text, var(--blue-9, #0090ff));padding-right:30px}.ds-checkbox-chip__check{position:absolute;right:16px;top:50%;transform:translateY(-50%) scale(.5);display:flex;align-items:center;justify-content:center;width:20px;height:20px;flex-shrink:0;color:var(--checkbox-chip-checked-icon, var(--blue-9, #0090ff));opacity:0;transition:opacity .12s ease,transform .12s cubic-bezier(.34,1.56,.64,1)}.ds-checkbox-chip--checked .ds-checkbox-chip__check{opacity:1;transform:translateY(-50%) scale(1)}.ds-checkbox-chip-group{width:100%;height:100%}.ds-checkbox-chip-group__container{display:flex;flex-wrap:wrap;gap:8px;width:100%}.ds-checkbox-chip-group--scrollable{overflow:hidden}.ds-checkbox-chip-group--scrollable .ds-checkbox-chip-group__container{max-height:calc(var(--max-rows, 4) * 60px - 8px);overflow-y:auto;padding-right:4px}.ds-checkbox-chip-group--scrollable .ds-checkbox-chip-group__container::-webkit-scrollbar{width:6px}.ds-checkbox-chip-group--scrollable .ds-checkbox-chip-group__container::-webkit-scrollbar-track{background:var(--slate-3, #f0f0f3);border-radius:3px}.ds-checkbox-chip-group--scrollable .ds-checkbox-chip-group__container::-webkit-scrollbar-thumb{background:var(--slate-7, #b6bcc6);border-radius:3px}.ds-checkbox-chip-group--scrollable .ds-checkbox-chip-group__container::-webkit-scrollbar-thumb:hover{background:var(--slate-8, #9ba1ae)}.ds-checkbox-chip-group--scrollable .ds-checkbox-chip-group__container{scrollbar-width:thin;scrollbar-color:var(--slate-7, #b6bcc6) var(--slate-3, #f0f0f3)}.ds-onboarding-info-box{display:flex;flex-direction:column;gap:24px;padding:24px;border-radius:var(--radius-4, 8px);background:var(--onboarding-info-box-bg, var(--slate-3, #f0f0f3));border:1px solid var(--onboarding-info-box-border, var(--slate-5, #e0e1e6));width:100%;height:100%}.ds-onboarding-info-box__title{font-family:var(--typography-font-family-text, "SF Pro", sans-serif);font-size:var(--typography-font-size-6, 24px);font-weight:510;line-height:var(--typography-line-height-6, 30px);letter-spacing:var(--typography-letter-spacing-6, -.1px);color:var(--onboarding-info-box-title, var(--gray-12, #202020));font-variation-settings:"wdth" 100;margin:0;white-space:nowrap}.ds-onboarding-info-box__items{display:flex;flex-direction:column;gap:12px;width:100%}.ds-onboarding-info-box__item{display:flex;align-items:center;gap:16px;padding:var(--spacing-4, 16px);border-radius:var(--radius-3, 6px);background:var(--onboarding-info-box-item-bg, var(--slate-1, #fcfcfd));width:100%;overflow:hidden;pointer-events:none}.ds-onboarding-info-box__item-icon{display:flex;align-items:center;justify-content:center;width:24px;height:24px;flex-shrink:0;color:var(--onboarding-info-box-icon, #b9bbc6)}.ds-onboarding-info-box__item-content{display:flex;flex-direction:column;gap:8px;flex:1;min-width:0}.ds-onboarding-info-box__item-title{font-family:var(--typography-font-family-text, "SF Pro", sans-serif);font-size:var(--typography-font-size-2, 14px);font-weight:700;line-height:var(--typography-line-height-2, 20px);letter-spacing:var(--typography-letter-spacing-2, 0px);color:var(--onboarding-info-box-item-title, var(--slate-dark-8, #4c5155));font-variation-settings:"wdth" 100}.ds-onboarding-info-box__item-description{font-family:var(--typography-font-family-text, "SF Pro", sans-serif);font-size:var(--typography-font-size-1, 12px);font-weight:510;line-height:var(--typography-line-height-1, 16px);letter-spacing:var(--typography-letter-spacing-1, .04px);color:var(--onboarding-info-box-item-description, var(--slate-10, #80838d));font-variation-settings:"wdth" 100}.ds-cta-box{display:flex;flex-direction:column;gap:32px;padding:24px;border-radius:var(--radius-4, 8px);background:var(--cta-box-bg, var(--blue-3, #e6f4fe));border:1px solid var(--cta-box-border, var(--blue-7, #8ec8f6));width:100%;height:100%}.ds-cta-box__text{display:flex;flex-direction:column;gap:12px;width:100%}.ds-cta-box__label{font-family:var(--typography-font-family-text, "SF Pro", sans-serif);font-size:var(--typography-font-size-2, 14px);font-weight:700;line-height:var(--typography-line-height-2, 20px);letter-spacing:var(--typography-letter-spacing-2, 0px);color:var(--cta-box-label, var(--gray-12, #202020));font-variation-settings:"wdth" 100;text-transform:uppercase}.ds-cta-box__heading{font-family:var(--typography-font-family-text, "SF Pro", sans-serif);font-size:var(--typography-font-size-6, 24px);font-weight:510;line-height:var(--typography-line-height-6, 30px);letter-spacing:var(--typography-letter-spacing-6, -.1px);color:var(--cta-box-heading, var(--gray-12, #202020));font-variation-settings:"wdth" 100}.ds-cta-box__description{font-family:var(--typography-font-family-text, "SF Pro", sans-serif);font-size:var(--typography-font-size-3, 16px);font-weight:400;line-height:var(--typography-line-height-3, 24px);letter-spacing:var(--typography-letter-spacing-3, 0px);color:var(--cta-box-description, var(--gray-12, #202020));font-variation-settings:"wdth" 100}.ds-cta-box__button{display:inline-flex;align-items:center;justify-content:center;gap:12px;height:40px;padding:0 var(--spacing-6, 32px);border-radius:var(--radius-3, 6px);background:var(--cta-box-button-bg, var(--blue-9, #0090ff));border:none;cursor:pointer;transition:all .2s ease;width:fit-content;font-family:inherit;font-size:inherit;outline:none}.ds-cta-box__button:hover:not(:disabled){background:var(--blue-10, #0588f0);transform:translateY(-1px)}.ds-cta-box__button:active:not(:disabled){transform:translateY(0)}.ds-cta-box__button:focus-visible{outline:2px solid var(--blue-9, #0090ff);outline-offset:2px}.ds-cta-box__button:disabled{opacity:.5;cursor:not-allowed}.ds-cta-box__button-text{font-family:var(--typography-font-family-text, "SF Pro", sans-serif);font-size:var(--typography-font-size-3, 16px);font-weight:510;line-height:var(--typography-line-height-3, 24px);letter-spacing:var(--typography-letter-spacing-3, 0px);color:var(--cta-box-button-text, white);font-variation-settings:"wdth" 100;white-space:nowrap}.ds-cta-box__button-icon{display:flex;align-items:center;justify-content:center;width:18px;height:18px;flex-shrink:0;color:var(--cta-box-button-text, white)}.ds-onboarding-template{width:100%;min-height:100vh;background:var(--slate-1, #fcfcfd);padding:var(--spacing-11, 80px) var(--spacing-13, 96px)}.ds-onboarding-template__container{max-width:600px;width:100%;display:flex;flex-direction:column;gap:48px}.ds-onboarding-template__top-bar{display:flex;flex-direction:column;gap:24px}.ds-onboarding-template__logo{width:69px;height:77px}.ds-onboarding-template__logo img{width:100%;height:100%;object-fit:contain}.ds-onboarding-template__stepper{width:100%}.ds-onboarding-template__info-text{display:flex;flex-direction:column;gap:8px}.ds-onboarding-template__welcome-heading{font-family:var(--typography-font-family-text, "SF Pro", sans-serif);font-size:var(--typography-font-size-3, 16px);font-weight:700;line-height:var(--typography-line-height-3, 24px);letter-spacing:var(--typography-letter-spacing-3, 0px);color:var(--slate-12, #1c2024);font-variation-settings:"wdth" 100;margin:0}.ds-onboarding-template__welcome-subtext{font-family:var(--typography-font-family-text, "SF Pro", sans-serif);font-size:var(--typography-font-size-2, 14px);font-weight:510;line-height:var(--typography-line-height-2, 20px);letter-spacing:var(--typography-letter-spacing-2, 0px);color:var(--slate-light-11, #687076);font-variation-settings:"wdth" 100;margin:0}.ds-onboarding-template__main{display:flex;flex-direction:column;gap:48px}.ds-onboarding-template__headline-section{display:flex;flex-direction:column}.ds-onboarding-template__headline{font-family:var(--typography-font-family-text, "SF Pro", sans-serif);font-size:var(--typography-font-size-8, 35px);font-weight:700;line-height:var(--typography-line-height-8, 40px);letter-spacing:var(--typography-letter-spacing-8, -.16px);color:var(--slate-12, #1c2024);font-variation-settings:"wdth" 100;margin:0}.ds-onboarding-template__radio-list{display:flex;flex-direction:column;gap:12px;width:100%}.ds-onboarding-template__checkbox-section{display:flex;width:100%}.ds-onboarding-template--radio .ds-onboarding-template__main{gap:24px}.ds-onboarding-template--checkbox-no-icon .ds-onboarding-template__main,.ds-onboarding-template--checkbox-with-icon .ds-onboarding-template__main{gap:48px}.ds-onboarding-template--buttons-plus-radio .ds-onboarding-template__main{gap:0}.ds-onboarding-template--buttons-plus-radio .ds-onboarding-template__headline-section{margin-bottom:24px}.ds-onboarding-template--know-your-customer .ds-onboarding-template__main{gap:48px}.ds-onboarding-template--artwork{background:linear-gradient(180deg,#0292ff,#cae8ff)}.ds-onboarding-template--artwork .ds-onboarding-template__container{gap:0;max-width:100%;width:100%;height:100vh;padding:0}.ds-onboarding-template__artwork-wrapper{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center}.ds-onboarding-template__artwork-background{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.ds-onboarding-template__artwork-background-image{width:100%;height:100%;object-fit:cover}.ds-onboarding-template__artwork-content{position:relative;width:547px;height:420px}.ds-onboarding-template__artwork-image{width:100%;height:100%;object-fit:contain}.ds-onboarding-template--launcher .ds-onboarding-template__container{gap:48px}.ds-onboarding-template__launcher-header{display:flex;align-items:center;gap:24px;width:100%}.ds-onboarding-template__launcher-icon-wrapper{flex-shrink:0}.ds-onboarding-template__launcher-icon{display:flex;align-items:center;justify-content:center;width:64px;height:64px;background:linear-gradient(180deg,#1d9afa,#0069c1);border-radius:var(--radius-3, 6px);color:var(--slate-1, #fcfcfd)}.ds-onboarding-template__launcher-headline{flex:1;font-family:var(--typography-font-family-text, "SF Pro", sans-serif);font-size:var(--typography-font-size-8, 35px);font-weight:700;line-height:var(--typography-line-height-8, 40px);letter-spacing:var(--typography-letter-spacing-8, -.16px);color:var(--slate-12, #1c2024);font-variation-settings:"wdth" 100;margin:0}.ds-onboarding-template__launcher-text-section{display:flex;flex-direction:column;gap:8px;width:100%}.ds-onboarding-template__launcher-text{font-family:var(--typography-font-family-text, "SF Pro", sans-serif);font-size:var(--typography-font-size-3, 16px);font-weight:700;line-height:var(--typography-line-height-3, 24px);letter-spacing:var(--typography-letter-spacing-3, 0px);color:var(--slate-12, #1c2024);font-variation-settings:"wdth" 100;margin:0}.ds-onboarding-template__launcher-subtext{font-family:var(--typography-font-family-text, "SF Pro", sans-serif);font-size:var(--typography-font-size-2, 14px);font-weight:510;line-height:var(--typography-line-height-2, 20px);letter-spacing:var(--typography-letter-spacing-2, 0px);color:var(--slate-light-11, #687076);font-variation-settings:"wdth" 100;margin:0}.ds-onboarding-template__yes-no-section{display:flex;flex-direction:column;gap:16px}.ds-onboarding-template__yes-no-question{font-family:var(--typography-font-family-text, "SF Pro", sans-serif);font-size:var(--typography-font-size-3, 16px);font-weight:400;line-height:var(--typography-line-height-3, 24px);letter-spacing:var(--typography-letter-spacing-3, 0px);color:var(--slate-12, #1c2024);font-variation-settings:"wdth" 100;margin:0}.ds-onboarding-template__yes-no-buttons{display:flex;gap:24px;width:100%}.ds-onboarding-template__yes-no-button{flex:1;height:40px;padding:0 var(--spacing-6, 32px);border-radius:var(--radius-3, 6px);border:1px solid rgba(0,52,220,.45);background:transparent;font-family:var(--typography-font-family-text, "SF Pro", sans-serif);font-size:var(--typography-font-size-3, 16px);font-weight:510;line-height:var(--typography-line-height-3, 24px);letter-spacing:var(--typography-letter-spacing-3, 0px);color:#002bb7c4;font-variation-settings:"wdth" 100;cursor:pointer;transition:all .2s ease}.ds-onboarding-template__yes-no-button:hover:not(.ds-onboarding-template__yes-no-button--active){background:#0047f108}.ds-onboarding-template__yes-no-button--active{background:#0047f112;border-color:#0034dc73}.ds-onboarding-template__radio-section{display:flex;flex-direction:column;gap:16px;margin-top:24px}.ds-onboarding-template__second-question{font-family:var(--typography-font-family-text, "SF Pro", sans-serif);font-size:var(--typography-font-size-3, 16px);font-weight:400;line-height:var(--typography-line-height-3, 24px);letter-spacing:var(--typography-letter-spacing-3, 0px);color:var(--slate-12, #1c2024);font-variation-settings:"wdth" 100;margin:0}.ds-onboarding-template__radio-list-secondary{display:flex;flex-direction:column;gap:24px;width:100%}.ds-onboarding-template__double-section{display:flex;flex-direction:column;gap:32px;width:100%}.ds-onboarding-template__section{display:flex;flex-direction:column;gap:16px}.ds-onboarding-template__section-question{font-family:var(--typography-font-family-text, "SF Pro", sans-serif);font-size:var(--typography-font-size-3, 16px);font-weight:400;line-height:var(--typography-line-height-3, 24px);letter-spacing:var(--typography-letter-spacing-3, 0px);color:var(--slate-12, #1c2024);font-variation-settings:"wdth" 100;margin:0}.ds-onboarding-template__section-options{display:flex;width:100%}.ds-onboarding-template__continue{display:flex;justify-content:flex-start}.ds-onboarding-template__back-button{display:flex;align-items:center;justify-content:flex-start;gap:4px;height:24px;padding:0;background:transparent;border:none;border-radius:var(--radius-1, 3px);cursor:pointer;transition:opacity .2s ease;align-self:flex-start}.ds-onboarding-template__back-button:hover{opacity:.8}.ds-onboarding-template__back-icon{color:var(--blue-9, #0090ff);flex-shrink:0}.ds-onboarding-template__back-text{font-family:var(--typography-font-family-text, "SF Pro", sans-serif);font-size:var(--typography-font-size-1, 12px);font-weight:400;line-height:var(--typography-line-height-1, 16px);letter-spacing:var(--typography-letter-spacing-1, .04px);color:var(--blue-9, #0090ff);font-variation-settings:"wdth" 100}

package/dist/index.d.ts

@@ -0,0 +1 @@
+export * from './src/index';