/* 全局设置，禁止文本选择以增强模拟效果 */
body, .window-header, .panel {
    user-select: none; /* 标准语法 */
    -webkit-user-select: none; /* Safari */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
}

/* 但允许在终端输出和输入区域选择文本 */
#terminal-output,
#terminal-input,
.window-content pre,
.window-content code,
.window-content textarea,
.window-content input {
    user-select: text !important; /* 或者 auto */
    -webkit-user-select: text !important;
    -moz-user-select: text !important;
    -ms-user-select: text !important;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Courier New', monospace;
    color: var(--text-color);
}

:root {
    /* 默认绿色主题 */
    --main-bg-color: #000;
    --panel-bg-color: rgba(20, 20, 30, 0.7);
    --panel-border-color: #0c9;
    --panel-text-color: #0f9;
    --panel-header-color: #0c9;
    --terminal-bg: rgba(0, 10, 20, 0.9);
    --terminal-text: #0fa;
    
    --window-bg-color: rgba(5, 20, 15, 0.92); /* 更深的半透明背景 */
    --window-shadow-color: rgba(0, 255, 170, 0.3); /* 绿色辉光阴影 */
    --window-header-bg-color: rgba(0, 50, 30, 0.8); /* 头部背景稍微透明 */
    --window-header-border-color: rgba(0, 255, 170, 0.4);
    --window-header-text-color: #0f9;
    --window-control-color: #0c9;
    --window-control-hover-color: #0f9;
    --window-control-bg-hover: rgba(0, 255, 170, 0.2);
    --window-close-hover-bg: #f55;
    --window-content-text-color: #0f9;
    --window-resize-handle-color: rgba(0, 255, 170, 0.5);
    
    --taskbar-bg-color: rgba(0, 20, 10, 0.95);
    --taskbar-border-color: #0c9;
    --taskbar-item-bg-color: rgba(0, 40, 20, 0.7);
    --taskbar-item-hover-bg-color: rgba(0, 60, 30, 0.9);
    --taskbar-icon-color: #0f9;
    --taskbar-title-color: #0c9;
    --taskbar-indicator-color: #0c9;
    --taskbar-indicator-hover-color: #0f9;

    --error-color: #f55;
    --warning-color: #fc3;
    
    /* 白色主题变量 */
    --border-color-dark: #0af;
    --text-color-dark: #0af;
    --header-color-dark: #0af;
    --terminal-text-dark: #0af;
}

/* 新增：纯黑客暗色主题 (高级版) */
body.hacker-dark-theme {
    --main-bg-color: #0a0a0a; /* 稍亮一点的深黑，方便加纹理 */
    --panel-bg-color: rgba(20, 20, 20, 0.85); /* 面板背景，增加不透明度 */
    --panel-border-color: #999; /* 更亮一点的灰色边框 */
    --panel-text-color: #e0e0e0; /* 更亮的浅灰色文本，提高对比度 */
    --panel-header-color: #c0c0c0; /* 标题颜色 */
    --terminal-bg: rgba(5, 5, 5, 0.95); /* 终端背景更黑 */
    --terminal-text: #f0f0f0; /* 终端文本接近白色 */
    
    /* 窗口样式调整 */
    --window-bg-color: rgba(15, 15, 15, 0.94); /* 窗口背景 */
    --window-shadow-color: rgba(180, 180, 180, 0.25); /* 更明显的灰色辉光 */
    --window-header-bg-color: rgba(30, 30, 30, 0.85); /* 窗口头部背景 */
    --window-header-border-color: rgba(140, 140, 140, 0.5); /* 窗口头部边框 */
    --window-header-text-color: #e0e0e0; /* 窗口头部文本 */
    --window-control-color: #b0b0b0; /* 控制按钮 */
    --window-control-hover-color: #ffffff; /* 悬停白色 */
    --window-control-bg-hover: rgba(120, 120, 120, 0.3); /* 悬停背景 */
    --window-close-hover-bg: #d00; /* 更亮的红色关闭 */
    --window-content-text-color: #e0e0e0; /* 窗口内容文本 */
    --window-resize-handle-color: rgba(180, 180, 180, 0.6); /* 调整大小手柄 */
    
    /* 任务栏样式调整 */
    --taskbar-bg-color: rgba(12, 12, 12, 0.97); /* 任务栏背景 */
    --taskbar-border-color: #999; /* 边框颜色 */
    --taskbar-item-bg-color: rgba(35, 35, 35, 0.8); /* 任务项背景 */
    --taskbar-item-hover-bg-color: rgba(60, 60, 60, 0.9); /* 悬停背景 */
    --taskbar-icon-color: #e0e0e0; /* 图标颜色 */
    --taskbar-title-color: #c0c0c0; /* 标题颜色 */
    --taskbar-indicator-color: #999; /* 指示符颜色 */
    --taskbar-indicator-hover-color: #c0c0c0; /* 指示符悬停 */

    --error-color: #ff4d4d; /* 亮一点的红色 */
    --warning-color: #ffcc00; /* 亮一点的橙色 */
    
    /* 覆盖蓝色主题可能存在的颜色 */
    --border-color-dark: var(--panel-border-color);
    --text-color-dark: var(--panel-text-color);
    --header-color-dark: var(--panel-header-color);
    --terminal-text-dark: var(--terminal-text);
    
    /* 增加文本辉光效果 */
    text-shadow: 0 0 3px rgba(200, 200, 200, 0.1); /* 非常微弱的全局辉光 */
}

/* 针对特定元素增强辉光 */
body.hacker-dark-theme .time-display,
body.hacker-dark-theme .window-title,
body.hacker-dark-theme h3 {
    text-shadow: 0 0 5px rgba(220, 220, 220, 0.25); /* 标题和时间的辉光稍强 */
}

/* 增加背景纹理 */
body.hacker-dark-theme::before { /* 使用 ::before 伪元素添加纹理层 */
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: radial-gradient(rgba(100, 100, 100, 0.05) 1px, transparent 1px);
    background-size: 5px 5px; /* 点状网格 */
    opacity: 0.3;
    pointer-events: none;
    z-index: -1; /* 确保在内容下方 */
}

/* 暗色/蓝色主题 */
body.dark-theme {
    /* 覆盖变量 */
    --panel-bg-color: rgba(10, 15, 25, 0.8);
    --panel-border-color: #0af;
    --panel-text-color: #0af;
    --panel-header-color: #0af;
    --terminal-bg: rgba(0, 5, 15, 0.9);
    --terminal-text: #0af;
    
    --window-bg-color: rgba(10, 15, 30, 0.92); /* 深蓝半透明背景 */
    --window-shadow-color: rgba(0, 170, 255, 0.4); /* 蓝色辉光阴影 */
    --window-header-bg-color: rgba(0, 30, 60, 0.8); /* 头部背景稍微透明 */
    --window-header-border-color: rgba(0, 170, 255, 0.5);
    --window-header-text-color: #0ff;
    --window-control-color: #0af;
    --window-control-hover-color: #0ff;
    --window-control-bg-hover: rgba(0, 170, 255, 0.2);
    --window-content-text-color: #0af;
    --window-resize-handle-color: rgba(0, 170, 255, 0.6);
    
    --taskbar-bg-color: rgba(5, 10, 20, 0.95); /* 深蓝任务栏 */
    --taskbar-border-color: #0af; /* 蓝色边框 */
    --taskbar-item-bg-color: rgba(0, 30, 60, 0.7); /* 蓝色任务项 */
    --taskbar-item-hover-bg-color: rgba(0, 50, 80, 0.9); /* 悬停颜色 */
    --taskbar-icon-color: #0ff; /* 亮蓝图标 */
    --taskbar-title-color: #0af; /* 蓝色标题 */
    --taskbar-indicator-color: #0af; /* 蓝色指示符 */
    --taskbar-indicator-hover-color: #0ff; /* 亮蓝悬停 */
}

/* 应用变量到各个组件 */

/* Header, Footer, Panels 使用 panel 变量 */
header, footer, .panel {
    background-color: var(--panel-bg-color);
    border-color: var(--panel-border-color);
}
h3 {
    color: var(--panel-header-color);
    border-bottom-color: var(--panel-border-color);
}
.panel, body, * {
    color: var(--panel-text-color);
}
.panel::-webkit-scrollbar-thumb {
    background: var(--panel-border-color);
}
header::before, .panel::before {
    background: linear-gradient(to right, transparent, var(--panel-border-color), transparent);
}

/* Terminal 使用 terminal 变量 */
.terminal {
    background-color: var(--terminal-bg);
    border-color: var(--panel-border-color); /* 可选用 panel 或单独变量 */
}
.terminal-header {
    background-color: rgba(0, 0, 0, 0.2); /* 可能需要微调或用变量 */
    border-bottom-color: var(--panel-border-color);
}
.prompt, #terminal-input, #terminal-output, .command-line, .output {
    color: var(--terminal-text);
}
#terminal-input {
    caret-color: var(--terminal-text);
}

/* 操作系统风格窗口 */
.window {
    background-color: var(--window-bg-color);
    color: var(--window-content-text-color);
    /* border: 1px solid var(--window-border-color); */ /* 移除边框 */
    border: none; /* 确认移除 */
    border-radius: 6px; /* 轻微圆角 */
    /* box-shadow: 0 5px 15px rgba(0, 170, 255, 0.4); */ /* 移除旧阴影 */
    box-shadow: 0 0 20px 5px var(--window-shadow-color); /* 使用变量定义辉光阴影 */
    display: flex;
    flex-direction: column;
    pointer-events: auto;
    transition: transform 0.3s ease, opacity 0.3s ease, box-shadow 0.3s ease; /* 添加阴影过渡 */
    overflow: hidden;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

/* 添加窗口打开时的初始状态 */
.window.window-opening {
    opacity: 0;
    transform: scale(0.95); /* 可选的轻微缩放效果 */
}

.window.active {
    /* border-color: var(--window-control-hover-color); */ /* 无边框，无需改变 */
    box-shadow: 0 0 25px 8px var(--window-shadow-color); /* 激活时阴影更强 */
}

.window.minimized {
    transform: scale(0.1);
    opacity: 0;
    pointer-events: none;
}

.window.maximized {
    border-radius: 0; /* 最大化时无圆角 */
}

.window.closing {
    transform: scale(0.8);
    opacity: 0;
}

.window-header {
    height: 30px;
    background-color: var(--window-header-bg-color);
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 10px;
    cursor: move;
    user-select: none;
    -webkit-user-select: none;
    /* border-bottom: 1px solid var(--window-border-color); */ /* 移除旧边框 */
    border-bottom: 1px solid var(--window-header-border-color); /* 使用新的头部边框颜色 */
    flex-shrink: 0; /* 防止头部被压缩 */
}

.window-title {
    font-size: 14px;
    color: var(--window-header-text-color);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 500;
}

.window-controls {
    display: flex;
}

.window-control {
    width: 22px; /* 稍大一点 */
    height: 22px;
    margin-left: 6px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: none; /* 移除按钮边框 */
    background-color: transparent; /* 透明背景 */
    color: var(--window-control-color);
    font-size: 18px; /* 调整图标/字符大小 */
    cursor: pointer;
    transition: all 0.2s;
    border-radius: 3px;
    padding: 0;
    line-height: 1;
    position: relative !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    z-index: auto !important;
}

.window-control:hover {
    color: var(--window-control-hover-color);
    background-color: var(--window-control-bg-hover); /* 悬停背景色 */
}

.window-close:hover {
    color: #fff;
    background-color: var(--window-close-hover-bg);
    /* border-color: var(--window-close-hover-bg); */ /* 无边框 */
}

.window-content {
    flex: 1;
    overflow: auto;
    padding: 15px;
    position: relative;
}

/* 自定义窗口内容滚动条 */
.window-content::-webkit-scrollbar {
    width: 8px; /* 滚动条宽度 */
    height: 8px; /* 水平滚动条高度 (如果需要) */
}

.window-content::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.2); /* 轨道背景色 */
    border-radius: 4px;
}

.window-content::-webkit-scrollbar-thumb {
    background-color: var(--window-border-color); /* 滑块颜色使用窗口边框色变量 */
    border-radius: 4px;
    border: 2px solid transparent; /* 创建内边距效果 */
    background-clip: content-box;
    transition: background-color 0.2s ease;
}

.window-content::-webkit-scrollbar-thumb:hover {
    background-color: var(--window-control-hover-color); /* 悬停时使用高亮颜色 */
}

.window-resize-handle {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 20px; /* 增大触发区域 */
    height: 20px;
    cursor: nwse-resize;
    background: transparent;
    z-index: 10; /* 确保在内容之上 */
}

.window-resize-handle::after {
    content: '';
    position: absolute;
    right: 5px; /* 调整图标位置 */
    bottom: 5px;
    width: 8px;
    height: 8px;
    border-right: 2px solid var(--window-resize-handle-color);
    border-bottom: 2px solid var(--window-resize-handle-color);
    opacity: 0.7; /* 半透明 */
    transition: opacity 0.2s ease;
}

.window-resize-handle:hover::after {
    opacity: 1; /* 悬停时不透明 */
}

/* 确保窗口内的选项卡正常工作 */
.window .tab-container {
    margin-top: 0;
    border-bottom: 1px solid var(--window-border-color);
}

.window .tabs {
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0;
}

.window .tab {
    padding: 8px 15px;
    cursor: pointer;
    background-color: rgba(from var(--window-header-bg-color) r g b / 0.3);
    color: var(--window-control-color);
    border: 1px solid transparent;
    margin-right: 5px;
    border-radius: 3px 3px 0 0;
    font-size: 14px;
}

.window .tab.active {
    background-color: rgba(from var(--window-header-bg-color) r g b / 0.6);
    color: var(--window-control-hover-color);
    border-color: var(--window-border-color);
    border-bottom-color: transparent;
}

.window .tab-content {
    padding: 15px 0;
}

.window .tab-pane {
    display: none;
}

.window .tab-pane.active {
    display: block;
}

.window table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

.window th, .window td {
    padding: 6px 10px;
    text-align: left;
    border-bottom: 1px solid rgba(from var(--window-border-color) r g b / 0.2);
}

.window th {
    color: var(--window-control-hover-color);
    font-weight: 500;
    background-color: rgba(from var(--window-header-bg-color) r g b / 0.7);
}

.window tr:hover {
    background-color: rgba(from var(--window-control-hover-color) r g b / 0.1);
}

/* 底部任务栏触发区域 */
#taskbar-trigger {
    position: fixed;
    /* top: 0; */ /* 移除顶部定位 */
    bottom: 0; /* 定位到底部 */
    left: 0;
    width: 100%;
    height: 5px;
    /* background-color: rgba(255, 0, 0, 0.2); */
    z-index: 10001;
}

/* 任务栏样式 - 底部自动隐藏 */
.window-taskbar {
    position: fixed;
    /* top: -40px; */ /* 移除顶部隐藏 */
    bottom: -40px; /* 初始隐藏在屏幕下方 */
    left: 10px; /* 改为固定左侧距离，不再居中 */
    transform: none; /* 移除居中变换 */
    display: none;
    justify-content: flex-start; /* 内容左对齐 */
    align-items: center;
    gap: 8px;
    background-color: var(--taskbar-bg-color);
    border: 1px solid var(--taskbar-border-color);
    /* border-top: none; */ /* 移除 */
    border-bottom: none; /* 底部不需要边框 */
    border-radius: 5px 5px 0 0; /* 只有上方圆角 */
    padding: 5px 10px;
    box-shadow: 0 -3px 8px rgba(0, 0, 0, 0.5); /* 阴影改为向上 */
    z-index: 10000;
    min-height: 30px;
    max-width: 90%; /* 增加宽度占比 */
    overflow-x: auto;
    opacity: 1;
    transition: bottom 0.3s ease-in-out; /* 过渡改为 bottom */
}

/* 当任务栏可见时 */
.window-taskbar.taskbar-visible {
    /* top: 0; */ /* 移除 */
    bottom: 0; /* 滑动到屏幕底部 */
}

/* 任务栏存在最小化窗口时的提示符 */
#taskbar-indicator {
    position: fixed;
    bottom: 0;
    left: 30px; /* 改为与任务栏对齐，稍微偏右 */
    transform: none; /* 移除居中变换 */
    width: 40px;
    height: 5px;
    background-color: var(--taskbar-indicator-color);
    border-radius: 3px 3px 0 0;
    box-shadow: 0 -2px 5px rgba(0, 170, 255, 0.5);
    z-index: 9999; /* 比任务栏低，比触发区高一点点 */
    display: none; /* 默认隐藏 */
    cursor: pointer; /* 暗示可点击 */
    transition: background-color 0.3s ease;
}

#taskbar-indicator:hover {
    background-color: var(--taskbar-indicator-hover-color);
}

/* 任务栏滚动条样式 */
.window-taskbar::-webkit-scrollbar {
    height: 4px;
}

.window-taskbar::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.2);
}

.window-taskbar::-webkit-scrollbar-thumb {
    background: var(--taskbar-border-color);
    border-radius: 2px;
}

.taskbar-item {
    display: flex;
    align-items: center;
    padding: 4px 8px;
    background-color: var(--taskbar-item-bg-color);
    border: 1px solid rgba(from var(--taskbar-border-color) r g b / 0.3);
    border-radius: 3px;
    cursor: pointer;
    transition: all 0.2s ease;
    white-space: nowrap;
    max-width: 150px;
    min-width: 80px;
}

.taskbar-item:hover {
    background-color: var(--taskbar-item-hover-bg-color);
    border-color: var(--taskbar-border-color);
}

.taskbar-icon {
    margin-right: 5px;
    font-size: 0.9em;
    color: var(--taskbar-icon-color);
}

.taskbar-title {
    font-size: 0.8em;
    color: var(--taskbar-title-color);
    overflow: hidden;
    text-overflow: ellipsis;
}

/* 窗口最小化动画 */
.window.minimized {
    animation: minimize 0.3s forwards;
    pointer-events: none;
}

/* 在窗口最小化时，强制隐藏控制按钮 */
.window.minimized .window-controls {
    display: none !important; /* 使用!important确保覆盖其他样式 */
    visibility: hidden !important;
}

@keyframes minimize {
    0% {
        transform: scale(1);
        opacity: 1;
    }
    100% {
        transform: scale(0.1);
        opacity: 0;
    }
}

/* 窗口关闭动画 - 修改 */
.window.closing {
    animation: close-window 0.3s forwards;
    pointer-events: none;
}

@keyframes close-window {
    0% {
        transform: scale(1);
    opacity: 1;
    }
    100% {
        transform: scale(0);
        opacity: 0;
    }
}

/* 移除特定的 dark-theme 颜色覆盖，让变量生效 */
body.dark-theme * {
    /* color: var(--text-color-dark); */ /* 使用 --panel-text-color 替代 */
    font-family: 'JetBrains Mono', 'Fira Code', 'Consolas', monospace;
}
/* ... 其他 body.dark-theme 规则检查并移除直接颜色设置，改为使用变量 ... */
/* 例如：移除 body.dark-theme h3, body.dark-theme .time-display 等直接设置 color 的规则 */

/* 全局过渡效果，现在包括更多组件 */
body, body *, .window, .window *, .window-taskbar, .taskbar-item, #taskbar-indicator {
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease, fill 0.3s ease, stroke 0.3s ease, filter 0.3s ease;
}

body {
    background-color: var(--main-bg-color);
    background-image: 
        radial-gradient(circle at 50% 50%, rgba(20, 70, 100, 0.15) 0%, rgba(0, 0, 0, 0) 60%),
        linear-gradient(to bottom, rgba(10, 40, 60, 0.1) 0%, rgba(0, 0, 0, 0) 100%);
    min-height: 100vh;
    overflow: hidden;
    position: relative;
}

body::after {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: repeating-linear-gradient(
        0deg,
        rgba(0, 0, 0, 0.15),
        rgba(0, 0, 0, 0.15) 1px,
        transparent 1px,
        transparent 2px
    );
    pointer-events: none;
    z-index: 10;
}

.container {
    display: grid;
    grid-template-rows: auto 1fr auto;
    height: 100vh;
    padding: 10px;
    gap: 10px;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
}

/* Header Styles */
header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 15px;
    background-color: var(--panel-bg-color);
    border: 1px solid var(--panel-border-color);
    border-radius: 5px;
    box-shadow: 0 0 15px rgba(0, 200, 150, 0.2);
    position: relative;
    overflow: visible;
    margin-top: 0;
    min-height: 50px;
}

header::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background: linear-gradient(to right, transparent, var(--panel-border-color), transparent);
    animation: scanline 2s linear infinite;
}

.time-display {
    font-size: 2.5rem;
    font-weight: bold;
    text-shadow: 0 0 10px rgba(0, 255, 170, 0.7);
    flex-shrink: 0;
}

.system-info {
    display: flex;
    flex-direction: column;
    gap: 3px;
    align-items: flex-end;
    flex-shrink: 0;
}

/* Main Content */
main {
    display: grid;
    grid-template-columns: 300px 1fr 300px;
    gap: 10px;
    height: 100%;
    min-height: 0;
    max-height: 100%;
}

.panel {
    background-color: var(--panel-bg-color);
    border: 1px solid var(--panel-border-color);
    border-radius: 5px;
    padding: 10px;
    display: flex;
    flex-direction: column;
    gap: 15px;
    overflow-y: auto;
    box-shadow: 0 0 15px rgba(0, 200, 150, 0.2);
    position: relative;
    max-height: 100%;
}

.panel::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background: linear-gradient(to right, transparent, var(--panel-border-color), transparent);
}

.panel::-webkit-scrollbar {
    width: 5px;
}

.panel::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.3);
}

.panel::-webkit-scrollbar-thumb {
    background: var(--panel-border-color);
    border-radius: 5px;
}

h3 {
    color: var(--panel-header-color);
    font-size: 0.9rem;
    margin-bottom: 5px;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding-bottom: 3px;
    border-bottom: 1px solid var(--panel-border-color);
}

/* CPU & Memory Monitors */
.graph-container {
    background-color: rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(0, 200, 150, 0.3);
    border-radius: 3px;
    height: 80px;
    position: relative;
}

.cpu-stats, .memory-stats, .network-stats, .fs-stats {
    display: flex;
    justify-content: space-around;
    align-items: center;
    margin-top: 10px;
    font-size: 0.9em;
    flex-wrap: nowrap;
}

/* Process List */
.process-list {
    flex-grow: 1;
}

#process-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.8rem;
}

#process-table th {
    text-align: left;
    padding: 5px;
    border-bottom: 1px solid var(--panel-border-color);
}

#process-table td {
    padding: 3px 5px;
    border-bottom: 1px solid rgba(0, 200, 150, 0.2);
}

/* Terminal */
.terminal {
    display: flex;
    flex-direction: column;
    height: 100%;
    max-height: 100%;
    min-height: 0;
    background-color: var(--terminal-bg);
    border: 1px solid var(--panel-border-color);
    border-radius: 5px;
    overflow: hidden;
}

.terminal-header {
    background-color: rgba(0, 0, 0, 0.2);
    padding: 5px 10px;
    font-size: 0.9rem;
    border-bottom: 1px solid var(--panel-border-color);
}

#terminal-output {
    flex-grow: 1;
    padding: 10px;
    overflow-y: auto;
    font-size: 0.9rem;
    color: var(--terminal-text);
    white-space: pre-wrap;
    max-height: calc(100% - 70px);
}

#terminal-output::-webkit-scrollbar {
    width: 5px;
}

#terminal-output::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.3);
}

#terminal-output::-webkit-scrollbar-thumb {
    background: var(--panel-border-color);
    border-radius: 5px;
}

.terminal-input-line {
    display: flex;
    padding: 5px 10px;
    border-top: 1px solid rgba(0, 200, 150, 0.3);
}

.prompt {
    color: var(--terminal-text);
    margin-right: 5px;
}

#terminal-input {
    flex-grow: 1;
    background: transparent;
    border: none;
    outline: none;
    color: var(--terminal-text);
    font-size: 0.9rem;
    caret-color: var(--terminal-text);
}

/* Network Monitor */
.network-traffic {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    font-size: 0.8rem;
    margin-top: 5px;
}

/* File System */
.fs-visual {
    margin: 10px 0;
}

.progress-bar {
    height: 10px;
    background-color: rgba(0, 0, 0, 0.3);
    border-radius: 5px;
    overflow: hidden;
    margin-bottom: 5px;
}

#fs-usage-bar {
    height: 100%;
    background-color: var(--panel-border-color);
    transition: width 0.5s ease;
}

#fs-usage-text {
    text-align: right;
    font-size: 0.8rem;
}

.file-list {
    background-color: rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(0, 200, 150, 0.3);
    border-radius: 3px;
    padding: 5px;
    height: 150px;
    overflow-y: auto;
    font-size: 0.8rem;
}

.file-list::-webkit-scrollbar {
    width: 5px;
}

.file-list::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.3);
}

.file-list::-webkit-scrollbar-thumb {
    background: var(--panel-border-color);
    border-radius: 5px;
}

.file-item {
    display: flex;
    align-items: center;
    margin-bottom: 3px;
    padding: 2px;
    border-radius: 3px;
}

.file-item:hover {
    background-color: rgba(0, 200, 150, 0.1);
}

.file-icon {
    margin-right: 5px;
}

/* World Map */
.map-container {
    height: 250px; /* 固定高度 */
    min-height: 250px; /* 确保最小高度 */
    position: relative;
    margin-bottom: 10px; /* 与下方连接信息保持一定间距 */
}

.map-container iframe {
    width: 100%;
    height: 100%;
    border: none;
    display: block;
    background-color: #000;
    border-radius: 3px;
}

.connections {
    margin-top: 5px;
    height: 120px; /* 增加高度以显示更多连接信息 */
    overflow-y: auto;
    overflow-x: hidden; /* 防止水平滚动条 */
    font-size: 0.8rem;
}

.connections::-webkit-scrollbar {
    width: 5px;
}

.connections::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.3);
}

.connections::-webkit-scrollbar-thumb {
    background: var(--panel-border-color);
    border-radius: 5px;
}

.connection-item {
    padding: 2px 0;
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid rgba(0, 200, 150, 0.2);
    width: 100%;
    box-sizing: border-box;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Footer */
footer {
    padding: 5px 10px;
    background-color: var(--panel-bg-color);
    border: 1px solid var(--panel-border-color);
    border-radius: 5px;
    box-shadow: 0 0 15px rgba(0, 200, 150, 0.2);
}

.status-bar {
    display: flex;
    justify-content: space-between;
    font-size: 0.8rem;
}

#warnings {
    color: var(--warning-color);
}

#errors {
    color: var(--error-color);
}

/* Command Line */
.command-line {
    margin-bottom: 5px;
}

.output {
    margin-bottom: 10px;
    line-height: 1.2;
}

/* Animations */
@keyframes scanline {
    0% {
        transform: translateX(-100%);
    }
    100% {
        transform: translateX(100%);
    }
}

@keyframes blink {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0;
    }
}

/* Responsive Design */
@media (max-width: 1200px) {
    main {
        grid-template-columns: 250px 1fr 250px;
    }
}

@media (max-width: 900px) {
    main {
        grid-width: 1fr;
        grid-template-rows: auto 1fr auto;
    }
}

/* 资源表格 */
.resource-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 10px;
}

.resource-table th,
.resource-table td {
    padding: 8px 12px;
    text-align: left;
    border-bottom: 1px solid #333;
}

.resource-table th {
    color: #0af;
    font-weight: normal;
}

.resource-table tr:hover {
    background-color: rgba(0, 255, 170, 0.1);
}

/* 详情布局 */
.cpu-details, .memory-details {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 10px;
    margin-bottom: 20px;
}

.detail-item {
    background-color: rgba(0, 0, 0, 0.2);
    padding: 10px;
    border-radius: 3px;
    border-left: 2px solid #0f9;
}

.detail-item .label {
    color: #0af;
    display: block;
    margin-bottom: 5px;
}

/* CPU监视器可点击样式 */
.cpu-monitor, .memory-monitor, .network-monitor {
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
}

.cpu-monitor:hover, .memory-monitor:hover, .network-monitor:hover {
    box-shadow: 0 0 15px rgba(0, 255, 170, 0.4);
    transform: translateY(-2px);
}

.cpu-monitor:hover::after, .memory-monitor:hover::after, .network-monitor:hover::after {
    content: "点击查看详情";
    position: absolute;
    bottom: -25px;
    left: 50%;
    transform: translateX(-50%);
    background-color: rgba(0, 0, 0, 0.8);
    color: var(--panel-text-color);
    padding: 5px 10px;
    border-radius: 3px;
    font-size: 12px;
    z-index: 100;
    white-space: nowrap;
}

/* Specific hover shadow colors if needed */
body:not(.dark-theme) .memory-monitor:hover {
    box-shadow: 0 0 15px rgba(0, 170, 255, 0.4);
}
body.dark-theme .memory-monitor:hover {
     box-shadow: 0 0 15px rgba(0, 170, 255, 0.4);
}
body:not(.dark-theme) .network-monitor:hover {
    box-shadow: 0 0 15px rgba(255, 0, 150, 0.4);
}
body.dark-theme .network-monitor:hover {
     box-shadow: 0 0 15px rgba(255, 0, 150, 0.4);
}
/* Adjust tooltip color for network if needed */
.network-monitor:hover::after {
    color: var(--panel-text-color);
}

.cpu-monitor:active, .memory-monitor:active, .network-monitor:active, .world-map:active {
    transform: scale(0.98);
    box-shadow: 0 0 5px rgba(0, 255, 170, 0.6);
}

/* 内存监视器可点击样式 - Combined above */
/* .memory-monitor { ... } */
/* .memory-monitor:hover { ... } */
/* .memory-monitor:hover::after { ... } */
/* .memory-monitor:active { ... } */

/* 资源占用标记 */
.high-usage {
    color: #f55 !important;
}

.medium-usage {
    color: #fc3 !important;
}

.low-usage {
    color: #0f9 !important;
}

/* 额外的暗色主题调整 */
body.dark-theme .cpu-monitor h3,
body.dark-theme .memory-monitor h3,
body.dark-theme .process-list h3,
body.dark-theme .network-monitor h3,
body.dark-theme .file-browser h3,
body.dark-theme .world-map h3 {
    color: #fff;
    border-bottom-color: rgba(0, 170, 255, 0.4);
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 0.85rem;
    padding-bottom: 5px;
}

body.dark-theme #cpuGraph,
body.dark-theme #memGraph,
body.dark-theme #networkGraph {
    filter: hue-rotate(140deg) saturate(0.9);
}

body.dark-theme .time-display {
    color: #fff;
    text-shadow: 0 0 10px rgba(0, 170, 255, 0.5);
    font-family: 'JetBrains Mono', monospace;
    letter-spacing: 1px;
}

body.dark-theme .status-bar {
    font-size: 0.75rem;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

body.dark-theme .network-stats,
body.dark-theme .cpu-stats,
body.dark-theme .memory-stats,
body.dark-theme .fs-stats {
    color: #0af;
    font-size: 0.75rem;
    letter-spacing: 0.5px;
}

body.dark-theme #terminal-output {
    font-family: 'Fira Code', monospace;
    font-size: 0.85rem;
    line-height: 1.4;
}

body.dark-theme .panel {
    border-width: 1px;
    border-style: solid;
    border-image: linear-gradient(to bottom, rgba(0,170,255,0.7), rgba(0,170,255,0.1)) 1 100%;
}

body.dark-theme .process-list table {
    width: 100%;
}

body.dark-theme #process-table th {
    color: #fff;
    font-weight: 400;
    letter-spacing: 1px;
    font-size: 0.75rem;
    padding: 5px 3px;
    text-transform: uppercase;
}

body.dark-theme #process-table td {
    color: #0af;
    border-bottom: 1px solid rgba(0, 170, 255, 0.15);
}

/* 操作系统风格窗口 */
.desktop-windows {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 100;
}

.window {
    position: absolute;
    background-color: var(--window-bg-color);
    color: var(--window-content-text-color);
    /* border: 1px solid var(--window-border-color); */ /* 移除边框 */
    border: none; /* 确认移除 */
    border-radius: 6px; /* 轻微圆角 */
    /* box-shadow: 0 5px 15px rgba(0, 170, 255, 0.4); */ /* 移除旧阴影 */
    box-shadow: 0 0 20px 5px var(--window-shadow-color); /* 使用变量定义辉光阴影 */
    display: flex;
    flex-direction: column;
    pointer-events: auto;
    transition: transform 0.3s ease, opacity 0.3s ease, box-shadow 0.3s ease; /* 添加阴影过渡 */
    overflow: hidden;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.window.active {
    /* border-color: var(--window-control-hover-color); */ /* 无边框，无需改变 */
    box-shadow: 0 0 25px 8px var(--window-shadow-color); /* 激活时阴影更强 */
}

.window.minimized {
    transform: scale(0.1);
    opacity: 0;
    pointer-events: none;
}

.window.maximized {
    border-radius: 0; /* 最大化时无圆角 */
}

.window.closing {
    transform: scale(0.8);
    opacity: 0;
}

.window-header {
    height: 30px;
    background-color: var(--window-header-bg-color);
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 10px;
    cursor: move;
    user-select: none;
    -webkit-user-select: none;
    /* border-bottom: 1px solid var(--window-border-color); */ /* 移除旧边框 */
    border-bottom: 1px solid var(--window-header-border-color); /* 使用新的头部边框颜色 */
    flex-shrink: 0; /* 防止头部被压缩 */
}

.window-title {
    font-size: 14px;
    color: var(--window-header-text-color);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 500;
}

.window-controls {
    display: flex;
}

.window-control {
    width: 22px; /* 稍大一点 */
    height: 22px;
    margin-left: 6px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: none; /* 移除按钮边框 */
    background-color: transparent; /* 透明背景 */
    color: var(--window-control-color);
    font-size: 18px; /* 调整图标/字符大小 */
    cursor: pointer;
    transition: all 0.2s;
    border-radius: 3px;
    padding: 0;
    line-height: 1;
    position: relative !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    z-index: auto !important;
}

.window-control:hover {
    color: var(--window-control-hover-color);
    background-color: var(--window-control-bg-hover); /* 悬停背景色 */
}

.window-close:hover {
    color: #fff;
    background-color: var(--window-close-hover-bg);
    /* border-color: var(--window-close-hover-bg); */ /* 无边框 */
}

.window-content {
    flex: 1;
    overflow: auto;
    padding: 15px;
    position: relative;
}

/* 自定义窗口内容滚动条 */
.window-content::-webkit-scrollbar {
    width: 8px; /* 滚动条宽度 */
    height: 8px; /* 水平滚动条高度 (如果需要) */
}

.window-content::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.2); /* 轨道背景色 */
    border-radius: 4px;
}

.window-content::-webkit-scrollbar-thumb {
    background-color: var(--window-border-color); /* 滑块颜色使用窗口边框色变量 */
    border-radius: 4px;
    border: 2px solid transparent; /* 创建内边距效果 */
    background-clip: content-box;
    transition: background-color 0.2s ease;
}

.window-content::-webkit-scrollbar-thumb:hover {
    background-color: var(--window-control-hover-color); /* 悬停时使用高亮颜色 */
}

.window-resize-handle {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 20px; /* 增大触发区域 */
    height: 20px;
    cursor: nwse-resize;
    background: transparent;
    z-index: 10; /* 确保在内容之上 */
}

.window-resize-handle::after {
    content: '';
    position: absolute;
    right: 5px; /* 调整图标位置 */
    bottom: 5px;
    width: 8px;
    height: 8px;
    border-right: 2px solid var(--window-resize-handle-color);
    border-bottom: 2px solid var(--window-resize-handle-color);
    opacity: 0.7; /* 半透明 */
    transition: opacity 0.2s ease;
}

.window-resize-handle:hover::after {
    opacity: 1; /* 悬停时不透明 */
}

/* 确保窗口内的选项卡正常工作 */
.window .tab-container {
    margin-top: 0;
    border-bottom: 1px solid var(--window-border-color);
}

.window .tabs {
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0;
}

.window .tab {
    padding: 8px 15px;
    cursor: pointer;
    background-color: rgba(from var(--window-header-bg-color) r g b / 0.3);
    color: var(--window-control-color);
    border: 1px solid transparent;
    margin-right: 5px;
    border-radius: 3px 3px 0 0;
    font-size: 14px;
}

.window .tab.active {
    background-color: rgba(from var(--window-header-bg-color) r g b / 0.6);
    color: var(--window-control-hover-color);
    border-color: var(--window-border-color);
    border-bottom-color: transparent;
}

.window .tab-content {
    padding: 15px 0;
}

.window .tab-pane {
    display: none;
}

.window .tab-pane.active {
    display: block;
}

.window table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

.window th, .window td {
    padding: 6px 10px;
    text-align: left;
    border-bottom: 1px solid rgba(from var(--window-border-color) r g b / 0.2);
}

.window th {
    color: var(--window-control-hover-color);
    font-weight: 500;
    background-color: rgba(from var(--window-header-bg-color) r g b / 0.7);
}

.window tr:hover {
    background-color: rgba(from var(--window-control-hover-color) r g b / 0.1);
}

/* 底部任务栏触发区域 */
#taskbar-trigger {
    position: fixed;
    /* top: 0; */ /* 移除顶部定位 */
    bottom: 0; /* 定位到底部 */
    left: 0;
    width: 100%;
    height: 5px;
    /* background-color: rgba(255, 0, 0, 0.2); */
    z-index: 10001;
}

/* 任务栏样式 - 底部自动隐藏 */
.window-taskbar {
    position: fixed;
    /* top: -40px; */ /* 移除顶部隐藏 */
    bottom: -40px; /* 初始隐藏在屏幕下方 */
    left: 10px; /* 改为固定左侧距离，不再居中 */
    transform: none; /* 移除居中变换 */
    display: none;
    justify-content: flex-start; /* 内容左对齐 */
    align-items: center;
    gap: 8px;
    background-color: var(--taskbar-bg-color);
    border: 1px solid var(--taskbar-border-color);
    /* border-top: none; */ /* 移除 */
    border-bottom: none; /* 底部不需要边框 */
    border-radius: 5px 5px 0 0; /* 只有上方圆角 */
    padding: 5px 10px;
    box-shadow: 0 -3px 8px rgba(0, 0, 0, 0.5); /* 阴影改为向上 */
    z-index: 10000;
    min-height: 30px;
    max-width: 90%; /* 增加宽度占比 */
    overflow-x: auto;
    opacity: 1;
    transition: bottom 0.3s ease-in-out; /* 过渡改为 bottom */
}

/* 当任务栏可见时 */
.window-taskbar.taskbar-visible {
    /* top: 0; */ /* 移除 */
    bottom: 0; /* 滑动到屏幕底部 */
}

/* 任务栏存在最小化窗口时的提示符 */
#taskbar-indicator {
    position: fixed;
    bottom: 0;
    left: 30px; /* 改为与任务栏对齐，稍微偏右 */
    transform: none; /* 移除居中变换 */
    width: 40px;
    height: 5px;
    background-color: var(--taskbar-indicator-color);
    border-radius: 3px 3px 0 0;
    box-shadow: 0 -2px 5px rgba(0, 170, 255, 0.5);
    z-index: 9999; /* 比任务栏低，比触发区高一点点 */
    display: none; /* 默认隐藏 */
    cursor: pointer; /* 暗示可点击 */
    transition: background-color 0.3s ease;
}

#taskbar-indicator:hover {
    background-color: var(--taskbar-indicator-hover-color);
}

/* 任务栏滚动条样式 */
.window-taskbar::-webkit-scrollbar {
    height: 4px;
}

.window-taskbar::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.2);
}

.window-taskbar::-webkit-scrollbar-thumb {
    background: var(--taskbar-border-color);
    border-radius: 2px;
}

.taskbar-item {
    display: flex;
    align-items: center;
    padding: 4px 8px;
    background-color: var(--taskbar-item-bg-color);
    border: 1px solid rgba(from var(--taskbar-border-color) r g b / 0.3);
    border-radius: 3px;
    cursor: pointer;
    transition: all 0.2s ease;
    white-space: nowrap;
    max-width: 150px;
    min-width: 80px;
}

.taskbar-item:hover {
    background-color: var(--taskbar-item-hover-bg-color);
    border-color: var(--taskbar-border-color);
}

.taskbar-icon {
    margin-right: 5px;
    font-size: 0.9em;
    color: var(--taskbar-icon-color);
}

.taskbar-title {
    font-size: 0.8em;
    color: var(--taskbar-title-color);
    overflow: hidden;
    text-overflow: ellipsis;
}

/* 添加世界地图可交互样式 */
.world-map {
    position: relative;
    background-color: var(--panel-bg-color);
    border: 1px solid var(--panel-border-color);
    border-radius: 5px;
    margin-top: 15px;
    padding: 10px;
    height: 450px; /* 改为固定高度，而不是百分比 */
    overflow-y: auto; /* 添加纵向滚动条 */
    overflow-x: hidden; /* 防止水平滚动条 */
    cursor: pointer; /* 添加指针光标提示可点击 */
    transition: all 0.3s ease;
}

.world-map:hover {
    box-shadow: 0 0 10px rgba(0, 255, 255, 0.3);
    transform: scale(1.01);
}

.world-map:hover::after {
    content: "点击查看详情";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: rgba(0, 0, 0, 0.8);
    color: #00ffff;
    padding: 8px 12px;
    border-radius: 4px;
    font-size: 14px;
    z-index: 10;
}

/* 确保地图和标题也可点击 */
.map-container {
    height: 250px; /* 固定高度 */
    min-height: 250px; /* 确保最小高度 */
    position: relative;
    margin-bottom: 10px; /* 与下方连接信息保持一定间距 */
}

.world-map h3 {
    font-family: var(--title-font);
    color: var(--title-color);
    font-size: 1rem;
    margin-bottom: 10px;
    -webkit-user-select: none;
    user-select: none;
}

.world-map-container {
        width: 100%;
    height: 400px;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid var(--border-color);
}

.world-map-container iframe {
    border: none;
}

.threat-stats {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px;
    margin-bottom: 20px;
}

.active-threats-list {
    margin-top: 10px;
}

.active-threats-list h3 {
    margin-bottom: 10px;
    color: var(--heading-color);
}

#worldmap-tab .resource-table {
    width: 100%;
    border-collapse: collapse;
}

#worldmap-tab .resource-table th {
    background-color: var(--header-bg);
    color: var(--header-text);
}

#worldmap-tab .resource-table td {
    border: 1px solid var(--border-color);
}

.right-panel {
    overflow-x: hidden; /* 明确禁止右侧面板的水平滚动 */
}

.world-map::-webkit-scrollbar {
    width: 5px;
}

.world-map::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.3);
}

.world-map::-webkit-scrollbar-thumb {
    background: var(--panel-border-color);
    border-radius: 5px;
}

.world-map::-webkit-scrollbar-thumb:hover {
    background: var(--panel-text-color);
}

/* 修复最小化和关闭按钮显示问题 */
body > .window-control,
html > .window-control {
    display: none !important;
}

/* 防止窗口控制按钮被拖曳 */
.window-control {
    user-drag: none;
    -webkit-user-drag: none;
}

/* 窗口恢复后的重置样式 */
.window.restored {
    transform: scale(1) !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
}

/* 命令建议框样式 */
.suggestion-box {
    display: none; /* 初始隐藏 */
    position: absolute;
    bottom: 100%; /* 定位到底部在其父容器(输入行)的顶部 */
    /* top: 0; */ /* 移除 top 定位 */
    /* transform: translateY(-100%); */ /* 移除 transform */
    left: 60px;  /* 与提示符后的输入位置对齐 (保持不变) */
    width: calc(100% - 70px); /* 适应父容器宽度 (保持不变) */
    max-height: 150px; /* 限制最大高度 */
    overflow-y: auto; /* 超出时滚动 */
    background-color: var(--panel-bg-color); /* 使用面板背景色 */
    border: 1px solid var(--panel-border-color); /* 使用面板边框色 */
    border-bottom: none; /* 底部不需要边框 */
    border-radius: 3px 3px 0 0; /* 顶部圆角 */
    z-index: 100; /* 确保在内容之上 */
    box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.3);
}

.suggestion-item {
    padding: 4px 8px;
    cursor: pointer;
    color: var(--panel-text-color);
    font-size: 0.85rem;
    white-space: nowrap;
}

.suggestion-item:hover {
    background-color: rgba(from var(--panel-border-color) r g b / 0.2);
}

.suggestion-item.selected {
    background-color: var(--panel-border-color);
    color: var(--main-bg-color); /* 反色显示 */
}

/* --- Suggestion Box Scrollbar Styling --- */
#suggestion-box {
    /* Firefox scrollbar */
    scrollbar-width: thin; /* "auto" or "thin" */
    /* Corrected variables: Use panel border for thumb, panel background for track */
    scrollbar-color: var(--panel-border-color) var(--panel-bg-color);
}

/* Webkit scrollbar */
#suggestion-box::-webkit-scrollbar {
    width: 8px;
}

#suggestion-box::-webkit-scrollbar-track {
    /* Corrected variable: Use panel background */
    background: var(--panel-bg-color);
    border-radius: 4px;
}

#suggestion-box::-webkit-scrollbar-thumb {
    /* Corrected variable: Use panel border color */
    background-color: var(--panel-border-color);
    border-radius: 4px;
    /* border: 1px solid var(--panel-border-color); */ /* Removed border or use panel-bg-color */
}

#suggestion-box::-webkit-scrollbar-thumb:hover {
    /* Corrected variable: Use panel header color for hover (often brighter) */
    background-color: var(--panel-header-color);
}