@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";:root{--primary-color: #2563EB;--secondary-color: #06B6D4;--accent-color: #14B8A6;--bg-color: #F8FAFC;--surface-color: #ffffff;--text-primary: #1E293B;--text-secondary: #64748B;--border-color: #E2E8F0;--sidebar-width: 260px;--topbar-height: 72px;--shadow-sm: 0 4px 6px -1px rgba(0, 0, 0, .05);--shadow-md: 0 10px 15px -3px rgba(0, 0, 0, .05);--shadow-lg: 0 20px 25px -5px rgba(0, 0, 0, .05);--border-radius: 16px;--spacing: 24px}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,system-ui,-apple-system,sans-serif;background-color:var(--bg-color);color:var(--text-primary);-webkit-font-smoothing:antialiased}.app-container{display:flex;height:100vh;overflow:hidden;background-color:var(--bg-color)}.sidebar{width:var(--sidebar-width);background-color:var(--surface-color);border-right:1px solid var(--border-color);display:flex;flex-direction:column;transition:width .3s ease;z-index:10}.sidebar-logo{height:var(--topbar-height);display:flex;align-items:center;padding:0 var(--spacing);font-size:1.25rem;font-weight:700;color:var(--primary-color);border-bottom:1px solid var(--border-color)}.sidebar-nav{padding:var(--spacing) 12px;display:flex;flex-direction:column;gap:8px;overflow-y:auto}.nav-item{display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:var(--border-radius);color:var(--text-secondary);text-decoration:none;font-weight:500;transition:all .2s;position:relative}.nav-item:hover{background-color:#2563eb0d;color:var(--primary-color)}.nav-item.active{background-color:#2563eb1a;color:var(--primary-color)}.nav-item.active:before{content:"";position:absolute;left:-12px;top:50%;transform:translateY(-50%);width:4px;height:24px;background-color:var(--primary-color);border-radius:0 4px 4px 0}.main-wrapper{flex:1;display:flex;flex-direction:column;overflow:hidden}.top-nav{height:var(--topbar-height);background-color:var(--surface-color);border-bottom:1px solid var(--border-color);display:flex;align-items:center;justify-content:space-between;padding:0 var(--spacing);position:sticky;top:0;z-index:20;box-shadow:var(--shadow-sm)}.main-content{flex:1;overflow-y:auto;padding:var(--spacing)}.grid-layout{display:grid;gap:var(--spacing)}@media (min-width: 768px){.grid-layout{grid-template-columns:repeat(2,1fr)}}@media (min-width: 1024px){.grid-layout{grid-template-columns:repeat(4,1fr)}}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-4{gap:16px}.gap-6{gap:24px}