:root{--color-brand-primary: #3B82F6;--color-brand-secondary: #8B5CF6;--color-brand-accent: #10B981;--color-neutral-white: #FFFFFF;--color-neutral-black: #000000;--color-neutral-gray-50: #F9FAFB;--color-neutral-gray-100: #F3F4F6;--color-neutral-gray-200: #E5E7EB;--color-neutral-gray-300: #D1D5DB;--color-neutral-gray-400: #9CA3AF;--color-neutral-gray-500: #6B7280;--color-neutral-gray-600: #4B5563;--color-neutral-gray-700: #374151;--color-neutral-gray-800: #1F2937;--color-neutral-gray-900: #111827}:root{--bg-primary: var(--color-neutral-white);--bg-secondary: color-mix(in srgb, var(--color-brand-primary) 5%, white);--bg-tertiary: var(--color-neutral-gray-50);--bg-card: var(--color-neutral-white);--bg-overlay: rgba(0, 0, 0, .5);--btn-primary-bg: var(--color-brand-primary);--btn-primary-text: var(--color-neutral-white);--btn-primary-hover: color-mix(in srgb, var(--color-brand-primary) 90%, black);--btn-primary-active: color-mix(in srgb, var(--color-brand-primary) 80%, black);--btn-primary-disabled-bg: var(--color-neutral-gray-300);--btn-primary-disabled-text: var(--color-neutral-gray-500);--btn-secondary-bg: transparent;--btn-secondary-text: var(--color-brand-primary);--btn-secondary-border: var(--color-brand-primary);--btn-secondary-hover-bg: color-mix(in srgb, var(--color-brand-primary) 10%, white);--text-primary: var(--color-neutral-gray-900);--text-secondary: var(--color-neutral-gray-600);--text-muted: var(--color-neutral-gray-500);--text-inverse: var(--color-neutral-white);--text-link: var(--color-brand-primary);--text-link-hover: color-mix(in srgb, var(--color-brand-primary) 80%, black);--border-light: var(--color-neutral-gray-200);--border-medium: var(--color-neutral-gray-300);--border-dark: var(--color-neutral-gray-400);--border-brand: color-mix(in srgb, var(--color-brand-primary) 30%, white);--border-focus: var(--color-brand-primary);--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1);--shadow-brand-sm: 0 2px 4px color-mix(in srgb, var(--color-brand-primary) 20%, transparent);--shadow-brand-md: 0 8px 16px color-mix(in srgb, var(--color-brand-primary) 15%, transparent);--state-success: #10B981;--state-error: #EF4444;--state-warning: #F59E0B;--state-info: var(--color-brand-accent);--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--spacing-2xl: 48px;--spacing-3xl: 64px;--spacing-4xl: 96px;--radius-sm: 6px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-full: 9999px;--transition-fast: .15s ease-in-out;--transition-base: .25s ease-in-out;--transition-slow: .35s ease-in-out}:root{--card-bg: var(--bg-card);--card-border: var(--border-light);--card-shadow: var(--shadow-md);--card-hover-shadow: var(--shadow-lg);--card-padding: var(--spacing-xl);--card-radius: var(--radius-lg);--input-bg: var(--color-neutral-white);--input-border: var(--border-medium);--input-border-focus: var(--border-focus);--input-text: var(--text-primary);--input-placeholder: var(--text-muted);--input-padding: var(--spacing-md);--input-radius: var(--radius-md);--modal-bg: var(--color-neutral-white);--modal-overlay: var(--bg-overlay);--modal-shadow: var(--shadow-xl);--modal-padding: var(--spacing-2xl);--modal-radius: var(--radius-xl)}:root{--color-background-primary: var(--color-neutral-gray-900);--color-background-secondary: var(--color-neutral-gray-800);--color-accent: var(--color-brand-accent);--color-action: var(--color-brand-primary)}.btn-primary{background-color:var(--btn-primary-bg);color:var(--btn-primary-text);border-radius:var(--radius-md);padding:var(--spacing-md) var(--spacing-xl);font-weight:600;transition:all var(--transition-base);border:none;cursor:pointer}.btn-primary:hover{background-color:var(--btn-primary-hover);transform:translateY(-2px)}.btn-primary:active{background-color:var(--btn-primary-active)}.btn-primary:disabled{background-color:var(--btn-primary-disabled-bg);color:var(--btn-primary-disabled-text);cursor:not-allowed;transform:none}.btn-secondary{background-color:var(--btn-secondary-bg);color:var(--btn-secondary-text);border:2px solid var(--btn-secondary-border);border-radius:var(--radius-md);padding:var(--spacing-md) var(--spacing-xl);font-weight:600;transition:all var(--transition-base);cursor:pointer}.btn-secondary:hover{background-color:var(--btn-secondary-hover-bg)}.card{background-color:var(--card-bg);border:1px solid var(--card-border);border-radius:var(--card-radius);box-shadow:var(--card-shadow);padding:var(--card-padding);transition:all var(--transition-base)}.card:hover{transform:translateY(-4px);box-shadow:var(--card-hover-shadow)}.input{background-color:var(--input-bg);border:1px solid var(--input-border);border-radius:var(--input-radius);padding:var(--input-padding);color:var(--input-text);transition:all var(--transition-base)}.input:focus{outline:none;border-color:var(--input-border-focus);box-shadow:0 0 0 2px color-mix(in srgb,var(--border-focus) 20%,transparent)}.input::placeholder{color:var(--input-placeholder)}.text-primary{color:var(--text-primary)}.text-secondary{color:var(--text-secondary)}.text-muted{color:var(--text-muted)}.text-inverse{color:var(--text-inverse)}.text-link{color:var(--text-link);text-decoration:none;transition:color var(--transition-base)}.text-link:hover{color:var(--text-link-hover)}.spacing-xs{margin:var(--spacing-xs)}.spacing-sm{margin:var(--spacing-sm)}.spacing-md{margin:var(--spacing-md)}.spacing-lg{margin:var(--spacing-lg)}.spacing-xl{margin:var(--spacing-xl)}.spacing-2xl{margin:var(--spacing-2xl)}.spacing-3xl{margin:var(--spacing-3xl)}.spacing-4xl{margin:var(--spacing-4xl)}.p-spacing-xs{padding:var(--spacing-xs)}.p-spacing-sm{padding:var(--spacing-sm)}.p-spacing-md{padding:var(--spacing-md)}.p-spacing-lg{padding:var(--spacing-lg)}.p-spacing-xl{padding:var(--spacing-xl)}.p-spacing-2xl{padding:var(--spacing-2xl)}.p-spacing-3xl{padding:var(--spacing-3xl)}.p-spacing-4xl{padding:var(--spacing-4xl)}.shadow-sm{box-shadow:var(--shadow-sm)}.shadow-md{box-shadow:var(--shadow-md)}.shadow-lg{box-shadow:var(--shadow-lg)}.shadow-xl{box-shadow:var(--shadow-xl)}.shadow-brand-sm{box-shadow:var(--shadow-brand-sm)}.shadow-brand-md{box-shadow:var(--shadow-brand-md)}.radius-sm{border-radius:var(--radius-sm)}.radius-md{border-radius:var(--radius-md)}.radius-lg{border-radius:var(--radius-lg)}.radius-xl{border-radius:var(--radius-xl)}.radius-full{border-radius:var(--radius-full)}.transition-fast{transition:all var(--transition-fast)}.transition-base{transition:all var(--transition-base)}.transition-slow{transition:all var(--transition-slow)}.line-clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.line-clamp-3{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}@media (max-width: 768px){button,a,input,select,textarea{min-height:44px}.mobile-spacing{padding:1rem}body{font-size:16px;line-height:1.5}}html{scroll-behavior:smooth}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid #ec4899;outline-offset:2px}