08 · 三端界面设计规范

08 · 三端界面设计规范

手机（首要）/ Pad / PC 一套响应式代码。配套线框图源文件：../design/prototype.html（浏览器打开，五个画板对照本文阅读）。 状态：M0 设定已拍板（2026-09-23）；妖兽遭遇、切磋、时辰历、识海盘（首版与入战）、炼器、灵宠契约、战斗状态与余恙条、修行面板「手艺」小节、修行面板「画符」小节与剪径匪遭遇面板（M4 第十一段）、心魔照见面板与筑基增项（御器行路／执事受任／道心模糊化，M4 第十二段） 等界面均已落地；识海盘占用以寸数 + 占用条表达（2026-09-26 定）；立绘为二期事项。

1. 设计原则

  1. 一卷在手：界面是"正在翻看的一卷文书"，不是游戏仪表盘。信息层级靠排版与留白，不靠五颜六色。
  2. 结构简单明确、功能清晰（用户 2026-09-23 强调）：一屏一个主题，层级不超过三级；每个功能入口的含义不猜谜。
  3. 长按/悬停必有注释（用户硬性要求）：任何功能按钮、图标、状态条、名词，长按（手机）或悬停（PC）都弹出文字气泡——世界内口吻的解释（"神识：你如今还没有。开了阴窍自然知道"）；首次新功能出现时气泡自动亮一次，之后靠长按。
  4. 手机竖屏优先：所有功能必须在 375px 宽下不妥协地可用；Pad/PC 是空间的展开，不是功能的增加。
  5. 文字即美术：排版、字号节奏、墨色层次、间距是主要表达手段；图形只做符号化点缀（山纹、云纹、印信）。
  6. 拇指热区：高频操作在屏幕下 2/3；底部导航与"更多"单手可达。
  7. 不与沉浸为敌：无弹窗广告式跳窗，用面板滑入与卷页展开。教程形式 2026-09-24 用户改定：自由阶段用遮罩层 + 高亮目标按钮 + 文字卡（出身篇内仍是剧情人物点拨，不冲突）；遮罩必须可「知道了」单步关闭、可「不再引导」全部跳过。

2. 断点与适配

端 宽度 布局策略
手机竖屏 < 768px 单栏分层：状态 / 主视图 / 日志 / 底栏（本文 §3）
手机横屏 < 768px 横 左右分栏（主视图 60% + 日志 40%），状态收成顶栏细条
Pad 竖屏 768~991px 深度定制双栏（非加宽手机）：左主视图 60% + 右日志 40% 常驻，见 §4.5
Pad 横屏 992~1279px 双栏：左「主视图+状态」右「日志+人物」，底部细 dock（§4）
PC ≥ 1280px 三栏：左导航与角色 / 中主视图 / 右日志；顶栏时辰历（§5）
  • 字号使用 rem + 根字号随系统字号设置缩放；正文最小 15px（手机）/16px（Pad/PC）；
  • 触控目标 ≥44px、推荐 48px，间距 ≥8px，热区禁止重叠（继承旧项目教训）；
  • 支持安全区（刘海/Home 指示条，env(safe-area-inset-*)）。

3. 手机竖屏布局（你的原始设想，定稿结构）

┌─────────────────────────────┐
│ ① 状态卷首（固定）            │
│ 陈九 · 炼气（气机如丝）  27岁 │
│ 气血 ▓▓▓░░  灵气 ▓░░░░ 寿46  │
│ 道心 明▓蚀░浊░ 辰时·雨·三月廿一│
│ 河湾村·场院      [玄一宗外门] │
├─────────────────────────────┤
│                             │
│ ② 主视图（弹性，随场景切换）  │
│   区域 / 地图 / 行囊 / 装备 / │
│   灵宠 / 功法 / 卷宗 / 人物 … │
│                             │
├─────────────────────────────┤
│ ③ 日志卷（固定高度 ~28vh，   │
│    可上滑展开成半屏）         │
│ [全部][行迹][天下][此间][交游][势力]│
│ · 辰时 雨：场院上人渐多……    │
│ · 王货郎说西北山里有异光……   │
├─────────────────────────────┤
│ ④ 底栏（固定）               │
│ [修行][行路][行囊][日志][更多]│
└─────────────────────────────┘

3.1 ① 状态卷首

  • 高约 88~96px；点按任意处打开「角色整页」（属性/伤势/寿元/道心详情/因果簿/小传）；
  • 灵气/气血用细墨条（不用红蓝大色块）；寿元临限时纸边泛朱砂色（继承 10 年/5 年警告）；
  • 道心以三枚小印（明-月印 / 蚀-裂纹印 / 浊-雾印）的浓淡表达；
  • 末行：时辰·天气·日期 · 所在地（可点直达区域）· 身份徽记。其中时辰行是一枚可点按钮（2026-09-25 增）——点开时辰历（ClockSheet），见 §3.8。
  • 余恙条（2026-09-28 增，M4 第九段）：身上有余恙（战后未消的状态）时，卷首下方挂一行「余恙：毒 ×2 · 约 12 时辰」（activeStatuses 非空才显示；AppShell 以 --status-h 联动卷首高度）。无余恙不占位；状态口径见 15 §1.7。

3.2 ② 主视图（情境切换，你原话的核心）

同一容器，按情境换内容，不做并列入口堆叠：

情境 触发 内容
区域（默认） 停留在某地 风貌文字 → 归属律法 → 灵气档一行（五档：稀薄/微薄/尚可/充盈/浓郁，各附一句体感描述，不给精确数值，2026-09-24 增）→ 在场人物（头像字印+名+一行身份）→ 可做之事：直接行动（采药等，标明耗时，点下即执行）与入口项（修行/坊市/宗门，跳到对应界面）分列；聚落语境多一枚「打探消息（{cost} 文）」入口（2026-09-25 增，花铜钱费时辰换见闻，见 07 §3）。见 03 §8
地图 点底栏「行路」或移动时 六边形地图：当前格居中、单指拖动平移／双指捏放缩放／PC 滚轮缩放、右上「＋／－／回到脚下」控件；点脚下当前格浮出气泡（风貌+灵气档+「进入」跳区域页），点其他格浮行程卡（耗时/干粮/风险，灵气未知不显示）；格上写已知地名，邻接未知格雾中隐约露地形字（远眺）；图层切换、自钉笺注；详见 03 §12
行囊 「行囊」 一级分类（药材/妖材/矿物/丹药/符箓/法器/书册/钱/杂物，见 16 §7.1）；搜索/排序/到期筛选/笺注；点击=使用/装盘/端详/丢弃/移仓
识海盘（装备） ① 更多面板内单独入口 ② PC 左栏同名项（≥1280px）③ 修行面板神识行 ④ 行囊法器/符箓/战丹分页「查看识海盘」（7 层阴窍解锁，未解锁置灰并给注释；落地方案见 §3.9） 不分部位、分类装盘：顶部识海上限寸数条；下方分法器 / 符箓 / 战用丹药 / 灵宠四栏分页显示（符箓与丹药必须分开，用户要求），每条带占用寸数与「卸下」按钮；超限朱红提示 + 可「强装」（担代价）+ 预设阵势（行路/闯山/斗法/空身）；规则见 15 §2.2
战斗 遇敌先入对峙面板（战/逃/理论/威慑/贿赂/欺骗…+ 打法基调与物用许可勾选）；开战后自动演算（观战/快进/看结果，战中不操作）；结束入处置面板（放走/索取/抓捕/搜身/埋尸…按情境给项） 见 15 §1；暗色场景
秘境 持名额进入秘境格时 限时、负重、收获栏、撤出指引；搜打撤 HUD 独立样式（见 17 第一部分）
仓库 人在驻地/洞府/钱庄/宗门库房 与行囊互转；显示所在地（各地不互通）；被盗风险/门规限制提示；见 16 §7.2
灵宠 更多 灵宠卡片：境界/忠诚/饥饱/技能/月料余量（不足 15/7/3 日三级预警）/（喂食·放归·立契），见 15 §4
功法 更多 所学功法与研读进度、配套术法、丹性倾向提示（只给描述不给数字）
卷宗/札记 更多 真相案卷、自记札记、名录（见 07 §8）
人物 区域中点人 人物页按已知/存疑/未知三态呈现：称谓、相貌、你探出的境界（带置信）、共事得出的性格标签（可点看证据小事）、传言、你与他的关系记忆/可互动项（交谈·打探·赠礼·传书·交手…）；见 07 §6.5
  • 面板切换用侧滑/卷展动画（≤200ms，尊重 prefers-reduced-motion）；
  • 移动端同一时刻只做一件事，避免浮窗叠浮窗。

3.3 ③ 日志卷

  • 默认六格卷次（全部/行迹/天下/此间/交游/势力，2026-09-25 增「行迹」），可横滑；势力卷随身份改名（见 07 §3）；卷次栏右侧有「展开」入口 → 全卷视图：占满界面、顶部检索条（全文搜索/时间·严重度·来源·可信状态筛查/排序），见闻中专名带墨点下划线可点出词条浮卡（见 07 §3.1~3.2）；
  • 虚拟长列表（只渲染可见条目，低配铁律）；新条目从下推入且不打断操作，仅一条淡墨提示；
  • 每条见闻前标时间（"{日}日{时辰}时"，2026-09-25 增）；点击整行展开详情（全文 + 完整时间含年份/节气 + 来源印章 + 相告者），展开后可做行动尾巴（追问/求证/加笺/传书）；
  • 展开/缩回（2026-09-24 改）：见闻顶部一行是箭头按钮——收起态为向上箭头（提示可展开），点击展开（顶到状态卷首之下），展开态为向下箭头，点击缩回；点其他功能自动缩回（仅手机；Pad/PC 常驻）；曾试过把手拖拽，因热区太小、手感差弃用；
  • 流式占位与容器级防错位（2026-09-24 第六批）：收起态不再是 fixed 浮层，而是 shell grid 的正式一行（auto 高）——grid 项物理上不与别处重叠；同时 html/body 封死滚动与橡皮筋（overflow:hidden; overscroll-behavior:none; body position:fixed），滚动只存在于面板内部。早先的 touch-action 隔离法随之作废；
  • 仅「此处」可见（2026-09-24 第六批，仅手机）：见闻只在区域信息页出现；切到修行/行路/行囊等视图，见闻行塌为 0、整页清净。Pad/PC 三栏布局中见闻常驻不变。
  • 凶险/道心异状条目才允许轻微提示音与震动（可关）。

3.4 ④ 底栏（图标必配，2026-09-24 第二次换位修订）

  • 5 槽：此处 · 修行 · 行路 · 行囊 · 更多（48px+ 高，含安全区）；
  • 每槽必须"图标 + 文字"双标（用户要求所有选项都带图标）：统一 22~24px 手绘水墨线性图标（此处=屋舍形、修行=太极气旋、行路=山峦小径、行囊=束口布袋、更多=三道墨痕），文字 10.5px；当前情境（view 命中或更多面板打开）呈"朱印按下"态；
  • 「此处」（2026-09-24 新槽，最左）：进入当前区域信息页——任何界面都可由此回到脚下之地；原顶部「回到此处」返回条因此取消；
  • 闭关归入修行：闭关是修行的一种方式，入口在修行面板内（选定时辰集中吐纳，以本层功行圆满为上限，预览预计增长，功行一满即止、按实际用时上账），底栏不再单设；闭关面板顶部有返回键「返修行处」（2026-09-24 增）；
  • 「见闻」从更多中隐藏：见闻卷靠自身箭头把手展开；待见闻功能做丰富后再放回更多面板；
  • 「更多」面板内每个二级选项同样带图标，面板采用固定标题栏 + 内容滚动（§3.5）；
  • 「更多」打开面板式二级菜单（不全屏跳转）：识海盘、人物名录、灵宠、功法、卷宗、仓库、坊市、势力事务、系统设置；
  • PC/横屏 Pad 左栏「更多」去重与置末（2026-09-25 增）：PC 左栏导航不再把「更多」当普通导航项之一，而是放在左栏最末一枚导航按钮（锁定项之后、主题块之前）；且当左栏在场（视口 ≥1280px）时，「更多」面板只列左栏没摆出的三项（仓库 / 坊市 / 势力事务），避免与左栏导航重复；窄屏（底栏形态）仍列全部 8 项；
  • 区域内行动分两类：采药等"直接去干"的事点下即执行，按钮上标明耗时；修行、坊市、宗门等"去处"只做入口，点击跳到对应界面（右侧 › 提示）。

3.4.1 四区配色：结构靠颜色一眼分开（2026-09-23 用户要求）

绢本水墨基调不变，但四个功能区域必须用明度与底色明确分区，杜绝"一片米色糊在一起"：

区域 底色 边界处理
① 状态卷首 深一档暖绢 #e8dcc2 底部一道浓墨细分隔线 + 线装纸绳纹
② 主视图 最亮纸色 #f6efdd（舞台区） 与上下以留白+细墨线分开；子卡片用 #fbf5e6
③ 见闻卷 暗一档旧纸 #e3d7bd（像夹册旧页） 顶部双线压边，箭头居中；展开半屏时加投影
④ 底栏 近白 #fdf8ec（最亮，按键浮起来） 顶边 1px 墨线；选中朱印
  • 浮层（更多面板/气泡/词条卡）一律 #fbf5e6 + 投影，与主视图拉开层级；
  • 战斗/夜间/入魔场景有独立暗色调（战斗 = 灯下黑褐 #211b15），属于情境换肤而非日常分区；
  • 色值全部进设计令牌，组件内禁止写死。

3.5 弹窗通用结构与长按注释气泡（全局组件）

弹窗固定标题栏（2026-09-24 起通用，三端一致）：所有 sheet = 固定头部（标题+关闭，不参与滚动）+ 仅内容区滚动（技术细节见 10 §5.3）；禁止内容滚动后标题/关闭消失。

行动结果弹窗（2026-09-24 第六批）：采药等直接行动落幕后弹出居中纸卡——标题（如「采药归来」）+ 逐行所获与耗时 +「知道了」收束（按钮 46px 高，遮罩点击亦可关）。结果只作小结，不替代见闻流水；文案全走 i18n（common.result.*）。

长按注释气泡：

  • 触发：手机长按 400ms / Pad、PC 悬停 300ms；作用对象：所有图标按钮、状态条、丹材条目、功法名、地形/律法名词；
  • 气泡内容三种：①名词释义（世界内口吻）②状态来源（"此界律法：村正代管，来自界石碑"）③操作后果（长按"破境"："丹材未齐，强行冲关恐伤丹田"）；
  • 样式：淡墨小笺，宽 ≤240px，出现在触发物上方、不遮操作；带一个小"不再提示此条"（仅当前层级的自动提示，长按永远可用）；
  • 实现：全局指令组件 + 词条 i18n key（tips.*），禁止写死文本。

3.5.1 妖兽遭遇面板（M4 第一段，三端共用全屏模态）

遭遇面板是整屏暗色遮罩 + 居中纸卡（区别于日常纸白底）：战斗是灯下、夜里事，整屏压成暗褐，只留纸卡与字。三端同构（手机/Pad/PC 均为模态，非页面内组件），卡宽 440~480px、最大高 100dvh−24px。

三段结构（组件 CombatEncounter.vue，样式 styles/combat.css）：

  1. 对峙：妖兽名（大字、字距宽）+ 气象一句（beast.*.appear）→ 玩家三气小条（血/气/力）→ 基调三卡横排（猛攻/稳守/游斗，选中描朱边）→ 物用许可两行（enc-permit：符箓 / 丹药各「不动／一份／两份／尽用」四钮，默认尽用，对峙时可改；下附盘上符丹清单一行为照；盘上超限时另附一句朱红警示）→ 底部两键：「抽身走」（素框）、「迎战」（朱底），均 48px 高；脱身失败时卡内出提示「它堵了路」，可再选。
  2. 观战：标题「动手了」+ 战报区（内滚，overscroll-behavior:contain，逐笔 650ms 自动追加，倒地行描朱加粗；符箓丹药介入各落一笔：金甲符卸力、火鸦符附击、服丹回血回灵）→ 底部「快进」「只看结果」两键；组件卸载清放映定时器。状态事件（2026-09-28 增）：战报行内新落中毒 venom／寒侵 chill／灼身 scorch／煞压 dread／坠伤 tick／化解 cleanse／燃血 blood／避煞 bane／龟息 turtle，每类分 ByBeast / ByPlayer 两侧；战斗视图双方各挂状态星（watching.statusLine，显层数与名）。
  3. 处置：结局标题 + 叙述一句；胜利列妖材所得（暗底小笺），战时耗用另起一行（用了哪几件、各几份——战后从盘上扣实，含四味战丹），战败列养伤时辰与折功行；善后三注（2026-09-28 增）：余恙 ailmentNote、燃血代价 bloodNote、龟息遁走 turtleNote；底部大键收束（收拾停当/挣扎起身/继续上路，按结局换字）。

文案全走 i18n（beast.*、combat.*，妖兽素材名走 bag.items.beastHide/beastBone）。

同型面板·切磋（M4 第四段，2026-09-26）：SparPanel.vue 复用同一套 enc-* 类——对峙换分寸三基调（抢攻/守势/游走）与「拆手/作罢」两键；观战同型（650ms 自动放映/快进/只看结果）；赛后为胜/负/平叙述 + 情分小笺 + 赠伤药/讨教一手（各限一次，无药或已赠则灰置）+「拱手别过」收束；入口在宗门院「同门试手」行。战报文案走 combat.spar.*、宗门词条走 sect.mates.*。

3.5.2 剪径匪遭遇面板（M4 第十一段，2026-09-28 增）

同 §3.5.1 的整屏暗色遮罩 + 居中纸卡，复用 enc-* 类（组件 BanditPanel.vue）。触发在荒野（非聚落）行路终点、妖兽判定未过之后；三段式与妖兽遭遇同序——对峙 → 观战放映 → 了结屏（遭遇未闭环不落档，刷新即回滚）：

  1. 对峙：匪之名号与性子一句（寻常匪 / 亡命徒）→ 玩家三气小条 → 买路价一行 → 五钮：讲道理、亮境界、买路（{n} 文）、动手、抽身走；钱不够时「买路」灰置并给注释（不掷 rng、不耗时辰）；「抽身走」失败出「它堵了路」，可再试或动手。
  2. 观战放映：出手或交涉败后转开打，战报区逐笔 650ms 自动追加（同 §3.5.1），底部「快进」「只看结果」两键；交手走收手线 25%（人对人不致死，同切磋口径），三气到线即收。
  3. 了结屏：结局标题 + 叙述一句；胜后善后三选——放走／讨赎金（得赎金文数）／结果了他（v1 仅落行迹，道心与名声代价留后）；败北遭劫屏——列被劫 min(手头钱, 赎金) 与养伤 24 时辰、折功行 20；底部大键收束。

文案走 i18n（combat.bandit.*）。v1 留后（留后，非 bug）：匪战的物用许可与打法基调、处决的道心/名声代价，以及 15 §1.1/15 §1.3 的其余分支。

3.5.3 心魔照见面板（M4 第十二段，2026-09-28 增）

凝液首破的必经一关（设定见 15 §1.6）。同为整屏暗色遮罩 + 居中纸卡、复用 enc-* 类（组件 HeartDemonEncounter.vue），三段式与其余遭遇同序——照见 → 观战放映 → 了结（未闭环不落档）：

  1. 照见：标题 + 心魔名（heartdemon.demonName）+ 引言一句 + 提示一句；下方逐题问答——heartdemon.query.* 出题，两枚按键 认账（青）／嘴硬（朱）（各 ≥48px、两列不重叠），答后该题收进上方历史区（题面 + 认账/嘴硬小签 + 一句回声 heartdemon.echo.*）；题目答毕出现 **「迎战」**朱底大键（heartdemon.engage）。
  2. 观战放映：与 §3.5.1 同壳——双方气血条（心魔 / 玩家，玩家标签走 status.name）+ 战报区逐笔 650ms 自动追加、底部「快进」「只看结果」两键；心魔使伤药那笔文案另写（heartdemon.pillLine，它复刻你盘上之物）。
  3. 了结：胜负标题与叙述（after.victoryTitle/Note 或 defeatTitle/Note）；结算行——认账 n 处、嘴硬 n 处、明（after.mingLine，展示 ming + 胜?1:0）、浊（after.zhuoLine，败时 zhuo + 2，为 0 则隐）、败时存气倒退一行（after.qiLine，常量 HEART_DEMON_DEFEAT_STORE_LOSS）；底部大键收束（after.close）。

文案走 i18n（heartdemon.*）。卡宽 440~480px 自适应，三端同构。

3.6 教学层（剧情式引导）

  • 自由阶段功能首次解锁以遮罩层高亮目标 + 文字卡呈现（步骤表见 14 §7.1）；出身篇内仍是"人物一句话"式点拨；
  • 教学回顾：更多 → 《初学记》一卷，可重看已解锁条目；
  • 每个教学点绑定一个"马上试一下"的安全动作（第一次打开识海盘时盘上预置好木剑，不让玩家空手面对空 UI）。

3.7 人物形象策略

  • MVP：字印 + 差异纹样（姓氏篆印，以边框/底纹/颜色区分身份与正邪观感），对话页左侧小字印，成本极低；
  • 二期：按人物特性（年龄/身份/性情关键词/服饰）生成统一画风的精致立绘/胸像（AI 生图管线：特征描述数据驱动 + 固定风格提示词与参考图保持一致性），需要的工具配置见 11 §4；
  • 无论哪期，形象只做气质指代，不做与文字矛盾的"立绘诈骗"。

3.8 时辰历（ClockSheet，2026-09-25 增）

需求：给玩家一个"时刻/时钟与日历"，点状态卷首的时辰行打开。形态为整屏遮罩 + 纸卡弹层（沿用 §3.5 弹窗结构，ClockSheet.vue）：

  • 此刻：年 / 第几日 / 时辰 / 节气；
  • 时段：晨 / 昼 / 暮 / 夜（phaseOfDay）+ 当前天气；
  • 一日十二时辰环：标出每个时辰所属时段，高亮当前时辰；
  • 眼下时令：季节（season，四季由节气推导）+ 当前节气；
  • 一年二十四节气格：四季淡底区分，高亮当前节气；
  • 岁历：今年已过 N 日，一年共 12 日；
  • 一句说明点题慢节奏："时辰不自己走：你每做一桩事，时候才往前挪"（呼应 01 §4.2）。

3.9 识海盘（DiskSheet，M4 第五/六段，2026-09-26 增改）

炼气七层开阴窍后解锁的装备盘（设定见 15 §2.2），沿用 §3.5 弹窗结构（DiskSheet.vue）：

  • 顶段：神识上限一行（「此盘立得住 12 寸，眼下占了 10 寸。」）+ 占用条（八成转赭、满格朱红）+ 尚余寸数；未生神识时整页只留一句「神识未生。炼气七层开了阴窍，识海里才立得住器物。」；超限时占用条下另起一行朱红警示（.disk-over，明说强装代价：战斗身法受损）；
  • 四栏 tab：法器 / 符箓 / 战丹 / 灵宠——盘上清单（每行：字印 + 名 + 占几寸 + 「卸下」）与「囊中可上盘的」清单；囊中行满则按钮变「强装」（赭色 .action-btn.force，仍可按下，担战斗侧代价），未满为「装盘」；横幅钮「尽数卸下」（按栏尽卸）；
  • 阵势四键：行路 / 闯山 / 斗法 / 空身（各键右缀本套已备件数，含符箓张数与战丹份数；空身不缀），附注一句：四套各记各的盘，空身一按即空；
  • 入口四处：更多面板「识海盘」（未生神识时灰置 + 长按注释）、PC 左栏同名项（七层解锁）、修行面板神识行、「行囊」法器/符箓/战丹分页的「查看识海盘」；行囊分栏同为什物/法器/符箓/战丹四栏，后三栏行内直接有「装盘」（超限则「强装」）；
  • 装盘/卸下/换阵势为配置动作、不耗时辰；超限装盘给行内警示（含战斗侧代价），不弹系统框；盘上符箓丹药按物用许可入战（见 15 §1.2），战耗在善后从盘上扣实；灵宠栏（筑基契约后开）（契约属筑基期，见 15 §4）；法宝主动技待后续。

3.10 修行面板（含「手艺」小节，M4 第十段增）

底栏「修行」页是修行经营的总入口，自上而下：

  • 吐纳：一个时辰一次，涨本层功行；闭关进独立页（顶部「‹ 返修行处」返回键；加减/快捷选时辰，预览功行，上限=本层圆满；功行一满即止、按实际用时上账，见 §3.4）；
  • 炼气层行：层名（三田/三关/三窍）与功行进度；七层起增「神识」行（可点直入识海盘，见 §3.9）；
  • 炼丹段：备料齐则按钮可用（材料不齐按钮即禁）；八层起其下拓「炼器段」（见 §3.2、16 §4）；
  • 「画符」小节（M4 第十一段，2026-09-28 增）：炼气九层中宫·固神开后出现（筑基以上自然可用）；备料齐则按钮可用（符纸/朱砂不齐即禁），一张符 2 时辰；符样两张——火鸦符（符纸×2＋朱砂×1）、金甲符（符纸×1＋朱砂×2）；与炼器同构，只裁成与不成、无随机失败；动手后并入「手艺」小节的画符线（同下规则，见 15 §3.2）；
  • 「手艺」小节（M4 第十段，2026-09-28 增）：列 炼丹 / 炼器 / 采药 / 画符 四线手艺，规则——
    • 只列动过手的手艺（一条都没动过则整节不出现），每行 = 手艺名 + 档位字（生／熟／匠／师／化）+ 一句近况句；
    • 数值距下一档门槛 ≤2 时，该行改显示临档句（"似要摸到「{next}」字的边"，按线各写一句）；
    • 不显示任何数字，也不画进度条——留给玩家的是"手艺到了哪一步"的手感，不是经验值；
    • 文案走 i18n（cultivation.skills.*：name/tier/flavor/near/title）；四线口径详见 15 §3.2。

3.11 筑基增项：御器行路 · 执事受任 · 道心三印（M4 第十二段，2026-09-28 增）

三处增量都不新增数字、不新增面板层级，只在既有界面里按境界进度加一枚按钮或改一处显隐：

  • 行路「御器而往」（地图行程卡，筑基中期解锁）：选中目标格后，路径 1~2 格且已解锁时，在行程卡「再想想」与「抬脚过去」之间插入一枚青边「御器而往」钮（map.fly.label，配长按注释 map.fly.note）；冷却期灰置并显余时（map.fly.cooldown {n}，n = flyCooldownLeft）；未解锁不显示（可长按注释 map.fly.locked）。按钮 ≥48px、与步行钮并列不重叠。
  • 宗门厅「执事」（筑基后期）：月例段内——达标（stewardReady）时出「受任执事」钮（sect.steward.appoint → appointSteward）；已受任改显赭色徽记小笺（sect.steward.badge）；未达标时一句带长按注释（sect.steward.appointLocked）。受任后差事区增一枚「执事差遣」钮（sect.steward.task，配长按注释 sect.steward.taskNote → stewardTask）；月例钮不动。
  • 道心数值模糊化（卷首三印 + 道心页近况）：store.dao{ming,shi,zhuo} 数值入档，界面不露精确数字——卷首三印取阈值显隐（数值 ≥5 才去 faint 显亮，否则留淡印；蚀暂无非零来源仍淡）；道心页节末补一句近况（character.daoxin.recent.bright/muddy/neutral：明≥5 且明>浊 → 明盛；浊≥5 且浊>明 → 浊盛；否则持平）。

文案全走 i18n（map.fly.*、sect.steward.*、character.daoxin.recent.*）；注释词条按本段命名为显式 key（非 tips.*），与 §3.5 的 tips.* 规约并存，待后续统一。

4.5 Pad 竖屏（768~991px，深度定制，不做加宽手机）

768px 的宽度足够双栏，竖屏 Pad 采用固定左右双栏 + 顶栏细状态 + 底部图标 dock：

┌──────────────────────────────────────────────┐
│ 顶栏：名号·境界·三气细条·道心印  时辰天气  [设] │ 52px
├────────────────────────────┬─────────────────┤
│                            │ 见闻卷次行 +展开│
│   主视图（约 60%，440px）   ├─────────────────┤
│   区域/地图/行囊/识海盘…    │ 见闻卷（约40%）  │
│   正文行宽 ≤36em           │ 常驻可滚动       │
│                            │                 │
│                            ├─────────────────┤
│                            │ 在场人物速览     │
├────────────────────────────┴─────────────────┤
│ dock：此处 修行 行路 行囊 更多（图标+文字横排） │ 56px
└──────────────────────────────────────────────┘
  • 主视图打开全屏型面板（全卷检索、识海盘、战斗、对峙/处置面板、人物页）时，右栏自动收起、面板占满，关闭后恢复，不做挤压缩小；
  • 见闻卷默认常驻不折叠（竖屏 Pad 空间够），但可手动收成一条"最新消息"横条，把空间让给地图；
  • 地图视图时右栏自动切为"图例 + 当前格浮卡"（而非日志），进区域再切回——按情境换右栏内容是竖屏 Pad 的核心定制；
  • 最小字号 15px、热区 44px+ 与手机一致；支持 Apple Pencil 悬停出注释气泡（等价长按）。

4. Pad 横屏（双栏）

┌───────────────────────────────────────────────┐
│ 顶栏：名号·状态条         辰时·雨·三月廿一 [设] │
├──────────────────────────┬────────────────────┤
│                          │ 见闻卷次行           │
│   主视图（区域/地图/      │ ─────────────────  │
│   行囊/…，最大行宽38em）  │ · 条目……            │
│                          │ · 条目……            │
│                          ├────────────────────┤
│                          │ 在场人物/子区域速览  │
├──────────────────────────┴────────────────────┤
│ 细 dock：修行·行路·行囊·人物·卷宗·更多（带文字） │
└───────────────────────────────────────────────┘
  • 日志常显不再折叠；人物/子区域做右栏下块；
  • 竖屏 Pad 退回"加宽的手机单栏"，日志仍为底部卷，可拖高。

5. PC 三栏

┌─────────────────────────────────────────────────────────────┐
│ 左上: 名号印+状态     中: 题头(当前地名/视图名)   右: 历法时辰 │
├───────────┬──────────────────────────────┬──────────────────┤
│ 左栏(240) │                              │ 右栏(320)        │
│ 角色摘要   │      主视图（最大 720px 居中） │ 日志（常驻）     │
│ 导航：     │                              │ 卷次 + 时间轴    │
│ 区域/行路  │                              │                  │
│ 行囊/装备  │                              ├──────────────────┤
│ 灵宠/功法  │                              │ 在场人物/快捷动作 │
│ 卷宗/关系  │                              │                  │
│ …末尾「更多」│                             │                  │
├───────────┴──────────────────────────────┴──────────────────┤
│ 全局功能条：闭关快捷 · 时辰快进控件 · 存档状态 · 🔍 号令(Ctrl+K)│
└─────────────────────────────────────────────────────────────┘
  • 左栏「更多」置末（2026-09-25 增）：「更多」不再是普通导航项，而是左栏最末一枚导航按钮（锁定项之后、主题块之前）；左栏在场（≥1280px）时其面板只列仓库/坊市/势力事务三项（与左栏不重的部分），窄屏底栏形态才列全部 8 项（详见 §3.4）；
  • 号令框（Ctrl+K / /）：命令面板，可直达"打坐至午时""查看王货郎""前往青石镇""使用借寿丹"——文字游戏的高级玩法用键盘极快；
  • 键盘：1-6 切见闻卷、M 地图、I 行囊、J/K 上下条、E 互动、空格 推进/确认、Esc 关面板；
  • 悬停出释义（术语/人物首次出现给浮注）；日志可右键（求证/加笺/复制文本）。

6. 信息架构总览（导航树）

状态卷首 → 角色整页（属性/伤势/道心/寿元/因果簿/小传）
主视图
├── 区域：风貌 · 归属律法 · 在场人物 · 子区域 · 可做之事
│            └── 人物页：资料 · 关系记忆 · 互动
├── 行路（地图）：六邻格 · 行程预览 · 图层 · 笺注
├── 修行：吐纳 · 闭关 · 炼丹/炼器/画符（画符九层开，见 §3.10）· 手艺小节（M4 第十段：五档 + 近况/临档句，不示数值，见 §3.10）
├── 行囊 ─ 什物（药材/妖材/矿物/丹药/书册/钱/杂物）/法器/符箓/战丹（搜索/排序/笺注/移仓）
│            └── 识海盘（装备：法器/符箓/战丹/灵宠四栏 + 四阵势，可强装；灵宠栏筑基契约后开，见 §3.9）
│            └── 仓库（人在驻地时）
├── 灵宠
├── 功法（研读/术法）
└── 卷宗（真相案卷/札记/名录）
见闻：全部/行迹/天下/此间/交游/势力（随身份改名）→ 全卷检索/实体词条
更多：识海盘 · 名录 · 灵宠 · 功法 · 卷宗 · 仓库 · 势力事务 · 坊市(情境) · 设置
（闭关在修行内；见闻暂不在更多；PC 左栏在场时「更多」置末且只列仓库/坊市/势力事务三项，见 §3.4；时辰历由状态卷首时辰行打开，见 §3.8）

7. 视觉语言（默认方案，待确认，见 00 §7.9）

  • 基调：旧绢纸 + 墨笔 + 朱砂印信；日间纸色浅暖，夜间"灯下读卷"深褐底（跟随游戏内时辰自动切换，可手动锁定）；
  • 色板（设计令牌，落地为 CSS variables）：
    • 纸：#f3ead8（日）/ #1d1814（夜）；墨：#2b2620 / #d8cbb4；
    • 朱（强调/危险/印信）：#a63d2e；青（正道/可行动）：#3f6f63；赭（官府/异动）：#9a6a36；
    • 金（仙缘，极少用）：#b08d3e；
  • 夜间可读性重排（2026-09-25）：夜主题 :root[data-theme='night'] 令牌整体提亮，解决"夜里看地图与界面费劲"。夜景令牌：paper #221c16 / ink #ece2cf / ink-soft #b3a68d / status #2f2820 / main #292319 / card #372f25 / log #2e261e / nav #3a3126 / line #5c5040 / line-strong #a89778；三色提亮为 zhu #d4614f、qing #6fd9c2、zhe #d99a54。日间主题不动；地图侧同时重排夜间色板（底/平原/林地/丘陵/山地/湿地/水/边山/雾的明度与色相全部拉开，雾更暗以保雾地对比）；
  • 字体：正文 UI 用系统无衬线（system-ui/苹方/微软雅黑）保证小字可读；风貌叙述段可配衬线/楷体感字体（思源宋体等，按需子集化，禁止大体积字体包拖慢首屏）；
  • 符号：地形/资源用程序化 SVG 水墨符号（木、波纹、门阙、云、山）；人物头像用字印（姓氏篆化方块印），重要人物才配淡彩小像（远期 AI 生图）；
  • 边框纹样：细墨线 + 局部云纹/回纹，描金描银一律不用；圆角极小（2~4px），像裁切的纸。

8. 动效与性能

  • 动效仅：面板卷展、日志推入、墨染迷雾揭开、地图格高亮；时长 ≤200ms；
  • 尊重 prefers-reduced-motion；低端机自动降级为无动画（性能档位检测策略沿用旧项目经验）；
  • 日志与所有长列表必须虚拟滚动；地图用 Canvas/SVG 自绘六边形（约 4900 格按视口裁剪渲染，非 DOM 格子）。

9. 无障碍（A11y，文字游戏应做到最好）

  • 语义化标签、完整焦点顺序、键盘可达（PC）；
  • 对比度 ≥4.5:1；色盲友好（状态不只靠颜色：印纹/字形/文字三重冗余）；
  • 屏幕阅读器：日志条目带 aria-live=polite（凶险条目 assertive）；
  • 字号超大档（根字号 +25%/+50%）不破版；
  • 道心幻视内容提供弱化开关（见 07 §7）。

10. 待你在审阅线框图后拍板

  1. 手机底栏 5 槽 两次换位定稿：此处·修行·行路·行囊·更多（2026-09-24，闭关归入修行、见闻暂隐，§3.4）；
  2. 视觉基调 绢本水墨 + 四区配色强分区（§3.4.1）；
  3. 是否要人物淡彩小像（成本项，默认二期 AI 管线）；
  4. 见闻卷默认占比（28vh）与展开手势实测手感 已定：收起态固定高度（箭头+tab+两条），点击箭头展开/缩回，拖拽弃用；
  5. 竖屏 Pad 已定稿深度定制（§4.5）。