@vizzly-testing/cli 0.16.3 → 0.17.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
@@ -227,7 +227,7 @@ vizzly run "npm test" --parallel-id "ci-run-123" # For parallel CI builds
227
227
 
228
228
  **Processing Options:**
229
229
  - `--wait` - Wait for build completion and exit with appropriate code
230
- - `--threshold <number>` - Comparison threshold (0-1, default: 0.01)
230
+ - `--threshold <number>` - Comparison threshold (CIEDE2000 Delta E, default: 2.0)
231
231
  - `--upload-timeout <ms>` - Upload wait timeout in ms
232
232
  - `--upload-all` - Upload all screenshots without SHA deduplication
233
233
 
@@ -279,7 +279,7 @@ vizzly dev stop
279
279
  **Dev Command Options:**
280
280
  - `--set-baseline` - Accept current screenshots as new baseline
281
281
  - `--baseline-build <id>` - Use specific build as baseline (requires API token)
282
- - `--threshold <number>` - Comparison threshold (0-1, default: 0.1)
282
+ - `--threshold <number>` - Comparison threshold (CIEDE2000 Delta E, default: 2.0)
283
283
  - `--port <port>` - Server port (default: 47392)
284
284
  - `--timeout <ms>` - Server timeout (default: 30000)
285
285
  - `--open` - Auto-open dashboard in browser (start command only)
@@ -357,9 +357,9 @@ export default {
357
357
  timeout: 30000
358
358
  },
359
359
 
360
- // Comparison configuration
360
+ // Comparison configuration (CIEDE2000 Delta E: 0=exact, 1=JND, 2=recommended)
361
361
  comparison: {
362
- threshold: 0.1,
362
+ threshold: 2.0,
363
363
  ignoreAntialiasing: true
364
364
  },
365
365
 
@@ -118,7 +118,7 @@ Response:
118
118
  "name": "homepage",
119
119
  "status": "failed",
120
120
  "diffPercentage": 2.3,
121
- "threshold": 0.1,
121
+ "threshold": 2.0,
122
122
  "mode": "local",
123
123
  "baselinePath": "/Users/you/project/.vizzly/baselines/homepage.png",
124
124
  "currentPath": "/Users/you/project/.vizzly/screenshots/homepage.png"
@@ -170,7 +170,7 @@ Response:
170
170
  "name": "login-page",
171
171
  "status": "failed",
172
172
  "diffPercentage": 0.8,
173
- "threshold": 0.1,
173
+ "threshold": 2.0,
174
174
  "mode": "cloud",
175
175
  "baselineUrl": "https://app.vizzly.dev/screenshots/abc123/baseline.png",
176
176
  "currentUrl": "https://app.vizzly.dev/screenshots/abc123/current.png",
@@ -75,13 +75,14 @@ export async function doctorCommand(options = {}, globalOptions = {}) {
75
75
  // Validate threshold (0..1 inclusive)
76
76
  let threshold = Number(config?.comparison?.threshold);
77
77
  diagnostics.configuration.threshold = threshold;
78
- let thresholdValid = Number.isFinite(threshold) && threshold >= 0 && threshold <= 1;
78
+ // CIEDE2000 threshold: 0 = exact, 1 = JND, 2 = recommended, 3+ = permissive
79
+ let thresholdValid = Number.isFinite(threshold) && threshold >= 0;
79
80
  diagnostics.configuration.thresholdValid = thresholdValid;
80
81
  if (thresholdValid) {
81
- output.success(`Threshold: ${threshold}`);
82
+ output.success(`Threshold: ${threshold} (CIEDE2000 Delta E)`);
82
83
  } else {
83
84
  hasErrors = true;
84
- output.error('Invalid threshold (expected number between 0 and 1)');
85
+ output.error('Invalid threshold (expected non-negative number)');
85
86
  }
86
87
 
87
88
  // Report effective port without binding
@@ -60,9 +60,9 @@ export class InitCommand {
60
60
  timeout: 30000
61
61
  },
62
62
 
63
- // Comparison configuration
63
+ // Comparison configuration (CIEDE2000 Delta E: 0=exact, 1=JND, 2=recommended)
64
64
  comparison: {
65
- threshold: 0.1
65
+ threshold: 2.0
66
66
  },
67
67
 
68
68
  // TDD configuration
@@ -218,8 +218,8 @@ export function validateTddOptions(testCommand, options) {
218
218
  }
219
219
  if (options.threshold !== undefined) {
220
220
  let threshold = parseFloat(options.threshold);
221
- if (isNaN(threshold) || threshold < 0 || threshold > 1) {
222
- errors.push('Threshold must be a number between 0 and 1');
221
+ if (isNaN(threshold) || threshold < 0) {
222
+ errors.push('Threshold must be a non-negative number (CIEDE2000 Delta E)');
223
223
  }
224
224
  }
225
225
  return errors;
@@ -215,8 +215,8 @@ export function validateUploadOptions(screenshotsPath, options) {
215
215
  }
216
216
  if (options.threshold !== undefined) {
217
217
  let threshold = parseFloat(options.threshold);
218
- if (isNaN(threshold) || threshold < 0 || threshold > 1) {
219
- errors.push('Threshold must be a number between 0 and 1');
218
+ if (isNaN(threshold) || threshold < 0) {
219
+ errors.push('Threshold must be a non-negative number (CIEDE2000 Delta E)');
220
220
  }
221
221
  }
222
222
  if (options.batchSize !== undefined) {
@@ -1 +1 @@
1
- @import"https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600&display=swap";@layer properties,theme,base,components,utilities;@layer theme{:root,:host{--font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-red-300:oklch(80.8% .114 19.571);--color-red-400:oklch(70.4% .191 22.216);--color-red-500:oklch(63.7% .237 25.331);--color-red-600:oklch(57.7% .245 27.325);--color-amber-200:oklch(92.4% .12 95.746);--color-amber-300:oklch(87.9% .169 91.605);--color-amber-400:oklch(82.8% .189 84.429);--color-amber-500:oklch(76.9% .188 70.08);--color-amber-600:oklch(66.6% .179 58.318);--color-amber-900:oklch(41.4% .112 45.904);--color-yellow-500:oklch(79.5% .184 86.047);--color-green-300:oklch(87.1% .15 154.449);--color-green-400:oklch(79.2% .209 151.711);--color-green-500:oklch(72.3% .219 149.579);--color-green-600:oklch(62.7% .194 149.214);--color-emerald-300:oklch(84.5% .143 164.978);--color-emerald-400:oklch(76.5% .177 163.223);--color-emerald-500:oklch(69.6% .17 162.48);--color-emerald-600:oklch(59.6% .145 163.225);--color-emerald-700:oklch(50.8% .118 165.612);--color-emerald-800:oklch(43.2% .095 166.913);--color-cyan-500:oklch(71.5% .143 215.221);--color-cyan-600:oklch(60.9% .126 221.723);--color-blue-300:oklch(80.9% .105 251.813);--color-blue-400:oklch(70.7% .165 254.624);--color-blue-500:oklch(62.3% .214 259.815);--color-blue-600:oklch(54.6% .245 262.881);--color-blue-900:oklch(37.9% .146 265.522);--color-purple-400:oklch(71.4% .203 305.504);--color-purple-500:oklch(62.7% .265 303.9);--color-slate-300:oklch(86.9% .022 252.894);--color-slate-400:oklch(70.4% .04 256.788);--color-slate-500:oklch(55.4% .046 257.417);--color-slate-600:oklch(44.6% .043 257.281);--color-slate-700:oklch(37.2% .044 257.287);--color-slate-800:oklch(27.9% .041 260.031);--color-slate-900:oklch(20.8% .042 265.755);--color-slate-950:oklch(12.9% .042 264.695);--color-gray-200:oklch(92.8% .006 264.531);--color-gray-300:oklch(87.2% .01 258.338);--color-gray-400:oklch(70.7% .022 261.325);--color-gray-500:oklch(55.1% .027 264.364);--color-gray-600:oklch(44.6% .03 256.802);--color-gray-700:oklch(37.3% .034 259.733);--color-gray-800:oklch(27.8% .033 256.848);--color-gray-900:oklch(21% .034 264.665);--color-black:#000;--color-white:#fff;--spacing:.25rem;--container-sm:24rem;--container-md:28rem;--container-lg:32rem;--container-xl:36rem;--container-2xl:42rem;--container-4xl:56rem;--container-7xl:80rem;--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);--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--tracking-wide:.025em;--tracking-wider:.05em;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--radius-2xl:1rem;--animate-spin:spin 1s linear infinite;--animate-ping:ping 1s cubic-bezier(0,0,.2,1)infinite;--animate-pulse:pulse 2s cubic-bezier(.4,0,.6,1)infinite;--blur-sm:8px;--blur-md:12px;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-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%;-moz-tab-size:4;-o-tab-size:4;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}::-moz-placeholder{opacity:1}::placeholder{opacity:1}@supports (not (-webkit-appearance:-apple-pay-button)) or (contain-intrinsic-size:1px){::-moz-placeholder{color:currentColor}::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::-moz-placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}::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}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){-webkit-appearance:button;-moz-appearance:button;appearance:button}::file-selector-button{-webkit-appearance:button;-moz-appearance: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 utilities{.pointer-events-auto{pointer-events:auto}.pointer-events-none{pointer-events:none}.visible{visibility:visible}.sr-only{clip-path:inset(50%);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}.static{position:static}.sticky{position:sticky}.inset-0{inset:calc(var(--spacing)*0)}.-top-1{top:calc(var(--spacing)*-1)}.top-0{top:calc(var(--spacing)*0)}.top-1{top:calc(var(--spacing)*1)}.top-1\/2{top:50%}.top-2{top:calc(var(--spacing)*2)}.top-4{top:calc(var(--spacing)*4)}.-right-1{right:calc(var(--spacing)*-1)}.right-0{right:calc(var(--spacing)*0)}.right-2{right:calc(var(--spacing)*2)}.right-3{right:calc(var(--spacing)*3)}.right-4{right:calc(var(--spacing)*4)}.right-6{right:calc(var(--spacing)*6)}.bottom-0{bottom:calc(var(--spacing)*0)}.bottom-1{bottom:calc(var(--spacing)*1)}.bottom-2{bottom:calc(var(--spacing)*2)}.bottom-4{bottom:calc(var(--spacing)*4)}.bottom-6{bottom:calc(var(--spacing)*6)}.bottom-full{bottom:100%}.left-0{left:calc(var(--spacing)*0)}.left-1{left:calc(var(--spacing)*1)}.left-1\/2{left:50%}.left-2{left:calc(var(--spacing)*2)}.left-3{left:calc(var(--spacing)*3)}.left-6{left:calc(var(--spacing)*6)}.z-10{z-index:10}.z-20{z-index:20}.z-30{z-index:30}.z-40{z-index:40}.z-50{z-index:50}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.-mx-1{margin-inline:calc(var(--spacing)*-1)}.mx-auto{margin-inline:auto}.mt-0\.5{margin-top:calc(var(--spacing)*.5)}.mt-1{margin-top:calc(var(--spacing)*1)}.mt-2{margin-top:calc(var(--spacing)*2)}.mt-3{margin-top:calc(var(--spacing)*3)}.mt-4{margin-top:calc(var(--spacing)*4)}.mt-6{margin-top:calc(var(--spacing)*6)}.-mr-1{margin-right:calc(var(--spacing)*-1)}.mr-1{margin-right:calc(var(--spacing)*1)}.-mb-px{margin-bottom:-1px}.mb-1{margin-bottom:calc(var(--spacing)*1)}.mb-2{margin-bottom:calc(var(--spacing)*2)}.mb-3{margin-bottom:calc(var(--spacing)*3)}.mb-4{margin-bottom:calc(var(--spacing)*4)}.mb-5{margin-bottom:calc(var(--spacing)*5)}.mb-6{margin-bottom:calc(var(--spacing)*6)}.mb-8{margin-bottom:calc(var(--spacing)*8)}.ml-1{margin-left:calc(var(--spacing)*1)}.ml-4{margin-left:calc(var(--spacing)*4)}.ml-auto{margin-left:auto}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.inline-block{display:inline-block}.inline-flex{display:inline-flex}.h-0\.5{height:calc(var(--spacing)*.5)}.h-1\.5{height:calc(var(--spacing)*1.5)}.h-2{height:calc(var(--spacing)*2)}.h-2\.5{height:calc(var(--spacing)*2.5)}.h-3{height:calc(var(--spacing)*3)}.h-3\.5{height:calc(var(--spacing)*3.5)}.h-4{height:calc(var(--spacing)*4)}.h-5{height:calc(var(--spacing)*5)}.h-6{height:calc(var(--spacing)*6)}.h-7{height:calc(var(--spacing)*7)}.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-32{height:calc(var(--spacing)*32)}.h-full{height:100%}.min-h-0{min-height:calc(var(--spacing)*0)}.min-h-\[200px\]{min-height:200px}.min-h-full{min-height:100%}.min-h-screen{min-height:100vh}.w-0\.5{width:calc(var(--spacing)*.5)}.w-1\.5{width:calc(var(--spacing)*1.5)}.w-1\/4{width:25%}.w-2{width:calc(var(--spacing)*2)}.w-2\.5{width:calc(var(--spacing)*2.5)}.w-2\/3{width:66.6667%}.w-3{width:calc(var(--spacing)*3)}.w-3\.5{width:calc(var(--spacing)*3.5)}.w-3\/5{width:60%}.w-4{width:calc(var(--spacing)*4)}.w-4\/5{width:80%}.w-5{width:calc(var(--spacing)*5)}.w-6{width:calc(var(--spacing)*6)}.w-7{width:calc(var(--spacing)*7)}.w-8{width:calc(var(--spacing)*8)}.w-10{width:calc(var(--spacing)*10)}.w-11{width:calc(var(--spacing)*11)}.w-12{width:calc(var(--spacing)*12)}.w-14{width:calc(var(--spacing)*14)}.w-16{width:calc(var(--spacing)*16)}.w-24{width:calc(var(--spacing)*24)}.w-32{width:calc(var(--spacing)*32)}.w-40{width:calc(var(--spacing)*40)}.w-64{width:calc(var(--spacing)*64)}.w-72{width:calc(var(--spacing)*72)}.w-96{width:calc(var(--spacing)*96)}.w-full{width:100%}.w-px{width:1px}.max-w-2xl{max-width:var(--container-2xl)}.max-w-4xl{max-width:var(--container-4xl)}.max-w-7xl{max-width:var(--container-7xl)}.max-w-\[300px\]{max-width:300px}.max-w-full{max-width:100%}.max-w-lg{max-width:var(--container-lg)}.max-w-md{max-width:var(--container-md)}.max-w-sm{max-width:var(--container-sm)}.max-w-xl{max-width:var(--container-xl)}.min-w-0{min-width:calc(var(--spacing)*0)}.min-w-\[3rem\]{min-width:3rem}.min-w-\[60px\]{min-width:60px}.min-w-full{min-width:100%}.flex-1{flex:1}.flex-shrink-0{flex-shrink:0}.-translate-x-1\/2{--tw-translate-x: -50% ;translate:var(--tw-translate-x)var(--tw-translate-y)}.-translate-y-1\/2{--tw-translate-y: -50% ;translate:var(--tw-translate-x)var(--tw-translate-y)}.scale-110{--tw-scale-x:110%;--tw-scale-y:110%;--tw-scale-z:110%;scale:var(--tw-scale-x)var(--tw-scale-y)}.rotate-180{rotate:180deg}.rotate-\[-90deg\]{rotate:-90deg}.transform{transform:var(--tw-rotate-x,)var(--tw-rotate-y,)var(--tw-rotate-z,)var(--tw-skew-x,)var(--tw-skew-y,)}.animate-ping{animation:var(--animate-ping)}.animate-pulse{animation:var(--animate-pulse)}.animate-spin{animation:var(--animate-spin)}.cursor-col-resize{cursor:col-resize}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.cursor-text{cursor:text}.touch-manipulation{touch-action:manipulation}.appearance-none{-webkit-appearance:none;-moz-appearance:none;appearance:none}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.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-3{gap:calc(var(--spacing)*3)}.gap-4{gap:calc(var(--spacing)*4)}.gap-6{gap:calc(var(--spacing)*6)}:where(.space-y-1\.5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*1.5)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*1.5)*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)))}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-xl{border-radius:var(--radius-xl)}.rounded-t-lg{border-top-left-radius:var(--radius-lg);border-top-right-radius:var(--radius-lg)}.rounded-l-lg{border-top-left-radius:var(--radius-lg);border-bottom-left-radius:var(--radius-lg)}.rounded-r-lg{border-top-right-radius:var(--radius-lg);border-bottom-right-radius:var(--radius-lg)}.border{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-x{border-inline-style:var(--tw-border-style);border-inline-width:1px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-l-2{border-left-style:var(--tw-border-style);border-left-width:2px}.border-amber-500{border-color:var(--color-amber-500)}.border-amber-500\/20{border-color:#f99c0033}@supports (color:color-mix(in lab,red,red)){.border-amber-500\/20{border-color:color-mix(in oklab,var(--color-amber-500)20%,transparent)}}.border-amber-600\/50{border-color:#dd740080}@supports (color:color-mix(in lab,red,red)){.border-amber-600\/50{border-color:color-mix(in oklab,var(--color-amber-600)50%,transparent)}}.border-blue-500\/20{border-color:#3080ff33}@supports (color:color-mix(in lab,red,red)){.border-blue-500\/20{border-color:color-mix(in oklab,var(--color-blue-500)20%,transparent)}}.border-blue-500\/30{border-color:#3080ff4d}@supports (color:color-mix(in lab,red,red)){.border-blue-500\/30{border-color:color-mix(in oklab,var(--color-blue-500)30%,transparent)}}.border-blue-500\/40{border-color:#3080ff66}@supports (color:color-mix(in lab,red,red)){.border-blue-500\/40{border-color:color-mix(in oklab,var(--color-blue-500)40%,transparent)}}.border-emerald-500\/20{border-color:#00bb7f33}@supports (color:color-mix(in lab,red,red)){.border-emerald-500\/20{border-color:color-mix(in oklab,var(--color-emerald-500)20%,transparent)}}.border-gray-600{border-color:var(--color-gray-600)}.border-gray-600\/40{border-color:#4a556566}@supports (color:color-mix(in lab,red,red)){.border-gray-600\/40{border-color:color-mix(in oklab,var(--color-gray-600)40%,transparent)}}.border-gray-600\/50{border-color:#4a556580}@supports (color:color-mix(in lab,red,red)){.border-gray-600\/50{border-color:color-mix(in oklab,var(--color-gray-600)50%,transparent)}}.border-gray-700{border-color:var(--color-gray-700)}.border-gray-700\/50{border-color:#36415380}@supports (color:color-mix(in lab,red,red)){.border-gray-700\/50{border-color:color-mix(in oklab,var(--color-gray-700)50%,transparent)}}.border-gray-800\/50{border-color:#1e293980}@supports (color:color-mix(in lab,red,red)){.border-gray-800\/50{border-color:color-mix(in oklab,var(--color-gray-800)50%,transparent)}}.border-gray-900{border-color:var(--color-gray-900)}.border-green-500\/30{border-color:#00c7584d}@supports (color:color-mix(in lab,red,red)){.border-green-500\/30{border-color:color-mix(in oklab,var(--color-green-500)30%,transparent)}}.border-purple-500\/20{border-color:#ac4bff33}@supports (color:color-mix(in lab,red,red)){.border-purple-500\/20{border-color:color-mix(in oklab,var(--color-purple-500)20%,transparent)}}.border-red-500{border-color:var(--color-red-500)}.border-red-500\/20{border-color:#fb2c3633}@supports (color:color-mix(in lab,red,red)){.border-red-500\/20{border-color:color-mix(in oklab,var(--color-red-500)20%,transparent)}}.border-red-500\/30{border-color:#fb2c364d}@supports (color:color-mix(in lab,red,red)){.border-red-500\/30{border-color:color-mix(in oklab,var(--color-red-500)30%,transparent)}}.border-red-500\/40{border-color:#fb2c3666}@supports (color:color-mix(in lab,red,red)){.border-red-500\/40{border-color:color-mix(in oklab,var(--color-red-500)40%,transparent)}}.border-red-500\/50{border-color:#fb2c3680}@supports (color:color-mix(in lab,red,red)){.border-red-500\/50{border-color:color-mix(in oklab,var(--color-red-500)50%,transparent)}}.border-slate-500\/20{border-color:#62748e33}@supports (color:color-mix(in lab,red,red)){.border-slate-500\/20{border-color:color-mix(in oklab,var(--color-slate-500)20%,transparent)}}.border-slate-600{border-color:var(--color-slate-600)}.border-slate-700{border-color:var(--color-slate-700)}.border-slate-700\/30{border-color:#3141584d}@supports (color:color-mix(in lab,red,red)){.border-slate-700\/30{border-color:color-mix(in oklab,var(--color-slate-700)30%,transparent)}}.border-slate-700\/50{border-color:#31415880}@supports (color:color-mix(in lab,red,red)){.border-slate-700\/50{border-color:color-mix(in oklab,var(--color-slate-700)50%,transparent)}}.border-white\/10{border-color:#ffffff1a}@supports (color:color-mix(in lab,red,red)){.border-white\/10{border-color:color-mix(in oklab,var(--color-white)10%,transparent)}}.border-l-amber-500{border-left-color:var(--color-amber-500)}.border-l-blue-500{border-left-color:var(--color-blue-500)}.border-l-emerald-500{border-left-color:var(--color-emerald-500)}.border-l-purple-500{border-left-color:var(--color-purple-500)}.border-l-red-500{border-left-color:var(--color-red-500)}.bg-amber-400{background-color:var(--color-amber-400)}.bg-amber-500{background-color:var(--color-amber-500)}.bg-amber-500\/10{background-color:#f99c001a}@supports (color:color-mix(in lab,red,red)){.bg-amber-500\/10{background-color:color-mix(in oklab,var(--color-amber-500)10%,transparent)}}.bg-amber-500\/20{background-color:#f99c0033}@supports (color:color-mix(in lab,red,red)){.bg-amber-500\/20{background-color:color-mix(in oklab,var(--color-amber-500)20%,transparent)}}.bg-amber-600\/90{background-color:#dd7400e6}@supports (color:color-mix(in lab,red,red)){.bg-amber-600\/90{background-color:color-mix(in oklab,var(--color-amber-600)90%,transparent)}}.bg-amber-900\/90{background-color:#7b3306e6}@supports (color:color-mix(in lab,red,red)){.bg-amber-900\/90{background-color:color-mix(in oklab,var(--color-amber-900)90%,transparent)}}.bg-black\/60{background-color:#0009}@supports (color:color-mix(in lab,red,red)){.bg-black\/60{background-color:color-mix(in oklab,var(--color-black)60%,transparent)}}.bg-black\/70{background-color:#000000b3}@supports (color:color-mix(in lab,red,red)){.bg-black\/70{background-color:color-mix(in oklab,var(--color-black)70%,transparent)}}.bg-blue-400{background-color:var(--color-blue-400)}.bg-blue-500{background-color:var(--color-blue-500)}.bg-blue-500\/10{background-color:#3080ff1a}@supports (color:color-mix(in lab,red,red)){.bg-blue-500\/10{background-color:color-mix(in oklab,var(--color-blue-500)10%,transparent)}}.bg-blue-500\/20{background-color:#3080ff33}@supports (color:color-mix(in lab,red,red)){.bg-blue-500\/20{background-color:color-mix(in oklab,var(--color-blue-500)20%,transparent)}}.bg-blue-600{background-color:var(--color-blue-600)}.bg-blue-600\/30{background-color:#155dfc4d}@supports (color:color-mix(in lab,red,red)){.bg-blue-600\/30{background-color:color-mix(in oklab,var(--color-blue-600)30%,transparent)}}.bg-blue-600\/90{background-color:#155dfce6}@supports (color:color-mix(in lab,red,red)){.bg-blue-600\/90{background-color:color-mix(in oklab,var(--color-blue-600)90%,transparent)}}.bg-blue-900\/80{background-color:#1c398ecc}@supports (color:color-mix(in lab,red,red)){.bg-blue-900\/80{background-color:color-mix(in oklab,var(--color-blue-900)80%,transparent)}}.bg-current{background-color:currentColor}.bg-cyan-500{background-color:var(--color-cyan-500)}.bg-emerald-400{background-color:var(--color-emerald-400)}.bg-emerald-500{background-color:var(--color-emerald-500)}.bg-emerald-500\/10{background-color:#00bb7f1a}@supports (color:color-mix(in lab,red,red)){.bg-emerald-500\/10{background-color:color-mix(in oklab,var(--color-emerald-500)10%,transparent)}}.bg-emerald-500\/20{background-color:#00bb7f33}@supports (color:color-mix(in lab,red,red)){.bg-emerald-500\/20{background-color:color-mix(in oklab,var(--color-emerald-500)20%,transparent)}}.bg-emerald-600{background-color:var(--color-emerald-600)}.bg-gray-700{background-color:var(--color-gray-700)}.bg-gray-700\/50{background-color:#36415380}@supports (color:color-mix(in lab,red,red)){.bg-gray-700\/50{background-color:color-mix(in oklab,var(--color-gray-700)50%,transparent)}}.bg-gray-800{background-color:var(--color-gray-800)}.bg-gray-800\/60{background-color:#1e293999}@supports (color:color-mix(in lab,red,red)){.bg-gray-800\/60{background-color:color-mix(in oklab,var(--color-gray-800)60%,transparent)}}.bg-gray-800\/90{background-color:#1e2939e6}@supports (color:color-mix(in lab,red,red)){.bg-gray-800\/90{background-color:color-mix(in oklab,var(--color-gray-800)90%,transparent)}}.bg-gray-900{background-color:var(--color-gray-900)}.bg-gray-900\/50{background-color:#10182880}@supports (color:color-mix(in lab,red,red)){.bg-gray-900\/50{background-color:color-mix(in oklab,var(--color-gray-900)50%,transparent)}}.bg-gray-900\/95{background-color:#101828f2}@supports (color:color-mix(in lab,red,red)){.bg-gray-900\/95{background-color:color-mix(in oklab,var(--color-gray-900)95%,transparent)}}.bg-green-500\/10{background-color:#00c7581a}@supports (color:color-mix(in lab,red,red)){.bg-green-500\/10{background-color:color-mix(in oklab,var(--color-green-500)10%,transparent)}}.bg-green-600{background-color:var(--color-green-600)}.bg-purple-400{background-color:var(--color-purple-400)}.bg-purple-500\/10{background-color:#ac4bff1a}@supports (color:color-mix(in lab,red,red)){.bg-purple-500\/10{background-color:color-mix(in oklab,var(--color-purple-500)10%,transparent)}}.bg-red-400{background-color:var(--color-red-400)}.bg-red-500{background-color:var(--color-red-500)}.bg-red-500\/10{background-color:#fb2c361a}@supports (color:color-mix(in lab,red,red)){.bg-red-500\/10{background-color:color-mix(in oklab,var(--color-red-500)10%,transparent)}}.bg-red-500\/20{background-color:#fb2c3633}@supports (color:color-mix(in lab,red,red)){.bg-red-500\/20{background-color:color-mix(in oklab,var(--color-red-500)20%,transparent)}}.bg-red-600{background-color:var(--color-red-600)}.bg-slate-400{background-color:var(--color-slate-400)}.bg-slate-500{background-color:var(--color-slate-500)}.bg-slate-500\/15{background-color:#62748e26}@supports (color:color-mix(in lab,red,red)){.bg-slate-500\/15{background-color:color-mix(in oklab,var(--color-slate-500)15%,transparent)}}.bg-slate-700{background-color:var(--color-slate-700)}.bg-slate-700\/50{background-color:#31415880}@supports (color:color-mix(in lab,red,red)){.bg-slate-700\/50{background-color:color-mix(in oklab,var(--color-slate-700)50%,transparent)}}.bg-slate-800{background-color:var(--color-slate-800)}.bg-slate-800\/50{background-color:#1d293d80}@supports (color:color-mix(in lab,red,red)){.bg-slate-800\/50{background-color:color-mix(in oklab,var(--color-slate-800)50%,transparent)}}.bg-slate-800\/90{background-color:#1d293de6}@supports (color:color-mix(in lab,red,red)){.bg-slate-800\/90{background-color:color-mix(in oklab,var(--color-slate-800)90%,transparent)}}.bg-slate-900{background-color:var(--color-slate-900)}.bg-slate-900\/20{background-color:#0f172b33}@supports (color:color-mix(in lab,red,red)){.bg-slate-900\/20{background-color:color-mix(in oklab,var(--color-slate-900)20%,transparent)}}.bg-slate-900\/30{background-color:#0f172b4d}@supports (color:color-mix(in lab,red,red)){.bg-slate-900\/30{background-color:color-mix(in oklab,var(--color-slate-900)30%,transparent)}}.bg-slate-900\/50{background-color:#0f172b80}@supports (color:color-mix(in lab,red,red)){.bg-slate-900\/50{background-color:color-mix(in oklab,var(--color-slate-900)50%,transparent)}}.bg-slate-900\/95{background-color:#0f172bf2}@supports (color:color-mix(in lab,red,red)){.bg-slate-900\/95{background-color:color-mix(in oklab,var(--color-slate-900)95%,transparent)}}.bg-slate-950{background-color:var(--color-slate-950)}.bg-transparent{background-color:#0000}.bg-white{background-color:var(--color-white)}.bg-white\/5{background-color:#ffffff0d}@supports (color:color-mix(in lab,red,red)){.bg-white\/5{background-color:color-mix(in oklab,var(--color-white)5%,transparent)}}.bg-white\/10{background-color:#ffffff1a}@supports (color:color-mix(in lab,red,red)){.bg-white\/10{background-color:color-mix(in oklab,var(--color-white)10%,transparent)}}.bg-white\/\[0\.03\]{background-color:#ffffff08}@supports (color:color-mix(in lab,red,red)){.bg-white\/\[0\.03\]{background-color:color-mix(in oklab,var(--color-white)3%,transparent)}}.bg-yellow-500{background-color:var(--color-yellow-500)}.bg-gradient-to-br{--tw-gradient-position:to bottom right in oklab;background-image:linear-gradient(var(--tw-gradient-stops))}.from-gray-800{--tw-gradient-from:var(--color-gray-800);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position),var(--tw-gradient-from)var(--tw-gradient-from-position),var(--tw-gradient-to)var(--tw-gradient-to-position))}.to-gray-700{--tw-gradient-to:var(--color-gray-700);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position),var(--tw-gradient-from)var(--tw-gradient-from-position),var(--tw-gradient-to)var(--tw-gradient-to-position))}.object-cover{-o-object-fit:cover;object-fit:cover}.object-top{-o-object-position:top;object-position:top}.\!p-2{padding:calc(var(--spacing)*2)!important}.p-0{padding:calc(var(--spacing)*0)}.p-0\.5{padding:calc(var(--spacing)*.5)}.p-1{padding:calc(var(--spacing)*1)}.p-1\.5{padding:calc(var(--spacing)*1.5)}.p-2{padding:calc(var(--spacing)*2)}.p-2\.5{padding:calc(var(--spacing)*2.5)}.p-3{padding:calc(var(--spacing)*3)}.p-4{padding:calc(var(--spacing)*4)}.p-5{padding:calc(var(--spacing)*5)}.p-6{padding:calc(var(--spacing)*6)}.px-1{padding-inline:calc(var(--spacing)*1)}.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)}.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-2\.5{padding-block:calc(var(--spacing)*2.5)}.py-3{padding-block:calc(var(--spacing)*3)}.py-4{padding-block:calc(var(--spacing)*4)}.py-5{padding-block:calc(var(--spacing)*5)}.py-6{padding-block:calc(var(--spacing)*6)}.py-8{padding-block:calc(var(--spacing)*8)}.py-12{padding-block:calc(var(--spacing)*12)}.py-16{padding-block:calc(var(--spacing)*16)}.py-32{padding-block:calc(var(--spacing)*32)}.pt-2{padding-top:calc(var(--spacing)*2)}.pt-3{padding-top:calc(var(--spacing)*3)}.pt-4{padding-top:calc(var(--spacing)*4)}.pr-4{padding-right:calc(var(--spacing)*4)}.pb-1{padding-bottom:calc(var(--spacing)*1)}.pb-3{padding-bottom:calc(var(--spacing)*3)}.pb-24{padding-bottom:calc(var(--spacing)*24)}.pl-10{padding-left:calc(var(--spacing)*10)}.pl-11{padding-left:calc(var(--spacing)*11)}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.font-mono{font-family:var(--font-mono)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--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-\[9px\]{font-size:9px}.text-\[10px\]{font-size:10px}.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)}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.tracking-wider{--tw-tracking:var(--tracking-wider);letter-spacing:var(--tracking-wider)}.break-all{word-break:break-all}.whitespace-nowrap{white-space:nowrap}.whitespace-pre{white-space:pre}.text-amber-200{color:var(--color-amber-200)}.text-amber-300{color:var(--color-amber-300)}.text-amber-400{color:var(--color-amber-400)}.text-blue-300{color:var(--color-blue-300)}.text-blue-400{color:var(--color-blue-400)}.text-emerald-300{color:var(--color-emerald-300)}.text-emerald-400{color:var(--color-emerald-400)}.text-gray-200{color:var(--color-gray-200)}.text-gray-300{color:var(--color-gray-300)}.text-gray-400{color:var(--color-gray-400)}.text-gray-500{color:var(--color-gray-500)}.text-gray-600{color:var(--color-gray-600)}.text-green-400{color:var(--color-green-400)}.text-purple-400{color:var(--color-purple-400)}.text-red-300{color:var(--color-red-300)}.text-red-400{color:var(--color-red-400)}.text-slate-300{color:var(--color-slate-300)}.text-slate-400{color:var(--color-slate-400)}.text-slate-500{color:var(--color-slate-500)}.text-slate-600{color:var(--color-slate-600)}.text-slate-900{color:var(--color-slate-900)}.text-white{color:var(--color-white)}.uppercase{text-transform:uppercase}.tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal,)var(--tw-slashed-zero,)var(--tw-numeric-figure,)var(--tw-numeric-spacing,)var(--tw-numeric-fraction,)}.underline{text-decoration-line:underline}.placeholder-slate-500::-moz-placeholder{color:var(--color-slate-500)}.placeholder-slate-500::placeholder{color:var(--color-slate-500)}.opacity-0{opacity:0}.opacity-25{opacity:.25}.opacity-50{opacity:.5}.opacity-60{opacity:.6}.opacity-75{opacity:.75}.opacity-100{opacity:1}.shadow-2xl{--tw-shadow:0 25px 50px -12px var(--tw-shadow-color,#00000040);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.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)}.ring-2{--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)}.shadow-amber-500\/30{--tw-shadow-color:#f99c004d}@supports (color:color-mix(in lab,red,red)){.shadow-amber-500\/30{--tw-shadow-color:color-mix(in oklab,color-mix(in oklab,var(--color-amber-500)30%,transparent)var(--tw-shadow-alpha),transparent)}}.shadow-blue-500\/30{--tw-shadow-color:#3080ff4d}@supports (color:color-mix(in lab,red,red)){.shadow-blue-500\/30{--tw-shadow-color:color-mix(in oklab,color-mix(in oklab,var(--color-blue-500)30%,transparent)var(--tw-shadow-alpha),transparent)}}.shadow-blue-500\/50{--tw-shadow-color:#3080ff80}@supports (color:color-mix(in lab,red,red)){.shadow-blue-500\/50{--tw-shadow-color:color-mix(in oklab,color-mix(in oklab,var(--color-blue-500)50%,transparent)var(--tw-shadow-alpha),transparent)}}.shadow-emerald-500\/30{--tw-shadow-color:#00bb7f4d}@supports (color:color-mix(in lab,red,red)){.shadow-emerald-500\/30{--tw-shadow-color:color-mix(in oklab,color-mix(in oklab,var(--color-emerald-500)30%,transparent)var(--tw-shadow-alpha),transparent)}}.shadow-red-500\/10{--tw-shadow-color:#fb2c361a}@supports (color:color-mix(in lab,red,red)){.shadow-red-500\/10{--tw-shadow-color:color-mix(in oklab,color-mix(in oklab,var(--color-red-500)10%,transparent)var(--tw-shadow-alpha),transparent)}}.shadow-red-500\/30{--tw-shadow-color:#fb2c364d}@supports (color:color-mix(in lab,red,red)){.shadow-red-500\/30{--tw-shadow-color:color-mix(in oklab,color-mix(in oklab,var(--color-red-500)30%,transparent)var(--tw-shadow-alpha),transparent)}}.ring-blue-500{--tw-ring-color:var(--color-blue-500)}.ring-blue-500\/50{--tw-ring-color:#3080ff80}@supports (color:color-mix(in lab,red,red)){.ring-blue-500\/50{--tw-ring-color:color-mix(in oklab,var(--color-blue-500)50%,transparent)}}.ring-red-500\/50{--tw-ring-color:#fb2c3680}@supports (color:color-mix(in lab,red,red)){.ring-red-500\/50{--tw-ring-color:color-mix(in oklab,var(--color-red-500)50%,transparent)}}.ring-offset-2{--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)}.ring-offset-gray-900{--tw-ring-offset-color:var(--color-gray-900)}.filter{filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.backdrop-blur-md{--tw-backdrop-blur:blur(var(--blur-md));-webkit-backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,)}.backdrop-blur-sm{--tw-backdrop-blur:blur(var(--blur-sm));-webkit-backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,)}.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-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-150{--tw-duration:.15s;transition-duration:.15s}.duration-200{--tw-duration:.2s;transition-duration:.2s}.select-text{-webkit-user-select:text;-moz-user-select:text;user-select:text}@media (hover:hover){.group-hover\:border-slate-500:is(:where(.group):hover *){border-color:var(--color-slate-500)}.group-hover\:text-amber-400:is(:where(.group):hover *){color:var(--color-amber-400)}.group-hover\:opacity-100:is(:where(.group):hover *){opacity:1}}.peer-checked\:translate-x-3\.5:is(:where(.peer):checked~*){--tw-translate-x:calc(var(--spacing)*3.5);translate:var(--tw-translate-x)var(--tw-translate-y)}.peer-checked\:translate-x-5:is(:where(.peer):checked~*){--tw-translate-x:calc(var(--spacing)*5);translate:var(--tw-translate-x)var(--tw-translate-y)}.peer-checked\:translate-x-7:is(:where(.peer):checked~*){--tw-translate-x:calc(var(--spacing)*7);translate:var(--tw-translate-x)var(--tw-translate-y)}.peer-checked\:border-amber-500:is(:where(.peer):checked~*){border-color:var(--color-amber-500)}.peer-checked\:bg-amber-500:is(:where(.peer):checked~*){background-color:var(--color-amber-500)}.peer-focus-visible\:ring-2:is(:where(.peer):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)}.peer-focus-visible\:ring-amber-500\/50:is(:where(.peer):focus-visible~*){--tw-ring-color:#f99c0080}@supports (color:color-mix(in lab,red,red)){.peer-focus-visible\:ring-amber-500\/50:is(:where(.peer):focus-visible~*){--tw-ring-color:color-mix(in oklab,var(--color-amber-500)50%,transparent)}}.peer-focus-visible\:ring-offset-2:is(:where(.peer):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)}.peer-focus-visible\:ring-offset-slate-900:is(:where(.peer):focus-visible~*){--tw-ring-offset-color:var(--color-slate-900)}.last\:border-b-0:last-child{border-bottom-style:var(--tw-border-style);border-bottom-width:0}@media (hover:hover){.hover\:border-red-500\/60:hover{border-color:#fb2c3699}@supports (color:color-mix(in lab,red,red)){.hover\:border-red-500\/60:hover{border-color:color-mix(in oklab,var(--color-red-500)60%,transparent)}}.hover\:border-slate-600:hover{border-color:var(--color-slate-600)}.hover\:border-white\/20:hover{border-color:#fff3}@supports (color:color-mix(in lab,red,red)){.hover\:border-white\/20:hover{border-color:color-mix(in oklab,var(--color-white)20%,transparent)}}.hover\:bg-amber-400:hover{background-color:var(--color-amber-400)}.hover\:bg-amber-500\/20:hover{background-color:#f99c0033}@supports (color:color-mix(in lab,red,red)){.hover\:bg-amber-500\/20:hover{background-color:color-mix(in oklab,var(--color-amber-500)20%,transparent)}}.hover\:bg-cyan-600:hover{background-color:var(--color-cyan-600)}.hover\:bg-emerald-500\/20:hover{background-color:#00bb7f33}@supports (color:color-mix(in lab,red,red)){.hover\:bg-emerald-500\/20:hover{background-color:color-mix(in oklab,var(--color-emerald-500)20%,transparent)}}.hover\:bg-emerald-700:hover{background-color:var(--color-emerald-700)}.hover\:bg-gray-700\/60:hover{background-color:#36415399}@supports (color:color-mix(in lab,red,red)){.hover\:bg-gray-700\/60:hover{background-color:color-mix(in oklab,var(--color-gray-700)60%,transparent)}}.hover\:bg-green-600\/20:hover{background-color:#00a54433}@supports (color:color-mix(in lab,red,red)){.hover\:bg-green-600\/20:hover{background-color:color-mix(in oklab,var(--color-green-600)20%,transparent)}}.hover\:bg-red-500\/20:hover{background-color:#fb2c3633}@supports (color:color-mix(in lab,red,red)){.hover\:bg-red-500\/20:hover{background-color:color-mix(in oklab,var(--color-red-500)20%,transparent)}}.hover\:bg-red-600\/20:hover{background-color:#e4001433}@supports (color:color-mix(in lab,red,red)){.hover\:bg-red-600\/20:hover{background-color:color-mix(in oklab,var(--color-red-600)20%,transparent)}}.hover\:bg-slate-600:hover{background-color:var(--color-slate-600)}.hover\:bg-slate-700:hover{background-color:var(--color-slate-700)}.hover\:bg-slate-800\/50:hover{background-color:#1d293d80}@supports (color:color-mix(in lab,red,red)){.hover\:bg-slate-800\/50:hover{background-color:color-mix(in oklab,var(--color-slate-800)50%,transparent)}}.hover\:bg-white\/5:hover{background-color:#ffffff0d}@supports (color:color-mix(in lab,red,red)){.hover\:bg-white\/5:hover{background-color:color-mix(in oklab,var(--color-white)5%,transparent)}}.hover\:bg-white\/10:hover{background-color:#ffffff1a}@supports (color:color-mix(in lab,red,red)){.hover\:bg-white\/10:hover{background-color:color-mix(in oklab,var(--color-white)10%,transparent)}}.hover\:bg-white\/15:hover{background-color:#ffffff26}@supports (color:color-mix(in lab,red,red)){.hover\:bg-white\/15:hover{background-color:color-mix(in oklab,var(--color-white)15%,transparent)}}.hover\:bg-white\/\[0\.02\]:hover{background-color:#ffffff05}@supports (color:color-mix(in lab,red,red)){.hover\:bg-white\/\[0\.02\]:hover{background-color:color-mix(in oklab,var(--color-white)2%,transparent)}}.hover\:bg-white\/\[0\.05\]:hover{background-color:#ffffff0d}@supports (color:color-mix(in lab,red,red)){.hover\:bg-white\/\[0\.05\]:hover{background-color:color-mix(in oklab,var(--color-white)5%,transparent)}}.hover\:text-amber-300:hover{color:var(--color-amber-300)}.hover\:text-amber-400:hover{color:var(--color-amber-400)}.hover\:text-blue-300:hover{color:var(--color-blue-300)}.hover\:text-emerald-300:hover{color:var(--color-emerald-300)}.hover\:text-gray-300:hover{color:var(--color-gray-300)}.hover\:text-green-300:hover{color:var(--color-green-300)}.hover\:text-red-300:hover{color:var(--color-red-300)}.hover\:text-slate-300:hover{color:var(--color-slate-300)}.hover\:text-white:hover{color:var(--color-white)}.hover\:opacity-100:hover{opacity:1}.hover\:ring-2:hover{--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)}.hover\:ring-gray-500:hover{--tw-ring-color:var(--color-gray-500)}.hover\:ring-offset-2:hover{--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)}.hover\:ring-offset-gray-900:hover{--tw-ring-offset-color:var(--color-gray-900)}}.focus\:border-amber-500:focus{border-color:var(--color-amber-500)}.focus\:border-amber-500\/50:focus{border-color:#f99c0080}@supports (color:color-mix(in lab,red,red)){.focus\:border-amber-500\/50:focus{border-color:color-mix(in oklab,var(--color-amber-500)50%,transparent)}}.focus\:border-red-500\/50:focus{border-color:#fb2c3680}@supports (color:color-mix(in lab,red,red)){.focus\:border-red-500\/50:focus{border-color:color-mix(in oklab,var(--color-red-500)50%,transparent)}}.focus\:ring-1:focus{--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)}.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-amber-500:focus{--tw-ring-color:var(--color-amber-500)}.focus\:ring-amber-500\/20:focus{--tw-ring-color:#f99c0033}@supports (color:color-mix(in lab,red,red)){.focus\:ring-amber-500\/20:focus{--tw-ring-color:color-mix(in oklab,var(--color-amber-500)20%,transparent)}}.focus\:ring-red-500\/20:focus{--tw-ring-color:#fb2c3633}@supports (color:color-mix(in lab,red,red)){.focus\:ring-red-500\/20:focus{--tw-ring-color:color-mix(in oklab,var(--color-red-500)20%,transparent)}}.focus\:outline-none:focus{--tw-outline-style:none;outline-style:none}.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-amber-500:focus-visible{--tw-ring-color:var(--color-amber-500)}.focus-visible\:ring-emerald-500:focus-visible{--tw-ring-color:var(--color-emerald-500)}.focus-visible\:ring-red-500:focus-visible{--tw-ring-color:var(--color-red-500)}.focus-visible\:ring-white\/30:focus-visible{--tw-ring-color:#ffffff4d}@supports (color:color-mix(in lab,red,red)){.focus-visible\:ring-white\/30:focus-visible{--tw-ring-color:color-mix(in oklab,var(--color-white)30%,transparent)}}.focus-visible\:ring-white\/50:focus-visible{--tw-ring-color:#ffffff80}@supports (color:color-mix(in lab,red,red)){.focus-visible\:ring-white\/50:focus-visible{--tw-ring-color:color-mix(in oklab,var(--color-white)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\:ring-offset-slate-900:focus-visible{--tw-ring-offset-color:var(--color-slate-900)}.active\:bg-emerald-800:active{background-color:var(--color-emerald-800)}.active\:bg-slate-500:active{background-color:var(--color-slate-500)}.active\:bg-slate-600:active{background-color:var(--color-slate-600)}.active\:bg-white\/15:active{background-color:#ffffff26}@supports (color:color-mix(in lab,red,red)){.active\:bg-white\/15:active{background-color:color-mix(in oklab,var(--color-white)15%,transparent)}}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:bg-slate-600:disabled{background-color:var(--color-slate-600)}.disabled\:opacity-30:disabled{opacity:.3}.disabled\:opacity-50:disabled{opacity:.5}@media (min-width:40rem){.sm\:inline{display:inline}.sm\:w-auto{width:auto}.sm\:flex-row{flex-direction:row}.sm\:items-center{align-items:center}.sm\:px-6{padding-inline:calc(var(--spacing)*6)}}@media (min-width:48rem){.md\:left-auto{left:auto}.md\:ml-1\.5{margin-left:calc(var(--spacing)*1.5)}.md\:block{display:block}.md\:flex{display:flex}.md\:hidden{display:none}.md\:inline{display:inline}.md\:h-3{height:calc(var(--spacing)*3)}.md\:h-4{height:calc(var(--spacing)*4)}.md\:h-8{height:calc(var(--spacing)*8)}.md\:h-14{height:calc(var(--spacing)*14)}.md\:w-3{width:calc(var(--spacing)*3)}.md\:w-4{width:calc(var(--spacing)*4)}.md\:w-8{width:calc(var(--spacing)*8)}.md\:w-20{width:calc(var(--spacing)*20)}.md\:w-auto{width:auto}.md\:flex-initial{flex:0 auto}.md\:flex-none{flex:none}.md\:flex-row{flex-direction:row}.md\:flex-wrap{flex-wrap:wrap}.md\:items-center{align-items:center}.md\:gap-1{gap:calc(var(--spacing)*1)}.md\:gap-2{gap:calc(var(--spacing)*2)}.md\:gap-3{gap:calc(var(--spacing)*3)}.md\:gap-4{gap:calc(var(--spacing)*4)}:where(.md\: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)))}.md\:overflow-visible{overflow:visible}.md\:rounded-md{border-radius:var(--radius-md)}.md\:p-4{padding:calc(var(--spacing)*4)}.md\:px-4{padding-inline:calc(var(--spacing)*4)}.md\:py-1\.5{padding-block:calc(var(--spacing)*1.5)}.md\:py-2{padding-block:calc(var(--spacing)*2)}.md\:py-2\.5{padding-block:calc(var(--spacing)*2.5)}.md\:py-8{padding-block:calc(var(--spacing)*8)}.md\:pt-4{padding-top:calc(var(--spacing)*4)}.md\:pb-4{padding-bottom:calc(var(--spacing)*4)}.md\:text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.md\:text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}}@media (min-width:64rem){.lg\:col-span-2{grid-column:span 2/span 2}.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:px-8{padding-inline:calc(var(--spacing)*8)}}}:root{--vz-bg:#0f172a;--vz-surface:#1a2332;--vz-elevated:#1e293b;--vz-border:#374151;--vz-border-subtle:#2d3748;--accent-success:#10b981;--accent-success-muted:#132a23;--accent-warning:#f59e0b;--accent-warning-muted:#2a2317;--accent-danger:#ef4444;--accent-danger-muted:#2a1717;--accent-info:#3b82f6;--accent-info-muted:#172033;--accent-purple:#a855f7;--accent-purple-muted:#1f1733;--text-primary:#fff;--text-secondary:#9ca3af;--text-tertiary:#6b7280;--text-muted:#4b5563;--ring-size:120px;--ring-stroke:8px}::highlight(code-keyword){color:#c792ea;font-weight:500}::highlight(code-string){color:#c3e88d}::highlight(code-comment){color:#64748b;font-style:italic}::highlight(code-number){color:#f78c6c}::highlight(code-function){color:#82aaff}::highlight(code-command){color:#f59e0b}body{background-color:var(--vz-bg);color:var(--text-primary);font-family:system-ui,-apple-system,sans-serif}.touch-manipulation{touch-action:manipulation;-webkit-tap-highlight-color:transparent}.safe-area-bottom{padding-bottom:env(safe-area-inset-bottom,0)}.safe-area-top{padding-top:env(safe-area-inset-top,0)}.scrollbar-thin{scrollbar-width:thin;scrollbar-color:#4b556380 transparent}.scrollbar-thin::-webkit-scrollbar{width:6px;height:6px}.scrollbar-thin::-webkit-scrollbar-track{background:0 0}.scrollbar-thin::-webkit-scrollbar-thumb{background:#4b556380;border-radius:3px}.scrollbar-thin::-webkit-scrollbar-thumb:hover{background:#6b7280b3}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}.scrollbar-hide::-webkit-scrollbar{display:none}.scroll-snap-x{scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}.scroll-snap-item{scroll-snap-align:start}@keyframes fade-in-up{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-down{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-up{0%{opacity:.8;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes pulse-soft{0%,to{opacity:.6}50%{opacity:1}}@keyframes dropdown-enter{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{to{transform:rotate(360deg)}}.animate-fade-in-up{animation:.5s cubic-bezier(.4,0,.2,1) forwards fade-in-up}.animate-slide-down{animation:.2s ease-out slide-down}.animate-slide-up{animation:.25s ease-out slide-up}.animate-dropdown{animation:.15s ease-out dropdown-enter}.animate-delay-100{animation-delay:.1s}.animate-delay-200{animation-delay:.2s}.animate-delay-300{animation-delay:.3s}.animate-delay-400{animation-delay:.4s}.vz-card{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#ffffff08;border:1px solid #33415580;border-radius:12px;transition:border-color .2s,background-color .2s;overflow:hidden}.vz-card:hover{background:#ffffff0d;border-color:#475569b3}.vz-card--no-hover:hover{background:#ffffff08;border-color:#33415580}.vz-card--success{border-left:2px solid var(--accent-success)}.vz-card--warning{border-left:2px solid var(--accent-warning)}.vz-card--danger{border-left:2px solid var(--accent-danger)}.vz-card--info{border-left:2px solid var(--accent-info)}.vz-card--purple{border-left:2px solid var(--accent-purple)}.health-ring{width:var(--ring-size);height:var(--ring-size);position:relative}.health-ring__svg{width:100%;height:100%;transform:rotate(-90deg)}.health-ring__track{fill:none;stroke:var(--vz-border);stroke-width:var(--ring-stroke)}.health-ring__progress{fill:none;stroke-width:var(--ring-stroke);stroke-linecap:round;transition:stroke-dashoffset 1s cubic-bezier(.4,0,.2,1)}.health-ring__progress--success{stroke:var(--accent-success);filter:drop-shadow(0 0 6px #10b98166)}.health-ring__progress--warning{stroke:var(--accent-warning);filter:drop-shadow(0 0 6px #f59e0b66)}.health-ring__progress--danger{stroke:var(--accent-danger);filter:drop-shadow(0 0 6px #ef444466)}.health-ring__value{flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.health-ring__percentage{color:var(--text-primary);font-family:JetBrains Mono,monospace;font-size:1.75rem;font-weight:600;line-height:1}.health-ring__label{text-transform:uppercase;letter-spacing:.1em;color:var(--text-tertiary);margin-top:4px;font-size:.625rem;font-weight:500}.timeline-strip{gap:4px;padding:8px 0;display:flex}.timeline-item{cursor:pointer;border-radius:3px;width:6px;height:32px;transition:all .15s;position:relative}.timeline-item:hover{transform:scaleY(1.15)}.timeline-item--approved{background:var(--accent-success);opacity:.8}.timeline-item--approved:hover{opacity:1}.timeline-item--pending{background:var(--accent-warning);opacity:.8}.timeline-item--pending:hover{opacity:1}.timeline-item--rejected{background:var(--accent-danger);opacity:.8}.timeline-item--rejected:hover{opacity:1}.timeline-item--processing{background:var(--accent-info);animation:2s infinite pulse-soft}.stat-pill{border-radius:6px;align-items:center;gap:6px;padding:4px 10px;font-size:.75rem;font-weight:500;display:inline-flex}.stat-pill--success{background:var(--accent-success-muted);color:var(--accent-success)}.stat-pill--warning{background:var(--accent-warning-muted);color:var(--accent-warning)}.stat-pill--danger{background:var(--accent-danger-muted);color:var(--accent-danger)}.stat-pill--info{background:var(--accent-info-muted);color:var(--accent-info)}.stat-pill--muted{color:var(--text-secondary);background:#6b728026}.stat-pill--purple{background:var(--accent-purple-muted);color:var(--accent-purple)}.vz-table{border-collapse:separate;border-spacing:0;width:100%}.vz-table thead th{text-transform:uppercase;letter-spacing:.05em;color:var(--text-tertiary);border-bottom:1px solid var(--vz-border-subtle);text-align:left;background:#0003;padding:12px 16px;font-size:.6875rem;font-weight:600}.vz-table tbody tr{transition:background-color .15s}.vz-table tbody tr:hover{background:#ffffff08}.vz-table tbody td{color:var(--text-secondary);border-bottom:1px solid var(--vz-border-subtle);padding:14px 16px;font-size:.875rem}.vz-table tbody tr:last-child td{border-bottom:none}.skeleton{background:linear-gradient(90deg,#1e293b80,#33415580,#1e293b80) 0 0/200% 100%;border-radius:6px;animation:1.5s infinite shimmer}.skeleton--text{width:100%;height:16px}.skeleton--heading{width:60%;height:24px}.skeleton--avatar{border-radius:50%;width:40px;height:40px}.skeleton--button{border-radius:8px;width:100px;height:36px}.comparison-viewer{justify-content:center;display:flex;position:relative}.overlay-mode .overlay-container{cursor:pointer;display:inline-block;position:relative}.overlay-mode .current-image{z-index:10;border-radius:var(--radius-lg);border-style:var(--tw-border-style);border-width:1px;border-color:var(--color-slate-600);max-width:100%;height:auto;position:relative}.overlay-mode .baseline-image,.overlay-mode .diff-image{top:calc(var(--spacing)*0);left:calc(var(--spacing)*0);border-radius:var(--radius-lg);border-style:var(--tw-border-style);border-width:1px;border-color:var(--color-slate-600);max-width:100%;height:auto;position:absolute}.overlay-mode .baseline-image{z-index:20}.overlay-mode .diff-image{z-index:30;transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration));--tw-duration:.2s;transition-duration:.2s}.toggle-mode .toggle-container{text-align:center}.toggle-mode .toggle-image{border-radius:var(--radius-lg);border-style:var(--tw-border-style);border-width:1px;border-color:var(--color-slate-600);max-width:100%;height:auto}.toggle-mode .toggle-label{margin-top:calc(var(--spacing)*2);font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height));color:var(--color-slate-400)}.onion-mode .onion-container{cursor:col-resize;-webkit-user-select:none;-moz-user-select:none;user-select:none;display:inline-block;position:relative}.onion-mode .onion-baseline,.onion-mode .onion-current{pointer-events:none;border-radius:var(--radius-lg);border-style:var(--tw-border-style);border-width:1px;border-color:var(--color-slate-600);-webkit-user-select:none;-moz-user-select:none;user-select:none;-webkit-user-drag:none;max-width:100%;height:auto;display:block}.onion-mode .onion-current{top:calc(var(--spacing)*0);left:calc(var(--spacing)*0);clip-path:inset(0 50% 0 0);max-width:100%;height:auto;position:absolute}.onion-mode .onion-divider{pointer-events:none;top:calc(var(--spacing)*0);z-index:10;height:100%;width:calc(var(--spacing)*.5);background-color:var(--color-amber-500);position:absolute;left:50%}.onion-mode .onion-divider:before{content:"";top:calc(var(--spacing)*-2);left:calc(var(--spacing)*-2);height:calc(var(--spacing)*4);width:calc(var(--spacing)*4);background-color:var(--color-amber-500);border-radius:3.40282e38px;position:absolute}.onion-mode .onion-divider:after{content:"";bottom:calc(var(--spacing)*-2);left:calc(var(--spacing)*-2);height:calc(var(--spacing)*4);width:calc(var(--spacing)*4);background-color:var(--color-amber-500);border-radius:3.40282e38px;position:absolute}.side-by-side-mode .side-by-side-container{gap:calc(var(--spacing)*4);display:flex}.side-by-side-mode .side-by-side-image{text-align:center;flex:1}.side-by-side-mode .side-by-side-image img{border-radius:var(--radius-lg);border-style:var(--tw-border-style);border-width:1px;border-color:var(--color-slate-600);max-width:100%;height:auto}.side-by-side-mode .side-by-side-image label{margin-top:calc(var(--spacing)*2);font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height));--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium);color:var(--color-slate-400);display:block}.filmstrip-scroll{scroll-behavior:smooth;-webkit-overflow-scrolling:touch}.unified-screenshot-container{transition:transform .15s ease-out}.glass-header{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#1e293bf2}:where(.vz-form-section>: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)))}.vz-form-section__header{margin-bottom:calc(var(--spacing)*6)}.vz-form-section__title{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height));--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold);color:var(--color-white)}.vz-form-section__description{margin-top:calc(var(--spacing)*1);font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height));color:var(--color-slate-400)}:where(.vz-form-group>: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)))}.vz-form-actions{justify-content:flex-end;align-items:center;gap:calc(var(--spacing)*3);border-top-style:var(--tw-border-style);border-color:#31415880;border-top-width:1px;display:flex}@supports (color:color-mix(in lab,red,red)){.vz-form-actions{border-color:color-mix(in oklab,var(--color-slate-700)50%,transparent)}}.vz-form-actions{padding-top:calc(var(--spacing)*4)}.font-mono{font-family:JetBrains Mono,monospace}.focus-ring:focus{--tw-outline-style:none;outline-style:none}.focus-ring: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);--tw-ring-color:#f99c0080}@supports (color:color-mix(in lab,red,red)){.focus-ring:focus-visible{--tw-ring-color:color-mix(in oklab,var(--color-amber-500)50%,transparent)}}.focus-ring: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);--tw-ring-offset-color:var(--color-slate-900)}@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-scale-x{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-y{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-z{syntax:"*";inherits:false;initial-value:1}@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-gradient-position{syntax:"*";inherits:false}@property --tw-gradient-from{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-via{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-to{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-stops{syntax:"*";inherits:false}@property --tw-gradient-via-stops{syntax:"*";inherits:false}@property --tw-gradient-from-position{syntax:"<length-percentage>";inherits:false;initial-value:0%}@property --tw-gradient-via-position{syntax:"<length-percentage>";inherits:false;initial-value:50%}@property --tw-gradient-to-position{syntax:"<length-percentage>";inherits:false;initial-value:100%}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-ordinal{syntax:"*";inherits:false}@property --tw-slashed-zero{syntax:"*";inherits:false}@property --tw-numeric-figure{syntax:"*";inherits:false}@property --tw-numeric-spacing{syntax:"*";inherits:false}@property --tw-numeric-fraction{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-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@keyframes ping{75%,to{opacity:0;transform:scale(2)}}@keyframes pulse{50%{opacity:.5}}@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-scale-x:1;--tw-scale-y:1;--tw-scale-z:1;--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-gradient-position:initial;--tw-gradient-from:#0000;--tw-gradient-via:#0000;--tw-gradient-to:#0000;--tw-gradient-stops:initial;--tw-gradient-via-stops:initial;--tw-gradient-from-position:0%;--tw-gradient-via-position:50%;--tw-gradient-to-position:100%;--tw-font-weight:initial;--tw-tracking:initial;--tw-ordinal:initial;--tw-slashed-zero:initial;--tw-numeric-figure:initial;--tw-numeric-spacing:initial;--tw-numeric-fraction: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-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-duration:initial}}}
1
+ @import"https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600&display=swap";@layer properties,theme,base,components,utilities;@layer theme{:root,:host{--font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-red-300:oklch(80.8% .114 19.571);--color-red-400:oklch(70.4% .191 22.216);--color-red-500:oklch(63.7% .237 25.331);--color-red-600:oklch(57.7% .245 27.325);--color-amber-200:oklch(92.4% .12 95.746);--color-amber-300:oklch(87.9% .169 91.605);--color-amber-400:oklch(82.8% .189 84.429);--color-amber-500:oklch(76.9% .188 70.08);--color-amber-600:oklch(66.6% .179 58.318);--color-amber-900:oklch(41.4% .112 45.904);--color-yellow-500:oklch(79.5% .184 86.047);--color-green-300:oklch(87.1% .15 154.449);--color-green-400:oklch(79.2% .209 151.711);--color-green-500:oklch(72.3% .219 149.579);--color-green-600:oklch(62.7% .194 149.214);--color-emerald-300:oklch(84.5% .143 164.978);--color-emerald-400:oklch(76.5% .177 163.223);--color-emerald-500:oklch(69.6% .17 162.48);--color-emerald-600:oklch(59.6% .145 163.225);--color-emerald-700:oklch(50.8% .118 165.612);--color-emerald-800:oklch(43.2% .095 166.913);--color-cyan-500:oklch(71.5% .143 215.221);--color-cyan-600:oklch(60.9% .126 221.723);--color-blue-300:oklch(80.9% .105 251.813);--color-blue-400:oklch(70.7% .165 254.624);--color-blue-500:oklch(62.3% .214 259.815);--color-blue-600:oklch(54.6% .245 262.881);--color-blue-900:oklch(37.9% .146 265.522);--color-purple-400:oklch(71.4% .203 305.504);--color-purple-500:oklch(62.7% .265 303.9);--color-slate-300:oklch(86.9% .022 252.894);--color-slate-400:oklch(70.4% .04 256.788);--color-slate-500:oklch(55.4% .046 257.417);--color-slate-600:oklch(44.6% .043 257.281);--color-slate-700:oklch(37.2% .044 257.287);--color-slate-800:oklch(27.9% .041 260.031);--color-slate-900:oklch(20.8% .042 265.755);--color-slate-950:oklch(12.9% .042 264.695);--color-gray-200:oklch(92.8% .006 264.531);--color-gray-300:oklch(87.2% .01 258.338);--color-gray-400:oklch(70.7% .022 261.325);--color-gray-500:oklch(55.1% .027 264.364);--color-gray-600:oklch(44.6% .03 256.802);--color-gray-700:oklch(37.3% .034 259.733);--color-gray-800:oklch(27.8% .033 256.848);--color-gray-900:oklch(21% .034 264.665);--color-black:#000;--color-white:#fff;--spacing:.25rem;--container-sm:24rem;--container-md:28rem;--container-lg:32rem;--container-xl:36rem;--container-2xl:42rem;--container-4xl:56rem;--container-7xl:80rem;--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);--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--tracking-wide:.025em;--tracking-wider:.05em;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--radius-2xl:1rem;--animate-spin:spin 1s linear infinite;--animate-ping:ping 1s cubic-bezier(0,0,.2,1)infinite;--animate-pulse:pulse 2s cubic-bezier(.4,0,.6,1)infinite;--blur-sm:8px;--blur-md:12px;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-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%;-moz-tab-size:4;-o-tab-size:4;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}::-moz-placeholder{opacity:1}::placeholder{opacity:1}@supports (not (-webkit-appearance:-apple-pay-button)) or (contain-intrinsic-size:1px){::-moz-placeholder{color:currentColor}::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::-moz-placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}::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}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){-webkit-appearance:button;-moz-appearance:button;appearance:button}::file-selector-button{-webkit-appearance:button;-moz-appearance: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 utilities{.pointer-events-auto{pointer-events:auto}.pointer-events-none{pointer-events:none}.visible{visibility:visible}.sr-only{clip-path:inset(50%);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}.static{position:static}.sticky{position:sticky}.inset-0{inset:calc(var(--spacing)*0)}.-top-1{top:calc(var(--spacing)*-1)}.top-0{top:calc(var(--spacing)*0)}.top-1{top:calc(var(--spacing)*1)}.top-1\/2{top:50%}.top-2{top:calc(var(--spacing)*2)}.top-4{top:calc(var(--spacing)*4)}.-right-1{right:calc(var(--spacing)*-1)}.right-0{right:calc(var(--spacing)*0)}.right-2{right:calc(var(--spacing)*2)}.right-3{right:calc(var(--spacing)*3)}.right-4{right:calc(var(--spacing)*4)}.right-6{right:calc(var(--spacing)*6)}.bottom-0{bottom:calc(var(--spacing)*0)}.bottom-1{bottom:calc(var(--spacing)*1)}.bottom-2{bottom:calc(var(--spacing)*2)}.bottom-4{bottom:calc(var(--spacing)*4)}.bottom-6{bottom:calc(var(--spacing)*6)}.bottom-full{bottom:100%}.left-0{left:calc(var(--spacing)*0)}.left-1{left:calc(var(--spacing)*1)}.left-1\/2{left:50%}.left-2{left:calc(var(--spacing)*2)}.left-3{left:calc(var(--spacing)*3)}.left-6{left:calc(var(--spacing)*6)}.z-10{z-index:10}.z-20{z-index:20}.z-30{z-index:30}.z-40{z-index:40}.z-50{z-index:50}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.-mx-1{margin-inline:calc(var(--spacing)*-1)}.mx-auto{margin-inline:auto}.mt-0\.5{margin-top:calc(var(--spacing)*.5)}.mt-1{margin-top:calc(var(--spacing)*1)}.mt-2{margin-top:calc(var(--spacing)*2)}.mt-3{margin-top:calc(var(--spacing)*3)}.mt-4{margin-top:calc(var(--spacing)*4)}.mt-6{margin-top:calc(var(--spacing)*6)}.-mr-1{margin-right:calc(var(--spacing)*-1)}.mr-1{margin-right:calc(var(--spacing)*1)}.-mb-px{margin-bottom:-1px}.mb-1{margin-bottom:calc(var(--spacing)*1)}.mb-2{margin-bottom:calc(var(--spacing)*2)}.mb-3{margin-bottom:calc(var(--spacing)*3)}.mb-4{margin-bottom:calc(var(--spacing)*4)}.mb-5{margin-bottom:calc(var(--spacing)*5)}.mb-6{margin-bottom:calc(var(--spacing)*6)}.mb-8{margin-bottom:calc(var(--spacing)*8)}.ml-1{margin-left:calc(var(--spacing)*1)}.ml-4{margin-left:calc(var(--spacing)*4)}.ml-auto{margin-left:auto}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.inline-block{display:inline-block}.inline-flex{display:inline-flex}.h-0\.5{height:calc(var(--spacing)*.5)}.h-1\.5{height:calc(var(--spacing)*1.5)}.h-2{height:calc(var(--spacing)*2)}.h-2\.5{height:calc(var(--spacing)*2.5)}.h-3{height:calc(var(--spacing)*3)}.h-3\.5{height:calc(var(--spacing)*3.5)}.h-4{height:calc(var(--spacing)*4)}.h-5{height:calc(var(--spacing)*5)}.h-6{height:calc(var(--spacing)*6)}.h-7{height:calc(var(--spacing)*7)}.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-32{height:calc(var(--spacing)*32)}.h-full{height:100%}.min-h-0{min-height:calc(var(--spacing)*0)}.min-h-\[200px\]{min-height:200px}.min-h-full{min-height:100%}.min-h-screen{min-height:100vh}.w-0\.5{width:calc(var(--spacing)*.5)}.w-1\.5{width:calc(var(--spacing)*1.5)}.w-1\/4{width:25%}.w-2{width:calc(var(--spacing)*2)}.w-2\.5{width:calc(var(--spacing)*2.5)}.w-2\/3{width:66.6667%}.w-3{width:calc(var(--spacing)*3)}.w-3\.5{width:calc(var(--spacing)*3.5)}.w-3\/5{width:60%}.w-4{width:calc(var(--spacing)*4)}.w-4\/5{width:80%}.w-5{width:calc(var(--spacing)*5)}.w-6{width:calc(var(--spacing)*6)}.w-7{width:calc(var(--spacing)*7)}.w-8{width:calc(var(--spacing)*8)}.w-10{width:calc(var(--spacing)*10)}.w-11{width:calc(var(--spacing)*11)}.w-12{width:calc(var(--spacing)*12)}.w-14{width:calc(var(--spacing)*14)}.w-16{width:calc(var(--spacing)*16)}.w-24{width:calc(var(--spacing)*24)}.w-32{width:calc(var(--spacing)*32)}.w-40{width:calc(var(--spacing)*40)}.w-64{width:calc(var(--spacing)*64)}.w-72{width:calc(var(--spacing)*72)}.w-96{width:calc(var(--spacing)*96)}.w-full{width:100%}.w-px{width:1px}.max-w-2xl{max-width:var(--container-2xl)}.max-w-4xl{max-width:var(--container-4xl)}.max-w-7xl{max-width:var(--container-7xl)}.max-w-\[300px\]{max-width:300px}.max-w-full{max-width:100%}.max-w-lg{max-width:var(--container-lg)}.max-w-md{max-width:var(--container-md)}.max-w-sm{max-width:var(--container-sm)}.max-w-xl{max-width:var(--container-xl)}.min-w-0{min-width:calc(var(--spacing)*0)}.min-w-\[3rem\]{min-width:3rem}.min-w-\[60px\]{min-width:60px}.min-w-full{min-width:100%}.flex-1{flex:1}.flex-shrink-0{flex-shrink:0}.-translate-x-1\/2{--tw-translate-x: -50% ;translate:var(--tw-translate-x)var(--tw-translate-y)}.-translate-y-1\/2{--tw-translate-y: -50% ;translate:var(--tw-translate-x)var(--tw-translate-y)}.scale-110{--tw-scale-x:110%;--tw-scale-y:110%;--tw-scale-z:110%;scale:var(--tw-scale-x)var(--tw-scale-y)}.rotate-180{rotate:180deg}.rotate-\[-90deg\]{rotate:-90deg}.transform{transform:var(--tw-rotate-x,)var(--tw-rotate-y,)var(--tw-rotate-z,)var(--tw-skew-x,)var(--tw-skew-y,)}.animate-ping{animation:var(--animate-ping)}.animate-pulse{animation:var(--animate-pulse)}.animate-spin{animation:var(--animate-spin)}.cursor-col-resize{cursor:col-resize}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.cursor-text{cursor:text}.touch-manipulation{touch-action:manipulation}.appearance-none{-webkit-appearance:none;-moz-appearance:none;appearance:none}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.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-3{gap:calc(var(--spacing)*3)}.gap-4{gap:calc(var(--spacing)*4)}.gap-6{gap:calc(var(--spacing)*6)}:where(.space-y-1\.5>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*1.5)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*1.5)*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)))}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-xl{border-radius:var(--radius-xl)}.rounded-t-lg{border-top-left-radius:var(--radius-lg);border-top-right-radius:var(--radius-lg)}.rounded-l-lg{border-top-left-radius:var(--radius-lg);border-bottom-left-radius:var(--radius-lg)}.rounded-r-lg{border-top-right-radius:var(--radius-lg);border-bottom-right-radius:var(--radius-lg)}.border{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-x{border-inline-style:var(--tw-border-style);border-inline-width:1px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-b{border-bottom-style:var(--tw-border-style);border-bottom-width:1px}.border-l-2{border-left-style:var(--tw-border-style);border-left-width:2px}.border-amber-500{border-color:var(--color-amber-500)}.border-amber-500\/20{border-color:#f99c0033}@supports (color:color-mix(in lab,red,red)){.border-amber-500\/20{border-color:color-mix(in oklab,var(--color-amber-500)20%,transparent)}}.border-amber-600\/50{border-color:#dd740080}@supports (color:color-mix(in lab,red,red)){.border-amber-600\/50{border-color:color-mix(in oklab,var(--color-amber-600)50%,transparent)}}.border-blue-500\/20{border-color:#3080ff33}@supports (color:color-mix(in lab,red,red)){.border-blue-500\/20{border-color:color-mix(in oklab,var(--color-blue-500)20%,transparent)}}.border-blue-500\/30{border-color:#3080ff4d}@supports (color:color-mix(in lab,red,red)){.border-blue-500\/30{border-color:color-mix(in oklab,var(--color-blue-500)30%,transparent)}}.border-blue-500\/40{border-color:#3080ff66}@supports (color:color-mix(in lab,red,red)){.border-blue-500\/40{border-color:color-mix(in oklab,var(--color-blue-500)40%,transparent)}}.border-emerald-500\/20{border-color:#00bb7f33}@supports (color:color-mix(in lab,red,red)){.border-emerald-500\/20{border-color:color-mix(in oklab,var(--color-emerald-500)20%,transparent)}}.border-gray-600{border-color:var(--color-gray-600)}.border-gray-600\/40{border-color:#4a556566}@supports (color:color-mix(in lab,red,red)){.border-gray-600\/40{border-color:color-mix(in oklab,var(--color-gray-600)40%,transparent)}}.border-gray-600\/50{border-color:#4a556580}@supports (color:color-mix(in lab,red,red)){.border-gray-600\/50{border-color:color-mix(in oklab,var(--color-gray-600)50%,transparent)}}.border-gray-700{border-color:var(--color-gray-700)}.border-gray-700\/50{border-color:#36415380}@supports (color:color-mix(in lab,red,red)){.border-gray-700\/50{border-color:color-mix(in oklab,var(--color-gray-700)50%,transparent)}}.border-gray-800\/50{border-color:#1e293980}@supports (color:color-mix(in lab,red,red)){.border-gray-800\/50{border-color:color-mix(in oklab,var(--color-gray-800)50%,transparent)}}.border-gray-900{border-color:var(--color-gray-900)}.border-green-500\/30{border-color:#00c7584d}@supports (color:color-mix(in lab,red,red)){.border-green-500\/30{border-color:color-mix(in oklab,var(--color-green-500)30%,transparent)}}.border-purple-500\/20{border-color:#ac4bff33}@supports (color:color-mix(in lab,red,red)){.border-purple-500\/20{border-color:color-mix(in oklab,var(--color-purple-500)20%,transparent)}}.border-red-500{border-color:var(--color-red-500)}.border-red-500\/20{border-color:#fb2c3633}@supports (color:color-mix(in lab,red,red)){.border-red-500\/20{border-color:color-mix(in oklab,var(--color-red-500)20%,transparent)}}.border-red-500\/30{border-color:#fb2c364d}@supports (color:color-mix(in lab,red,red)){.border-red-500\/30{border-color:color-mix(in oklab,var(--color-red-500)30%,transparent)}}.border-red-500\/40{border-color:#fb2c3666}@supports (color:color-mix(in lab,red,red)){.border-red-500\/40{border-color:color-mix(in oklab,var(--color-red-500)40%,transparent)}}.border-red-500\/50{border-color:#fb2c3680}@supports (color:color-mix(in lab,red,red)){.border-red-500\/50{border-color:color-mix(in oklab,var(--color-red-500)50%,transparent)}}.border-slate-500\/20{border-color:#62748e33}@supports (color:color-mix(in lab,red,red)){.border-slate-500\/20{border-color:color-mix(in oklab,var(--color-slate-500)20%,transparent)}}.border-slate-600{border-color:var(--color-slate-600)}.border-slate-700{border-color:var(--color-slate-700)}.border-slate-700\/30{border-color:#3141584d}@supports (color:color-mix(in lab,red,red)){.border-slate-700\/30{border-color:color-mix(in oklab,var(--color-slate-700)30%,transparent)}}.border-slate-700\/50{border-color:#31415880}@supports (color:color-mix(in lab,red,red)){.border-slate-700\/50{border-color:color-mix(in oklab,var(--color-slate-700)50%,transparent)}}.border-white\/10{border-color:#ffffff1a}@supports (color:color-mix(in lab,red,red)){.border-white\/10{border-color:color-mix(in oklab,var(--color-white)10%,transparent)}}.border-l-amber-500{border-left-color:var(--color-amber-500)}.border-l-blue-500{border-left-color:var(--color-blue-500)}.border-l-emerald-500{border-left-color:var(--color-emerald-500)}.border-l-purple-500{border-left-color:var(--color-purple-500)}.border-l-red-500{border-left-color:var(--color-red-500)}.bg-amber-400{background-color:var(--color-amber-400)}.bg-amber-500{background-color:var(--color-amber-500)}.bg-amber-500\/10{background-color:#f99c001a}@supports (color:color-mix(in lab,red,red)){.bg-amber-500\/10{background-color:color-mix(in oklab,var(--color-amber-500)10%,transparent)}}.bg-amber-500\/20{background-color:#f99c0033}@supports (color:color-mix(in lab,red,red)){.bg-amber-500\/20{background-color:color-mix(in oklab,var(--color-amber-500)20%,transparent)}}.bg-amber-600\/90{background-color:#dd7400e6}@supports (color:color-mix(in lab,red,red)){.bg-amber-600\/90{background-color:color-mix(in oklab,var(--color-amber-600)90%,transparent)}}.bg-amber-900\/90{background-color:#7b3306e6}@supports (color:color-mix(in lab,red,red)){.bg-amber-900\/90{background-color:color-mix(in oklab,var(--color-amber-900)90%,transparent)}}.bg-black\/60{background-color:#0009}@supports (color:color-mix(in lab,red,red)){.bg-black\/60{background-color:color-mix(in oklab,var(--color-black)60%,transparent)}}.bg-black\/70{background-color:#000000b3}@supports (color:color-mix(in lab,red,red)){.bg-black\/70{background-color:color-mix(in oklab,var(--color-black)70%,transparent)}}.bg-blue-400{background-color:var(--color-blue-400)}.bg-blue-500{background-color:var(--color-blue-500)}.bg-blue-500\/10{background-color:#3080ff1a}@supports (color:color-mix(in lab,red,red)){.bg-blue-500\/10{background-color:color-mix(in oklab,var(--color-blue-500)10%,transparent)}}.bg-blue-500\/20{background-color:#3080ff33}@supports (color:color-mix(in lab,red,red)){.bg-blue-500\/20{background-color:color-mix(in oklab,var(--color-blue-500)20%,transparent)}}.bg-blue-600{background-color:var(--color-blue-600)}.bg-blue-600\/30{background-color:#155dfc4d}@supports (color:color-mix(in lab,red,red)){.bg-blue-600\/30{background-color:color-mix(in oklab,var(--color-blue-600)30%,transparent)}}.bg-blue-600\/90{background-color:#155dfce6}@supports (color:color-mix(in lab,red,red)){.bg-blue-600\/90{background-color:color-mix(in oklab,var(--color-blue-600)90%,transparent)}}.bg-blue-900\/80{background-color:#1c398ecc}@supports (color:color-mix(in lab,red,red)){.bg-blue-900\/80{background-color:color-mix(in oklab,var(--color-blue-900)80%,transparent)}}.bg-current{background-color:currentColor}.bg-cyan-500{background-color:var(--color-cyan-500)}.bg-emerald-400{background-color:var(--color-emerald-400)}.bg-emerald-500{background-color:var(--color-emerald-500)}.bg-emerald-500\/10{background-color:#00bb7f1a}@supports (color:color-mix(in lab,red,red)){.bg-emerald-500\/10{background-color:color-mix(in oklab,var(--color-emerald-500)10%,transparent)}}.bg-emerald-500\/20{background-color:#00bb7f33}@supports (color:color-mix(in lab,red,red)){.bg-emerald-500\/20{background-color:color-mix(in oklab,var(--color-emerald-500)20%,transparent)}}.bg-emerald-600{background-color:var(--color-emerald-600)}.bg-gray-700{background-color:var(--color-gray-700)}.bg-gray-700\/50{background-color:#36415380}@supports (color:color-mix(in lab,red,red)){.bg-gray-700\/50{background-color:color-mix(in oklab,var(--color-gray-700)50%,transparent)}}.bg-gray-800{background-color:var(--color-gray-800)}.bg-gray-800\/60{background-color:#1e293999}@supports (color:color-mix(in lab,red,red)){.bg-gray-800\/60{background-color:color-mix(in oklab,var(--color-gray-800)60%,transparent)}}.bg-gray-800\/90{background-color:#1e2939e6}@supports (color:color-mix(in lab,red,red)){.bg-gray-800\/90{background-color:color-mix(in oklab,var(--color-gray-800)90%,transparent)}}.bg-gray-900{background-color:var(--color-gray-900)}.bg-gray-900\/50{background-color:#10182880}@supports (color:color-mix(in lab,red,red)){.bg-gray-900\/50{background-color:color-mix(in oklab,var(--color-gray-900)50%,transparent)}}.bg-gray-900\/95{background-color:#101828f2}@supports (color:color-mix(in lab,red,red)){.bg-gray-900\/95{background-color:color-mix(in oklab,var(--color-gray-900)95%,transparent)}}.bg-green-500\/10{background-color:#00c7581a}@supports (color:color-mix(in lab,red,red)){.bg-green-500\/10{background-color:color-mix(in oklab,var(--color-green-500)10%,transparent)}}.bg-green-600{background-color:var(--color-green-600)}.bg-purple-400{background-color:var(--color-purple-400)}.bg-purple-500\/10{background-color:#ac4bff1a}@supports (color:color-mix(in lab,red,red)){.bg-purple-500\/10{background-color:color-mix(in oklab,var(--color-purple-500)10%,transparent)}}.bg-red-400{background-color:var(--color-red-400)}.bg-red-500{background-color:var(--color-red-500)}.bg-red-500\/10{background-color:#fb2c361a}@supports (color:color-mix(in lab,red,red)){.bg-red-500\/10{background-color:color-mix(in oklab,var(--color-red-500)10%,transparent)}}.bg-red-500\/20{background-color:#fb2c3633}@supports (color:color-mix(in lab,red,red)){.bg-red-500\/20{background-color:color-mix(in oklab,var(--color-red-500)20%,transparent)}}.bg-red-600{background-color:var(--color-red-600)}.bg-slate-400{background-color:var(--color-slate-400)}.bg-slate-500{background-color:var(--color-slate-500)}.bg-slate-500\/15{background-color:#62748e26}@supports (color:color-mix(in lab,red,red)){.bg-slate-500\/15{background-color:color-mix(in oklab,var(--color-slate-500)15%,transparent)}}.bg-slate-700{background-color:var(--color-slate-700)}.bg-slate-700\/50{background-color:#31415880}@supports (color:color-mix(in lab,red,red)){.bg-slate-700\/50{background-color:color-mix(in oklab,var(--color-slate-700)50%,transparent)}}.bg-slate-800{background-color:var(--color-slate-800)}.bg-slate-800\/50{background-color:#1d293d80}@supports (color:color-mix(in lab,red,red)){.bg-slate-800\/50{background-color:color-mix(in oklab,var(--color-slate-800)50%,transparent)}}.bg-slate-800\/90{background-color:#1d293de6}@supports (color:color-mix(in lab,red,red)){.bg-slate-800\/90{background-color:color-mix(in oklab,var(--color-slate-800)90%,transparent)}}.bg-slate-900{background-color:var(--color-slate-900)}.bg-slate-900\/20{background-color:#0f172b33}@supports (color:color-mix(in lab,red,red)){.bg-slate-900\/20{background-color:color-mix(in oklab,var(--color-slate-900)20%,transparent)}}.bg-slate-900\/30{background-color:#0f172b4d}@supports (color:color-mix(in lab,red,red)){.bg-slate-900\/30{background-color:color-mix(in oklab,var(--color-slate-900)30%,transparent)}}.bg-slate-900\/50{background-color:#0f172b80}@supports (color:color-mix(in lab,red,red)){.bg-slate-900\/50{background-color:color-mix(in oklab,var(--color-slate-900)50%,transparent)}}.bg-slate-900\/95{background-color:#0f172bf2}@supports (color:color-mix(in lab,red,red)){.bg-slate-900\/95{background-color:color-mix(in oklab,var(--color-slate-900)95%,transparent)}}.bg-slate-950{background-color:var(--color-slate-950)}.bg-transparent{background-color:#0000}.bg-white{background-color:var(--color-white)}.bg-white\/5{background-color:#ffffff0d}@supports (color:color-mix(in lab,red,red)){.bg-white\/5{background-color:color-mix(in oklab,var(--color-white)5%,transparent)}}.bg-white\/10{background-color:#ffffff1a}@supports (color:color-mix(in lab,red,red)){.bg-white\/10{background-color:color-mix(in oklab,var(--color-white)10%,transparent)}}.bg-white\/\[0\.03\]{background-color:#ffffff08}@supports (color:color-mix(in lab,red,red)){.bg-white\/\[0\.03\]{background-color:color-mix(in oklab,var(--color-white)3%,transparent)}}.bg-yellow-500{background-color:var(--color-yellow-500)}.bg-gradient-to-br{--tw-gradient-position:to bottom right in oklab;background-image:linear-gradient(var(--tw-gradient-stops))}.from-gray-800{--tw-gradient-from:var(--color-gray-800);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position),var(--tw-gradient-from)var(--tw-gradient-from-position),var(--tw-gradient-to)var(--tw-gradient-to-position))}.to-gray-700{--tw-gradient-to:var(--color-gray-700);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position),var(--tw-gradient-from)var(--tw-gradient-from-position),var(--tw-gradient-to)var(--tw-gradient-to-position))}.object-cover{-o-object-fit:cover;object-fit:cover}.object-top{-o-object-position:top;object-position:top}.\!p-2{padding:calc(var(--spacing)*2)!important}.p-0{padding:calc(var(--spacing)*0)}.p-0\.5{padding:calc(var(--spacing)*.5)}.p-1{padding:calc(var(--spacing)*1)}.p-1\.5{padding:calc(var(--spacing)*1.5)}.p-2{padding:calc(var(--spacing)*2)}.p-2\.5{padding:calc(var(--spacing)*2.5)}.p-3{padding:calc(var(--spacing)*3)}.p-4{padding:calc(var(--spacing)*4)}.p-5{padding:calc(var(--spacing)*5)}.p-6{padding:calc(var(--spacing)*6)}.px-1{padding-inline:calc(var(--spacing)*1)}.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)}.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-2\.5{padding-block:calc(var(--spacing)*2.5)}.py-3{padding-block:calc(var(--spacing)*3)}.py-4{padding-block:calc(var(--spacing)*4)}.py-5{padding-block:calc(var(--spacing)*5)}.py-6{padding-block:calc(var(--spacing)*6)}.py-8{padding-block:calc(var(--spacing)*8)}.py-12{padding-block:calc(var(--spacing)*12)}.py-16{padding-block:calc(var(--spacing)*16)}.py-32{padding-block:calc(var(--spacing)*32)}.pt-2{padding-top:calc(var(--spacing)*2)}.pt-3{padding-top:calc(var(--spacing)*3)}.pt-4{padding-top:calc(var(--spacing)*4)}.pr-4{padding-right:calc(var(--spacing)*4)}.pb-1{padding-bottom:calc(var(--spacing)*1)}.pb-3{padding-bottom:calc(var(--spacing)*3)}.pb-24{padding-bottom:calc(var(--spacing)*24)}.pl-10{padding-left:calc(var(--spacing)*10)}.pl-11{padding-left:calc(var(--spacing)*11)}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.font-mono{font-family:var(--font-mono)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--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-\[9px\]{font-size:9px}.text-\[10px\]{font-size:10px}.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)}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.tracking-wider{--tw-tracking:var(--tracking-wider);letter-spacing:var(--tracking-wider)}.break-all{word-break:break-all}.whitespace-nowrap{white-space:nowrap}.whitespace-pre{white-space:pre}.text-amber-200{color:var(--color-amber-200)}.text-amber-300{color:var(--color-amber-300)}.text-amber-400{color:var(--color-amber-400)}.text-blue-300{color:var(--color-blue-300)}.text-blue-400{color:var(--color-blue-400)}.text-emerald-300{color:var(--color-emerald-300)}.text-emerald-400{color:var(--color-emerald-400)}.text-gray-200{color:var(--color-gray-200)}.text-gray-300{color:var(--color-gray-300)}.text-gray-400{color:var(--color-gray-400)}.text-gray-500{color:var(--color-gray-500)}.text-gray-600{color:var(--color-gray-600)}.text-green-400{color:var(--color-green-400)}.text-purple-400{color:var(--color-purple-400)}.text-red-300{color:var(--color-red-300)}.text-red-400{color:var(--color-red-400)}.text-slate-300{color:var(--color-slate-300)}.text-slate-400{color:var(--color-slate-400)}.text-slate-500{color:var(--color-slate-500)}.text-slate-600{color:var(--color-slate-600)}.text-slate-900{color:var(--color-slate-900)}.text-white{color:var(--color-white)}.uppercase{text-transform:uppercase}.tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal,)var(--tw-slashed-zero,)var(--tw-numeric-figure,)var(--tw-numeric-spacing,)var(--tw-numeric-fraction,)}.underline{text-decoration-line:underline}.placeholder-slate-500::-moz-placeholder{color:var(--color-slate-500)}.placeholder-slate-500::placeholder{color:var(--color-slate-500)}.opacity-0{opacity:0}.opacity-25{opacity:.25}.opacity-50{opacity:.5}.opacity-60{opacity:.6}.opacity-75{opacity:.75}.opacity-100{opacity:1}.shadow-2xl{--tw-shadow:0 25px 50px -12px var(--tw-shadow-color,#00000040);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.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)}.ring-2{--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)}.shadow-amber-500\/30{--tw-shadow-color:#f99c004d}@supports (color:color-mix(in lab,red,red)){.shadow-amber-500\/30{--tw-shadow-color:color-mix(in oklab,color-mix(in oklab,var(--color-amber-500)30%,transparent)var(--tw-shadow-alpha),transparent)}}.shadow-blue-500\/30{--tw-shadow-color:#3080ff4d}@supports (color:color-mix(in lab,red,red)){.shadow-blue-500\/30{--tw-shadow-color:color-mix(in oklab,color-mix(in oklab,var(--color-blue-500)30%,transparent)var(--tw-shadow-alpha),transparent)}}.shadow-blue-500\/50{--tw-shadow-color:#3080ff80}@supports (color:color-mix(in lab,red,red)){.shadow-blue-500\/50{--tw-shadow-color:color-mix(in oklab,color-mix(in oklab,var(--color-blue-500)50%,transparent)var(--tw-shadow-alpha),transparent)}}.shadow-emerald-500\/30{--tw-shadow-color:#00bb7f4d}@supports (color:color-mix(in lab,red,red)){.shadow-emerald-500\/30{--tw-shadow-color:color-mix(in oklab,color-mix(in oklab,var(--color-emerald-500)30%,transparent)var(--tw-shadow-alpha),transparent)}}.shadow-red-500\/10{--tw-shadow-color:#fb2c361a}@supports (color:color-mix(in lab,red,red)){.shadow-red-500\/10{--tw-shadow-color:color-mix(in oklab,color-mix(in oklab,var(--color-red-500)10%,transparent)var(--tw-shadow-alpha),transparent)}}.shadow-red-500\/30{--tw-shadow-color:#fb2c364d}@supports (color:color-mix(in lab,red,red)){.shadow-red-500\/30{--tw-shadow-color:color-mix(in oklab,color-mix(in oklab,var(--color-red-500)30%,transparent)var(--tw-shadow-alpha),transparent)}}.ring-blue-500{--tw-ring-color:var(--color-blue-500)}.ring-blue-500\/50{--tw-ring-color:#3080ff80}@supports (color:color-mix(in lab,red,red)){.ring-blue-500\/50{--tw-ring-color:color-mix(in oklab,var(--color-blue-500)50%,transparent)}}.ring-red-500\/50{--tw-ring-color:#fb2c3680}@supports (color:color-mix(in lab,red,red)){.ring-red-500\/50{--tw-ring-color:color-mix(in oklab,var(--color-red-500)50%,transparent)}}.ring-offset-2{--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)}.ring-offset-gray-900{--tw-ring-offset-color:var(--color-gray-900)}.filter{filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.backdrop-blur-md{--tw-backdrop-blur:blur(var(--blur-md));-webkit-backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,)}.backdrop-blur-sm{--tw-backdrop-blur:blur(var(--blur-sm));-webkit-backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,)}.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-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-150{--tw-duration:.15s;transition-duration:.15s}.duration-200{--tw-duration:.2s;transition-duration:.2s}.select-text{-webkit-user-select:text;-moz-user-select:text;user-select:text}@media (hover:hover){.group-hover\:border-slate-500:is(:where(.group):hover *){border-color:var(--color-slate-500)}.group-hover\:text-amber-400:is(:where(.group):hover *){color:var(--color-amber-400)}.group-hover\:opacity-100:is(:where(.group):hover *){opacity:1}}.peer-checked\:translate-x-3\.5:is(:where(.peer):checked~*){--tw-translate-x:calc(var(--spacing)*3.5);translate:var(--tw-translate-x)var(--tw-translate-y)}.peer-checked\:translate-x-5:is(:where(.peer):checked~*){--tw-translate-x:calc(var(--spacing)*5);translate:var(--tw-translate-x)var(--tw-translate-y)}.peer-checked\:translate-x-7:is(:where(.peer):checked~*){--tw-translate-x:calc(var(--spacing)*7);translate:var(--tw-translate-x)var(--tw-translate-y)}.peer-checked\:border-amber-500:is(:where(.peer):checked~*){border-color:var(--color-amber-500)}.peer-checked\:bg-amber-500:is(:where(.peer):checked~*){background-color:var(--color-amber-500)}.peer-focus-visible\:ring-2:is(:where(.peer):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)}.peer-focus-visible\:ring-amber-500\/50:is(:where(.peer):focus-visible~*){--tw-ring-color:#f99c0080}@supports (color:color-mix(in lab,red,red)){.peer-focus-visible\:ring-amber-500\/50:is(:where(.peer):focus-visible~*){--tw-ring-color:color-mix(in oklab,var(--color-amber-500)50%,transparent)}}.peer-focus-visible\:ring-offset-2:is(:where(.peer):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)}.peer-focus-visible\:ring-offset-slate-900:is(:where(.peer):focus-visible~*){--tw-ring-offset-color:var(--color-slate-900)}.last\:border-b-0:last-child{border-bottom-style:var(--tw-border-style);border-bottom-width:0}@media (hover:hover){.hover\:border-red-500\/60:hover{border-color:#fb2c3699}@supports (color:color-mix(in lab,red,red)){.hover\:border-red-500\/60:hover{border-color:color-mix(in oklab,var(--color-red-500)60%,transparent)}}.hover\:border-slate-600:hover{border-color:var(--color-slate-600)}.hover\:border-white\/20:hover{border-color:#fff3}@supports (color:color-mix(in lab,red,red)){.hover\:border-white\/20:hover{border-color:color-mix(in oklab,var(--color-white)20%,transparent)}}.hover\:bg-amber-400:hover{background-color:var(--color-amber-400)}.hover\:bg-amber-500\/20:hover{background-color:#f99c0033}@supports (color:color-mix(in lab,red,red)){.hover\:bg-amber-500\/20:hover{background-color:color-mix(in oklab,var(--color-amber-500)20%,transparent)}}.hover\:bg-cyan-600:hover{background-color:var(--color-cyan-600)}.hover\:bg-emerald-500\/20:hover{background-color:#00bb7f33}@supports (color:color-mix(in lab,red,red)){.hover\:bg-emerald-500\/20:hover{background-color:color-mix(in oklab,var(--color-emerald-500)20%,transparent)}}.hover\:bg-emerald-700:hover{background-color:var(--color-emerald-700)}.hover\:bg-gray-700\/60:hover{background-color:#36415399}@supports (color:color-mix(in lab,red,red)){.hover\:bg-gray-700\/60:hover{background-color:color-mix(in oklab,var(--color-gray-700)60%,transparent)}}.hover\:bg-green-600\/20:hover{background-color:#00a54433}@supports (color:color-mix(in lab,red,red)){.hover\:bg-green-600\/20:hover{background-color:color-mix(in oklab,var(--color-green-600)20%,transparent)}}.hover\:bg-red-500\/20:hover{background-color:#fb2c3633}@supports (color:color-mix(in lab,red,red)){.hover\:bg-red-500\/20:hover{background-color:color-mix(in oklab,var(--color-red-500)20%,transparent)}}.hover\:bg-red-600\/20:hover{background-color:#e4001433}@supports (color:color-mix(in lab,red,red)){.hover\:bg-red-600\/20:hover{background-color:color-mix(in oklab,var(--color-red-600)20%,transparent)}}.hover\:bg-slate-600:hover{background-color:var(--color-slate-600)}.hover\:bg-slate-700:hover{background-color:var(--color-slate-700)}.hover\:bg-slate-800\/50:hover{background-color:#1d293d80}@supports (color:color-mix(in lab,red,red)){.hover\:bg-slate-800\/50:hover{background-color:color-mix(in oklab,var(--color-slate-800)50%,transparent)}}.hover\:bg-white\/5:hover{background-color:#ffffff0d}@supports (color:color-mix(in lab,red,red)){.hover\:bg-white\/5:hover{background-color:color-mix(in oklab,var(--color-white)5%,transparent)}}.hover\:bg-white\/10:hover{background-color:#ffffff1a}@supports (color:color-mix(in lab,red,red)){.hover\:bg-white\/10:hover{background-color:color-mix(in oklab,var(--color-white)10%,transparent)}}.hover\:bg-white\/15:hover{background-color:#ffffff26}@supports (color:color-mix(in lab,red,red)){.hover\:bg-white\/15:hover{background-color:color-mix(in oklab,var(--color-white)15%,transparent)}}.hover\:bg-white\/\[0\.02\]:hover{background-color:#ffffff05}@supports (color:color-mix(in lab,red,red)){.hover\:bg-white\/\[0\.02\]:hover{background-color:color-mix(in oklab,var(--color-white)2%,transparent)}}.hover\:bg-white\/\[0\.05\]:hover{background-color:#ffffff0d}@supports (color:color-mix(in lab,red,red)){.hover\:bg-white\/\[0\.05\]:hover{background-color:color-mix(in oklab,var(--color-white)5%,transparent)}}.hover\:text-amber-300:hover{color:var(--color-amber-300)}.hover\:text-amber-400:hover{color:var(--color-amber-400)}.hover\:text-blue-300:hover{color:var(--color-blue-300)}.hover\:text-emerald-300:hover{color:var(--color-emerald-300)}.hover\:text-gray-300:hover{color:var(--color-gray-300)}.hover\:text-green-300:hover{color:var(--color-green-300)}.hover\:text-red-300:hover{color:var(--color-red-300)}.hover\:text-slate-300:hover{color:var(--color-slate-300)}.hover\:text-white:hover{color:var(--color-white)}.hover\:opacity-100:hover{opacity:1}.hover\:ring-2:hover{--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)}.hover\:ring-gray-500:hover{--tw-ring-color:var(--color-gray-500)}.hover\:ring-offset-2:hover{--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)}.hover\:ring-offset-gray-900:hover{--tw-ring-offset-color:var(--color-gray-900)}}.focus\:border-amber-500:focus{border-color:var(--color-amber-500)}.focus\:border-amber-500\/50:focus{border-color:#f99c0080}@supports (color:color-mix(in lab,red,red)){.focus\:border-amber-500\/50:focus{border-color:color-mix(in oklab,var(--color-amber-500)50%,transparent)}}.focus\:border-red-500\/50:focus{border-color:#fb2c3680}@supports (color:color-mix(in lab,red,red)){.focus\:border-red-500\/50:focus{border-color:color-mix(in oklab,var(--color-red-500)50%,transparent)}}.focus\:ring-1:focus{--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)}.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-amber-500:focus{--tw-ring-color:var(--color-amber-500)}.focus\:ring-amber-500\/20:focus{--tw-ring-color:#f99c0033}@supports (color:color-mix(in lab,red,red)){.focus\:ring-amber-500\/20:focus{--tw-ring-color:color-mix(in oklab,var(--color-amber-500)20%,transparent)}}.focus\:ring-red-500\/20:focus{--tw-ring-color:#fb2c3633}@supports (color:color-mix(in lab,red,red)){.focus\:ring-red-500\/20:focus{--tw-ring-color:color-mix(in oklab,var(--color-red-500)20%,transparent)}}.focus\:outline-none:focus{--tw-outline-style:none;outline-style:none}.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-amber-500:focus-visible{--tw-ring-color:var(--color-amber-500)}.focus-visible\:ring-emerald-500:focus-visible{--tw-ring-color:var(--color-emerald-500)}.focus-visible\:ring-red-500:focus-visible{--tw-ring-color:var(--color-red-500)}.focus-visible\:ring-white\/30:focus-visible{--tw-ring-color:#ffffff4d}@supports (color:color-mix(in lab,red,red)){.focus-visible\:ring-white\/30:focus-visible{--tw-ring-color:color-mix(in oklab,var(--color-white)30%,transparent)}}.focus-visible\:ring-white\/50:focus-visible{--tw-ring-color:#ffffff80}@supports (color:color-mix(in lab,red,red)){.focus-visible\:ring-white\/50:focus-visible{--tw-ring-color:color-mix(in oklab,var(--color-white)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\:ring-offset-slate-900:focus-visible{--tw-ring-offset-color:var(--color-slate-900)}.active\:bg-emerald-800:active{background-color:var(--color-emerald-800)}.active\:bg-slate-500:active{background-color:var(--color-slate-500)}.active\:bg-slate-600:active{background-color:var(--color-slate-600)}.active\:bg-white\/15:active{background-color:#ffffff26}@supports (color:color-mix(in lab,red,red)){.active\:bg-white\/15:active{background-color:color-mix(in oklab,var(--color-white)15%,transparent)}}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:bg-slate-600:disabled{background-color:var(--color-slate-600)}.disabled\:opacity-30:disabled{opacity:.3}.disabled\:opacity-50:disabled{opacity:.5}@media (min-width:40rem){.sm\:flex{display:flex}.sm\:inline{display:inline}.sm\:w-auto{width:auto}.sm\:flex-row{flex-direction:row}.sm\:items-center{align-items:center}.sm\:px-6{padding-inline:calc(var(--spacing)*6)}}@media (min-width:48rem){.md\:left-auto{left:auto}.md\:ml-1\.5{margin-left:calc(var(--spacing)*1.5)}.md\:block{display:block}.md\:flex{display:flex}.md\:hidden{display:none}.md\:inline{display:inline}.md\:h-3{height:calc(var(--spacing)*3)}.md\:h-4{height:calc(var(--spacing)*4)}.md\:h-8{height:calc(var(--spacing)*8)}.md\:h-14{height:calc(var(--spacing)*14)}.md\:w-3{width:calc(var(--spacing)*3)}.md\:w-4{width:calc(var(--spacing)*4)}.md\:w-8{width:calc(var(--spacing)*8)}.md\:w-20{width:calc(var(--spacing)*20)}.md\:w-auto{width:auto}.md\:flex-initial{flex:0 auto}.md\:flex-none{flex:none}.md\:flex-row{flex-direction:row}.md\:flex-wrap{flex-wrap:wrap}.md\:items-center{align-items:center}.md\:gap-1{gap:calc(var(--spacing)*1)}.md\:gap-2{gap:calc(var(--spacing)*2)}.md\:gap-3{gap:calc(var(--spacing)*3)}.md\:gap-4{gap:calc(var(--spacing)*4)}:where(.md\: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)))}.md\:overflow-visible{overflow:visible}.md\:rounded-md{border-radius:var(--radius-md)}.md\:p-4{padding:calc(var(--spacing)*4)}.md\:px-4{padding-inline:calc(var(--spacing)*4)}.md\:py-1\.5{padding-block:calc(var(--spacing)*1.5)}.md\:py-2{padding-block:calc(var(--spacing)*2)}.md\:py-2\.5{padding-block:calc(var(--spacing)*2.5)}.md\:py-8{padding-block:calc(var(--spacing)*8)}.md\:pt-4{padding-top:calc(var(--spacing)*4)}.md\:pb-4{padding-bottom:calc(var(--spacing)*4)}.md\:text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.md\:text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}}@media (min-width:64rem){.lg\:col-span-2{grid-column:span 2/span 2}.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:px-8{padding-inline:calc(var(--spacing)*8)}}}:root{--vz-bg:#0f172a;--vz-surface:#1a2332;--vz-elevated:#1e293b;--vz-border:#374151;--vz-border-subtle:#2d3748;--accent-success:#10b981;--accent-success-muted:#132a23;--accent-warning:#f59e0b;--accent-warning-muted:#2a2317;--accent-danger:#ef4444;--accent-danger-muted:#2a1717;--accent-info:#3b82f6;--accent-info-muted:#172033;--accent-purple:#a855f7;--accent-purple-muted:#1f1733;--text-primary:#fff;--text-secondary:#9ca3af;--text-tertiary:#6b7280;--text-muted:#4b5563;--ring-size:120px;--ring-stroke:8px}::highlight(code-keyword){color:#c792ea;font-weight:500}::highlight(code-string){color:#c3e88d}::highlight(code-comment){color:#64748b;font-style:italic}::highlight(code-number){color:#f78c6c}::highlight(code-function){color:#82aaff}::highlight(code-command){color:#f59e0b}body{background-color:var(--vz-bg);color:var(--text-primary);font-family:system-ui,-apple-system,sans-serif}.touch-manipulation{touch-action:manipulation;-webkit-tap-highlight-color:transparent}.safe-area-bottom{padding-bottom:env(safe-area-inset-bottom,0)}.safe-area-top{padding-top:env(safe-area-inset-top,0)}.scrollbar-thin{scrollbar-width:thin;scrollbar-color:#4b556380 transparent}.scrollbar-thin::-webkit-scrollbar{width:6px;height:6px}.scrollbar-thin::-webkit-scrollbar-track{background:0 0}.scrollbar-thin::-webkit-scrollbar-thumb{background:#4b556380;border-radius:3px}.scrollbar-thin::-webkit-scrollbar-thumb:hover{background:#6b7280b3}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}.scrollbar-hide::-webkit-scrollbar{display:none}.scroll-snap-x{scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}.scroll-snap-item{scroll-snap-align:start}@keyframes fade-in-up{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-down{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-up{0%{opacity:.8;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes pulse-soft{0%,to{opacity:.6}50%{opacity:1}}@keyframes dropdown-enter{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{to{transform:rotate(360deg)}}.animate-fade-in-up{animation:.5s cubic-bezier(.4,0,.2,1) forwards fade-in-up}.animate-slide-down{animation:.2s ease-out slide-down}.animate-slide-up{animation:.25s ease-out slide-up}.animate-dropdown{animation:.15s ease-out dropdown-enter}.animate-delay-100{animation-delay:.1s}.animate-delay-200{animation-delay:.2s}.animate-delay-300{animation-delay:.3s}.animate-delay-400{animation-delay:.4s}.vz-card{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#ffffff08;border:1px solid #33415580;border-radius:12px;transition:border-color .2s,background-color .2s;overflow:hidden}.vz-card:hover{background:#ffffff0d;border-color:#475569b3}.vz-card--no-hover:hover{background:#ffffff08;border-color:#33415580}.vz-card--success{border-left:2px solid var(--accent-success)}.vz-card--warning{border-left:2px solid var(--accent-warning)}.vz-card--danger{border-left:2px solid var(--accent-danger)}.vz-card--info{border-left:2px solid var(--accent-info)}.vz-card--purple{border-left:2px solid var(--accent-purple)}.health-ring{width:var(--ring-size);height:var(--ring-size);position:relative}.health-ring__svg{width:100%;height:100%;transform:rotate(-90deg)}.health-ring__track{fill:none;stroke:var(--vz-border);stroke-width:var(--ring-stroke)}.health-ring__progress{fill:none;stroke-width:var(--ring-stroke);stroke-linecap:round;transition:stroke-dashoffset 1s cubic-bezier(.4,0,.2,1)}.health-ring__progress--success{stroke:var(--accent-success);filter:drop-shadow(0 0 6px #10b98166)}.health-ring__progress--warning{stroke:var(--accent-warning);filter:drop-shadow(0 0 6px #f59e0b66)}.health-ring__progress--danger{stroke:var(--accent-danger);filter:drop-shadow(0 0 6px #ef444466)}.health-ring__value{flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.health-ring__percentage{color:var(--text-primary);font-family:JetBrains Mono,monospace;font-size:1.75rem;font-weight:600;line-height:1}.health-ring__label{text-transform:uppercase;letter-spacing:.1em;color:var(--text-tertiary);margin-top:4px;font-size:.625rem;font-weight:500}.timeline-strip{gap:4px;padding:8px 0;display:flex}.timeline-item{cursor:pointer;border-radius:3px;width:6px;height:32px;transition:all .15s;position:relative}.timeline-item:hover{transform:scaleY(1.15)}.timeline-item--approved{background:var(--accent-success);opacity:.8}.timeline-item--approved:hover{opacity:1}.timeline-item--pending{background:var(--accent-warning);opacity:.8}.timeline-item--pending:hover{opacity:1}.timeline-item--rejected{background:var(--accent-danger);opacity:.8}.timeline-item--rejected:hover{opacity:1}.timeline-item--processing{background:var(--accent-info);animation:2s infinite pulse-soft}.stat-pill{border-radius:6px;align-items:center;gap:6px;padding:4px 10px;font-size:.75rem;font-weight:500;display:inline-flex}.stat-pill--success{background:var(--accent-success-muted);color:var(--accent-success)}.stat-pill--warning{background:var(--accent-warning-muted);color:var(--accent-warning)}.stat-pill--danger{background:var(--accent-danger-muted);color:var(--accent-danger)}.stat-pill--info{background:var(--accent-info-muted);color:var(--accent-info)}.stat-pill--muted{color:var(--text-secondary);background:#6b728026}.stat-pill--purple{background:var(--accent-purple-muted);color:var(--accent-purple)}.vz-table{border-collapse:separate;border-spacing:0;width:100%}.vz-table thead th{text-transform:uppercase;letter-spacing:.05em;color:var(--text-tertiary);border-bottom:1px solid var(--vz-border-subtle);text-align:left;background:#0003;padding:12px 16px;font-size:.6875rem;font-weight:600}.vz-table tbody tr{transition:background-color .15s}.vz-table tbody tr:hover{background:#ffffff08}.vz-table tbody td{color:var(--text-secondary);border-bottom:1px solid var(--vz-border-subtle);padding:14px 16px;font-size:.875rem}.vz-table tbody tr:last-child td{border-bottom:none}.skeleton{background:linear-gradient(90deg,#1e293b80,#33415580,#1e293b80) 0 0/200% 100%;border-radius:6px;animation:1.5s infinite shimmer}.skeleton--text{width:100%;height:16px}.skeleton--heading{width:60%;height:24px}.skeleton--avatar{border-radius:50%;width:40px;height:40px}.skeleton--button{border-radius:8px;width:100px;height:36px}.comparison-viewer{justify-content:center;display:flex;position:relative}.overlay-mode .overlay-container{cursor:pointer;display:inline-block;position:relative}.overlay-mode .current-image{z-index:10;border-radius:var(--radius-lg);border-style:var(--tw-border-style);border-width:1px;border-color:var(--color-slate-600);max-width:100%;height:auto;position:relative}.overlay-mode .baseline-image,.overlay-mode .diff-image{top:calc(var(--spacing)*0);left:calc(var(--spacing)*0);border-radius:var(--radius-lg);border-style:var(--tw-border-style);border-width:1px;border-color:var(--color-slate-600);max-width:100%;height:auto;position:absolute}.overlay-mode .baseline-image{z-index:20}.overlay-mode .diff-image{z-index:30;transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration));--tw-duration:.2s;transition-duration:.2s}.toggle-mode .toggle-container{text-align:center}.toggle-mode .toggle-image{border-radius:var(--radius-lg);border-style:var(--tw-border-style);border-width:1px;border-color:var(--color-slate-600);max-width:100%;height:auto}.toggle-mode .toggle-label{margin-top:calc(var(--spacing)*2);font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height));color:var(--color-slate-400)}.onion-mode .onion-container{cursor:col-resize;-webkit-user-select:none;-moz-user-select:none;user-select:none;display:inline-block;position:relative}.onion-mode .onion-baseline,.onion-mode .onion-current{pointer-events:none;border-radius:var(--radius-lg);border-style:var(--tw-border-style);border-width:1px;border-color:var(--color-slate-600);-webkit-user-select:none;-moz-user-select:none;user-select:none;-webkit-user-drag:none;max-width:100%;height:auto;display:block}.onion-mode .onion-current{top:calc(var(--spacing)*0);left:calc(var(--spacing)*0);clip-path:inset(0 50% 0 0);max-width:100%;height:auto;position:absolute}.onion-mode .onion-divider{pointer-events:none;top:calc(var(--spacing)*0);z-index:10;height:100%;width:calc(var(--spacing)*.5);background-color:var(--color-amber-500);position:absolute;left:50%}.onion-mode .onion-divider:before{content:"";top:calc(var(--spacing)*-2);left:calc(var(--spacing)*-2);height:calc(var(--spacing)*4);width:calc(var(--spacing)*4);background-color:var(--color-amber-500);border-radius:3.40282e38px;position:absolute}.onion-mode .onion-divider:after{content:"";bottom:calc(var(--spacing)*-2);left:calc(var(--spacing)*-2);height:calc(var(--spacing)*4);width:calc(var(--spacing)*4);background-color:var(--color-amber-500);border-radius:3.40282e38px;position:absolute}.side-by-side-mode .side-by-side-container{gap:calc(var(--spacing)*4);display:flex}.side-by-side-mode .side-by-side-image{text-align:center;flex:1}.side-by-side-mode .side-by-side-image img{border-radius:var(--radius-lg);border-style:var(--tw-border-style);border-width:1px;border-color:var(--color-slate-600);max-width:100%;height:auto}.side-by-side-mode .side-by-side-image label{margin-top:calc(var(--spacing)*2);font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height));--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium);color:var(--color-slate-400);display:block}.filmstrip-scroll{scroll-behavior:smooth;-webkit-overflow-scrolling:touch}.unified-screenshot-container{transition:transform .15s ease-out}.glass-header{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#1e293bf2}:where(.vz-form-section>: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)))}.vz-form-section__header{margin-bottom:calc(var(--spacing)*6)}.vz-form-section__title{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height));--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold);color:var(--color-white)}.vz-form-section__description{margin-top:calc(var(--spacing)*1);font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height));color:var(--color-slate-400)}:where(.vz-form-group>: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)))}.vz-form-actions{justify-content:flex-end;align-items:center;gap:calc(var(--spacing)*3);border-top-style:var(--tw-border-style);border-color:#31415880;border-top-width:1px;display:flex}@supports (color:color-mix(in lab,red,red)){.vz-form-actions{border-color:color-mix(in oklab,var(--color-slate-700)50%,transparent)}}.vz-form-actions{padding-top:calc(var(--spacing)*4)}.font-mono{font-family:JetBrains Mono,monospace}.focus-ring:focus{--tw-outline-style:none;outline-style:none}.focus-ring: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);--tw-ring-color:#f99c0080}@supports (color:color-mix(in lab,red,red)){.focus-ring:focus-visible{--tw-ring-color:color-mix(in oklab,var(--color-amber-500)50%,transparent)}}.focus-ring: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);--tw-ring-offset-color:var(--color-slate-900)}@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-scale-x{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-y{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-z{syntax:"*";inherits:false;initial-value:1}@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-gradient-position{syntax:"*";inherits:false}@property --tw-gradient-from{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-via{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-to{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-stops{syntax:"*";inherits:false}@property --tw-gradient-via-stops{syntax:"*";inherits:false}@property --tw-gradient-from-position{syntax:"<length-percentage>";inherits:false;initial-value:0%}@property --tw-gradient-via-position{syntax:"<length-percentage>";inherits:false;initial-value:50%}@property --tw-gradient-to-position{syntax:"<length-percentage>";inherits:false;initial-value:100%}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-ordinal{syntax:"*";inherits:false}@property --tw-slashed-zero{syntax:"*";inherits:false}@property --tw-numeric-figure{syntax:"*";inherits:false}@property --tw-numeric-spacing{syntax:"*";inherits:false}@property --tw-numeric-fraction{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-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@keyframes ping{75%,to{opacity:0;transform:scale(2)}}@keyframes pulse{50%{opacity:.5}}@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-scale-x:1;--tw-scale-y:1;--tw-scale-z:1;--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-gradient-position:initial;--tw-gradient-from:#0000;--tw-gradient-via:#0000;--tw-gradient-to:#0000;--tw-gradient-stops:initial;--tw-gradient-via-stops:initial;--tw-gradient-from-position:0%;--tw-gradient-via-position:50%;--tw-gradient-to-position:100%;--tw-font-weight:initial;--tw-tracking:initial;--tw-ordinal:initial;--tw-slashed-zero:initial;--tw-numeric-figure:initial;--tw-numeric-spacing:initial;--tw-numeric-fraction: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-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-duration:initial}}}
@@ -25,7 +25,7 @@ Error generating stack: `+a.message+`
25
25
  linear-gradient(-45deg, #1f2937 25%, transparent 25%),
26
26
  linear-gradient(45deg, transparent 75%, #1f2937 75%),
27
27
  linear-gradient(-45deg, transparent 75%, #1f2937 75%)
28
- `,backgroundSize:"16px 16px",backgroundPosition:"0 0, 0 8px, 8px -8px, -8px 0px",backgroundColor:"#111827"},children:[r.jsx("div",{className:`relative ${k.allowsOverflow?"flex justify-center items-start":"min-w-full min-h-full flex justify-center items-center"}`,style:{...k.allowsOverflow?{minWidth:M.width*k.scale+40,minHeight:M.height*k.scale+40,padding:"20px"}:{zoom:k.scale,padding:"20px"}},children:r.jsx("div",{ref:$,className:"relative inline-block",style:k.allowsOverflow?{transform:`scale(${k.scale})`,transformOrigin:"top center"}:{},children:u==="toggle"&&de.baseline?r.jsx(Bv,{baselineImageUrl:de.baseline,currentImageUrl:de.current,screenshot:K,onImageError:ne,onImageLoad:xe,imageErrors:p}):u==="onion-skin"&&de.baseline?r.jsx(Hv,{baselineImageUrl:de.baseline,currentImageUrl:de.current,sliderPosition:o,onSliderChange:h,screenshot:K,onImageError:ne,onImageLoad:xe,imageErrors:p}):r.jsx(qv,{baselineImageUrl:de.baseline,currentImageUrl:de.current,diffImageUrl:de.diff,showDiffOverlay:c,screenshot:K,onImageError:ne,onImageLoad:xe,imageErrors:p,onDiffToggle:v})})}),!g&&!z.has(`current-${K?.id}`)&&r.jsx("div",{className:"absolute inset-0 bg-gray-700 animate-pulse flex items-center justify-center",children:r.jsx("div",{className:"text-gray-400",children:"Loading..."})}),p.has(`current-${K?.id}`)&&r.jsx("div",{className:"absolute inset-0 bg-gray-700 flex items-center justify-center",children:r.jsxs("div",{className:"text-center text-gray-400",children:[r.jsx(dl,{className:"w-8 h-8 mx-auto mb-2"}),r.jsx("div",{className:"text-sm",children:"Failed to load image"})]})})]})})}function pa(n){return n?.id||n?.signature||n?.name}function kv({zoom:n,onZoomChange:u}){let c=m.useCallback(()=>{u(n==="fit"?.75:Math.min(3,n+.25))},[n,u]),o=m.useCallback(()=>{u(n==="fit"?.5:Math.max(.1,n-.25))},[n,u]),h=m.useCallback(()=>{u("fit")},[u]),v=m.useCallback(()=>{u(1)},[u]),g=n==="fit"?"Fit":`${Math.round(n*100)}%`;return r.jsxs("div",{className:"flex items-center gap-2",children:[r.jsxs("div",{className:"flex items-center bg-gray-800/90 backdrop-blur-md rounded-lg border border-gray-600/40 shadow-lg",children:[r.jsx("button",{onClick:o,className:"p-2 text-gray-300 hover:text-white hover:bg-gray-700/60 rounded-l-lg transition-colors",title:"Zoom out (−)",children:r.jsx(Jg,{className:"w-4 h-4"})}),r.jsx("div",{className:"px-3 py-1.5 min-w-[60px] text-center text-sm font-medium text-gray-200",children:g}),r.jsx("button",{onClick:c,className:"p-2 text-gray-300 hover:text-white hover:bg-gray-700/60 rounded-r-lg transition-colors",title:"Zoom in (+)",children:r.jsx(Fg,{className:"w-4 h-4"})})]}),r.jsx("button",{onClick:h,className:`p-2 rounded-lg transition-colors ${n==="fit"?"bg-blue-600/30 text-blue-400 border border-blue-500/40":"bg-gray-800/90 text-gray-300 hover:text-white hover:bg-gray-700/60 border border-gray-600/40"}`,title:"Fit to screen",children:r.jsx(pg,{className:"w-4 h-4"})}),r.jsx("button",{onClick:v,className:`p-2 rounded-lg transition-colors ${n===1?"bg-blue-600/30 text-blue-400 border border-blue-500/40":"bg-gray-800/90 text-gray-300 hover:text-white hover:bg-gray-700/60 border border-gray-600/40"}`,title:"Actual size",children:r.jsx("span",{className:"text-xs font-bold w-4 h-4 flex items-center justify-center",children:"1:1"})})]})}function Yv({comparison:n,isActive:u,onClick:c,index:o}){let h=n.current||n.baseline,v=n.status==="failed",g=n.status==="new"||n.status==="baseline-created";return r.jsxs("button",{onClick:c,className:`relative flex-shrink-0 group transition-all duration-200 ${u?"ring-2 ring-blue-500 ring-offset-2 ring-offset-gray-900 rounded-lg scale-110":"hover:ring-2 hover:ring-gray-500 hover:ring-offset-2 hover:ring-offset-gray-900 rounded-lg opacity-60 hover:opacity-100"}`,title:n.name||`Screenshot ${o+1}`,children:[r.jsxs("div",{className:"relative w-14 h-20 bg-gray-800 rounded-lg overflow-hidden",children:[h?r.jsx("img",{src:h,alt:n.name||"Thumbnail",className:"absolute inset-0 w-full h-full object-cover object-top",loading:"lazy"}):r.jsx("div",{className:"absolute inset-0 bg-gradient-to-br from-gray-800 to-gray-700 flex items-center justify-center",children:r.jsx("span",{className:"text-lg font-medium text-gray-500",children:n.name?n.name.charAt(0).toUpperCase():"?"})}),g&&r.jsx("div",{className:"absolute bottom-1 left-1 px-1 py-0.5 bg-blue-600/90 rounded text-[9px] font-bold text-white shadow-sm",children:"NEW"}),v&&!g&&r.jsx("div",{className:"absolute bottom-1 left-1 px-1 py-0.5 bg-amber-600/90 rounded text-[9px] font-bold text-white shadow-sm",children:"DIFF"})]}),r.jsx("div",{className:"absolute bottom-full left-1/2 -translate-x-1/2 mb-2 px-2 py-1 bg-gray-800 border border-gray-700 text-xs text-gray-200 rounded whitespace-nowrap opacity-0 group-hover:opacity-100 transition-opacity pointer-events-none z-20 shadow-lg",children:n.name||`Screenshot ${o+1}`})]})}function Gv({comparison:n,comparisons:u=[],onClose:c,onAccept:o,onReject:h,onNavigate:v,userAction:g}){let[y,b]=m.useState(hn.OVERLAY),[p,N]=m.useState(!1),[z,L]=m.useState("fit"),[V,B]=m.useState(!0),[M,H]=m.useState(50),q=m.useRef(null),$=m.useMemo(()=>{let J={failed:0,new:1,"baseline-created":1,passed:2};return[...u].sort((oe,Ge)=>{let Ke=oe.initialStatus||oe.status,T=Ge.initialStatus||Ge.status,Q=J[Ke]??3,W=J[T]??3;return Q-W})},[u]),k=m.useMemo(()=>{let J=pa(n);return $.findIndex((oe,Ge)=>pa(oe)===J)},[n,$]),ne=m.useMemo(()=>({prev:k>0,next:k<$.length-1}),[k,$.length]),xe=m.useCallback(()=>{ne.prev&&$[k-1]&&v($[k-1])},[ne.prev,$,k,v]),de=m.useCallback(()=>{ne.next&&$[k+1]&&v($[k+1])},[ne.next,$,k,v]);if(m.useEffect(()=>{if(q.current&&k>=0){let J=q.current,oe=J.children;if(oe[k]){let Ge=oe[k],Ke=J.getBoundingClientRect(),T=Ge.getBoundingClientRect();(T.left<Ke.left||T.right>Ke.right)&&Ge.scrollIntoView({behavior:"smooth",block:"nearest",inline:"center"})}}},[k]),m.useEffect(()=>{let J=oe=>{if(!(oe.target.tagName==="INPUT"||oe.target.tagName==="TEXTAREA"))switch(oe.key){case"ArrowLeft":oe.preventDefault(),ne.prev&&xe();break;case"ArrowRight":oe.preventDefault(),ne.next&&de();break;case"Escape":oe.preventDefault(),c();break}};return window.addEventListener("keydown",J),()=>window.removeEventListener("keydown",J)},[ne,xe,de,c]),!n)return r.jsx("div",{className:"fixed inset-0 bg-gray-900 z-50 flex items-center justify-center",children:r.jsxs("div",{className:"text-center",children:[r.jsx("div",{className:"text-lg text-white font-medium mb-2",children:"Comparison not found"}),r.jsx("button",{onClick:c,className:"text-blue-400 hover:text-blue-300 font-medium transition-colors",children:"Return to list"})]})});let K=n.status==="failed"||n.status==="passed",ee=g==="accepted"||n.status==="passed"&&g!=="rejected",ve=g==="rejected",Me=[{value:hn.OVERLAY,label:"Overlay"},{value:hn.TOGGLE,label:"Toggle"},{value:hn.ONION,label:"Slide"}],he=[];return n.properties?.browser&&he.push({key:"Browser",value:n.properties.browser}),n.properties?.viewport_width&&n.properties?.viewport_height&&he.push({key:"Viewport",value:`${n.properties.viewport_width}×${n.properties.viewport_height}`}),n.properties?.device&&he.push({key:"Device",value:n.properties.device}),r.jsxs("div",{className:"fixed inset-0 bg-gray-900 z-50 flex flex-col","data-testid":"fullscreen-viewer",children:[r.jsxs("div",{className:"flex-shrink-0 bg-gray-900/95 backdrop-blur-md border-b border-gray-800/50 z-30",children:[r.jsxs("div",{className:"px-4 py-2.5 flex items-center justify-between gap-2",children:[r.jsxs("div",{className:"flex items-center gap-3 min-w-0",children:[r.jsx("button",{onClick:c,className:"p-1.5 text-gray-400 hover:text-white rounded-lg hover:bg-gray-700/60 transition-colors",title:"Back (Esc)",children:r.jsx(yi,{className:"w-5 h-5"})}),r.jsxs("div",{className:"flex items-center gap-1",children:[r.jsx("button",{onClick:xe,disabled:!ne.prev,className:"p-1.5 text-gray-400 hover:text-white disabled:opacity-30 disabled:cursor-not-allowed rounded-lg hover:bg-gray-700/60 transition-colors",title:"Previous (←)",children:r.jsx(Dg,{className:"w-4 h-4"})}),r.jsxs("span",{className:"text-xs text-gray-500 font-medium tabular-nums min-w-[3rem] text-center",children:[k+1,"/",$.length]}),r.jsx("button",{onClick:de,disabled:!ne.next,className:"p-1.5 text-gray-400 hover:text-white disabled:opacity-30 disabled:cursor-not-allowed rounded-lg hover:bg-gray-700/60 transition-colors",title:"Next (→)",children:r.jsx(ru,{className:"w-4 h-4"})})]}),r.jsx("div",{className:"h-5 w-px bg-gray-700/50"}),r.jsx("h1",{className:"text-sm font-medium text-gray-200 truncate max-w-[300px]",children:n.name||n.originalName||"Unknown"}),he.length>0&&r.jsxs("button",{onClick:()=>N(!p),className:"flex items-center gap-1 px-2 py-1 text-xs text-gray-500 hover:text-gray-300 transition-colors",children:[r.jsxs("span",{children:[he.length," props"]}),r.jsx(uu,{className:`w-3 h-3 transition-transform ${p?"rotate-180":""}`})]})]}),K&&r.jsxs("div",{className:"flex items-center bg-gray-800/60 rounded-lg p-0.5 border border-gray-700/50",children:[r.jsxs("button",{onClick:()=>h(pa(n)),className:`flex items-center gap-1 px-3 py-1.5 text-xs font-medium rounded-md transition-all ${ve?"bg-red-600 text-white":"text-red-400 hover:text-red-300 hover:bg-red-600/20"}`,children:[r.jsx("span",{className:"w-1.5 h-1.5 bg-current rounded-full"}),"Reject"]}),r.jsxs("button",{onClick:()=>o(pa(n)),className:`flex items-center gap-1 px-3 py-1.5 text-xs font-medium rounded-md transition-all ${ee?"bg-green-600 text-white":"text-green-400 hover:text-green-300 hover:bg-green-600/20"}`,children:[r.jsx("span",{className:"w-1.5 h-1.5 bg-current rounded-full"}),"Approve"]})]}),r.jsxs("div",{className:"flex items-center gap-2",children:[r.jsx(kv,{zoom:z,onZoomChange:L}),r.jsx("div",{className:"flex items-center bg-gray-800/60 rounded-lg p-0.5 border border-gray-700/50",children:Me.map(J=>r.jsx("button",{onClick:()=>n.diff&&b(J.value),disabled:!n.diff,className:`px-2.5 py-1 text-xs font-medium rounded-md transition-all ${n.diff?y===J.value?"bg-blue-600 text-white":"text-gray-400 hover:text-white hover:bg-gray-700/60":"text-gray-600 cursor-not-allowed"}`,children:J.label},J.value))})]})]}),p&&he.length>0&&r.jsx("div",{className:"px-4 py-2 border-t border-gray-800/50 bg-gray-900/50",children:r.jsx("div",{className:"flex flex-wrap gap-2",children:he.map((J,oe)=>r.jsxs("span",{className:"inline-flex items-center px-2 py-0.5 bg-gray-800/60 text-xs rounded-md",children:[r.jsxs("span",{className:"text-gray-500",children:[J.key,":"]}),r.jsx("span",{className:"ml-1 text-gray-300",children:J.value})]},oe))})})]}),r.jsx("div",{className:"flex-1 min-h-0 overflow-hidden",children:r.jsx(Qv,{comparison:n,viewMode:y===hn.ONION?"onion-skin":y,showDiffOverlay:V,onDiffToggle:()=>B(J=>!J),onionSkinPosition:M,onOnionSkinChange:H,zoom:z,disableLoadingOverlay:!0,className:"w-full h-full"},pa(n))}),r.jsx("div",{className:"flex-shrink-0 bg-gray-900 border-t border-gray-800/50",children:r.jsx("div",{className:"px-4 py-3",children:r.jsxs("div",{className:"flex items-center gap-4",children:[r.jsxs("div",{className:"text-sm text-gray-500 flex-shrink-0",children:[k+1," of ",$.length]}),r.jsx("div",{ref:q,className:"flex-1 flex items-center gap-2 overflow-x-auto scrollbar-hide py-1",children:$.map((J,oe)=>r.jsx(Yv,{comparison:J,index:oe,isActive:oe===k,onClick:()=>v(J)},pa(J)))}),r.jsxs("div",{className:"hidden md:flex items-center gap-3 text-xs text-gray-500 flex-shrink-0",children:[r.jsxs("span",{children:["Use"," ",r.jsx("kbd",{className:"px-1 py-0.5 bg-gray-800 rounded text-gray-400",children:"←"})," ",r.jsx("kbd",{className:"px-1 py-0.5 bg-gray-800 rounded text-gray-400",children:"→"})," ","to navigate"]}),r.jsx(uu,{className:"w-4 h-4 rotate-[-90deg]"})]})]})})})]})}function Vv(){let[,n]=di(),[,u]=lg("/comparison/:id"),[c,o]=m.useState({}),{data:h}=gi(),v=sg(),g=rg(),y=m.useMemo(()=>h?.comparisons||[],[h?.comparisons]),b=m.useMemo(()=>{let B=u?.id?decodeURIComponent(u.id):null;return!B||y.length===0?null:y.find(M=>M.id===B||M.signature===B||M.name===B)},[u,y]),p=m.useCallback(B=>{let M=B.id||B.signature||B.name;M&&n(`/comparison/${encodeURIComponent(M)}`)},[n]),N=m.useCallback(()=>{n("/")},[n]),z=m.useMemo(()=>b?b.id||b.signature||b.name:null,[b]),L=m.useCallback(B=>{o(M=>({...M,[B]:"accepting"})),v.mutate(B,{onSettled:()=>{o(M=>({...M,[B]:void 0}))}})},[v]),V=m.useCallback(B=>{o(M=>({...M,[B]:"rejecting"})),g.mutate(B,{onSettled:()=>{o(M=>({...M,[B]:void 0}))}})},[g]);return b?r.jsx(Gv,{comparison:b,comparisons:y,onClose:N,onAccept:L,onReject:V,onNavigate:p,userAction:c[z]}):r.jsx("div",{className:"fixed inset-0 bg-gray-900 z-50 flex items-center justify-center",children:r.jsxs("div",{className:"text-center",children:[r.jsx("div",{className:"text-lg text-white font-medium mb-2",children:"Comparison not found"}),r.jsxs("p",{className:"text-sm text-gray-400 mb-4",children:["ID: ",u?.id||"none"]}),r.jsx("button",{onClick:N,className:"text-blue-400 hover:text-blue-300 font-medium transition-colors",children:"Return to list"})]})})}function Zv(n={}){return ma({queryKey:Te.config,queryFn:To.get,...n})}function Xv(){let n=Lt();return Qt({mutationFn:To.updateProject,onSuccess:()=>{n.invalidateQueries({queryKey:Te.config})}})}function qo(n){return{threshold:n?.comparison?.threshold??.1,port:n?.server?.port??47392,timeout:n?.server?.timeout??3e4,buildName:n?.build?.name??"Build {timestamp}",environment:n?.build?.environment??"test",openReport:n?.tdd?.openReport??!1}}function mu({source:n}){let u={default:"default",project:"info",global:"purple",env:"success",cli:"warning"},c={default:"Default",project:"Project",global:"Global",env:"Environment",cli:"CLI Flag"};return r.jsx(on,{variant:u[n]||"default",size:"sm",children:c[n]||n})}function Kv({config:n,sources:u,onSave:c,isSaving:o}){let h=qo(n),[v,g]=m.useState(h),[y,b]=m.useState(!1),[p,N]=m.useState("general"),z=m.useCallback((M,H)=>{g(q=>({...q,[M]:H})),b(!0)},[]),L=m.useCallback(()=>{g(qo(n)),b(!1)},[n]),V=m.useCallback(()=>{let M={comparison:{threshold:v.threshold},server:{port:v.port,timeout:v.timeout},build:{name:v.buildName,environment:v.environment},tdd:{openReport:v.openReport}};c(M,()=>b(!1))},[v,c]),B=[{key:"general",label:"General",icon:cu},{key:"server",label:"Server",icon:_o},{key:"build",label:"Build",icon:Uo}];return r.jsxs("div",{className:"space-y-6",children:[r.jsx(mv,{tabs:B,activeTab:p,onChange:N,variant:"default"}),p==="general"&&r.jsxs(lt,{hover:!1,children:[r.jsx(Gl,{icon:cu,title:"General Settings",description:"Configure visual comparison and TDD behavior",iconColor:"bg-amber-500/10 text-amber-400"}),r.jsxs(nt,{className:"space-y-6",children:[r.jsx(pi,{label:"Visual Comparison Threshold",type:"number",value:v.threshold,onChange:M=>z("threshold",parseFloat(M.target.value)),hint:"Percentage of pixel difference allowed before marking as failed (0.0 - 1.0)",step:"0.01",min:"0",max:"1"}),r.jsx(ov,{label:"Auto-open Report",description:"Automatically open the dashboard in your browser when starting TDD mode",checked:v.openReport,onChange:M=>z("openReport",M.target.checked)}),r.jsxs("div",{className:"pt-4 border-t border-slate-700/50 flex items-center gap-2",children:[r.jsx("span",{className:"text-sm text-slate-500",children:"Config source:"}),r.jsx(mu,{source:u?.comparison||"default"})]})]})]}),p==="server"&&r.jsxs(lt,{hover:!1,children:[r.jsx(Gl,{icon:_o,title:"Server Settings",description:"Local screenshot server configuration",iconColor:"bg-blue-500/10 text-blue-400"}),r.jsxs(nt,{className:"space-y-6",children:[r.jsx(pi,{label:"Server Port",type:"number",value:v.port,onChange:M=>z("port",parseInt(M.target.value,10)),hint:"Port for the local screenshot server"}),r.jsx(pi,{label:"Server Timeout",type:"number",value:v.timeout,onChange:M=>z("timeout",parseInt(M.target.value,10)),hint:"Request timeout in milliseconds"}),r.jsxs("div",{className:"pt-4 border-t border-slate-700/50 flex items-center gap-2",children:[r.jsx("span",{className:"text-sm text-slate-500",children:"Config source:"}),r.jsx(mu,{source:u?.server||"default"})]})]})]}),p==="build"&&r.jsxs(lt,{hover:!1,children:[r.jsx(Gl,{icon:Uo,title:"Build Settings",description:"Configure build naming and environment",iconColor:"bg-purple-500/10 text-purple-400"}),r.jsxs(nt,{className:"space-y-6",children:[r.jsx(pi,{label:"Build Name Template",type:"text",value:v.buildName,onChange:M=>z("buildName",M.target.value),hint:"Template for build names (use {timestamp} for current time)"}),r.jsx(cv,{label:"Environment",value:v.environment,onChange:M=>z("environment",M.target.value),hint:"Target environment for builds",options:[{value:"test",label:"Test"},{value:"development",label:"Development"},{value:"staging",label:"Staging"},{value:"production",label:"Production"}]}),r.jsxs("div",{className:"pt-4 border-t border-slate-700/50 flex items-center gap-2",children:[r.jsx("span",{className:"text-sm text-slate-500",children:"Config source:"}),r.jsx(mu,{source:u?.build||"default"})]})]})]}),y&&r.jsx("div",{className:"fixed bottom-6 right-6 left-6 md:left-auto md:w-auto",children:r.jsxs("div",{className:"bg-slate-800 border border-slate-700 rounded-xl shadow-2xl p-4 flex items-center gap-4",children:[r.jsx("span",{className:"text-sm text-slate-400 hidden md:inline",children:"Unsaved changes"}),r.jsxs("div",{className:"flex gap-3 flex-1 md:flex-initial",children:[r.jsx(Xe,{variant:"ghost",onClick:L,disabled:o,className:"flex-1 md:flex-initial",children:"Reset"}),r.jsx(Xe,{variant:"primary",onClick:V,loading:o,icon:Yl,className:"flex-1 md:flex-initial",children:"Save Changes"})]})]})})]})}function Jv(){let{data:n,isLoading:u,error:c,refetch:o}=Zv(),h=Xv(),{addToast:v}=Zl(),g=m.useCallback((y,b)=>{h.mutate(y,{onSuccess:()=>{b(),v("Settings saved successfully!","success")},onError:p=>{v(`Failed to save settings: ${p.message}`,"error")}})},[h,v]);return u?r.jsxs("div",{className:"space-y-6",children:[r.jsxs("div",{children:[r.jsx(ut,{variant:"heading",className:"w-32 mb-2"}),r.jsx(ut,{variant:"text",className:"w-64"})]}),r.jsx(ut,{variant:"text",className:"w-96 h-10"}),r.jsx(Vl,{})]}):c?r.jsxs("div",{className:"space-y-6",children:[r.jsxs("div",{children:[r.jsx("h1",{className:"text-2xl font-bold text-white",children:"Settings"}),r.jsx("p",{className:"text-slate-400 mt-1",children:"Configure your Vizzly local development server"})]}),r.jsxs(hu,{variant:"danger",title:"Failed to load settings",dismissible:!0,onDismiss:()=>o(),children:[c.message,r.jsx(Xe,{variant:"danger",size:"sm",onClick:()=>o(),className:"mt-3",children:"Retry"})]})]}):r.jsxs("div",{className:"space-y-6 pb-24",children:[r.jsxs("div",{children:[r.jsx("h1",{className:"text-2xl font-bold text-white",children:"Settings"}),r.jsx("p",{className:"text-slate-400 mt-1",children:"Configure your Vizzly local development server"})]}),r.jsx(Kv,{config:n?.config,sources:n?.sources,onSave:g,isSaving:h.isPending},JSON.stringify(n?.config))]})}function Ho(){return ma({queryKey:Te.authStatus(),queryFn:hi.getStatus,staleTime:30*1e3})}function $v(){return Qt({mutationFn:hi.initiateLogin})}function Fv(){let n=Lt();return Qt({mutationFn:u=>hi.pollAuthorization(u),onSuccess:u=>{u.status==="complete"&&(n.invalidateQueries({queryKey:Te.auth}),n.invalidateQueries({queryKey:Te.cloud}))}})}function Wv(){let n=Lt();return Qt({mutationFn:hi.logout,onSuccess:()=>{n.invalidateQueries({queryKey:Te.auth}),n.invalidateQueries({queryKey:Te.cloud})}})}function Iv(n={}){return ma({queryKey:Te.projects(),queryFn:mi.list,staleTime:60*1e3,...n})}function Pv(n,u,c={}){return ma({queryKey:Te.builds(n,u),queryFn:()=>mi.getBuilds(n,u,{limit:20}),enabled:!!(n&&u),staleTime:30*1e3,...c})}function e1(){let n=Lt();return Qt({mutationFn:({buildId:u,organizationSlug:c,projectSlug:o})=>un.downloadBaselines(u,c,o),onSuccess:()=>{n.invalidateQueries({queryKey:Te.tdd})}})}function t1(n={}){return ma({queryKey:[...Te.projects(),"mappings"],queryFn:mi.listMappings,staleTime:60*1e3,...n})}function l1(){let n=Lt();return Qt({mutationFn:u=>mi.deleteMapping(u),onSuccess:()=>{n.invalidateQueries({queryKey:Te.projects()})}})}function a1({onComplete:n}){let[u,c]=m.useState(null),[o,h]=m.useState(null),v=$v(),g=Fv(),{addToast:y}=Zl();m.useEffect(()=>{async function p(){try{let N=await v.mutateAsync();c(N)}catch(N){h(N.message),y(`Failed to start login: ${N.message}`,"error")}}p()},[]);async function b(){if(u?.deviceCode){h(null);try{let p=await g.mutateAsync(u.deviceCode);p.status==="complete"?(y("Login successful!","success"),n?.()):p.status==="pending"?y("Still waiting for authorization...","info"):h("Unexpected response from server")}catch(p){h(p.message),y(`Check failed: ${p.message}`,"error")}}}return o?r.jsx(hu,{variant:"danger",title:"Login Error",children:o}):u?r.jsx(lt,{hover:!1,children:r.jsxs(nt,{className:"text-center py-8",children:[r.jsx("h3",{className:"text-xl font-semibold text-white mb-6",children:"Sign in to Vizzly"}),r.jsxs("div",{className:"bg-slate-900/50 rounded-xl p-6 mb-6 border border-slate-700/50 max-w-sm mx-auto",children:[r.jsx("p",{className:"text-sm text-slate-400 mb-4",children:"Click below to authorize:"}),r.jsx("a",{href:u.verificationUriComplete||u.verificationUri,target:"_blank",rel:"noopener noreferrer",className:"inline-flex items-center gap-2 px-6 py-3 bg-amber-500 hover:bg-amber-400 text-slate-900 font-medium rounded-lg transition-colors mb-4",children:"Open Authorization Page"}),r.jsxs("div",{className:"mt-4 pt-4 border-t border-slate-700/50",children:[r.jsx("p",{className:"text-xs text-slate-500 mb-2",children:"Or enter this code manually:"}),r.jsx("div",{className:"text-2xl font-mono font-bold text-amber-400 tracking-wider",children:u.userCode})]})]}),r.jsx("p",{className:"text-sm text-slate-400 mb-4",children:"After authorizing in your browser, click the button below to complete sign in."}),r.jsx(Xe,{variant:"secondary",onClick:b,loading:g.isPending,children:"Check Status"})]})}):r.jsxs("div",{className:"flex flex-col items-center justify-center py-12",children:[r.jsx(fn,{size:"lg",className:"text-amber-400 mb-4"}),r.jsx("p",{className:"text-slate-400",children:"Starting login flow..."})]})}function n1(){let[n,u]=m.useState(!1),c=Lt(),{data:o,isLoading:h}=Ho(),v=Wv(),{addToast:g}=Zl(),y=o?.user,b=o?.authenticated,p=m.useCallback(async()=>{try{await v.mutateAsync(),g("Logged out successfully","success")}catch(z){g(`Logout failed: ${z.message}`,"error")}},[v,g]),N=m.useCallback(()=>{u(!1),c.invalidateQueries({queryKey:Te.auth})},[c]);return h?r.jsx(Vl,{}):n?r.jsxs("div",{className:"space-y-4",children:[r.jsx(Xe,{variant:"ghost",size:"sm",onClick:()=>u(!1),children:"← Back"}),r.jsx(a1,{onComplete:N})]}):b?r.jsx(lt,{hover:!1,children:r.jsx(nt,{children:r.jsxs("div",{className:"flex items-start justify-between",children:[r.jsxs("div",{className:"flex items-start gap-4",children:[r.jsx("div",{className:"w-12 h-12 bg-amber-500 rounded-full flex items-center justify-center",children:r.jsx(fu,{className:"w-7 h-7 text-slate-900"})}),r.jsxs("div",{children:[r.jsx("h3",{className:"text-lg font-semibold text-white",children:y?.name||"User"}),r.jsx("p",{className:"text-sm text-slate-400",children:y?.email}),y?.organizationName&&r.jsx(on,{variant:"default",className:"mt-2",children:y.organizationName})]})]}),r.jsx(Xe,{variant:"ghost",onClick:p,loading:v.isPending,icon:mg,children:"Sign Out"})]})})}):r.jsx(lt,{hover:!1,children:r.jsxs(nt,{className:"text-center py-12",children:[r.jsx("div",{className:"w-16 h-16 rounded-2xl bg-slate-700/50 flex items-center justify-center mx-auto mb-4",children:r.jsx(fu,{className:"w-8 h-8 text-slate-400"})}),r.jsx("h3",{className:"text-lg font-semibold text-white mb-2",children:"Not signed in"}),r.jsx("p",{className:"text-slate-400 mb-6 max-w-sm mx-auto",children:"Sign in to access projects and team features"}),r.jsx(Xe,{variant:"primary",onClick:()=>u(!0),icon:Ro,children:"Sign In"})]})})}function i1({mappings:n,onDelete:u,deleting:c}){let{addToast:o,confirm:h}=Zl(),v=m.useCallback(async g=>{if(await h(`Remove project mapping for ${g}?`,"This will not delete any files, only the project association."))try{await u(g),o("Mapping removed successfully","success")}catch(b){o(`Failed to remove mapping: ${b.message}`,"error")}},[u,o,h]);return n.length===0?r.jsx(ya,{icon:cn,title:"No project mappings",description:"Link a directory to a Vizzly project using the CLI.",action:r.jsx("div",{className:"bg-slate-900/50 border border-slate-700/50 rounded-lg p-4 max-w-md mx-auto",children:r.jsx("code",{className:"text-sm text-amber-400 font-mono",children:"vizzly project:select"})})}):r.jsx("div",{className:"overflow-x-auto",children:r.jsxs("table",{className:"vz-table",children:[r.jsx("thead",{children:r.jsxs("tr",{children:[r.jsx("th",{children:"Directory"}),r.jsx("th",{children:"Project"}),r.jsx("th",{children:"Organization"}),r.jsx("th",{className:"text-right",children:"Actions"})]})}),r.jsx("tbody",{children:n.map((g,y)=>r.jsxs("tr",{children:[r.jsx("td",{className:"font-mono text-sm",children:g.directory}),r.jsx("td",{className:"text-white",children:g.projectName||g.projectSlug}),r.jsx("td",{children:g.organizationSlug}),r.jsx("td",{className:"text-right",children:r.jsx(Xe,{variant:"danger",size:"sm",onClick:()=>v(g.directory),disabled:c,icon:nv,className:"!p-2"})})]},y))})]})})}function s1(){let{data:n,isLoading:u,refetch:c}=t1(),o=l1(),h=n?.mappings||[],v=m.useCallback(async g=>{await o.mutateAsync(g)},[o]);return u?r.jsxs("div",{className:"space-y-6",children:[r.jsxs("div",{children:[r.jsx(ut,{variant:"heading",className:"w-32 mb-2"}),r.jsx(ut,{variant:"text",className:"w-64"})]}),r.jsxs("div",{className:"grid grid-cols-1 lg:grid-cols-3 gap-6",children:[r.jsx("div",{className:"lg:col-span-2",children:r.jsx(Vl,{})}),r.jsx(Vl,{})]}),r.jsx(Vl,{})]}):r.jsxs("div",{className:"space-y-6",children:[r.jsxs("div",{children:[r.jsx("h1",{className:"text-2xl font-bold text-white",children:"Projects"}),r.jsx("p",{className:"text-slate-400 mt-1",children:"Manage your Vizzly account and directory mappings"})]}),r.jsxs("div",{className:"grid grid-cols-1 lg:grid-cols-3 gap-6",children:[r.jsx("div",{className:"lg:col-span-2",children:r.jsx(n1,{})}),r.jsxs(lt,{hover:!1,children:[r.jsx(Gl,{title:"Quick Stats"}),r.jsx(nt,{children:r.jsxs("div",{className:"flex justify-between items-center",children:[r.jsx("span",{className:"text-slate-400",children:"Project Mappings"}),r.jsx("span",{className:"text-2xl font-semibold font-mono text-white",children:h.length})]})})]})]}),r.jsxs(lt,{hover:!1,children:[r.jsx(Gl,{icon:cn,title:"Project Mappings",iconColor:"bg-amber-500/10 text-amber-400",actions:r.jsx(Xe,{variant:"ghost",size:"sm",onClick:()=>c(),icon:fl,children:"Refresh"})}),r.jsx(nt,{padding:"p-0",children:r.jsx(i1,{mappings:h,onDelete:v,deleting:o.isPending})})]})]})}function u1({status:n}){let u={passed:{variant:"success",icon:Yl},completed:{variant:"success",icon:Yl},failed:{variant:"danger",icon:du},pending:{variant:"warning",icon:vi},processing:{variant:"info",icon:fl}},c=u[n]||u.pending;return r.jsx(on,{variant:c.variant,dot:!0,pulseDot:n==="processing",children:n})}function r1(n){let u=Math.floor((new Date-n)/1e3);return u<60?"just now":u<3600?`${Math.floor(u/60)}m ago`:u<86400?`${Math.floor(u/3600)}h ago`:u<604800?`${Math.floor(u/86400)}d ago`:n.toLocaleDateString()}function c1({build:n,project:u,onDownload:c,downloading:o}){let h=new Date(n.createdAt||n.created_at),v=r1(h);return r.jsxs("div",{className:"flex items-center justify-between p-4 vz-card",children:[r.jsxs("div",{className:"flex-1 min-w-0",children:[r.jsxs("div",{className:"flex items-center gap-3",children:[r.jsx("h4",{className:"text-sm font-medium text-white truncate",children:n.name||"Unnamed build"}),r.jsx(u1,{status:n.status})]}),r.jsxs("div",{className:"flex items-center gap-4 mt-2 text-xs text-slate-400",children:[r.jsxs("span",{className:"inline-flex items-center gap-1.5",children:[r.jsx("span",{className:"w-1.5 h-1.5 rounded-full bg-slate-500"}),n.branch||"main"]}),r.jsx("span",{children:v}),n.screenshot_count>0&&r.jsxs("span",{children:[n.screenshot_count," screenshots"]})]})]}),r.jsx(Xe,{variant:"ghost",size:"sm",onClick:()=>c(n,u),loading:o,icon:dg,title:"Download baselines from this build"})]})}function o1({project:n,onExpand:u,expanded:c,onDownload:o,downloadingBuildId:h}){let{data:v,isLoading:g}=Pv(c?n.organizationSlug:null,c?n.slug:null),y=v?.builds||[];return r.jsxs(lt,{hover:!1,children:[r.jsxs("button",{onClick:()=>u(n.organizationSlug,n.slug),className:"w-full flex items-center justify-between p-5 text-left hover:bg-white/[0.02] transition-colors",children:[r.jsxs("div",{className:"flex items-center gap-4",children:[r.jsx("div",{className:"w-10 h-10 rounded-lg bg-amber-500/10 flex items-center justify-center",children:r.jsx(cn,{className:"w-5 h-5 text-amber-400"})}),r.jsxs("div",{children:[r.jsx("h3",{className:"text-base font-semibold text-white",children:n.name||n.slug}),r.jsxs("p",{className:"text-sm text-slate-400 mt-0.5",children:[n.organizationSlug," / ",n.slug]})]})]}),r.jsxs("div",{className:"flex items-center gap-3",children:[g&&r.jsx(fn,{size:"sm",className:"text-amber-400"}),c?r.jsx(uu,{className:"w-5 h-5 text-slate-400"}):r.jsx(ru,{className:"w-5 h-5 text-slate-400"})]})]}),c&&r.jsx(nt,{padding:"p-4",className:"bg-slate-900/30 border-t border-slate-700/50",children:g?r.jsxs("div",{className:"flex flex-col items-center justify-center py-8",children:[r.jsx(fn,{size:"md",className:"text-amber-400 mb-3"}),r.jsx("p",{className:"text-sm text-slate-400",children:"Loading builds..."})]}):y&&y.length>0?r.jsx("div",{className:"space-y-3",children:y.map((b,p)=>r.jsx(c1,{build:b,project:n,onDownload:o,downloading:h===b.id},b.id||p))}):r.jsx(ya,{icon:vi,title:"No builds yet",description:r.jsxs(r.Fragment,{children:["Run ",r.jsx("code",{className:"text-amber-400",children:"vizzly run"})," to create your first build"]})})})]})}function f1({org:n,expandedProjects:u,onExpand:c,onDownload:o,downloadingBuildId:h}){return r.jsxs("div",{className:"space-y-4",children:[r.jsxs("div",{className:"flex items-center gap-3",children:[r.jsx("div",{className:"w-8 h-8 rounded-lg bg-slate-700/50 flex items-center justify-center",children:r.jsx(Ng,{className:"w-4 h-4 text-slate-400"})}),r.jsx("h2",{className:"text-lg font-semibold text-white",children:n.name}),r.jsxs(on,{variant:"default",children:[n.projects.length," project",n.projects.length!==1?"s":""]})]}),r.jsx("div",{className:"space-y-3 pl-11",children:n.projects.map(v=>{let g=`${v.organizationSlug}/${v.slug}`;return r.jsx(o1,{project:v,expanded:u[g],onExpand:c,onDownload:o,downloadingBuildId:h},g)})})]})}function d1({onLogin:n}){return r.jsx(lt,{hover:!1,children:r.jsxs(nt,{className:"text-center py-12",children:[r.jsx("div",{className:"w-16 h-16 rounded-2xl bg-slate-700/50 flex items-center justify-center mx-auto mb-4",children:r.jsx(fu,{className:"w-8 h-8 text-slate-400"})}),r.jsx("h3",{className:"text-xl font-semibold text-white mb-2",children:"Sign in required"}),r.jsx("p",{className:"text-slate-400 mb-6 max-w-md mx-auto",children:"Sign in to your Vizzly account to browse your projects and download baselines from cloud builds."}),r.jsx(Xe,{variant:"primary",onClick:n,icon:Ro,children:"Sign In"})]})})}function h1(){let[n,u]=m.useState({}),[c,o]=m.useState(null),{addToast:h}=Zl(),{data:v,isLoading:g}=Ho(),{data:y,isLoading:b,refetch:p}=Iv(),N=e1(),z=v?.authenticated,L=m.useMemo(()=>{let H=y?.projects||[],q={};for(let $ of H){let k=$.organizationSlug||"unknown";q[k]||(q[k]={slug:k,name:$.organizationName||k,projects:[]}),q[k].projects.push($)}return Object.values(q)},[y?.projects]),V=m.useCallback((H,q)=>{let $=`${H}/${q}`;u(k=>({...k,[$]:!k[$]}))},[]),B=m.useCallback((H,q)=>{o(H.id),N.mutate({buildId:H.id,organizationSlug:q?.organizationSlug,projectSlug:q?.slug},{onSuccess:()=>{h(`Baselines downloaded from "${H.name||H.id}"`,"success"),o(null)},onError:$=>{h(`Failed to download baselines: ${$.message}`,"error"),o(null)}})},[N,h]),M=m.useCallback(()=>{window.location.href="/projects"},[]);return b||g?r.jsxs("div",{className:"space-y-6",children:[r.jsxs("div",{className:"flex items-center justify-between",children:[r.jsxs("div",{children:[r.jsx(ut,{variant:"heading",className:"w-40 mb-2"}),r.jsx(ut,{variant:"text",className:"w-72"})]}),r.jsx(ut,{variant:"button"})]}),r.jsx(Vl,{}),r.jsx(Vl,{})]}):r.jsxs("div",{className:"space-y-6",children:[r.jsxs("div",{className:"flex items-center justify-between",children:[r.jsxs("div",{children:[r.jsx("h1",{className:"text-2xl font-bold text-white",children:"Remote Builds"}),r.jsx("p",{className:"text-slate-400 mt-1",children:"Browse your cloud builds and download baselines for local TDD"})]}),r.jsx(Xe,{variant:"secondary",onClick:()=>p(),icon:fl,children:"Refresh"})]}),z?L.length===0?r.jsx(lt,{hover:!1,children:r.jsx(nt,{children:r.jsx(ya,{icon:cn,title:"No projects found",description:"You don't have any Vizzly projects yet. Create a project in the Vizzly dashboard to get started.",action:r.jsx("a",{href:"https://app.vizzly.dev",target:"_blank",rel:"noopener noreferrer",className:"inline-flex items-center gap-2",children:r.jsx(Xe,{variant:"secondary",icon:ru,iconPosition:"right",children:"Open Vizzly Dashboard"})})})})}):r.jsx("div",{className:"space-y-8",children:L.map(H=>r.jsx(f1,{org:H,expandedProjects:n,onExpand:V,onDownload:B,downloadingBuildId:c},H.slug))}):r.jsx(d1,{onLogin:M})]})}function m1(n,u){let c=[];if(u==="shell")return n.split(`
28
+ `,backgroundSize:"16px 16px",backgroundPosition:"0 0, 0 8px, 8px -8px, -8px 0px",backgroundColor:"#111827"},children:[r.jsx("div",{className:`relative ${k.allowsOverflow?"flex justify-center items-start":"min-w-full min-h-full flex justify-center items-center"}`,style:{...k.allowsOverflow?{minWidth:M.width*k.scale+40,minHeight:M.height*k.scale+40,padding:"20px"}:{zoom:k.scale,padding:"20px"}},children:r.jsx("div",{ref:$,className:"relative inline-block",style:k.allowsOverflow?{transform:`scale(${k.scale})`,transformOrigin:"top center"}:{},children:u==="toggle"&&de.baseline?r.jsx(Bv,{baselineImageUrl:de.baseline,currentImageUrl:de.current,screenshot:K,onImageError:ne,onImageLoad:xe,imageErrors:p}):u==="onion-skin"&&de.baseline?r.jsx(Hv,{baselineImageUrl:de.baseline,currentImageUrl:de.current,sliderPosition:o,onSliderChange:h,screenshot:K,onImageError:ne,onImageLoad:xe,imageErrors:p}):r.jsx(qv,{baselineImageUrl:de.baseline,currentImageUrl:de.current,diffImageUrl:de.diff,showDiffOverlay:c,screenshot:K,onImageError:ne,onImageLoad:xe,imageErrors:p,onDiffToggle:v})})}),!g&&!z.has(`current-${K?.id}`)&&r.jsx("div",{className:"absolute inset-0 bg-gray-700 animate-pulse flex items-center justify-center",children:r.jsx("div",{className:"text-gray-400",children:"Loading..."})}),p.has(`current-${K?.id}`)&&r.jsx("div",{className:"absolute inset-0 bg-gray-700 flex items-center justify-center",children:r.jsxs("div",{className:"text-center text-gray-400",children:[r.jsx(dl,{className:"w-8 h-8 mx-auto mb-2"}),r.jsx("div",{className:"text-sm",children:"Failed to load image"})]})})]})})}function pa(n){return n?.id||n?.signature||n?.name}function kv({zoom:n,onZoomChange:u}){let c=m.useCallback(()=>{u(n==="fit"?.75:Math.min(3,n+.25))},[n,u]),o=m.useCallback(()=>{u(n==="fit"?.5:Math.max(.1,n-.25))},[n,u]),h=m.useCallback(()=>{u("fit")},[u]),v=m.useCallback(()=>{u(1)},[u]),g=n==="fit"?"Fit":`${Math.round(n*100)}%`;return r.jsxs("div",{className:"flex items-center gap-2",children:[r.jsxs("div",{className:"flex items-center bg-gray-800/90 backdrop-blur-md rounded-lg border border-gray-600/40 shadow-lg",children:[r.jsx("button",{onClick:o,className:"p-2 text-gray-300 hover:text-white hover:bg-gray-700/60 rounded-l-lg transition-colors",title:"Zoom out (−)",children:r.jsx(Jg,{className:"w-4 h-4"})}),r.jsx("div",{className:"px-3 py-1.5 min-w-[60px] text-center text-sm font-medium text-gray-200",children:g}),r.jsx("button",{onClick:c,className:"p-2 text-gray-300 hover:text-white hover:bg-gray-700/60 rounded-r-lg transition-colors",title:"Zoom in (+)",children:r.jsx(Fg,{className:"w-4 h-4"})})]}),r.jsx("button",{onClick:h,className:`p-2 rounded-lg transition-colors ${n==="fit"?"bg-blue-600/30 text-blue-400 border border-blue-500/40":"bg-gray-800/90 text-gray-300 hover:text-white hover:bg-gray-700/60 border border-gray-600/40"}`,title:"Fit to screen",children:r.jsx(pg,{className:"w-4 h-4"})}),r.jsx("button",{onClick:v,className:`p-2 rounded-lg transition-colors ${n===1?"bg-blue-600/30 text-blue-400 border border-blue-500/40":"bg-gray-800/90 text-gray-300 hover:text-white hover:bg-gray-700/60 border border-gray-600/40"}`,title:"Actual size",children:r.jsx("span",{className:"text-xs font-bold w-4 h-4 flex items-center justify-center",children:"1:1"})})]})}function Yv({comparison:n,isActive:u,onClick:c,index:o}){let h=n.current||n.baseline,v=n.status==="failed",g=n.status==="new"||n.status==="baseline-created";return r.jsxs("button",{onClick:c,className:`relative flex-shrink-0 group transition-all duration-200 ${u?"ring-2 ring-blue-500 ring-offset-2 ring-offset-gray-900 rounded-lg scale-110":"hover:ring-2 hover:ring-gray-500 hover:ring-offset-2 hover:ring-offset-gray-900 rounded-lg opacity-60 hover:opacity-100"}`,title:n.name||`Screenshot ${o+1}`,children:[r.jsxs("div",{className:"relative w-14 h-20 bg-gray-800 rounded-lg overflow-hidden",children:[h?r.jsx("img",{src:h,alt:n.name||"Thumbnail",className:"absolute inset-0 w-full h-full object-cover object-top",loading:"lazy"}):r.jsx("div",{className:"absolute inset-0 bg-gradient-to-br from-gray-800 to-gray-700 flex items-center justify-center",children:r.jsx("span",{className:"text-lg font-medium text-gray-500",children:n.name?n.name.charAt(0).toUpperCase():"?"})}),g&&r.jsx("div",{className:"absolute bottom-1 left-1 px-1 py-0.5 bg-blue-600/90 rounded text-[9px] font-bold text-white shadow-sm",children:"NEW"}),v&&!g&&r.jsx("div",{className:"absolute bottom-1 left-1 px-1 py-0.5 bg-amber-600/90 rounded text-[9px] font-bold text-white shadow-sm",children:"DIFF"})]}),r.jsx("div",{className:"absolute bottom-full left-1/2 -translate-x-1/2 mb-2 px-2 py-1 bg-gray-800 border border-gray-700 text-xs text-gray-200 rounded whitespace-nowrap opacity-0 group-hover:opacity-100 transition-opacity pointer-events-none z-20 shadow-lg",children:n.name||`Screenshot ${o+1}`})]})}function Gv({comparison:n,comparisons:u=[],onClose:c,onAccept:o,onReject:h,onNavigate:v,userAction:g}){let[y,b]=m.useState(hn.OVERLAY),[p,N]=m.useState(!1),[z,L]=m.useState("fit"),[V,B]=m.useState(!0),[M,H]=m.useState(50),q=m.useRef(null),$=m.useMemo(()=>{let J={failed:0,new:1,"baseline-created":1,passed:2};return[...u].sort((oe,Ge)=>{let Ke=oe.initialStatus||oe.status,T=Ge.initialStatus||Ge.status,Q=J[Ke]??3,W=J[T]??3;return Q-W})},[u]),k=m.useMemo(()=>{let J=pa(n);return $.findIndex((oe,Ge)=>pa(oe)===J)},[n,$]),ne=m.useMemo(()=>({prev:k>0,next:k<$.length-1}),[k,$.length]),xe=m.useCallback(()=>{ne.prev&&$[k-1]&&v($[k-1])},[ne.prev,$,k,v]),de=m.useCallback(()=>{ne.next&&$[k+1]&&v($[k+1])},[ne.next,$,k,v]);if(m.useEffect(()=>{if(q.current&&k>=0){let J=q.current,oe=J.children;if(oe[k]){let Ge=oe[k],Ke=J.getBoundingClientRect(),T=Ge.getBoundingClientRect();(T.left<Ke.left||T.right>Ke.right)&&Ge.scrollIntoView({behavior:"smooth",block:"nearest",inline:"center"})}}},[k]),m.useEffect(()=>{let J=oe=>{if(!(oe.target.tagName==="INPUT"||oe.target.tagName==="TEXTAREA"))switch(oe.key){case"ArrowLeft":oe.preventDefault(),ne.prev&&xe();break;case"ArrowRight":oe.preventDefault(),ne.next&&de();break;case"Escape":oe.preventDefault(),c();break}};return window.addEventListener("keydown",J),()=>window.removeEventListener("keydown",J)},[ne,xe,de,c]),!n)return r.jsx("div",{className:"fixed inset-0 bg-gray-900 z-50 flex items-center justify-center",children:r.jsxs("div",{className:"text-center",children:[r.jsx("div",{className:"text-lg text-white font-medium mb-2",children:"Comparison not found"}),r.jsx("button",{onClick:c,className:"text-blue-400 hover:text-blue-300 font-medium transition-colors",children:"Return to list"})]})});let K=n.status==="failed"||n.status==="passed",ee=g==="accepted"||n.status==="passed"&&g!=="rejected",ve=g==="rejected",Me=[{value:hn.OVERLAY,label:"Overlay"},{value:hn.TOGGLE,label:"Toggle"},{value:hn.ONION,label:"Slide"}],he=[];return n.properties?.browser&&he.push({key:"Browser",value:n.properties.browser}),n.properties?.viewport_width&&n.properties?.viewport_height&&he.push({key:"Viewport",value:`${n.properties.viewport_width}×${n.properties.viewport_height}`}),n.properties?.device&&he.push({key:"Device",value:n.properties.device}),r.jsxs("div",{className:"fixed inset-0 bg-gray-900 z-50 flex flex-col","data-testid":"fullscreen-viewer",children:[r.jsxs("div",{className:"flex-shrink-0 bg-gray-900/95 backdrop-blur-md border-b border-gray-800/50 z-30",children:[r.jsxs("div",{className:"px-4 py-2.5 flex items-center justify-between gap-2",children:[r.jsxs("div",{className:"flex items-center gap-3 min-w-0",children:[r.jsx("button",{onClick:c,className:"p-1.5 text-gray-400 hover:text-white rounded-lg hover:bg-gray-700/60 transition-colors",title:"Back (Esc)",children:r.jsx(yi,{className:"w-5 h-5"})}),r.jsxs("div",{className:"flex items-center gap-1",children:[r.jsx("button",{onClick:xe,disabled:!ne.prev,className:"p-1.5 text-gray-400 hover:text-white disabled:opacity-30 disabled:cursor-not-allowed rounded-lg hover:bg-gray-700/60 transition-colors",title:"Previous (←)",children:r.jsx(Dg,{className:"w-4 h-4"})}),r.jsxs("span",{className:"text-xs text-gray-500 font-medium tabular-nums min-w-[3rem] text-center",children:[k+1,"/",$.length]}),r.jsx("button",{onClick:de,disabled:!ne.next,className:"p-1.5 text-gray-400 hover:text-white disabled:opacity-30 disabled:cursor-not-allowed rounded-lg hover:bg-gray-700/60 transition-colors",title:"Next (→)",children:r.jsx(ru,{className:"w-4 h-4"})})]}),r.jsx("div",{className:"h-5 w-px bg-gray-700/50"}),r.jsx("h1",{className:"text-sm font-medium text-gray-200 truncate max-w-[300px]",children:n.name||n.originalName||"Unknown"}),he.length>0&&r.jsxs("button",{onClick:()=>N(!p),className:"flex items-center gap-1 px-2 py-1 text-xs text-gray-500 hover:text-gray-300 transition-colors",children:[r.jsxs("span",{children:[he.length," props"]}),r.jsx(uu,{className:`w-3 h-3 transition-transform ${p?"rotate-180":""}`})]})]}),K&&r.jsxs("div",{className:"flex items-center bg-gray-800/60 rounded-lg p-0.5 border border-gray-700/50",children:[r.jsxs("button",{onClick:()=>h(pa(n)),className:`flex items-center gap-1 px-3 py-1.5 text-xs font-medium rounded-md transition-all ${ve?"bg-red-600 text-white":"text-red-400 hover:text-red-300 hover:bg-red-600/20"}`,children:[r.jsx("span",{className:"w-1.5 h-1.5 bg-current rounded-full"}),"Reject"]}),r.jsxs("button",{onClick:()=>o(pa(n)),className:`flex items-center gap-1 px-3 py-1.5 text-xs font-medium rounded-md transition-all ${ee?"bg-green-600 text-white":"text-green-400 hover:text-green-300 hover:bg-green-600/20"}`,children:[r.jsx("span",{className:"w-1.5 h-1.5 bg-current rounded-full"}),"Approve"]})]}),r.jsxs("div",{className:"flex items-center gap-2",children:[r.jsx(kv,{zoom:z,onZoomChange:L}),r.jsx("div",{className:"hidden sm:flex items-center bg-gray-800/60 rounded-lg p-0.5 border border-gray-700/50",children:Me.map(J=>r.jsx("button",{onClick:()=>n.diff&&b(J.value),disabled:!n.diff,className:`px-2.5 py-1 text-xs font-medium rounded-md transition-all ${n.diff?y===J.value?"bg-blue-600 text-white":"text-gray-400 hover:text-white hover:bg-gray-700/60":"text-gray-600 cursor-not-allowed"}`,children:J.label},J.value))})]})]}),p&&he.length>0&&r.jsx("div",{className:"px-4 py-2 border-t border-gray-800/50 bg-gray-900/50",children:r.jsx("div",{className:"flex flex-wrap gap-2",children:he.map((J,oe)=>r.jsxs("span",{className:"inline-flex items-center px-2 py-0.5 bg-gray-800/60 text-xs rounded-md",children:[r.jsxs("span",{className:"text-gray-500",children:[J.key,":"]}),r.jsx("span",{className:"ml-1 text-gray-300",children:J.value})]},oe))})})]}),r.jsx("div",{className:"flex-1 min-h-0 overflow-hidden",children:r.jsx(Qv,{comparison:n,viewMode:y===hn.ONION?"onion-skin":y,showDiffOverlay:V,onDiffToggle:()=>B(J=>!J),onionSkinPosition:M,onOnionSkinChange:H,zoom:z,disableLoadingOverlay:!0,className:"w-full h-full"},pa(n))}),r.jsx("div",{className:"flex-shrink-0 bg-gray-900 border-t border-gray-800/50",children:r.jsx("div",{className:"px-4 py-3",children:r.jsxs("div",{className:"flex items-center gap-4",children:[r.jsxs("div",{className:"text-sm text-gray-500 flex-shrink-0",children:[k+1," of ",$.length]}),r.jsx("div",{ref:q,className:"flex-1 flex items-center gap-2 overflow-x-auto scrollbar-hide py-1",children:$.map((J,oe)=>r.jsx(Yv,{comparison:J,index:oe,isActive:oe===k,onClick:()=>v(J)},pa(J)))}),r.jsxs("div",{className:"hidden md:flex items-center gap-3 text-xs text-gray-500 flex-shrink-0",children:[r.jsxs("span",{children:["Use"," ",r.jsx("kbd",{className:"px-1 py-0.5 bg-gray-800 rounded text-gray-400",children:"←"})," ",r.jsx("kbd",{className:"px-1 py-0.5 bg-gray-800 rounded text-gray-400",children:"→"})," ","to navigate"]}),r.jsx(uu,{className:"w-4 h-4 rotate-[-90deg]"})]})]})})})]})}function Vv(){let[,n]=di(),[,u]=lg("/comparison/:id"),[c,o]=m.useState({}),{data:h}=gi(),v=sg(),g=rg(),y=m.useMemo(()=>h?.comparisons||[],[h?.comparisons]),b=m.useMemo(()=>{let B=u?.id?decodeURIComponent(u.id):null;return!B||y.length===0?null:y.find(M=>M.id===B||M.signature===B||M.name===B)},[u,y]),p=m.useCallback(B=>{let M=B.id||B.signature||B.name;M&&n(`/comparison/${encodeURIComponent(M)}`)},[n]),N=m.useCallback(()=>{n("/")},[n]),z=m.useMemo(()=>b?b.id||b.signature||b.name:null,[b]),L=m.useCallback(B=>{o(M=>({...M,[B]:"accepting"})),v.mutate(B,{onSettled:()=>{o(M=>({...M,[B]:void 0}))}})},[v]),V=m.useCallback(B=>{o(M=>({...M,[B]:"rejecting"})),g.mutate(B,{onSettled:()=>{o(M=>({...M,[B]:void 0}))}})},[g]);return b?r.jsx(Gv,{comparison:b,comparisons:y,onClose:N,onAccept:L,onReject:V,onNavigate:p,userAction:c[z]}):r.jsx("div",{className:"fixed inset-0 bg-gray-900 z-50 flex items-center justify-center",children:r.jsxs("div",{className:"text-center",children:[r.jsx("div",{className:"text-lg text-white font-medium mb-2",children:"Comparison not found"}),r.jsxs("p",{className:"text-sm text-gray-400 mb-4",children:["ID: ",u?.id||"none"]}),r.jsx("button",{onClick:N,className:"text-blue-400 hover:text-blue-300 font-medium transition-colors",children:"Return to list"})]})})}function Zv(n={}){return ma({queryKey:Te.config,queryFn:To.get,...n})}function Xv(){let n=Lt();return Qt({mutationFn:To.updateProject,onSuccess:()=>{n.invalidateQueries({queryKey:Te.config})}})}function qo(n){return{threshold:n?.comparison?.threshold??2,port:n?.server?.port??47392,timeout:n?.server?.timeout??3e4,buildName:n?.build?.name??"Build {timestamp}",environment:n?.build?.environment??"test",openReport:n?.tdd?.openReport??!1}}function mu({source:n}){let u={default:"default",project:"info",global:"purple",env:"success",cli:"warning"},c={default:"Default",project:"Project",global:"Global",env:"Environment",cli:"CLI Flag"};return r.jsx(on,{variant:u[n]||"default",size:"sm",children:c[n]||n})}function Kv({config:n,sources:u,onSave:c,isSaving:o}){let h=qo(n),[v,g]=m.useState(h),[y,b]=m.useState(!1),[p,N]=m.useState("general"),z=m.useCallback((M,H)=>{g(q=>({...q,[M]:H})),b(!0)},[]),L=m.useCallback(()=>{g(qo(n)),b(!1)},[n]),V=m.useCallback(()=>{let M={comparison:{threshold:v.threshold},server:{port:v.port,timeout:v.timeout},build:{name:v.buildName,environment:v.environment},tdd:{openReport:v.openReport}};c(M,()=>b(!1))},[v,c]),B=[{key:"general",label:"General",icon:cu},{key:"server",label:"Server",icon:_o},{key:"build",label:"Build",icon:Uo}];return r.jsxs("div",{className:"space-y-6",children:[r.jsx(mv,{tabs:B,activeTab:p,onChange:N,variant:"default"}),p==="general"&&r.jsxs(lt,{hover:!1,children:[r.jsx(Gl,{icon:cu,title:"General Settings",description:"Configure visual comparison and TDD behavior",iconColor:"bg-amber-500/10 text-amber-400"}),r.jsxs(nt,{className:"space-y-6",children:[r.jsx(pi,{label:"Visual Comparison Threshold",type:"number",value:v.threshold,onChange:M=>z("threshold",parseFloat(M.target.value)),hint:"Percentage of pixel difference allowed before marking as failed (0.0 - 1.0)",step:"0.01",min:"0",max:"1"}),r.jsx(ov,{label:"Auto-open Report",description:"Automatically open the dashboard in your browser when starting TDD mode",checked:v.openReport,onChange:M=>z("openReport",M.target.checked)}),r.jsxs("div",{className:"pt-4 border-t border-slate-700/50 flex items-center gap-2",children:[r.jsx("span",{className:"text-sm text-slate-500",children:"Config source:"}),r.jsx(mu,{source:u?.comparison||"default"})]})]})]}),p==="server"&&r.jsxs(lt,{hover:!1,children:[r.jsx(Gl,{icon:_o,title:"Server Settings",description:"Local screenshot server configuration",iconColor:"bg-blue-500/10 text-blue-400"}),r.jsxs(nt,{className:"space-y-6",children:[r.jsx(pi,{label:"Server Port",type:"number",value:v.port,onChange:M=>z("port",parseInt(M.target.value,10)),hint:"Port for the local screenshot server"}),r.jsx(pi,{label:"Server Timeout",type:"number",value:v.timeout,onChange:M=>z("timeout",parseInt(M.target.value,10)),hint:"Request timeout in milliseconds"}),r.jsxs("div",{className:"pt-4 border-t border-slate-700/50 flex items-center gap-2",children:[r.jsx("span",{className:"text-sm text-slate-500",children:"Config source:"}),r.jsx(mu,{source:u?.server||"default"})]})]})]}),p==="build"&&r.jsxs(lt,{hover:!1,children:[r.jsx(Gl,{icon:Uo,title:"Build Settings",description:"Configure build naming and environment",iconColor:"bg-purple-500/10 text-purple-400"}),r.jsxs(nt,{className:"space-y-6",children:[r.jsx(pi,{label:"Build Name Template",type:"text",value:v.buildName,onChange:M=>z("buildName",M.target.value),hint:"Template for build names (use {timestamp} for current time)"}),r.jsx(cv,{label:"Environment",value:v.environment,onChange:M=>z("environment",M.target.value),hint:"Target environment for builds",options:[{value:"test",label:"Test"},{value:"development",label:"Development"},{value:"staging",label:"Staging"},{value:"production",label:"Production"}]}),r.jsxs("div",{className:"pt-4 border-t border-slate-700/50 flex items-center gap-2",children:[r.jsx("span",{className:"text-sm text-slate-500",children:"Config source:"}),r.jsx(mu,{source:u?.build||"default"})]})]})]}),y&&r.jsx("div",{className:"fixed bottom-6 right-6 left-6 md:left-auto md:w-auto",children:r.jsxs("div",{className:"bg-slate-800 border border-slate-700 rounded-xl shadow-2xl p-4 flex items-center gap-4",children:[r.jsx("span",{className:"text-sm text-slate-400 hidden md:inline",children:"Unsaved changes"}),r.jsxs("div",{className:"flex gap-3 flex-1 md:flex-initial",children:[r.jsx(Xe,{variant:"ghost",onClick:L,disabled:o,className:"flex-1 md:flex-initial",children:"Reset"}),r.jsx(Xe,{variant:"primary",onClick:V,loading:o,icon:Yl,className:"flex-1 md:flex-initial",children:"Save Changes"})]})]})})]})}function Jv(){let{data:n,isLoading:u,error:c,refetch:o}=Zv(),h=Xv(),{addToast:v}=Zl(),g=m.useCallback((y,b)=>{h.mutate(y,{onSuccess:()=>{b(),v("Settings saved successfully!","success")},onError:p=>{v(`Failed to save settings: ${p.message}`,"error")}})},[h,v]);return u?r.jsxs("div",{className:"space-y-6",children:[r.jsxs("div",{children:[r.jsx(ut,{variant:"heading",className:"w-32 mb-2"}),r.jsx(ut,{variant:"text",className:"w-64"})]}),r.jsx(ut,{variant:"text",className:"w-96 h-10"}),r.jsx(Vl,{})]}):c?r.jsxs("div",{className:"space-y-6",children:[r.jsxs("div",{children:[r.jsx("h1",{className:"text-2xl font-bold text-white",children:"Settings"}),r.jsx("p",{className:"text-slate-400 mt-1",children:"Configure your Vizzly local development server"})]}),r.jsxs(hu,{variant:"danger",title:"Failed to load settings",dismissible:!0,onDismiss:()=>o(),children:[c.message,r.jsx(Xe,{variant:"danger",size:"sm",onClick:()=>o(),className:"mt-3",children:"Retry"})]})]}):r.jsxs("div",{className:"space-y-6 pb-24",children:[r.jsxs("div",{children:[r.jsx("h1",{className:"text-2xl font-bold text-white",children:"Settings"}),r.jsx("p",{className:"text-slate-400 mt-1",children:"Configure your Vizzly local development server"})]}),r.jsx(Kv,{config:n?.config,sources:n?.sources,onSave:g,isSaving:h.isPending},JSON.stringify(n?.config))]})}function Ho(){return ma({queryKey:Te.authStatus(),queryFn:hi.getStatus,staleTime:30*1e3})}function $v(){return Qt({mutationFn:hi.initiateLogin})}function Fv(){let n=Lt();return Qt({mutationFn:u=>hi.pollAuthorization(u),onSuccess:u=>{u.status==="complete"&&(n.invalidateQueries({queryKey:Te.auth}),n.invalidateQueries({queryKey:Te.cloud}))}})}function Wv(){let n=Lt();return Qt({mutationFn:hi.logout,onSuccess:()=>{n.invalidateQueries({queryKey:Te.auth}),n.invalidateQueries({queryKey:Te.cloud})}})}function Iv(n={}){return ma({queryKey:Te.projects(),queryFn:mi.list,staleTime:60*1e3,...n})}function Pv(n,u,c={}){return ma({queryKey:Te.builds(n,u),queryFn:()=>mi.getBuilds(n,u,{limit:20}),enabled:!!(n&&u),staleTime:30*1e3,...c})}function e1(){let n=Lt();return Qt({mutationFn:({buildId:u,organizationSlug:c,projectSlug:o})=>un.downloadBaselines(u,c,o),onSuccess:()=>{n.invalidateQueries({queryKey:Te.tdd})}})}function t1(n={}){return ma({queryKey:[...Te.projects(),"mappings"],queryFn:mi.listMappings,staleTime:60*1e3,...n})}function l1(){let n=Lt();return Qt({mutationFn:u=>mi.deleteMapping(u),onSuccess:()=>{n.invalidateQueries({queryKey:Te.projects()})}})}function a1({onComplete:n}){let[u,c]=m.useState(null),[o,h]=m.useState(null),v=$v(),g=Fv(),{addToast:y}=Zl();m.useEffect(()=>{async function p(){try{let N=await v.mutateAsync();c(N)}catch(N){h(N.message),y(`Failed to start login: ${N.message}`,"error")}}p()},[]);async function b(){if(u?.deviceCode){h(null);try{let p=await g.mutateAsync(u.deviceCode);p.status==="complete"?(y("Login successful!","success"),n?.()):p.status==="pending"?y("Still waiting for authorization...","info"):h("Unexpected response from server")}catch(p){h(p.message),y(`Check failed: ${p.message}`,"error")}}}return o?r.jsx(hu,{variant:"danger",title:"Login Error",children:o}):u?r.jsx(lt,{hover:!1,children:r.jsxs(nt,{className:"text-center py-8",children:[r.jsx("h3",{className:"text-xl font-semibold text-white mb-6",children:"Sign in to Vizzly"}),r.jsxs("div",{className:"bg-slate-900/50 rounded-xl p-6 mb-6 border border-slate-700/50 max-w-sm mx-auto",children:[r.jsx("p",{className:"text-sm text-slate-400 mb-4",children:"Click below to authorize:"}),r.jsx("a",{href:u.verificationUriComplete||u.verificationUri,target:"_blank",rel:"noopener noreferrer",className:"inline-flex items-center gap-2 px-6 py-3 bg-amber-500 hover:bg-amber-400 text-slate-900 font-medium rounded-lg transition-colors mb-4",children:"Open Authorization Page"}),r.jsxs("div",{className:"mt-4 pt-4 border-t border-slate-700/50",children:[r.jsx("p",{className:"text-xs text-slate-500 mb-2",children:"Or enter this code manually:"}),r.jsx("div",{className:"text-2xl font-mono font-bold text-amber-400 tracking-wider",children:u.userCode})]})]}),r.jsx("p",{className:"text-sm text-slate-400 mb-4",children:"After authorizing in your browser, click the button below to complete sign in."}),r.jsx(Xe,{variant:"secondary",onClick:b,loading:g.isPending,children:"Check Status"})]})}):r.jsxs("div",{className:"flex flex-col items-center justify-center py-12",children:[r.jsx(fn,{size:"lg",className:"text-amber-400 mb-4"}),r.jsx("p",{className:"text-slate-400",children:"Starting login flow..."})]})}function n1(){let[n,u]=m.useState(!1),c=Lt(),{data:o,isLoading:h}=Ho(),v=Wv(),{addToast:g}=Zl(),y=o?.user,b=o?.authenticated,p=m.useCallback(async()=>{try{await v.mutateAsync(),g("Logged out successfully","success")}catch(z){g(`Logout failed: ${z.message}`,"error")}},[v,g]),N=m.useCallback(()=>{u(!1),c.invalidateQueries({queryKey:Te.auth})},[c]);return h?r.jsx(Vl,{}):n?r.jsxs("div",{className:"space-y-4",children:[r.jsx(Xe,{variant:"ghost",size:"sm",onClick:()=>u(!1),children:"← Back"}),r.jsx(a1,{onComplete:N})]}):b?r.jsx(lt,{hover:!1,children:r.jsx(nt,{children:r.jsxs("div",{className:"flex items-start justify-between",children:[r.jsxs("div",{className:"flex items-start gap-4",children:[r.jsx("div",{className:"w-12 h-12 bg-amber-500 rounded-full flex items-center justify-center",children:r.jsx(fu,{className:"w-7 h-7 text-slate-900"})}),r.jsxs("div",{children:[r.jsx("h3",{className:"text-lg font-semibold text-white",children:y?.name||"User"}),r.jsx("p",{className:"text-sm text-slate-400",children:y?.email}),y?.organizationName&&r.jsx(on,{variant:"default",className:"mt-2",children:y.organizationName})]})]}),r.jsx(Xe,{variant:"ghost",onClick:p,loading:v.isPending,icon:mg,children:"Sign Out"})]})})}):r.jsx(lt,{hover:!1,children:r.jsxs(nt,{className:"text-center py-12",children:[r.jsx("div",{className:"w-16 h-16 rounded-2xl bg-slate-700/50 flex items-center justify-center mx-auto mb-4",children:r.jsx(fu,{className:"w-8 h-8 text-slate-400"})}),r.jsx("h3",{className:"text-lg font-semibold text-white mb-2",children:"Not signed in"}),r.jsx("p",{className:"text-slate-400 mb-6 max-w-sm mx-auto",children:"Sign in to access projects and team features"}),r.jsx(Xe,{variant:"primary",onClick:()=>u(!0),icon:Ro,children:"Sign In"})]})})}function i1({mappings:n,onDelete:u,deleting:c}){let{addToast:o,confirm:h}=Zl(),v=m.useCallback(async g=>{if(await h(`Remove project mapping for ${g}?`,"This will not delete any files, only the project association."))try{await u(g),o("Mapping removed successfully","success")}catch(b){o(`Failed to remove mapping: ${b.message}`,"error")}},[u,o,h]);return n.length===0?r.jsx(ya,{icon:cn,title:"No project mappings",description:"Link a directory to a Vizzly project using the CLI.",action:r.jsx("div",{className:"bg-slate-900/50 border border-slate-700/50 rounded-lg p-4 max-w-md mx-auto",children:r.jsx("code",{className:"text-sm text-amber-400 font-mono",children:"vizzly project:select"})})}):r.jsx("div",{className:"overflow-x-auto",children:r.jsxs("table",{className:"vz-table",children:[r.jsx("thead",{children:r.jsxs("tr",{children:[r.jsx("th",{children:"Directory"}),r.jsx("th",{children:"Project"}),r.jsx("th",{children:"Organization"}),r.jsx("th",{className:"text-right",children:"Actions"})]})}),r.jsx("tbody",{children:n.map((g,y)=>r.jsxs("tr",{children:[r.jsx("td",{className:"font-mono text-sm",children:g.directory}),r.jsx("td",{className:"text-white",children:g.projectName||g.projectSlug}),r.jsx("td",{children:g.organizationSlug}),r.jsx("td",{className:"text-right",children:r.jsx(Xe,{variant:"danger",size:"sm",onClick:()=>v(g.directory),disabled:c,icon:nv,className:"!p-2"})})]},y))})]})})}function s1(){let{data:n,isLoading:u,refetch:c}=t1(),o=l1(),h=n?.mappings||[],v=m.useCallback(async g=>{await o.mutateAsync(g)},[o]);return u?r.jsxs("div",{className:"space-y-6",children:[r.jsxs("div",{children:[r.jsx(ut,{variant:"heading",className:"w-32 mb-2"}),r.jsx(ut,{variant:"text",className:"w-64"})]}),r.jsxs("div",{className:"grid grid-cols-1 lg:grid-cols-3 gap-6",children:[r.jsx("div",{className:"lg:col-span-2",children:r.jsx(Vl,{})}),r.jsx(Vl,{})]}),r.jsx(Vl,{})]}):r.jsxs("div",{className:"space-y-6",children:[r.jsxs("div",{children:[r.jsx("h1",{className:"text-2xl font-bold text-white",children:"Projects"}),r.jsx("p",{className:"text-slate-400 mt-1",children:"Manage your Vizzly account and directory mappings"})]}),r.jsxs("div",{className:"grid grid-cols-1 lg:grid-cols-3 gap-6",children:[r.jsx("div",{className:"lg:col-span-2",children:r.jsx(n1,{})}),r.jsxs(lt,{hover:!1,children:[r.jsx(Gl,{title:"Quick Stats"}),r.jsx(nt,{children:r.jsxs("div",{className:"flex justify-between items-center",children:[r.jsx("span",{className:"text-slate-400",children:"Project Mappings"}),r.jsx("span",{className:"text-2xl font-semibold font-mono text-white",children:h.length})]})})]})]}),r.jsxs(lt,{hover:!1,children:[r.jsx(Gl,{icon:cn,title:"Project Mappings",iconColor:"bg-amber-500/10 text-amber-400",actions:r.jsx(Xe,{variant:"ghost",size:"sm",onClick:()=>c(),icon:fl,children:"Refresh"})}),r.jsx(nt,{padding:"p-0",children:r.jsx(i1,{mappings:h,onDelete:v,deleting:o.isPending})})]})]})}function u1({status:n}){let u={passed:{variant:"success",icon:Yl},completed:{variant:"success",icon:Yl},failed:{variant:"danger",icon:du},pending:{variant:"warning",icon:vi},processing:{variant:"info",icon:fl}},c=u[n]||u.pending;return r.jsx(on,{variant:c.variant,dot:!0,pulseDot:n==="processing",children:n})}function r1(n){let u=Math.floor((new Date-n)/1e3);return u<60?"just now":u<3600?`${Math.floor(u/60)}m ago`:u<86400?`${Math.floor(u/3600)}h ago`:u<604800?`${Math.floor(u/86400)}d ago`:n.toLocaleDateString()}function c1({build:n,project:u,onDownload:c,downloading:o}){let h=new Date(n.createdAt||n.created_at),v=r1(h);return r.jsxs("div",{className:"flex items-center justify-between p-4 vz-card",children:[r.jsxs("div",{className:"flex-1 min-w-0",children:[r.jsxs("div",{className:"flex items-center gap-3",children:[r.jsx("h4",{className:"text-sm font-medium text-white truncate",children:n.name||"Unnamed build"}),r.jsx(u1,{status:n.status})]}),r.jsxs("div",{className:"flex items-center gap-4 mt-2 text-xs text-slate-400",children:[r.jsxs("span",{className:"inline-flex items-center gap-1.5",children:[r.jsx("span",{className:"w-1.5 h-1.5 rounded-full bg-slate-500"}),n.branch||"main"]}),r.jsx("span",{children:v}),n.screenshot_count>0&&r.jsxs("span",{children:[n.screenshot_count," screenshots"]})]})]}),r.jsx(Xe,{variant:"ghost",size:"sm",onClick:()=>c(n,u),loading:o,icon:dg,title:"Download baselines from this build"})]})}function o1({project:n,onExpand:u,expanded:c,onDownload:o,downloadingBuildId:h}){let{data:v,isLoading:g}=Pv(c?n.organizationSlug:null,c?n.slug:null),y=v?.builds||[];return r.jsxs(lt,{hover:!1,children:[r.jsxs("button",{onClick:()=>u(n.organizationSlug,n.slug),className:"w-full flex items-center justify-between p-5 text-left hover:bg-white/[0.02] transition-colors",children:[r.jsxs("div",{className:"flex items-center gap-4",children:[r.jsx("div",{className:"w-10 h-10 rounded-lg bg-amber-500/10 flex items-center justify-center",children:r.jsx(cn,{className:"w-5 h-5 text-amber-400"})}),r.jsxs("div",{children:[r.jsx("h3",{className:"text-base font-semibold text-white",children:n.name||n.slug}),r.jsxs("p",{className:"text-sm text-slate-400 mt-0.5",children:[n.organizationSlug," / ",n.slug]})]})]}),r.jsxs("div",{className:"flex items-center gap-3",children:[g&&r.jsx(fn,{size:"sm",className:"text-amber-400"}),c?r.jsx(uu,{className:"w-5 h-5 text-slate-400"}):r.jsx(ru,{className:"w-5 h-5 text-slate-400"})]})]}),c&&r.jsx(nt,{padding:"p-4",className:"bg-slate-900/30 border-t border-slate-700/50",children:g?r.jsxs("div",{className:"flex flex-col items-center justify-center py-8",children:[r.jsx(fn,{size:"md",className:"text-amber-400 mb-3"}),r.jsx("p",{className:"text-sm text-slate-400",children:"Loading builds..."})]}):y&&y.length>0?r.jsx("div",{className:"space-y-3",children:y.map((b,p)=>r.jsx(c1,{build:b,project:n,onDownload:o,downloading:h===b.id},b.id||p))}):r.jsx(ya,{icon:vi,title:"No builds yet",description:r.jsxs(r.Fragment,{children:["Run ",r.jsx("code",{className:"text-amber-400",children:"vizzly run"})," to create your first build"]})})})]})}function f1({org:n,expandedProjects:u,onExpand:c,onDownload:o,downloadingBuildId:h}){return r.jsxs("div",{className:"space-y-4",children:[r.jsxs("div",{className:"flex items-center gap-3",children:[r.jsx("div",{className:"w-8 h-8 rounded-lg bg-slate-700/50 flex items-center justify-center",children:r.jsx(Ng,{className:"w-4 h-4 text-slate-400"})}),r.jsx("h2",{className:"text-lg font-semibold text-white",children:n.name}),r.jsxs(on,{variant:"default",children:[n.projects.length," project",n.projects.length!==1?"s":""]})]}),r.jsx("div",{className:"space-y-3 pl-11",children:n.projects.map(v=>{let g=`${v.organizationSlug}/${v.slug}`;return r.jsx(o1,{project:v,expanded:u[g],onExpand:c,onDownload:o,downloadingBuildId:h},g)})})]})}function d1({onLogin:n}){return r.jsx(lt,{hover:!1,children:r.jsxs(nt,{className:"text-center py-12",children:[r.jsx("div",{className:"w-16 h-16 rounded-2xl bg-slate-700/50 flex items-center justify-center mx-auto mb-4",children:r.jsx(fu,{className:"w-8 h-8 text-slate-400"})}),r.jsx("h3",{className:"text-xl font-semibold text-white mb-2",children:"Sign in required"}),r.jsx("p",{className:"text-slate-400 mb-6 max-w-md mx-auto",children:"Sign in to your Vizzly account to browse your projects and download baselines from cloud builds."}),r.jsx(Xe,{variant:"primary",onClick:n,icon:Ro,children:"Sign In"})]})})}function h1(){let[n,u]=m.useState({}),[c,o]=m.useState(null),{addToast:h}=Zl(),{data:v,isLoading:g}=Ho(),{data:y,isLoading:b,refetch:p}=Iv(),N=e1(),z=v?.authenticated,L=m.useMemo(()=>{let H=y?.projects||[],q={};for(let $ of H){let k=$.organizationSlug||"unknown";q[k]||(q[k]={slug:k,name:$.organizationName||k,projects:[]}),q[k].projects.push($)}return Object.values(q)},[y?.projects]),V=m.useCallback((H,q)=>{let $=`${H}/${q}`;u(k=>({...k,[$]:!k[$]}))},[]),B=m.useCallback((H,q)=>{o(H.id),N.mutate({buildId:H.id,organizationSlug:q?.organizationSlug,projectSlug:q?.slug},{onSuccess:()=>{h(`Baselines downloaded from "${H.name||H.id}"`,"success"),o(null)},onError:$=>{h(`Failed to download baselines: ${$.message}`,"error"),o(null)}})},[N,h]),M=m.useCallback(()=>{window.location.href="/projects"},[]);return b||g?r.jsxs("div",{className:"space-y-6",children:[r.jsxs("div",{className:"flex items-center justify-between",children:[r.jsxs("div",{children:[r.jsx(ut,{variant:"heading",className:"w-40 mb-2"}),r.jsx(ut,{variant:"text",className:"w-72"})]}),r.jsx(ut,{variant:"button"})]}),r.jsx(Vl,{}),r.jsx(Vl,{})]}):r.jsxs("div",{className:"space-y-6",children:[r.jsxs("div",{className:"flex items-center justify-between",children:[r.jsxs("div",{children:[r.jsx("h1",{className:"text-2xl font-bold text-white",children:"Remote Builds"}),r.jsx("p",{className:"text-slate-400 mt-1",children:"Browse your cloud builds and download baselines for local TDD"})]}),r.jsx(Xe,{variant:"secondary",onClick:()=>p(),icon:fl,children:"Refresh"})]}),z?L.length===0?r.jsx(lt,{hover:!1,children:r.jsx(nt,{children:r.jsx(ya,{icon:cn,title:"No projects found",description:"You don't have any Vizzly projects yet. Create a project in the Vizzly dashboard to get started.",action:r.jsx("a",{href:"https://app.vizzly.dev",target:"_blank",rel:"noopener noreferrer",className:"inline-flex items-center gap-2",children:r.jsx(Xe,{variant:"secondary",icon:ru,iconPosition:"right",children:"Open Vizzly Dashboard"})})})})}):r.jsx("div",{className:"space-y-8",children:L.map(H=>r.jsx(f1,{org:H,expandedProjects:n,onExpand:V,onDownload:B,downloadingBuildId:c},H.slug))}):r.jsx(d1,{onLogin:M})]})}function m1(n,u){let c=[];if(u==="shell")return n.split(`
29
29
  `).forEach((g,y)=>{let b=n.split(`
30
30
  `).slice(0,y).join(`
31
31
  `).length+(y>0?1:0);g.trim().startsWith("#")?c.push({type:"comment",start:b,end:b+g.length}):(g.trim().startsWith("npm")||g.trim().startsWith("npx"))&&c.push({type:"command",start:b,end:b+g.length})}),c;[{type:"comment",regex:/\/\/.*$/gm},{type:"comment",regex:/\/\*[\s\S]*?\*\//g},{type:"string",regex:/'([^'\\]|\\.)*'/g},{type:"string",regex:/"([^"\\]|\\.)*"/g},{type:"string",regex:/`([^`\\]|\\.)*`/g},{type:"keyword",regex:/\b(import|export|from|const|let|var|function|class|if|else|return|await|async|test|it|describe|expect|func|let|class|import|require|RSpec|do|end|def|Vizzly)\b/g},{type:"function",regex:/\b([a-zA-Z_][a-zA-Z0-9_]*)\s*\(/g},{type:"number",regex:/\b\d+\.?\d*\b/g}].forEach(({type:g,regex:y})=>{let b;for(;(b=y.exec(n))!==null;)c.push({type:g,start:b.index,end:b.index+b[0].length})}),c.sort((g,y)=>g.start-y.start);let h=[],v=0;return c.forEach(g=>{g.start>=v&&(h.push(g),v=g.end)}),h}function g1({code:n,language:u="javascript"}){let c=m.useRef(null),o=u==="shell"||n.trim().startsWith("#")||n.trim().startsWith("npm");return m.useEffect(()=>{if(typeof window>"u"||!window.CSS?.highlights||!c.current)return;let h=c.current.firstChild;if(!h||h.nodeType!==window.Node.TEXT_NODE)return;let g=m1(n,o?"shell":u).map(p=>{let N=new window.Range;return N.setStart(h,p.start),N.setEnd(h,p.end),{type:p.type,range:N}}),y=new Map;g.forEach(({type:p,range:N})=>{y.has(p)||y.set(p,[]),y.get(p).push(N)});let b=new Map;for(let[p,N]of y){let z=new window.Highlight(...N);b.set(p,z),window.CSS.highlights.set(`code-${p}`,z)}return()=>{for(let[p]of b)window.CSS.highlights.delete(`code-${p}`)}},[n,u,o]),r.jsx("pre",{className:"bg-slate-950 rounded-lg p-4 overflow-x-auto text-sm",children:r.jsx("code",{ref:c,className:"font-mono text-slate-300 block whitespace-pre",children:n})})}let Qo=[{id:"playwright",name:"Playwright",code:`import { vizzlyScreenshot } from '@vizzly-testing/cli/client';
@@ -217,7 +217,7 @@ export const createTddHandler = (config, workingDir, baselineBuild, baselineComp
217
217
  }
218
218
 
219
219
  // Unwrap double-nested properties if needed (client SDK wraps options in properties field)
220
- // This happens when test helper passes { properties: {...}, threshold: 0.1 }
220
+ // This happens when test helper passes { properties: {...}, threshold: 2.0 }
221
221
  // and client SDK wraps it as { properties: options }
222
222
  let unwrappedProperties = properties;
223
223
  if (properties.properties && typeof properties.properties === 'object') {
@@ -104,7 +104,7 @@ export class ConfigService {
104
104
  timeout: 30000
105
105
  },
106
106
  comparison: {
107
- threshold: 0.1
107
+ threshold: 2.0
108
108
  },
109
109
  tdd: {
110
110
  openReport: false
@@ -6,7 +6,7 @@
6
6
  import { createHttpServer } from '../server/http-server.js';
7
7
  import { createTddHandler } from '../server/handlers/tdd-handler.js';
8
8
  import { createApiHandler } from '../server/handlers/api-handler.js';
9
- import { writeFileSync, mkdirSync } from 'fs';
9
+ import { writeFileSync, mkdirSync, unlinkSync, existsSync } from 'fs';
10
10
  import { join } from 'path';
11
11
  export class ServerManager {
12
12
  constructor(config, options = {}) {
@@ -85,6 +85,16 @@ export class ServerManager {
85
85
  // Don't throw - cleanup errors shouldn't fail the stop process
86
86
  }
87
87
  }
88
+
89
+ // Clean up server.json so the client SDK doesn't try to connect to a dead server
90
+ try {
91
+ let serverFile = join(process.cwd(), '.vizzly', 'server.json');
92
+ if (existsSync(serverFile)) {
93
+ unlinkSync(serverFile);
94
+ }
95
+ } catch {
96
+ // Non-fatal - cleanup errors shouldn't fail the stop process
97
+ }
88
98
  }
89
99
 
90
100
  // Expose server interface for compatibility
@@ -94,4 +104,13 @@ export class ServerManager {
94
104
  finishBuild: buildId => this.httpServer?.finishBuild?.(buildId)
95
105
  };
96
106
  }
107
+
108
+ /**
109
+ * Get TDD results (comparisons, screenshot count, etc.)
110
+ * Only available in TDD mode after tests have run
111
+ */
112
+ async getTddResults() {
113
+ if (!this.tddMode || !this.handler?.getResults) return null;
114
+ return await this.handler.getResults();
115
+ }
97
116
  }
@@ -112,7 +112,7 @@ export class TddService {
112
112
  this.diffPath = safePath(this.workingDir, '.vizzly', 'diffs');
113
113
  this.baselineData = null;
114
114
  this.comparisons = [];
115
- this.threshold = config.comparison?.threshold || 0.1;
115
+ this.threshold = config.comparison?.threshold || 2.0;
116
116
  this.signatureProperties = []; // Custom properties from project's baseline_signature_properties
117
117
 
118
118
  // Check if we're in baseline update mode
@@ -973,8 +973,8 @@ export class TddService {
973
973
  try {
974
974
  // Try to compare - honeydiff will throw if dimensions don't match
975
975
  const result = await compare(baselineImagePath, currentImagePath, {
976
- colorThreshold: this.threshold,
977
- // YIQ color threshold (0.0-1.0), default 0.1
976
+ threshold: this.threshold,
977
+ // CIEDE2000 Delta E (2.0 = recommended default)
978
978
  antialiasing: true,
979
979
  diffPath: diffImagePath,
980
980
  overwrite: true,
@@ -112,8 +112,25 @@ export class TestRunner extends EventEmitter {
112
112
  // Error in setup phase
113
113
  testError = error;
114
114
  testSuccess = false;
115
- } finally {
116
- // Always finalize the build and stop the server
115
+ }
116
+
117
+ // Get TDD results before stopping the server (comparisons, screenshot count)
118
+ let tddResults = null;
119
+ if (tdd) {
120
+ try {
121
+ tddResults = await this.serverManager.getTddResults();
122
+ if (tddResults) {
123
+ screenshotCount = tddResults.total || 0;
124
+ }
125
+ } catch (tddError) {
126
+ output.debug('tdd', 'failed to get results', {
127
+ error: tddError.message
128
+ });
129
+ }
130
+ }
131
+
132
+ // Always finalize the build and stop the server (cleanup phase)
133
+ try {
117
134
  const executionTime = Date.now() - startTime;
118
135
  if (buildId) {
119
136
  try {
@@ -127,6 +144,8 @@ export class TestRunner extends EventEmitter {
127
144
  if (!tdd && this.serverManager.server?.getScreenshotCount) {
128
145
  screenshotCount = this.serverManager.server.getScreenshotCount(buildId) || 0;
129
146
  }
147
+ } finally {
148
+ // Always stop the server, even if finalization fails
130
149
  try {
131
150
  await this.serverManager.stop();
132
151
  } catch (stopError) {
@@ -144,7 +163,9 @@ export class TestRunner extends EventEmitter {
144
163
  url: buildUrl,
145
164
  testsPassed: testSuccess ? 1 : 0,
146
165
  testsFailed: testSuccess ? 0 : 1,
147
- screenshotsCaptured: screenshotCount
166
+ screenshotsCaptured: screenshotCount,
167
+ comparisons: tddResults?.comparisons || null,
168
+ failed: (tddResults?.failed || 0) > 0
148
169
  };
149
170
  }
150
171
  async createBuild(options, tdd) {
@@ -157,7 +178,7 @@ export class TestRunner extends EventEmitter {
157
178
  // API mode: create build via API
158
179
  const apiService = await this.createApiService();
159
180
  if (apiService) {
160
- const buildResult = await apiService.createBuild({
181
+ let buildPayload = {
161
182
  name: options.buildName || `Test Run ${new Date().toISOString()}`,
162
183
  branch: options.branch || 'main',
163
184
  environment: options.environment || 'test',
@@ -165,7 +186,17 @@ export class TestRunner extends EventEmitter {
165
186
  commit_message: options.message,
166
187
  github_pull_request_number: options.pullRequestNumber,
167
188
  parallel_id: options.parallelId
168
- });
189
+ };
190
+
191
+ // Only include metadata if we have meaningful config to send
192
+ if (this.config.comparison?.threshold != null) {
193
+ buildPayload.metadata = {
194
+ comparison: {
195
+ threshold: this.config.comparison.threshold
196
+ }
197
+ };
198
+ }
199
+ const buildResult = await apiService.createBuild(buildPayload);
169
200
  output.debug('build', `created ${buildResult.id}`);
170
201
 
171
202
  // Emit build created event
@@ -20,7 +20,7 @@ export { VizzlyConfig } from './index';
20
20
  * port: 47392
21
21
  * },
22
22
  * comparison: {
23
- * threshold: 0.1
23
+ * threshold: 2.0 // CIEDE2000 Delta E (0=exact, 1=JND, 2=recommended)
24
24
  * }
25
25
  * });
26
26
  */
@@ -25,9 +25,9 @@ let DEFAULT_CONFIG = {
25
25
  batchSize: 10,
26
26
  timeout: 30000
27
27
  },
28
- // Comparison Configuration
28
+ // Comparison Configuration (CIEDE2000 Delta E: 0=exact, 1=JND, 2=recommended)
29
29
  comparison: {
30
- threshold: 0.1
30
+ threshold: 2.0
31
31
  },
32
32
  // TDD Configuration
33
33
  tdd: {
@@ -35,9 +35,10 @@ let uploadSchema = z.object({
35
35
 
36
36
  /**
37
37
  * Comparison configuration schema
38
+ * threshold: CIEDE2000 Delta E units (0.0 = exact, 1.0 = JND, 2.0 = recommended, 3.0+ = permissive)
38
39
  */
39
40
  let comparisonSchema = z.object({
40
- threshold: z.number().min(0).max(1).default(0.1)
41
+ threshold: z.number().min(0).default(2.0)
41
42
  });
42
43
 
43
44
  /**
@@ -69,7 +70,7 @@ export let vizzlyConfigSchema = z.object({
69
70
  timeout: 30000
70
71
  }),
71
72
  comparison: comparisonSchema.default({
72
- threshold: 0.1
73
+ threshold: 2.0
73
74
  }),
74
75
  tdd: tddSchema.default({
75
76
  openReport: false
@@ -98,7 +99,7 @@ export let vizzlyConfigSchema = z.object({
98
99
  timeout: 30000
99
100
  },
100
101
  comparison: {
101
- threshold: 0.1
102
+ threshold: 2.0
102
103
  },
103
104
  tdd: {
104
105
  openReport: false
@@ -19,7 +19,7 @@ Capture a screenshot for visual regression testing.
19
19
  ```javascript
20
20
  {
21
21
  // Comparison settings
22
- threshold: 0.01, // Pixel difference threshold (0-1)
22
+ threshold: 2.0, // CIEDE2000 Delta E (0=exact, 1=JND, 2=recommended)
23
23
 
24
24
  // Metadata for organization (all optional)
25
25
  properties: {
@@ -451,7 +451,7 @@ Upload screenshots from a directory.
451
451
  - `--commit <sha>` - Git commit SHA override
452
452
  - `--message <msg>` - Commit message override
453
453
  - `--environment <env>` - Environment name (default: "test")
454
- - `--threshold <number>` - Comparison threshold (0-1)
454
+ - `--threshold <number>` - Comparison threshold (CIEDE2000 Delta E)
455
455
  - `--token <token>` - API token override
456
456
  - `--wait` - Wait for build completion
457
457
  - `--upload-all` - Upload all screenshots without SHA deduplication
@@ -484,7 +484,7 @@ Run tests with Vizzly integration.
484
484
 
485
485
  *Processing Options:*
486
486
  - `--wait` - Wait for build completion and exit with appropriate code
487
- - `--threshold <number>` - Comparison threshold (0-1, default: 0.01)
487
+ - `--threshold <number>` - Comparison threshold (CIEDE2000 Delta E, default: 2.0)
488
488
  - `--upload-timeout <ms>` - Upload wait timeout in ms (default: from config or 30000)
489
489
  - `--upload-all` - Upload all screenshots without SHA deduplication
490
490
 
@@ -528,7 +528,7 @@ Run tests in TDD mode with local visual comparisons.
528
528
  *Build Configuration:*
529
529
  - `--branch <branch>` - Git branch override
530
530
  - `--environment <env>` - Environment name (default: "test")
531
- - `--threshold <number>` - Comparison threshold (0-1, default: 0.1)
531
+ - `--threshold <number>` - Comparison threshold (CIEDE2000 Delta E, default: 2.0)
532
532
  - `--token <token>` - API token override
533
533
 
534
534
  **Behavior:**
@@ -661,7 +661,7 @@ Configuration loaded via cosmiconfig in this order:
661
661
 
662
662
  // Comparison Configuration
663
663
  comparison: {
664
- threshold: number // Pixel difference threshold (default: 0.1)
664
+ threshold: number // CIEDE2000 Delta E (default: 2.0)
665
665
  }
666
666
  }
667
667
  ```
@@ -12,7 +12,7 @@ The `doctor` command provides a quick preflight to validate your local setup. It
12
12
 
13
13
  - Node.js version: must be 20 or newer
14
14
  - `apiUrl`: must be a valid `http` or `https` URL
15
- - `comparison.threshold`: a number between 0 and 1
15
+ - `comparison.threshold`: a non-negative number (CIEDE2000 Delta E units, default: 2.0)
16
16
  - Effective `server.port`: reports the port without binding (default `47392`)
17
17
 
18
18
  ## Usage
package/docs/tdd-mode.md CHANGED
@@ -224,7 +224,7 @@ Starts the dashboard server in the background as a detached process and returns
224
224
 
225
225
  Options:
226
226
  - `--port <port>` - Server port (default: 47392)
227
- - `--threshold <number>` - Comparison threshold (default: 0.1)
227
+ - `--threshold <number>` - Comparison threshold in CIEDE2000 Delta E (default: 2.0)
228
228
  - `--baseline-build <id>` - Use specific build as baseline
229
229
  - `--open` - Auto-open dashboard in browser
230
230
 
@@ -236,7 +236,7 @@ vizzly tdd run "npm test" [options]
236
236
  Options:
237
237
  - `--set-baseline` - Accept screenshots as new baseline
238
238
  - `--port <port>` - Server port (default: 47392)
239
- - `--threshold <number>` - Comparison threshold (default: 0.1)
239
+ - `--threshold <number>` - Comparison threshold in CIEDE2000 Delta E (default: 2.0)
240
240
  - `--baseline-build <id>` - Use specific build as baseline
241
241
  - `--timeout <ms>` - Server timeout (default: 30000)
242
242
 
@@ -358,7 +358,7 @@ Configure in `vizzly.config.js`:
358
358
  ```javascript
359
359
  export default {
360
360
  comparison: {
361
- threshold: 0.01 // 1% difference tolerance
361
+ threshold: 2.0 // CIEDE2000 Delta E (0=exact, 1=JND, 2=recommended)
362
362
  }
363
363
  };
364
364
  ```
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vizzly-testing/cli",
3
- "version": "0.16.3",
3
+ "version": "0.17.0",
4
4
  "description": "Visual review platform for UI developers and designers",
5
5
  "keywords": [
6
6
  "visual-testing",
@@ -84,7 +84,7 @@
84
84
  "registry": "https://registry.npmjs.org/"
85
85
  },
86
86
  "dependencies": {
87
- "@vizzly-testing/honeydiff": "^0.4.3",
87
+ "@vizzly-testing/honeydiff": "^0.5.0",
88
88
  "commander": "^14.0.0",
89
89
  "cosmiconfig": "^9.0.0",
90
90
  "dotenv": "^17.2.1",