@theme{ --bg-primary: oklch(98% .005 264); --bg-secondary: oklch(100% 0 0); --bg-tertiary: oklch(96% .005 264); --bg-elevated: oklch(100% 0 0);  --text-primary: oklch(15% .02 264); --text-secondary: oklch(40% .02 264); --text-tertiary: oklch(60% .01 264); --text-inverse: oklch(100% 0 0);  --border-primary: oklch(90% .01 264); --border-secondary: oklch(95% .005 264); --border-focus: oklch(65% .25 264);  --accent-primary: oklch(65% .25 264); --accent-primary-hover: oklch(55% .25 264); --accent-primary-light: oklch(95% .05 264); --accent-secondary: oklch(70% .2 200); --accent-secondary-hover: oklch(60% .2 200);  --glow-primary: oklch(55% .2 290/.4); --glow-secondary: oklch(65% .2 290/.4);  --success: oklch(70% .2 145); --success-light: oklch(95% .05 145); --warning: oklch(83.49% .1696 82.15); --warning-light: oklch(95% .05 85); --error: oklch(60% .2 27); --error-light: oklch(95% .05 27); --info: oklch(65% .2 250); --info-light: oklch(95% .05 250);  --pause: oklch(65% .2 250); --pause-light: oklch(95% .05 250); --pace: oklch(75% .15 85); --pace-light: oklch(95% .05 85); --filler: oklch(60% .2 27); --filler-light: oklch(95% .05 27);  --shadow-sm: 0 1px 2px 0 oklch(0% 0 0/.05); --shadow-md: 0 4px 6px -1px oklch(0% 0 0/.1), 0 2px 4px -2px oklch(0% 0 0/.1); --shadow-lg: 0 10px 15px -3px oklch(0% 0 0/.1), 0 4px 6px -4px oklch(0% 0 0/.1); --shadow-xl: 0 20px 25px -5px oklch(0% 0 0/.1), 0 8px 10px -6px oklch(0% 0 0/.1); --shadow-glow: 0 0 20px oklch(65% .25 264/.2); --shadow-glow-lg: 0 0 40px oklch(65% .25 264/.3); --shadow-glow-cyan: 0 0 20px oklch(70% .2 200/.2);  --glass-bg: oklch(100% 0 0/.7); --glass-border: oklch(100% 0 0/.2); --glass-blur: 20px;  --glass-card-bg: oklch(100% 0 0/.05); --glass-card-border: oklch(100% 0 0/.1); --glass-card-blur: 12px;  --glass-element-bg: oklch(100% 0 0/.1); --glass-element-border: oklch(100% 0 0/.15); --glass-element-blur: 16px;  --gradient-primary: linear-gradient(135deg, oklch(55% .2 290), oklch(65% .2 290)); --gradient-secondary: linear-gradient(135deg, oklch(60% .2 280), oklch(65% .2 290)); --gradient-accent: linear-gradient(135deg, oklch(65% .2 290), oklch(55% .2 290)); --gradient-surface: linear-gradient(180deg, oklch(100% 0 0), oklch(98% .005 264)); --gradient-mesh: radial-gradient(at 40% 20%, oklch(55% .2 290/.08) 0px, transparent 50%), radial-gradient(at 80% 0%, oklch(65% .2 290/.06) 0px, transparent 50%), radial-gradient(at 0% 50%, oklch(55% .2 280/.05) 0px, transparent 50%);  --transition-fast: .15s cubic-bezier(.4, 0, .2, 1); --transition-base: .2s cubic-bezier(.4, 0, .2, 1); --transition-slow: .3s cubic-bezier(.4, 0, .2, 1); --transition-spring: .5s cubic-bezier(.34, 1.56, .64, 1);  --font-size-display: 2rem; --font-size-heading: 1.5rem; --font-size-subheading: 1.125rem; --font-size-body: .875rem; --font-size-caption: .75rem; --font-weight-heading: 600; --font-weight-body: 400;  --space-1: .25rem; --space-2: .5rem; --space-3: .75rem; --space-4: 1rem; --space-6: 1.5rem; --space-8: 2rem;  --bg-primary: 98% .005 264; --bg-secondary: 100% 0 0; --bg-tertiary: 96% .005 264; --bg-elevated: 100% 0 0;  --safe-area-top: env(safe-area-inset-top,0px); --safe-area-bottom: env(safe-area-inset-bottom,0px); --text-primary: 15% .02 264; --text-secondary: 40% .02 264; --text-tertiary: 60% .01 264; --text-inverse: 100% 0 0; --border-primary: 90% .01 264; --border-secondary: 95% .005 264; --border-focus: 65% .25 264;  --accent-primary: 65% .25 264; --accent-primary-hover: 55% .25 264; --accent-primary-light: 95% .05 264; --accent-secondary: 70% .2 200; --accent-secondary-hover: 60% .2 200;  --glow-primary: 55% .2 290; --glow-secondary: 65% .2 290;  --success: 70% .2 145; --success-light: 95% .05 145; --warning: .8349 .1696 82.15; --warning-light: 95% .05 85; --error: 60% .2 27; --error-light: 95% .05 27; --info: 65% .2 250; --info-light: 95% .05 250;  --pause: 65% .2 250; --pause-light: 95% .05 250; --pace: 75% .15 85; --pace-light: 95% .05 85; --filler: 60% .2 27; --filler-light: 95% .05 27;  --shadow-sm: 0 1px 2px 0 oklch(0% 0 0/.05); --shadow-md: 0 4px 6px -1px oklch(0% 0 0/.1), 0 2px 4px -2px oklch(0% 0 0/.1); --shadow-lg: 0 10px 15px -3px oklch(0% 0 0/.1), 0 4px 6px -4px oklch(0% 0 0/.1); --shadow-xl: 0 20px 25px -5px oklch(0% 0 0/.1), 0 8px 10px -6px oklch(0% 0 0/.1); --shadow-glow: 0 0 20px oklch(65% .25 264/.2); --shadow-glow-lg: 0 0 40px oklch(65% .25 264/.3); --shadow-glow-cyan: 0 0 20px oklch(70% .2 200/.2);  --glass-bg: 100% 0 0; --glass-border: 100% 0 0; --glass-blur: 20px;  --glass-card-bg: 100% 0 0; --glass-card-border: 100% 0 0; --glass-card-blur: 12px;  --gradient-primary: linear-gradient(135deg, oklch(55% .2 290), oklch(65% .2 290)); --gradient-secondary: linear-gradient(135deg, oklch(60% .2 280), oklch(65% .2 290)); --gradient-accent: linear-gradient(135deg, oklch(65% .2 290), oklch(55% .2 290)); --gradient-surface: linear-gradient(180deg, oklch(100% 0 0), oklch(98% .005 264)); --gradient-mesh: radial-gradient(at 40% 20%, oklch(55% .2 290/.08) 0px, transparent 50%), radial-gradient(at 80% 0%, oklch(65% .2 290/.06) 0px, transparent 50%), radial-gradient(at 0% 50%, oklch(55% .2 280/.05) 0px, transparent 50%);  --transition-fast: .15s cubic-bezier(.4, 0, .2, 1); --transition-base: .2s cubic-bezier(.4, 0, .2, 1); --transition-slow: .3s cubic-bezier(.4, 0, .2, 1); --transition-spring: .5s cubic-bezier(.34, 1.56, .64, 1);}.dark{--bg-primary:10% .02 264;--bg-secondary:14% .02 264;--bg-tertiary:18% .02 264;--bg-elevated:16% .02 264;--text-primary:98% .005 264;--text-secondary:70% .02 264;--text-tertiary:55% .02 264;--text-inverse:10% .02 264;--border-primary:25% .02 264;--border-secondary:18% .02 264;--border-focus:70% .2 264;--accent-primary:70% .2 264;--accent-primary-hover:65% .25 264;--accent-primary-light:20% .08 264;--accent-secondary:75% .15 200;--accent-secondary-hover:70% .2 200;--glow-primary:60% .2 290;--glow-secondary:70% .2 290;--success:75% .18 145;--success-light:20% .08 145;--warning:.8349 .1696 82.15;--warning-light:20% .06 85;--error:65% .18 27;--error-light:20% .08 27;--info:70% .18 250;--info-light:20% .08 250;--pause:70% .18 250;--pause-light:20% .08 250;--pace:80% .12 85;--pace-light:20% .06 85;--filler:65% .18 27;--filler-light:20% .08 27;--shadow-sm:0 1px 2px 0 #0006;--shadow-md:0 4px 6px -1px #00000080, 0 2px 4px -2px #0006;--shadow-lg:0 10px 15px -3px #0009, 0 4px 6px -4px #00000080;--shadow-xl:0 20px 25px -5px #0009, 0 8px 10px -6px #00000080;--shadow-glow:0 0 30px #6599ff59;--shadow-glow-lg:0 0 60px #6599ff73;--shadow-glow-cyan:0 0 30px #00c6cf59;--glass-bg:14% .02 264;--glass-border:30% .02 264;--glass-blur:24px;--glass-card-bg:14% .02 264;--glass-card-border:30% .02 264;--glass-card-blur:16px;--glass-element-bg:14% .02 264;--glass-element-border:30% .02 264;--glass-element-blur:16px;--gradient-primary:linear-gradient(135deg, #8362ed, #9f87ff);--gradient-secondary:linear-gradient(135deg, #7c7bff, #9f87ff);--gradient-accent:linear-gradient(135deg, #9f87ff, #8362ed);--gradient-surface:linear-gradient(180deg, #060911, #020309);--gradient-mesh:radial-gradient(at 40% 20%, #8362ed1f 0px, transparent 50%), radial-gradient(at 80% 0%, #9f87ff1a 0px, transparent 50%), radial-gradient(at 0% 50%, #6e69f314 0px, transparent 50%)}@supports (color:lab(0% 0 0)){.dark{--shadow-sm:0 1px 2px 0 lab(0% 0 0/.4);--shadow-md:0 4px 6px -1px lab(0% 0 0/.5), 0 2px 4px -2px lab(0% 0 0/.4);--shadow-lg:0 10px 15px -3px lab(0% 0 0/.6), 0 4px 6px -4px lab(0% 0 0/.5);--shadow-xl:0 20px 25px -5px lab(0% 0 0/.6), 0 8px 10px -6px lab(0% 0 0/.5);--shadow-glow:0 0 30px lab(63.2849% 12.7299 -70.8091/.35);--shadow-glow-lg:0 0 60px lab(63.2849% 12.7299 -70.8091/.45);--shadow-glow-cyan:0 0 30px lab(72.4397% -46.7928 -19.1588/.35);--gradient-primary:linear-gradient(135deg, lab(50.5162% 38.8222 -66.8722), lab(62.322% 36.5956 -67.077));--gradient-secondary:linear-gradient(135deg, lab(56.6982% 29.7065 -70.0834), lab(62.322% 36.5956 -67.077));--gradient-accent:linear-gradient(135deg, lab(62.322% 36.5956 -67.077), lab(50.5162% 38.8222 -66.8722));--gradient-surface:linear-gradient(180deg, lab(2.41912% .12362 -4.17753), lab(.867769% .153042 -2.28779));--gradient-mesh:radial-gradient(at 40% 20%, lab(50.5162% 38.8222 -66.8722/.12) 0px, transparent 50%), radial-gradient(at 80% 0%, lab(62.322% 36.5956 -67.077/.1) 0px, transparent 50%), radial-gradient(at 0% 50%, lab(50.7751% 31.2268 -69.983/.08) 0px, transparent 50%)}}@layer base{*{border-color:oklch(var(--border-primary))}body{background:oklch(var(--bg-primary));color:oklch(var(--text-primary));-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-feature-settings:"rlig" 1, "calt" 1;padding-top:var(--safe-area-top)}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:oklch(var(--text-tertiary));border-radius:9999px}::-webkit-scrollbar-thumb:hover{background:oklch(var(--text-secondary))}::selection{background:oklch(var(--accent-primary));color:#fff}:focus-visible{outline:2px solid oklch(var(--accent-primary));outline-offset:2px}:focus:not(:focus-visible){outline:none}button,a,[role=button]{-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}html{scroll-behavior:smooth}}@layer components{.card{background:oklch(var(--bg-secondary));border:1px solid oklch(var(--border-primary));box-shadow:var(--shadow-md);transition:background-color var(--transition-base), border-color var(--transition-base), box-shadow var(--transition-base), transform var(--transition-base);border-radius:1rem}.card:hover{box-shadow:var(--shadow-lg)}.card-elevated{background:oklch(var(--bg-elevated));box-shadow:var(--shadow-lg)}.card-elevated:hover{box-shadow:var(--shadow-xl)}.element-glass{-webkit-backdrop-filter:blur(var(--glass-element-blur));background:oklch(var(--glass-element-bg));border:1px solid oklch(var(--glass-element-border));transition:background-color var(--transition-base), border-color var(--transition-base), box-shadow var(--transition-base), transform var(--transition-base)}.btn-primary{background:var(--gradient-primary);color:#fff;box-shadow:var(--shadow-md), 0 0 0 0 #5288ff00;transition:background-color var(--transition-base), border-color var(--transition-base), box-shadow var(--transition-base), transform var(--transition-base);border-radius:.75rem;padding:.75rem 1.5rem;font-weight:600;position:relative;overflow:hidden}@supports (color:lab(0% 0 0)){.btn-primary{box-shadow:var(--shadow-md), 0 0 0 0 lab(56.4064% 25.0031 -88.0456/0)}}.btn-primary:before{content:"";opacity:0;transition:opacity var(--transition-base);background:linear-gradient(135deg,#ffffff1a,#0000);background:linear-gradient(135deg,lab(100% 0 0/.1),#0000);position:absolute;inset:0}.btn-primary:hover{box-shadow:var(--shadow-glow-lg), 0 0 30px #5288ff4d;transform:translateY(-2px)scale(1.02)}@supports (color:lab(0% 0 0)){.btn-primary:hover{box-shadow:var(--shadow-glow-lg), 0 0 30px lab(56.4064% 25.0031 -88.0456/.3)}}.btn-primary:hover:before{opacity:1}.btn-primary:active{transform:translateY(0)scale(.98)}.btn-secondary{background:oklch(var(--bg-tertiary));color:oklch(var(--text-primary));border:1px solid oklch(var(--border-primary));transition:background-color var(--transition-base), border-color var(--transition-base), box-shadow var(--transition-base), transform var(--transition-base);border-radius:.75rem;padding:.75rem 1.5rem;font-weight:600}.btn-secondary:hover{background:oklch(var(--bg-secondary));border-color:oklch(var(--accent-primary))}.btn-ghost{color:oklch(var(--text-secondary));transition:background-color var(--transition-fast), border-color var(--transition-fast), color var(--transition-fast), opacity var(--transition-fast);border-radius:.5rem;padding:.5rem 1rem;font-weight:500}.btn-ghost:hover{background:oklch(var(--bg-tertiary));color:oklch(var(--text-primary))}.badge{background:oklch(var(--bg-tertiary));color:oklch(var(--text-secondary));border-radius:9999px;align-items:center;padding:.25rem .625rem;font-size:.75rem;font-weight:500;display:inline-flex}.badge-primary{background:oklch(var(--accent-primary-light));color:oklch(var(--accent-primary))}.badge-success{background:oklch(var(--success-light));color:oklch(var(--success))}.badge-warning{background:oklch(var(--warning-light));color:oklch(var(--warning))}.badge-error{background:oklch(var(--error-light));color:oklch(var(--error))}.input{background:oklch(var(--bg-tertiary));border:1px solid oklch(var(--border-primary));width:100%;color:oklch(var(--text-primary));transition:background-color var(--transition-fast), border-color var(--transition-fast), color var(--transition-fast), opacity var(--transition-fast);border-radius:.75rem;padding:.75rem 1rem}.input::placeholder{color:oklch(var(--text-tertiary))}.input:focus{border-color:oklch(var(--border-focus));box-shadow:0 0 0 3px oklch(var(--accent-primary) / .2)}.progress-bar{background:oklch(var(--bg-tertiary));border-radius:9999px;height:.5rem;overflow:hidden}.progress-bar-fill{border-radius:9999px;height:100%;transition:width .5s ease-out}.tooltip{z-index:50;background:oklch(var(--text-primary));color:oklch(var(--text-inverse));box-shadow:var(--shadow-lg);border-radius:.5rem;padding:.5rem .75rem;font-size:.875rem;animation:.3s ease-out fade-in;position:absolute}.gradient-text{-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;background-image:var(--gradient-primary)}.animated-bg{position:relative;overflow:hidden}.animated-bg:before{content:"";background:var(--gradient-primary);opacity:.05;animation:3s ease-in-out infinite pulse-slow;position:absolute;inset:0}}@layer utilities{.glass{-webkit-backdrop-filter:blur(var(--glass-blur))}.glass-light{-webkit-backdrop-filter:blur(12px);background:oklch(var(--glass-bg) / .5);border:1px solid oklch(var(--glass-border) / .2)}.glass-dark{-webkit-backdrop-filter:blur(20px);background:oklch(var(--glass-bg) / .6);border:1px solid oklch(var(--glass-border) / .3)}.glow-primary{box-shadow:0 0 20px oklch(var(--glow-primary) / .3)}.glow-secondary{box-shadow:0 0 20px oklch(var(--glow-secondary) / .3)}.glow-success{box-shadow:0 0 20px oklch(var(--success) / .3)}.glow-warning{box-shadow:0 0 20px oklch(var(--warning) / .3)}.glow-error{box-shadow:0 0 20px oklch(var(--error) / .3)}.gradient-border{position:relative}.gradient-border:before{content:"";border-radius:inherit;background:var(--gradient-primary);-webkit-mask-composite:xor;padding:1px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.shimmer{position:relative;overflow:hidden}.shimmer:after{content:"";background:linear-gradient(90deg,#0000,#ffffff1a,#0000);animation:2s infinite shimmer;position:absolute;inset:0}.glow{box-shadow:var(--shadow-glow)}.glow-lg{box-shadow:var(--shadow-glow-lg)}.transition-premium{transition:background-color var(--transition-base), border-color var(--transition-base), box-shadow var(--transition-base), transform var(--transition-base)}.transition-spring{transition:background-color var(--transition-spring), border-color var(--transition-spring), box-shadow var(--transition-spring), transform var(--transition-spring)}}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes slide-up{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-down{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes scale-in{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes pulse-slow{0%,to{opacity:.05}50%{opacity:.1}}@keyframes glow-pulse{0%,to{box-shadow:0 0 20px #5288ff33;box-shadow:0 0 20px lab(56.4064% 25.0031 -88.0456/.2)}50%{box-shadow:0 0 40px #5288ff66;box-shadow:0 0 40px lab(56.4064% 25.0031 -88.0456/.4)}}@keyframes gradient-shift{0%{background-position:0%}50%{background-position:100%}to{background-position:0%}}@keyframes ripple{to{opacity:0;transform:scale(4)}}.ripple-active{position:relative;overflow:hidden}.ripple-active:after{content:"";width:var(--ripple-size,100px);height:var(--ripple-size,100px);left:var(--ripple-x,50%);top:var(--ripple-y,50%);pointer-events:none;background:radial-gradient(circle,#5288ff4d 0%,#0000 70%);background:radial-gradient(circle,lab(56.4064% 25.0031 -88.0456/.3) 0%,#0000 70%);border-radius:50%;animation:.6s ease-out ripple;position:absolute;transform:scale(0)}.ripple-active-white:after{background:radial-gradient(circle,#ffffff4d 0%,#0000 70%);background:radial-gradient(circle,lab(100% 0 0/.3) 0%,#0000 70%)}@keyframes skeleton-shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.skeleton{background:linear-gradient(90deg, oklch(var(--bg-tertiary)) 25%, oklch(var(--bg-secondary)) 50%, oklch(var(--bg-tertiary)) 75%);background-size:200% 100%;border-radius:.5rem;animation:1.5s ease-in-out infinite skeleton-shimmer}.animate-shimmer{animation:2s infinite shimmer}.animate-fade-in{animation:.3s ease-out fade-in}.animate-slide-up{animation:.4s ease-out slide-up}.animate-slide-down{animation:.4s ease-out slide-down}.animate-scale-in{animation:.3s ease-out scale-in}.animate-pulse-slow{animation:3s ease-in-out infinite pulse-slow}.animate-glow-pulse{animation:2s ease-in-out infinite glow-pulse}.animate-gradient{background-size:200% 200%;animation:3s infinite gradient-shift}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}