:root{--bg-primary: #0a0a0f;--bg-secondary: #12121a;--bg-card: #16161f;--text-primary: #ffffff;--text-secondary: rgba(255, 255, 255, .65);--text-muted: rgba(255, 255, 255, .4);--text-faint: rgba(255, 255, 255, .35);--border-color: rgba(255, 255, 255, .06);--accent: #4ade80;--accent-bg: rgba(74, 222, 128, .12);--hover-bg: rgba(255, 255, 255, .06);--control-bg: rgba(255, 255, 255, .05);--icon-color: rgba(255, 255, 255, .55);--icon-hover: #ffffff}.light-theme{--bg-primary: #f5f5f7;--bg-secondary: #ffffff;--bg-card: #ffffff;--text-primary: #1a1a2e;--text-secondary: rgba(0, 0, 0, .65);--text-muted: rgba(0, 0, 0, .4);--text-faint: rgba(0, 0, 0, .35);--border-color: rgba(0, 0, 0, .08);--accent: #16a34a;--accent-bg: rgba(22, 163, 74, .1);--hover-bg: rgba(0, 0, 0, .04);--control-bg: rgba(0, 0, 0, .05);--icon-color: rgba(0, 0, 0, .55);--icon-hover: #1a1a2e}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:var(--bg-primary);color:var(--text-primary);transition:background .3s,color .3s}#app{height:100vh;width:100%}.app-container{height:100vh;width:100%;display:flex;flex-direction:column}.app-container>.el-container{flex:1;min-height:0}.demo-banner{display:flex;align-items:center;gap:10px;padding:7px 16px;background:color-mix(in srgb,#f59e0b 14%,var(--bg-secondary));border-bottom:1px solid color-mix(in srgb,#f59e0b 45%,transparent);font-size:12.5px;line-height:1.5;flex-shrink:0}.demo-banner-tag{font-size:10px;font-weight:700;letter-spacing:1px;color:#f59e0b;border:1px solid #f59e0b;border-radius:4px;padding:2px 6px;flex-shrink:0}.demo-banner-text{color:var(--text-primary);flex:1;min-width:0}.demo-banner-close{background:none;border:none;cursor:pointer;color:var(--text-muted);font-size:13px;line-height:1;padding:4px 6px;border-radius:4px;flex-shrink:0}.demo-banner-close:hover{color:var(--text-primary);background:color-mix(in srgb,#f59e0b 18%,transparent)}.demo-fade-enter-active,.demo-fade-leave-active{transition:opacity .25s}.demo-fade-enter-from,.demo-fade-leave-to{opacity:0}.sidebar{background:var(--bg-secondary);border-right:1px solid var(--border-color);overflow-y:auto;height:100vh;transition:background .3s,border-color .3s}.logo{padding:20px 18px;border-bottom:1px solid var(--border-color)}.logo h2{margin:0;font-size:16px;font-weight:700;letter-spacing:.5px;color:var(--text-primary)}.logo p{margin:4px 0 0;font-size:10px;color:var(--text-muted);letter-spacing:.3px}.menu-group-label{padding:16px 20px 6px;font-size:10px;font-weight:600;color:var(--text-faint);text-transform:uppercase;letter-spacing:.8px}.sidebar-menu{border-right:none;background:transparent!important}.sidebar-menu :deep(.el-menu-item){height:44px;line-height:44px;margin:2px 8px;padding:0 12px;border-radius:6px;font-size:13px;color:var(--text-secondary);display:flex;align-items:center}.sidebar-menu :deep(.el-menu-item span){flex:1;white-space:nowrap;overflow:visible;text-overflow:clip}.sidebar-menu :deep(.el-menu-item:hover){background:var(--hover-bg);color:var(--text-primary)}.sidebar-menu :deep(.el-menu-item.is-active){background:var(--accent-bg);color:var(--accent)}.sidebar-menu :deep(.el-menu-item .el-icon){font-size:16px;margin-right:10px;width:16px;height:16px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.header{background:var(--bg-secondary);border-bottom:1px solid var(--border-color);padding:0 20px;height:52px!important;display:flex;align-items:center;justify-content:space-between;transition:background .3s,border-color .3s}.header :deep(.el-header){height:52px!important;padding:0}.header-left{display:flex;align-items:center;gap:8px}.breadcrumb{font-size:13px;color:var(--text-muted)}.sep{font-size:13px;color:var(--text-faint)}.current-page{font-size:13px;font-weight:500;color:var(--text-primary)}.header-right{display:flex;align-items:center;gap:16px}.lang-switch{display:flex;align-items:center;background:var(--control-bg);border:1px solid var(--border-color);border-radius:6px;padding:2px}.lang-btn{border:none;background:transparent;color:var(--text-muted);font-size:12px;font-weight:600;font-family:Inter,sans-serif;padding:3px 9px;border-radius:4px;cursor:pointer;transition:all .2s ease}.lang-btn:hover{color:var(--text-primary)}.lang-btn.active{background:var(--accent);color:#06120a}.theme-toggle{display:flex;align-items:center;cursor:pointer}.header-icon{font-size:18px;color:var(--icon-color);cursor:pointer;transition:color .2s}.header-icon:hover{color:var(--icon-hover)}.notif-trigger{display:flex;align-items:center;cursor:pointer}.notif-panel{display:flex;flex-direction:column}.notif-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:8px;border-bottom:1px solid var(--border-color);margin-bottom:4px}.notif-title{font-size:14px;font-weight:700;color:var(--text-primary)}.notif-list{max-height:380px;overflow-y:auto;display:flex;flex-direction:column}.notif-item{display:flex;align-items:flex-start;gap:8px;padding:10px 6px;border-radius:8px;cursor:pointer;transition:background .15s ease}.notif-item:hover{background:#ffffff0a}html.light-theme .notif-item:hover{background:#0000000a}.notif-item.unread .notif-item-title{font-weight:700}.notif-dot{width:8px;height:8px;border-radius:50%;background:var(--accent);flex-shrink:0;margin-top:6px}.notif-body{flex:1;min-width:0}.notif-item-title{font-size:13px;color:var(--text-primary);line-height:1.4}.notif-item-text{font-size:12px;color:var(--text-secondary);margin-top:2px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.notif-time{font-size:11px;color:var(--text-muted);margin-top:4px}.user-chip{display:flex;align-items:center;gap:8px;padding:4px 8px 4px 4px;border-radius:8px;cursor:pointer;border:1px solid var(--border-color);background:var(--control-bg);transition:border-color .2s,background .2s}.user-chip:hover{border-color:#4ade8059;background:#4ade800f}.user-chip-avatar{width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;color:#06120a;background:var(--accent)}.user-chip-name{font-size:12px;font-weight:600;color:var(--text-primary);max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chip-arrow{font-size:11px;color:var(--text-muted)}.login-btn{border-color:#4ade8066;color:var(--accent);background:transparent}.login-btn:hover{background:var(--accent-bg);border-color:var(--accent);color:var(--accent)}.main-content{background:var(--bg-primary);padding:16px;width:100%;overflow-y:auto;overflow-x:hidden;transition:background .3s}.login-prompt-body{display:flex;align-items:flex-start;gap:12px}.login-prompt-icon{font-size:26px;color:var(--accent);flex-shrink:0;margin-top:2px}.login-prompt-body p{font-size:13px;line-height:1.7;color:var(--text-secondary)}.menu-toggle{display:none;align-items:center;justify-content:center;width:32px;height:32px;margin-right:4px;padding:0;border:none;background:transparent;color:var(--text-primary);cursor:pointer;border-radius:6px}.menu-toggle:hover{background:var(--hover-bg)}.menu-toggle svg{width:20px;height:20px}.sidebar-overlay{display:none}@media (max-width: 1024px){.menu-toggle{display:inline-flex}.sidebar{position:fixed;top:0;left:0;bottom:0;width:240px!important;max-width:82vw;z-index:2001;transform:translate(-100%);transition:transform .25s ease;box-shadow:4px 0 28px #00000073}.app-container.sidebar-open .sidebar{transform:translate(0)}.sidebar-overlay{display:block;position:fixed;top:0;right:0;bottom:0;left:0;z-index:2000;background:#00000080;opacity:0;pointer-events:none;transition:opacity .25s ease}.sidebar-overlay.show{opacity:1;pointer-events:auto}}@media (max-width: 480px){.header{padding:0 12px}.header .breadcrumb,.header .sep{display:none}.main-content{padding:10px}}