dag支持thinking模式；动画速度改进；其它小改进

Dockerfile

@@ -63,5 +63,5 @@ EXPOSE 7860
 # 在CPU basic 上使用0.6b模型能达到及格的速度
 # 在CPU upgrade 上使用1.7b模型能达到及格的速度
 # 在本地M5 16G芯片上使用4b模型能达到及格的速度（瓶颈是内存大小）；M5 16G内存仅能同时支持一种分析模型（信息密度分析或语义分析）
-CMD ["python", "run.py", "--no_auto_load", "--port", "7860", "--model", "qwen3-1.7b", "--semantic_model", "qwen3-1.7b-instruct"]
-# CMD ["python", "run.py", "--no_auto_load", "--port", "7860", "--model", "qwen3-0.6b", "--semantic_model", "qwen3-0.6b-instruct"]
+CMD ["python", "run.py", "--no_auto_load", "--port", "7860", "--base_model", "qwen3-1.7b", "--instruct_model", "qwen3-1.7b-instruct"]
+# CMD ["python", "run.py", "--no_auto_load", "--port", "7860", "--base_model", "qwen3-0.6b", "--instruct_model", "qwen3-0.6b-instruct"]

backend/api/analyze.py

@@ -6,7 +6,7 @@ import queue
 import threading
 from typing import Optional
 from backend.platform.schemas import create_empty_analysis_result
-from backend.models.model_manager import project_registry, DEFAULT_MODEL, inference_lock
+from backend.models.model_manager import project_registry, DEFAULT_BASE_MODEL, inference_lock
 from model_paths import resolve_hf_path
 from backend.platform.oom import exit_if_oom
 from backend.api.sse_utils import (
@@ -86,7 +86,7 @@ def _validate_and_prepare_request(analyze_request):
     # 获取默认模型（使用模块级上下文以获取持久化的当前活动模型）
     from backend.platform.app_context import get_app_context
     context = get_app_context(prefer_module_context=True)
-    default_model = context.model_name if context.model_name else DEFAULT_MODEL
+    default_model = context.base_model_id if context.base_model_id else DEFAULT_BASE_MODEL
     
     # 处理 default、None 或空字符串，使用默认模型
     if not model or model == 'default' or model == '':
@@ -119,7 +119,7 @@ def _load_project_with_error_handling(model):
     p = project_registry.get(model)
     if p is None:
         from backend.platform.app_context import get_app_context
-        from backend.models.model_manager import ensure_main_slot_ready
+        from backend.models.model_manager import ensure_base_slot_ready
 
         context = get_app_context(prefer_module_context=True)
         if context.model_loading:
@@ -129,7 +129,7 @@ def _load_project_with_error_handling(model):
         # 懒加载模式 (--no_auto_load)：首次请求仅初始化主槽位（权重 + QwenLM 项目）
         if getattr(context.args, 'no_auto_load', False):
             try:
-                ensure_main_slot_ready()
+                ensure_base_slot_ready()
                 p = project_registry.get(model)
             except Exception as e:  # noqa: BLE001
                 import traceback

backend/api/client_activity.py

@@ -47,6 +47,6 @@ def client_activity_report(activity_body=None):
     if _sparse_page_activity_log_cum(cum):
         log_request(
             "📄 页面活跃",
-            f"path={log_path!r} total_sec={cum} delta_sec={dlt}",
+            f"path(sampled)={log_path!r} total_sec={cum} delta_sec={dlt}",
         )
     return {"ok": True}

backend/api/model_switch.py

@@ -49,7 +49,7 @@ def get_current_model():
     
     return {
         'success': True,
-        'model': context.model_name,
+        'model': context.base_model_id,
         'loading': context.model_loading,
         'device_type': device_type,
         'use_int8': os.environ.get('FORCE_INT8') == '1',
@@ -115,7 +115,7 @@ def switch_model(switch_request):
 
         # 使用模块级上下文以确保状态修改持久化（不会被后续请求重置）
         context = get_app_context(prefer_module_context=True)
-        current_model = context.model_name
+        current_model = context.base_model_id
 
         # 保存当前环境变量配置（用于回滚）
         old_force_int8 = os.environ.get('FORCE_INT8')
@@ -223,7 +223,7 @@ def switch_model(switch_request):
     return (
         {
             'success': False,
-            'message': '在线模型切换已禁用，请通过命令行 --model / --semantic_model 指定后重启服务',
+            'message': '在线模型切换已禁用，请通过命令行 --base_model / --instruct_model 指定后重启服务',
         },
         501,
     )

backend/api/openai_completions.py

@@ -7,7 +7,7 @@ import time
 import traceback
 from typing import Any, Callable, Dict, List, Optional, Tuple
 
-from backend.models.model_manager import inference_lock, get_semantic_model_display_name
+from backend.models.model_manager import inference_lock, get_instruct_model_display_name
 from backend.core.prediction_attributor import slot_for_prediction_attr_model
 from backend.platform.oom import exit_if_oom, is_oom_error
 from backend.core.completion_generator import (
@@ -54,7 +54,7 @@ def _build_response(
         "id": "cmpl-stub-info-radar",
         "object": "text_completion",
         "created": int(time.time()),
-        "model": get_semantic_model_display_name(),
+        "model": get_instruct_model_display_name(),
         "choices": [
             {
                 "text": completion_text,
@@ -322,6 +322,14 @@ def completions_prompt(completions_prompt_request):
             return {"success": False, "message": "system 必须为字符串"}, 400
         system_opt = system_raw
 
+    enable_thinking_raw = completions_prompt_request.get("enable_thinking")
+    if enable_thinking_raw is None:
+        enable_thinking = False
+    elif not isinstance(enable_thinking_raw, bool):
+        return {"success": False, "message": "enable_thinking 必须为布尔值"}, 400
+    else:
+        enable_thinking = enable_thinking_raw
+
     client_ip = get_client_ip()
     from backend.platform.access_log import log_openai_completions_prompt_request
 
@@ -329,6 +337,7 @@ def completions_prompt(completions_prompt_request):
         model,
         user_prompt=prompt,
         system=system_opt,
+        enable_thinking=enable_thinking,
         client_ip=client_ip,
     )
 
@@ -338,7 +347,9 @@ def completions_prompt(completions_prompt_request):
         return {"success": False, "message": str(e)}, 400
 
     try:
-        prompt_used = apply_chat_template_for_completion(prompt, system_opt, slot=slot)
+        prompt_used = apply_chat_template_for_completion(
+            prompt, system_opt, slot=slot, enable_thinking=enable_thinking
+        )
     except PromptTooLongError as e:
         return {"success": False, "message": str(e)}, 400
 

backend/core/completion_generator.py

@@ -19,7 +19,7 @@ from transformers import StoppingCriteria, StoppingCriteriaList, TextStreamer
 from backend.platform.format import round_to_sig_figs
 from backend.platform.app_context import get_verbose
 from backend.models.device import DeviceManager
-from backend.models.model_manager import ModelSlot, ensure_semantic_slot_ready, ensure_slot_weights_loaded
+from backend.models.model_manager import ModelSlot, ensure_instruct_slot_ready, ensure_slot_weights_loaded
 from .pred_topk_format import pred_topk_pairs_from_probs_1d
 from backend.platform.runtime_config import DEFAULT_TOPK
 
@@ -408,7 +408,7 @@ def core_generate_from_text(
         (续写文本, finish_reason, prompt_tokens, completion_tokens, 续写段 bpe_strings, ttft_s)。
         ttft_s 为自 ``model.generate`` 起至首次产出续写片段的秒数；仅取消时为 ``None``。
     """
-    tokenizer, model, device = ensure_semantic_slot_ready()
+    tokenizer, model, device = ensure_instruct_slot_ready()
     ctx_limit = completion_max_token_length
 
     model.eval()
@@ -518,14 +518,15 @@ def apply_chat_template_for_completion(
     user_content: str,
     system: Optional[str] = None,
     *,
-    slot: ModelSlot = ModelSlot.SEMANTIC,
+    slot: ModelSlot = ModelSlot.INSTRUCT,
+    enable_thinking: bool = False,
 ) -> str:
     """
     将单条 user 文本套用到 tokenizer chat template，返回实际送入 core_generate_from_text 的字符串。
 
     调用方未传入 ``system``（即 ``None``）时仅拼装单条 user 消息；传入字符串时（含 ``\"\"``、仅空白）
     原样作为 chat template 的 system 段，不做裁剪或改写。长度与上下文上限由 ``core_generate_from_text``
-    在生成前校验。slot 控制使用哪个槽位的 tokenizer（base 传 ModelSlot.MAIN）。
+    在生成前校验。slot 控制使用哪个槽位的 tokenizer（base 传 ModelSlot.BASE）。
     """
     tokenizer, _, _ = ensure_slot_weights_loaded(slot)
     if system is None:
@@ -539,7 +540,7 @@ def apply_chat_template_for_completion(
         messages,
         tokenize=False,
         add_generation_prompt=True,
-        enable_thinking=False,
+        enable_thinking=enable_thinking,
     )
 
 

backend/core/language_checker.py

@@ -8,7 +8,7 @@ from backend.models.class_register import register_model, REGISTERED_MODELS
 from backend.models.device import DeviceManager
 from backend.models.model_manager import ensure_model_loaded
 from backend.platform.runtime_config import load_runtime_config, DEFAULT_TOPK
-from model_paths import DEFAULT_MODEL, MODEL_PATHS, SEMANTIC_MODEL_PATHS, resolve_hf_path
+from model_paths import DEFAULT_BASE_MODEL, INSTRUCT_MODEL_PATHS, MODEL_PATHS, resolve_hf_path
 
 # 按 id(model) 缓存「仅含 BOS/等价起始符一步 forward」得到的末位词表 logits（全词表，不随分析文本变）
 _bos_first_position_logits_cache: Dict[int, torch.Tensor] = {}
@@ -109,7 +109,7 @@ class QwenLM(AbstractLanguageChecker):
     """
     def __init__(self, model_path=None, model_name=None):
         super(QwenLM, self).__init__()
-        model_name = model_name or getattr(self.__class__, '_registered_model_name', DEFAULT_MODEL)
+        model_name = model_name or getattr(self.__class__, '_registered_model_name', DEFAULT_BASE_MODEL)
         if model_path is not None and str(model_path).strip():
             resolved = str(model_path).strip()
         else:
@@ -392,13 +392,13 @@ class QwenLM(AbstractLanguageChecker):
 
 
 # ============================================================
-# 自动注册：根据 MODEL_PATHS 与 SEMANTIC_MODEL_PATHS 自动注册所有模型
+# 自动注册：根据 MODEL_PATHS 与 INSTRUCT_MODEL_PATHS 自动注册所有模型
 # ============================================================
 # 只需要在 model_paths.py 中添加模型路径，即可自动注册
 # 无需手动创建子类，实现 DRY 原则
 def _auto_register_models():
-    """自动注册 MODEL_PATHS 与 SEMANTIC_MODEL_PATHS 中的所有模型"""
-    for model_name in (*MODEL_PATHS.keys(), *SEMANTIC_MODEL_PATHS.keys()):
+    """自动注册 MODEL_PATHS 与 INSTRUCT_MODEL_PATHS 中的所有模型"""
+    for model_name in (*MODEL_PATHS.keys(), *INSTRUCT_MODEL_PATHS.keys()):
         if model_name not in REGISTERED_MODELS:
             # 动态创建模型类并注册
             # 使用闭包捕获当前 model_name

backend/core/prediction_attributor.py

@@ -2,7 +2,7 @@
 预测归因：对任意上下文的下一个 token 预测，计算指定候选 token 的 logit
 对输入各 token embedding 的梯度，以梯度 L2 范数作为归因分。
 
-由请求参数 `model` 选择权重槽位：base 为主槽位（--model），instruct 为语义槽位（--semantic_model）。
+由请求参数 `model` 选择权重槽位：base 为主槽位（--base_model），instruct 为 instruct 槽位（--instruct_model）。
 """
 
 import math
@@ -15,8 +15,8 @@ from backend.models.device import DeviceManager
 from backend.models.model_manager import (
     ModelSlot,
     ensure_slot_weights_loaded,
-    get_main_model_display_name,
-    get_semantic_model_display_name,
+    get_base_model_display_name,
+    get_instruct_model_display_name,
 )
 from .next_token_topk import decode_topk_ids_to_strings_and_rounded_probs, DEFAULT_NEXT_TOKEN_TOPK
 
@@ -41,9 +41,9 @@ PREDICTION_ATTR_MODEL_INSTRUCT = "instruct"
 
 def slot_for_prediction_attr_model(model: str) -> ModelSlot:
     if model == PREDICTION_ATTR_MODEL_BASE:
-        return ModelSlot.MAIN
+        return ModelSlot.BASE
     if model == PREDICTION_ATTR_MODEL_INSTRUCT:
-        return ModelSlot.SEMANTIC
+        return ModelSlot.INSTRUCT
     raise ValueError(
         f"Unsupported model {model!r}; only {PREDICTION_ATTR_MODEL_BASE!r} and "
         f"{PREDICTION_ATTR_MODEL_INSTRUCT!r} are supported."
@@ -80,7 +80,7 @@ def analyze_prediction_attribution(
     slot = slot_for_prediction_attr_model(model)
     tokenizer, hf_model, device = ensure_slot_weights_loaded(slot)
     model_display = (
-        get_main_model_display_name() if slot == ModelSlot.MAIN else get_semantic_model_display_name()
+        get_base_model_display_name() if slot == ModelSlot.BASE else get_instruct_model_display_name()
     )
 
     if target_prediction is not None and target_token_id is not None:

backend/core/semantic_analyzer.py

@@ -8,7 +8,7 @@ Semantic analysis：基于 instruct 模型提取原文 token 与 query 的相关
 
 count/fill_blank 按概率加权（Σ pᵢ·zᵢ）。
 
-模型由 --semantic_model 参数指定，默认 qwen3-0.6b-instruct
+模型由 --instruct_model 参数指定，默认 qwen3-0.6b-instruct
 """
 
 import gc
@@ -19,7 +19,7 @@ import torch
 
 from backend.platform.format import round_to_sig_figs
 from backend.models.device import DeviceManager
-from backend.models.model_manager import ensure_semantic_slot_ready, get_semantic_model_display_name
+from backend.models.model_manager import ensure_instruct_slot_ready, get_instruct_model_display_name
 from .next_token_topk import decode_topk_ids_to_strings_and_rounded_probs, DEFAULT_NEXT_TOKEN_TOPK
 from backend.platform.runtime_config import get_semantic_max_token_length
 
@@ -178,7 +178,7 @@ def _analyze_logits_gradient(
 
         if full_match_degree_only:
             return {
-                "model": get_semantic_model_display_name(),
+                "model": get_instruct_model_display_name(),
                 "token_attention": [],
                 "full_match_degree": full_match_degree,
             }
@@ -235,7 +235,7 @@ def _analyze_logits_gradient(
             print(f"⚠️ token_attention 中有 {nan_count} 个 score 为 NaN/Inf，已替换为 0。")
 
         out = {
-            "model": get_semantic_model_display_name(),
+            "model": get_instruct_model_display_name(),
             "token_attention": token_attention,
             "full_match_degree": full_match_degree,
         }
@@ -270,7 +270,7 @@ def analyze_semantic(
     Returns:
         {"model", "token_attention", "full_match_degree"}；debug_info=True 时包含 debug_info 对象
     """
-    tokenizer, model, device = ensure_semantic_slot_ready()
+    tokenizer, model, device = ensure_instruct_slot_ready()
     return _analyze_logits_gradient(
         query, text, tokenizer, model, device,
         submode_override=submode_override,

backend/models/model_manager.py

@@ -1,4 +1,10 @@
-"""模型管理模块：主槽位与语义槽位对称配置，权重缓存共用。"""
+"""模型管理：base / instruct 双槽位，HF 权重缓存共用。
+
+加载约定（由简到繁）：
+- ``ensure_slot_weights_loaded(slot)``：仅保证该槽位 HF 权重在 ``_hf_loaded`` 中（归因、tokenize）。
+- ``ensure_slot_ready(slot)``：槽位可推理；base 另挂 ``project_registry`` / QwenLM（信息密度）。
+- 业务入口：信息密度 ``ensure_base_slot_ready()``；语义 / 续写 ``ensure_instruct_slot_ready()``。
+"""
 from enum import Enum
 import threading
 
@@ -7,55 +13,52 @@ from backend.models.project_registry import ModelRegistry
 from backend.models.device import DeviceManager
 from backend.models.model_loader import attn_implementation_for_device, load_causal_lm, load_tokenizer
 
-from model_paths import DEFAULT_MODEL, DEFAULT_SEMANTIC_MODEL, resolve_hf_path
+from model_paths import DEFAULT_BASE_MODEL, DEFAULT_INSTRUCT_MODEL, resolve_hf_path
 
 project_registry = ModelRegistry(REGISTERED_MODELS)
 _init_lock = threading.Lock()
 
-# 统一推理锁：信息密度分析与 Semantic 分析共用，确保模型推理串行执行
+# 统一推理锁：信息密度分析与 instruct 路径共用，确保模型推理串行执行
 inference_lock = threading.Lock()
 
-# 按 HuggingFace 路径去重的已加载模型缓存（主分析 / 语义 / 续写共用）
+# 按 HuggingFace 路径去重的已加载模型缓存（两槽位共用）
 _hf_load_lock = threading.Lock()
 _hf_loaded: dict[str, tuple] = {}
 
 
 class ModelSlot(str, Enum):
-    """与 CLI --model / --semantic_model 对应的两个对等槽位。"""
+    """与 CLI --base_model / --instruct_model 对应的两个对等槽位。"""
 
-    MAIN = "main"
-    SEMANTIC = "semantic"
+    BASE = "base"
+    INSTRUCT = "instruct"
 
 
-# 启动预载与「全部权重」枚举时使用的槽位顺序（对等、无主次）
-CONFIGURED_SLOTS: tuple[ModelSlot, ...] = (ModelSlot.MAIN, ModelSlot.SEMANTIC)
+CONFIGURED_SLOTS: tuple[ModelSlot, ...] = (ModelSlot.BASE, ModelSlot.INSTRUCT)
 
 
 def _resolved_hf_path_for_slot(slot: ModelSlot) -> str:
     """由应用上下文解析槽位对应的 HuggingFace 路径（或本地路径字符串）。"""
-    if slot == ModelSlot.MAIN:
-        try:
-            from backend.platform.app_context import get_app_context
-
-            context = get_app_context(prefer_module_context=True)
-            model_name = context.model_name or DEFAULT_MODEL
-        except RuntimeError:
-            model_name = DEFAULT_MODEL
-        return resolve_hf_path(model_name)
-    if slot == ModelSlot.SEMANTIC:
-        try:
-            from backend.platform.app_context import get_args
-
-            raw = getattr(get_args(), "semantic_model", DEFAULT_SEMANTIC_MODEL)
-        except RuntimeError:
-            raw = DEFAULT_SEMANTIC_MODEL
-        return resolve_hf_path(raw)
+    from backend.platform.app_context import get_app_context
+
+    try:
+        context = get_app_context(prefer_module_context=True)
+    except RuntimeError:
+        if slot == ModelSlot.BASE:
+            return resolve_hf_path(DEFAULT_BASE_MODEL)
+        if slot == ModelSlot.INSTRUCT:
+            return resolve_hf_path(DEFAULT_INSTRUCT_MODEL)
+        raise ValueError(f"unknown ModelSlot: {slot!r}") from None
+
+    if slot == ModelSlot.BASE:
+        return resolve_hf_path(context.base_model_id or DEFAULT_BASE_MODEL)
+    if slot == ModelSlot.INSTRUCT:
+        return resolve_hf_path(context.instruct_model_id or DEFAULT_INSTRUCT_MODEL)
     raise ValueError(f"unknown ModelSlot: {slot!r}")
 
 
 def ensure_slot_weights_loaded(slot: ModelSlot):
     """
-    加载指定槽位权重（若未缓存）；主 / 语义完全相同的入口。
+    加载指定槽位权重（若未缓存）。
     返回 (tokenizer, model, device)。
     """
     return ensure_model_loaded(_resolved_hf_path_for_slot(slot))
@@ -99,24 +102,23 @@ def ensure_project_loaded(project_name: str):
     try:
         return project_registry.ensure_loaded(project_name)
     except KeyError:
-        # Re-raise to allow caller to format message uniformly.
         raise
     except Exception as exc:  # noqa: BLE001 - propagate detailed message
         raise RuntimeError(f"模型 '{project_name}' 加载失败: {exc}") from exc
 
 
-def _register_main_qwenlm_if_needed():
+def _register_base_qwenlm_if_needed():
     """
-    信息密度路径：在 MAIN 槽位权重已就绪后，注册 project_registry 中的 QwenLM 实例。
-    语义槽位无对应 registry 包装，故仅此槽位需要。
+    信息密度路径：在 base 槽位权重已就绪后，注册 project_registry 中的 QwenLM 实例。
+    instruct 槽位无对应 registry 包装。
     """
     from backend.platform.app_context import get_app_context
 
     context = get_app_context(prefer_module_context=True)
-    selected_name = context.model_name
+    selected_name = context.base_model_id
 
     if not selected_name:
-        raise ValueError("未指定模型名称")
+        raise ValueError("未指定 base 模型 id")
 
     if selected_name in project_registry:
         _ensure_default_project_ready(selected_name)
@@ -135,7 +137,7 @@ def _register_main_qwenlm_if_needed():
 def preload_all_slots():
     """
     启动预载（非 --no_auto_load）：对 CONFIGURED_SLOTS 各解析 HF 路径，去重后加载全部权重，
-    再注册主槽位 QwenLM 项目。两槽位在「先加载权重」层面完全对等。
+    再注册 base 槽位 QwenLM 项目。
     """
     from backend.platform.app_context import get_app_context
 
@@ -146,45 +148,43 @@ def preload_all_slots():
     with _init_lock:
         for path in paths:
             ensure_model_loaded(path)
-        _register_main_qwenlm_if_needed()
+        _register_base_qwenlm_if_needed()
 
 
 def ensure_slot_ready(slot: ModelSlot):
     """
-    槽位业务就绪（对称 API）：保证该槽位后续推理所需状态已备好。
+    槽位业务就绪：保证该槽位后续推理所需状态已备好。
 
     - 两槽位均先保证 HF 权重已加载，返回 (tokenizer, model, device)。
-    - MAIN 另需将 QwenLM 挂入 project_registry（信息密度管线）；SEMANTIC 无 registry 步骤。
-
-    懒加载时：信息密度调 ensure_main_slot_ready()；语义/续写调 ensure_semantic_slot_ready()。
+    - base 另需将 QwenLM 挂入 project_registry（信息密度）；instruct 无 registry 步骤。
     """
     from backend.platform.app_context import get_app_context
 
     get_app_context(prefer_module_context=True)
 
-    if slot == ModelSlot.MAIN:
+    if slot == ModelSlot.BASE:
         with _init_lock:
-            out = ensure_slot_weights_loaded(ModelSlot.MAIN)
-            _register_main_qwenlm_if_needed()
+            out = ensure_slot_weights_loaded(ModelSlot.BASE)
+            _register_base_qwenlm_if_needed()
             return out
-    if slot == ModelSlot.SEMANTIC:
-        return ensure_slot_weights_loaded(ModelSlot.SEMANTIC)
+    if slot == ModelSlot.INSTRUCT:
+        return ensure_slot_weights_loaded(ModelSlot.INSTRUCT)
     raise ValueError(f"unknown ModelSlot: {slot!r}")
 
 
-def ensure_main_slot_ready():
-    """懒加载首次信息密度：同 ensure_slot_ready(ModelSlot.MAIN)。"""
-    return ensure_slot_ready(ModelSlot.MAIN)
+def ensure_base_slot_ready():
+    """信息密度等业务：``ensure_slot_ready(ModelSlot.BASE)``。"""
+    return ensure_slot_ready(ModelSlot.BASE)
 
 
-def ensure_semantic_slot_ready():
-    """懒加载首次语义类请求：同 ensure_slot_ready(ModelSlot.SEMANTIC)。"""
-    return ensure_slot_ready(ModelSlot.SEMANTIC)
+def ensure_instruct_slot_ready():
+    """语义分析 / 续写：``ensure_slot_ready(ModelSlot.INSTRUCT)``。"""
+    return ensure_slot_ready(ModelSlot.INSTRUCT)
 
 
 def get_current_model_max_token_length() -> int:
     """
-    查询当前生效模型的 max_token_length 参数。
+    查询当前生效 base 模型的 max_token_length 参数。
     优先从已加载的模型实例获取，未加载时取 default_model.default_cpu_machine 配置。
     """
     from backend.platform.app_context import get_app_context
@@ -192,7 +192,7 @@ def get_current_model_max_token_length() -> int:
 
     try:
         context = get_app_context(prefer_module_context=True)
-        model_name = context.model_name or DEFAULT_MODEL
+        model_name = context.base_model_id or DEFAULT_BASE_MODEL
     except RuntimeError:
         model_name = "default_model"
 
@@ -212,22 +212,11 @@ def _ensure_default_project_ready(selected_name: str):
     project_registry.ensure_loaded(selected_name)
 
 
-# 旧名保留（与槽位就绪 API 等价）
-ensure_semantic_loaded = ensure_semantic_slot_ready
-ensure_main_project_ready = ensure_main_slot_ready
-
-def get_semantic_model_display_name() -> str:
-    """返回 semantic 槽位 HuggingFace 路径（用于结果中的 model 字段）"""
-    return _resolved_hf_path_for_slot(ModelSlot.SEMANTIC)
-
-
-def ensure_main_model_loaded():
-    """
-    仅需主模型前向、且不必经过 project_registry 时（如 attribution）：MAIN 槽位权重。
-    """
-    return ensure_slot_weights_loaded(ModelSlot.MAIN)
+def get_instruct_model_display_name() -> str:
+    """返回 instruct 槽位 HuggingFace 路径（用于结果中的 model 字段）。"""
+    return _resolved_hf_path_for_slot(ModelSlot.INSTRUCT)
 
 
-def get_main_model_display_name() -> str:
-    """返回主槽位 HuggingFace 路径（用于结果中的 model 字段）"""
-    return _resolved_hf_path_for_slot(ModelSlot.MAIN)
+def get_base_model_display_name() -> str:
+    """返回 base 槽位 HuggingFace 路径（用于结果中的 model 字段）。"""
+    return _resolved_hf_path_for_slot(ModelSlot.BASE)

backend/platform/access_log.py

@@ -270,6 +270,7 @@ def log_openai_completions_prompt_request(
     model: str,
     user_prompt: str,
     system: Optional[str] = None,
+    enable_thinking: bool = False,
     client_ip: str = None,
 ) -> None:
     """记录 POST /v1/completions/prompt（仅拼装 chat template，不分配 req_id）。"""
@@ -277,8 +278,11 @@ def log_openai_completions_prompt_request(
 
     up = _log_str_preview(user_prompt, preview)
     if system is None:
-        details = f"model='{model}', user_prompt='{up}'"
+        details = f"model='{model}', enable_thinking={enable_thinking}, user_prompt='{up}'"
     else:
-        details = f"model='{model}', system='{_log_str_preview(system, preview)}', user_prompt='{up}'"
+        details = (
+            f"model='{model}', enable_thinking={enable_thinking}, "
+            f"system='{_log_str_preview(system, preview)}', user_prompt='{up}'"
+        )
     log_request("📥 openai completions/prompt 请求", details, client_ip)
 

backend/platform/app_context.py

@@ -8,6 +8,8 @@ from pathlib import Path
 from typing import Optional
 from argparse import Namespace
 
+from model_paths import DEFAULT_BASE_MODEL, DEFAULT_INSTRUCT_MODEL
+
 
 class AppContext:
     """
@@ -54,21 +56,31 @@ class AppContext:
         self.args = args
         self.data_dir = data_dir
         self._model_loading = True  # 初始时处于加载状态
-        self._current_model_name = getattr(args, 'model', None)
+        self._base_model_id = getattr(args, "base_model", None) or DEFAULT_BASE_MODEL
+        self._instruct_model_id = getattr(args, "instruct_model", None) or DEFAULT_INSTRUCT_MODEL
     
     @property
-    def model_name(self) -> str:
-        """当前模型名称"""
-        return self._current_model_name
+    def base_model_id(self) -> str:
+        """当前 base 槽位 CLI 模型 id（信息密度主模型）。"""
+        return self._base_model_id
+
+    @property
+    def instruct_model_id(self) -> str:
+        """当前 instruct 槽位 CLI 模型 id（语义 / 续写）。"""
+        return self._instruct_model_id
     
     @property
     def model_loading(self) -> bool:
         """模型是否正在加载"""
         return self._model_loading
     
-    def set_current_model(self, model_name: str):
-        """设置当前模型名称"""
-        self._current_model_name = model_name
+    def set_base_model_id(self, model_id: str):
+        """设置 base 槽位 CLI 模型 id（如在线切换）。"""
+        self._base_model_id = model_id
+
+    def set_current_model(self, model_id: str):
+        """兼容旧名：同 set_base_model_id。"""
+        self.set_base_model_id(model_id)
     
     def set_model_loading(self, loading: bool):
         """设置模型加载状态"""

backend/platform/visit_stats.py

@@ -41,7 +41,8 @@ _STATS_API_ORDER = (
 _STATS_OS_ORDER = ("ios", "android", "windows", "macos", "linux", "unknown")
 _STATS_GEN_ATTR_OPT_ORDER = (
     "layout_linear_arc", "layout_step_down", "layout_spiral",
-    "propagated", "downstream", "token_tooltip",
+    "propagated", "propagated_anim_backward",
+    "downstream", "token_tooltip",
 )
 
 # RLock：_persist_tick 在已持锁时调用 _sample_locked_counters，同线程需可重入。

client/src/assets/demos/causal_flow/CoT | 苏州所在省的省会.json

@@ -29624,12 +29624,13 @@
     "maxTokens": 200,
     "system": "You are a helpful assistant.",
     "user": "苏州所在省的省会是哪个？先一步步推理再回答。",
-    "useSystem": true
+    "useSystem": true,
+    "enableThinking": false
   },
   "demoUiOptions": {
     "layoutMode": "text-flow",
     "measureWidthPx": 500,
-    "dagCompactness": 0.8,
+    "dagCompactness": 0.9,
     "linearArcAdjacentGapPx": 0,
     "hideExcludedTokens": false,
     "edgeTopPCoverage": 0.4,
@@ -29638,14 +29639,16 @@
     "hideInactiveEdges": true,
     "showDownstreamInfluence": false,
     "recursiveAttributionEnabled": true,
+    "recursiveEdgeBatchAnimationEnabled": true,
+    "recursiveEdgeBatchAnimationDirection": "forward",
     "showTokenInfoOnSelected": true,
-    "replayPacingMode": "step",
-    "playbackTotalS": 7,
+    "replayPacingMode": "total",
+    "playbackTotalS": 6,
     "playbackStepMs": 200,
     "excludePromptPatternsEnabled": true,
     "excludePromptPatternsText": "先一步步推理再回答。\n#comment# use '#comment#' to comment lines; support regex\n<\\|im_start\\|>system\\n\n<\\|im_start\\|>user\\n\n<\\|im_start\\|>assistant\\n\n<\\|im_start\\|>assistant\\n\\n\n<\\|im_end\\|>\\n\n<think>\\n\\n\n</think>\\n\\n\n<\\|im_start\\|>system\\n[\\s\\S]*?<\\|im_end\\|>#comment# all system prompt",
     "excludeGeneratedPatternsEnabled": true,
-    "excludeGeneratedPatternsText": "<think>\\n\n</think>\\n\\n",
+    "excludeGeneratedPatternsText": "[\\s\\S]*?推理[\\s\\S]*?：\\n\\n\n<think>\\n\n</think>\\n\\n",
     "selectedNodeId": "237_239"
   }
 }

client/src/assets/demos/causal_flow/order.json

@@ -0,0 +1,26 @@
+[
+  {
+    "slug": "Write a sonnet about love",
+    "label": "Poem | Write a sonnet about love"
+  },
+  {
+    "slug": "写一首绝句，主题是春天",
+    "label": "写诗 | 写一首绝句，主题是春天"
+  },
+  {
+    "slug": "CoT | 苏州所在省的省会",
+    "label": "CoT | 苏州所在省的省会"
+  },
+  {
+    "slug": "CoT | 多“跳”推理",
+    "label": "CoT | 多“跳”推理"
+  },
+  {
+    "slug": "过拟合｜李白 将进酒",
+    "label": "过拟合｜李白 将进酒"
+  },
+  {
+    "slug": "CN->EN翻译",
+    "label": "CN->EN | 翻译"
+  }
+]

client/src/assets/images/{dag-cot.png → dag-cot.mov}

@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:28f1add37e2c5f5a8b0d0151d0de1f5007d25676ea5f892f0692e36d6ddac7c6
-size 69056
+oid sha256:47a48bf00f0d2cbd8347915deba2a3f9e0e843e7a57e5b0d69e75ac8d0a984e7
+size 65679

client/src/causal_flow.html

@@ -119,6 +119,14 @@
                                 </div>
                             </div>
                         </div>
+                        <div class="semantic-submode-row chat-enable-thinking-row">
+                            <span class="semantic-submode-group">
+                                <label class="semantic-submode-label" for="gen_attr_enable_thinking">
+                                    <input type="checkbox" id="gen_attr_enable_thinking" />
+                                    <span data-i18n>Enable thinking</span>
+                                </label>
+                            </span>
+                        </div>
                     </div>
 
                     <div class="attribution-exclude-prompt-patterns-row">
@@ -187,7 +195,6 @@
                                         <div class="loadersmall"></div>
                                         <span id="gen_attr_complete_reason" class="generation-end-reason"></span>
                                     </div>
-                                    <span id="gen_attr_analyze_progress" class="analyze-progress"></span>
                                 </div>
                             </div>
                             <div id="gen_attr_text_metrics" class="text-metrics text-metrics-chat">
@@ -200,7 +207,7 @@
 
                     <div class="gen-attr-reset-ui-options-row">
                         <button type="button" id="gen_attr_reset_ui_options_btn" class="text-action-btn"
-                            title="Restore DAG options, replay speed, exclusions, etc. to defaults and clear saved preferences for those controls."
+                            title="Restore DAG options, play speed, exclusions, etc. to defaults and clear saved preferences for those controls."
                             data-i18n="text,title">
                             Reset UI options
                         </button>
@@ -290,8 +297,8 @@
                             <select id="gen_attr_dag_recursive_edge_animation_direction" class="semantic-submode-select"
                                 title="Choose one direction for propagated-edge batch animation."
                                 data-i18n="title">
-                                <option value="backward">backward</option>
                                 <option value="forward">forward</option>
+                                <option value="backward">backward</option>
                             </select>
                         </span>
                         <span class="semantic-submode-group" id="gen_attr_dag_show_downstream_influence_group">
@@ -379,10 +386,10 @@
                     </div>
                     <div class="gen-attr-dag-measure-width-row semantic-submode-row">
                         <span class="semantic-submode-group gen-attr-dag-replay-speed-row semantic-submode-group--emphasis">
-                            <label class="semantic-submode-label" for="gen_attr_dag_replay_mode" data-i18n>DAG replay speed</label>
+                            <label class="semantic-submode-label" for="gen_attr_dag_replay_mode" data-i18n>Play speed</label>
                             <select id="gen_attr_dag_replay_mode"
                                 class="semantic-submode-select gen-attr-dag-replay-mode-select"
-                                title="Total duration vs. fixed delay per step. Waits shrink if a step is slow; long idle realigns the beat."
+                                title="Total duration or per-step delay. DAG Play uses equal steps or a fixed step interval; focus-chain animation scales each step by attribution weight."
                                 data-i18n="title">
                                 <option value="total" data-i18n>total time</option>
                                 <option value="step" data-i18n>step time</option>
@@ -390,14 +397,14 @@
                             <span id="gen_attr_dag_replay_total_wrap" class="gen-attr-dag-replay-value-wrap">
                                 <input type="number" id="gen_attr_dag_playback_total_s" class="gen-attr-dag-measure-width-input"
                                     value="7" min="1" max="3600" step="1"
-                                    title="Nominal delay = total seconds ÷ (steps − 1). Saved locally; applied when you press play."
+                                    title="Total seconds. DAG Play divides evenly across steps; focus-chain animation splits by layer weight. Saved locally; applied when you press Play or select a focus node."
                                     data-i18n="title">
                                 <span class="semantic-submode-label">s</span>
                             </span>
                             <span id="gen_attr_dag_replay_step_wrap" class="gen-attr-dag-replay-value-wrap" hidden>
                                 <input type="number" id="gen_attr_dag_playback_step_ms" class="gen-attr-dag-measure-width-input"
                                     value="200" min="0" max="10000" step="10"
-                                    title="Nominal ms between steps. Saved locally; applied when you press play (not mid-run)."
+                                    title="Milliseconds per step. DAG Play uses this fixed interval; focus-chain animation multiplies by layer weight. Saved locally; applied when you press Play or select a focus node."
                                     data-i18n="title">
                                 <span class="semantic-submode-label">ms</span>
                             </span>

client/src/chat.html

@@ -39,7 +39,7 @@
                 <section class="input-section">
                     <div class="semantic-submode-row chat-raw-prompt-mode-row">
                         <span class="semantic-submode-group">
-                            <label for="chat_skip_chat_template">
+                            <label class="semantic-submode-label" for="chat_skip_chat_template">
                                 <input type="checkbox" id="chat_skip_chat_template" />
                                 <span data-i18n>Raw prompt mode</span>
                             </label>
@@ -47,7 +47,7 @@
                     </div>
                     <div id="raw_input_panel" class="chat-prompt-panel">
                         <div class="input-header">
-                            <span><span class="demo" data-i18n>Raw prompt</span></span>
+                            <span class="semantic-submode-label" data-i18n>Raw prompt</span>
                             <div class="text-action-buttons-top">
                                 <div class="textarea-counter" id="text_count_display">
                                     <span id="text_count_value">0</span> <span data-i18n>chars</span>
@@ -67,9 +67,9 @@
                     <div id="chat_input_panel" hidden>
                         <div class="chat-prompt-panel" id="chat_system_prompt_panel">
                             <div class="input-header">
-                                <label class="chat-use-system-label">
+                                <label class="chat-use-system-label semantic-submode-label" for="chat_use_system_prompt">
                                     <input type="checkbox" id="chat_use_system_prompt" checked />
-                                    <span class="demo" data-i18n>System</span>
+                                    <span data-i18n>System</span>
                                 </label>
                                 <div class="text-action-buttons-top">
                                     <div class="textarea-counter" id="chat_system_text_count_display">
@@ -89,7 +89,7 @@
                         </div>
                         <div class="chat-prompt-panel">
                             <div class="input-header">
-                                <span><span class="demo" data-i18n>User</span></span>
+                                <span class="semantic-submode-label" data-i18n>User</span>
                                 <div class="text-action-buttons-top">
                                     <div class="textarea-counter" id="chat_user_text_count_display">
                                         <span id="chat_user_text_count_value">0</span> <span data-i18n>chars</span>
@@ -106,6 +106,14 @@
                                 </div>
                             </div>
                         </div>
+                        <div class="semantic-submode-row chat-enable-thinking-row">
+                            <span class="semantic-submode-group">
+                                <label class="semantic-submode-label" for="chat_enable_thinking">
+                                    <input type="checkbox" id="chat_enable_thinking" />
+                                    <span data-i18n>Enable thinking</span>
+                                </label>
+                            </span>
+                        </div>
                     </div>
                     <div class="textarea-wrapper chat-prompt-actions-row">
                         <div class="semantic-submode-row chat-completion-options-row">

client/src/css/base/_narrow-ios-form-font-tail.scss

@@ -0,0 +1,14 @@
+// 子页 bundle 末尾：@use '../base/narrow-ios-form-font-tail' as ios-form-font; @include ios-form-font.apply;
+// 设计说明见 responsive.narrow-ios-form-font
+@use 'breakpoints' as *;
+@use 'responsive';
+
+@mixin apply {
+  @media (max-width: $breakpoint-mobile) {
+    @include responsive.narrow-ios-form-font('html');
+  }
+
+  @media (min-width: $breakpoint-tablet) {
+    @include responsive.narrow-ios-form-font('html[data-force-narrow]:has(.main_frame)');
+  }
+}

client/src/css/base/_responsive.scss

@@ -24,6 +24,38 @@
   box-sizing: border-box;
 }
 
+// --- 窄屏表单字号（防 iOS 聚焦自动放大）---
+//
+// 背景：iOS Safari 在可编辑控件 computed font-size < 16px 时，聚焦常会整页 zoom。
+//
+// 约定：
+// - 窄屏（≤$breakpoint-mobile）与「强制窄屏」下，input/textarea/select 统一 16px（不用 viewport 禁缩放）。
+// - 桌面端仍可用 9pt 等紧凑字号；弹窗表单见 dialog.scss（全宽 16px，与窄屏无关）。
+// - 页面 SCSS 勿对表单写 font-size < 16px；布局类名、padding 不受限。小字号请用于 label/说明，勿用于可编辑控件。
+//
+// 实现注意：
+// - 本 mixin 须在子页 SCSS 最后生效：各 pages/*.scss 末尾 @include narrow-ios-form-font-tail.apply
+//   （若只写在 narrow-app-layout 里，会被同文件后加载的 .foo-input { font-size: 9pt } 盖住）。
+// - 选择器含 textarea[class] 等，用于压过带 class 的页面规则；不要改回仅 .textarea-wrapper textarea。
+// - 新增子页（@use app-pages）时，记得在文件末尾加上述 tail include。
+//
+@mixin narrow-ios-form-font($root) {
+  #{$root} textarea,
+  #{$root} textarea[class],
+  #{$root} select,
+  #{$root} select[class],
+  #{$root} input[type="text"],
+  #{$root} input[type="url"],
+  #{$root} input[type="search"],
+  #{$root} input[type="email"],
+  #{$root} input[type="number"],
+  #{$root} input[type="tel"],
+  #{$root} input[type="password"],
+  #{$root} input[class] {
+    font-size: 16px;
+  }
+}
+
 // 窄屏布局（视口 ≤767px 与设置「强制窄屏」共用）
 @mixin narrow-app-layout($root) {
   #{$root} {
@@ -164,18 +196,6 @@
 
   #{$root} .textarea-wrapper textarea {
     min-height: 80px;
-    font-size: 16px;  // 设置为至少 16px，防止 iOS 自动缩放
-  }
-
-  #{$root} input[type="text"],
-  #{$root} input[type="url"],
-  #{$root} input[type="search"],
-  #{$root} input[type="email"],
-  #{$root} input[type="number"],
-  #{$root} input[type="tel"],
-  #{$root} input[type="password"],
-  #{$root} select {
-    font-size: 16px;  // 所有文本类输入控件在移动端统一使用 16px
   }
 }
 

client/src/css/components/_chat-input-panel.scss

@@ -6,6 +6,45 @@
   margin-bottom: 0;
 }
 
+// Prompt 区选项标签：panel 标题、勾选行同系（9pt + 勾选主次色）
+.input-section {
+  span.semantic-submode-label {
+    color: var(--text-muted);
+  }
+
+  .semantic-submode-row:not(.attribution-exclude-prompt-patterns-header):not(.attribution-exclude-generated-patterns-header) {
+    label.semantic-submode-label {
+      color: var(--text-primary);
+    }
+
+    label.semantic-submode-label:has(> input[type='checkbox']:not(:checked)) {
+      color: var(--text-muted);
+    }
+  }
+
+  .chat-prompt-panel > .input-header > .semantic-submode-label {
+    font-size: 9pt;
+  }
+
+  // System 在 input-header 内（非 semantic-submode-row）
+  .chat-prompt-panel > .input-header label.chat-use-system-label.semantic-submode-label {
+    font-size: 9pt;
+
+    input[type='checkbox'] {
+      margin: 0;
+      flex-shrink: 0;
+    }
+
+    &:has(> input[type='checkbox']:not(:checked)) {
+      color: var(--text-muted);
+    }
+
+    &:has(> input[type='checkbox']:checked) {
+      color: var(--text-primary);
+    }
+  }
+}
+
 .input-section .textarea-wrapper.chat-prompt-actions-row .chat-completion-options-row {
   margin-bottom: 8px;
   width: 100%;

client/src/css/components/_semantic-analysis.scss

@@ -1,7 +1,6 @@
 // 语义分析相关样式（section、查询输入、历史下拉、loader）
 
 @use "loaders";
-@use "breakpoints" as *;
 @use "query-history-dropdown" as qh;
 @use "lmf-readout" as lmf;
 
@@ -263,10 +262,3 @@
     color: var(--text-muted, #999);
   }
 }
-
-// 窄屏：与 _responsive 中 input[type=text] 的 16px 一致；上方三层嵌套选择器优先级高于 input[type=text]，故在此用同权重规则 + 源顺序覆盖
-@media (max-width: $breakpoint-mobile) {
-  .semantic-analysis-section .semantic-analysis-controls .semantic-search-input {
-    font-size: 16px;
-  }
-}

client/src/css/components/dialog.scss

@@ -149,6 +149,22 @@
 // 对话框表单元素样式
 .dialog-form-container {
   margin-bottom: 15px;
+
+  // 长内容弹窗：占满 .dialog-content，正文在 .dialog-scroll-region 内滚动
+  &--fill {
+    display: flex;
+    flex-direction: column;
+    flex: 1;
+    min-height: 0;
+    margin-bottom: 0;
+  }
+}
+
+.dialog-scroll-region {
+  flex: 1;
+  min-height: 0;
+  overflow-y: auto;
+  -webkit-overflow-scrolling: touch;
 }
 
 .dialog-label {
@@ -171,6 +187,7 @@
   }
 }
 
+// 弹窗表单任意屏宽 16px（iOS 防放大）；子页左栏窄屏见 responsive.narrow-ios-form-font
 .dialog-input {
   width: 100%;
   padding: 8px;

client/src/css/pages/analysis.scss

@@ -1,5 +1,6 @@
 // Analysis 页专有样式（intro / 统计图 / 分析进度）
 @use 'app-pages';
+@use '../base/narrow-ios-form-font-tail' as ios-form-font;
 
 // 介绍区域样式
 .intro-section {
@@ -191,3 +192,6 @@
     box-sizing: border-box;  // 确保宽度计算正确
   }
 }
+
+// 保持在本文件末尾；说明见 responsive.narrow-ios-form-font
+@include ios-form-font.apply;

client/src/css/pages/attribution.scss

@@ -3,6 +3,7 @@
 @use "attribution-inspector";
 @use "chat-input-panel";
 @use "breakpoints" as *;
+@use '../base/narrow-ios-form-font-tail' as ios-form-font;
 
 // 桌面端：覆盖全局 min-height:100%，使 #results 按内容收缩（debug 面板紧跟其后）
 @media (min-width: $breakpoint-tablet) {
@@ -116,7 +117,6 @@
 .attribution-exclude-prompt-patterns-input {
   width: 100%;
   box-sizing: border-box;
-  font-size: 9pt;
   padding: 6px 8px;
   border: 1px solid var(--input-border);
   border-radius: 4px;
@@ -128,3 +128,6 @@
     cursor: not-allowed;
   }
 }
+
+// 保持在本文件末尾；说明见 responsive.narrow-ios-form-font
+@include ios-form-font.apply;

client/src/css/pages/causal_flow.scss

@@ -4,6 +4,7 @@
 @use "chat-input-panel";
 @use "generation-status";
 @use "lmf-readout" as lmf;
+@use '../base/narrow-ios-form-font-tail' as ios-form-font;
 
 $gen-attr-option-row-gap: 12px;
 $gen-attr-cached-demos-panel-width: 18em;
@@ -345,7 +346,7 @@ $gen-attr-cached-demos-panel-width: 18em;
   #results.gen-attr-results-surface.LMF.css-pseudo-fullscreen-target {
     width: 100vw;
     height: 100vh;
-    padding: 20px;
+    padding: 6px;
     background: var(--text-area-bg);
     color: var(--text-color);
     overflow: auto;
@@ -421,50 +422,8 @@ $gen-attr-cached-demos-panel-width: 18em;
   max-height: 250px;
 }
 
-body.gen-attribute-page .input-section {
-  span.semantic-submode-label {
-    color: var(--text-muted);
-  }
-
-  .semantic-submode-row:not(.attribution-exclude-prompt-patterns-header):not(.attribution-exclude-generated-patterns-header) {
-    label.semantic-submode-label {
-      color: var(--text-primary);
-    }
-
-    label.semantic-submode-label:has(> input[type='checkbox']:not(:checked)) {
-      color: var(--text-muted);
-    }
-  }
-
-  // Start 上方的 prompt 区标题与同系字号（非 .semantic-submode-row 后代时补齐 9pt）
-  > .semantic-submode-row.chat-raw-prompt-mode-row label.semantic-submode-label {
-    display: inline-flex;
-    align-items: center;
-    gap: 6px;
-    cursor: pointer;
-    user-select: none;
-  }
-
-  .chat-prompt-panel > .input-header > .semantic-submode-label {
-    font-size: 9pt;
-  }
-
-  // System：在 input-header 内（非 semantic-submode-row），勾选主次色与勾选行一致
-  #gen_attr_system_prompt_panel.chat-prompt-panel > .input-header label.chat-use-system-label.semantic-submode-label {
-    font-size: 9pt;
-
-    &:has(> input[type='checkbox']:not(:checked)) {
-      color: var(--text-muted);
-    }
-
-    &:has(> input[type='checkbox']:checked) {
-      color: var(--text-primary);
-    }
-  }
-
-  .textarea-wrapper.chat-prompt-actions-row > .chat-completion-options-row.semantic-submode-row {
-    gap: $gen-attr-option-row-gap;
-  }
+body.gen-attribute-page .input-section .textarea-wrapper.chat-prompt-actions-row > .chat-completion-options-row.semantic-submode-row {
+  gap: $gen-attr-option-row-gap;
 }
 
 // 与 Attribution 页 Exclude prompt patterns 同形；generated 仅本页有 UI（持久化键见 attributionExclude*PatternsStorage）
@@ -583,7 +542,6 @@ body.gen-attribute-page .input-section {
 .attribution-exclude-prompt-patterns-input {
   width: 100%;
   box-sizing: border-box;
-  font-size: 9pt;
   padding: 6px 8px;
   border: 1px solid var(--input-border);
   border-radius: 4px;
@@ -600,3 +558,6 @@ body.gen-attribute-page .input-section {
 body.css-pseudo-fullscreen-body-lock {
   overflow: hidden;
 }
+
+// 保持在本文件末尾；说明见 responsive.narrow-ios-form-font
+@include ios-form-font.apply;

client/src/css/pages/chat.scss

@@ -1,5 +1,6 @@
 // Chat 页：共用左栏见 _chat-input-panel.scss；此处仅右栏续写栈与 Chat 专有控件
 @use 'app-pages';
+@use '../base/narrow-ios-form-font-tail' as ios-form-font;
 
 @use 'chat-input-panel';
 @use 'breakpoints' as *;
@@ -102,3 +103,6 @@
     padding-right: calc(12px + var(--minimap-width));
   }
 }
+
+// 保持在本文件末尾；说明见 responsive.narrow-ios-form-font
+@include ios-form-font.apply;

client/src/css/pages/compare.scss

@@ -1,6 +1,7 @@
 // 对比页面样式 - app-pages 提供 chrome / demo / tooltip 等共用样式
 @use 'app-pages';
 @use "lmf-readout" as lmf;
+@use '../base/narrow-ios-form-font-tail' as ios-form-font;
 
 // 主框架样式
 .main_frame {
@@ -401,3 +402,6 @@
   }
 }
 
+// 保持在本文件末尾；说明见 responsive.narrow-ios-form-font
+@include ios-form-font.apply;
+

client/src/features/analysis/infoDensityRenderManager.ts

@@ -1,11 +1,12 @@
-/** 信息密度底色渲染开关：为 true 时关闭信息密度/classic 底色（语义叠加层不受影响） */
-const KEY = 'info_radar_disable_info_density_render';
+import { lsReadBool, lsWriteBool } from '../../shared/storage/localStorageHelpers';
+
+/** 信息密度底色渲染开关 key：为 true 时关闭信息密度/classic 底色（语义叠加层不受影响） */
+export const INFO_DENSITY_RENDER_DISABLED_KEY = 'info_radar_disable_info_density_render';
 
 export function getInfoDensityRenderDisabled(): boolean {
-    const v = localStorage.getItem(KEY);
-    return v === 'true';
+    return lsReadBool(INFO_DENSITY_RENDER_DISABLED_KEY, false);
 }
 
 export function setInfoDensityRenderDisabled(disabled: boolean): void {
-    localStorage.setItem(KEY, disabled ? 'true' : 'false');
+    lsWriteBool(INFO_DENSITY_RENDER_DISABLED_KEY, disabled);
 }

client/src/features/causal_flow/bundledDemos.ts

@@ -7,7 +7,7 @@ import {
     parseGenAttrCachedRunPayload,
     type GenAttrCachedRun,
 } from '../../shared/storage/genAttributeRunCache';
-import { GEN_ATTRIBUTE_BUNDLED_DEMO_SLUGS } from './genAttributeBundledDemoManifest.generated';
+import { GEN_ATTRIBUTE_BUNDLED_DEMOS } from './genAttributeBundledDemoManifest.generated';
 
 const BASE = 'assets/demos/causal_flow/';
 
@@ -28,7 +28,7 @@ export type BundledDemoListEntry = { id: string; label: string };
 
 /** 构建期固定的 bundled demo 列表（与当前 JS 同版本）。 */
 export function getBundledGenAttributeDemoList(): readonly BundledDemoListEntry[] {
-    return GEN_ATTRIBUTE_BUNDLED_DEMO_SLUGS.map((slug) => ({ id: slug, label: slug }));
+    return GEN_ATTRIBUTE_BUNDLED_DEMOS.map(({ slug, label }) => ({ id: slug, label }));
 }
 
 /**

client/src/features/causal_flow/genAttributeBundledDemoManifest.generated.ts

@@ -1,4 +1,5 @@
 /**
  * Generated by GenAttributeDemoManifestPlugin — do not edit.
  */
-export const GEN_ATTRIBUTE_BUNDLED_DEMO_SLUGS: readonly string[] = ["CN->EN翻译","CoT | 苏州所在省的省会","Write a sonnet about love","写一首绝句，主题是春天","过拟合｜李白 将进酒"];
+export type GenAttributeBundledDemoManifestEntry = { readonly slug: string; readonly label: string };
+export const GEN_ATTRIBUTE_BUNDLED_DEMOS: readonly GenAttributeBundledDemoManifestEntry[] = [{"slug":"Write a sonnet about love","label":"Poem | Write a sonnet about love"},{"slug":"写一首绝句，主题是春天","label":"写诗 | 写一首绝句，主题是春天"},{"slug":"CoT | 苏州所在省的省会","label":"CoT | 苏州所在省的省会"},{"slug":"CoT | 多“跳”推理","label":"CoT | 多“跳”推理"},{"slug":"过拟合｜李白 将进酒","label":"过拟合｜李白 将进酒"},{"slug":"CN->EN翻译","label":"CN->EN | 翻译"}];

client/src/features/chat/chatPromptTemplateMode.ts

@@ -1,21 +1,6 @@
-/**
- * 与 Chat 页共用的「Raw prompt mode」开关（localStorage）。
- * 在 Generate & Attribute 与 Chat 之间切换时保持一致。
- */
+/** Chat / Generate & Attribute 共用的「Raw prompt mode」开关 storage key */
 export const LS_SKIP_CHAT_TEMPLATE = 'chat_skip_chat_template';
 
-export function readSkipChatTemplateFromStorage(): boolean {
-    try {
-        return localStorage.getItem(LS_SKIP_CHAT_TEMPLATE) === 'true';
-    } catch {
-        return false;
-    }
-}
-
-export function writeSkipChatTemplateToStorage(value: boolean): void {
-    try {
-        localStorage.setItem(LS_SKIP_CHAT_TEMPLATE, value ? 'true' : 'false');
-    } catch {
-        /* ignore quota / private mode */
-    }
-}
+/** Enable thinking 开关（Chat / Causal Flow 各页独立 key，仅在 Chat template 模式下生效） */
+export const CHAT_ENABLE_THINKING_STORAGE_KEY = 'info_radar_chat_enable_thinking';
+export const GEN_ATTR_ENABLE_THINKING_STORAGE_KEY = 'info_radar_gen_attr_enable_thinking';

client/src/pages/analysis/index.ts

@@ -52,6 +52,7 @@ import { saveHistory, initQueryHistoryDropdown } from '../../shared/cross/queryH
 import { removeByQuery as removeSemanticCacheByQuery } from '../../shared/cross/semanticResultCache';
 import { playAnalysisCompleteSound } from '../../shared/cross/soundNotification';
 import { getSemanticMatchThreshold, setSemanticMatchThreshold } from '../../shared/cross/semanticThresholdManager';
+import { lsGet, lsSet, lsWriteBool } from '../../shared/storage/localStorageHelpers';
 import { SEMANTIC_MATCH_THRESHOLD } from '../../shared/core/constants';
 import { SemanticSearchController } from '../../shared/controllers/semanticSearchController';
 import { initDensityAttributionSidebar } from '../../shared/prediction_attribution/density_sidebar/densityAttributionSidebar';
@@ -137,7 +138,7 @@ window.onload = () => {
     loadHomeContent('home-intro-content');
 
     // minimap启用状态（优先使用localStorage，否则根据设备类型判断：移动端默认为false，桌面端默认为true）
-    const storedMinimap = localStorage.getItem('minimap_enabled');
+    const storedMinimap = lsGet('minimap_enabled');
     let enableMinimap: boolean = storedMinimap !== null
         ? storedMinimap === '1'
         : !isMobileDevice();
@@ -257,9 +258,9 @@ window.onload = () => {
         const validSubmodes = ['count', 'fill_blank', 'hybrid'];
         const validColorSources = ['raw_score_normed', 'signal_probability', 'pw_score'];
         const query = URLHandler.parameters['semantic_query'] ?? '';
-        const submode = localStorage.getItem(SEMANTIC_KEYS.submode) ?? 'hybrid';
-        const chunked = localStorage.getItem(SEMANTIC_KEYS.chunked) !== '0';
-        const colorSource = localStorage.getItem(SEMANTIC_KEYS.colorSource) ?? 'pw_score';
+        const submode = lsGet(SEMANTIC_KEYS.submode) ?? 'hybrid';
+        const chunked = lsGet(SEMANTIC_KEYS.chunked) !== '0';
+        const colorSource = lsGet(SEMANTIC_KEYS.colorSource) ?? 'pw_score';
         const queryEl = document.getElementById('semantic_search_input') as HTMLInputElement | null;
         if (queryEl) queryEl.value = typeof query === 'string' ? query : '';
         const submodeEl = document.getElementById('semantic_submode_select') as HTMLSelectElement | null;
@@ -276,9 +277,9 @@ window.onload = () => {
         const chunkedEl = document.getElementById('semantic_chunked_mode') as HTMLInputElement | null;
         const colorEl = document.getElementById('semantic_color_source_select') as HTMLSelectElement | null;
         const thresholdEl = document.getElementById('semantic_threshold_input') as HTMLInputElement | null;
-        localStorage.setItem(SEMANTIC_KEYS.submode, submodeEl?.value ?? 'hybrid');
-        if (chunkedEl) localStorage.setItem(SEMANTIC_KEYS.chunked, chunkedEl.checked ? '1' : '0');
-        if (colorEl) localStorage.setItem(SEMANTIC_KEYS.colorSource, colorEl.value);
+        lsSet(SEMANTIC_KEYS.submode, submodeEl?.value ?? 'hybrid');
+        if (chunkedEl) lsWriteBool(SEMANTIC_KEYS.chunked, chunkedEl.checked, '1');
+        if (colorEl) lsSet(SEMANTIC_KEYS.colorSource, colorEl.value);
         if (thresholdEl) {
             const v = parseFloat(thresholdEl.value);
             if (Number.isFinite(v)) {
@@ -315,7 +316,7 @@ window.onload = () => {
                 lmf.updateOptions({
                     enableMinimap: enableMinimap
                 }, false);
-                localStorage.setItem('minimap_enabled', enableMinimap ? '1' : '0');
+                lsWriteBool('minimap_enabled', enableMinimap, '1');
             },
             onSemanticAnalysisToggle: (_enabled: boolean) => {
                 // 打开/关闭时都清除 query，并将 submode/chunked/color/阈值 重置为默认值并写回 localStorage
@@ -709,7 +710,7 @@ window.onload = () => {
             return;
         }
 
-        const lastPath = localStorage.getItem(LAST_SAVE_PATH_KEY);
+        const lastPath = lsGet(LAST_SAVE_PATH_KEY);
         const { options: folderOptions, defaultPath } = buildFolderOptions(folders, lastPath);
         const defaultName = getDefaultDemoName(null, prefillText);
 

client/src/pages/attribution/index.ts

@@ -40,6 +40,7 @@ import { loadPredictionAttributeWithCache } from '../../shared/prediction_attrib
 import { readStoredEffectiveExcludePromptPatternsText } from '../../shared/prediction_attribution/core/attributionExcludePromptPatternsStorage';
 import { bindExcludePromptPatternsUi } from '../../shared/prediction_attribution/core/excludePromptPatternsUi';
 import { syncDraftCommittedButtonPair } from '../../shared/cross/syncDraftCommittedButtonPair';
+import { lsReadEnum, lsWriteString } from '../../shared/storage/localStorageHelpers';
 
 d3.selectAll('.loadersmall').style('display', 'none');
 
@@ -52,13 +53,7 @@ const TARGET_HISTORY_KEY = 'info_radar_attribution_target_history';
 const ATTRIBUTION_MODEL_VARIANT_STORAGE_KEY = 'info_radar_attribution_model_variant';
 
 function readStoredAttributionPageModelVariant(): PredictionAttributeModelVariant {
-    try {
-        const v = localStorage.getItem(ATTRIBUTION_MODEL_VARIANT_STORAGE_KEY);
-        if (v === 'base' || v === 'instruct') return v;
-    } catch {
-        // ignore
-    }
-    return 'instruct';
+    return lsReadEnum(ATTRIBUTION_MODEL_VARIANT_STORAGE_KEY, ['base', 'instruct'] as const, 'instruct');
 }
 
 const apiPrefix = URLHandler.parameters['api'] || '';
@@ -101,11 +96,7 @@ function currentAttributionModelVariant(): PredictionAttributeModelVariant {
 }
 
 modelVariantSelect?.addEventListener('change', () => {
-    try {
-        localStorage.setItem(ATTRIBUTION_MODEL_VARIANT_STORAGE_KEY, currentAttributionModelVariant());
-    } catch {
-        // ignore
-    }
+    lsWriteString(ATTRIBUTION_MODEL_VARIANT_STORAGE_KEY, currentAttributionModelVariant());
 });
 
 // --- TextInputController ---

client/src/pages/causal_flow/index.ts

@@ -33,6 +33,7 @@ import {
     DAG_COMPACTNESS_DEFAULT,
     LINEAR_ARC_ADJACENT_GAP_DEFAULT,
 } from '../../shared/prediction_attribution/causal_flow/genAttributeDagView';
+import type { DagRecursiveEdgeReplayPacing } from '../../shared/prediction_attribution/causal_flow/genAttributeDagRecursiveEdgeAnimation';
 import {
     createHydratedTokenGenHandle,
     startTokenGenAttribution,
@@ -85,11 +86,21 @@ import {
     saveHistory,
 } from '../../shared/cross/queryHistory';
 import {
-    readSkipChatTemplateFromStorage,
-    writeSkipChatTemplateToStorage,
+    GEN_ATTR_ENABLE_THINKING_STORAGE_KEY,
+    LS_SKIP_CHAT_TEMPLATE,
 } from '../../features/chat/chatPromptTemplateMode';
 import { postCompletionsPrompt, postCompletionsStop } from '../../shared/api/completionsClient';
 import { updateApiUsageDisplay, updateModel, validateMetricsElements } from '../../shared/cross/textMetricsUpdater';
+import {
+    lsGet,
+    lsReadBool,
+    lsReadEnum,
+    lsReadNumber,
+    lsRemove,
+    lsSet,
+    lsWriteBool,
+    lsWriteString,
+} from '../../shared/storage/localStorageHelpers';
 
 d3.selectAll('.loadersmall').style('display', 'none');
 
@@ -162,7 +173,7 @@ const DEFAULT_GEN_ATTR_DEMO_UI_OPTIONS: GenAttrDemoUiOptions = {
     showDownstreamInfluence: false,
     recursiveAttributionEnabled: false,
     recursiveEdgeBatchAnimationEnabled: true,
-    recursiveEdgeBatchAnimationDirection: 'backward',
+    recursiveEdgeBatchAnimationDirection: 'forward',
     showTokenInfoOnSelected: false,
     replayPacingMode: 'total',
     playbackTotalS: GEN_ATTR_DAG_PLAYBACK_TOTAL_S_DEFAULT,
@@ -183,24 +194,13 @@ function createFlowId(): string {
 }
 
 function readStoredModelVariant(): PredictionAttributeModelVariant {
-    try {
-        const v = localStorage.getItem(GEN_ATTR_MODEL_VARIANT_STORAGE_KEY);
-        if (v === 'base' || v === 'instruct') return v;
-    } catch {
-        // ignore
-    }
-    return 'instruct';
+    return lsReadEnum(GEN_ATTR_MODEL_VARIANT_STORAGE_KEY, ['base', 'instruct'] as const, 'instruct');
 }
 
 function readStoredMaxTokens(): number {
-    try {
-        const v = localStorage.getItem(GEN_ATTR_MAX_TOKENS_STORAGE_KEY);
-        const n = v !== null ? parseInt(v, 10) : NaN;
-        if (Number.isFinite(n) && n >= 1 && n <= 500) return n;
-    } catch {
-        // ignore
-    }
-    return GEN_ATTR_MAX_TOKENS_DEFAULT;
+    return lsReadNumber(GEN_ATTR_MAX_TOKENS_STORAGE_KEY, GEN_ATTR_MAX_TOKENS_DEFAULT, {
+        validate: (n) => n >= 1 && n <= 500,
+    });
 }
 
 function clampDagMeasureWidth(n: number): number {
@@ -211,47 +211,32 @@ function clampDagMeasureWidth(n: number): number {
 }
 
 function readStoredDagMeasureWidth(): number {
-    try {
-        const v = localStorage.getItem(GEN_ATTR_DAG_MEASURE_WIDTH_STORAGE_KEY);
-        const n = v !== null ? parseInt(v, 10) : NaN;
-        if (Number.isFinite(n)) return clampDagMeasureWidth(n);
-    } catch {
-        // ignore
-    }
-    return GEN_ATTR_DAG_MEASURE_WIDTH_DEFAULT;
+    return lsReadNumber(GEN_ATTR_DAG_MEASURE_WIDTH_STORAGE_KEY, GEN_ATTR_DAG_MEASURE_WIDTH_DEFAULT, {
+        clamp: clampDagMeasureWidth,
+    });
 }
 
 function readStoredDagCompactness(): number {
-    try {
-        const v = localStorage.getItem(GEN_ATTR_DAG_COMPACTNESS_STORAGE_KEY);
-        const n = v !== null ? parseFloat(v) : NaN;
-        if (Number.isFinite(n)) return clampDagCompactness(n);
-    } catch {
-        // ignore
-    }
-    return DAG_COMPACTNESS_DEFAULT;
+    return lsReadNumber(GEN_ATTR_DAG_COMPACTNESS_STORAGE_KEY, DAG_COMPACTNESS_DEFAULT, {
+        parse: 'float',
+        clamp: clampDagCompactness,
+    });
 }
 
 function readStoredDagEdgeTopPCoverage(): number {
-    try {
-        const v = localStorage.getItem(GEN_ATTR_DAG_EDGE_TOP_P_COVERAGE_STORAGE_KEY);
-        const n = v !== null ? parseFloat(v) : NaN;
-        if (Number.isFinite(n)) return clampDagEdgeTopPCoverage(n);
-    } catch {
-        // ignore
-    }
-    return DAG_EDGE_TOP_P_COVERAGE_DEFAULT;
+    return lsReadNumber(
+        GEN_ATTR_DAG_EDGE_TOP_P_COVERAGE_STORAGE_KEY,
+        DAG_EDGE_TOP_P_COVERAGE_DEFAULT,
+        { parse: 'float', clamp: clampDagEdgeTopPCoverage },
+    );
 }
 
 function readStoredDagLinearArcAdjacentGap(): number {
-    try {
-        const v = localStorage.getItem(GEN_ATTR_DAG_LINEAR_ARC_GAP_STORAGE_KEY);
-        const n = v !== null ? parseInt(v, 10) : NaN;
-        if (Number.isFinite(n)) return clampLinearArcAdjacentGap(n);
-    } catch {
-        // ignore
-    }
-    return LINEAR_ARC_ADJACENT_GAP_DEFAULT;
+    return lsReadNumber(
+        GEN_ATTR_DAG_LINEAR_ARC_GAP_STORAGE_KEY,
+        LINEAR_ARC_ADJACENT_GAP_DEFAULT,
+        { clamp: clampLinearArcAdjacentGap },
+    );
 }
 
 function clampDagPlaybackStepMs(n: number): number {
@@ -262,14 +247,11 @@ function clampDagPlaybackStepMs(n: number): number {
 }
 
 function readStoredDagPlaybackStepMs(): number {
-    try {
-        const v = localStorage.getItem(GEN_ATTR_DAG_PLAYBACK_STEP_MS_STORAGE_KEY);
-        const n = v !== null ? parseInt(v, 10) : NaN;
-        if (Number.isFinite(n)) return clampDagPlaybackStepMs(n);
-    } catch {
-        // ignore
-    }
-    return GEN_ATTR_DAG_PLAYBACK_STEP_MS_DEFAULT;
+    return lsReadNumber(
+        GEN_ATTR_DAG_PLAYBACK_STEP_MS_STORAGE_KEY,
+        GEN_ATTR_DAG_PLAYBACK_STEP_MS_DEFAULT,
+        { clamp: clampDagPlaybackStepMs },
+    );
 }
 
 function clampDagPlaybackTotalS(n: number): number {
@@ -280,41 +262,27 @@ function clampDagPlaybackTotalS(n: number): number {
 }
 
 function readStoredDagPlaybackTotalS(): number {
-    try {
-        const v = localStorage.getItem(GEN_ATTR_DAG_PLAYBACK_TOTAL_S_STORAGE_KEY);
-        const n = v !== null ? parseInt(v, 10) : NaN;
-        if (Number.isFinite(n)) return clampDagPlaybackTotalS(n);
-    } catch {
-        // ignore
-    }
-    return GEN_ATTR_DAG_PLAYBACK_TOTAL_S_DEFAULT;
+    return lsReadNumber(
+        GEN_ATTR_DAG_PLAYBACK_TOTAL_S_STORAGE_KEY,
+        GEN_ATTR_DAG_PLAYBACK_TOTAL_S_DEFAULT,
+        { clamp: clampDagPlaybackTotalS },
+    );
 }
 
 function readStoredDagReplayPacingMode(): DagReplayPacingMode {
-    try {
-        const v = localStorage.getItem(GEN_ATTR_DAG_REPLAY_PACING_MODE_STORAGE_KEY);
-        if (v === 'total' || v === 'step') return v;
-    } catch {
-        // ignore
-    }
-    return DEFAULT_GEN_ATTR_DEMO_UI_OPTIONS.replayPacingMode;
+    return lsReadEnum(
+        GEN_ATTR_DAG_REPLAY_PACING_MODE_STORAGE_KEY,
+        ['total', 'step'] as const,
+        DEFAULT_GEN_ATTR_DEMO_UI_OPTIONS.replayPacingMode,
+    );
 }
 
 function readStoredDagLayoutMode(): DagLayoutMode {
-    try {
-        const v = localStorage.getItem(GEN_ATTR_DAG_LAYOUT_MODE_STORAGE_KEY);
-        if (
-            v === 'text-flow' ||
-            v === 'linear-arc' ||
-            v === 'linear-arc-step-down' ||
-            v === 'spiral'
-        ) {
-            return v;
-        }
-    } catch {
-        // ignore
-    }
-    return DEFAULT_GEN_ATTR_DEMO_UI_OPTIONS.layoutMode;
+    return lsReadEnum(
+        GEN_ATTR_DAG_LAYOUT_MODE_STORAGE_KEY,
+        ['text-flow', 'linear-arc', 'linear-arc-step-down', 'spiral'] as const,
+        DEFAULT_GEN_ATTR_DEMO_UI_OPTIONS.layoutMode,
+    );
 }
 
 const apiPrefix = URLHandler.parameters['api'] || '';
@@ -366,10 +334,12 @@ const genAttrTeacherForcingBlock = document.getElementById('gen_attr_teacher_for
 const genAttrStopAfterTeacherForcing = document.getElementById(
     'gen_attr_stop_after_teacher_forcing'
 ) as HTMLInputElement | null;
+const genAttrEnableThinkingInput = document.getElementById(
+    'gen_attr_enable_thinking'
+) as HTMLInputElement | null;
 
 const submitBtn = d3.select('#gen_attr_submit_btn');
 const loaderSmall = d3.select('.loadersmall');
-const analyzeProgressEl = d3.select('#gen_attr_analyze_progress');
 const metricUsage = d3.select('#gen_attr_metric_usage');
 const metricModel = d3.select('#gen_attr_metric_model');
 const genAttrResultsEl = d3.select('#results.gen-attr-results-surface');
@@ -410,6 +380,23 @@ function currentDagReplayPacingMode(): DagReplayPacingMode {
     return dagReplayModeSelect?.value === 'step' ? 'step' : 'total';
 }
 
+/** DAG replay speed 控件 → 规范化节奏；生成回放、传播链动画、demo 导出共用。 */
+function readDagReplayPacingFromControls(options?: { writeBack?: boolean }): DagRecursiveEdgeReplayPacing {
+    const rawStep = parseInt(dagPlaybackStepMsInput?.value ?? '', 10);
+    const stepMs = Number.isFinite(rawStep)
+        ? clampDagPlaybackStepMs(rawStep)
+        : readStoredDagPlaybackStepMs();
+    const rawS = parseInt(dagPlaybackTotalSInput?.value ?? '', 10);
+    const totalS = Number.isFinite(rawS)
+        ? clampDagPlaybackTotalS(rawS)
+        : readStoredDagPlaybackTotalS();
+    if (options?.writeBack) {
+        if (dagPlaybackStepMsInput) dagPlaybackStepMsInput.value = String(stepMs);
+        if (dagPlaybackTotalSInput) dagPlaybackTotalSInput.value = String(totalS);
+    }
+    return { mode: currentDagReplayPacingMode(), stepMs, totalS };
+}
+
 /** 切换下拉时更新 `hidden`；样式见 `.gen-attr-dag-replay-value-wrap:not([hidden])`。 */
 function applyDagReplaySpeedUi(): void {
     const mode = currentDagReplayPacingMode();
@@ -504,28 +491,30 @@ function syncGenAttrExcludePatternTextareasDisabled(): void {
 }
 
 function hydrateGenAttrExcludePatternsFromGenAttrStorage(): void {
-    try {
-        const savedPrompt = localStorage.getItem(GEN_ATTR_EXCLUDE_PROMPT_PATTERNS_STORAGE_KEY);
-        if (genAttrExcludePromptPatternsTa) {
-            genAttrExcludePromptPatternsTa.value =
-                savedPrompt !== null ? savedPrompt : DEFAULT_EXCLUDE_PROMPT_PATTERNS_TEXT;
-        }
-        const promptEnRaw = localStorage.getItem(GEN_ATTR_EXCLUDE_PROMPT_PATTERNS_ENABLED_STORAGE_KEY);
-        if (genAttrExcludePromptPatternsEnable) {
-            genAttrExcludePromptPatternsEnable.checked = promptEnRaw === null ? true : promptEnRaw === '1';
-        }
+    const savedPrompt = lsGet(GEN_ATTR_EXCLUDE_PROMPT_PATTERNS_STORAGE_KEY);
+    if (genAttrExcludePromptPatternsTa) {
+        genAttrExcludePromptPatternsTa.value =
+            savedPrompt !== null ? savedPrompt : DEFAULT_EXCLUDE_PROMPT_PATTERNS_TEXT;
+    }
+    if (genAttrExcludePromptPatternsEnable) {
+        genAttrExcludePromptPatternsEnable.checked = lsReadBool(
+            GEN_ATTR_EXCLUDE_PROMPT_PATTERNS_ENABLED_STORAGE_KEY,
+            true,
+            { encoding: '1' },
+        );
+    }
 
-        const savedGen = localStorage.getItem(GEN_ATTR_EXCLUDE_GENERATED_PATTERNS_STORAGE_KEY);
-        if (genAttrExcludeGeneratedPatternsTa) {
-            genAttrExcludeGeneratedPatternsTa.value =
-                savedGen !== null ? savedGen : DEFAULT_EXCLUDE_GENERATED_PATTERNS_TEXT;
-        }
-        const genEnRaw = localStorage.getItem(GEN_ATTR_EXCLUDE_GENERATED_PATTERNS_ENABLED_STORAGE_KEY);
-        if (genAttrExcludeGeneratedPatternsEnable) {
-            genAttrExcludeGeneratedPatternsEnable.checked = genEnRaw === null ? true : genEnRaw === '1';
-        }
-    } catch {
-        /* ignore */
+    const savedGen = lsGet(GEN_ATTR_EXCLUDE_GENERATED_PATTERNS_STORAGE_KEY);
+    if (genAttrExcludeGeneratedPatternsTa) {
+        genAttrExcludeGeneratedPatternsTa.value =
+            savedGen !== null ? savedGen : DEFAULT_EXCLUDE_GENERATED_PATTERNS_TEXT;
+    }
+    if (genAttrExcludeGeneratedPatternsEnable) {
+        genAttrExcludeGeneratedPatternsEnable.checked = lsReadBool(
+            GEN_ATTR_EXCLUDE_GENERATED_PATTERNS_ENABLED_STORAGE_KEY,
+            true,
+            { encoding: '1' },
+        );
     }
     syncGenAttrExcludePatternTextareasDisabled();
 }
@@ -543,7 +532,6 @@ function genAttrEffectiveExcludeGeneratedPatternsText(): string {
     return genAttrExcludeGeneratedPatternsTa?.value ?? '';
 }
 
-if (modelVariantSelect) modelVariantSelect.value = readStoredModelVariant();
 if (maxTokensInput) maxTokensInput.value = String(readStoredMaxTokens());
 const initialDagLayoutMode = readStoredDagLayoutMode();
 if (dagLayoutModeSelect) dagLayoutModeSelect.value = initialDagLayoutMode;
@@ -568,37 +556,27 @@ applyDagReplaySpeedUi();
 
 const genAttrResultsNode = genAttrResultsEl.node() as HTMLElement | null;
 function readStoredDagNodeCiVisualScale(): boolean {
-    try {
-        const v = localStorage.getItem(GEN_ATTR_DAG_NODE_CI_VISUAL_SCALE_STORAGE_KEY);
-        if (v !== null) return v === '1';
-    } catch {
-        // ignore
-    }
-    return DEFAULT_GEN_ATTR_DEMO_UI_OPTIONS.nodeCiVisualScaleEnabled;
+    return lsReadBool(
+        GEN_ATTR_DAG_NODE_CI_VISUAL_SCALE_STORAGE_KEY,
+        DEFAULT_GEN_ATTR_DEMO_UI_OPTIONS.nodeCiVisualScaleEnabled,
+        { encoding: '1' },
+    );
 }
 const initialDagNodeCiVisualScale = readStoredDagNodeCiVisualScale();
 if (dagNodeCiVisualScaleInput) dagNodeCiVisualScaleInput.checked = initialDagNodeCiVisualScale;
 setDagNodeCiVisualScaleEnabled(initialDagNodeCiVisualScale);
 dagNodeCiVisualScaleInput?.addEventListener('change', () => {
     const enabled = dagNodeCiVisualScaleInput.checked;
-    try {
-        localStorage.setItem(GEN_ATTR_DAG_NODE_CI_VISUAL_SCALE_STORAGE_KEY, enabled ? '1' : '0');
-    } catch {
-        /* ignore */
-    }
+    lsWriteBool(GEN_ATTR_DAG_NODE_CI_VISUAL_SCALE_STORAGE_KEY, enabled, '1');
     setDagNodeCiVisualScaleEnabled(enabled);
     tryResetAndReplayDag();
 });
 
 function readStoredDagDecayAttributionToHighSurprisalTarget(): boolean {
-    try {
-        const v = localStorage.getItem(GEN_ATTR_DAG_DECAY_ATTRIBUTION_HIGH_SURPRISAL_STORAGE_KEY);
-        if (v !== null) return v === '1';
-        const legacy = localStorage.getItem(GEN_ATTR_DAG_EDGE_WEAKEN_HIGH_SURPRISAL_STORAGE_KEY_LEGACY);
-        if (legacy !== null) return legacy === '1';
-    } catch {
-        // ignore
-    }
+    const v = lsGet(GEN_ATTR_DAG_DECAY_ATTRIBUTION_HIGH_SURPRISAL_STORAGE_KEY);
+    if (v !== null) return v === '1';
+    const legacy = lsGet(GEN_ATTR_DAG_EDGE_WEAKEN_HIGH_SURPRISAL_STORAGE_KEY_LEGACY);
+    if (legacy !== null) return legacy === '1';
     return DEFAULT_GEN_ATTR_DEMO_UI_OPTIONS.decayAttributionToHighSurprisalTargetEnabled;
 }
 const initialDagDecayAttributionHighSurprisal = readStoredDagDecayAttributionToHighSurprisalTarget();
@@ -608,13 +586,9 @@ if (dagDecayAttributionHighSurprisalInput) {
 setDagDecayAttributionToHighSurprisalTargetEnabled(initialDagDecayAttributionHighSurprisal);
 dagDecayAttributionHighSurprisalInput?.addEventListener('change', () => {
     const enabled = dagDecayAttributionHighSurprisalInput.checked;
-    try {
-        localStorage.setItem(GEN_ATTR_DAG_DECAY_ATTRIBUTION_HIGH_SURPRISAL_STORAGE_KEY, enabled ? '1' : '0');
-    } catch {
-        /* ignore */
-    }
+    lsWriteBool(GEN_ATTR_DAG_DECAY_ATTRIBUTION_HIGH_SURPRISAL_STORAGE_KEY, enabled, '1');
     setDagDecayAttributionToHighSurprisalTargetEnabled(enabled);
-    tryResetAndReplayDag();
+    tryResetAndReplayDag({ refit: false });
 });
 
 function applyDagHideInactiveEdges(hide: boolean): void {
@@ -622,35 +596,27 @@ function applyDagHideInactiveEdges(hide: boolean): void {
     genAttrResultsNode.classList.toggle('gen-attr-dag-hide-inactive-edges', hide);
 }
 function readStoredDagHideInactiveEdges(): boolean {
-    try {
-        const v = localStorage.getItem(GEN_ATTR_DAG_HIDE_INACTIVE_EDGES_STORAGE_KEY);
-        if (v !== null) return v === '1';
-    } catch {
-        // ignore
-    }
-    return DEFAULT_GEN_ATTR_DEMO_UI_OPTIONS.hideInactiveEdges;
+    return lsReadBool(
+        GEN_ATTR_DAG_HIDE_INACTIVE_EDGES_STORAGE_KEY,
+        DEFAULT_GEN_ATTR_DEMO_UI_OPTIONS.hideInactiveEdges,
+        { encoding: '1' },
+    );
 }
 const initialDagHideInactiveEdges = readStoredDagHideInactiveEdges();
 if (dagHideInactiveEdgesInput) dagHideInactiveEdgesInput.checked = initialDagHideInactiveEdges;
 applyDagHideInactiveEdges(initialDagHideInactiveEdges);
 dagHideInactiveEdgesInput?.addEventListener('change', () => {
     const hide = dagHideInactiveEdgesInput.checked;
-    try {
-        localStorage.setItem(GEN_ATTR_DAG_HIDE_INACTIVE_EDGES_STORAGE_KEY, hide ? '1' : '0');
-    } catch {
-        /* ignore */
-    }
+    lsWriteBool(GEN_ATTR_DAG_HIDE_INACTIVE_EDGES_STORAGE_KEY, hide, '1');
     applyDagHideInactiveEdges(hide);
 });
 
 function readStoredDagShowDownstreamInfluence(): boolean {
-    try {
-        const v = localStorage.getItem(GEN_ATTR_DAG_SHOW_DOWNSTREAM_INFLUENCE_STORAGE_KEY);
-        if (v !== null) return v === '1';
-    } catch {
-        // ignore
-    }
-    return DEFAULT_GEN_ATTR_DEMO_UI_OPTIONS.showDownstreamInfluence;
+    return lsReadBool(
+        GEN_ATTR_DAG_SHOW_DOWNSTREAM_INFLUENCE_STORAGE_KEY,
+        DEFAULT_GEN_ATTR_DEMO_UI_OPTIONS.showDownstreamInfluence,
+        { encoding: '1' },
+    );
 }
 const initialDagShowDownstreamInfluence = readStoredDagShowDownstreamInfluence();
 if (dagShowDownstreamInfluenceInput) {
@@ -658,11 +624,7 @@ if (dagShowDownstreamInfluenceInput) {
 }
 dagShowDownstreamInfluenceInput?.addEventListener('change', () => {
     const show = dagShowDownstreamInfluenceInput.checked;
-    try {
-        localStorage.setItem(GEN_ATTR_DAG_SHOW_DOWNSTREAM_INFLUENCE_STORAGE_KEY, show ? '1' : '0');
-    } catch {
-        /* ignore */
-    }
+    lsWriteBool(GEN_ATTR_DAG_SHOW_DOWNSTREAM_INFLUENCE_STORAGE_KEY, show, '1');
     dagHandle.setShowDownstreamInfluence(show);
 });
 
@@ -682,35 +644,29 @@ function applyDagRecursiveAttributionSubmodeUi(): void {
 }
 
 function readStoredDagRecursiveAttribution(): boolean {
-    try {
-        const v = localStorage.getItem(GEN_ATTR_DAG_RECURSIVE_ATTRIBUTION_STORAGE_KEY);
-        if (v !== null) return v === '1';
-    } catch {
-        // ignore
-    }
-    return DEFAULT_GEN_ATTR_DEMO_UI_OPTIONS.recursiveAttributionEnabled;
+    return lsReadBool(
+        GEN_ATTR_DAG_RECURSIVE_ATTRIBUTION_STORAGE_KEY,
+        DEFAULT_GEN_ATTR_DEMO_UI_OPTIONS.recursiveAttributionEnabled,
+        { encoding: '1' },
+    );
 }
 const initialDagRecursiveAttribution = readStoredDagRecursiveAttribution();
 if (dagRecursiveAttributionInput) dagRecursiveAttributionInput.checked = initialDagRecursiveAttribution;
 
 function readStoredDagRecursiveEdgeAnimationEnabled(): boolean {
-    try {
-        const v = localStorage.getItem(GEN_ATTR_DAG_RECURSIVE_EDGE_ANIMATION_STORAGE_KEY);
-        if (v !== null) return v === '1';
-    } catch {
-        // ignore
-    }
-    return DEFAULT_GEN_ATTR_DEMO_UI_OPTIONS.recursiveEdgeBatchAnimationEnabled;
+    return lsReadBool(
+        GEN_ATTR_DAG_RECURSIVE_EDGE_ANIMATION_STORAGE_KEY,
+        DEFAULT_GEN_ATTR_DEMO_UI_OPTIONS.recursiveEdgeBatchAnimationEnabled,
+        { encoding: '1' },
+    );
 }
 
 function readStoredDagRecursiveEdgeAnimationDirection(): DagRecursiveEdgeAnimationDirection {
-    try {
-        const v = localStorage.getItem(GEN_ATTR_DAG_RECURSIVE_EDGE_ANIMATION_DIRECTION_STORAGE_KEY);
-        if (v === 'backward' || v === 'forward') return v;
-    } catch {
-        // ignore
-    }
-    return DEFAULT_GEN_ATTR_DEMO_UI_OPTIONS.recursiveEdgeBatchAnimationDirection;
+    return lsReadEnum(
+        GEN_ATTR_DAG_RECURSIVE_EDGE_ANIMATION_DIRECTION_STORAGE_KEY,
+        ['backward', 'forward'] as const,
+        DEFAULT_GEN_ATTR_DEMO_UI_OPTIONS.recursiveEdgeBatchAnimationDirection,
+    );
 }
 
 const initialDagRecursiveEdgeAnimationEnabled = readStoredDagRecursiveEdgeAnimationEnabled();
@@ -723,74 +679,50 @@ if (dagRecursiveEdgeAnimationDirectionSelect) {
 applyDagRecursiveAttributionSubmodeUi();
 dagRecursiveAttributionInput?.addEventListener('change', () => {
     const enabled = dagRecursiveAttributionInput.checked;
-    try {
-        localStorage.setItem(GEN_ATTR_DAG_RECURSIVE_ATTRIBUTION_STORAGE_KEY, enabled ? '1' : '0');
-    } catch {
-        /* ignore */
-    }
+    lsWriteBool(GEN_ATTR_DAG_RECURSIVE_ATTRIBUTION_STORAGE_KEY, enabled, '1');
     applyDagRecursiveAttributionSubmodeUi();
     dagHandle.setRecursiveAttributionEnabled(enabled);
 });
 dagRecursiveEdgeAnimationInput?.addEventListener('change', () => {
     const enabled = dagRecursiveEdgeAnimationInput.checked;
-    try {
-        localStorage.setItem(GEN_ATTR_DAG_RECURSIVE_EDGE_ANIMATION_STORAGE_KEY, enabled ? '1' : '0');
-    } catch {
-        /* ignore */
-    }
+    lsWriteBool(GEN_ATTR_DAG_RECURSIVE_EDGE_ANIMATION_STORAGE_KEY, enabled, '1');
     applyDagRecursiveAttributionSubmodeUi();
     dagHandle.setRecursiveEdgeBatchAnimationEnabled(enabled);
 });
 dagRecursiveEdgeAnimationDirectionSelect?.addEventListener('change', () => {
     const direction = currentDagRecursiveEdgeAnimationDirection();
     dagRecursiveEdgeAnimationDirectionSelect.value = direction;
-    try {
-        localStorage.setItem(GEN_ATTR_DAG_RECURSIVE_EDGE_ANIMATION_DIRECTION_STORAGE_KEY, direction);
-    } catch {
-        /* ignore */
-    }
+    lsWriteString(GEN_ATTR_DAG_RECURSIVE_EDGE_ANIMATION_DIRECTION_STORAGE_KEY, direction);
     dagHandle.setRecursiveEdgeBatchAnimationDirection(direction);
 });
 
 function readStoredDagHideExcludedTokens(): boolean {
-    try {
-        const v = localStorage.getItem(GEN_ATTR_DAG_HIDE_EXCLUDED_TOKENS_STORAGE_KEY);
-        if (v !== null) return v === '1';
-    } catch {
-        // ignore
-    }
-    return DEFAULT_GEN_ATTR_DEMO_UI_OPTIONS.hideExcludedTokens;
+    return lsReadBool(
+        GEN_ATTR_DAG_HIDE_EXCLUDED_TOKENS_STORAGE_KEY,
+        DEFAULT_GEN_ATTR_DEMO_UI_OPTIONS.hideExcludedTokens,
+        { encoding: '1' },
+    );
 }
 const initialDagHideExcludedTokens = readStoredDagHideExcludedTokens();
 if (dagHideExcludedTokensInput) dagHideExcludedTokensInput.checked = initialDagHideExcludedTokens;
 function readStoredDagShowTopkOnSelected(): boolean {
-    try {
-        const v = localStorage.getItem(GEN_ATTR_DAG_SHOW_TOPK_ON_SELECTED_STORAGE_KEY);
-        if (v !== null) return v === '1';
-    } catch {
-        // ignore
-    }
-    return DEFAULT_GEN_ATTR_DEMO_UI_OPTIONS.showTokenInfoOnSelected;
+    return lsReadBool(
+        GEN_ATTR_DAG_SHOW_TOPK_ON_SELECTED_STORAGE_KEY,
+        DEFAULT_GEN_ATTR_DEMO_UI_OPTIONS.showTokenInfoOnSelected,
+        { encoding: '1' },
+    );
 }
 const initialDagShowTopkOnSelected = readStoredDagShowTopkOnSelected();
 if (dagShowTopkOnSelectedInput) dagShowTopkOnSelectedInput.checked = initialDagShowTopkOnSelected;
 dagHideExcludedTokensInput?.addEventListener('change', () => {
     const hide = dagHideExcludedTokensInput.checked;
-    try {
-        localStorage.setItem(GEN_ATTR_DAG_HIDE_EXCLUDED_TOKENS_STORAGE_KEY, hide ? '1' : '0');
-    } catch {
-        /* ignore */
-    }
+    lsWriteBool(GEN_ATTR_DAG_HIDE_EXCLUDED_TOKENS_STORAGE_KEY, hide, '1');
     dagHandle.setHideExcludedTokens(hide);
 });
 
 dagShowTopkOnSelectedInput?.addEventListener('change', () => {
     const show = dagShowTopkOnSelectedInput.checked;
-    try {
-        localStorage.setItem(GEN_ATTR_DAG_SHOW_TOPK_ON_SELECTED_STORAGE_KEY, show ? '1' : '0');
-    } catch {
-        /* ignore */
-    }
+    lsWriteBool(GEN_ATTR_DAG_SHOW_TOPK_ON_SELECTED_STORAGE_KEY, show, '1');
     dagHandle.setShowTokenInfoOnSelected(show);
 });
 
@@ -802,31 +734,24 @@ setPageOptsGetter(() => {
         layout_spiral: mode === 'spiral',
         propagated: dagRecursiveAttributionInput?.checked ?? false,
         propagated_anim: dagRecursiveEdgeAnimationInput?.checked ?? true,
-        propagated_anim_forward: currentDagRecursiveEdgeAnimationDirection() === 'forward',
+        propagated_anim_backward: currentDagRecursiveEdgeAnimationDirection() === 'backward',
         downstream: dagShowDownstreamInfluenceInput?.checked ?? false,
         token_tooltip: dagShowTopkOnSelectedInput?.checked ?? false,
     };
 });
 
 modelVariantSelect?.addEventListener('change', () => {
-    try {
-        localStorage.setItem(GEN_ATTR_MODEL_VARIANT_STORAGE_KEY, currentModelVariant());
-    } catch {
-        /* ignore */
-    }
+    if (!isSkipChatTemplate()) return;
+    lsWriteString(GEN_ATTR_MODEL_VARIANT_STORAGE_KEY, currentModelVariant());
     syncIdleModelMetric();
     syncSubmitButtonState();
 });
 
 maxTokensInput?.addEventListener('change', () => {
-    try {
-        localStorage.setItem(
-            GEN_ATTR_MAX_TOKENS_STORAGE_KEY,
-            maxTokensInput?.value ?? String(GEN_ATTR_MAX_TOKENS_DEFAULT)
-        );
-    } catch {
-        /* ignore */
-    }
+    lsSet(
+        GEN_ATTR_MAX_TOKENS_STORAGE_KEY,
+        maxTokensInput?.value ?? String(GEN_ATTR_MAX_TOKENS_DEFAULT),
+    );
     syncSubmitButtonState();
 });
 
@@ -837,20 +762,12 @@ dagPlaybackStepMsInput?.addEventListener('change', () => {
         ? clampDagPlaybackStepMs(raw)
         : GEN_ATTR_DAG_PLAYBACK_STEP_MS_DEFAULT;
     dagPlaybackStepMsInput.value = String(ms);
-    try {
-        localStorage.setItem(GEN_ATTR_DAG_PLAYBACK_STEP_MS_STORAGE_KEY, String(ms));
-    } catch {
-        /* ignore */
-    }
+    lsSet(GEN_ATTR_DAG_PLAYBACK_STEP_MS_STORAGE_KEY, String(ms));
 });
 
 dagReplayModeSelect?.addEventListener('change', () => {
     const mode = currentDagReplayPacingMode();
-    try {
-        localStorage.setItem(GEN_ATTR_DAG_REPLAY_PACING_MODE_STORAGE_KEY, mode);
-    } catch {
-        /* ignore */
-    }
+    lsWriteString(GEN_ATTR_DAG_REPLAY_PACING_MODE_STORAGE_KEY, mode);
     applyDagReplaySpeedUi();
 });
 
@@ -860,11 +777,7 @@ dagPlaybackTotalSInput?.addEventListener('change', () => {
         ? clampDagPlaybackTotalS(raw)
         : GEN_ATTR_DAG_PLAYBACK_TOTAL_S_DEFAULT;
     dagPlaybackTotalSInput.value = String(s);
-    try {
-        localStorage.setItem(GEN_ATTR_DAG_PLAYBACK_TOTAL_S_STORAGE_KEY, String(s));
-    } catch {
-        /* ignore */
-    }
+    lsSet(GEN_ATTR_DAG_PLAYBACK_TOTAL_S_STORAGE_KEY, String(s));
 });
 
 function isSkipChatTemplate(): boolean {
@@ -875,6 +788,10 @@ function isGenAttrUseSystemPrompt(): boolean {
     return genAttrUseSystemPromptInput?.checked ?? true;
 }
 
+function isEnableThinking(): boolean {
+    return genAttrEnableThinkingInput?.checked ?? false;
+}
+
 function syncGenAttrSystemPromptSuppressedUi(): void {
     const on = isGenAttrUseSystemPrompt();
     genAttrSystemPromptPanel?.classList.toggle('chat-system-prompt-suppressed', !on);
@@ -896,6 +813,20 @@ function syncPromptPanelVisibility(): void {
     if (chatInputPanel) chatInputPanel.hidden = skip;
 }
 
+/** Chat template 下 model 恒为 instruct 且下拉仅展示；Raw 下读写 localStorage 偏好。 */
+function syncModelVariantUi(): void {
+    if (!modelVariantSelect) return;
+    const skip = isSkipChatTemplate();
+    if (skip) {
+        modelVariantSelect.disabled = false;
+        modelVariantSelect.value = readStoredModelVariant();
+    } else {
+        modelVariantSelect.disabled = true;
+        modelVariantSelect.value = 'instruct';
+    }
+    syncIdleModelMetric();
+}
+
 function getActivePromptValue(): string {
     if (isSkipChatTemplate()) {
         return (rawTextField.node() as HTMLTextAreaElement | null)?.value ?? '';
@@ -947,6 +878,7 @@ function buildGenAttrRunDraftForCache(): GenAttrRunDraft {
               system: systemPromptTextarea?.value ?? '',
               user: userPromptTextarea?.value ?? '',
               useSystem: isGenAttrUseSystemPrompt(),
+              enableThinking: isEnableThinking(),
               ...tfDraftFields,
           };
 }
@@ -1093,25 +1025,13 @@ function scheduleDagLastTokenDwell(action: () => void, dwellMs: number = DAG_LAS
  *   `fullStepCount` 即生成 token 步数；prompt 帧 → step0 占一段，step0 → step1 占一段，依此类推。
  */
 function resolveDagPlaybackStepDelayMsOnPlay(fullStepCount: number): number {
-    if (currentDagReplayPacingMode() === 'step') {
-        const raw = parseInt(dagPlaybackStepMsInput?.value ?? '', 10);
-        const ms = Number.isFinite(raw)
-            ? clampDagPlaybackStepMs(raw)
-            : readStoredDagPlaybackStepMs();
-        if (dagPlaybackStepMsInput) dagPlaybackStepMsInput.value = String(ms);
-        return ms;
-    }
-
-    const rawS = parseInt(dagPlaybackTotalSInput?.value ?? '', 10);
-    const totalS = Number.isFinite(rawS)
-        ? clampDagPlaybackTotalS(rawS)
-        : readStoredDagPlaybackTotalS();
-    if (dagPlaybackTotalSInput) dagPlaybackTotalSInput.value = String(totalS);
+    const pacing = readDagReplayPacingFromControls({ writeBack: true });
+    if (pacing.mode === 'step') return pacing.stepMs;
 
     // prompt 帧作为等权第一段，共 fullStepCount 段（比原来的 fullStepCount-1 多一段）
     const transitionCount = Math.max(0, fullStepCount);
     if (transitionCount <= 0) return 0;
-    return Math.round((totalS * 1000) / transitionCount);
+    return Math.round((pacing.totalS * 1000) / transitionCount);
 }
 
 function stopDagPlayback(): void {
@@ -1232,6 +1152,7 @@ const dagHandle = initGenAttributeDagView(d3.select('#results'), {
     recursiveAttributionEnabled: initialDagRecursiveAttribution,
     recursiveEdgeBatchAnimationEnabled: initialDagRecursiveEdgeAnimationEnabled,
     recursiveEdgeBatchAnimationDirection: initialDagRecursiveEdgeAnimationDirection,
+    getReplayPacing: readDagReplayPacingFromControls,
     edgeTopPCoverage: initialDagEdgeTopPCoverage,
     onFullscreenError: (message) => showToast(message, 'error'),
     getEffectiveExcludePromptPatternsText: genAttrEffectiveExcludePromptPatternsText,
@@ -1240,11 +1161,7 @@ const dagHandle = initGenAttributeDagView(d3.select('#results'), {
 
 dagLayoutModeSelect?.addEventListener('change', () => {
     const mode = currentDagLayoutMode();
-    try {
-        localStorage.setItem(GEN_ATTR_DAG_LAYOUT_MODE_STORAGE_KEY, mode);
-    } catch {
-        /* ignore */
-    }
+    lsWriteString(GEN_ATTR_DAG_LAYOUT_MODE_STORAGE_KEY, mode);
     applyDagLayoutModeUi();
     dagHandle.setLayoutMode(mode);
 });
@@ -1259,19 +1176,23 @@ function isDagBusy(): boolean {
 }
 
 /**
- * 非忙状态下 reset + replay + fit，供各设置项切换后复用。忙时为 no-op。
+ * 非忙状态下 reset + replay，按需 fit，供各设置项切换后复用。忙时为 no-op。
  * 默认保留 DAG 选中节点；整页重置 UI 等场景传 `preserveNodeSelection: false`。
+ * `refit: false` 时 `reset(true)` 保留 pan/zoom（仅边集/样式类变更）。
  */
-function tryResetAndReplayDag(opts?: { preserveNodeSelection?: boolean }): void {
+function tryResetAndReplayDag(opts?: { preserveNodeSelection?: boolean; refit?: boolean }): void {
     if (isDagBusy()) return;
+    const refit = opts?.refit !== false;
     const preserveSelection = opts?.preserveNodeSelection !== false;
     const preservedSelectedId = preserveSelection ? dagHandle.getSelectedNodeId() : null;
     const h = runnerHandle;
-    dagHandle.reset();
+    dagHandle.reset(!refit);
     if (h && h.tokenCount > 0) {
         replayRunnerStepsIntoDag(h, currentRunPromptSpans.length > 0 ? currentRunPromptSpans : undefined);
     }
-    dagHandle.fitViewportToContent();
+    if (refit) {
+        dagHandle.fitViewportToContent();
+    }
     if (preservedSelectedId != null) {
         dagHandle.setSelectedNodeId(preservedSelectedId);
     } else {
@@ -1285,11 +1206,7 @@ dagMeasureWidthInput?.addEventListener('change', () => {
         ? clampDagMeasureWidth(raw)
         : GEN_ATTR_DAG_MEASURE_WIDTH_DEFAULT;
     dagMeasureWidthInput.value = String(w);
-    try {
-        localStorage.setItem(GEN_ATTR_DAG_MEASURE_WIDTH_STORAGE_KEY, String(w));
-    } catch {
-        /* ignore */
-    }
+    lsSet(GEN_ATTR_DAG_MEASURE_WIDTH_STORAGE_KEY, String(w));
     dagHandle.setMeasureWidthPx(w);
     tryResetAndReplayDag();
 });
@@ -1298,11 +1215,7 @@ dagCompactnessInput?.addEventListener('change', () => {
     const raw = parseFloat(dagCompactnessInput.value);
     const c = Number.isFinite(raw) ? clampDagCompactness(raw) : DAG_COMPACTNESS_DEFAULT;
     dagCompactnessInput.value = String(c);
-    try {
-        localStorage.setItem(GEN_ATTR_DAG_COMPACTNESS_STORAGE_KEY, String(c));
-    } catch {
-        /* ignore */
-    }
+    lsSet(GEN_ATTR_DAG_COMPACTNESS_STORAGE_KEY, String(c));
     dagHandle.setDagCompactness(c);
     tryResetAndReplayDag();
 });
@@ -1313,13 +1226,9 @@ dagEdgeTopPCoverageInput?.addEventListener('change', () => {
         ? clampDagEdgeTopPCoverage(raw)
         : DAG_EDGE_TOP_P_COVERAGE_DEFAULT;
     dagEdgeTopPCoverageInput.value = String(c);
-    try {
-        localStorage.setItem(GEN_ATTR_DAG_EDGE_TOP_P_COVERAGE_STORAGE_KEY, String(c));
-    } catch {
-        /* ignore */
-    }
+    lsSet(GEN_ATTR_DAG_EDGE_TOP_P_COVERAGE_STORAGE_KEY, String(c));
     dagHandle.setEdgeTopPCoverage(c);
-    tryResetAndReplayDag();
+    tryResetAndReplayDag({ refit: false });
 });
 
 dagLinearArcIntervalInput?.addEventListener('change', () => {
@@ -1328,11 +1237,7 @@ dagLinearArcIntervalInput?.addEventListener('change', () => {
         ? clampLinearArcAdjacentGap(raw)
         : LINEAR_ARC_ADJACENT_GAP_DEFAULT;
     dagLinearArcIntervalInput.value = String(n);
-    try {
-        localStorage.setItem(GEN_ATTR_DAG_LINEAR_ARC_GAP_STORAGE_KEY, String(n));
-    } catch {
-        /* ignore */
-    }
+    lsSet(GEN_ATTR_DAG_LINEAR_ARC_GAP_STORAGE_KEY, String(n));
     dagHandle.setLinearArcAdjacentGapPx(n, { skipRefit: isDagBusy() });
 });
 
@@ -1354,14 +1259,11 @@ function readGenAttrDemoUiOptionsFromControls(): GenAttrDemoUiOptions {
     const edgeTopPCoverage = Number.isFinite(rawTop)
         ? clampDagEdgeTopPCoverage(rawTop)
         : DAG_EDGE_TOP_P_COVERAGE_DEFAULT;
-    const rawTotal = parseInt(dagPlaybackTotalSInput?.value ?? '', 10);
-    const playbackTotalS = Number.isFinite(rawTotal)
-        ? clampDagPlaybackTotalS(rawTotal)
-        : GEN_ATTR_DAG_PLAYBACK_TOTAL_S_DEFAULT;
-    const rawStep = parseInt(dagPlaybackStepMsInput?.value ?? '', 10);
-    const playbackStepMs = Number.isFinite(rawStep)
-        ? clampDagPlaybackStepMs(rawStep)
-        : GEN_ATTR_DAG_PLAYBACK_STEP_MS_DEFAULT;
+    const {
+        mode: replayPacingMode,
+        stepMs: playbackStepMs,
+        totalS: playbackTotalS,
+    } = readDagReplayPacingFromControls();
     return {
         layoutMode: currentDagLayoutMode(),
         measureWidthPx,
@@ -1378,7 +1280,7 @@ function readGenAttrDemoUiOptionsFromControls(): GenAttrDemoUiOptions {
         recursiveEdgeBatchAnimationEnabled: dagRecursiveEdgeAnimationInput?.checked ?? true,
         recursiveEdgeBatchAnimationDirection: currentDagRecursiveEdgeAnimationDirection(),
         showTokenInfoOnSelected: dagShowTopkOnSelectedInput?.checked ?? false,
-        replayPacingMode: currentDagReplayPacingMode(),
+        replayPacingMode,
         playbackTotalS,
         playbackStepMs,
         excludePromptPatternsEnabled: genAttrExcludePromptPatternsEnable?.checked ?? true,
@@ -1600,12 +1502,8 @@ const GEN_ATTR_DEMO_UI_LOCAL_STORAGE_KEYS: readonly string[] = [
 ];
 
 function removeGenAttrDemoUiOptionsFromLocalStorage(): void {
-    try {
-        for (const k of GEN_ATTR_DEMO_UI_LOCAL_STORAGE_KEYS) {
-            localStorage.removeItem(k);
-        }
-    } catch {
-        /* ignore */
+    for (const k of GEN_ATTR_DEMO_UI_LOCAL_STORAGE_KEYS) {
+        lsRemove(k);
     }
 }
 
@@ -1646,17 +1544,13 @@ function bindExcludePatternControls(
     enabledKey: string,
 ): void {
     enableEl?.addEventListener('change', () => {
-        try {
-            if (textEl) localStorage.setItem(textKey, textEl.value);
-            localStorage.setItem(enabledKey, enableEl.checked ? '1' : '0');
-        } catch { /* ignore */ }
+        if (textEl) lsSet(textKey, textEl.value);
+        lsWriteBool(enabledKey, enableEl.checked, '1');
         syncGenAttrExcludePatternTextareasDisabled();
         onExcludePatternsEffectiveChange();
     });
     textEl?.addEventListener('blur', () => {
-        try {
-            localStorage.setItem(textKey, textEl.value);
-        } catch { /* ignore */ }
+        lsSet(textKey, textEl.value);
         onExcludePatternsEffectiveChange();
     });
 }
@@ -1675,6 +1569,7 @@ bindExcludePatternControls(
 );
 
 function currentModelVariant(): PredictionAttributeModelVariant {
+    if (!isSkipChatTemplate()) return 'instruct';
     const v = modelVariantSelect?.value;
     return v === 'base' || v === 'instruct' ? v : 'instruct';
 }
@@ -1727,6 +1622,7 @@ function getInputSnapshotForRun(): string {
         useSys: isGenAttrUseSystemPrompt(),
         sys: (systemTextField.node() as HTMLTextAreaElement | null)?.value ?? '',
         user: (userTextField.node() as HTMLTextAreaElement | null)?.value ?? '',
+        think: isEnableThinking(),
         ...runOpts,
     });
 }
@@ -1735,9 +1631,6 @@ function setGenLoading(loading: boolean): void {
     inFlight = loading;
     loaderSmall.style('display', loading ? null : 'none');
     genAttrResultsEl.classed('gen-attr-in-flight', loading);
-    if (!loading) {
-        analyzeProgressEl.text('').style('display', 'none');
-    }
     syncSubmitButtonState();
 }
 
@@ -1790,15 +1683,24 @@ function bindInputsForSync(): void {
 }
 
 if (skipChatTemplateInput) {
-    skipChatTemplateInput.checked = readSkipChatTemplateFromStorage();
+    skipChatTemplateInput.checked = lsReadBool(LS_SKIP_CHAT_TEMPLATE, false);
     skipChatTemplateInput.addEventListener('change', () => {
-        writeSkipChatTemplateToStorage(skipChatTemplateInput.checked);
+        lsWriteBool(LS_SKIP_CHAT_TEMPLATE, skipChatTemplateInput.checked);
         syncPromptPanelVisibility();
         syncGenAttrSystemPromptSuppressedUi();
+        syncModelVariantUi();
+        syncSubmitButtonState();
+    });
+}
+if (genAttrEnableThinkingInput) {
+    genAttrEnableThinkingInput.checked = lsReadBool(GEN_ATTR_ENABLE_THINKING_STORAGE_KEY, false);
+    genAttrEnableThinkingInput.addEventListener('change', () => {
+        lsWriteBool(GEN_ATTR_ENABLE_THINKING_STORAGE_KEY, genAttrEnableThinkingInput.checked);
         syncSubmitButtonState();
     });
 }
 syncPromptPanelVisibility();
+syncModelVariantUi();
 syncGenAttrSystemPromptSuppressedUi();
 genAttrUseSystemPromptInput?.addEventListener('change', () => {
     syncGenAttrSystemPromptSuppressedUi();
@@ -1914,28 +1816,39 @@ async function applyGenAttrCachedRun(
         }
         if (skipChatTemplateInput) {
             skipChatTemplateInput.checked = false;
-            writeSkipChatTemplateToStorage(false);
+            lsWriteBool(LS_SKIP_CHAT_TEMPLATE, false);
             syncPromptPanelVisibility();
             syncGenAttrSystemPromptSuppressedUi();
+            syncModelVariantUi();
         }
         systemTextField.property('value', draft.system ?? '');
         systemPromptTextarea?.dispatchEvent(new Event('input', { bubbles: true }));
         userTextField.property('value', draft.user ?? '');
         userPromptTextarea?.dispatchEvent(new Event('input', { bubbles: true }));
+        if (genAttrEnableThinkingInput) {
+            genAttrEnableThinkingInput.checked = draft.enableThinking ?? false;
+            lsWriteBool(
+                GEN_ATTR_ENABLE_THINKING_STORAGE_KEY,
+                genAttrEnableThinkingInput.checked,
+            );
+        }
     } else {
         if (skipChatTemplateInput) {
             skipChatTemplateInput.checked = true;
-            writeSkipChatTemplateToStorage(true);
+            lsWriteBool(LS_SKIP_CHAT_TEMPLATE, true);
             syncPromptPanelVisibility();
+            syncModelVariantUi();
         }
         rawTextField.property('value', rec.initialContext);
         rawTextarea?.dispatchEvent(new Event('input', { bubbles: true }));
     }
 
     // 恢复 model / maxTokens（必须在 getInputSnapshotForRun() 之前，使快照与实际一致）
-    if (draft?.model && modelVariantSelect) {
+    if (draft?.mode === 'raw' && draft.model && modelVariantSelect) {
         modelVariantSelect.value = draft.model;
+        lsWriteString(GEN_ATTR_MODEL_VARIANT_STORAGE_KEY, draft.model);
     }
+    syncModelVariantUi();
     if (draft?.maxTokens != null && maxTokensInput) {
         maxTokensInput.value = String(draft.maxTokens);
     }
@@ -2107,11 +2020,7 @@ initQueryHistoryDropdown({
 refreshGenAttrBundledDemoEntriesList();
 syncGenAttrCachedDemosValueDisplay();
 
-// --- 进度与指标 ---
-function showProgress(current: number, total: number): void {
-    analyzeProgressEl.text(`${current} / ${total}`).style('display', null);
-}
-
+// --- 指标 ---
 /** 首步 `token_attribution.length` ≈ 初始 prompt 子词数（与 Chat 展示同形，无需后端 usage） */
 function initialPromptTokensFromFirstStep(step: TokenGenStep): number | undefined {
     const n = step.response.token_attribution?.length;
@@ -2213,13 +2122,16 @@ async function resolveInitialContext(signal: AbortSignal): Promise<string> {
     const user = (userTextField.node() as HTMLTextAreaElement | null)?.value ?? '';
     const useSystem = isGenAttrUseSystemPrompt();
     const systemRaw = (systemTextField.node() as HTMLTextAreaElement | null)?.value ?? '';
-    const promptReq: { model: string; prompt: string; system?: string } = {
+    const promptReq: { model: string; prompt: string; system?: string; enable_thinking?: boolean } = {
         model: currentModelVariant(),
         prompt: user,
     };
     if (useSystem) {
         promptReq.system = systemRaw;
     }
+    if (isEnableThinking()) {
+        promptReq.enable_thinking = true;
+    }
     const assembled = await postCompletionsPrompt(promptReq, { signal });
     return assembled.prompt_used;
 }
@@ -2277,7 +2189,6 @@ async function runGeneration(): Promise<void> {
         const tokenizeModel = currentModelVariant();
         const runDraft = buildGenAttrRunDraftForCache();
         const prompt = getActivePromptValue();
-        analyzeProgressEl.text('Assembling prompt…').style('display', null);
         initialContext = await resolveInitialContext(signal);
         lastRunInitialContext = initialContext;
         lastRunInputSnapshot = getInputSnapshotForRun();
@@ -2301,7 +2212,6 @@ async function runGeneration(): Promise<void> {
         let initialPromptTokens: number | undefined;
         currentRunPromptSpans = [];
         setGenAttrUsageMetric(undefined, 0);
-        showProgress(0, maxTokens);
 
         dagHandle.reset();
         void fetchTokenize(apiBaseForRequests, initialContext, tokenizeModel).then((spans) => {
@@ -2332,7 +2242,6 @@ async function runGeneration(): Promise<void> {
                 const excludeCtx = excludeIntervalContextFromSteps(h.getAllSteps());
                 pushDagFromPreprocess(step, stepIndex, true, excludeCtx);
                 dagPlaybackNextIndex = stepIndex + 1;
-                showProgress(stepIndex + 1, maxTokens);
                 setGenAttrUsageMetric(initialPromptTokens, stepIndex + 1);
                 showAttributionForStepIndex(stepIndex);
             },
@@ -2402,7 +2311,7 @@ function refreshDagForThemeChange(): void {
     stopDagPlayback();
     const h = runnerHandle;
     if (!h || h.tokenCount === 0) return;
-    tryResetAndReplayDag();
+    tryResetAndReplayDag({ refit: false });
 }
 
 const themeManager = initThemeManager(

client/src/pages/chat/index.ts

@@ -53,9 +53,10 @@ import {
 } from '../../shared/cross/contentUrl';
 import { CHAT_SURPRISAL_COLOR_MAP_MAX } from '../../shared/cross/SurprisalColorConfig';
 import { updateChatCompletionMetrics } from '../../shared/cross/textMetricsUpdater';
+import { lsReadBool, lsWriteBool } from '../../shared/storage/localStorageHelpers';
 import {
-    readSkipChatTemplateFromStorage,
-    writeSkipChatTemplateToStorage,
+    CHAT_ENABLE_THINKING_STORAGE_KEY,
+    LS_SKIP_CHAT_TEMPLATE,
 } from '../../features/chat/chatPromptTemplateMode';
 import { createToast } from '../../shared/ui/toast';
 import { initDensityAttributionSidebar } from '../../shared/prediction_attribution/density_sidebar/densityAttributionSidebar';
@@ -110,6 +111,9 @@ const chatUseSystemPromptInput = document.getElementById(
     'chat_use_system_prompt'
 ) as HTMLInputElement | null;
 const chatSystemPromptPanel = document.getElementById('chat_system_prompt_panel');
+const enableThinkingInput = document.getElementById(
+    'chat_enable_thinking'
+) as HTMLInputElement | null;
 
 function isSkipChatTemplate(): boolean {
     return skipChatTemplateInput?.checked ?? false;
@@ -119,6 +123,10 @@ function isChatUseSystemPrompt(): boolean {
     return chatUseSystemPromptInput?.checked ?? true;
 }
 
+function isEnableThinking(): boolean {
+    return enableThinkingInput?.checked ?? false;
+}
+
 function syncChatSystemPromptSuppressedUi(): void {
     const on = isChatUseSystemPrompt();
     chatSystemPromptPanel?.classList.toggle('chat-system-prompt-suppressed', !on);
@@ -450,13 +458,16 @@ const runAsk = async (options?: { forceRefresh?: boolean }): Promise<void> => {
             const useSystem = isChatUseSystemPrompt();
             const systemRaw =
                 (chatSystemTextField.node() as HTMLTextAreaElement | null)?.value ?? '';
-            const promptReq: { model: string; prompt: string; system?: string } = {
+            const promptReq: { model: string; prompt: string; system?: string; enable_thinking?: boolean } = {
                 model: completionModel,
                 prompt
             };
             if (useSystem) {
                 promptReq.system = systemRaw;
             }
+            if (isEnableThinking()) {
+                promptReq.enable_thinking = true;
+            }
             const assembled = await postCompletionsPrompt(promptReq, {
                 signal: askAbort.signal
             });
@@ -526,14 +537,21 @@ const runAsk = async (options?: { forceRefresh?: boolean }): Promise<void> => {
 };
 
 if (skipChatTemplateInput) {
-    skipChatTemplateInput.checked = readSkipChatTemplateFromStorage();
+    skipChatTemplateInput.checked = lsReadBool(LS_SKIP_CHAT_TEMPLATE, false);
     skipChatTemplateInput.addEventListener('change', () => {
-        writeSkipChatTemplateToStorage(skipChatTemplateInput.checked);
+        lsWriteBool(LS_SKIP_CHAT_TEMPLATE, skipChatTemplateInput.checked);
         syncPromptPanelVisibility();
         syncChatSystemPromptSuppressedUi();
         syncAskButtonState();
     });
 }
+if (enableThinkingInput) {
+    enableThinkingInput.checked = lsReadBool(CHAT_ENABLE_THINKING_STORAGE_KEY, false);
+    enableThinkingInput.addEventListener('change', () => {
+        lsWriteBool(CHAT_ENABLE_THINKING_STORAGE_KEY, enableThinkingInput.checked);
+        syncAskButtonState();
+    });
+}
 syncPromptPanelVisibility();
 syncChatSystemPromptSuppressedUi();
 chatUseSystemPromptInput?.addEventListener('change', () => {

client/src/pages/home/index.ts

@@ -5,7 +5,7 @@ import '../../shared/core/d3-polyfill';
 import dagPreviewLight from '../../assets/images/dag.mov';
 import dagPreviewDark from '../../assets/images/dag-dark.mov';
 import dagSpiralPreview from '../../assets/images/dag-spiral.mov';
-import dagCotPreview from '../../assets/images/dag-cot.png';
+import dagCotPreview from '../../assets/images/dag-cot.mov';
 import '../../css/pages/home.scss';
 
 import { initThemeManager, type Theme } from '../../shared/ui/theme';
@@ -43,7 +43,7 @@ function applyGenAttributeNavCardHref(): void {
     });
 }
 
-const GEN_ATTRIBUTE_BADGE_LINK = 'http://xhslink.com/o/A7VLi99aBvG';
+const GEN_ATTRIBUTE_BADGE_LINK = 'https://xhslink.com/m/PwoOhuuhtV';
 
 const DAG_PREVIEW_BY_THEME: Record<Theme, string> = {
     light: dagPreviewLight,
@@ -61,14 +61,14 @@ function initGenAttributeCardCarousel(): (theme: Theme) => void {
     const dots = card?.querySelectorAll<HTMLButtonElement>('.nav-landing-card-carousel-dots button');
     const flowVideo = card?.querySelector<HTMLVideoElement>('[data-slide="flow"] video');
     const spiralVideo = card?.querySelector<HTMLVideoElement>('[data-slide="spiral"] video');
-    const cotImg = card?.querySelector<HTMLImageElement>('[data-slide="cot"] img');
+    const cotVideo = card?.querySelector<HTMLVideoElement>('[data-slide="cot"] video');
 
-    if (!card || !viewport || slides.length === 0 || !dots?.length || !flowVideo || !spiralVideo || !cotImg) {
+    if (!card || !viewport || slides.length === 0 || !dots?.length || !flowVideo || !spiralVideo || !cotVideo) {
         return () => {};
     }
 
     spiralVideo.src = dagSpiralPreview;
-    cotImg.src = dagCotPreview;
+    cotVideo.src = dagCotPreview;
 
     let index = 0;
     let paused = false;
@@ -98,10 +98,13 @@ function initGenAttributeCardCarousel(): (theme: Theme) => void {
     const syncSlideVideos = (): void => {
         flowVideo.pause();
         spiralVideo.pause();
+        cotVideo.pause();
         if (index === 0) {
             void flowVideo.play().catch(() => {});
         } else if (index === 1) {
             void spiralVideo.play().catch(() => {});
+        } else if (index === 2) {
+            void cotVideo.play().catch(() => {});
         }
     };
 

client/src/scripts/genAttributeDemoManifestPlugin.js

@@ -1,31 +1,106 @@
 /**
- * 构建前扫描 `assets/demos/causal_flow/*.json`，写入 `features/causal_flow/genAttributeBundledDemoManifest.generated.ts`，供 bundle 内联 slug 列表。
- * 并为该目录注册 contextDependencies，便于 watch 下增减 demo JSON 时触发重编。
+ * 构建前扫描 `assets/demos/causal_flow/*.json`，写入 `features/causal_flow/genAttributeBundledDemoManifest.generated.ts`，供 bundle 内联 demo 列表。
+ * 顺序与 UI 名：`order.json` 数组；项为 slug 字符串或 `{ slug, label? }`（无 label 则 UI 显示 slug）。
+ * 未列入 order 的 demo 按 UTF-16 码元序追加到末尾，label 同 slug。
+ * order 中的 slug 必须对应目录内已有 demo JSON；重复 slug 亦会在构建时报错。
  */
 const path = require('path');
 const fs = require('fs');
 
 const REL_DIR = 'assets/demos/causal_flow';
 const GENERATED_BASENAME = 'genAttributeBundledDemoManifest.generated.ts';
+const ORDER_FILENAME = 'order.json';
 
-function collectSlugs(srcDir) {
+function utf16Sort(slugs) {
+    return [...slugs].sort((a, b) => (a < b ? -1 : a > b ? 1 : 0));
+}
+
+function discoverSlugs(srcDir) {
     if (!fs.existsSync(srcDir)) return [];
-    const files = fs.readdirSync(srcDir).filter((f) => f.endsWith('.json'));
-    const slugs = files
+    return fs
+        .readdirSync(srcDir)
+        .filter((f) => f.endsWith('.json') && f !== ORDER_FILENAME)
         .map((f) => f.replace(/\.json$/i, ''))
         .filter((s) => s.length > 0);
-    // UTF-16 码元序，与 locale 无关，避免不同构建机生成顺序不一致
-    slugs.sort((a, b) => (a < b ? -1 : a > b ? 1 : 0));
-    return slugs;
+}
+
+/** @returns {{ slug: string, label: string | null } | null} */
+function parseOrderEntry(entry, index) {
+    const at = `${ORDER_FILENAME}[${index}]`;
+    if (typeof entry === 'string') {
+        const slug = entry.trim();
+        return slug ? { slug, label: null } : null;
+    }
+    if (entry && typeof entry === 'object' && typeof entry.slug === 'string') {
+        const slug = entry.slug.trim();
+        if (!slug) return null;
+        const label =
+            typeof entry.label === 'string' && entry.label.trim().length > 0
+                ? entry.label.trim()
+                : null;
+        return { slug, label };
+    }
+    throw new Error(
+        `${at}: expected a slug string or { "slug": "...", "label"?: "..." }`
+    );
+}
+
+function readOrderEntries(srcDir) {
+    const orderPath = path.join(srcDir, ORDER_FILENAME);
+    if (!fs.existsSync(orderPath)) return null;
+    let raw;
+    try {
+        raw = JSON.parse(fs.readFileSync(orderPath, 'utf8'));
+    } catch (e) {
+        throw new Error(`${ORDER_FILENAME}: invalid JSON (${e.message})`);
+    }
+    if (!Array.isArray(raw)) {
+        throw new Error(`${ORDER_FILENAME}: expected a JSON array`);
+    }
+    return raw.map((entry, i) => parseOrderEntry(entry, i)).filter(Boolean);
+}
+
+function resolveLabel(slug, label) {
+    return label ?? slug;
+}
+
+function collectDemoEntries(srcDir) {
+    const discovered = new Set(discoverSlugs(srcDir));
+    const order = readOrderEntries(srcDir);
+    if (order == null) {
+        return utf16Sort([...discovered]).map((slug) => ({
+            slug,
+            label: slug,
+        }));
+    }
+    const seen = new Set();
+    const result = [];
+    for (const { slug, label } of order) {
+        if (seen.has(slug)) {
+            throw new Error(`${ORDER_FILENAME}: duplicate slug ${JSON.stringify(slug)}`);
+        }
+        if (!discovered.has(slug)) {
+            throw new Error(
+                `${ORDER_FILENAME}: unknown slug ${JSON.stringify(slug)} (no ${slug}.json under ${REL_DIR})`,
+            );
+        }
+        seen.add(slug);
+        result.push({ slug, label: resolveLabel(slug, label) });
+    }
+    for (const slug of utf16Sort([...discovered].filter((s) => !seen.has(s)))) {
+        result.push({ slug, label: slug });
+    }
+    return result;
 }
 
 function writeGeneratedModule(srcDir, outPath) {
-    const slugs = collectSlugs(srcDir);
+    const entries = collectDemoEntries(srcDir);
     const content =
         '/**\n' +
         ' * Generated by GenAttributeDemoManifestPlugin — do not edit.\n' +
         ' */\n' +
-        `export const GEN_ATTRIBUTE_BUNDLED_DEMO_SLUGS: readonly string[] = ${JSON.stringify(slugs)};\n`;
+        'export type GenAttributeBundledDemoManifestEntry = { readonly slug: string; readonly label: string };\n' +
+        `export const GEN_ATTRIBUTE_BUNDLED_DEMOS: readonly GenAttributeBundledDemoManifestEntry[] = ${JSON.stringify(entries)};\n`;
     if (fs.existsSync(outPath) && fs.readFileSync(outPath, 'utf8') === content) return;
     fs.mkdirSync(path.dirname(outPath), { recursive: true });
     fs.writeFileSync(outPath, content, 'utf8');

client/src/scripts/injectPageMetaIntoHtml.js

@@ -97,7 +97,7 @@ function injectPageMeta(html, pageKey, doc) {
                     : `<div class="nav-landing-card-shot" aria-hidden="true"></div>`;
             const badge =
                 navKey === 'causalFlow'
-                    ? `<span class="nav-landing-card-badge" title="Go to demo on RedNote: xhslink.com/o/A7VLi99aBvG" data-i18n="text,title">100K+ plays on RedNote</span>`
+                    ? `<span class="nav-landing-card-badge" title="Go to demo on RedNote: xhslink.com" data-i18n="text,title">500K+ plays on RedNote</span>`
                     : '';
 
             if (navKey === 'causalFlow') {
@@ -117,7 +117,7 @@ function injectPageMeta(html, pageKey, doc) {
                     `<div class="nav-landing-card-carousel-viewport">` +
                     `<div class="nav-landing-card-slide" data-slide="flow">${slideLink('flow', '<video muted loop playsinline preload="metadata"></video>')}</div>` +
                     `<div class="nav-landing-card-slide" data-slide="spiral">${slideLink('spiral', '<video muted loop playsinline preload="none"></video>')}</div>` +
-                    `<div class="nav-landing-card-slide" data-slide="cot">${slideLink('cot', '<img alt="" decoding="async" />')}</div>` +
+                    `<div class="nav-landing-card-slide" data-slide="cot">${slideLink('cot', '<video muted loop playsinline preload="none"></video>')}</div>` +
                     `</div>` +
                     `<button type="button" class="nav-landing-card-carousel-arrow nav-landing-card-carousel-arrow--prev" aria-label="Previous preview">‹</button>` +
                     `<button type="button" class="nav-landing-card-carousel-arrow nav-landing-card-carousel-arrow--next" aria-label="Next preview">›</button>` +

client/src/shared/api/completionsClient.ts

@@ -68,18 +68,26 @@ export type PostCompletionsPromptOptions = {
  * POST /v1/completions/prompt：将用户原文套用 chat template，返回实际送入续写的完整 prompt。
  */
 export async function postCompletionsPrompt(
-    body: { model: string; prompt: string; system?: string },
+    body: { model: string; prompt: string; system?: string; enable_thinking?: boolean },
     options: PostCompletionsPromptOptions = {}
 ): Promise<{ prompt_used: string }> {
     const { signal } = options;
     const url = URLHandler.basicURL() + COMPLETIONS_PROMPT_PATH;
-    const payload: { model: string; prompt: string; system?: string } = {
+    const payload: {
+        model: string;
+        prompt: string;
+        system?: string;
+        enable_thinking?: boolean;
+    } = {
         model: body.model,
         prompt: body.prompt
     };
     if (body.system !== undefined) {
         payload.system = body.system;
     }
+    if (body.enable_thinking === true) {
+        payload.enable_thinking = true;
+    }
     const res = await fetch(url, {
         method: 'POST',
         headers: { 'Content-Type': 'application/json; charset=UTF-8' },

client/src/shared/controllers/serverDemoController.ts

@@ -12,6 +12,7 @@ import {
     buildFolderOptions
 } from '../../features/demo/demoPathUtils';
 import { tr, trf } from '../../shared/lang/i18n-lite';
+import { lsGet, lsSet } from '../../shared/storage/localStorageHelpers';
 
 /**
  * 从保存结果中提取文件名，如果不存在则根据名称生成
@@ -40,7 +41,7 @@ export const showDemoNameInput = (
                 const folders = result.folders || [];
                 
                 // 获取上次保存的路径（从 localStorage）
-                const lastSavePath = localStorage.getItem(LAST_SAVE_PATH_KEY);
+                const lastSavePath = lsGet(LAST_SAVE_PATH_KEY);
                 
                 // 使用统一的 buildFolderOptions 函数
                 const { options: selectOptions, defaultPath } = buildFolderOptions(folders, lastSavePath);
@@ -59,7 +60,7 @@ export const showDemoNameInput = (
                         if (value && value.input) {
                             // 保存选择的路径到 localStorage
                             const selectedPath = value.select || '/';
-                            localStorage.setItem(LAST_SAVE_PATH_KEY, selectedPath);
+                            lsSet(LAST_SAVE_PATH_KEY, selectedPath);
                             resolve({ name: value.input, path: selectedPath });
                         } else {
                             resolve(null);
@@ -161,7 +162,7 @@ export const handleServerDemoSave = async (options: ServerDemoSaveOptions): Prom
         result = { name: presetSaveInfo.name.trim(), path: normalizedPath };
         // 记录最近路径
         if (normalizedPath) {
-            localStorage.setItem(LAST_SAVE_PATH_KEY, normalizedPath);
+            lsSet(LAST_SAVE_PATH_KEY, normalizedPath);
         }
     } else {
         const defaultName = getDefaultDemoName(currentData, textFieldValue, currentFileName);

client/src/shared/core/responsive.ts

@@ -3,6 +3,8 @@
  * 使用 CSS 变量和 matchMedia API 实现单一数据源
  */
 
+import { lsGet, lsRemove, lsSet } from '../storage/localStorageHelpers';
+
 /**
  * 从 CSS 变量获取断点值
  */
@@ -46,7 +48,7 @@ export const FORCE_NARROW_STORAGE_KEY = 'info_radar_force_narrow';
 export const FORCE_NARROW_CHANGE_EVENT = 'force-narrow-change';
 
 export const getForceNarrowScreen = (): boolean =>
-  localStorage.getItem(FORCE_NARROW_STORAGE_KEY) === '1';
+  lsGet(FORCE_NARROW_STORAGE_KEY) === '1';
 
 export const syncForceNarrowAttribute = (): void => {
   const root = document.documentElement;
@@ -70,8 +72,8 @@ export const initForceNarrowFromStorage = (): void => {
 };
 
 export const setForceNarrowScreen = (enabled: boolean): void => {
-  if (enabled) localStorage.setItem(FORCE_NARROW_STORAGE_KEY, '1');
-  else localStorage.removeItem(FORCE_NARROW_STORAGE_KEY);
+  if (enabled) lsSet(FORCE_NARROW_STORAGE_KEY, '1');
+  else lsRemove(FORCE_NARROW_STORAGE_KEY);
   syncForceNarrowAttribute();
   window.dispatchEvent(new Event(FORCE_NARROW_CHANGE_EVENT));
   window.dispatchEvent(new Event('resize'));

client/src/shared/cross/adminManager.ts

@@ -2,6 +2,8 @@
  * 管理员状态管理模块
  */
 
+import { lsGet, lsRemove, lsSet } from '../storage/localStorageHelpers';
+
 const INFORADAR_ADMIN_TOKEN_KEY = 'admin_token';
 const ADMIN_MODE_KEY = 'is_admin_mode';
 
@@ -12,8 +14,8 @@ export class AdminManager {
 
     private constructor() {
         // 从localStorage恢复状态
-        const savedToken = localStorage.getItem(INFORADAR_ADMIN_TOKEN_KEY);
-        const savedMode = localStorage.getItem(ADMIN_MODE_KEY);
+        const savedToken = lsGet(INFORADAR_ADMIN_TOKEN_KEY);
+        const savedMode = lsGet(ADMIN_MODE_KEY);
         
         if (savedToken) {
             this.adminToken = savedToken;
@@ -66,8 +68,8 @@ export class AdminManager {
             if (result.success) {
                 this.adminToken = token;
                 this.isAdminMode = true;
-                localStorage.setItem(INFORADAR_ADMIN_TOKEN_KEY, token);
-                localStorage.setItem(ADMIN_MODE_KEY, 'true');
+                lsSet(INFORADAR_ADMIN_TOKEN_KEY, token);
+                lsSet(ADMIN_MODE_KEY, 'true');
                 return {
                     success: true,
                     message: result.message
@@ -98,8 +100,8 @@ export class AdminManager {
     public clearAdminToken(): void {
         this.adminToken = null;
         this.isAdminMode = false;
-        localStorage.removeItem(INFORADAR_ADMIN_TOKEN_KEY);
-        localStorage.removeItem(ADMIN_MODE_KEY);
+        lsRemove(INFORADAR_ADMIN_TOKEN_KEY);
+        lsRemove(ADMIN_MODE_KEY);
     }
 
     /**

client/src/shared/cross/digitsMergeManager.ts

@@ -1,4 +1,6 @@
 /** 数字段合并（digit merge）开关，与 BPE overlap 合并独立；默认开启以保持既有行为 */
+import { lsGet, lsWriteBool } from '../storage/localStorageHelpers';
+
 export const DIGITS_MERGE_STORAGE_KEY = 'info_radar_digits_merge_enabled';
 
 const renderListeners = new Set<() => void>();
@@ -39,12 +41,12 @@ export function addDigitsMergeRenderListener(callback: () => void): void {
 }
 
 export function getDigitsMergeEnabled(): boolean {
-    const v = localStorage.getItem(DIGITS_MERGE_STORAGE_KEY);
+    const v = lsGet(DIGITS_MERGE_STORAGE_KEY);
     if (v === null) return true;
     return v === 'true';
 }
 
 export function setDigitsMergeEnabled(enabled: boolean): void {
-    localStorage.setItem(DIGITS_MERGE_STORAGE_KEY, enabled ? 'true' : 'false');
+    lsWriteBool(DIGITS_MERGE_STORAGE_KEY, enabled);
     notifyDigitsMergeRenderListeners();
 }

client/src/shared/cross/panelSplitStorage.ts

@@ -1,5 +1,7 @@
 /** 左栏宽度占「主区宽度 − resizer(8px)」的比例，与 LayoutController / chatPanelLayout 内逻辑一致 */
 
+import { lsGet, lsSet } from '../storage/localStorageHelpers';
+
 const DEFAULT_RATIO = 0.5;
 const MIN_RATIO = 0.1;
 const MAX_RATIO = 0.9;
@@ -10,26 +12,18 @@ export const PANEL_SPLIT_STORAGE_KEY_ATTRIBUTION = 'info_radar_panel_split_attri
 export const PANEL_SPLIT_STORAGE_KEY_GEN_ATTRIBUTE = 'info_radar_panel_split_gen_attribute';
 
 export function readPanelSplitRatio(storageKey: string): number {
-    try {
-        const raw = localStorage.getItem(storageKey);
-        if (raw === null) {
-            return DEFAULT_RATIO;
-        }
-        const n = Number(raw);
-        if (!Number.isFinite(n)) {
-            return DEFAULT_RATIO;
-        }
-        return Math.max(MIN_RATIO, Math.min(MAX_RATIO, n));
-    } catch {
+    const raw = lsGet(storageKey);
+    if (raw === null) {
+        return DEFAULT_RATIO;
+    }
+    const n = Number(raw);
+    if (!Number.isFinite(n)) {
         return DEFAULT_RATIO;
     }
+    return Math.max(MIN_RATIO, Math.min(MAX_RATIO, n));
 }
 
 export function writePanelSplitRatio(storageKey: string, ratio: number): void {
-    try {
-        const clamped = Math.max(MIN_RATIO, Math.min(MAX_RATIO, ratio));
-        localStorage.setItem(storageKey, String(clamped));
-    } catch {
-        // ignore quota / private mode
-    }
+    const clamped = Math.max(MIN_RATIO, Math.min(MAX_RATIO, ratio));
+    lsSet(storageKey, String(clamped));
 }

client/src/shared/cross/queryHistory.ts

@@ -3,6 +3,7 @@
  */
 
 import { tr } from '../../shared/lang/i18n-lite';
+import { lsGet, lsSet } from '../storage/localStorageHelpers';
 
 /** 首页语义搜索等默认使用 */
 export const SEMANTIC_QUERY_HISTORY_KEY = 'info_radar_query_search_history';
@@ -49,7 +50,7 @@ function shouldTouchLinkedMru(applyHistoryOnHover: boolean, fromHover: boolean):
 
 function load(storageKey: string): string[] {
     try {
-        const raw = localStorage.getItem(storageKey);
+        const raw = lsGet(storageKey);
         if (!raw) return [];
         const parsed = JSON.parse(raw);
         if (!Array.isArray(parsed)) return [];
@@ -68,12 +69,12 @@ function load(storageKey: string): string[] {
 
 function remove(storageKey: string, query: string): void {
     const list = load(storageKey).filter((s) => s !== query);
-    localStorage.setItem(storageKey, JSON.stringify(list));
+    lsSet(storageKey, JSON.stringify(list));
 }
 
 export function saveHistory(query: string, storageKey: string = SEMANTIC_QUERY_HISTORY_KEY): void {
     const list = [query, ...load(storageKey).filter((s) => s !== query)].slice(0, MAX);
-    localStorage.setItem(storageKey, JSON.stringify(list));
+    lsSet(storageKey, JSON.stringify(list));
 }
 
 export interface InitQueryHistoryDropdownOptions {

client/src/shared/cross/semanticResultCache.ts

@@ -3,6 +3,8 @@
  * 持久化到 localStorage，刷新后保留。删除查询历史时需调用 removeByQuery 清理对应缓存。
  */
 
+import { lsGet, lsSetCatch } from '../storage/localStorageHelpers';
+
 const MAX_SIZE = 50;
 const STORAGE_KEY = 'info_radar_semantic_result_cache';
 
@@ -35,7 +37,7 @@ let keyOrder: string[] = [];
 
 function load(): void {
     try {
-        const raw = localStorage.getItem(STORAGE_KEY);
+        const raw = lsGet(STORAGE_KEY);
         if (!raw) return;
         const parsed = JSON.parse(raw) as { entries?: Record<string, StoredEntry>; keyOrder?: string[] };
         if (!parsed?.entries || typeof parsed.entries !== 'object') return;
@@ -55,17 +57,15 @@ function load(): void {
 load();
 
 function persist(): void {
-    try {
-        const entries: Record<string, StoredEntry> = {};
-        for (const [k, v] of cache) entries[k] = v;
-        localStorage.setItem(STORAGE_KEY, JSON.stringify({ entries, keyOrder }));
-    } catch (e) {
-        const reason =
-            e instanceof DOMException && e.name === 'QuotaExceededError'
-                ? 'localStorage 配额已满（Chrome 约 5MB/域名），建议减少 MAX_SIZE 或清理其他站点数据'
-                : String(e);
-        console.warn('[semanticResultCache] 持久化失败，刷新后缓存可能丢失。原因:', reason);
-    }
+    const entries: Record<string, StoredEntry> = {};
+    for (const [k, v] of cache) entries[k] = v;
+    const err = lsSetCatch(STORAGE_KEY, JSON.stringify({ entries, keyOrder }));
+    if (err === undefined) return;
+    const reason =
+        err instanceof DOMException && err.name === 'QuotaExceededError'
+            ? 'localStorage 配额已满（Chrome 约 5MB/域名），建议减少 MAX_SIZE 或清理其他站点数据'
+            : String(err);
+    console.warn('[semanticResultCache] 持久化失败，刷新后缓存可能丢失。原因:', reason);
 }
 
 function evictOne(): void {

client/src/shared/cross/semanticThresholdManager.ts

@@ -1,10 +1,11 @@
 /** 语义匹配度阈值：用户可配置，持久化到 localStorage，与 Semantic analysis 同方式 */
 import { SEMANTIC_MATCH_THRESHOLD } from '../core/constants';
+import { lsGet, lsSet } from '../storage/localStorageHelpers';
 
 const KEY = 'info_radar_semantic_match_threshold';
 
 export function getSemanticMatchThreshold(): number {
-    const v = localStorage.getItem(KEY);
+    const v = lsGet(KEY);
     if (v == null) return SEMANTIC_MATCH_THRESHOLD;
     const n = parseFloat(v);
     return Number.isFinite(n) && n >= 0 && n <= 1 ? n : SEMANTIC_MATCH_THRESHOLD;
@@ -12,5 +13,5 @@ export function getSemanticMatchThreshold(): number {
 
 export function setSemanticMatchThreshold(value: number): void {
     const clamped = Math.max(0, Math.min(1, value));
-    localStorage.setItem(KEY, String(clamped));
+    lsSet(KEY, String(clamped));
 }

client/src/shared/cross/settingsMenuManager.ts

@@ -14,7 +14,10 @@ import { getSemanticAnalysisEnabled, setSemanticAnalysisEnabled } from './semant
 import { getDigitsMergeEnabled, setDigitsMergeEnabled } from './digitsMergeManager';
 import { getForceNarrowScreen, setForceNarrowScreen, FORCE_NARROW_CHANGE_EVENT } from '../core/responsive';
 import { getSemanticMatchThreshold } from './semanticThresholdManager';
-import { getInfoDensityRenderDisabled, setInfoDensityRenderDisabled } from '../../features/analysis/infoDensityRenderManager';
+import {
+    getInfoDensityRenderDisabled,
+    setInfoDensityRenderDisabled,
+} from '../../features/analysis/infoDensityRenderManager';
 import { showVisitStatsDialog } from './visitStatsDialog';
 import { showModelManageDialog } from './modelManageDialog';