无尽地平线|真实网游模拟

/* =========================================
   系统加载动画重构 (Loading) - 完美适配 rili
   ========================================= */
/* 隐藏原生的三个加载小圆点 */
div.border-muted:has(span.aspect-square.bg-primary.rounded-full) div.size-6 {
  display: none !important;
}

/* 主容器：科技背景 + 网格线 */
div.border-muted:has(span.aspect-square.bg-primary.rounded-full) {
  width: 100% !important;
  min-width: 400px !important; /* [防挤压补丁] 强行撑开外部 w-fit 限制 */
  height: auto !important;
  min-height: 120px !important; /* 保持足够高度 */
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: center !important;
  position: relative !important;
  overflow: hidden !important;
  padding-bottom: 20px !important;

  /* 深色科技背景 + 网格线 */
  background-color: #0b1015 !important;
  background-image: 
    linear-gradient(rgba(0, 243, 255, 0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 243, 255, 0.05) 1px, transparent 1px) !important;
  background-size: 20px 20px !important;

  /* 边框发光 */
  border: 1px solid rgba(0, 243, 255, 0.2) !important;
  box-shadow: inset 0 0 30px rgba(0, 0, 0, 0.8), 0 0 10px rgba(0, 243, 255, 0.1) !important;
  border-radius: 4px !important;
}

/* 3. 核心动画：旋转的 HUD 扫描圈 */
div.border-muted:has(span.aspect-square.bg-primary.rounded-full)::before {
  content: '' !important;
  position: absolute !important;
  
  /* --- 稳健居中法 (不占用 transform) --- */
  top: 40% !important;
  left: 50% !important;
  width: 50px !important;
  height: 50px !important;
  margin-left: -25px !important; /* 宽度的一半 */
  margin-top: -25px !important;  /* 高度的一半 */
  
  /* --- 视觉样式：断开的科技圆环 --- */
  border-radius: 50% !important;
  border: 3px solid transparent !important; /*以此为基础*/
  border-top: 3px solid #00f3ff !important;   /* 上弧 */
  border-bottom: 3px solid #00f3ff !important; /* 下弧 */
  
  /* 发光效果 */
  box-shadow: 0 0 10px rgba(0, 243, 255, 0.5) !important;
  
  /* --- 强制旋转动画 --- */
  animation: cyber-spin 1s linear infinite !important;
  z-index: 10 !important;
}

/* 4. 文字层：闪烁的提示 */
div.border-muted:has(span.aspect-square.bg-primary.rounded-full)::after {
  content: '系统渲染中...\A [建议记忆4-底部按钮支持横向滑动]' !important;
  white-space: pre !important;
  text-align: center !important;
  
  position: absolute !important;
  bottom: 20px !important;
  left: 0 !important;
  width: 100% !important; /* 宽度撑满，利用 text-align 居中 */
  
  font-family: "JetBrains Mono", "Consolas", monospace !important;
  font-size: 12px !important;
  font-weight: bold !important;
  line-height: 1.5 !important;
  color: rgba(0, 243, 255, 0.8) !important;
  letter-spacing: 1px !important;
  
  animation: text-blink 2s ease-in-out infinite !important;
}

/* --- 动画关键帧定义 --- */
@keyframes cyber-spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

@keyframes text-blink {
  0%, 100% { opacity: 0.6; text-shadow: none; }
  50% { opacity: 1; text-shadow: 0 0 8px #00f3ff; }
}

/* =========================================
   全局容器与基础美化 (轻量版)
   ========================================= */
/* 映射新平台的主气泡容器 */
div.border-muted:has(.rili-markdown-renderer) {
    background: linear-gradient(135deg, #0a0e1a 0%, #1a1f2e 100%) !important;
    border: 2px solid #00ffff !important;
    border-radius: 20px !important;
    /* 优化：减少阴影层数，减轻渲染压力 */
    box-shadow: 
        inset 0 0 20px rgba(0, 255, 255, 0.1),
        0 5px 20px rgba(0, 0, 0, 0.5) !important;
    position: relative !important;
    overflow: visible !important;
    /* [抗锯齿补丁] 防止流光动画导致字体边缘抽搐发糊 */
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
    text-rendering: optimizeLegibility !important;
}

/* 边框流光动画保留，这通常不会造成大卡顿 */
div.border-muted:has(.rili-markdown-renderer)::before {
    content: "" !important;
    position: absolute !important;
    top: -1px !important; left: -1px !important; right: -1px !important; bottom: -1px !important;
    background: linear-gradient(45deg, #ff006e, #00ffff, #ff006e) !important;
    border-radius: 20px !important;
    opacity: 0.5 !important;
    z-index: -1 !important;
    animation: borderGlow 4s ease-in-out infinite !important; /* 减慢动画频率 */
}

@keyframes borderGlow {
    0%, 100% { opacity: 0.3; }
    50% { opacity: 0.6; }
}

/* 映射 Markdown 渲染器 */
.rili-markdown-renderer {
    font-family: 'Orbitron', 'Noto Sans SC', monospace !important;
    color: #e0e0e0 !important;
    padding: 20px !important;
    font-size: 14px !important;
    background: transparent !important;
}

/* --- PRE 标签修复 --- */
.rili-markdown-renderer pre {
    background: rgba(0, 0, 0, 0.6) !important;
    color: #00ffff !important;
    padding: 15px !important;
    border-radius: 8px !important;
    border: 1px solid rgba(0, 255, 255, 0.2) !important;
    white-space: pre-wrap !important;
    word-wrap: break-word !important;
    font-family: 'Orbitron', monospace !important;
    margin: 15px 0 !important;
}

/* =========================================
   思维链：智能感应模式 (Smart Sensor)
   ========================================= */

/* 1. 基础形态：默认就是“隐藏状态” */
.thought-process {
    /* 默认状态：高度为0，透明，不占空间 */
    max-height: 0 !important;
    opacity: 0 !important;
    margin: 0 !important;
    border: none !important;
    overflow: hidden !important;
    /* 加上一点过渡，让消失不那么生硬，像关电视一样 */
    transition: all 0.5s ease-in-out !important;
}

/* 2. [核心逻辑] 激活状态：只有当它是“最后一个元素”时才显示 */
/* 意味着：AI 正在写它，或者刚写完它还没写下一个标签 */
.thought-process:last-child {
    /* 激活状态：撑开高度，显示扫描条 */
    max-height: 50px !important; /* 足够容纳36px的条 */
    opacity: 1 !important;
    margin-bottom: 15px !important;
}

/* ------------------------------------------------
   以下是扫描条的视觉样式 (复用之前的赛博风格)
   ------------------------------------------------ */

/* 内部 Details 锁定 */
.thought-process details {
    height: 36px !important;
    min-height: 36px !important;
    background: rgba(0, 0, 0, 0.9) !important;
    border: 1px solid rgba(0, 243, 255, 0.4) !important;
    border-radius: 4px !important;
    position: relative !important;
    overflow: hidden !important;
    list-style: none !important;
}

/* 隐藏 Summary 文字 */
.thought-process summary {
    font-size: 0 !important;
    color: transparent !important;
    height: 36px !important;
}
.thought-process summary::-webkit-details-marker { display: none !important; }

/* 视觉特效：扫描光束 */
.thought-process details::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: -100% !important;
    width: 100% !important;
    height: 100% !important;
    background: linear-gradient(90deg, transparent, rgba(0, 243, 255, 0.2), rgba(0, 243, 255, 0.8), transparent) !important;
    transform: skewX(-30deg) !important;
    animation: scan-beam 1.5s infinite linear !important;
}

/* =========================================
   5. [核心文字]：多句循环 + 绝对打字机修复版
   ========================================= */
.thought-process details::after {
    content: ''; 
    
    /* 布局：左对齐 */
    position: absolute !important;
    top: 0 !important;
    left: 10px !important; 
    height: 36px !important;
    line-height: 36px !important;
    
    /* 字体：使用等宽字体以保证打字效果更像终端 */
    font-family: 'JetBrains Mono', 'Consolas', monospace !important;
    font-size: 11px !important; 
    font-weight: bold !important;
    color: #00f3ff !important;
    text-shadow: 0 0 5px rgba(0, 243, 255, 0.6) !important;
    
    /* 核心逻辑 */
    white-space: nowrap !important;
    overflow: hidden !important;
    width: 0;
    
    /* 模拟光标 _ (右边框透明，用阴影模拟) */
    border-right: 2px solid transparent !important; 
    box-shadow: 5px 0 0 0 transparent !important;
    
    z-index: 10 !important;
    
    /* [关键修改] 
       1. 使用 linear 替代 steps，消除步进误差，确保宽度能平滑归零。
       2. 时长设为 18s，给每句话足够展示时间。
    */
    animation: 
        typewriter-fix 18s linear infinite,
        cursor-blink 0.8s step-end infinite !important;
}

/* =========================================
   关键帧：三句循环 (带安全缓冲区的逻辑)
   ========================================= */
@keyframes typewriter-fix {
    /* --- 第一句：正在思考剧情走向…… (约10字 -> 设130px) --- */
    0% { 
        content: "正在思考剧情走向……"; 
        width: 0; 
    }
    1% { width: 0; }        /* [缓冲] 确保开始时是空的 */
    5% { width: 130px; }    /* 打字过程 */
    30% { width: 130px; }   /* 停留阅读 */
    32% { width: 0; }       /* 快速删除 */
    
    /* --- [安全区 1] 32%~33.5%：宽度锁死为0，内容在此期间切换 --- */
    32.1% { width: 0; content: "正在思考剧情走向……"; } /* 保持旧内容归零 */
    32.2% { content: "如果有问题请评论区留言，下方有按钮支持横向拖动"; } /* [核心] 宽度为0时偷偷换内容 */
    33.5% { width: 0; }     /* 保持新内容宽度为0，准备开始 */

    /* --- 第二句：如果有问题... (约22字 -> 设300px) --- */
    38% { width: 300px; }   /* 打字 */
    63% { width: 300px; }   /* 停留 */
    65% { width: 0; }       /* 删除 */

    /* --- [安全区 2] 65%~66.5%：同理 --- */
    65.1% { width: 0; content: "如果有问题请评论区留言"; }
    65.2% { content: "如果渠道异常建议切换yuege0.132"; } 
    66.5% { width: 0; }

    /* --- 第三句：如果渠道异常... (约16字 -> 设220px) --- */
    71% { width: 220px; }   /* 打字 */
    96% { width: 220px; }   /* 停留 */
    98% { width: 0; }       /* 删除 */
    
    /* --- [安全区 3] 循环回第一句 --- */
    98.1% { width: 0; content: "如果渠道异常请切换其他"; }
    98.2% { content: "正在思考剧情走向……"; }
    100% { width: 0; }
}

/* 下划线光标闪烁 */
@keyframes cursor-blink {
    0%, 100% { box-shadow: inset -8px -4px 0 0 #00f3ff; }
    50% { box-shadow: inset -8px -4px 0 0 transparent; }
}

/* --- 隐藏逻辑 --- */
.thought-pro {
    display: none !important;
}

/* =========================================
   折叠面板 (性能优化版)
   ========================================= */
.rili-markdown-renderer details {
    width: 100% !important; /* 防挤压 */
    min-width: 450px !important; /* 防挤压 */
    margin-bottom: 15px;
    border: 1px solid rgba(0, 255, 255, 0.3);
    border-radius: 10px;
    background: rgba(26, 31, 46, 0.6);
    /* 移除 backdrop-filter，这在动态高度变化时非常消耗性能 */
    /* backdrop-filter: blur(10px); */ 
    
    /* [核心] 必须保留可见，否则气泡会被切断 */
    overflow: visible !important;
    
    /* [优化] 仅过渡关键视觉属性，不过渡布局属性 */
    transition: border-color 0.2s, box-shadow 0.2s;
    
    position: relative;
    z-index: 1;
}

/* 鼠标悬停时提升层级 (解决遮挡)，但减少视觉特效 */
.rili-markdown-renderer details:hover,
.rili-markdown-renderer details[open]:hover {
    z-index: 500; /* 降低层级数值，足够盖住下方即可 */
    border-color: #00ffff;
    /* 简化阴影 */
    box-shadow: 0 0 15px rgba(0, 255, 255, 0.2);
}

.rili-markdown-renderer details[open] {
    border-color: #00ffff;
}

.rili-markdown-renderer summary {
    list-style: none;
    padding: 12px 20px;
    background: linear-gradient(90deg, rgba(0, 255, 255, 0.1) 0%, transparent 100%);
    color: #00ffff;
    font-weight: bold;
    letter-spacing: 1px;
    cursor: pointer;
    position: relative;
    z-index: 2;
    /* [优化] 移除 all transition */
    transition: padding 0.2s, background 0.2s;
}

.rili-markdown-renderer summary::-webkit-details-marker { display: none; }

.rili-markdown-renderer summary::before {
    content: "▶";
    position: absolute;
    left: 10px;
    transition: transform 0.2s; /* 独立动画 */
    color: #ff006e;
}

.rili-markdown-renderer details[open] > summary::before {
    transform: rotate(90deg);
}

.rili-markdown-renderer summary:hover {
    background: linear-gradient(90deg, rgba(0, 255, 255, 0.2) 0%, rgba(255, 0, 110, 0.1) 100%);
    padding-left: 25px;
}

/* =========================================
   Tooltip 系统 (性能优化)
   ========================================= */
.rili-markdown-renderer info {
    color: #00ffff;
    font-weight: bold;
    margin-right: 5px;
}

.rili-markdown-renderer T {
    position: relative; /* 必须 */
    display: inline-block;
    margin-bottom: 3px;
    margin-right: 8px;
    cursor: help;
    text-decoration-line: underline;
    text-decoration-style: dotted;
    text-decoration-color: #ff006e;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
    color: #ffd700;
    /* [优化] 仅过渡颜色 */
    transition: color 0.2s;
}

.rili-markdown-renderer T:hover {
    color: #00ffff;
    z-index: 1000; /* 局部提升 */
}

.rili-markdown-renderer T::before { content: "\2060"; }

.rili-markdown-renderer T Ti {
    visibi

/* 预览已截断；下载 CSS 可查看完整内容。 */

本页只展示本地导出中可核验的公开字段。下载 JSON 可查看完整原始记录。