:root{--color-primary-50: #F3F1FF;--color-primary-100: #E9E5FF;--color-primary-200: #D4CFFF;--color-primary-300: #B5ABFF;--color-primary-400: #9182FF;--color-primary-500: #6C5CE7;--color-primary-600: #5B4BD3;--color-primary-700: #4A3CB3;--color-primary-800: #3D3293;--color-primary-900: #342D77;--color-success-50: #ECFDF5;--color-success-100: #D1FAE5;--color-success-200: #A7F3D0;--color-success-300: #6EE7B7;--color-success-400: #34D399;--color-success-500: #10AC84;--color-success-600: #059669;--color-success-700: #047857;--color-success-800: #065F46;--color-success-900: #064E3B;--color-warning-50: #FFFBEB;--color-warning-100: #FEF3C7;--color-warning-200: #FDE68A;--color-warning-300: #FCD34D;--color-warning-400: #FBBF24;--color-warning-500: #F59E0B;--color-warning-600: #D97706;--color-warning-700: #B45309;--color-warning-800: #92400E;--color-warning-900: #78350F;--color-error-50: #FEF2F2;--color-error-100: #FEE2E2;--color-error-200: #FECACA;--color-error-300: #FCA5A5;--color-error-400: #F87171;--color-error-500: #EF4444;--color-error-600: #DC2626;--color-error-700: #B91C1C;--color-error-800: #991B1B;--color-error-900: #7F1D1D;--color-info-50: #EFF6FF;--color-info-100: #DBEAFE;--color-info-200: #BFDBFE;--color-info-300: #93C5FD;--color-info-400: #60A5FA;--color-info-500: #3B82F6;--color-info-600: #2563EB;--color-info-700: #1D4ED8;--color-info-800: #1E40AF;--color-info-900: #1E3A8A;--color-gray-50: #F9FAFB;--color-gray-100: #F3F4F6;--color-gray-200: #E5E7EB;--color-gray-300: #D1D5DB;--color-gray-400: #9CA3AF;--color-gray-500: #6B7280;--color-gray-600: #4B5563;--color-gray-700: #374151;--color-gray-800: #1F2937;--color-gray-900: #111827;--color-background: #F5F5F7;--color-surface: #FFFFFF;--color-surface-hover: #F9FAFB;--color-border: #E5E7EB;--color-border-light: #F3F4F6;--color-text-primary: #1A1A2E;--color-text-secondary: #4B5563;--color-text-tertiary: #9CA3AF;--color-text-disabled: #D1D5DB;--color-text-inverse: #FFFFFF;--font-family-base: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-family-mono: ui-monospace, "SF Mono", "Menlo", "Monaco", "Consolas", monospace;--font-size-xs: .75rem;--font-size-sm: .8125rem;--font-size-base: .875rem;--font-size-md: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 1.875rem;--font-size-4xl: 2.25rem;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--line-height-tight: 1.25;--line-height-normal: 1.5;--line-height-relaxed: 1.625;--spacing-0: 0;--spacing-1: .25rem;--spacing-2: .5rem;--spacing-3: .75rem;--spacing-4: 1rem;--spacing-5: 1.25rem;--spacing-6: 1.5rem;--spacing-8: 2rem;--spacing-10: 2.5rem;--spacing-12: 3rem;--spacing-16: 4rem;--spacing-20: 5rem;--radius-sm: 4px;--radius-md: 6px;--radius-lg: 8px;--radius-xl: 12px;--radius-2xl: 16px;--radius-full: 9999px;--border-width-thin: 1px;--border-width-medium: 1.5px;--border-width-thick: 2px;--shadow-xs: 0 1px 2px rgba(0, 0, 0, .04);--shadow-sm: 0 1px 3px rgba(0, 0, 0, .06), 0 1px 2px rgba(0, 0, 0, .04);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .08), 0 2px 4px -1px rgba(0, 0, 0, .04);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .08), 0 4px 6px -2px rgba(0, 0, 0, .04);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 10px 10px -5px rgba(0, 0, 0, .04);--shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, .25);--shadow-primary: 0 4px 14px rgba(108, 92, 231, .25);--shadow-success: 0 4px 14px rgba(16, 172, 132, .25);--shadow-error: 0 4px 14px rgba(239, 68, 68, .25);--transition-fast: .15s ease;--transition-base: .2s ease;--transition-slow: .3s ease;--transition-slower: .4s ease;--ease-bounce: cubic-bezier(.34, 1.56, .64, 1);--ease-smooth: cubic-bezier(.4, 0, .2, 1);--z-dropdown: 100;--z-sticky: 200;--z-fixed: 300;--z-modal-backdrop: 400;--z-modal: 500;--z-popover: 600;--z-tooltip: 700;--z-toast: 800;--breakpoint-sm: 640px;--breakpoint-md: 768px;--breakpoint-lg: 1024px;--breakpoint-xl: 1280px;--breakpoint-2xl: 1536px;--input-height-sm: 32px;--input-height-md: 40px;--input-height-lg: 48px;--input-border-color: var(--color-gray-300);--input-border-color-focus: var(--color-primary-500);--input-background: var(--color-surface);--input-placeholder: var(--color-gray-400);--button-height-sm: 32px;--button-height-md: 40px;--button-height-lg: 48px;--card-padding: var(--spacing-5);--card-radius: var(--radius-xl);--card-shadow: var(--shadow-sm);--card-shadow-hover: var(--shadow-md);--modal-padding: var(--spacing-6);--modal-radius: var(--radius-xl);--modal-shadow: var(--shadow-2xl);--modal-backdrop: rgba(0, 0, 0, .5);--toast-radius: var(--radius-lg);--toast-shadow: var(--shadow-lg)}:root.dark,[data-theme=dark]{--color-background: #0F0F1A;--color-surface: #1A1A2E;--color-surface-hover: #252542;--color-border: #2D2D44;--color-border-light: #252542;--color-text-primary: #F9FAFB;--color-text-secondary: #D1D5DB;--color-text-tertiary: #9CA3AF;--color-text-disabled: #4B5563;--color-primary-50: #252542;--color-primary-100: rgba(108, 92, 231, .15);--color-primary-200: rgba(108, 92, 231, .25);--color-primary-500: #8B7CF7;--color-primary-600: #A99BFF;--color-success-50: rgba(16, 172, 132, .08);--color-success-100: rgba(16, 172, 132, .15);--color-success-200: rgba(16, 172, 132, .25);--color-success-500: #34D399;--color-success-600: #6EE7B7;--color-warning-50: rgba(245, 158, 11, .08);--color-warning-100: rgba(245, 158, 11, .15);--color-warning-200: rgba(245, 158, 11, .25);--color-warning-500: #FBBF24;--color-warning-600: #FCD34D;--color-error-50: rgba(239, 68, 68, .08);--color-error-100: rgba(239, 68, 68, .15);--color-error-200: rgba(239, 68, 68, .25);--color-error-500: #F87171;--color-error-600: #FCA5A5;--color-info-50: rgba(59, 130, 246, .08);--color-info-100: rgba(59, 130, 246, .15);--color-info-200: rgba(59, 130, 246, .25);--color-info-500: #60A5FA;--color-info-600: #93C5FD;--color-info-700: #BFDBFE;--color-primary-700: #C4B5FD;--color-success-700: #A7F3D0;--color-warning-700: #FDE68A;--color-error-700: #FECACA;--color-gray-50: #1A1A2E;--color-gray-100: #252542;--color-gray-200: #2D2D44;--color-gray-700: #D1D5DB;--color-gray-800: #E5E7EB;--color-gray-900: #F9FAFB;--input-border-color: var(--color-gray-200);--input-background: var(--color-surface);--input-placeholder: var(--color-gray-400);--modal-backdrop: rgba(0, 0, 0, .7);color-scheme:dark}@media (prefers-color-scheme: dark){:root:not([data-theme=light]){--color-background: #0F0F1A;--color-surface: #1A1A2E;--color-surface-hover: #252542;--color-border: #2D2D44;--color-border-light: #252542;--color-text-primary: #F9FAFB;--color-text-secondary: #D1D5DB;--color-text-tertiary: #9CA3AF;--color-text-disabled: #4B5563;--color-primary-50: #252542;--color-primary-100: rgba(108, 92, 231, .15);--color-primary-200: rgba(108, 92, 231, .25);--color-primary-500: #8B7CF7;--color-primary-600: #A99BFF;--color-success-50: rgba(16, 172, 132, .08);--color-success-100: rgba(16, 172, 132, .15);--color-success-200: rgba(16, 172, 132, .25);--color-success-500: #34D399;--color-success-600: #6EE7B7;--color-warning-50: rgba(245, 158, 11, .08);--color-warning-100: rgba(245, 158, 11, .15);--color-warning-200: rgba(245, 158, 11, .25);--color-warning-500: #FBBF24;--color-warning-600: #FCD34D;--color-error-50: rgba(239, 68, 68, .08);--color-error-100: rgba(239, 68, 68, .15);--color-error-200: rgba(239, 68, 68, .25);--color-error-500: #F87171;--color-error-600: #FCA5A5;--color-info-50: rgba(59, 130, 246, .08);--color-info-100: rgba(59, 130, 246, .15);--color-info-200: rgba(59, 130, 246, .25);--color-info-500: #60A5FA;--color-info-600: #93C5FD;--color-info-700: #BFDBFE;--color-primary-700: #C4B5FD;--color-success-700: #A7F3D0;--color-warning-700: #FDE68A;--color-error-700: #FECACA;--color-gray-50: #1A1A2E;--color-gray-100: #252542;--color-gray-200: #2D2D44;--color-gray-700: #D1D5DB;--color-gray-800: #E5E7EB;--color-gray-900: #F9FAFB;--input-border-color: var(--color-gray-200);--input-background: var(--color-surface);--input-placeholder: var(--color-gray-400);--modal-backdrop: rgba(0, 0, 0, .7);color-scheme:dark}}*,*:before,*:after{box-sizing:border-box}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;padding:0;font-family:var(--font-family-base);font-size:var(--font-size-base);line-height:var(--line-height-normal);color:var(--color-text-primary);background-color:var(--color-background)}:focus-visible{outline:2px solid var(--color-primary-500);outline-offset:2px}:focus:not(:focus-visible){outline:none}::selection{background-color:var(--color-primary-100);color:var(--color-primary-900)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-family-base);background:var(--color-background);color:var(--color-text-primary)}.app-layout{display:flex;min-height:100vh}.mobile-menu-toggle{display:none;position:fixed;top:16px;left:16px;z-index:200;width:44px;height:44px;padding:0;background:#1a1a2e;border:none;border-radius:10px;color:#fff;cursor:pointer;align-items:center;justify-content:center;box-shadow:0 4px 12px #0000004d;transition:all .2s}.mobile-menu-toggle:hover{background:#252542}.sidebar-overlay{display:none;position:fixed;inset:0;background:#00000080;z-index:99}.sidebar{width:240px;min-width:240px;background:#1a1a2e;color:#fff;display:flex;flex-direction:column;position:fixed;top:0;left:0;bottom:0;z-index:100;transition:transform .3s cubic-bezier(.4,0,.2,1)}.sidebar-header{display:flex;align-items:center;gap:12px;padding:24px 20px 20px;border-bottom:1px solid rgba(255,255,255,.06)}.logo-icon{width:36px;height:36px;background:linear-gradient(135deg,#6c5ce7,#a29bfe);border-radius:10px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:18px;color:#fff;flex-shrink:0}.logo-title{font-size:17px;font-weight:700;letter-spacing:-.3px;display:block;line-height:1.2}.logo-sub{font-size:11px;color:#ffffff59;font-weight:400;display:block}.sidebar-nav{flex:1;padding:16px 10px;display:flex;flex-direction:column;gap:2px}.nav-item{display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:8px;color:#ffffff80;text-decoration:none;font-size:13.5px;font-weight:500;transition:all .15s}.nav-item:hover{background:#ffffff0f;color:#ffffffd9}.nav-item.active{background:#6c5ce726;color:#fff}.sidebar-footer{padding:14px 12px;border-top:1px solid rgba(255,255,255,.06)}.user-info{display:flex;align-items:center;gap:10px;margin-bottom:10px}.user-avatar{width:30px;height:30px;border-radius:7px;background:linear-gradient(135deg,#6c5ce7,#a29bfe);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;color:#fff;flex-shrink:0}.user-email{font-size:12.5px;color:#ffffff80;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}.logout-btn{width:100%;padding:8px 14px;border:none;background:#ffffff0a;border-radius:7px;color:#fff6;font-family:Inter,sans-serif;font-size:12.5px;font-weight:500;cursor:pointer;transition:all .15s}.logout-btn:hover{background:#ff4b4b26;color:#ff6b6b}.main-content{flex:1;margin-left:240px;padding:32px;min-height:100vh}.fade-enter-active,.fade-leave-active{transition:opacity .2s ease}.fade-enter-from,.fade-leave-to{opacity:0}@media (max-width: 600px){.mobile-menu-toggle{display:flex}.sidebar-overlay{display:block}.sidebar{transform:translate(-100%)}.sidebar--open{transform:translate(0)}.main-content{margin-left:0;padding:72px 16px 24px}}@media (min-width: 601px) and (max-width: 1024px){.sidebar{width:200px;min-width:200px}.main-content{margin-left:200px;padding:24px}.logo-text{display:none}.sidebar-header{justify-content:center;padding:20px}.nav-item span{display:none}.nav-item{justify-content:center}.user-details{display:none}.user-info{justify-content:center}}