:root{--bg-primary:#f8fafc;--bg-secondary:#fff;--bg-sidebar:#0f172a;--text-primary:#1e293b;--text-secondary:#64748b;--text-sidebar:#f8fafc;--text-sidebar-muted:#94a3b8;--accent-primary:#6366f1;--accent-hover:#4f46e5;--accent-light:#6366f11a;--danger:#ef4444;--danger-light:#ef44441a;--success:#10b981;--success-light:#10b9811a;--border-color:#e2e8f0;--border-sidebar:#1e293b;--shadow-sm:0 1px 2px 0 #0000000d;--shadow-md:0 4px 6px -1px #0000001a, 0 2px 4px -2px #0000001a;--shadow-lg:0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a;--shadow-glass:0 8px 32px 0 #1f268712;--radius-sm:.375rem;--radius-md:.5rem;--radius-lg:1rem;--radius-xl:1.5rem;--font-sans:"Inter", system-ui, -apple-system, sans-serif;--font-heading:"Outfit", system-ui, -apple-system, sans-serif;--transition-fast:.15s cubic-bezier(.4, 0, .2, 1);--transition-normal:.3s cubic-bezier(.4, 0, .2, 1)}@media (prefers-color-scheme:dark){:root{--bg-primary:#0f172a;--bg-secondary:#1e293b;--bg-sidebar:#0b1120;--text-primary:#f8fafc;--text-secondary:#cbd5e1;--text-sidebar:#f8fafc;--text-sidebar-muted:#94a3b8;--accent-primary:#818cf8;--accent-hover:#6366f1;--accent-light:#818cf826;--border-color:#334155;--border-sidebar:#1e293b;--shadow-md:0 4px 6px -1px #0006, 0 2px 4px -2px #0006;--shadow-lg:0 10px 15px -3px #00000080, 0 4px 6px -4px #00000080;--shadow-glass:0 8px 32px 0 #0000004d}}*{box-sizing:border-box}body{font-family:var(--font-sans);background-color:var(--bg-primary);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;line-height:1.5}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);color:var(--text-primary);letter-spacing:-.02em;font-weight:600}h1{font-size:2.5rem}h2{font-size:1.875rem}h3{font-size:1.5rem}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--text-secondary)}#root{flex-direction:column;min-height:100vh;display:flex}.dashboard{background-color:var(--bg-primary);width:100vw;height:100vh;display:flex;overflow:hidden}.sidebar{background-color:var(--bg-sidebar);width:280px;color:var(--text-sidebar);border-right:1px solid var(--border-sidebar);box-shadow:var(--shadow-md);z-index:10;transition:var(--transition-normal);flex-direction:column;padding:24px 16px;display:flex}.sidebar h2{text-align:left;color:var(--text-sidebar);letter-spacing:-.03em;background:linear-gradient(135deg,#a5b4fc 0%,#818cf8 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;padding-left:12px;font-size:1.5rem;font-weight:700}.sidebar button{color:var(--text-sidebar-muted);text-align:left;cursor:pointer;border-radius:var(--radius-md);transition:var(--transition-fast);background:0 0;border:none;align-items:center;gap:12px;margin-bottom:8px;padding:12px 16px;font-size:.95rem;font-weight:500;display:flex}.sidebar button:hover{color:var(--text-sidebar);background-color:#ffffff0d;transform:translate(4px)}.sidebar button.active{background-color:var(--accent-light);color:var(--accent-primary);box-shadow:inset 3px 0 0 0 var(--accent-primary);font-weight:600}.logout-btn{border-top:1px solid #ffffff0d;margin-top:auto;color:#fca5a5!important;border-radius:0!important;padding-top:20px!important}.logout-btn:hover{color:#ef4444!important;background-color:#ef44441a!important;transform:translate(0)!important}.main-content{background-color:var(--bg-primary);flex:1;padding:40px 60px;position:relative;overflow-y:auto}.main-content:before{content:"";background:linear-gradient(180deg, var(--bg-secondary) 0%, transparent 100%);opacity:.5;pointer-events:none;height:200px;position:absolute;top:0;left:0;right:0}.card{background:var(--bg-secondary);border-radius:var(--radius-xl);box-shadow:var(--shadow-glass);border:1px solid var(--border-color);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);max-width:680px;margin:0 auto;padding:40px;animation:.4s ease-out slideUp}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.card h2{color:var(--text-primary);margin-top:0;margin-bottom:32px;font-size:1.75rem}.form-group{margin-bottom:24px}.form-group label{color:var(--text-secondary);margin-bottom:8px;font-size:.875rem;font-weight:600;display:block}.form-control{background-color:var(--bg-primary);border:1px solid var(--border-color);width:100%;color:var(--text-primary);border-radius:var(--radius-md);font-size:.95rem;font-family:var(--font-sans);transition:var(--transition-fast);box-sizing:border-box;padding:12px 16px}.form-control:focus{border-color:var(--accent-primary);box-shadow:0 0 0 3px var(--accent-light);background-color:var(--bg-secondary);outline:none}.btn{background-color:var(--accent-primary);color:#fff;border-radius:var(--radius-md);cursor:pointer;transition:var(--transition-fast);box-shadow:var(--shadow-md);border:none;justify-content:center;align-items:center;width:100%;padding:12px 24px;font-size:1rem;font-weight:600;display:flex}.btn:hover{background-color:var(--accent-hover);box-shadow:var(--shadow-lg);transform:translateY(-1px)}.btn:active{transform:translateY(0)}.alert{border-radius:var(--radius-md);margin-top:24px;padding:16px;font-size:.95rem;font-weight:500;animation:.3s ease-out fadeIn}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.alert-success{background-color:var(--success-light);color:var(--success);border:1px solid #10b98133}.alert-error{background-color:var(--danger-light);color:var(--danger);border:1px solid #ef444433}.login-container{background-color:var(--bg-primary);background-image:radial-gradient(at 0 0,#6366f126 0,#0000 50%),radial-gradient(at 100% 100%,#818cf826 0,#0000 50%);justify-content:center;align-items:center;height:100vh;display:flex}.login-card{background:var(--bg-secondary);border-radius:var(--radius-xl);box-shadow:var(--shadow-glass);border:1px solid var(--border-color);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);width:100%;max-width:440px;padding:48px}.login-card h2{text-align:center;color:var(--text-primary);margin-bottom:32px;font-size:2rem}.list-item{background:var(--bg-primary);border:1px solid var(--border-color);border-radius:var(--radius-md);transition:var(--transition-fast);justify-content:space-between;align-items:center;margin-bottom:12px;padding:16px;display:flex}.list-item:hover{box-shadow:var(--shadow-sm);border-color:var(--accent-light);transform:scale(1.01)}.list-item strong{color:var(--text-primary);font-size:1rem}.list-item span{color:var(--text-secondary)}.dashboard-container{background-color:#f8fafc;min-height:100vh;display:flex}.sidebar{background-color:#fff;border-right:1px solid #e2e8f0;flex-direction:column;width:260px;height:100vh;padding:1.5rem;display:flex;position:sticky;top:0}.sidebar-header{color:#2563eb;align-items:center;gap:12px;margin-bottom:2rem;display:flex}.sidebar-nav{flex-direction:column;flex:1;gap:.5rem;display:flex}.nav-item{color:#64748b;border-radius:8px;align-items:center;gap:12px;padding:.75rem 1rem;text-decoration:none;transition:all .2s;display:flex}.nav-item:hover{color:#0f172a;background-color:#f1f5f9}.nav-item.active{color:#2563eb;background-color:#eff6ff;font-weight:600}.logout-btn{color:#ef4444;cursor:pointer;background:0 0;border:none;border-radius:8px;align-items:center;gap:12px;width:100%;padding:.75rem 1rem;transition:background .2s;display:flex}.logout-btn:hover{background-color:#fef2f2}.main-content{flex:1;padding:2rem}