.app-container{display:flex;width:100%;min-height:100vh}.sidebar{width:260px;height:100vh;display:flex;flex-direction:column;transition:width .3s cubic-bezier(.4,0,.2,1);position:sticky;top:0;z-index:100;border-right:1px solid var(--border-color);background:var(--surface-color)}.sidebar.closed{width:80px}.sidebar-header{padding:24px;display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.logo-container{display:flex;align-items:center;gap:12px;overflow:hidden}.logo-icon{width:32px;height:32px;background:var(--accent-color);border-radius:8px;display:flex;align-items:center;justify-content:center;font-weight:800;color:#fff;flex-shrink:0;box-shadow:0 0 15px var(--accent-glow)}.logo-text{font-size:1.25rem;font-weight:800;white-space:nowrap}.sidebar.closed .logo-text{display:none}.sidebar-nav{flex:1;padding:0 16px}.nav-group{display:flex;flex-direction:column;gap:4px}.nav-group-title{font-size:.75rem;font-weight:600;color:var(--text-secondary);text-transform:uppercase;margin:16px 8px 8px}.sidebar.closed .nav-group-title{display:none}.nav-item{display:flex;align-items:center;gap:14px;padding:12px;border-radius:12px;color:var(--text-secondary);transition:all .2s ease;width:100%;text-align:left}.nav-item:hover{background:var(--surface-hover);color:var(--text-primary)}.nav-item.active{background:#3b82f61a;color:var(--accent-color);font-weight:600}.sidebar.closed .nav-label{display:none}.sidebar-footer{padding:24px 16px;border-top:1px solid var(--border-color)}.main-content{flex:1;display:flex;flex-direction:column;min-width:0}.top-header{height:80px;display:flex;align-items:center;justify-content:space-between;padding:0 40px;position:sticky;top:0;z-index:90}.header-search{display:flex;align-items:center;background:var(--surface-color);border:1px solid var(--border-color);border-radius:12px;padding:0 16px;width:400px;height:48px;transition:border-color .2s ease}.header-search:focus-within{border-color:var(--accent-color)}.search-icon{color:var(--text-secondary);margin-right:12px}.header-search input{background:none;border:none;color:var(--text-primary);width:100%;outline:none;font-size:.95rem}.header-actions{display:flex;align-items:center;gap:20px}.action-btn{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;color:var(--text-secondary);background:var(--surface-color);border:1px solid var(--border-color);transition:all .2s ease}.action-btn:hover{border-color:var(--accent-color);color:var(--text-primary)}.user-profile{display:flex;align-items:center;gap:12px}.user-avatar{width:40px;height:40px;border-radius:10px;background:var(--border-color);display:flex;align-items:center;justify-content:center;color:var(--text-secondary)}.view-container{padding:40px;flex:1}@media (max-width: 768px){.sidebar{position:fixed;left:-260px}.sidebar.open{left:0}.top-header{padding:0 20px}.header-search{width:auto;flex:1}.view-container{padding:20px}}:root{--bg-color: #0a0b10;--surface-color: #161821;--surface-hover: #1f2230;--accent-color: #3b82f6;--accent-glow: rgba(59, 130, 246, .5);--text-primary: #f8fafc;--text-secondary: #94a3b8;--border-color: #2d334a;--success-color: #10b981;--warning-color: #f59e0b;--danger-color: #ef4444;--card-shadow: 0 10px 30px -10px rgba(0, 0, 0, .5);--glass-bg: rgba(22, 24, 33, .7);--font-main: "Outfit", "Inter", -apple-system, sans-serif}*{margin:0;padding:0;box-sizing:border-box}body{background-color:var(--bg-color);color:var(--text-primary);font-family:var(--font-main);-webkit-font-smoothing:antialiased;overflow-x:hidden}#root{min-height:100vh;display:flex}h1,h2,h3,h4{font-weight:700;letter-spacing:-.02em}a{color:inherit;text-decoration:none}button{font-family:inherit;cursor:pointer;border:none;background:none}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--bg-color)}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:10px}::-webkit-scrollbar-thumb:hover{background:var(--text-secondary)}.glass{background:#1e293bb3;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.1)}.card{background-color:var(--surface-color);border:1px solid var(--border-color);border-radius:16px;padding:24px;box-shadow:var(--card-shadow);transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.card:hover{transform:translateY(-5px);border-color:var(--accent-color);box-shadow:0 15px 35px -5px #3b82f633,0 10px 10px -5px #0000001a}.card:after{content:"";position:absolute;top:0;left:-100%;width:50%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.05),transparent);transition:.6s;pointer-events:none}.card:hover:after{left:100%}.text-gradient{background:linear-gradient(135deg,#fff,#94a3b8);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}