*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#fff;color:#0f172a;overflow-x:hidden}#app{width:100%;min-height:100vh}:root{--primary-50: #f0f9ff;--primary-100: #e0f2fe;--primary-200: #bae6fd;--primary-300: #7dd3fc;--primary-400: #38bdf8;--primary-500: #0ea5e9;--primary-600: #0284c7;--primary-700: #0369a1;--primary-800: #075985;--primary-900: #0c4a6e;--accent-50: #faf5ff;--accent-100: #f3e8ff;--accent-200: #e9d5ff;--accent-300: #d8b4fe;--accent-400: #c084fc;--accent-500: #a855f7;--accent-600: #9333ea;--accent-700: #7e22ce;--success-50: #f0fdf4;--success-100: #dcfce7;--success-500: #22c55e;--success-600: #16a34a;--success-700: #15803d;--warning-50: #fffbeb;--warning-100: #fef3c7;--warning-500: #f59e0b;--warning-600: #d97706;--danger-50: #fef2f2;--danger-100: #fee2e2;--danger-500: #ef4444;--danger-600: #dc2626;--danger-700: #b91c1c;--gray-50: #f9fafb;--gray-100: #f3f4f6;--gray-200: #e5e7eb;--gray-300: #d1d5db;--gray-400: #9ca3af;--gray-500: #6b7280;--gray-600: #4b5563;--gray-700: #374151;--gray-800: #1f2937;--gray-900: #111827;--gray-950: #030712;--bg-primary: #ffffff;--bg-secondary: #f9fafb;--bg-tertiary: #f3f4f6;--bg-elevated: #ffffff;--bg-overlay: rgba(0, 0, 0, .5);--bg-gradient: linear-gradient(135deg, #0ea5e9 0%, #a855f7 100%);--text-primary: #111827;--text-secondary: #374151;--text-tertiary: #6b7280;--text-muted: #9ca3af;--text-disabled: #d1d5db;--text-inverse: #ffffff;--border-subtle: #f3f4f6;--border-default: #e5e7eb;--border-strong: #d1d5db;--border-primary: #0ea5e9;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -2px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -4px rgba(0, 0, 0, .1);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 8px 10px -6px rgba(0, 0, 0, .1);--shadow-2xl: 0 25px 50px -12px rgba(0, 0, 0, .25);--shadow-glow: 0 0 30px rgba(14, 165, 233, .2);--shadow-colored: 0 10px 40px -10px rgba(14, 165, 233, .3);--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--space-16: 4rem;--radius-sm: .375rem;--radius-md: .5rem;--radius-lg: .75rem;--radius-xl: 1rem;--radius-2xl: 1.5rem;--radius-full: 9999px;--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;--font-mono: "SF Mono", Monaco, "Cascadia Code", "Roboto Mono", Consolas, "Courier New", monospace;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 1.875rem;--text-4xl: 2.25rem;--text-5xl: 3rem;--font-normal: 400;--font-medium: 500;--font-semibold: 600;--font-bold: 700;--font-extrabold: 800;--leading-tight: 1.25;--leading-snug: 1.375;--leading-normal: 1.5;--leading-relaxed: 1.625;--leading-loose: 2;--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-bounce: .4s cubic-bezier(.16, 1, .3, 1);--z-base: 0;--z-dropdown: 1000;--z-sticky: 1100;--z-fixed: 1200;--z-modal-backdrop: 1300;--z-modal: 1400;--z-popover: 1500;--z-tooltip: 1600}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}body{font-family:var(--font-sans);background:var(--bg-primary);color:var(--text-secondary);line-height:var(--leading-normal);overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.text-xs{font-size:var(--text-xs)}.text-sm{font-size:var(--text-sm)}.text-base{font-size:var(--text-base)}.text-lg{font-size:var(--text-lg)}.text-xl{font-size:var(--text-xl)}.text-2xl{font-size:var(--text-2xl)}.text-3xl{font-size:var(--text-3xl)}.text-4xl{font-size:var(--text-4xl)}.text-5xl{font-size:var(--text-5xl)}.font-normal{font-weight:var(--font-normal)}.font-medium{font-weight:var(--font-medium)}.font-semibold{font-weight:var(--font-semibold)}.font-bold{font-weight:var(--font-bold)}.font-extrabold{font-weight:var(--font-extrabold)}.text-primary{color:var(--text-primary)}.text-secondary{color:var(--text-secondary)}.text-tertiary{color:var(--text-tertiary)}.text-muted{color:var(--text-muted)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-3) var(--space-6);font-size:var(--text-base);font-weight:var(--font-semibold);line-height:1;border:none;border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-base);white-space:nowrap;-webkit-user-select:none;user-select:none}.btn:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.btn-primary{background:linear-gradient(135deg,var(--primary-500) 0%,var(--accent-600) 100%);color:var(--text-inverse);box-shadow:var(--shadow-colored)}.btn-primary:hover:not(:disabled){background:linear-gradient(135deg,var(--primary-600) 0%,var(--accent-700) 100%);transform:translateY(-2px);box-shadow:0 12px 24px -8px #0ea5e966}.btn-primary:active:not(:disabled){transform:translateY(0)}.btn-secondary{background:var(--bg-primary);color:var(--text-secondary);border:2px solid var(--border-default)}.btn-secondary:hover:not(:disabled){background:var(--bg-secondary);border-color:var(--border-primary);color:var(--primary-600);transform:translateY(-1px)}.btn-ghost{background:transparent;color:var(--text-secondary)}.btn-ghost:hover:not(:disabled){background:var(--bg-secondary);color:var(--text-primary)}.btn-danger{background:linear-gradient(135deg,var(--danger-500) 0%,var(--danger-600) 100%);color:#fff;box-shadow:0 4px 12px #ef44444d}.btn-danger:hover:not(:disabled){background:linear-gradient(135deg,var(--danger-600) 0%,var(--danger-700) 100%);transform:translateY(-2px)}.btn-success{background:linear-gradient(135deg,var(--success-500) 0%,var(--success-600) 100%);color:#fff;box-shadow:0 4px 12px #22c55e4d}.btn-success:hover:not(:disabled){background:linear-gradient(135deg,var(--success-600) 0%,var(--success-700) 100%);transform:translateY(-2px)}.btn-sm{padding:var(--space-2) var(--space-4);font-size:var(--text-sm)}.btn-lg{padding:var(--space-4) var(--space-8);font-size:var(--text-lg)}.btn-icon{padding:var(--space-3);aspect-ratio:1}.card{background:var(--bg-elevated);border:1px solid var(--border-default);border-radius:var(--radius-xl);padding:var(--space-6);transition:all var(--transition-base);box-shadow:var(--shadow-sm)}.card:hover{border-color:var(--border-strong);box-shadow:var(--shadow-lg);transform:translateY(-2px)}.card-elevated{background:var(--bg-elevated);box-shadow:var(--shadow-xl)}.card-interactive{cursor:pointer}.card-interactive:hover{transform:translateY(-2px);border-color:var(--border-primary);box-shadow:var(--shadow-glow)}.input-group{display:flex;flex-direction:column;gap:var(--space-2)}.input-label{font-size:var(--text-sm);font-weight:var(--font-medium);color:var(--text-tertiary)}.input-wrapper{position:relative;display:flex;align-items:center}.input-icon{position:absolute;left:var(--space-4);width:20px;height:20px;color:var(--text-muted);pointer-events:none;transition:color var(--transition-base)}.input,input[type=text],input[type=email],input[type=password],input[type=number],textarea,select{width:100%;padding:var(--space-3) var(--space-4);background:var(--bg-primary);border:2px solid var(--border-default);border-radius:var(--radius-lg);color:var(--text-primary);font-size:var(--text-base);font-family:var(--font-sans);transition:all var(--transition-base)}.input-wrapper .input,.input-wrapper input{padding-left:var(--space-12)}.input:focus,input:focus,textarea:focus,select:focus{outline:none;background:var(--bg-primary);border-color:var(--border-primary);box-shadow:0 0 0 4px #0ea5e91a}.input:focus~.input-icon,input:focus~.input-icon{color:var(--primary-400)}.input::placeholder,input::placeholder,textarea::placeholder{color:var(--text-disabled)}.input-error{border-color:var(--danger-500)}.input-error:focus{border-color:var(--danger-500);box-shadow:0 0 0 4px #ef44441a}.badge{display:inline-flex;align-items:center;gap:var(--space-1);padding:var(--space-1) var(--space-3);font-size:var(--text-xs);font-weight:var(--font-semibold);border-radius:var(--radius-full);white-space:nowrap}.badge-primary{background:#3b82f61a;color:var(--primary-400);border:1px solid rgba(59,130,246,.2)}.badge-success{background:#22c55e1a;color:var(--success-400);border:1px solid rgba(34,197,94,.2)}.badge-warning{background:#f59e0b1a;color:var(--warning-400);border:1px solid rgba(245,158,11,.2)}.badge-danger{background:#ef44441a;color:var(--danger-400);border:1px solid rgba(239,68,68,.2)}.badge-neutral{background:#ffffff0d;color:var(--text-tertiary);border:1px solid var(--border-default)}.spinner{width:40px;height:40px;border:3px solid var(--border-default);border-top-color:var(--primary-500);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.skeleton{background:linear-gradient(90deg,var(--gray-100) 25%,var(--gray-200) 50%,var(--gray-100) 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:var(--radius-md)}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.flex{display:flex}.inline-flex{display:inline-flex}.grid{display:grid}.items-center{align-items:center}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.justify-start{justify-content:flex-start}.justify-end{justify-content:flex-end}.flex-col{flex-direction:column}.flex-row{flex-direction:row}.gap-1{gap:var(--space-1)}.gap-2{gap:var(--space-2)}.gap-3{gap:var(--space-3)}.gap-4{gap:var(--space-4)}.gap-6{gap:var(--space-6)}.gap-8{gap:var(--space-8)}.text-left{text-align:left}.text-right{text-align:right}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.transition{transition:all var(--transition-base)}.transition-fast{transition:all var(--transition-fast)}.transition-slow{transition:all var(--transition-slow)}.hidden{display:none!important}.text-center{text-align:center}.mt-1{margin-top:.5rem}.mt-2{margin-top:1rem}.mt-3{margin-top:1.5rem}.mb-1{margin-bottom:.5rem}.mb-2{margin-bottom:1rem}.mb-3{margin-bottom:1.5rem}.admin-panel{min-height:100vh;background:#f8fafc}.login-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#fff,#f8fafc);padding:var(--space-4)}.login-box{width:100%;max-width:420px;background:#fff;border:1px solid #e2e8f0;border-radius:var(--radius-2xl);padding:var(--space-10);box-shadow:0 10px 40px #00000014}.login-header{text-align:center;margin-bottom:var(--space-8)}.login-icon{width:64px;height:64px;margin:0 auto var(--space-4);background:linear-gradient(135deg,#06b6d4,#8b5cf6);border-radius:var(--radius-xl);display:flex;align-items:center;justify-content:center;box-shadow:0 8px 20px #3b82f640}.login-icon svg{width:32px;height:32px;color:#fff}.login-header h1{font-size:var(--text-3xl);font-weight:var(--font-extrabold);color:#0f172a;margin-bottom:var(--space-2)}.login-header p{color:#64748b;font-size:var(--text-base)}.login-box form{display:flex;flex-direction:column;gap:var(--space-6)}.login-box .input-group{gap:var(--space-3)}.login-box label{font-size:var(--text-sm);font-weight:var(--font-semibold);color:#475569}.password-input{padding:var(--space-4);font-size:var(--text-base);background:#f8fafc;border:1px solid #e2e8f0;border-radius:var(--radius-lg);color:#0f172a;transition:all .3s}.password-input:focus{outline:none;background:#fff;border-color:#3b82f6;box-shadow:0 0 0 4px #3b82f61a}.btn-login{padding:var(--space-4);font-size:var(--text-base);font-weight:var(--font-bold);background:linear-gradient(135deg,#06b6d4,#8b5cf6);color:#fff;border:none;border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-base);box-shadow:0 4px 12px #3b82f640}.btn-login:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px #3b82f659}.btn-login:disabled{opacity:.6;cursor:not-allowed}.login-box .error{margin-top:var(--space-4);padding:var(--space-3) var(--space-4);background:#fef2f2;border:1px solid #fecaca;border-radius:var(--radius-md);color:#dc2626;font-size:var(--text-sm);text-align:center}.dashboard-layout{display:flex;min-height:100vh;background:#f8fafc}.sidebar{width:280px;background:#fff;border-right:1px solid #e2e8f0;display:flex;flex-direction:column;position:fixed;left:0;top:0;bottom:0;z-index:var(--z-fixed)}.sidebar-header{padding:var(--space-6);border-bottom:1px solid #e2e8f0;display:flex;align-items:center;gap:var(--space-4)}.brand-logo{width:48px;height:48px;background:linear-gradient(135deg,#06b6d4,#8b5cf6);border-radius:var(--radius-xl);display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 4px 12px #3b82f640}.brand-logo svg{width:24px;height:24px;color:#fff}.sidebar-header h2{font-size:var(--text-xl);font-weight:var(--font-bold);color:#0f172a}.sidebar-nav{flex:1;padding:var(--space-4);overflow-y:auto}.nav-item{width:100%;display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:transparent;border:none;border-radius:var(--radius-lg);color:#64748b;font-size:var(--text-base);font-weight:var(--font-medium);text-align:left;cursor:pointer;transition:all var(--transition-base);margin-bottom:var(--space-2)}.nav-item:hover{background:#f8fafc;color:#475569}.nav-item.active{background:linear-gradient(135deg,#06b6d41a,#8b5cf61a);color:#3b82f6;font-weight:var(--font-semibold);border:1px solid rgba(59,130,246,.2)}.nav-icon{width:20px;height:20px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.nav-icon svg{width:100%;height:100%}.sidebar-footer{padding:var(--space-4);border-top:1px solid #e2e8f0}.btn-logout{width:100%;display:flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-3) var(--space-4);background:#fef2f2;border:1px solid #fecaca;border-radius:var(--radius-lg);color:#dc2626;font-size:var(--text-sm);font-weight:var(--font-semibold);cursor:pointer;transition:all var(--transition-base)}.btn-logout:hover{background:#fee2e2;border-color:#fca5a5;transform:translateY(-1px)}.btn-logout svg{width:18px;height:18px}.main-content{flex:1;margin-left:280px;display:flex;flex-direction:column;min-height:100vh}.top-header{padding:var(--space-6) var(--space-8);background:#fff;border-bottom:1px solid #e2e8f0;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:var(--z-sticky);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.top-header h1{font-size:var(--text-3xl);font-weight:var(--font-extrabold);color:#0f172a}.user-badge{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-4);background:#f8fafc;border:1px solid #e2e8f0;border-radius:var(--radius-full)}.avatar{width:32px;height:32px;background:linear-gradient(135deg,#06b6d4,#8b5cf6);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:var(--font-bold);font-size:var(--text-sm)}.user-badge span{color:#475569;font-size:var(--text-sm);font-weight:var(--font-medium)}.content-scroll{flex:1;overflow-y:auto;background:#f8fafc}.content-wrapper{padding:var(--space-8);max-width:1400px;margin:0 auto}.tab-pane{animation:fadeIn .3s ease-in-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.admin-overview{display:flex;flex-direction:column;gap:var(--space-6)}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--space-6)}.card{background:#fff;border:1px solid #e2e8f0;border-radius:var(--radius-xl);padding:var(--space-6);transition:all var(--transition-base);box-shadow:0 1px 3px #0000000d}.card:hover{border-color:#cbd5e1;transform:translateY(-2px);box-shadow:0 8px 24px #00000014}.card h3{font-size:var(--text-base);font-weight:var(--font-semibold);color:#64748b;margin-bottom:var(--space-4);display:flex;align-items:center;gap:var(--space-2)}.card .stat{font-size:var(--text-4xl);font-weight:var(--font-extrabold);color:#0f172a;margin-bottom:var(--space-2);line-height:1}.card .stat-label{font-size:var(--text-sm);color:#64748b}.card.full-width{grid-column:1 / -1}.services{display:flex;flex-direction:column;gap:var(--space-4);margin-top:var(--space-4)}.service{display:flex;align-items:center;justify-content:space-between;padding:var(--space-4);background:#f8fafc;border:1px solid #e2e8f0;border-radius:var(--radius-lg);transition:all var(--transition-base)}.service:hover{background:#fff;border-color:#cbd5e1}.service-name{font-size:var(--text-base);font-weight:var(--font-medium);color:#475569}.status-badge{padding:var(--space-1) var(--space-3);font-size:var(--text-xs);font-weight:var(--font-semibold);border-radius:var(--radius-full);text-transform:capitalize}.status-badge.healthy{background:#ecfdf5;color:#059669;border:1px solid #a7f3d0}.status-badge.unhealthy{background:#fef2f2;color:#dc2626;border:1px solid #fecaca}@media (max-width: 1024px){.sidebar{width:240px}.main-content{margin-left:240px}.content-wrapper{padding:var(--space-6)}}@media (max-width: 768px){.sidebar{transform:translate(-100%);transition:transform var(--transition-base)}.sidebar.open{transform:translate(0)}.main-content{margin-left:0}.top-header{padding:var(--space-4) var(--space-6)}.top-header h1{font-size:var(--text-2xl)}.content-wrapper{padding:var(--space-4)}.cards{grid-template-columns:1fr}}@media (prefers-color-scheme: dark){.card{background:#1e293b99;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.service{background:#0f172a66}}@media print{.sidebar,.top-header,.btn-logout{display:none}.main-content{margin-left:0}.card{break-inside:avoid;page-break-inside:avoid}}.loading-box{text-align:center;background:transparent;box-shadow:none;border:none}.loading-text{margin-top:var(--space-4);color:#64748b;font-size:var(--text-base)}