:root {
            --sidebar-width: 250px;
            --transition-speed: 0.25s;
        }

        [data-bs-theme="light"] {
            --bg-root: #f0f2f5;
            --bg-sidebar: #ffffff;
            --bg-card: #ffffff;
            --bg-card-hover: #f8f9fa;
            --bg-secondary: #e9ecef;
            --bg-input: #ffffff;
            --text-primary: #1a1a2e;
            --text-secondary: #6c757d;
            --text-muted: #adb5bd;
            --border-color: #e9ecef;
            --border-light: #f1f3f5;
            --shadow-sm: 0 1px 3px rgba(0,0,0,0.06);
            --shadow-md: 0 4px 16px rgba(0,0,0,0.08);
            --shadow-lg: 0 8px 32px rgba(0,0,0,0.1);
            --accent: #6366f1;
            --accent-light: #eef2ff;
            --accent-gradient: linear-gradient(135deg, #6366f1 0%, #8b5cf6 50%, #a855f7 100%);
            --sidebar-active-bg: #eef2ff;
            --sidebar-active-text: #4f46e5;
            --sidebar-hover-bg: #f3f4f6;
            --topbar-tab-active-color: #4f46e5;
            --topbar-tab-active-bg: #eef2ff;
            --sidebar-brand-bg: #ffffff;
            /* 兼容旧模板变量 */
            --bg-color: #f0f2f5;
            --card-bg: #ffffff;
            --text-color: #1a1a2e;
            --detail-card-bg: #f8f9fa;
            --form-section-bg: #ffffff;
            --card-shadow: 0 10px 30px rgba(0,0,0,0.08);
            --card-shadow-hover: 0 15px 40px rgba(0,0,0,0.12);
            --header-bg: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            --primary-color: #6366f1;
            --secondary-color: #6c757d;
            --success-color: #10b981;
            --copy-box-bg: #e7f3ff;
            --copy-box-border: #007bff;
        }

        [data-bs-theme="dark"] {
            --bg-root: #0f1117;
            --bg-sidebar: #161822;
            --bg-card: #1a1d2e;
            --bg-card-hover: #1f2335;
            --bg-secondary: #2a2d3a;
            --bg-input: #1a1d2e;
            --text-primary: #e2e4e9;
            --text-secondary: #9ca3af;
            --text-muted: #6b7280;
            --border-color: #2a2d3a;
            --border-light: #222533;
            --shadow-sm: 0 1px 3px rgba(0,0,0,0.3);
            --shadow-md: 0 4px 16px rgba(0,0,0,0.4);
            --shadow-lg: 0 8px 32px rgba(0,0,0,0.5);
            --accent: #818cf8;
            --accent-light: rgba(99,102,241,0.15);
            --accent-gradient: linear-gradient(135deg, #6366f1 0%, #8b5cf6 50%, #a855f7 100%);
            --sidebar-active-bg: rgba(99,102,241,0.15);
            --sidebar-active-text: #a5b4fc;
            --sidebar-hover-bg: rgba(255,255,255,0.04);
            --topbar-tab-active-color: #a5b4fc;
            --topbar-tab-active-bg: rgba(99,102,241,0.15);
            --sidebar-brand-bg: #161822;
            /* 兼容旧模板变量 */
            --bg-color: #0f1117;
            --card-bg: #1a1d2e;
            --text-color: #e2e4e9;
            --detail-card-bg: #1f2335;
            --form-section-bg: #1a1d2e;
            --card-shadow: 0 10px 30px rgba(0,0,0,0.3);
            --card-shadow-hover: 0 15px 40px rgba(0,0,0,0.5);
            --header-bg: linear-gradient(135deg, #4c63b6 0%, #5d3a8c 100%);
            --primary-gradient: linear-gradient(135deg, #4c63b6 0%, #5d3a8c 100%);
            --primary-color: #818cf8;
            --secondary-color: #9ca3af;
            --success-color: #34d399;
            --copy-box-bg: #1a3a5f;
            --copy-box-border: #0d6efd;
        }

        * { box-sizing: border-box; }

        body {
            margin: 0; padding: 0;
            background: var(--bg-root);
            color: var(--text-primary);
            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Microsoft YaHei', sans-serif;
            min-height: 100vh;
            overflow-x: hidden;
            -webkit-font-smoothing: antialiased;
            transition: background-color var(--transition-speed), color var(--transition-speed);
        }

        /***** Alert 容器 *****/
        .alert-container {
            position: fixed; top: 70px; right: 20px; z-index: 1050; max-width: 400px;
        }

        /***** AdminLTE 4 覆盖/微调 *****/
        .app-wrapper {
            background: var(--bg-root) !important;
        }

        /* 顶栏微调 */
        .app-header {
            background: var(--bg-topbar, var(--bg-sidebar)) !important;
        }

        .app-header .navbar-nav .nav-link {
            color: var(--text-secondary);
        }
        .app-header .navbar-nav .nav-link:hover {
            color: var(--text-primary);
        }

        /* 侧边栏微调 */
        .app-sidebar {
            background: var(--bg-sidebar) !important;
        }

        .sidebar-brand {
            background: var(--sidebar-brand-bg) !important;
            border-bottom: 1px solid var(--border-color) !important;
        }
        .sidebar-brand .brand-link {
            color: var(--text-primary) !important;
        }
        /* 折叠态(不悬停)：仅剩 logo 图标，水平居中显示。
           关键：brand-text 折叠时虽 max-width:0 隐藏，但残留 margin-left:.5rem(8px)，
           brand-link 总宽(28+8=36px)超出内容区(33.6px)导致溢出，justify-content:center 失效。
           必须同时归零 brand-text 的 margin 消除溢出，居中才生效。 */
        .sidebar-mini.sidebar-collapse .app-sidebar:not(:hover) .sidebar-brand .brand-link {
            justify-content: center;
            padding: 0;
        }
        .sidebar-mini.sidebar-collapse .app-sidebar:not(:hover) .sidebar-brand .brand-text {
            margin-left: 0 !important;
        }
        .sidebar-brand .brand-text .hl {
            background: var(--accent-gradient);
            -webkit-background-clip: text;
            background-clip: text;
            color: transparent;
        }

        .sidebar-wrapper {
            background: var(--bg-sidebar) !important;
        }

        /* 侧边栏菜单 */
        .sidebar-menu .nav-item {
            margin: 1px 6px;
        }
        .sidebar-menu .nav-link {
            color: var(--text-secondary) !important;
            border-radius: 8px !important;
            padding: 8px 12px !important;
            font-size: 13px !important;
            font-weight: 500 !important;
            transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease, transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1) !important;
        }
        .sidebar-menu .nav-link:hover {
            background: var(--sidebar-hover-bg) !important;
            color: var(--text-primary) !important;
        }
        .sidebar-menu .nav-link.active {
            background: var(--sidebar-active-bg) !important;
            color: var(--sidebar-active-text) !important;
            font-weight: 600 !important;
            box-shadow: inset 3px 0 0 var(--accent) !important;
            animation: sidebarSnapIn 0.3s cubic-bezier(0.34, 1.56, 0.64, 1) both;
        }
        @keyframes sidebarSnapIn {
            0% { transform: translateX(-4px); opacity: 0.6; }
            55% { transform: translateX(2px); }
            100% { transform: translateX(0); opacity: 1; }
        }
        .sidebar-menu .nav-link .nav-icon {
            font-size: 15px !important;
            margin-right: 6px !important;
            opacity: 0.75;
        }
        .sidebar-menu .nav-link.active .nav-icon {
            opacity: 1;
        }

        .sidebar-menu .nav-header {
            color: var(--text-muted) !important;
            font-size: 10.5px !important;
            font-weight: 700 !important;
            text-transform: uppercase;
            letter-spacing: 1.2px;
            padding: 6px 12px 4px !important;
            margin-top: 8px;
        }

        /* 主内容区微调 */
        .app-main {
            background: var(--bg-root) !important;
        }
        .app-content-header {
            background: transparent !important;
            border-bottom: 1px solid var(--border-color) !important;
        }
        .app-content {
            background: var(--bg-root) !important;
            /* footer 已移除，min-height 仅需预留顶栏(2.75rem)+上下padding(40px) */
            min-height: calc(100vh - 2.75rem - 2.5rem);
            padding: 20px 24px;
        }

        /***** 模块切换 Tab（在顶栏内） *****/
        .module-tabs {
            display: flex; align-items: center; gap: 2px;
            margin-left: 4px;
        }
        .module-tab {
            display: flex; align-items: center; gap: 6px;
            padding: 6px 14px; height: 34px; border-radius: 8px;
            font-size: 12.5px; font-weight: 600; white-space: nowrap;
            cursor: pointer; transition: all 0.2s ease;
            color: var(--text-secondary); background: transparent;
            border: none; text-decoration: none;
            letter-spacing: 0.1px;
        }
        .module-tab:hover {
            color: var(--text-primary);
            background: var(--sidebar-hover-bg);
        }
        .module-tab.active {
            color: var(--topbar-tab-active-color);
            background: var(--topbar-tab-active-bg);
        }
        .module-tab i { font-size: 15px; opacity: 0.85; }

        /* 侧边栏徽章 */
        .badge-count {
            margin-left: auto;
            font-size: 10.5px; padding: 2px 7px;
            border-radius: 20px;
            background: var(--accent-light);
            color: var(--accent);
            font-weight: 600;
            line-height: 1.2;
        }

        /***** 兼容旧模板的常用样式 *****/
        .form-control, .form-select {
            /* 显式补齐尺寸：任何库加载顺序下都保证文字不被圆角裁剪 */
            height: 38px;
            padding: 0 12px;
            line-height: 1.5;
            font-size: 14px;
            border-radius: 8px;
            border: 1px solid var(--border-color);
            background-color: var(--bg-input);
            color: var(--text-primary);
            transition: all 0.3s;
        }
        /* 多行/可换行控件不受固定高度约束 */
        .form-control[type="file"] {
            height: auto;
            padding: 7px 12px;
        }
        textarea.form-control {
            height: auto;
            padding: 10px 12px;
        }
        .form-control:focus, .form-select:focus {
            border-color: #0d6efd;
            box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
            background-color: var(--bg-card);
            color: var(--text-primary);
        }

        .card {
            background: var(--bg-card);
            border: 1px solid var(--border-color);
            border-radius: 14px;
            box-shadow: var(--shadow-sm);
        }

        .panel {
            background: var(--bg-card);
            border: 1px solid var(--border-color);
            border-radius: 14px;
            overflow: hidden;
            box-shadow: var(--shadow-sm);
            /* 默认内边距：裸内容（无 panel-body 包裹）也不会贴边被圆角裁掉 */
            padding: 18px;
        }
        .panel-header {
            padding: 14px 18px;
            border-bottom: 1px solid var(--border-color);
            display: flex;
            align-items: center;
            justify-content: space-between;
            /* 负 margin 还原为全宽，使 padding 由 .panel 统一承担 */
            margin: -18px -18px 0;
        }
        .panel-title {
            font-size: 14px; font-weight: 700; color: var(--text-primary);
            display: flex; align-items: center; gap: 7px;
        }
        .panel-title i { color: var(--accent); font-size: 15px; }
        /* .panel 已含 padding，body 不再重复内边距 */
        .panel-body { padding: 0; }

        .table-modern {
            width: 100%; border-collapse: collapse; font-size: 12.5px;
            --bs-table-color: var(--text-primary);
            --bs-table-bg: transparent;
            --bs-table-border-color: var(--border-color);
            --bs-table-hover-bg: var(--bg-card-hover);
            color: var(--text-primary);
        }
        .table-modern th {
            text-align: left; padding: 9px 14px; font-weight: 600;
            font-size: 10.5px; text-transform: uppercase; letter-spacing: 0.7px;
            color: var(--text-muted); background: var(--bg-card-hover);
            border-bottom: 1px solid var(--border-color);
        }
        .table-modern td {
            padding: 11px 14px; border-bottom: 1px solid var(--border-light);
            color: var(--text-primary);
        }
        .table-modern tr:hover td { background: var(--bg-card-hover); }

        .dashboard-header { margin-bottom: 24px; }
        .dashboard-header h1 {
            font-size: 24px; font-weight: 700; letter-spacing: -0.5px;
            margin-bottom: 4px;
            background: var(--accent-gradient);
            -webkit-background-clip: text; -webkit-text-fill-color: transparent;
            background-clip: text;
        }
        .dashboard-header p { color: var(--text-muted); font-size: 13.5px; margin: 0; }

        .stats-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
            gap: 14px; margin-bottom: 24px;
        }
        @media (max-width: 768px) {
            .stats-grid { grid-template-columns: repeat(2, 1fr); }
        }

        .stat-card {
            background: var(--bg-card); border: 1px solid var(--border-color);
            border-radius: 14px; padding: 18px 22px;
            display: flex; align-items: center; gap: 14px;
            transition: all 0.25s ease; cursor: pointer;
            box-shadow: var(--shadow-sm); text-decoration: none;
        }
        .stat-card:hover {
            transform: translateY(-2px); box-shadow: var(--shadow-md);
            border-color: rgba(99,102,241,0.3);
        }
        .stat-icon {
            width: 44px; height: 44px; border-radius: 12px;
            display: flex; align-items: center; justify-content: center;
            font-size: 20px; flex-shrink: 0;
        }
        .stat-icon.purple { background: rgba(99,102,241,0.12); color: #818cf8; }
        .stat-icon.green  { background: rgba(16,185,129,0.12); color: #34d399; }
        .stat-icon.blue   { background: rgba(59,130,246,0.12); color: #60a5fa; }
        .stat-icon.orange { background: rgba(245,158,11,0.12); color: #fbbf24; }
        .stat-info { flex: 1; min-width: 0; }
        .stat-value { font-size: 26px; font-weight: 800; line-height: 1; letter-spacing: -1px; color: var(--text-primary); }
        .stat-label { font-size: 12px; color: var(--text-muted); margin-top: 3px; font-weight: 500; }

        .server-list { display: flex; flex-direction: column; gap: 7px; }
        .server-item {
            display: flex; align-items: center; gap: 11px;
            padding: 11px 14px; border-radius: 10px;
            background: var(--bg-card-hover); transition: all 0.2s;
            cursor: pointer; border: 1px solid transparent;
        }
        .server-item:hover { border-color: var(--border-color); background: var(--bg-card); }
        .server-dot {
            width: 9px; height: 9px; border-radius: 50%; flex-shrink: 0;
        }
        .server-dot.online { background: #34d399; box-shadow: 0 0 8px rgba(16,185,129,0.4); }
        .server-dot.offline { background: #ef4444; }
        .server-info { flex: 1; min-width: 0; }
        .server-ip { font-size: 12.5px; font-weight: 600; color: var(--text-primary); }
        .server-meta { font-size: 11px; color: var(--text-muted); margin-top: 1px; }
        .server-count { font-size: 12.5px; font-weight: 700; color: var(--accent); white-space: nowrap; }

        .quick-actions {
            display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px;
        }
        .quick-action-chip {
            padding: 5px 12px; border-radius: 20px; font-size: 12px; font-weight: 500;
            cursor: pointer; background: rgba(255,255,255,0.15);
            color: rgba(255,255,255,0.9); border: 1px solid rgba(255,255,255,0.2);
            transition: all 0.2s; text-decoration: none;
        }
        .quick-action-chip:hover { background: rgba(255,255,255,0.25); color: #fff; }

        .badge-status {
            font-size: 10.5px; padding: 3px 9px; border-radius: 20px; font-weight: 600;
        }
        .badge-enabled { background: rgba(16,185,129,0.15); color: #34d399; }
        .badge-disabled { background: rgba(239,68,68,0.12); color: #f87171; }

        @keyframes fadeInUp {
            from { opacity: 0; transform: translateY(10px); }
            to { opacity: 1; transform: translateY(0); }
        }
        .animate-in { animation: fadeInUp 0.35s ease forwards; }
        .delay-1 { animation-delay: 0.05s; }
        .delay-2 { animation-delay: 0.1s; }
        .delay-3 { animation-delay: 0.15s; }
        .delay-4 { animation-delay: 0.2s; }
        .delay-5 { animation-delay: 0.25s; }
        .delay-6 { animation-delay: 0.3s; }

        /* 全宽模式（无侧栏页面） */
        .app-main.full-width .app-content {
            max-width: none !important;
        }