:root{--primary: #6366f1;--primary-dark: #4f46e5;--primary-light: #818cf8;--secondary: #8b5cf6;--accent: #06b6d4;--accent-green: #10b981;--accent-red: #ef4444;--accent-yellow: #f59e0b;--accent-orange: #f97316;--bg-base: #f1f5f9;--bg-surface: #ffffff;--bg-card: #ffffff;--bg-card-hover: #f8faff;--bg-input: #f8fafc;--bg-primary: #ffffff;--bg-secondary: #f9fafb;--bg-tertiary: #f3f4f6;--border: rgba(99, 102, 241, .12);--border-hover: rgba(99, 102, 241, .32);--border-light: rgba(0, 0, 0, .06);--text-primary: #1e293b;--text-secondary: #475569;--text-muted: #94a3b8;--text-link: #6366f1;--text-tertiary: #94a3b8;--sidebar-width: 250px;--sidebar-collapsed: 64px;--topbar-height: 60px;--shadow-sm: 0 1px 3px rgba(0,0,0,.08);--shadow-md: 0 4px 20px rgba(99,102,241,.1);--shadow-lg: 0 8px 40px rgba(99,102,241,.14);--shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, .1);--shadow-glow: 0 0 24px rgba(99, 102, 241, .18);--radius-sm: 6px;--radius-md: 10px;--radius-lg: 16px;--radius-full: 9999px;--transition: .22s cubic-bezier(.4,0,.2,1);--transition-bounce: .35s cubic-bezier(.34, 1.56, .64, 1);--success: #10b981;--warning: #f59e0b;--error: #ef4444;--info: #3b82f6}body.dark-theme{--bg-primary: #111827;--bg-secondary: #1f2937;--bg-tertiary: #374151;--text-primary: #f9fafb;--text-secondary: #d1d5db;--text-tertiary: #9ca3af;--border: #374151;--border-light: #4b5563}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;background:var(--bg-secondary);color:var(--text-primary);line-height:1.6;overflow-x:hidden;transition:background var(--transition);animation:bodyFadeIn .4s ease}a{text-decoration:none;color:inherit}button{border:none;background:none;cursor:pointer;font-family:inherit}@keyframes bodyFadeIn{0%{opacity:0}to{opacity:1}}.sidebar{width:var(--sidebar-width);background:var(--bg-surface);border-right:1px solid var(--border-light);display:flex;flex-direction:column;position:fixed;top:0;left:0;height:100vh;z-index:1000;transition:width .3s cubic-bezier(.4,0,.2,1),box-shadow .3s ease;overflow:hidden;box-shadow:2px 0 16px #6366f112;animation:slideInLeft .35s cubic-bezier(.4,0,.2,1) both}@keyframes slideInLeft{0%{transform:translate(-100%);opacity:0}to{transform:translate(0);opacity:1}}.sidebar.collapsed{width:var(--sidebar-collapsed)}.sidebar.collapsed .logo-text,.sidebar.collapsed .nav-text,.sidebar.collapsed .badge,.sidebar.collapsed .sidebar-status .status-text,.sidebar.collapsed .sidebar-version,.sidebar.collapsed .user-details{opacity:0;width:0;overflow:hidden}.sidebar.collapsed .nav-item{justify-content:center;padding:10px}.sidebar-header{padding:20px 16px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border-light);min-height:64px}.logo{display:flex;align-items:center;gap:10px;color:var(--primary);font-size:18px;font-weight:700;white-space:nowrap;overflow:hidden}.logo i{font-size:22px;color:var(--primary);flex-shrink:0;animation:logoBounce .6s var(--transition-bounce) .2s both}@keyframes logoBounce{0%{transform:scale(0) rotate(-20deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}.logo-text{background:linear-gradient(135deg,var(--primary),var(--accent));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;transition:opacity var(--transition)}.sidebar-toggle{width:32px;height:32px;border-radius:var(--radius-sm);color:var(--text-secondary);display:flex;align-items:center;justify-content:center;transition:background var(--transition),color var(--transition),transform .3s ease}.sidebar-toggle:hover{background:#6366f11a;color:var(--primary);transform:rotate(90deg)}.sidebar-nav{flex:1;padding:12px 8px;overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column;gap:2px}.sidebar-nav::-webkit-scrollbar{width:4px}.sidebar-nav::-webkit-scrollbar-track{background:transparent}.sidebar-nav::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}.nav-item{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:var(--radius-md);color:var(--text-secondary);transition:all var(--transition);white-space:nowrap;overflow:hidden;position:relative}.nav-item:hover{background:#6366f112;color:var(--primary);transform:translate(3px)}.nav-item.active{background:linear-gradient(135deg,#6366f11f,#8b5cf612);color:var(--primary);border:1px solid rgba(99,102,241,.18);font-weight:600}.nav-item.active:before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:3px;height:60%;background:var(--primary);border-radius:0 2px 2px 0;animation:navIndicator .3s var(--transition-bounce)}@keyframes navIndicator{0%{height:0;opacity:0}to{height:60%;opacity:1}}.nav-item i,.nav-item svg{font-size:16px;width:20px;flex-shrink:0;text-align:center}.nav-text{font-size:13.5px;font-weight:500;transition:opacity var(--transition)}.nav-divider{height:1px;background:var(--border-light);margin:8px 4px}.nav-item.nav-system{background:linear-gradient(135deg,#6366f117,#8b5cf60f);border:1px solid rgba(99,102,241,.16);margin:2px 0;overflow:hidden}.nav-item.nav-system:after{content:"";position:absolute;top:0;left:-75%;width:50%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.09),transparent);animation:nav-system-shine 4s ease-in-out infinite;pointer-events:none}@keyframes nav-system-shine{0%{left:-75%;opacity:0}10%{opacity:1}50%{left:130%;opacity:1}51%{opacity:0}to{left:130%;opacity:0}}.nav-item.nav-system:hover{background:linear-gradient(135deg,#6366f133,#8b5cf624);border-color:#6366f152;transform:translate(4px);box-shadow:0 2px 14px #6366f12e;color:var(--primary)}.nav-item.nav-system.active{background:linear-gradient(135deg,#6366f13d,#8b5cf62e);border-color:#6366f15c;box-shadow:0 2px 14px #6366f12e}.nav-item.nav-system i{filter:drop-shadow(0 0 4px rgba(99,102,241,.45))}.badge{background:var(--error);color:#fff;padding:2px 8px;border-radius:12px;font-size:11px;font-weight:600;transition:opacity var(--transition)}.sidebar-footer{padding:12px 16px;border-top:1px solid var(--border-light);display:flex;flex-direction:column;gap:6px}.sidebar-status{display:flex;align-items:center;gap:8px;white-space:nowrap;overflow:hidden}.status-dot{width:8px;height:8px;border-radius:50%;background:var(--error);flex-shrink:0;animation:pulse-dot 2s infinite}.status-dot.online{background:var(--success)}@keyframes pulse-dot{0%,to{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(.8)}}.status-text{font-size:12px;color:var(--text-muted)}.sidebar-version{font-size:11px;color:var(--text-muted)}.main-content{margin-left:var(--sidebar-width);min-height:100vh;display:flex;flex-direction:column;transition:margin-left var(--transition)}.main-content.expanded{margin-left:var(--sidebar-collapsed)}.sidebar.collapsed~.main-content{margin-left:var(--sidebar-collapsed)}.topbar{height:var(--topbar-height);background:var(--bg-primary);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 30px;position:sticky;top:0;z-index:100}.topbar-left{display:flex;align-items:center;gap:20px}.page-title{font-size:24px;font-weight:700;color:var(--text-primary)}.topbar-right{display:flex;align-items:center;gap:16px}.btn-icon{width:40px;height:40px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;color:var(--text-secondary);transition:var(--transition);position:relative}.btn-icon:hover{background:var(--bg-secondary);color:var(--text-primary);transform:translateY(-2px)}#mobileSidebarToggle{display:none}.status-indicator{display:flex;align-items:center;gap:8px;padding:8px 16px;background:var(--bg-secondary);border-radius:var(--radius-md)}.status-dot{width:8px;height:8px;border-radius:50%;animation:pulse 2s infinite}.status-online{background:var(--success)}.status-text{font-size:14px;color:var(--text-secondary)}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.notification-btn{position:relative}.notification-badge{position:absolute;top:6px;right:6px;background:var(--error);color:#fff;font-size:10px;font-weight:700;padding:2px 5px;border-radius:10px;min-width:18px;text-align:center}.notifications-dropdown{position:absolute;top:calc(var(--topbar-height) + 10px);right:80px;width:380px;background:var(--bg-primary);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-xl);opacity:0;visibility:hidden;transform:translateY(-10px);transition:var(--transition);z-index:200}.notifications-dropdown.show{opacity:1;visibility:visible;transform:translateY(0)}.dropdown-header{padding:20px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}.dropdown-header h3{font-size:16px;font-weight:600}.btn-text{color:var(--primary);font-size:13px;font-weight:500;transition:var(--transition)}.btn-text:hover{color:var(--primary-dark)}.notifications-list{max-height:400px;overflow-y:auto}.notification-item{padding:16px 20px;border-bottom:1px solid var(--border);display:flex;gap:12px;transition:var(--transition);cursor:pointer}.notification-item:hover,.notification-item.unread{background:var(--bg-secondary)}.notification-icon{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0}.notification-icon.success{background:#10b9811a;color:var(--success)}.notification-icon.warning{background:#f59e0b1a;color:var(--warning)}.notification-icon.info{background:#3b82f61a;color:var(--info)}.notification-content{flex:1}.notification-title{font-size:14px;font-weight:500;color:var(--text-primary);margin-bottom:4px}.notification-time{font-size:12px;color:var(--text-secondary)}.dropdown-footer{padding:12px 20px;text-align:center;border-top:1px solid var(--border)}.user-menu-btn{width:40px;height:40px;border-radius:50%;overflow:hidden}.user-menu-btn img{width:100%;height:100%;object-fit:cover}.page-content{flex:1;padding:30px;animation:fadeIn .4s ease-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.card{background:var(--bg-primary);border:1px solid var(--border);border-radius:var(--radius-lg);padding:24px;box-shadow:var(--shadow-sm);transition:var(--transition)}.card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.card-header{margin-bottom:20px}.card-title{font-size:18px;font-weight:600;color:var(--text-primary);margin-bottom:4px}.card-subtitle{font-size:14px;color:var(--text-secondary)}.footer{background:var(--bg-primary);border-top:1px solid var(--border);padding:20px 30px;margin-top:auto}.footer-content{display:flex;align-items:center;justify-content:space-between}.footer-links{display:flex;gap:20px}.footer-links a{font-size:14px;color:var(--text-secondary);transition:var(--transition)}.footer-links a:hover{color:var(--primary)}.loading-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:9999;opacity:0;visibility:hidden;transition:var(--transition)}.loading-overlay.show{opacity:1;visibility:visible}.loading-spinner{text-align:center}.spinner{width:50px;height:50px;border:4px solid rgba(255,255,255,.2);border-top-color:#fff;border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 16px}@keyframes spin{to{transform:rotate(360deg)}}.loading-spinner p{color:#fff;font-size:16px;font-weight:500}.toast-container{position:fixed;top:90px;right:30px;z-index:9998;display:flex;flex-direction:column;gap:12px}.toast{background:var(--bg-primary);border:1px solid var(--border);border-radius:var(--radius-md);padding:16px;min-width:300px;box-shadow:var(--shadow-lg);display:flex;align-items:center;gap:12px;animation:slideIn .3s ease-out}@keyframes slideIn{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}.toast.success{border-left:4px solid var(--success)}.toast.error{border-left:4px solid var(--error)}.toast.warning{border-left:4px solid var(--warning)}.toast.info{border-left:4px solid var(--info)}@media(max-width:768px){.sidebar{transform:translate(-100%)}.sidebar.mobile-open{transform:translate(0)}.main-content{margin-left:0}#mobileSidebarToggle{display:flex}.page-content{padding:20px}.topbar{padding:0 20px}.page-title{font-size:20px}.notifications-dropdown{right:20px;left:20px;width:auto}.footer-content{flex-direction:column;gap:12px;text-align:center}}.user-menu{position:relative}.user-menu-btn{display:flex;align-items:center;gap:8px;width:auto;height:auto;border-radius:999px;background:none;border:0;cursor:pointer;padding:2px;color:var(--text-primary);font-family:inherit}.user-menu-btn img{width:36px;height:36px;border-radius:50%}.user-dropdown{display:none;position:absolute;right:0;top:calc(100% + 8px);min-width:200px;background:var(--bg-card);border:1px solid var(--border);border-radius:10px;box-shadow:var(--shadow-lg);padding:6px;z-index:1000}.user-dropdown.show{display:block}.user-dropdown a{display:flex;gap:10px;align-items:center;padding:9px 12px;border-radius:8px;color:var(--text-primary);text-decoration:none;font-size:14px}.user-dropdown a:hover{background:var(--bg-secondary)}.user-dropdown hr{border:0;border-top:1px solid var(--border);margin:6px 0}.a360-fab{position:fixed;right:24px;bottom:24px;z-index:900;display:flex;flex-direction:column;align-items:flex-end;gap:12px}.a360-btn{width:56px;height:56px;border-radius:50%;border:none;cursor:pointer;color:#fff;font-size:22px;background:linear-gradient(135deg,#667eea,#764ba2);box-shadow:0 8px 24px #667eea73;display:flex;align-items:center;justify-content:center;transition:transform .2s,box-shadow .2s}.a360-btn:hover{transform:translateY(-2px) scale(1.04);box-shadow:0 12px 30px #667eea8c}.a360-btn:focus-visible{outline:3px solid rgba(102,126,234,.5);outline-offset:3px}.a360-btn.open{background:#334155;box-shadow:0 8px 24px #0f172a59}.a360-pop{width:340px;max-width:calc(100vw - 48px);background:var(--bg-card, #fff);color:var(--text-primary, #1e293b);border:1px solid var(--border, #e5e7eb);border-radius:14px;box-shadow:0 20px 50px #0f172a40;padding:16px;animation:a360-in .18s ease-out}@keyframes a360-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.a360-pop-head{display:flex;gap:12px;align-items:center;margin-bottom:12px}.a360-pop-head>i{width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;font-size:16px;flex-shrink:0}.a360-pop-title{font-weight:700;font-size:15px}.a360-pop-sub{font-size:12px;color:var(--text-secondary, #64748b)}.a360-pop-form{display:flex;gap:8px}.a360-pop-form input{flex:1;min-width:0;padding:10px 12px;border:1px solid var(--border, #d1d5db);border-radius:10px;background:var(--bg-input, #f8fafc);color:var(--text-primary, #1e293b);font-size:13px;font-family:inherit}.a360-pop-form input:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea26}.a360-pop-form button{width:42px;border:none;border-radius:10px;cursor:pointer;color:#fff;background:linear-gradient(135deg,#667eea,#764ba2)}.a360-pop-link{display:inline-flex;gap:6px;align-items:center;margin-top:10px;font-size:12px;font-weight:600;color:#667eea;text-decoration:none}.a360-pop-link:hover{text-decoration:underline}@media(max-width:640px){.a360-fab{right:16px;bottom:16px}}@media(prefers-reduced-motion:reduce){.a360-pop{animation:none}.a360-btn{transition:none}}