@qodo/design-system 0.1.0 β†’ 0.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -1,169 +1,245 @@
1
1
  # Qodo Design System
2
2
 
3
- A modern, accessible design system built with React, TypeScript, and Tailwind CSS. This project provides a comprehensive set of reusable UI components and design tokens for consistent user interfaces.
3
+ The official design system powering Qodo's AI-driven development tools. Built with React, TypeScript, and Tailwind CSS to ensure our interfaces are as intelligent and intuitive as our code generation.
4
4
 
5
- ## πŸš€ Features
5
+ This isn't just another component library – it's the foundation that keeps our user experience consistent, accessible, and aligned with Qodo's mission to revolutionize how developers build software.
6
6
 
7
- - **TypeScript Support**: Fully typed components for better development experience
8
- - **Tailwind CSS**: Utility-first CSS framework for rapid UI development
9
- - **Design Tokens**: Centralized design tokens for consistent theming
10
- - **Storybook**: Interactive component documentation and testing
11
- - **Accessibility**: Built with accessibility best practices
12
- - **Modern Stack**: React 19, Vite, and latest tooling
7
+ ## πŸš€ Getting Started
13
8
 
14
- ## πŸ“¦ Installation
9
+ ### Prerequisites
15
10
 
16
- ```bash
17
- # Clone the repository
18
- git clone <repository-url>
19
- cd qodo-design-system
11
+ - Node.js 18+
12
+ - npm
13
+ - React 18+
14
+ - Tailwind CSS
15
+
16
+ ### Installation
20
17
 
21
- # Install dependencies
22
- npm install
18
+ 1. **Login to npm** (required for our private org packages):
19
+
20
+ ```bash
21
+ npm login
23
22
  ```
24
23
 
25
- ## πŸ› οΈ Development
24
+ 2. **Install the design system**:
26
25
 
27
- ### Available Scripts
26
+ ```bash
27
+ npm install @qodo/design-system
28
+ ```
29
+
30
+ 3. **Install peer dependencies** (if not already installed):
28
31
 
29
32
  ```bash
30
- # Start development server
31
- npm run dev
33
+ npm install react react-dom
34
+ ```
32
35
 
33
- # Build the project
34
- npm run build
36
+ ### Setup
35
37
 
36
- # Build design tokens
37
- npm run build:tokens
38
+ #### 1. Configure Tailwind CSS
38
39
 
39
- # Start Storybook
40
- npm run storybook
40
+ Install Tailwind CSS in your project:
41
41
 
42
- # Build Storybook
43
- npm run build-storybook
42
+ ```bash
43
+ npm install -D tailwindcss postcss autoprefixer
44
+ npx tailwindcss init -p
45
+ ```
46
+
47
+ #### 2. Import Styles
48
+
49
+ Add the design system styles to your main entry file (`src/index.css` or `src/globals.css`):
50
+
51
+ ```typescript
52
+ @import "tailwindcss";
53
+ @import "@qodo/design-system/styles";
54
+ ```
44
55
 
45
- # Lint code
46
- npm run lint
56
+ ## πŸ“¦ Usage
47
57
 
48
- # Format code
49
- npm run format
58
+ ### TLDR; Basic Usage
50
59
 
51
- # Check formatting
52
- npm run format:check
60
+ ```typescript
61
+ import { Button } from "@qodo/design-system";
53
62
 
54
- # Preview production build
55
- npm run preview
63
+ function App() {
64
+ return (
65
+ <Button variant="default">Click me</Button>
66
+ );
67
+ }
56
68
  ```
57
69
 
58
- ## 🎨 Components
70
+ The variant prop is optional and defaults to `default`.
59
71
 
60
- The design system includes the following components:
72
+ ### ⚠️ Strict Variant Usage – TypeScript-Protected
61
73
 
62
- ### Button
74
+ In the Qodo Design System, only specific variants are allowed. Using a variant that’s not explicitly defined will result in a TypeScript error at compile time. This ensures our components are always used correctly and consistently.
63
75
 
64
- A versatile button component with multiple variants and states.
76
+ ![variant-type-error](./assets/variant-type-error.png)
65
77
 
66
- ```tsx
67
- import { Button } from "./components/ui/button";
78
+ #### Sizes
68
79
 
69
- <Button variant="primary" size="md">
70
- Click me
71
- </Button>;
72
- ```
80
+ ```typescript
81
+ import { Button } from "@qodo/design-system";
73
82
 
74
- ### Card
83
+ function ButtonSizes() {
84
+ return (
85
+ <div className="flex items-center gap-2">
86
+ <Button size="sm">Small</Button>
87
+ <Button size="default">Default</Button>
88
+ <Button size="lg">Large</Button>
89
+ <Button size="icon">πŸš€</Button>
90
+ </div>
91
+ );
92
+ }
93
+ ```
75
94
 
76
- A flexible card component for content containers.
95
+ #### Custom Styling with className
96
+
97
+ You can extend styles using the `className` prop:
98
+
99
+ ```typescript
100
+ import { Button } from "@qodo/design-system";
101
+
102
+ function CustomButton() {
103
+ return (
104
+ <div className="flex flex-col gap-2">
105
+ {/* Add custom background */}
106
+ <Button className="bg-purple-500 hover:bg-purple-600">
107
+ Purple Button
108
+ </Button>
109
+
110
+ {/* Add custom spacing */}
111
+ <Button className="px-8 py-3">
112
+ Extra Padding
113
+ </Button>
114
+
115
+ {/* Add custom text styles */}
116
+ <Button className="text-lg font-bold">
117
+ Large Bold Text
118
+ </Button>
119
+
120
+ {/* Combine with variants */}
121
+ <Button variant="outline" className="border-2 border-blue-500 text-blue-500">
122
+ Custom Outline
123
+ </Button>
124
+ </div>
125
+ );
126
+ }
127
+ ```
77
128
 
78
- ```tsx
79
- import { Card } from "./components/ui/card";
129
+ ### Running Storybook
80
130
 
81
- <Card>
82
- <Card.Header>
83
- <Card.Title>Card Title</Card.Title>
84
- </Card.Header>
85
- <Card.Content>Card content goes here</Card.Content>
86
- </Card>;
131
+ ```bash
132
+ npm run storybook
87
133
  ```
88
134
 
89
- ### Input
135
+ #### Qodo's Color Pallette
136
+
137
+ ![storybook-1](./assets/storybook-1.png)
90
138
 
91
- A form input component with validation states.
139
+ ### Dark Mode
92
140
 
93
- ```tsx
94
- import { Input } from "./components/ui/input";
141
+ The design system supports dark mode through CSS variables. To enable dark mode, add the `dark` class to your HTML element:
95
142
 
96
- <Input type="text" placeholder="Enter text..." variant="default" />;
143
+ ```html
144
+ <html class="dark">
145
+ <!-- Your app -->
146
+ </html>
97
147
  ```
98
148
 
99
- ## 🎨 Design Tokens
149
+ ## πŸ› οΈ Local Development
150
+
151
+ When working on the design system locally, you have two main approaches to test your changes:
100
152
 
101
- The design system uses Style Dictionary to manage design tokens. Tokens are defined in JSON format and automatically built into CSS custom properties.
153
+ ### Method 1: Using npm link (Recommended for active development)
102
154
 
103
- ### Colors
155
+ This method creates a symlink between your local design system and your test project, allowing real-time updates.
104
156
 
105
- - **Brand Colors**: Primary (#007AFF), Secondary (#34C759), Accent (#FF9500)
106
- - **Neutral Colors**: 50 (#F9FAFB), 100 (#F3F4F6), 900 (#111827)
157
+ **Setup (one-time):**
107
158
 
108
- ### Token Structure
159
+ ```bash
160
+ # In your design system directory
161
+ cd qodo-design-system
162
+ npm run build
163
+ npm link
109
164
 
165
+ # In your consuming project
166
+ cd your-project
167
+ npm link @qodo/design-system
110
168
  ```
111
- src/tokens/
112
- β”œβ”€β”€ base/
113
- β”‚ └── colors.json
114
- └── build.js
169
+
170
+ **Development workflow:**
171
+
172
+ ```bash
173
+ # Terminal 1: Design system with auto-rebuild
174
+ cd qodo-design-system
175
+ npm run dev # This watches for changes and rebuilds automatically
176
+
177
+ # Terminal 2: Your consuming project
178
+ cd your-project
179
+ npm run dev # Your app will automatically pick up changes
115
180
  ```
116
181
 
117
- ## πŸ“š Storybook
182
+ **Making changes:**
183
+
184
+ 1. Edit your design system components
185
+ 2. Save the file
186
+ 3. The design system rebuilds automatically (if using `npm run dev`)
187
+ 4. Your consuming project immediately sees the changes
188
+ 5. No need to reinstall or relink!
118
189
 
119
- Storybook provides an interactive playground for all components. Start it with:
190
+ **When to relink:**
191
+ Only relink when you change `package.json` exports or entry points:
120
192
 
121
193
  ```bash
122
- npm run storybook
194
+ # In design system directory
195
+ npm unlink
196
+ npm link
197
+
198
+ # In consuming project
199
+ npm unlink @qodo/design-system
200
+ npm link @qodo/design-system
123
201
  ```
124
202
 
125
- Visit `http://localhost:6006` to explore components, view documentation, and test interactions.
203
+ **Cleanup when done:**
126
204
 
127
- ## πŸ—οΈ Project Structure
205
+ ```bash
206
+ # In consuming project
207
+ npm unlink @qodo/design-system
208
+ npm install # Reinstall the published version
128
209
 
129
- ```
130
- qodo-design-system/
131
- β”œβ”€β”€ src/
132
- β”‚ β”œβ”€β”€ components/
133
- β”‚ β”‚ β”œβ”€β”€ ui/ # UI components
134
- β”‚ β”‚ └── index.ts # Component exports
135
- β”‚ β”œβ”€β”€ tokens/ # Design tokens
136
- β”‚ β”œβ”€β”€ stories/ # Storybook stories
137
- β”‚ └── styles/ # Global styles
138
- β”œβ”€β”€ public/ # Static assets
139
- └── package.json
210
+ # In design system directory
211
+ npm unlink # Remove global link
140
212
  ```
141
213
 
142
- ## πŸ§ͺ Testing
214
+ ### Method 2: Build and Install (For testing releases)
143
215
 
144
- The project includes testing setup with Vitest and Playwright for comprehensive testing coverage.
216
+ This method simulates the actual installation process and is useful for testing before publishing.
145
217
 
146
- ## πŸ“ Contributing
218
+ **Using npm pack:**
147
219
 
148
- 1. Follow the existing code conventions
149
- 2. Ensure all components are accessible
150
- 3. Add stories for new components
151
- 4. Update design tokens when adding new styles
152
- 5. Run linting and formatting before committing
220
+ ```bash
221
+ # In design system directory
222
+ npm run build
223
+ npm pack # Creates qodo-design-system-0.1.0.tgz
224
+
225
+ # In consuming project
226
+ npm install /path/to/qodo-design-system-0.1.0.tgz
227
+ ```
153
228
 
154
- ## 🎯 Best Practices
229
+ ### Getting Help
155
230
 
156
- - Use TypeScript for all new code
157
- - Follow accessibility guidelines (WCAG 2.1)
158
- - Keep components small and focused
159
- - Use design tokens for styling
160
- - Write comprehensive stories for components
161
- - Test components across different states and variants
231
+ If you encounter issues:
162
232
 
163
- ## πŸ“„ License
233
+ 1. Check that you've followed all setup steps
234
+ 2. Verify your Tailwind CSS configuration
235
+ 3. Ensure you're using compatible versions of React and other dependencies
236
+ 4. Reach out to the team on Slack
164
237
 
165
- [Add your license information here]
238
+ ## πŸ“š What's Next
166
239
 
167
- ---
240
+ We're continuously expanding the design system. Coming soon:
168
241
 
169
- Built with ❀️ using React, TypeScript, and Tailwind CSS
242
+ - More component variants
243
+ - Additional components (Input, Modal, etc.)
244
+ - Storybook documentation
245
+ - Design tokens for animations and shadows
@@ -1 +1 @@
1
- /*! tailwindcss v4.1.11 | MIT License | https://tailwindcss.com */@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-space-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-duration:initial;--tw-ease:initial;--tw-animation-delay:0s;--tw-animation-direction:normal;--tw-animation-duration:initial;--tw-animation-fill-mode:none;--tw-animation-iteration-count:1;--tw-enter-opacity:1;--tw-enter-rotate:0;--tw-enter-scale:1;--tw-enter-translate-x:0;--tw-enter-translate-y:0;--tw-exit-opacity:1;--tw-exit-rotate:0;--tw-exit-scale:1;--tw-exit-translate-x:0;--tw-exit-translate-y:0}}}@layer theme{:root,:host{--color-purple-50:oklch(97.7% .014 308.299);--color-purple-100:oklch(94.6% .033 307.174);--color-purple-200:oklch(90.2% .063 306.703);--color-purple-300:oklch(82.7% .119 306.383);--color-purple-400:oklch(71.4% .203 305.504);--color-purple-500:oklch(62.7% .265 303.9);--color-purple-600:oklch(55.8% .288 302.321);--color-purple-700:oklch(49.6% .265 301.924);--color-purple-800:oklch(43.8% .218 303.724);--color-neutral-200:oklch(92.2% 0 0);--color-neutral-500:oklch(55.6% 0 0);--color-neutral-600:oklch(43.9% 0 0);--color-neutral-900:oklch(20.5% 0 0);--color-black:#000;--color-white:#fff;--spacing:.25rem;--text-xs:.75rem;--text-xs--line-height:calc(1/.75);--text-sm:.875rem;--text-sm--line-height:calc(1.25/.875);--text-base:1rem;--text-base--line-height: 1.5 ;--text-lg:1.125rem;--text-lg--line-height:calc(1.75/1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75/1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2/1.5);--text-3xl:1.875rem;--text-3xl--line-height: 1.2 ;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--ease-out:cubic-bezier(0,0,.2,1);--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1);--default-font-family:var(--font-geist-sans);--default-mono-font-family:var(--font-geist-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.\@container\/card-header{container:card-header/inline-size}.col-start-2{grid-column-start:2}.row-span-2{grid-row:span 2/span 2}.row-start-1{grid-row-start:1}.mt-2{margin-top:calc(var(--spacing)*2)}.mb-3{margin-bottom:calc(var(--spacing)*3)}.mb-4{margin-bottom:calc(var(--spacing)*4)}.flex{display:flex}.grid{display:grid}.inline-flex{display:inline-flex}.h-2{height:calc(var(--spacing)*2)}.h-3{height:calc(var(--spacing)*3)}.h-4{height:calc(var(--spacing)*4)}.h-6{height:calc(var(--spacing)*6)}.h-8{height:calc(var(--spacing)*8)}.h-9{height:calc(var(--spacing)*9)}.h-10{height:calc(var(--spacing)*10)}.h-11{height:calc(var(--spacing)*11)}.h-12{height:calc(var(--spacing)*12)}.h-16{height:calc(var(--spacing)*16)}.w-2{width:calc(var(--spacing)*2)}.w-3{width:calc(var(--spacing)*3)}.w-4{width:calc(var(--spacing)*4)}.w-6{width:calc(var(--spacing)*6)}.w-8{width:calc(var(--spacing)*8)}.w-10{width:calc(var(--spacing)*10)}.w-12{width:calc(var(--spacing)*12)}.w-16{width:calc(var(--spacing)*16)}.w-80{width:calc(var(--spacing)*80)}.w-full{width:100%}.min-w-0{min-width:calc(var(--spacing)*0)}.transform{transform:var(--tw-rotate-x,)var(--tw-rotate-y,)var(--tw-rotate-z,)var(--tw-skew-x,)var(--tw-skew-y,)}.cursor-pointer{cursor:pointer}.auto-rows-min{grid-auto-rows:min-content}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-rows-\[auto_auto\]{grid-template-rows:auto auto}.flex-col{flex-direction:column}.items-baseline{align-items:baseline}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-1\.5{gap:calc(var(--spacing)*1.5)}.gap-4{gap:calc(var(--spacing)*4)}.gap-6{gap:calc(var(--spacing)*6)}:where(.space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*1)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*1)*calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*2)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*2)*calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*4)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*4)*calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-6>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*6)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*6)*calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-8>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*8)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*8)*calc(1 - var(--tw-space-y-reverse)))}.self-start{align-self:flex-start}.justify-self-end{justify-self:flex-end}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius)}.rounded-md{border-radius:calc(var(--radius) - 2px)}.rounded-xl{border-radius:calc(var(--radius) + 4px)}.border{border-style:var(--tw-border-style);border-width:1px}.border-\[var\(--color-qodo-success\)\]{border-color:var(--color-qodo-success)}.border-\[var\(--color-qodo-warning\)\]{border-color:var(--color-qodo-warning)}.border-accent{border-color:var(--accent)}.border-destructive{border-color:var(--destructive)}.border-input{border-color:var(--input)}.border-secondary{border-color:var(--secondary)}.bg-\[var\(--color-qodo-success\)\]{background-color:var(--color-qodo-success)}.bg-\[var\(--color-qodo-warning\)\]{background-color:var(--color-qodo-warning)}.bg-accent{background-color:var(--accent)}.bg-background{background-color:var(--background)}.bg-card{background-color:var(--card)}.bg-destructive{background-color:var(--destructive)}.bg-neutral-200{background-color:var(--color-neutral-200)}.bg-primary{background-color:var(--primary)}.bg-secondary{background-color:var(--secondary)}.bg-success{background-color:var(--success)}.bg-warning{background-color:var(--warning)}.p-6{padding:calc(var(--spacing)*6)}.px-3{padding-inline:calc(var(--spacing)*3)}.px-4{padding-inline:calc(var(--spacing)*4)}.px-6{padding-inline:calc(var(--spacing)*6)}.px-8{padding-inline:calc(var(--spacing)*8)}.py-1{padding-block:calc(var(--spacing)*1)}.py-2{padding-block:calc(var(--spacing)*2)}.py-6{padding-block:calc(var(--spacing)*6)}.text-center{text-align:center}.font-mono{font-family:var(--font-geist-mono)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.leading-none{--tw-leading:1;line-height:1}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.whitespace-nowrap{white-space:nowrap}.text-accent-foreground{color:var(--accent-foreground)}.text-black{color:var(--color-black)}.text-card-foreground{color:var(--card-foreground)}.text-destructive-foreground{color:var(--destructive-foreground)}.text-foreground{color:var(--foreground)}.text-muted-foreground{color:var(--muted-foreground)}.text-neutral-500{color:var(--color-neutral-500)}.text-neutral-600{color:var(--color-neutral-600)}.text-neutral-900{color:var(--color-neutral-900)}.text-primary{color:var(--primary)}.text-primary-foreground{color:var(--primary-foreground)}.text-secondary-foreground{color:var(--secondary-foreground)}.text-white{color:var(--color-white)}.underline-offset-4{text-underline-offset:4px}.shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a),0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-md{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a),0 2px 4px -2px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-xl{--tw-shadow:0 20px 25px -5px var(--tw-shadow-color,#0000001a),0 8px 10px -6px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-xs{--tw-shadow:0 1px 2px 0 var(--tw-shadow-color,#0000000d);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ring{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(1px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ring-offset-background{--tw-ring-offset-color:var(--background)}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.transition-\[color\,box-shadow\]{transition-property:color,box-shadow;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-shadow{transition-property:box-shadow;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-300{--tw-duration:.3s;transition-duration:.3s}.ease-out{--tw-ease:var(--ease-out);transition-timing-function:var(--ease-out)}.outline-none{--tw-outline-style:none;outline-style:none}@media (hover:hover){.group-hover\:shadow-xl:is(:where(.group):hover *){--tw-shadow:0 20px 25px -5px var(--tw-shadow-color,#0000001a),0 8px 10px -6px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}}.selection\:bg-primary ::selection{background-color:var(--primary)}.selection\:bg-primary::selection{background-color:var(--primary)}.selection\:text-primary-foreground ::selection{color:var(--primary-foreground)}.selection\:text-primary-foreground::selection{color:var(--primary-foreground)}.file\:inline-flex::file-selector-button{display:inline-flex}.file\:h-7::file-selector-button{height:calc(var(--spacing)*7)}.file\:border-0::file-selector-button{border-style:var(--tw-border-style);border-width:0}.file\:bg-transparent::file-selector-button{background-color:#0000}.file\:text-sm::file-selector-button{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.file\:font-medium::file-selector-button{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.file\:text-foreground::file-selector-button{color:var(--foreground)}.placeholder\:text-black\/70::placeholder{color:#000000b3}@supports (color:color-mix(in lab,red,red)){.placeholder\:text-black\/70::placeholder{color:color-mix(in oklab,var(--color-black)70%,transparent)}}.placeholder\:text-destructive-foreground\/70::placeholder{color:var(--destructive-foreground)}@supports (color:color-mix(in lab,red,red)){.placeholder\:text-destructive-foreground\/70::placeholder{color:color-mix(in oklab,var(--destructive-foreground)70%,transparent)}}.placeholder\:text-muted-foreground::placeholder{color:var(--muted-foreground)}.placeholder\:text-white\/70::placeholder{color:#ffffffb3}@supports (color:color-mix(in lab,red,red)){.placeholder\:text-white\/70::placeholder{color:color-mix(in oklab,var(--color-white)70%,transparent)}}@media (hover:hover){.hover\:bg-accent:hover{background-color:var(--accent)}.hover\:bg-destructive\/80:hover{background-color:var(--destructive)}@supports (color:color-mix(in lab,red,red)){.hover\:bg-destructive\/80:hover{background-color:color-mix(in oklab,var(--destructive)80%,transparent)}}.hover\:bg-primary\/80:hover{background-color:var(--primary)}@supports (color:color-mix(in lab,red,red)){.hover\:bg-primary\/80:hover{background-color:color-mix(in oklab,var(--primary)80%,transparent)}}.hover\:bg-secondary\/80:hover{background-color:var(--secondary)}@supports (color:color-mix(in lab,red,red)){.hover\:bg-secondary\/80:hover{background-color:color-mix(in oklab,var(--secondary)80%,transparent)}}.hover\:bg-success\/80:hover{background-color:var(--success)}@supports (color:color-mix(in lab,red,red)){.hover\:bg-success\/80:hover{background-color:color-mix(in oklab,var(--success)80%,transparent)}}.hover\:bg-warning\/80:hover{background-color:var(--warning)}@supports (color:color-mix(in lab,red,red)){.hover\:bg-warning\/80:hover{background-color:color-mix(in oklab,var(--warning)80%,transparent)}}.hover\:text-accent-foreground:hover{color:var(--accent-foreground)}.hover\:underline:hover{text-decoration-line:underline}}.focus-visible\:ring-2:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(2px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.focus-visible\:ring-ring:focus-visible{--tw-ring-color:var(--ring)}.focus-visible\:ring-offset-2:focus-visible{--tw-ring-offset-width:2px;--tw-ring-offset-shadow:var(--tw-ring-inset,)0 0 0 var(--tw-ring-offset-width)var(--tw-ring-offset-color)}.focus-visible\:outline-none:focus-visible{--tw-outline-style:none;outline-style:none}.disabled\:pointer-events-none:disabled{pointer-events:none}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:opacity-50:disabled{opacity:.5}.has-data-\[slot\=card-action\]\:grid-cols-\[1fr_auto\]:has([data-slot=card-action]){grid-template-columns:1fr auto}@media (min-width:48rem){.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.md\:text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}}@media (min-width:64rem){.lg\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}}.dark\:bg-input\/30:is(.dark *){background-color:var(--input)}@supports (color:color-mix(in lab,red,red)){.dark\:bg-input\/30:is(.dark *){background-color:color-mix(in oklab,var(--input)30%,transparent)}}.\[\.border-b\]\:pb-6.border-b{padding-bottom:calc(var(--spacing)*6)}.\[\.border-t\]\:pt-6.border-t{padding-top:calc(var(--spacing)*6)}}@property --tw-animation-delay{syntax:"*";inherits:false;initial-value:0s}@property --tw-animation-direction{syntax:"*";inherits:false;initial-value:normal}@property --tw-animation-duration{syntax:"*";inherits:false}@property --tw-animation-fill-mode{syntax:"*";inherits:false;initial-value:none}@property --tw-animation-iteration-count{syntax:"*";inherits:false;initial-value:1}@property --tw-enter-opacity{syntax:"*";inherits:false;initial-value:1}@property --tw-enter-rotate{syntax:"*";inherits:false;initial-value:0}@property --tw-enter-scale{syntax:"*";inherits:false;initial-value:1}@property --tw-enter-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-enter-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-exit-opacity{syntax:"*";inherits:false;initial-value:1}@property --tw-exit-rotate{syntax:"*";inherits:false;initial-value:0}@property --tw-exit-scale{syntax:"*";inherits:false;initial-value:1}@property --tw-exit-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-exit-translate-y{syntax:"*";inherits:false;initial-value:0}:root{--color-white:#fff;--color-dark-100:#f4f4f4;--color-dark-200:#dfdfdf;--color-dark-300:#c3c3c3;--color-dark-400:#6e6e6e;--color-dark-500:#3d3d3d;--color-dark-600:#2a2a2a;--color-dark-700:#161616;--color-dark-800:#0e0f10;--color-dark-900:#090a0b;--color-purple-50:#dddcff;--color-purple-100:#c1befe;--color-purple-200:#a8a1fd;--color-purple-300:#9084fc;--color-purple-400:#7968fa;--color-purple-500:#634fd1;--color-purple-600:#4d3ba8;--color-purple-700:#39277f;--color-purple-800:#261657;--color-qodo-accent:#ff9500;--color-qodo-danger:#ff3b30;--color-qodo-warning:#fc0;--color-qodo-success:#30d158;--radius:.625rem;--background:var(--color-white);--foreground:var(--color-dark-900);--card:var(--color-white);--card-foreground:var(--color-dark-900);--popover:var(--color-white);--popover-foreground:var(--color-dark-900);--primary:var(--color-purple-500);--primary-foreground:var(--color-white);--secondary:var(--color-purple-100);--secondary-foreground:var(--color-dark-700);--muted:var(--color-dark-100);--muted-foreground:var(--color-dark-400);--accent:var(--color-purple-400);--accent-foreground:var(--color-white);--success:oklch(55% .12 160);--success-foreground:oklch(99% .005 160);--warning:oklch(65% .15 65);--warning-foreground:oklch(15% .02 65);--destructive:oklch(58% .18 15);--destructive-foreground:oklch(99% .005 15);--border:var(--color-dark-200);--input:var(--color-dark-100);--ring:var(--color-purple-500);--sidebar:var(--color-dark-100);--sidebar-foreground:var(--color-dark-900);--sidebar-primary:var(--color-purple-500);--sidebar-primary-foreground:var(--color-white);--sidebar-accent:var(--color-purple-50);--sidebar-accent-foreground:var(--color-dark-700);--sidebar-border:var(--color-dark-200);--sidebar-ring:var(--color-purple-500)}.dark{--background:var(--color-dark-900);--foreground:var(--color-white);--card:var(--color-dark-800);--card-foreground:var(--color-white);--popover:var(--color-dark-800);--popover-foreground:var(--color-white);--primary:var(--color-purple-400);--primary-foreground:var(--color-dark-900);--secondary:var(--color-dark-700);--secondary-foreground:var(--color-white);--muted:var(--color-dark-600);--muted-foreground:var(--color-dark-300);--accent:var(--color-purple-300);--accent-foreground:var(--color-dark-900);--success:oklch(65% .15 160);--success-foreground:oklch(8% .015 160);--warning:oklch(70% .18 65);--warning-foreground:oklch(8% .015 65);--destructive:oklch(65% .2 15);--destructive-foreground:oklch(95% .005 15);--border:var(--color-dark-700);--input:var(--color-dark-800);--ring:var(--color-purple-400);--sidebar:var(--color-dark-800);--sidebar-foreground:var(--color-white);--sidebar-primary:var(--color-purple-400);--sidebar-primary-foreground:var(--color-dark-900);--sidebar-accent:var(--color-dark-700);--sidebar-accent-foreground:var(--color-white);--sidebar-border:var(--color-dark-700);--sidebar-ring:var(--color-purple-400)}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}
1
+ /*! tailwindcss v4.1.11 | MIT License | https://tailwindcss.com */@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-space-y-reverse:0;--tw-space-x-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-duration:initial;--tw-ease:initial;--tw-animation-delay:0s;--tw-animation-direction:normal;--tw-animation-duration:initial;--tw-animation-fill-mode:none;--tw-animation-iteration-count:1;--tw-enter-opacity:1;--tw-enter-rotate:0;--tw-enter-scale:1;--tw-enter-translate-x:0;--tw-enter-translate-y:0;--tw-exit-opacity:1;--tw-exit-rotate:0;--tw-exit-scale:1;--tw-exit-translate-x:0;--tw-exit-translate-y:0}}}@layer theme{:root,:host{--color-blue-500:oklch(62.3% .214 259.815);--color-purple-50:oklch(97.7% .014 308.299);--color-purple-100:oklch(94.6% .033 307.174);--color-purple-200:oklch(90.2% .063 306.703);--color-purple-300:oklch(82.7% .119 306.383);--color-purple-400:oklch(71.4% .203 305.504);--color-purple-500:oklch(62.7% .265 303.9);--color-purple-600:oklch(55.8% .288 302.321);--color-purple-700:oklch(49.6% .265 301.924);--color-purple-800:oklch(43.8% .218 303.724);--color-neutral-200:oklch(92.2% 0 0);--color-white:#fff;--spacing:.25rem;--container-xs:20rem;--container-lg:32rem;--container-xl:36rem;--container-2xl:42rem;--text-xs:.75rem;--text-xs--line-height:calc(1/.75);--text-sm:.875rem;--text-sm--line-height:calc(1.25/.875);--text-base:1rem;--text-base--line-height: 1.5 ;--text-lg:1.125rem;--text-lg--line-height:calc(1.75/1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75/1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2/1.5);--text-3xl:1.875rem;--text-3xl--line-height: 1.2 ;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--radius-xs:.125rem;--ease-out:cubic-bezier(0,0,.2,1);--animate-pulse:pulse 2s cubic-bezier(.4,0,.6,1)infinite;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1);--default-font-family:var(--font-geist-sans);--default-mono-font-family:var(--font-geist-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.\@container\/card-header{container:card-header/inline-size}.pointer-events-none{pointer-events:none}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.inset-0{inset:calc(var(--spacing)*0)}.top-4{top:calc(var(--spacing)*4)}.top-\[50\%\]{top:50%}.right-4{right:calc(var(--spacing)*4)}.left-\[50\%\]{left:50%}.z-50{z-index:50}.col-span-3{grid-column:span 3/span 3}.col-start-2{grid-column-start:2}.row-span-2{grid-row:span 2/span 2}.row-start-1{grid-row-start:1}.mt-2{margin-top:calc(var(--spacing)*2)}.mr-1{margin-right:calc(var(--spacing)*1)}.mb-3{margin-bottom:calc(var(--spacing)*3)}.mb-4{margin-bottom:calc(var(--spacing)*4)}.block{display:block}.flex{display:flex}.grid{display:grid}.inline-block{display:inline-block}.inline-flex{display:inline-flex}.size-2\.5{width:calc(var(--spacing)*2.5);height:calc(var(--spacing)*2.5)}.size-4{width:calc(var(--spacing)*4);height:calc(var(--spacing)*4)}.h-1{height:calc(var(--spacing)*1)}.h-2{height:calc(var(--spacing)*2)}.h-3{height:calc(var(--spacing)*3)}.h-4{height:calc(var(--spacing)*4)}.h-5{height:calc(var(--spacing)*5)}.h-6{height:calc(var(--spacing)*6)}.h-8{height:calc(var(--spacing)*8)}.h-9{height:calc(var(--spacing)*9)}.h-10{height:calc(var(--spacing)*10)}.h-11{height:calc(var(--spacing)*11)}.h-12{height:calc(var(--spacing)*12)}.h-16{height:calc(var(--spacing)*16)}.h-20{height:calc(var(--spacing)*20)}.h-48{height:calc(var(--spacing)*48)}.h-\[1\.15rem\]{height:1.15rem}.h-full{height:100%}.max-h-\[80vh\]{max-height:80vh}.w-2{width:calc(var(--spacing)*2)}.w-2\/3{width:66.6667%}.w-3{width:calc(var(--spacing)*3)}.w-3\/4{width:75%}.w-4{width:calc(var(--spacing)*4)}.w-4\/5{width:80%}.w-6{width:calc(var(--spacing)*6)}.w-8{width:calc(var(--spacing)*8)}.w-10{width:calc(var(--spacing)*10)}.w-12{width:calc(var(--spacing)*12)}.w-16{width:calc(var(--spacing)*16)}.w-20{width:calc(var(--spacing)*20)}.w-48{width:calc(var(--spacing)*48)}.w-52{width:calc(var(--spacing)*52)}.w-60{width:calc(var(--spacing)*60)}.w-80{width:calc(var(--spacing)*80)}.w-96{width:calc(var(--spacing)*96)}.w-fit{width:fit-content}.w-full{width:100%}.max-w-2xl{max-width:var(--container-2xl)}.max-w-\[calc\(100\%-2rem\)\]{max-width:calc(100% - 2rem)}.max-w-xl{max-width:var(--container-xl)}.max-w-xs{max-width:var(--container-xs)}.min-w-0{min-width:calc(var(--spacing)*0)}.min-w-8{min-width:calc(var(--spacing)*8)}.min-w-9{min-width:calc(var(--spacing)*9)}.min-w-10{min-width:calc(var(--spacing)*10)}.flex-1{flex:1}.shrink-0{flex-shrink:0}.origin-\(--radix-tooltip-content-transform-origin\){transform-origin:var(--radix-tooltip-content-transform-origin)}.translate-x-\[-50\%\]{--tw-translate-x:-50%;translate:var(--tw-translate-x)var(--tw-translate-y)}.translate-y-0\.5{--tw-translate-y:calc(var(--spacing)*.5);translate:var(--tw-translate-x)var(--tw-translate-y)}.translate-y-\[-50\%\]{--tw-translate-y:-50%;translate:var(--tw-translate-x)var(--tw-translate-y)}.translate-y-\[calc\(-50\%_-_2px\)\]{--tw-translate-y: calc(-50% - 2px) ;translate:var(--tw-translate-x)var(--tw-translate-y)}.rotate-45{rotate:45deg}.transform{transform:var(--tw-rotate-x,)var(--tw-rotate-y,)var(--tw-rotate-z,)var(--tw-skew-x,)var(--tw-skew-y,)}.animate-in{animation:enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none)}.animate-pulse{animation:var(--animate-pulse)}.cursor-pointer{cursor:pointer}.list-inside{list-style-position:inside}.list-disc{list-style-type:disc}.auto-rows-min{grid-auto-rows:min-content}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.grid-rows-\[auto_auto\]{grid-template-rows:auto auto}.flex-col{flex-direction:column}.flex-col-reverse{flex-direction:column-reverse}.flex-wrap{flex-wrap:wrap}.items-baseline{align-items:baseline}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-1{gap:calc(var(--spacing)*1)}.gap-1\.5{gap:calc(var(--spacing)*1.5)}.gap-2{gap:calc(var(--spacing)*2)}.gap-4{gap:calc(var(--spacing)*4)}.gap-6{gap:calc(var(--spacing)*6)}:where(.space-y-0\.5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*.5)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*.5)*calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*1)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*1)*calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*2)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*2)*calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-3>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*3)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*3)*calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*4)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*4)*calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-6>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*6)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*6)*calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-8>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*8)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*8)*calc(1 - var(--tw-space-y-reverse)))}:where(.space-x-2>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-start:calc(calc(var(--spacing)*2)*var(--tw-space-x-reverse));margin-inline-end:calc(calc(var(--spacing)*2)*calc(1 - var(--tw-space-x-reverse)))}:where(.space-x-3>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-start:calc(calc(var(--spacing)*3)*var(--tw-space-x-reverse));margin-inline-end:calc(calc(var(--spacing)*3)*calc(1 - var(--tw-space-x-reverse)))}:where(.space-x-4>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-start:calc(calc(var(--spacing)*4)*var(--tw-space-x-reverse));margin-inline-end:calc(calc(var(--spacing)*4)*calc(1 - var(--tw-space-x-reverse)))}.self-start{align-self:flex-start}.justify-self-end{justify-self:flex-end}.overflow-hidden{overflow:hidden}.overflow-y-auto{overflow-y:auto}.rounded{border-radius:.25rem}.rounded-\[2px\]{border-radius:2px}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius)}.rounded-md{border-radius:calc(var(--radius) - 2px)}.rounded-none{border-radius:0}.rounded-xl{border-radius:calc(var(--radius) + 4px)}.rounded-xs{border-radius:var(--radius-xs)}.border{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-accent{border-color:var(--accent)}.border-blue-500{border-color:var(--color-blue-500)}.border-destructive{border-color:var(--destructive)}.border-input{border-color:var(--input)}.border-secondary{border-color:var(--secondary)}.border-success{border-color:var(--success)}.border-transparent{border-color:#0000}.border-warning{border-color:var(--warning)}.bg-accent{background-color:var(--accent)}.bg-background{background-color:var(--background)}.bg-card{background-color:var(--card)}.bg-destructive{background-color:var(--destructive)}.bg-foreground\/50{background-color:var(--foreground)}@supports (color:color-mix(in lab,red,red)){.bg-foreground\/50{background-color:color-mix(in oklab,var(--foreground)50%,transparent)}}.bg-muted{background-color:var(--muted)}.bg-neutral-200{background-color:var(--color-neutral-200)}.bg-primary,.bg-primary\/20{background-color:var(--primary)}@supports (color:color-mix(in lab,red,red)){.bg-primary\/20{background-color:color-mix(in oklab,var(--primary)20%,transparent)}}.bg-purple-500{background-color:var(--color-purple-500)}.bg-secondary{background-color:var(--secondary)}.bg-success{background-color:var(--success)}.bg-transparent{background-color:#0000}.bg-warning{background-color:var(--warning)}.fill-primary{fill:var(--primary)}.p-6{padding:calc(var(--spacing)*6)}.p-8{padding:calc(var(--spacing)*8)}.px-1\.5{padding-inline:calc(var(--spacing)*1.5)}.px-2{padding-inline:calc(var(--spacing)*2)}.px-2\.5{padding-inline:calc(var(--spacing)*2.5)}.px-3{padding-inline:calc(var(--spacing)*3)}.px-4{padding-inline:calc(var(--spacing)*4)}.px-6{padding-inline:calc(var(--spacing)*6)}.px-8{padding-inline:calc(var(--spacing)*8)}.py-0\.5{padding-block:calc(var(--spacing)*.5)}.py-1{padding-block:calc(var(--spacing)*1)}.py-1\.5{padding-block:calc(var(--spacing)*1.5)}.py-2{padding-block:calc(var(--spacing)*2)}.py-3{padding-block:calc(var(--spacing)*3)}.py-4{padding-block:calc(var(--spacing)*4)}.py-6{padding-block:calc(var(--spacing)*6)}.pt-0{padding-top:calc(var(--spacing)*0)}.pb-4{padding-bottom:calc(var(--spacing)*4)}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.font-mono{font-family:var(--font-geist-mono)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-3xl{font-size:var(--text-3xl);line-height:var(--tw-leading,var(--text-3xl--line-height))}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\[10px\]{font-size:10px}.leading-none{--tw-leading:1;line-height:1}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.text-balance{text-wrap:balance}.whitespace-nowrap{white-space:nowrap}.text-accent-foreground{color:var(--accent-foreground)}.text-blue-500{color:var(--color-blue-500)}.text-card-foreground{color:var(--card-foreground)}.text-destructive-foreground{color:var(--destructive-foreground)}.text-foreground{color:var(--foreground)}.text-muted-foreground{color:var(--muted-foreground)}.text-primary{color:var(--primary)}.text-primary-foreground{color:var(--primary-foreground)}.text-secondary-foreground{color:var(--secondary-foreground)}.text-success-foreground{color:var(--success-foreground)}.text-warning-foreground{color:var(--warning-foreground)}.italic{font-style:italic}.underline{text-decoration-line:underline}.underline-offset-4{text-underline-offset:4px}.opacity-70{opacity:.7}.opacity-100{opacity:1}.shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a),0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-md{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a),0 2px 4px -2px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-none{--tw-shadow:0 0 #0000;box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-xl{--tw-shadow:0 20px 25px -5px var(--tw-shadow-color,#0000001a),0 8px 10px -6px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-xs{--tw-shadow:0 1px 2px 0 var(--tw-shadow-color,#0000000d);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ring{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(1px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ring-0{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(0px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ring-offset-background{--tw-ring-offset-color:var(--background)}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.transition-\[color\,box-shadow\]{transition-property:color,box-shadow;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-shadow{transition-property:box-shadow;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-200{--tw-duration:.2s;transition-duration:.2s}.duration-300{--tw-duration:.3s;transition-duration:.3s}.ease-out{--tw-ease:var(--ease-out);transition-timing-function:var(--ease-out)}.fade-in-0{--tw-enter-opacity:0}.outline-none{--tw-outline-style:none;outline-style:none}.select-none{-webkit-user-select:none;user-select:none}.zoom-in-95{--tw-enter-scale:.95}.running{animation-play-state:running}@media (hover:hover){.group-hover\:shadow-xl:is(:where(.group):hover *){--tw-shadow:0 20px 25px -5px var(--tw-shadow-color,#0000001a),0 8px 10px -6px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}}.peer-disabled\:cursor-not-allowed:is(:where(.peer):disabled~*){cursor:not-allowed}.peer-disabled\:opacity-70:is(:where(.peer):disabled~*){opacity:.7}.selection\:bg-primary ::selection{background-color:var(--primary)}.selection\:bg-primary::selection{background-color:var(--primary)}.selection\:text-primary-foreground ::selection{color:var(--primary-foreground)}.selection\:text-primary-foreground::selection{color:var(--primary-foreground)}.file\:inline-flex::file-selector-button{display:inline-flex}.file\:h-7::file-selector-button{height:calc(var(--spacing)*7)}.file\:border-0::file-selector-button{border-style:var(--tw-border-style);border-width:0}.file\:bg-transparent::file-selector-button{background-color:#0000}.file\:text-sm::file-selector-button{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.file\:font-medium::file-selector-button{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.file\:text-foreground::file-selector-button{color:var(--foreground)}.placeholder\:text-destructive-foreground\/70::placeholder{color:var(--destructive-foreground)}@supports (color:color-mix(in lab,red,red)){.placeholder\:text-destructive-foreground\/70::placeholder{color:color-mix(in oklab,var(--destructive-foreground)70%,transparent)}}.placeholder\:text-muted-foreground::placeholder{color:var(--muted-foreground)}.placeholder\:text-success-foreground\/70::placeholder{color:var(--success-foreground)}@supports (color:color-mix(in lab,red,red)){.placeholder\:text-success-foreground\/70::placeholder{color:color-mix(in oklab,var(--success-foreground)70%,transparent)}}.placeholder\:text-warning-foreground\/70::placeholder{color:var(--warning-foreground)}@supports (color:color-mix(in lab,red,red)){.placeholder\:text-warning-foreground\/70::placeholder{color:color-mix(in oklab,var(--warning-foreground)70%,transparent)}}.first\:rounded-l-md:first-child{border-top-left-radius:calc(var(--radius) - 2px);border-bottom-left-radius:calc(var(--radius) - 2px)}.last\:rounded-r-md:last-child{border-top-right-radius:calc(var(--radius) - 2px);border-bottom-right-radius:calc(var(--radius) - 2px)}.last\:border-b-0:last-child{border-bottom-style:var(--tw-border-style);border-bottom-width:0}@media (hover:hover){.hover\:bg-accent:hover{background-color:var(--accent)}.hover\:bg-destructive\/80:hover{background-color:var(--destructive)}@supports (color:color-mix(in lab,red,red)){.hover\:bg-destructive\/80:hover{background-color:color-mix(in oklab,var(--destructive)80%,transparent)}}.hover\:bg-muted:hover{background-color:var(--muted)}.hover\:bg-primary\/80:hover{background-color:var(--primary)}@supports (color:color-mix(in lab,red,red)){.hover\:bg-primary\/80:hover{background-color:color-mix(in oklab,var(--primary)80%,transparent)}}.hover\:bg-purple-600:hover{background-color:var(--color-purple-600)}.hover\:bg-secondary\/80:hover{background-color:var(--secondary)}@supports (color:color-mix(in lab,red,red)){.hover\:bg-secondary\/80:hover{background-color:color-mix(in oklab,var(--secondary)80%,transparent)}}.hover\:bg-success\/80:hover{background-color:var(--success)}@supports (color:color-mix(in lab,red,red)){.hover\:bg-success\/80:hover{background-color:color-mix(in oklab,var(--success)80%,transparent)}}.hover\:bg-warning\/80:hover{background-color:var(--warning)}@supports (color:color-mix(in lab,red,red)){.hover\:bg-warning\/80:hover{background-color:color-mix(in oklab,var(--warning)80%,transparent)}}.hover\:text-accent-foreground:hover{color:var(--accent-foreground)}.hover\:text-muted-foreground:hover{color:var(--muted-foreground)}.hover\:underline:hover{text-decoration-line:underline}.hover\:opacity-100:hover{opacity:1}}.focus\:z-10:focus{z-index:10}.focus\:ring-2:focus{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(2px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.focus\:ring-ring:focus{--tw-ring-color:var(--ring)}.focus\:ring-offset-2:focus{--tw-ring-offset-width:2px;--tw-ring-offset-shadow:var(--tw-ring-inset,)0 0 0 var(--tw-ring-offset-width)var(--tw-ring-offset-color)}.focus\:outline-hidden:focus{--tw-outline-style:none;outline-style:none}@media (forced-colors:active){.focus\:outline-hidden:focus{outline-offset:2px;outline:2px solid #0000}}.focus-visible\:z-10:focus-visible{z-index:10}.focus-visible\:border-ring:focus-visible{border-color:var(--ring)}.focus-visible\:ring-2:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(2px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.focus-visible\:ring-\[3px\]:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(3px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.focus-visible\:ring-destructive\/20:focus-visible{--tw-ring-color:var(--destructive)}@supports (color:color-mix(in lab,red,red)){.focus-visible\:ring-destructive\/20:focus-visible{--tw-ring-color:color-mix(in oklab,var(--destructive)20%,transparent)}}.focus-visible\:ring-ring:focus-visible,.focus-visible\:ring-ring\/50:focus-visible{--tw-ring-color:var(--ring)}@supports (color:color-mix(in lab,red,red)){.focus-visible\:ring-ring\/50:focus-visible{--tw-ring-color:color-mix(in oklab,var(--ring)50%,transparent)}}.focus-visible\:ring-offset-2:focus-visible{--tw-ring-offset-width:2px;--tw-ring-offset-shadow:var(--tw-ring-inset,)0 0 0 var(--tw-ring-offset-width)var(--tw-ring-offset-color)}.focus-visible\:outline-none:focus-visible{--tw-outline-style:none;outline-style:none}.disabled\:pointer-events-none:disabled{pointer-events:none}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:opacity-50:disabled{opacity:.5}.has-data-\[slot\=card-action\]\:grid-cols-\[1fr_auto\]:has([data-slot=card-action]){grid-template-columns:1fr auto}.aria-invalid\:border-destructive[aria-invalid=true]{border-color:var(--destructive)}.aria-invalid\:ring-destructive\/20[aria-invalid=true]{--tw-ring-color:var(--destructive)}@supports (color:color-mix(in lab,red,red)){.aria-invalid\:ring-destructive\/20[aria-invalid=true]{--tw-ring-color:color-mix(in oklab,var(--destructive)20%,transparent)}}.data-\[side\=bottom\]\:slide-in-from-top-2[data-side=bottom]{--tw-enter-translate-y:calc(2*var(--spacing)*-1)}.data-\[side\=left\]\:slide-in-from-right-2[data-side=left]{--tw-enter-translate-x:calc(2*var(--spacing))}.data-\[side\=right\]\:slide-in-from-left-2[data-side=right]{--tw-enter-translate-x:calc(2*var(--spacing)*-1)}.data-\[side\=top\]\:slide-in-from-bottom-2[data-side=top]{--tw-enter-translate-y:calc(2*var(--spacing))}.data-\[state\=checked\]\:translate-x-\[calc\(100\%-2px\)\][data-state=checked]{--tw-translate-x: calc(100% - 2px) ;translate:var(--tw-translate-x)var(--tw-translate-y)}.data-\[state\=checked\]\:bg-primary[data-state=checked]{background-color:var(--primary)}.data-\[state\=closed\]\:animate-accordion-up[data-state=closed]{animation:accordion-up var(--tw-animation-duration,var(--tw-duration,.2s))ease-out}.data-\[state\=closed\]\:animate-out[data-state=closed]{animation:exit var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none)}.data-\[state\=closed\]\:fade-out-0[data-state=closed]{--tw-exit-opacity:0}.data-\[state\=closed\]\:zoom-out-95[data-state=closed]{--tw-exit-scale:.95}.data-\[state\=on\]\:bg-accent[data-state=on]{background-color:var(--accent)}.data-\[state\=on\]\:text-accent-foreground[data-state=on]{color:var(--accent-foreground)}.data-\[state\=open\]\:animate-accordion-down[data-state=open]{animation:accordion-down var(--tw-animation-duration,var(--tw-duration,.2s))ease-out}.data-\[state\=open\]\:animate-in[data-state=open]{animation:enter var(--tw-animation-duration,var(--tw-duration,.15s))var(--tw-ease,ease)var(--tw-animation-delay,0s)var(--tw-animation-iteration-count,1)var(--tw-animation-direction,normal)var(--tw-animation-fill-mode,none)}.data-\[state\=open\]\:bg-accent[data-state=open]{background-color:var(--accent)}.data-\[state\=open\]\:text-muted-foreground[data-state=open]{color:var(--muted-foreground)}.data-\[state\=open\]\:fade-in-0[data-state=open]{--tw-enter-opacity:0}.data-\[state\=open\]\:zoom-in-95[data-state=open]{--tw-enter-scale:.95}.data-\[state\=unchecked\]\:translate-x-0[data-state=unchecked]{--tw-translate-x:calc(var(--spacing)*0);translate:var(--tw-translate-x)var(--tw-translate-y)}.data-\[state\=unchecked\]\:bg-input[data-state=unchecked]{background-color:var(--input)}.data-\[variant\=outline\]\:border-l-0[data-variant=outline]{border-left-style:var(--tw-border-style);border-left-width:0}.data-\[variant\=outline\]\:shadow-xs[data-variant=outline]{--tw-shadow:0 1px 2px 0 var(--tw-shadow-color,#0000000d);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.data-\[variant\=outline\]\:first\:border-l[data-variant=outline]:first-child{border-left-style:var(--tw-border-style);border-left-width:1px}@media (min-width:40rem){.sm\:max-w-lg{max-width:var(--container-lg)}.sm\:flex-row{flex-direction:row}.sm\:justify-end{justify-content:flex-end}.sm\:text-left{text-align:left}}@media (min-width:48rem){.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.md\:text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}}@media (min-width:64rem){.lg\:grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}}.dark\:border-accent:is(.dark *){border-color:var(--accent)}.dark\:border-border:is(.dark *){border-color:var(--border)}.dark\:border-destructive:is(.dark *){border-color:var(--destructive)}.dark\:border-input:is(.dark *){border-color:var(--input)}.dark\:border-secondary:is(.dark *){border-color:var(--secondary)}.dark\:border-success:is(.dark *){border-color:var(--success)}.dark\:border-warning:is(.dark *){border-color:var(--warning)}.dark\:bg-accent:is(.dark *){background-color:var(--accent)}.dark\:bg-background:is(.dark *){background-color:var(--background)}.dark\:bg-card:is(.dark *){background-color:var(--card)}.dark\:bg-destructive:is(.dark *){background-color:var(--destructive)}.dark\:bg-foreground\/50:is(.dark *){background-color:var(--foreground)}@supports (color:color-mix(in lab,red,red)){.dark\:bg-foreground\/50:is(.dark *){background-color:color-mix(in oklab,var(--foreground)50%,transparent)}}.dark\:bg-primary:is(.dark *),.dark\:bg-primary\/20:is(.dark *){background-color:var(--primary)}@supports (color:color-mix(in lab,red,red)){.dark\:bg-primary\/20:is(.dark *){background-color:color-mix(in oklab,var(--primary)20%,transparent)}}.dark\:bg-secondary:is(.dark *){background-color:var(--secondary)}.dark\:bg-success:is(.dark *){background-color:var(--success)}.dark\:bg-transparent:is(.dark *){background-color:#0000}.dark\:bg-warning:is(.dark *){background-color:var(--warning)}.dark\:fill-primary:is(.dark *){fill:var(--primary)}.dark\:text-accent-foreground:is(.dark *){color:var(--accent-foreground)}.dark\:text-card-foreground:is(.dark *){color:var(--card-foreground)}.dark\:text-destructive-foreground:is(.dark *){color:var(--destructive-foreground)}.dark\:text-foreground:is(.dark *){color:var(--foreground)}.dark\:text-muted-foreground:is(.dark *){color:var(--muted-foreground)}.dark\:text-primary:is(.dark *){color:var(--primary)}.dark\:text-primary-foreground:is(.dark *){color:var(--primary-foreground)}.dark\:text-secondary-foreground:is(.dark *){color:var(--secondary-foreground)}.dark\:text-success-foreground:is(.dark *){color:var(--success-foreground)}.dark\:text-warning-foreground:is(.dark *){color:var(--warning-foreground)}.dark\:placeholder\:text-destructive-foreground\/70:is(.dark *)::placeholder{color:var(--destructive-foreground)}@supports (color:color-mix(in lab,red,red)){.dark\:placeholder\:text-destructive-foreground\/70:is(.dark *)::placeholder{color:color-mix(in oklab,var(--destructive-foreground)70%,transparent)}}.dark\:placeholder\:text-muted-foreground:is(.dark *)::placeholder{color:var(--muted-foreground)}.dark\:placeholder\:text-success-foreground\/70:is(.dark *)::placeholder{color:var(--success-foreground)}@supports (color:color-mix(in lab,red,red)){.dark\:placeholder\:text-success-foreground\/70:is(.dark *)::placeholder{color:color-mix(in oklab,var(--success-foreground)70%,transparent)}}.dark\:placeholder\:text-warning-foreground\/70:is(.dark *)::placeholder{color:var(--warning-foreground)}@supports (color:color-mix(in lab,red,red)){.dark\:placeholder\:text-warning-foreground\/70:is(.dark *)::placeholder{color:color-mix(in oklab,var(--warning-foreground)70%,transparent)}}@media (hover:hover){.dark\:hover\:bg-accent:is(.dark *):hover{background-color:var(--accent)}.dark\:hover\:bg-destructive\/80:is(.dark *):hover{background-color:var(--destructive)}@supports (color:color-mix(in lab,red,red)){.dark\:hover\:bg-destructive\/80:is(.dark *):hover{background-color:color-mix(in oklab,var(--destructive)80%,transparent)}}.dark\:hover\:bg-muted:is(.dark *):hover{background-color:var(--muted)}.dark\:hover\:bg-primary\/80:is(.dark *):hover{background-color:var(--primary)}@supports (color:color-mix(in lab,red,red)){.dark\:hover\:bg-primary\/80:is(.dark *):hover{background-color:color-mix(in oklab,var(--primary)80%,transparent)}}.dark\:hover\:bg-secondary\/80:is(.dark *):hover{background-color:var(--secondary)}@supports (color:color-mix(in lab,red,red)){.dark\:hover\:bg-secondary\/80:is(.dark *):hover{background-color:color-mix(in oklab,var(--secondary)80%,transparent)}}.dark\:hover\:bg-success\/80:is(.dark *):hover{background-color:var(--success)}@supports (color:color-mix(in lab,red,red)){.dark\:hover\:bg-success\/80:is(.dark *):hover{background-color:color-mix(in oklab,var(--success)80%,transparent)}}.dark\:hover\:bg-warning\/80:is(.dark *):hover{background-color:var(--warning)}@supports (color:color-mix(in lab,red,red)){.dark\:hover\:bg-warning\/80:is(.dark *):hover{background-color:color-mix(in oklab,var(--warning)80%,transparent)}}.dark\:hover\:text-accent-foreground:is(.dark *):hover{color:var(--accent-foreground)}.dark\:hover\:text-muted-foreground:is(.dark *):hover{color:var(--muted-foreground)}}.dark\:focus-visible\:border-ring:is(.dark *):focus-visible{border-color:var(--ring)}.dark\:focus-visible\:ring-destructive\/40:is(.dark *):focus-visible{--tw-ring-color:var(--destructive)}@supports (color:color-mix(in lab,red,red)){.dark\:focus-visible\:ring-destructive\/40:is(.dark *):focus-visible{--tw-ring-color:color-mix(in oklab,var(--destructive)40%,transparent)}}.dark\:focus-visible\:ring-ring\/50:is(.dark *):focus-visible{--tw-ring-color:var(--ring)}@supports (color:color-mix(in lab,red,red)){.dark\:focus-visible\:ring-ring\/50:is(.dark *):focus-visible{--tw-ring-color:color-mix(in oklab,var(--ring)50%,transparent)}}.dark\:aria-invalid\:ring-destructive\/40:is(.dark *)[aria-invalid=true]{--tw-ring-color:var(--destructive)}@supports (color:color-mix(in lab,red,red)){.dark\:aria-invalid\:ring-destructive\/40:is(.dark *)[aria-invalid=true]{--tw-ring-color:color-mix(in oklab,var(--destructive)40%,transparent)}}.dark\:data-\[state\=checked\]\:bg-primary:is(.dark *)[data-state=checked]{background-color:var(--primary)}.dark\:data-\[state\=checked\]\:bg-primary-foreground:is(.dark *)[data-state=checked]{background-color:var(--primary-foreground)}.dark\:data-\[state\=on\]\:bg-accent:is(.dark *)[data-state=on]{background-color:var(--accent)}.dark\:data-\[state\=on\]\:text-accent-foreground:is(.dark *)[data-state=on]{color:var(--accent-foreground)}.dark\:data-\[state\=unchecked\]\:bg-foreground:is(.dark *)[data-state=unchecked]{background-color:var(--foreground)}.dark\:data-\[state\=unchecked\]\:bg-input:is(.dark *)[data-state=unchecked]{background-color:var(--input)}.dark\:data-\[variant\=outline\]\:shadow-xs:is(.dark *)[data-variant=outline]{--tw-shadow:0 1px 2px 0 var(--tw-shadow-color,#0000000d);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.\[\&_svg\]\:pointer-events-none svg{pointer-events:none}.\[\&_svg\]\:shrink-0 svg{flex-shrink:0}.\[\&_svg\:not\(\[class\*\=\'size-\'\]\)\]\:size-4 svg:not([class*=size-]){width:calc(var(--spacing)*4);height:calc(var(--spacing)*4)}.\[\.border-b\]\:pb-6.border-b{padding-bottom:calc(var(--spacing)*6)}.\[\.border-t\]\:pt-6.border-t{padding-top:calc(var(--spacing)*6)}.\[\&\>svg\]\:pointer-events-none>svg{pointer-events:none}.\[\&\>svg\]\:size-3>svg{width:calc(var(--spacing)*3);height:calc(var(--spacing)*3)}.\[\&\[data-state\=open\]\>svg\]\:rotate-180[data-state=open]>svg{rotate:180deg}@media (hover:hover){a.\[a\&\]\:hover\:bg-accent:hover{background-color:var(--accent)}a.\[a\&\]\:hover\:bg-destructive\/90:hover{background-color:var(--destructive)}@supports (color:color-mix(in lab,red,red)){a.\[a\&\]\:hover\:bg-destructive\/90:hover{background-color:color-mix(in oklab,var(--destructive)90%,transparent)}}a.\[a\&\]\:hover\:bg-primary\/90:hover{background-color:var(--primary)}@supports (color:color-mix(in lab,red,red)){a.\[a\&\]\:hover\:bg-primary\/90:hover{background-color:color-mix(in oklab,var(--primary)90%,transparent)}}a.\[a\&\]\:hover\:bg-secondary\/90:hover{background-color:var(--secondary)}@supports (color:color-mix(in lab,red,red)){a.\[a\&\]\:hover\:bg-secondary\/90:hover{background-color:color-mix(in oklab,var(--secondary)90%,transparent)}}a.\[a\&\]\:hover\:text-accent-foreground:hover{color:var(--accent-foreground)}a.dark\:\[a\&\]\:hover\:bg-accent:is(.dark *):hover{background-color:var(--accent)}a.dark\:\[a\&\]\:hover\:bg-destructive\/90:is(.dark *):hover{background-color:var(--destructive)}@supports (color:color-mix(in lab,red,red)){a.dark\:\[a\&\]\:hover\:bg-destructive\/90:is(.dark *):hover{background-color:color-mix(in oklab,var(--destructive)90%,transparent)}}a.dark\:\[a\&\]\:hover\:bg-primary\/90:is(.dark *):hover{background-color:var(--primary)}@supports (color:color-mix(in lab,red,red)){a.dark\:\[a\&\]\:hover\:bg-primary\/90:is(.dark *):hover{background-color:color-mix(in oklab,var(--primary)90%,transparent)}}a.dark\:\[a\&\]\:hover\:bg-secondary\/90:is(.dark *):hover{background-color:var(--secondary)}@supports (color:color-mix(in lab,red,red)){a.dark\:\[a\&\]\:hover\:bg-secondary\/90:is(.dark *):hover{background-color:color-mix(in oklab,var(--secondary)90%,transparent)}}a.dark\:\[a\&\]\:hover\:text-accent-foreground:is(.dark *):hover{color:var(--accent-foreground)}}}@property --tw-animation-delay{syntax:"*";inherits:false;initial-value:0s}@property --tw-animation-direction{syntax:"*";inherits:false;initial-value:normal}@property --tw-animation-duration{syntax:"*";inherits:false}@property --tw-animation-fill-mode{syntax:"*";inherits:false;initial-value:none}@property --tw-animation-iteration-count{syntax:"*";inherits:false;initial-value:1}@property --tw-enter-opacity{syntax:"*";inherits:false;initial-value:1}@property --tw-enter-rotate{syntax:"*";inherits:false;initial-value:0}@property --tw-enter-scale{syntax:"*";inherits:false;initial-value:1}@property --tw-enter-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-enter-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-exit-opacity{syntax:"*";inherits:false;initial-value:1}@property --tw-exit-rotate{syntax:"*";inherits:false;initial-value:0}@property --tw-exit-scale{syntax:"*";inherits:false;initial-value:1}@property --tw-exit-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-exit-translate-y{syntax:"*";inherits:false;initial-value:0}:root{--color-white:#fff;--color-dark-100:#f4f4f4;--color-dark-200:#dfdfdf;--color-dark-300:#c3c3c3;--color-dark-400:#6e6e6e;--color-dark-500:#3d3d3d;--color-dark-600:#2a2a2a;--color-dark-700:#161616;--color-dark-800:#0e0f10;--color-dark-900:#090a0b;--color-purple-50:#dddcff;--color-purple-100:#c1befe;--color-purple-200:#a8a1fd;--color-purple-300:#9084fc;--color-purple-400:#7968fa;--color-purple-500:#634fd1;--color-purple-600:#4d3ba8;--color-purple-700:#39277f;--color-purple-800:#261657;--color-qodo-accent:#ff9500;--color-qodo-danger:#ff3b30;--color-qodo-warning:#fc0;--color-qodo-success:#30d158;--radius:.625rem;--background:var(--color-white);--foreground:var(--color-dark-900);--card:var(--color-white);--card-foreground:var(--color-dark-900);--popover:var(--color-white);--popover-foreground:var(--color-dark-900);--primary:var(--color-purple-500);--primary-foreground:var(--color-white);--secondary:var(--color-purple-100);--secondary-foreground:var(--color-dark-700);--muted:var(--color-dark-100);--muted-foreground:var(--color-dark-400);--accent:var(--color-purple-400);--accent-foreground:var(--color-white);--success:oklch(55% .12 160);--success-foreground:oklch(99% .005 160);--warning:oklch(65% .15 65);--warning-foreground:oklch(15% .02 65);--destructive:oklch(58% .18 15);--destructive-foreground:oklch(99% .005 15);--border:var(--color-dark-200);--input:var(--color-dark-100);--ring:var(--color-purple-500);--sidebar:var(--color-dark-100);--sidebar-foreground:var(--color-dark-900);--sidebar-primary:var(--color-purple-500);--sidebar-primary-foreground:var(--color-white);--sidebar-accent:var(--color-purple-50);--sidebar-accent-foreground:var(--color-dark-700);--sidebar-border:var(--color-dark-200);--sidebar-ring:var(--color-purple-500)}.dark{--background:var(--color-dark-900);--foreground:var(--color-white);--card:var(--color-dark-800);--card-foreground:var(--color-white);--popover:var(--color-dark-800);--popover-foreground:var(--color-white);--primary:var(--color-purple-400);--primary-foreground:var(--color-white);--secondary:var(--color-dark-700);--secondary-foreground:var(--color-white);--muted:var(--color-dark-600);--muted-foreground:var(--color-dark-300);--accent:var(--color-purple-300);--accent-foreground:var(--color-white);--success:oklch(65% .15 160);--success-foreground:oklch(8% .015 160);--warning:oklch(70% .18 65);--warning-foreground:oklch(8% .015 65);--destructive:oklch(65% .2 15);--destructive-foreground:oklch(95% .005 15);--border:var(--color-dark-700);--input:var(--color-dark-800);--ring:var(--color-purple-400);--sidebar:var(--color-dark-800);--sidebar-foreground:var(--color-white);--sidebar-primary:var(--color-purple-400);--sidebar-primary-foreground:var(--color-white);--sidebar-accent:var(--color-dark-700);--sidebar-accent-foreground:var(--color-white);--sidebar-border:var(--color-dark-700);--sidebar-ring:var(--color-purple-400)}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-space-x-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@keyframes pulse{50%{opacity:.5}}@keyframes enter{0%{opacity:var(--tw-enter-opacity,1);transform:translate3d(var(--tw-enter-translate-x,0),var(--tw-enter-translate-y,0),0)scale3d(var(--tw-enter-scale,1),var(--tw-enter-scale,1),var(--tw-enter-scale,1))rotate(var(--tw-enter-rotate,0))}}@keyframes exit{to{opacity:var(--tw-exit-opacity,1);transform:translate3d(var(--tw-exit-translate-x,0),var(--tw-exit-translate-y,0),0)scale3d(var(--tw-exit-scale,1),var(--tw-exit-scale,1),var(--tw-exit-scale,1))rotate(var(--tw-exit-rotate,0))}}@keyframes accordion-down{0%{height:0}to{height:var(--radix-accordion-content-height,var(--bits-accordion-content-height,var(--reka-accordion-content-height,var(--kb-accordion-content-height,auto))))}}@keyframes accordion-up{0%{height:var(--radix-accordion-content-height,var(--bits-accordion-content-height,var(--reka-accordion-content-height,var(--kb-accordion-content-height,auto))))}to{height:0}}