:root{--color-primary-50: #eff6ff;--color-primary-500: #3b82f6;--color-primary-600: #2563eb;--color-primary-700: #1d4ed8;--color-primary-800: #1e40af;--color-gray-50: #f9fafb;--color-gray-100: #f3f4f6;--color-gray-200: #e5e7eb;--color-gray-300: #d1d5db;--color-gray-500: #6b7280;--color-gray-600: #4b5563;--color-gray-700: #374151;--color-gray-800: #1f293b;--color-gray-900: #111827;--color-success-100: #dcfce7;--color-success-600: #16a34a;--color-success-800: #166534;--color-warning-100: #fef3c7;--color-warning-600: #ca8a04;--color-warning-800: #92400e;--color-error-100: #fee2e2;--color-error-600: #dc2626;--color-error-800: #991b1b;--color-blue-50: #eff6ff;--color-blue-100: #dbeafe;--color-blue-600: #2563eb;--color-blue-700: #1d4ed8;--color-blue-800: #1e40af;--color-purple-100: #f3e8ff;--color-purple-600: #9333ea;--color-purple-800: #6b21a8;--color-indigo-100: #e0e7ff;--color-indigo-600: #4f46e5;--color-indigo-800: #3730a3;--color-orange-100: #ffedd5;--color-orange-600: #ea580c;--color-orange-800: #9a3412;--font-family-mono: "JetBrains Mono", "Monaco", "Consolas", monospace;--font-family-sans: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-size-xs: 0.75rem;--font-size-sm: 0.875rem;--font-size-base: 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;--spacing-0: 0;--spacing-1: 0.25rem;--spacing-2: 0.5rem;--spacing-3: 0.75rem;--spacing-4: 1rem;--spacing-5: 1.25rem;--spacing-6: 1.5rem;--spacing-8: 2rem;--spacing-12: 3rem;--spacing-16: 4rem;--spacing-20: 5rem;--spacing-24: 6rem;--spacing-32: 8rem;--spacing-40: 10rem;--spacing-64: 16rem;--spacing-80: 20rem;--border-radius-none: 0;--border-radius-sm: 0.125rem;--border-radius: 0.25rem;--border-radius-md: 0.375rem;--border-radius-lg: 0.5rem;--border-radius-xl: 0.75rem;--border-radius-2xl: 1rem;--border-radius-full: 9999px;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);--shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);--shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, 0.25);--transition-default: all 0.15s ease-in-out;--transition-fast: all 0.1s ease-in-out;--transition-slow: all 0.3s ease-in-out;--transition-colors: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, text-decoration-color 0.15s ease-in-out, fill 0.15s ease-in-out, stroke 0.15s ease-in-out;--transition-shadow: box-shadow 0.15s ease-in-out}*{box-sizing:border-box}html{font-size:16px;line-height:1.5}body{background-color:var(--color-gray-50);color:var(--color-gray-900);margin:0;padding:0;-moz-osx-font-smoothing:grayscale}.card{background-color:#fff;border-radius:var(--border-radius-lg);box-shadow:var(--shadow-md);border:1px solid var(--color-gray-200);padding:var(--spacing-6)}.btn-primary{background-color:var(--color-primary-600);color:#fff;font-weight:var(--font-weight-medium);padding:var(--spacing-2) var(--spacing-4);border-radius:var(--border-radius-md);transition:var(--transition-colors);border:none;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}.btn-primary:hover{background-color:var(--color-primary-700)}.btn-primary:focus{outline:none;box-shadow:0 0 0 3px rgba(37,99,235,.1)}.btn-secondary{background-color:var(--color-gray-200);color:var(--color-gray-800);font-weight:var(--font-weight-medium);padding:var(--spacing-2) var(--spacing-4);border-radius:var(--border-radius-md);transition:var(--transition-colors);border:none;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}.btn-secondary:hover{background-color:var(--color-gray-300)}.btn-secondary:focus{outline:none;box-shadow:0 0 0 3px rgba(209,213,219,.1)}.input-field{width:100%;padding:var(--spacing-2) var(--spacing-3);border:1px solid var(--color-gray-300);border-radius:var(--border-radius-md);outline:none;transition:var(--transition-default)}.input-field:focus{border-color:var(--color-primary-600);box-shadow:0 0 0 3px rgba(37,99,235,.1)}.status-badge{display:inline-flex;align-items:center;padding:var(--spacing-1) var(--spacing-2);border-radius:var(--border-radius-full);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium)}.status-badge.status-online{background-color:var(--color-success-100);color:var(--color-success-800)}.status-badge.status-offline{background-color:var(--color-error-100);color:var(--color-error-800)}.status-badge.status-syncing{background-color:var(--color-warning-100);color:var(--color-warning-800)}.data-table{width:100%;border-collapse:collapse}.data-table th,.data-table td{padding:var(--spacing-3) var(--spacing-4);text-align:left;border-bottom:1px solid var(--color-gray-100)}.data-table th{font-weight:var(--font-weight-medium);color:var(--color-gray-600);background-color:var(--color-gray-50)}.data-table tr:hover{background-color:var(--color-gray-50)}nav .menu-item{display:flex;align-items:center;justify-content:center;padding:.5rem 1rem;transition:all .3s ease;text-decoration:none;color:var(--color-gray-600)}nav .menu-item:hover{color:var(--color-gray-900);background-color:var(--color-gray-100)}nav .desktopnavactive{background:linear-gradient(to bottom, var(--color-success-100), var(--color-success-600));color:#fff !important}nav .desktopnavactive:hover{color:#fff !important;background:linear-gradient(to bottom, var(--color-success-100), var(--color-success-600))}.bg-white{background-color:#fff}.bg-gray-50{background-color:var(--color-gray-50)}.bg-gray-100{background-color:var(--color-gray-100)}.bg-gray-200{background-color:var(--color-gray-200)}.bg-blue-50{background-color:var(--color-blue-50)}.bg-blue-100{background-color:var(--color-blue-100)}.bg-blue-600{background-color:var(--color-blue-600)}.bg-blue-700{background-color:var(--color-blue-700)}.bg-green-100{background-color:var(--color-success-100)}.bg-green-600{background-color:var(--color-success-600)}.bg-yellow-100{background-color:var(--color-warning-100)}.bg-yellow-600{background-color:var(--color-warning-600)}.bg-red-100{background-color:var(--color-error-100)}.bg-red-600{background-color:var(--color-error-600)}.bg-purple-100{background-color:var(--color-purple-100)}.bg-purple-600{background-color:var(--color-purple-600)}.bg-indigo-100{background-color:var(--color-indigo-100)}.bg-indigo-600{background-color:var(--color-indigo-600)}.bg-orange-100{background-color:var(--color-orange-100)}.bg-orange-600{background-color:var(--color-orange-600)}.text-white{color:#fff}.text-gray-500{color:var(--color-gray-500)}.text-gray-600{color:var(--color-gray-600)}.text-gray-700{color:var(--color-gray-700)}.text-gray-800{color:var(--color-gray-800)}.text-gray-900{color:var(--color-gray-900)}.text-blue-600{color:var(--color-blue-600)}.text-blue-700{color:var(--color-blue-700)}.text-blue-800{color:var(--color-blue-800)}.text-green-600{color:var(--color-success-600)}.text-green-800{color:var(--color-success-800)}.text-yellow-600{color:var(--color-warning-600)}.text-yellow-800{color:var(--color-warning-800)}.text-red-600{color:var(--color-error-600)}.text-red-800{color:var(--color-error-800)}.text-purple-600{color:var(--color-purple-600)}.text-purple-800{color:var(--color-purple-800)}.text-indigo-600{color:var(--color-indigo-600)}.text-indigo-800{color:var(--color-indigo-800)}.text-orange-600{color:var(--color-orange-600)}.text-orange-800{color:var(--color-orange-800)}.font-medium{font-weight:var(--font-weight-medium)}.font-semibold{font-weight:var(--font-weight-semibold)}.font-bold{font-weight:var(--font-weight-bold)}.text-sm{font-size:var(--font-size-sm)}.text-base{font-size:var(--font-size-base)}.text-lg{font-size:var(--font-size-lg)}.text-xl{font-size:var(--font-size-xl)}.text-2xl{font-size:var(--font-size-2xl)}.text-3xl{font-size:var(--font-size-3xl)}.text-4xl{font-size:var(--font-size-4xl)}.rounded{border-radius:var(--border-radius)}.rounded-md{border-radius:var(--border-radius-md)}.rounded-lg{border-radius:var(--border-radius-lg)}.rounded-full{border-radius:var(--border-radius-full)}.px-2{padding-left:var(--spacing-2);padding-right:var(--spacing-2)}.px-3{padding-left:var(--spacing-3);padding-right:var(--spacing-3)}.px-4{padding-left:var(--spacing-4);padding-right:var(--spacing-4)}.px-6{padding-left:var(--spacing-6);padding-right:var(--spacing-6)}.py-1{padding-top:var(--spacing-1);padding-bottom:var(--spacing-1)}.py-2{padding-top:var(--spacing-2);padding-bottom:var(--spacing-2)}.py-3{padding-top:var(--spacing-3);padding-bottom:var(--spacing-3)}.py-4{padding-top:var(--spacing-4);padding-bottom:var(--spacing-4)}.py-6{padding-top:var(--spacing-6);padding-bottom:var(--spacing-6)}.py-8{padding-top:var(--spacing-8);padding-bottom:var(--spacing-8)}.mb-2{margin-bottom:var(--spacing-2)}.mb-4{margin-bottom:var(--spacing-4)}.mb-6{margin-bottom:var(--spacing-6)}.mb-8{margin-bottom:var(--spacing-8)}.mt-2{margin-top:var(--spacing-2)}.mt-4{margin-top:var(--spacing-4)}.mr-1{margin-right:var(--spacing-1)}.mr-2{margin-right:var(--spacing-2)}.ml-2{margin-left:var(--spacing-2)}.ml-4{margin-left:var(--spacing-4)}.ml-5{margin-left:var(--spacing-5)}.space-y-6>*+*{margin-top:var(--spacing-6)}.space-y-8>*+*{margin-top:var(--spacing-8)}.space-x-1>*+*{margin-left:var(--spacing-1)}.space-x-2>*+*{margin-left:var(--spacing-2)}.space-x-4>*+*{margin-left:var(--spacing-4)}.flex{display:flex}.inline-flex{display:inline-flex}.grid{display:grid}.hidden{display:none}.block{display:block}.flex-col{flex-direction:column}.flex-row{flex-direction:row}.flex-1{flex:1 1 0%}.flex-shrink-0{flex-shrink:0}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.justify-start{justify-content:flex-start}.w-full{width:100%}.w-0{width:0}.h-16{height:var(--spacing-16)}.h-32{height:var(--spacing-32)}.h-64{height:var(--spacing-64)}.h-80{height:var(--spacing-80)}.min-h-screen{min-height:100vh}.overflow-x-auto{overflow-x:auto}.border{border-width:1px}.border-b{border-bottom-width:1px}.border-t{border-top-width:1px}.border-gray-100{border-color:var(--color-gray-100)}.border-gray-200{border-color:var(--color-gray-200)}.shadow-md{box-shadow:var(--shadow-md)}.shadow-lg{box-shadow:var(--shadow-lg)}.transition-colors{transition:var(--transition-colors)}.transition-shadow{transition:var(--transition-shadow)}.transition-all{transition:var(--transition-default)}.duration-200{transition-duration:.2s}.hover\:bg-gray-50:hover{background-color:var(--color-gray-50)}.hover\:bg-gray-100:hover{background-color:var(--color-gray-100)}.hover\:bg-gray-300:hover{background-color:var(--color-gray-300)}.hover\:shadow-lg:hover{box-shadow:var(--shadow-lg)}.hover\:text-primary-600:hover{color:var(--color-primary-600)}.hover\:underline:hover{text-decoration:underline}.focus\:outline-none:focus{outline:2px solid rgba(0,0,0,0);outline-offset:2px}.focus\:ring-2:focus{box-shadow:0 0 0 2px var(--color-primary-600)}.focus\:ring-blue-500:focus{box-shadow:0 0 0 2px var(--color-primary-600)}.focus\:border-transparent:focus{border-color:rgba(0,0,0,0)}.cursor-pointer{cursor:pointer}.text-center{text-align:center}.text-left{text-align:left}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ring-2{box-shadow:0 0 0 2px var(--color-primary-600)}.ring-primary-500{box-shadow:0 0 0 2px var(--color-primary-600)}.font-mono{font-family:var(--font-family-mono)}.font-sans{font-family:var(--font-family-sans)}@media(min-width: 640px){.sm\:px-3{padding-left:var(--spacing-3);padding-right:var(--spacing-3)}.sm\:flex{display:flex}.sm\:grid{display:grid}.sm\:block{display:block}.sm\:hidden{display:none}}@media(min-width: 768px){.md\:flex{display:flex}.md\:grid{display:grid}.md\:block{display:block}.md\:hidden{display:none}.md\:grid-cols-1{grid-template-columns:repeat(1, minmax(0, 1fr))}.md\:grid-cols-2{grid-template-columns:repeat(2, minmax(0, 1fr))}.md\:grid-cols-3{grid-template-columns:repeat(3, minmax(0, 1fr))}.md\:grid-cols-4{grid-template-columns:repeat(4, minmax(0, 1fr))}.md\:flex-row{flex-direction:row}.md\:flex-col{flex-direction:column}.md\:items-center{align-items:center}.md\:items-start{align-items:flex-start}.md\:justify-center{justify-content:center}.md\:justify-between{justify-content:space-between}.md\:justify-start{justify-content:flex-start}.md\:space-x-1>*+*{margin-left:var(--spacing-1)}.md\:space-x-2>*+*{margin-left:var(--spacing-2)}.md\:space-x-4>*+*{margin-left:var(--spacing-4)}.md\:space-y-1>*+*{margin-top:var(--spacing-1)}.md\:space-y-0>*+*{margin-top:0}.md\:px-3{padding-left:var(--spacing-3);padding-right:var(--spacing-3)}.md\:px-4{padding-left:var(--spacing-4);padding-right:var(--spacing-4)}.md\:py-2{padding-top:var(--spacing-2);padding-bottom:var(--spacing-2)}.md\:pt-2{padding-top:var(--spacing-2)}.md\:pb-3{padding-bottom:var(--spacing-3)}.md\:text-base{font-size:var(--font-size-base)}.md\:text-lg{font-size:var(--font-size-lg)}.md\:text-xl{font-size:var(--font-size-xl)}.md\:w-full{width:100%}.md\:h-auto{height:auto}}@media(min-width: 1024px){.lg\:flex{display:flex}.lg\:grid{display:grid}.lg\:block{display:block}.lg\:hidden{display:none}.lg\:grid-cols-1{grid-template-columns:repeat(1, minmax(0, 1fr))}.lg\:grid-cols-2{grid-template-columns:repeat(2, minmax(0, 1fr))}.lg\:grid-cols-3{grid-template-columns:repeat(3, minmax(0, 1fr))}.lg\:grid-cols-4{grid-template-columns:repeat(4, minmax(0, 1fr))}.lg\:flex-row{flex-direction:row}.lg\:flex-col{flex-direction:column}.lg\:items-center{align-items:center}.lg\:items-start{align-items:flex-start}.lg\:justify-center{justify-content:center}.lg\:justify-between{justify-content:space-between}.lg\:space-x-1>*+*{margin-left:var(--spacing-1)}.lg\:space-x-2>*+*{margin-left:var(--spacing-2)}.lg\:space-x-4>*+*{margin-left:var(--spacing-4)}.lg\:space-y-0>*+*{margin-top:0}.lg\:h-64{height:var(--spacing-64)}.lg\:h-80{height:var(--spacing-80)}.lg\:w-full{width:100%}}.container{width:100%;margin-left:auto;margin-right:auto}@media(min-width: 640px){.container{max-width:640px}}@media(min-width: 768px){.container{max-width:768px}}@media(min-width: 1024px){.container{max-width:1024px}}@media(min-width: 1280px){.container{max-width:1280px}}.gradient-primary{background:linear-gradient(to right, var(--color-primary-500), var(--color-primary-700))}.gradient-primary-vertical{background:linear-gradient(to bottom, var(--color-primary-500), var(--color-primary-700))}.gradient-primary-diagonal{background:linear-gradient(to bottom right, var(--color-primary-500), var(--color-primary-700))}.gradient-blue{background:linear-gradient(to right, var(--color-blue-600), var(--color-blue-800))}.gradient-green{background:linear-gradient(to right, var(--color-success-100), var(--color-success-600))}.gradient-blue-vertical{background:linear-gradient(to bottom, var(--color-blue-600), var(--color-blue-800))}.gradient-rainbow{background:linear-gradient(to right, var(--color-primary-600), var(--color-purple-600), var(--color-indigo-600), var(--color-blue-600))}.gradient-rainbow-vertical{background:linear-gradient(to bottom, var(--color-primary-600), var(--color-purple-600), var(--color-indigo-600), var(--color-blue-600))}.gradient-warm{background:linear-gradient(to right, var(--color-orange-600), var(--color-warning-600), var(--color-error-600))}.gradient-cool{background:linear-gradient(to right, var(--color-blue-600), var(--color-indigo-600), var(--color-purple-600))}.gradient-radial-primary{background:radial-gradient(circle, var(--color-primary-500), var(--color-primary-700))}.gradient-radial-blue{background:radial-gradient(circle, var(--color-blue-600), var(--color-blue-800))}.gradient-conic-primary{background:conic-gradient(from 0deg, var(--color-primary-500), var(--color-primary-700))}.gradient-conic-rainbow{background:conic-gradient(from 0deg, var(--color-primary-600), var(--color-purple-600), var(--color-indigo-600), var(--color-blue-600), var(--color-primary-600))}.text-gradient-primary{background:linear-gradient(to right, var(--color-primary-600), var(--color-primary-700));-webkit-background-clip:text;-webkit-text-fill-color:rgba(0,0,0,0);background-clip:text}.text-gradient-rainbow{background:linear-gradient(to right, var(--color-primary-600), var(--color-purple-600), var(--color-indigo-600), var(--color-blue-600));-webkit-background-clip:text;-webkit-text-fill-color:rgba(0,0,0,0);background-clip:text}.btn-gradient-primary{background:linear-gradient(to right, var(--color-primary-600), var(--color-primary-700));color:#fff;border:none;transition:var(--transition-default)}.btn-gradient-primary:hover{filter:brightness(1.1);transform:translateY(-1px)}.btn-gradient-primary{padding:var(--spacing-2) var(--spacing-4);border-radius:var(--border-radius-md);font-weight:var(--font-weight-medium);cursor:pointer}.btn-gradient-rainbow{background:linear-gradient(to right, var(--color-primary-600), var(--color-purple-600), var(--color-indigo-600), var(--color-blue-600));color:#fff;border:none;transition:var(--transition-default)}.btn-gradient-rainbow:hover{filter:brightness(1.1);transform:translateY(-1px)}.btn-gradient-rainbow{padding:var(--spacing-2) var(--spacing-4);border-radius:var(--border-radius-md);font-weight:var(--font-weight-medium);cursor:pointer}.card-gradient-primary{background:linear-gradient(to right, var(--color-primary-600), var(--color-primary-700));border-radius:var(--border-radius-lg);box-shadow:var(--shadow-md);padding:var(--spacing-6);color:#fff}.card-gradient-rainbow{background:linear-gradient(to right, var(--color-primary-600), var(--color-purple-600), var(--color-indigo-600), var(--color-blue-600));border-radius:var(--border-radius-lg);box-shadow:var(--shadow-md);padding:var(--spacing-6);color:#fff}.border-gradient-primary{position:relative}.border-gradient-primary::before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;border-radius:inherit;padding:2px;background:linear-gradient(to right, var(--color-primary-600), var(--color-primary-700));mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:xor;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor}.border-gradient-primary{border:2px solid rgba(0,0,0,0);background:#fff}.border-gradient-rainbow{position:relative}.border-gradient-rainbow::before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;border-radius:inherit;padding:2px;background:linear-gradient(to right, var(--color-primary-600), var(--color-purple-600), var(--color-indigo-600), var(--color-blue-600));mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:xor;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor}.border-gradient-rainbow{border:2px solid rgba(0,0,0,0);background:#fff}.overlay-gradient-primary{position:relative}.overlay-gradient-primary::before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(to right, var(--color-primary-600), var(--color-primary-700));opacity:.8;z-index:1}.overlay-gradient-primary>*{position:relative;z-index:2}.overlay-gradient-primary{position:relative}.overlay-gradient-rainbow{position:relative}.overlay-gradient-rainbow::before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(to right, var(--color-primary-600), var(--color-purple-600), var(--color-indigo-600), var(--color-blue-600));opacity:.8;z-index:1}.overlay-gradient-rainbow>*{position:relative;z-index:2}.overlay-gradient-rainbow{position:relative}