@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";:root{--primary-blue: #2563ea;--primary-blue-hover: #1d4ed8;--bg-white: #ffffff;--bg-gray-light: #f8fafc;--border-light: #e2e8f0;--border-medium: #cbd5e1;--text-primary: #0f172a;--text-secondary: #64748b;--text-muted: #94a3b8}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,sans-serif;background-color:var(--bg-gray-light);color:var(--text-primary);-webkit-font-smoothing:antialiased;font-size:14px}.sidebar{position:fixed;top:0;left:0;height:100vh;width:260px;background-color:#fff;border-right:1px solid var(--border-light);display:flex;flex-direction:column;z-index:50}.content-wrapper{margin-left:260px;min-height:100vh;width:calc(100% - 260px);background-color:var(--bg-gray-light);display:flex;flex-direction:column}.sidebar-link{display:flex;align-items:center;gap:.75rem;padding:.875rem 1.75rem;color:var(--text-secondary);text-decoration:none;font-weight:500;font-size:.875rem;border-left:3px solid transparent;transition:all .2s;background:none;border:none;width:100%;text-align:left}.sidebar-link:hover{background-color:#f1f5f9;color:var(--text-primary)}.sidebar-link.active{background-color:#eff6ff;color:var(--primary-blue);border-left-color:var(--primary-blue)}.topbar{height:72px;background-color:#fff;border-bottom:1px solid var(--border-light);display:flex;align-items:center;justify-content:space-between;padding:0 2rem;position:sticky;top:0;z-index:40}.search-bar{display:flex;align-items:center;gap:.75rem;background-color:#f1f5f9;padding:.5rem 1rem;border-radius:6px;border:1px solid transparent;width:320px;transition:all .2s}.search-bar:focus-within{background-color:#fff;border-color:var(--primary-blue);box-shadow:0 0 0 3px #2563ea1a}.search-bar input{background:none;border:none;outline:none;width:100%;font-size:.875rem;color:var(--text-primary)}.search-bar input::placeholder{color:var(--text-muted)}.card{background:#fff;border-radius:8px;border:1px solid var(--border-light);box-shadow:0 1px 2px #0000000d;padding:1.5rem}.table{width:100%;border-collapse:collapse}.table th{text-align:left;padding:.75rem 1rem;background-color:#f8fafc;color:var(--text-secondary);font-weight:600;font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--border-light)}.table td{padding:1rem;border-bottom:1px solid var(--border-light);color:var(--text-primary)}.table tr:hover td{background-color:#f8fafc}.btn{display:inline-flex;align-items:center;justify-content:center;padding:.5rem 1rem;border-radius:6px;font-weight:500;font-size:.875rem;cursor:pointer;transition:all .2s;border:1px solid transparent;gap:.5rem}.btn-primary{background:var(--primary-blue);color:#fff}.btn-primary:hover{background:var(--primary-blue-hover)}.btn-outline{background:#fff;border-color:var(--border-medium);color:var(--text-primary)}.btn-outline:hover{background:#f8fafc;border-color:var(--text-secondary)}.flex{display:flex}.flex-col{flex-direction:column}.flex-row{flex-direction:row}.flex-1{flex:1}.items-center{align-items:center}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.gap-1{gap:.25rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-6{gap:1.5rem}.p-2{padding:.5rem}.p-3{padding:.75rem}.p-4{padding:1rem}.p-6{padding:1.5rem}.p-8{padding:2rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-4{padding-left:1rem;padding-right:1rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.mb-2{margin-bottom:.5rem}.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}.mr-1{margin-right:.25rem}.ml-auto{margin-left:auto}.w-full{width:100%}.h-full{height:100%}.w-8{width:2rem}.h-8{height:2rem}.w-10{width:2.5rem}.h-10{height:2.5rem}.relative{position:relative}.absolute{position:absolute}.fixed{position:fixed}.inset-0{inset:0}.z-50{z-index:50}.z-100{z-index:100}.top-1{top:.25rem}.right-1{right:.25rem}.text-sm{font-size:.875rem}.text-xs{font-size:.75rem}.text-lg{font-size:1.125rem}.text-xl{font-size:1.25rem}.text-2xl{font-size:1.5rem}.font-medium{font-weight:500}.font-semibold{font-weight:600}.font-bold{font-weight:700}.text-center{text-align:center}.text-right{text-align:right}.text-white{color:#fff}.text-muted{color:var(--text-secondary)}.text-primary{color:var(--text-primary)}.uppercase{text-transform:uppercase}.bg-slate-50{background-color:#f8fafc}.bg-slate-100{background-color:#f1f5f9}.bg-slate-200{background-color:#e2e8f0}.bg-blue-50{background-color:#eff6ff}.bg-blue-100{background-color:#dbeafe}.bg-green-100{background-color:#dcfce7}.bg-amber-100{background-color:#fef3c7}.bg-red-500{background-color:#ef4444}.bg-black\/50{background-color:#00000080}.text-blue-600{color:#2563eb}.text-green-600{color:#16a34a}.text-green-700{color:#15803d}.text-amber-700{color:#b45309}.text-red-600{color:#dc2626}.text-slate-400{color:#94a3b8}.text-slate-600{color:#475569}.rounded-lg{border-radius:.5rem}.rounded-xl{border-radius:.75rem}.rounded-full{border-radius:9999px}.border{border:1px solid var(--border-light)}.border-b{border-bottom:1px solid var(--border-light)}.border-t{border-top:1px solid var(--border-light)}.border-l{border-left:1px solid var(--border-light)}.border-dashed{border-style:dashed}.shadow-lg{box-shadow:0 10px 15px -3px #0000001a}.shadow-2xl{box-shadow:0 25px 50px -12px #00000040}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.opacity-0{opacity:0}.opacity-100,.group:hover .group-hover\:opacity-100{opacity:1}.transition-all{transition:all .3s ease}.modal-overlay{position:fixed;inset:0;background-color:#0009;display:flex;align-items:center;justify-content:center;z-index:100;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.aspect-square{aspect-ratio:1 / 1}.grid{display:grid}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}@media(min-width:768px){.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.md\:block{display:block}}@media(min-width:1024px){.lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}}.hidden{display:none}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.animate-spin{animation:spin 1s linear infinite}