:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}*{margin:0;padding:0;box-sizing:border-box}html,body{margin:0;padding:0;width:100%;height:100%;display:block}body{display:block!important;place-items:unset!important}.app{display:flex;flex-direction:column;height:100vh;width:100vw;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#fff;color:var(--color-neutral-800, #1e293b);margin:0;padding:0}.app-body{display:flex;flex:1;overflow:hidden;margin-top:64px}.main-content{flex:1;padding:32px;overflow-y:auto;background:#fff;margin-left:250px;min-height:calc(100vh - 64px)}.header{background:#fff;color:var(--color-neutral-800, #1e293b);padding:16px 32px;display:flex;justify-content:space-between;align-items:center;box-shadow:0 1px 2px #0000001a;border-bottom:1px solid var(--color-neutral-300, #cbd5e1);width:100vw;position:fixed;top:0;left:0;right:0;z-index:1000;margin:0;height:64px}.header-title{font-size:24px;font-weight:700;margin:0}.header-subtitle{font-size:14px;opacity:.8;margin:0}.header-info{display:flex;align-items:center;gap:24px;font-size:14px}.sidebar{width:250px;background:#fff;border-right:1px solid var(--color-neutral-300, #cbd5e1);color:var(--color-neutral-700, #374151);position:fixed;left:0;top:64px;bottom:0;padding:24px 0;overflow-y:auto;z-index:500;box-shadow:1px 0 2px #0000000d}.sidebar-nav{list-style:none;padding:0;margin:0}.sidebar-nav li{margin:0}.sidebar-nav a{display:flex;align-items:center;padding:12px 24px;color:var(--color-neutral-600, #64748b);text-decoration:none;transition:all .2s;gap:12px;font-size:13px}.sidebar-nav a:hover,.sidebar-nav a.active{background:var(--color-neutral-50, #f8fafc);color:var(--color-neutral-800, #1e293b);border-left:3px solid var(--color-accent, #059669);padding-left:21px}.sidebar-nav .nav-separator{height:1px;background:var(--color-neutral-200, #e2e8f0);margin:16px 24px;border:none}.dashboard-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px;margin-bottom:24px}.metric-card{background:#fff;border-radius:2px;padding:32px;box-shadow:0 1px 2px #0000000d;border:1px solid var(--color-neutral-200, #e2e8f0);transition:all .2s ease;position:relative;overflow:hidden}.metric-card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--color-accent, #059669)}.metric-card:hover{border-color:var(--color-neutral-400, #94a3b8);box-shadow:0 2px 4px #0000001a;transform:translateY(-1px)}.metric-card h3{margin:0 0 8px;font-size:14px;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.5px}.metric-value{font-size:32px;font-weight:700;margin:0;color:#1e293b}.metric-change{font-size:14px;margin-top:8px}.metric-change.positive{color:#059669}.metric-change.negative{color:#dc2626}.chart-container{background:#fff;border-radius:2px;padding:32px;box-shadow:0 1px 2px #0000000d;border:1px solid var(--color-neutral-200, #e2e8f0);margin-bottom:32px;transition:all .2s ease}.chart-container:hover{border-color:var(--color-neutral-400, #94a3b8);box-shadow:0 2px 4px #0000001a;transform:translateY(-1px)}.chart-title{font-size:18px;font-weight:600;margin:0 0 16px;color:#1e293b}.loading{display:flex;justify-content:center;align-items:center;height:200px;color:#64748b}@media (max-width: 768px){.sidebar{transform:translate(-100%);transition:transform .3s}.main-content{margin-left:0;padding:16px}.dashboard-grid{grid-template-columns:1fr}}.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 24px;border-radius:2px;border:1px solid var(--color-neutral-300, #d1d5db);background:#fff;color:var(--color-neutral-700, #374151);font-size:14px;font-weight:600;cursor:pointer;transition:all .2s ease;text-decoration:none;white-space:nowrap;box-shadow:0 1px 2px #0000000d}.btn:hover{background:var(--color-neutral-50, #f9fafb);border-color:var(--color-neutral-400, #94a3b8);color:var(--color-neutral-800, #1e293b);box-shadow:0 2px 4px #0000001a;transform:translateY(-1px)}.btn-primary{background:var(--color-primary, #1f2937);color:#fff;border-color:var(--color-primary, #1f2937);box-shadow:0 1px 2px #1f293733}.btn-primary:hover{background:var(--color-primary-dark, #111827);border-color:var(--color-primary-dark, #111827);color:#fff;box-shadow:0 2px 4px #1f29374d;transform:translateY(-1px)}:root{--color-primary: #374151;--color-primary-light: #64748b;--color-primary-dark: #1f2937;--color-secondary: #64748b;--color-secondary-light: #94a3b8;--color-secondary-dark: #475569;--color-accent: #059669;--color-accent-light: #10b981;--color-accent-dark: #047857;--color-success: #059669;--color-success-light: #10b981;--color-warning: #d97706;--color-error: #dc2626;--color-neutral-50: #f8fafc;--color-neutral-100: #f1f5f9;--color-neutral-200: #e2e8f0;--color-neutral-300: #cbd5e1;--color-neutral-400: #94a3b8;--color-neutral-500: #64748b;--color-neutral-600: #475569;--color-neutral-700: #334155;--color-neutral-800: #1e293b;--color-neutral-900: #0f172a;--border-thin: 1px solid;--border-normal: 1px solid;--border-thick: 1px solid;--border-ultra: 2px solid;--border-radius-none: 0px;--border-radius-sm: 2px;--border-radius-md: 4px;--border-radius-lg: 6px;--space-xs: 8px;--space-sm: 12px;--space-md: 16px;--space-lg: 24px;--space-xl: 32px;--space-2xl: 48px;--space-3xl: 64px;--space-4xl: 96px;--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;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-weight-black: 900;--shadow-sm: 0 2px 4px rgba(0, 0, 0, .05), 0 1px 2px rgba(0, 0, 0, .1);--shadow-md: 0 4px 8px rgba(0, 0, 0, .08), 0 2px 4px rgba(0, 0, 0, .12);--shadow-lg: 0 8px 16px rgba(0, 0, 0, .1), 0 4px 8px rgba(0, 0, 0, .15);--shadow-xl: 0 12px 24px rgba(0, 0, 0, .12), 0 6px 12px rgba(0, 0, 0, .18)}.card{background:#fff;border:var(--border-thin) var(--color-neutral-300);border-radius:var(--border-radius-sm);padding:var(--space-lg);box-shadow:var(--shadow-sm);transition:all .2s ease}.card:hover{border-color:var(--color-primary);box-shadow:var(--shadow-md);transform:translateY(-1px)}.card--elevated{border:var(--border-thick) var(--color-primary);box-shadow:var(--shadow-lg)}.card--success{border-color:var(--color-success);background:linear-gradient(135deg,#fff,#f0fdf4)}.card--warning{border-color:var(--color-warning);background:linear-gradient(135deg,#fff,#fffbeb)}.card--error{border-color:var(--color-error);background:linear-gradient(135deg,#fff,#fef2f2)}.btn{display:inline-flex;align-items:center;gap:var(--space-xs);padding:var(--space-sm) var(--space-lg);font-size:var(--text-sm);font-weight:var(--font-weight-semibold);border:var(--border-thin) var(--color-neutral-300);border-radius:var(--border-radius-sm);background:#fff;color:var(--color-neutral-700);cursor:pointer;transition:all .2s ease;text-decoration:none;white-space:nowrap}.btn:hover{border-color:var(--color-primary);color:var(--color-primary);box-shadow:var(--shadow-sm);transform:translateY(-1px)}.btn--primary{background:var(--color-primary);border-color:var(--color-primary);color:#fff}.btn--primary:hover{background:linear-gradient(135deg,var(--color-primary-dark) 0%,var(--color-primary) 100%);color:#fff;transform:translateY(-2px);box-shadow:var(--shadow-md)}.btn--secondary{background:linear-gradient(135deg,var(--color-neutral-100) 0%,var(--color-neutral-50) 100%);border-color:var(--color-neutral-400);color:var(--color-neutral-700)}.btn--accent{background:linear-gradient(135deg,var(--color-accent) 0%,var(--color-accent-light) 100%);border-color:var(--color-accent-dark);color:#fff}.btn--large{padding:var(--space-md) var(--space-xl);font-size:var(--text-lg);border-width:4px}.btn--small{padding:var(--space-xs) var(--space-sm);font-size:var(--text-xs);border-width:2px}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none!important}.input{width:100%;padding:var(--space-sm) var(--space-md);border:var(--border-normal) var(--color-neutral-300);border-radius:var(--border-radius-sm);font-size:var(--text-base);background:#fff;transition:all .2s ease}.input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #2563eb1a}.input--large{padding:var(--space-md) var(--space-lg);font-size:var(--text-lg);border-width:4px}.badge{display:inline-flex;align-items:center;gap:var(--space-xs);padding:4px var(--space-sm);font-size:var(--text-xs);font-weight:var(--font-weight-semibold);border:var(--border-thin) var(--color-neutral-300);border-radius:var(--border-radius-sm);background:var(--color-neutral-50);color:var(--color-neutral-700);text-transform:uppercase;letter-spacing:.025em}.badge--primary{background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-primary-light) 100%);border-color:var(--color-primary-dark);color:#fff}.badge--success{background:linear-gradient(135deg,var(--color-success) 0%,var(--color-success-light) 100%);border-color:var(--color-success);color:#fff}.badge--warning{background:linear-gradient(135deg,var(--color-warning) 0%,#fbbf24 100%);border-color:var(--color-warning);color:#fff}.badge--error{background:linear-gradient(135deg,var(--color-error) 0%,#ef4444 100%);border-color:var(--color-error);color:#fff}.metric-card{background:#fff;border:var(--border-thick) var(--color-neutral-200);border-radius:var(--border-radius-sm);padding:var(--space-lg);transition:all .3s ease;position:relative;overflow:hidden}.metric-card:before{content:"";position:absolute;top:0;left:0;right:0;height:6px;background:linear-gradient(90deg,var(--color-primary) 0%,var(--color-accent) 100%)}.metric-card:hover{border-color:var(--color-primary);box-shadow:var(--shadow-xl);transform:translateY(-4px)}.metric-card__header{display:flex;justify-content:between;align-items:center;margin-bottom:var(--space-lg)}.metric-card__title{font-size:var(--text-sm);font-weight:var(--font-weight-semibold);color:var(--color-neutral-600);text-transform:uppercase;letter-spacing:.05em;margin:0}.metric-card__value{font-size:var(--text-4xl);font-weight:var(--font-weight-black);color:var(--color-neutral-900);margin:0;line-height:1}.metric-card__change{display:flex;align-items:center;gap:var(--space-xs);margin-top:var(--space-md);font-size:var(--text-sm);font-weight:var(--font-weight-semibold)}.metric-card__change--positive{color:var(--color-success)}.metric-card__change--negative{color:var(--color-error)}.table{width:100%;border-collapse:separate;border-spacing:0;background:#fff;border:var(--border-normal) var(--color-neutral-200);border-radius:var(--border-radius-sm);overflow:hidden}.table th{background:linear-gradient(135deg,var(--color-neutral-50) 0%,var(--color-neutral-100) 100%);border-bottom:var(--border-normal) var(--color-neutral-200);padding:var(--space-md) var(--space-lg);text-align:left;font-weight:var(--font-weight-semibold);font-size:var(--text-sm);color:var(--color-neutral-700);text-transform:uppercase;letter-spacing:.025em}.table td{border-bottom:2px solid var(--color-neutral-100);padding:var(--space-md) var(--space-lg);font-size:var(--text-sm);color:var(--color-neutral-800)}.table tr:hover td{background:var(--color-neutral-50)}.table tr:last-child td{border-bottom:none}.container{max-width:1400px;margin:0 auto;padding:0 var(--space-lg)}.grid{display:grid;gap:var(--space-lg)}.grid--cols-2{grid-template-columns:repeat(2,1fr)}.grid--cols-3{grid-template-columns:repeat(3,1fr)}.grid--cols-4{grid-template-columns:repeat(4,1fr)}.grid--auto{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}.flex{display:flex}.flex--center{align-items:center;justify-content:center}.flex--between{justify-content:space-between}.flex--gap-sm{gap:var(--space-sm)}.flex--gap-md{gap:var(--space-md)}.flex--gap-lg{gap:var(--space-lg)}.p-xs{padding:var(--space-xs)}.p-sm{padding:var(--space-sm)}.p-md{padding:var(--space-md)}.p-lg{padding:var(--space-lg)}.p-xl{padding:var(--space-xl)}.p-2xl{padding:var(--space-2xl)}.m-xs{margin:var(--space-xs)}.m-sm{margin:var(--space-sm)}.m-md{margin:var(--space-md)}.m-lg{margin:var(--space-lg)}.m-xl{margin:var(--space-xl)}.m-2xl{margin:var(--space-2xl)}.mb-xs{margin-bottom:var(--space-xs)}.mb-sm{margin-bottom:var(--space-sm)}.mb-md{margin-bottom:var(--space-md)}.mb-lg{margin-bottom:var(--space-lg)}.mb-xl{margin-bottom:var(--space-xl)}.mb-2xl{margin-bottom:var(--space-2xl)}.mt-xs{margin-top:var(--space-xs)}.mt-sm{margin-top:var(--space-sm)}.mt-md{margin-top:var(--space-md)}.mt-lg{margin-top:var(--space-lg)}.mt-xl{margin-top:var(--space-xl)}.mt-2xl{margin-top:var(--space-2xl)}.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)}.font-normal{font-weight:var(--font-weight-normal)}.font-medium{font-weight:var(--font-weight-medium)}.font-semibold{font-weight:var(--font-weight-semibold)}.font-bold{font-weight:var(--font-weight-bold)}.font-black{font-weight:var(--font-weight-black)}.text-neutral-600{color:var(--color-neutral-600)}.text-neutral-700{color:var(--color-neutral-700)}.text-neutral-800{color:var(--color-neutral-800)}.text-neutral-900{color:var(--color-neutral-900)}.text-primary{color:var(--color-primary)}.text-success{color:var(--color-success)}.text-warning{color:var(--color-warning)}.text-error{color:var(--color-error)}.database-switcher{background:#fff;border:var(--border-thick) var(--color-primary);border-radius:var(--border-radius-sm);padding:var(--space-md) var(--space-lg);box-shadow:var(--shadow-lg);transition:all .3s ease}.database-switcher:hover{transform:translateY(-2px);box-shadow:var(--shadow-xl)}.benchmark-card{background:#fff;border:var(--border-thick) var(--color-accent);border-radius:var(--border-radius-sm);padding:var(--space-2xl);position:relative;overflow:hidden}.benchmark-card:before{content:"";position:absolute;top:0;left:0;right:0;height:8px;background:linear-gradient(90deg,var(--color-accent) 0%,var(--color-primary) 50%,var(--color-success) 100%)}.performance-indicator{display:inline-flex;align-items:center;gap:var(--space-xs);padding:var(--space-xs) var(--space-md);border:var(--border-normal);border-radius:var(--border-radius-sm);font-weight:var(--font-weight-semibold);font-size:var(--text-sm)}.performance-indicator--excellent{background:linear-gradient(135deg,var(--color-success) 0%,var(--color-success-light) 100%);border-color:var(--color-success);color:#fff}.performance-indicator--good{background:linear-gradient(135deg,var(--color-warning) 0%,#fbbf24 100%);border-color:var(--color-warning);color:#fff}.performance-indicator--poor{background:linear-gradient(135deg,var(--color-error) 0%,#ef4444 100%);border-color:var(--color-error);color:#fff}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--space-3xl);background:#fff;border:var(--border-normal) var(--color-neutral-200);border-radius:var(--border-radius-sm);min-height:200px}.loading-spinner{width:48px;height:48px;border:4px solid var(--color-neutral-200);border-top:4px solid var(--color-primary);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:var(--space-lg)}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (max-width: 768px){.grid--auto,.grid--cols-2,.grid--cols-3,.grid--cols-4{grid-template-columns:1fr}.metric-card{padding:var(--space-md)}.metric-card__value{font-size:var(--text-3xl)}.btn--large{padding:var(--space-sm) var(--space-lg);font-size:var(--text-base)}}@media (prefers-color-scheme: dark){:root{--color-neutral-50: #0f172a;--color-neutral-100: #1e293b;--color-neutral-200: #334155;--color-neutral-300: #475569;--color-neutral-400: #64748b;--color-neutral-500: #94a3b8;--color-neutral-600: #cbd5e1;--color-neutral-700: #e2e8f0;--color-neutral-800: #f1f5f9;--color-neutral-900: #f8fafc}}
