/* shengmingti.css 脑语言之生命体样式 广 20250511 */
:root {
    --主色: #3b82f6;
    --边框: #e5e7eb;
    --背景: #f3f4f6;
    --文本: #1f2937;
    --淡文本: #6b7280;
    --危险: #ef4444;
    --成功: #22c55e;
    --警告: #f59e0b;
    --紫色: #8b5cf6;
    --紫色深: #6d28d9;
    --蓝色: #06b6d4;
    --蓝色深: #0e7490;
    --橙色: #f97316;
    --橙色深: #c2410c;
}
.警告按钮 { background:var(--危险); color:#fff; border-color:var(--危险); }
.警告按钮:hover { background:#dc2626; border-color:#b91c1c; }
.成功按钮 { background:var(--成功); color:#fff; border-color:var(--成功); }
.成功按钮:hover { background:#16a34a; border-color:#15803d; }
.紫色按钮 { background:var(--紫色); color:#fff; border-color:var(--紫色); }
.紫色按钮:hover { background:var(--紫色深); border-color:var(--紫色深); }
.蓝色按钮 { background:var(--蓝色); color:#fff; border-color:var(--蓝色); }
.蓝色按钮:hover { background:var(--蓝色深); border-color:var(--蓝色深); }
.橙色按钮 { background:var(--橙色); color:#fff; border-color:var(--橙色); }
.橙色按钮:hover { background:var(--橙色深); border-color:var(--橙色深); }
.图标按钮 { padding:6px; }
.面板 { 
    position:fixed; top:50%; left:50%; transform:translate(-50%,-50%); 
    background:#fff; padding:24px; border-radius:12px; 
    box-shadow:0 4px 6px -1px rgba(0,0,0,0.1); z-index:1000; 
    display:none; min-width:400px; max-width:80vw;
    max-height:80vh; overflow:auto;
}
.面板头部 { display:flex; justify-content:space-between; align-items:center; margin-bottom:20px; }
.面板标题 { font-size:18px; font-weight:bold; color:var(--文本); }
.面板内容 { margin:16px 0; }
.遮罩 { position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5); z-index:999; display:none; backdrop-filter:blur(2px); }
.标签 { 
    font-size:13px; color:var(--淡文本); border-bottom:1px solid var(--边框); 
    padding:8px 12px; display:flex; justify-content:space-between; 
    align-items:center; background:#fff;
}
.配置行 { display:flex; align-items:center; margin:12px 0; gap:8px; }
.配置标签 { width:100px; flex-shrink:0; color:var(--文本); font-weight:500; }
.配置输入 { 
    flex:1; padding:8px 12px; border:1px solid var(--边框); 
    border-radius:6px; font-size:13px; transition:all 0.2s;
}
.配置输入:focus { outline:none; border-color:var(--主色); box-shadow:0 0 0 2px rgba(59,130,246,0.1); }
.记录时间 { color:var(--淡文本); font-size:12px; }
.记录内容 { margin-top:6px; }
.记录类型 { 
    display:inline-block; padding:2px 8px; border-radius:4px; 
    font-size:12px; margin-right:6px; font-weight:500;
}
.类型执行 { background:var(--成功); color:#fff; }
.类型错误 { background:var(--危险); color:#fff; }
.类型系统 { background:var(--主色); color:#fff; }
.类型AI { background:var(--紫色); color:#fff; }
.工具栏按钮组 { display:flex; gap:6px; align-items:center; }
.分割线 { width:1px; height:24px; background:var(--边框); margin:0 8px; }
.函数分类 { 
    font-weight:bold; color:var(--淡文本); 
    padding:4px 8px; margin:8px 0 4px 0;
    border-bottom:1px dashed var(--边框);
}
.搜索框 {
    padding:8px 12px; border:1px solid var(--边框);
    border-radius:6px; width:100%; margin-bottom:8px;
    font-size:13px;
}
.搜索框:focus { outline:none; border-color:var(--主色); }
.状态图标 {
    width:8px; height:8px; border-radius:50%;
    display:inline-block; margin-right:6px;
}
.状态在线 { background:var(--成功); }
.状态生成 { background:var(--警告); }
.状态错误 { background:var(--危险); }
.主题切换 {
    position:relative; width:40px; height:20px;
    background:var(--边框); border-radius:10px;
    cursor:pointer; transition:all 0.3s;
}
.主题切换::after {
    content:''; position:absolute; width:16px; height:16px;
    background:#fff; border-radius:50%; top:2px; left:2px;
    transition:all 0.3s;
}
.主题切换.暗色::after { transform:translateX(20px); }
.主题切换.暗色 { background:var(--主色); }
.工具提示 {
    position:absolute; background:rgba(0,0,0,0.8); color:#fff;
    padding:4px 8px; border-radius:4px; font-size:12px;
    z-index:1000; display:none;
}
.文件夹图标 {
    margin-right: 6px;
    color: var(--主色);
}
.历史记录项 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 8px;
}
.历史记录操作 {
    display: flex;
    gap: 8px;
}
.标签页按钮 {
    padding: 6px 12px;
    border: none;
    border-bottom: 2px solid transparent;
    background: transparent;
    cursor: pointer;
    font-size: 13px;
    color: var(--淡文本);
    border-radius: 0;
}
.标签页按钮.活 {
    color: var(--主色);
    border-bottom-color: var(--主色);
    font-weight: bold;
}
.标签页内容 {
    display: none;
    height: 100%;
    overflow: auto;
}
.标签页内容.活 {
    display: block;
}
.进度条容器 {
    width: 100%;
    height: 4px;
    background-color: var(--边框);
    margin-top: 10px;
}
.进度条 {
    height: 100%;
    background-color: var(--主色);
    width: 0%;
    transition: width 0.3s;
}
.统计卡片 {
    border: 1px solid var(--边框);
    padding: 10px;
    border-radius: 8px;
    margin-bottom: 10px;
    background: white;
    display: flex;
    flex-direction: column;
    gap: 5px;
}
.统计标题 {
    font-weight: bold;
    color: var(--淡文本);
    font-size: 12px;
}
.统计数值 {
    font-size: 18px;
    font-weight: bold;
    color: var(--主色);
}
.统计容器 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    margin: 10px 0;
}
.响应式网格 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: 10px;
    margin-top: 10px;
}
.函数快捷按钮 {
    border: 1px solid var(--边框);
    padding: 8px;
    border-radius: 6px;
    background: white;
    cursor: pointer;
    text-align: center;
    transition: all 0.2s;
    font-size: 12px;
    word-break: break-word;
}
.函数快捷按钮:hover {
    background: var(--背景);
    transform: translateY(-2px);
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}
.高级模式 {
    padding: 2px 6px;
    background: var(--主色);
    color: white;
    border-radius: 4px;
    font-size: 10px;
    margin-left: 6px;
}
.暗色模式 body {
    background: #111827;
    color: #f9fafb;
}
.暗色模式 #北, .暗色模式 #南, .暗色模式 .标签, .暗色模式 .面板 {
    background: #1f2937;
    border-color: #374151;
}
.暗色模式 .项目, .暗色模式 .统计卡片, .暗色模式 .函数快捷按钮 {
    background: #1f2937;
    border-color: #374151;
}
.暗色模式 .配置输入, .暗色模式 .搜索框 {
    background: #1f2937;
    border-color: #374151;
    color: #f9fafb;
}
.暗色模式 .按钮 {
    background: #1f2937;
    border-color: #374151;
    color: #f9fafb;
}
.暗色模式 .按钮:hover {
    background: #374151;
}
.滚动动画 {
    animation: 滚动 0.5s ease-out;
}
@keyframes 滚动 {
    0% { opacity: 0; transform: translateY(-10px); }
    100% { opacity: 1; transform: translateY(0); }
}
.折叠按钮 {
    cursor: pointer;
    user-select: none;
}
.折叠内容 {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-out;
}
.折叠内容.展开 {
    max-height: 500px;
}
.导出选项 {
    display: flex;
    gap: 10px;
    margin-top: 10px;
}
.轻量提示 {
    position: fixed;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    padding: 10px 20px;
    background: rgba(0,0,0,0.8);
    color: white;
    border-radius: 6px;
    z-index: 1000;
    opacity: 0;
    transition: opacity 0.3s;
}
.轻量提示.显示 {
    opacity: 1;
}
.错误标记 {
    border-bottom: 2px wavy var(--危险);
}
.代码运行状态 {
    position: absolute;
    right: 10px;
    bottom: 10px;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 12px;
    color: white;
    z-index: 5;
    opacity: 0.8;
}
.运行中 {
    background: var(--警告);
}
.运行成功 {
    background: var(--成功);
}
.运行失败 {
    background: var(--危险);
}
.代码输入提示 {
    position: absolute;
    left: 8px;
    bottom: 8px;
    font-size: 12px;
    color: var(--淡文本);
    z-index: 1;
}
.模型选择器 {
    position: relative;
    display: inline-block;
}
.模型选择器选项 {
    position: absolute;
    top: 100%;
    left: 0;
    background: white;
    border: 1px solid var(--边框);
    border-radius: 6px;
    width: 200px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    display: none;
    z-index: 100;
}
.暗色模式 .模型选择器选项 {
    background: #1f2937;
    border-color: #374151;
}
.模型选项 {
    padding: 8px 12px;
    cursor: pointer;
    transition: all 0.2s;
}
.模型选项:hover {
    background: var(--背景);
}
.暗色模式 .模型选项:hover {
    background: #374151;
}
.AI提示列表 {
    margin-top: 10px;
    border-top: 1px solid var(--边框);
    padding-top: 10px;
}
.AI提示项 {
    padding: 6px 10px;
    margin-bottom: 4px;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s;
}
.AI提示项:hover {
    background: var(--背景);
    transform: translateX(4px);
}
.暗色模式 .AI提示项:hover {
    background: #374151;
}
.模型图标 {
    font-size: 16px;
    margin-right: 6px;
    vertical-align: middle;
}
.星星评分 {
    unicode-bidi: bidi-override;
    direction: rtl;
    text-align: left;
    display: inline-block;
}
.星星评分 > span {
    display: inline-block;
    position: relative;
    width: 1.1em;
    font-size: 18px;
    cursor: pointer;
    color: var(--边框);
}
.星星评分 > span.已选:before,
.星星评分 > span.已选 ~ span:before {
    content: "\2605";
    position: absolute;
    color: var(--警告);
}
.星星评分 > span:hover:before,
.星星评分 > span:hover ~ span:before {
    content: "\2605";
    position: absolute;
    color: var(--警告);
}
.快速命令面板 {
    position: fixed;
    top: 30%;
    left: 50%;
    transform: translateX(-50%);
    width: 500px;
    max-width: 90vw;
    background: white;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    padding: 12px;
    z-index: 1001;
    display: none;
}
.暗色模式 .快速命令面板 {
    background: #1f2937;
    border-color: #374151;
}
.命令搜索框 {
    width: 100%;
    padding: 8px 12px;
    border: 1px solid var(--边框);
    border-radius: 6px;
    font-size: 14px;
    margin-bottom: 8px;
}
.命令搜索框:focus {
    outline: none;
    border-color: var(--主色);
    box-shadow: 0 0 0 2px rgba(59,130,246,0.1);
}
.命令列表 {
    max-height: 300px;
    overflow-y: auto;
}
.命令项 {
    padding: 8px 10px;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.命令项:hover {
    background: var(--背景);
}
.暗色模式 .命令项:hover {
    background: #374151;
}
.命令项.选中 {
    background: rgba(59,130,246,0.1);
}
.暗色模式 .命令项.选中 {
    background: rgba(59,130,246,0.2);
}
.命令名 {
    font-weight: 500;
}
.命令描述 {
    font-size: 12px;
    color: var(--淡文本);
}
.命令快捷键 {
    font-size: 12px;
    color: var(--淡文本);
    background: var(--背景);
    padding: 2px 6px;
    border-radius: 4px;
}
.暗色模式 .命令快捷键 {
    background: #374151;
    color: #9ca3af;
}
.徽章 {
    display: inline-block;
    padding: 2px 6px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: bold;
    margin-left: 6px;
    vertical-align: middle;
}
.徽章-新 {
    background: var(--成功);
    color: white;
}
.徽章-热门 {
    background: var(--橙色);
    color: white;
}
.徽章-AI {
    background: var(--紫色);
    color: white;
}
.顶部导航 {
    display: flex;
    align-items: center;
    gap: 2px;
}
.顶部导航按钮 {
    padding: 6px 12px;
    border: none;
    border-radius: 4px;
    background: transparent;
    color: var(--淡文本);
    cursor: pointer;
    font-size: 13px;
    font-weight: 500;
    transition: all 0.2s;
}
.顶部导航按钮:hover {
    background: var(--背景);
    color: var(--文本);
}
.顶部导航按钮.活 {
    color: var(--主色);
    background: rgba(59,130,246,0.1);
}
.动画淡入 {
    animation: 淡入 0.3s ease-in-out;
}
@keyframes 淡入 {
    0% { opacity: 0; }
    100% { opacity: 1; }
}
.导航栏徽标 {
    font-weight: bold;
    font-size: 16px;
    margin-right: 10px;
    color: var(--主色);
    display: flex;
    align-items: center;
    gap: 6px;
}
.导航栏徽标图标 {
    font-size: 20px;
}
.缩略语提示 {
    border-bottom: 1px dotted var(--淡文本);
    cursor: help;
}
.AI模型标志 {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
    margin-left: 8px;
    background: rgba(139, 92, 246, 0.1);
    color: var(--紫色);
}
.右上角菜单项 {
    position: absolute;
    top: 5px;
    right: 5px;
    color: var(--淡文本);
    cursor: pointer;
    padding: 4px;
    border-radius: 4px;
    transition: all 0.2s;
}
.右上角菜单项:hover {
    color: var(--文本);
    background: rgba(0,0,0,0.05);
}
.贴片 {
    font-size: 10px;
    padding: 2px 4px;
    border-radius: 3px;
    margin-left: 4px;
    font-weight: bold;
    vertical-align: text-top;
}
.贴片-AI {
    background: var(--紫色);
    color: white;
}
.贴片-实验 {
    background: var(--警告);
    color: white;
}
.贴片-系统 {
    background: var(--主色);
    color: white;
}
.生成模型信息 {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
    border-bottom: 1px solid var(--边框);
    margin-bottom: 10px;
}
.生成模型选择 {
    display: flex;
    align-items: center;
    gap: 8px;
}
.AI设置按钮 {
    color: var(--淡文本);
    cursor: pointer;
    border-radius: 4px;
    padding: 4px;
    transition: all 0.2s;
}
.AI设置按钮:hover {
    color: var(--文本);
    background: rgba(0,0,0,0.05);
}
.暗色模式 .AI设置按钮:hover {
    background: rgba(255,255,255,0.1);
}
@keyframes 旋转 {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
.加载中 {
    animation: 旋转 1s linear infinite;
    display: inline-block;
}
.旁上{
    height: 50%;
    overflow: auto;
    display: flex;
    flex-direction: column;
}
.旁下{
    height: 50%;
    overflow: auto;
}
.文{height: 100%;}
.标签页导航 {display: flex;}