/* ============================================================ 第2章 视觉Token —— 变量化；V1.2 已对齐官网VI V1.3：四区=同一生命体的四种进化形态（背景色温暖度递增） V1.4：光之图腾 + 深空母体共鸣 + 广告语居点 + 引导语哲学 + 6项技术修复 V1.5：自由版 —— 广告语哲学对仗 / 冥想高频音 / 光之经纬（去坐标纸感） V3.0：回归内核 —— 以 V1.5 纯Canvas生命体为基座（核心层永远在线，零外部依赖）， 满屏视频降级为「渐进增强」：能播就播，任何失败/1.2s超时静默降级为 V1.5 logo 仪式， 绝不阻塞生命体出现。仪式改单一 ritualPhase 状态机（杜绝 11 布尔互相覆盖）。 ============================================================ */ :root{ --bg: #1A1A1E; --bg-deep: #141418; --void-glow: rgba(201,169,110,.05); --life-gold: #C9A96E; --life-gold-bright: #E8C888; --life-gold-glow: rgba(201,169,110,.45); --pearl: #F5F0E8; --pearl-dim: rgba(245,240,232,.55); --pearl-dim-06: rgba(245,240,232,.33); --glass-bg: rgba(201,169,110,0.04); --glass-border: rgba(201,169,110,0.15); --glass-highlight: rgba(201,169,110,.12); --bio-gradient: linear-gradient(135deg, rgba(201,169,110,.35), rgba(245,240,232,.15), transparent); /* V1.3：四区色温暖度递增（无蓝） */ --zone-shop: rgba(150,150,158,.40); --zone-avatar: rgba(214,170,96,.40); --zone-gaowo: rgba(210,150,70,.45); --zone-awaken: rgba(228,190,120,.50); --font-zh: "PingFang SC","Hiragino Sans GB","Microsoft YaHei",-apple-system,sans-serif; --font-code: "SF Mono", Menlo, Consolas, monospace; } *{ margin:0; padding:0; box-sizing:border-box; } html,body{ width:100%; height:100%; overflow:hidden; background:var(--bg); } body{ font-family:var(--font-zh); color:var(--pearl); -webkit-font-smoothing:antialiased; user-select:none; } /* v1.1.0 UX修复⑥（Q5）：全局禁选但放开对话/文案区——用户能选中复制元神说的话 */ #dialogue, #dialogue *{ user-select:text; -webkit-user-select:text; } #thinkHint, #creed{ user-select:text; -webkit-user-select:text; } .glow-text{ text-shadow:0 0 24px rgba(201,169,110,.15); } #bg{ position:fixed; inset:0; z-index:0; } /* 修正4/校准D：全局极慢呼吸（12s，暖调） */ #breath{ position:fixed; inset:0; z-index:0; pointer-events:none; background:radial-gradient(circle at 50% 45%, rgba(201,169,110,.06), rgba(201,169,110,.02) 50%, transparent 72%); animation:breathPulse 12s ease-in-out infinite; will-change: opacity; } @keyframes breathPulse{ 0%,100%{ opacity:.55; } 50%{ opacity:1; } } #stage{ position:relative; width:100%; height:100%; display:flex; flex-direction:column; } /* ---------- 顶栏（校准A 700；校准E 正版logo） ---------- */ #topbar{ display:flex; align-items:center; justify-content:space-between; padding:22px 32px; opacity:0; transform:translateY(-12px); transition:opacity 1.2s ease, transform 1.2s ease; } #topbar .brand{ display:flex; align-items:center; gap:8px; font-size:20px; font-weight:700; letter-spacing:0.03em; color:var(--life-gold-bright); } /* v8.1（道一 2026-09-08 实测 #1）：logo 显示不全修复—— 原 28×28 固定方框对非正方形构图会裁切/压扁；改为 height 固定 + width auto + 防裁剪 */ #topbar .brand .brand-logo{ height:30px; width:auto; max-width:88px; object-fit:contain; border-radius:50%; box-shadow:0 0 12px rgba(201,169,110,.35); } /* v8.2（道一 2026-09-09 拍板）：广告语=顶栏行内水平居中（左 brand / 右登录按钮之间）， 与底部「元神在线·因果引擎待命」上下呼应。flex:1 + text-align 居中实现，非绝对定位。 */ #topbar .slogan{ flex:1; text-align:center; font-size:14px; font-weight:400; letter-spacing:0.16em; color:rgba(245,240,232,.5); pointer-events:none; white-space:nowrap; transition:opacity 1.4s ease; } /* 开始对话后与对联一致隐去，保持视觉重心 */ body.started #topbar .slogan{ opacity:0; } @media (max-width:768px){ #topbar .slogan{ display:none; } } #center{ position:relative; flex:1; } #nucleusWrap{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); z-index:2; } #nucleus{ display:block; will-change: transform; } /* 校准E：开场正版logo（V3.3：96px 与光球同径；transform 由 JS 逐帧驱动呼吸，不做 CSS transition） */ .ritual-logo{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); z-index:3; height:96px; width:96px; object-fit:contain; opacity:0; pointer-events:none; filter:drop-shadow(0 0 34px rgba(201,169,110,.55)); transition:opacity .3s ease; } .ritual-logo.show{ opacity:1; } .ritual-logo.fade{ opacity:0; } /* V3.0：满屏视频增强层（渐进增强——能播就播，失败绝不阻塞核心） */ .ritual-video-wrap{ position:fixed; left:50%; top:50%; transform:translate(-50%,-50%); width:100vw; height:100vh; z-index:60; opacity:1; pointer-events:none; background:transparent; border-radius:0; overflow:hidden; display:flex; align-items:center; justify-content:center; will-change:width,height,opacity,border-radius,transform; } .ritual-video{ width:100%; height:100%; object-fit:cover; display:block; border:0; } /* V3.2 修复C：柔化贴合边缘——极淡金晕遮罩消除"贴片感" */ .ritual-video-wrap::after{ content:''; position:absolute; inset:0; border-radius:inherit; pointer-events:none; box-shadow:inset 0 0 60px rgba(201,169,110,0.08); } /* 修正3：细胞质流动光带 */ .cyto{ position:absolute; inset:0; overflow:hidden; pointer-events:none; z-index:0; } .cyto .band{ position:absolute; left:-20%; width:140%; height:2px; background:linear-gradient(90deg, transparent, rgba(201,169,110,.5), transparent); filter:blur(2px); opacity:.05; animation:cytoFlow 8s ease-in-out infinite; will-change: transform, opacity; } .cyto .band:nth-child(1){ top:30%; animation-delay:0s; } .cyto .band:nth-child(2){ top:55%; animation-delay:2.6s; } .cyto .band:nth-child(3){ top:75%; animation-delay:5.2s; } @keyframes cytoFlow{ 0%{ transform:translateX(-30%) scaleY(1); opacity:.03; } 50%{ transform:translateX(30%) scaleY(2.6); opacity:.08; } 100%{ transform:translateX(-30%) scaleY(1); opacity:.03; } } /* 四道门（修正6入场；校准A字重400；V1.4 光之图腾） */ .door{ position:absolute; width:44px; height:44px; border-radius:50%; display:flex; flex-direction:column; align-items:center; justify-content:center; backdrop-filter:blur(20px) saturate(1.2); -webkit-backdrop-filter:blur(20px) saturate(1.2); background:var(--glass-bg); border:1px solid var(--glass-border); box-shadow:inset 0 0 30px var(--glass-highlight), 0 0 20px var(--glass-highlight); color:var(--pearl-dim); font-size:12px; font-weight:400; letter-spacing:0.02em; cursor:pointer; opacity:0; z-index:3; transition:box-shadow .6s ease, color .6s ease, transform .25s ease; transform:translate(var(--px,0px), var(--py,0px)); } /* V1.4 优化1：光之图腾——极细香槟金线条 + 微弱脉动光晕（2.5s呼吸） */ .door .ico{ width:20px; height:20px; stroke:var(--life-gold); fill:none; stroke-width:1.0; stroke-linecap:round; stroke-linejoin:round; margin-bottom:2px; filter:drop-shadow(0 0 3px rgba(201,169,110,.40)); animation:totemBreath 2.5s ease-in-out infinite; will-change: filter; } @keyframes totemBreath{ 0%,100%{ filter:drop-shadow(0 0 2px rgba(201,169,110,.30)); } 50%{ filter:drop-shadow(0 0 6px rgba(201,169,110,.55)); } } /* V1.4 优化1：激活时图腾“点亮绽放”（辉光增强 0.6s） */ .door.active .ico{ animation:totemBloom .6s ease forwards; filter:drop-shadow(0 0 11px rgba(201,169,110,.82)); } @keyframes totemBloom{ 0%{ filter:drop-shadow(0 0 3px rgba(201,169,110,.40)); } 100%{ filter:drop-shadow(0 0 13px rgba(201,169,110,.88)); } } .door .label{ line-height:1; opacity:.7; font-size:11px; letter-spacing:0; white-space:nowrap; } .door .sub{ position:absolute; top:100%; left:50%; transform:translateX(-50%); margin-top:7px; font-size:11px; letter-spacing:.08em; color:rgba(201,169,110,.85); background:rgba(26,26,30,.6); border:1px solid rgba(201,168,110,.22); border-radius:10px; padding:3px 9px; opacity:0; pointer-events:none; transition:opacity .35s ease; backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); } .door:hover .sub{ opacity:1; } .door.active{ color:var(--life-gold-bright); box-shadow:inset 0 0 30px rgba(201,169,110,.25), 0 0 28px rgba(201,169,110,.45); } /* 校准B：选中态光带描边（伪元素渐变，圆角安全） */ .door.active::after{ content:''; position:absolute; inset:-1px; border-radius:inherit; padding:1px; background:linear-gradient(180deg, transparent, var(--life-gold), transparent); -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude; pointer-events:none; } #stage.awake .door{ animation:doorIn .6s cubic-bezier(.2,.8,.3,1) both; animation-delay:calc(var(--i,0)*0.1s); } @keyframes doorIn{ 0%{ opacity:0; transform:translate(var(--dx,0px), var(--dy,0px)) scale(.5); } 60%{ opacity:1; } 100%{ opacity:1; transform:translate(0,0) scale(1); } } /* 对话区（校准A正文400/14px） */ #dialogue{ position:absolute; top:58%; left:50%; transform:translate(-50%,0); width:88%; max-width:760px; text-align:center; pointer-events:none; z-index:26; opacity:0; transition:opacity 1.2s ease; } /* V4.1 P1-1：无对话透明、有对话磨砂——自动开合（不再常驻背景块压住深空与文字） */ #dialogue:not(:empty){ background:rgba(26,26,30,.6); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); border:1px solid rgba(201,168,110,.12); border-radius:18px; padding:20px 24px; } #dialogue .msg{ font-size:15px; font-weight:400; letter-spacing:normal; line-height:1.9; color:var(--pearl); text-shadow:0 0 24px rgba(201,169,110,.18); margin:10px 0; opacity:0; animation:msgEmanate .8s ease forwards; } /* ===== v8.4.7 修7（P1）· 窄视口（Android 360×800）中文换行「孤立标点」硬化 ===== 病灶：360px 宽下中文文本会在以下两处漏出标点悬挂—— ① 行首出现收尾标点（。，、！？；：）」』】…）；② 末行只剩一个标点/单字（孤儿行）。 v8.4.4 事B 已把「流式每 token 新建文本节点」改为「同一节点累加」（消除节点边界的断行机会）， 但 CSS 层从未声明中文避头尾规则，窄视口仍可能悬挂 —— 本批补齐。 line-break:strict —— 中文避头尾（收尾标点不落行首）； text-wrap:pretty —— Chrome 117+ 避免孤儿行（末行不止一个标点/单字）； overflow-wrap:anywhere —— 仅对超长无空格串（URL/型号）生效，不参与中文逐字断行。 */ #dialogue .msg, #dialogue .msg .msg-text, #dialogue .dlg-summary, #dialogue .zd-body, #dialogue .ys-md-list li, #dialogue code{ line-break:strict; word-break:normal; overflow-wrap:anywhere; text-wrap:pretty; } @supports not (text-wrap: pretty){ #dialogue .msg, #dialogue .msg .msg-text{ text-wrap:balance; } /* 老引擎退化为均衡断行，同样消孤儿行 */ } @keyframes msgEmanate{ 0%{ opacity:0; transform:translateY(-50px) scale(.9); filter:blur(6px); text-shadow:0 0 40px rgba(201,169,110,.6); } 100%{ opacity:1; transform:none; filter:none; text-shadow:0 0 24px rgba(201,169,110,.18); } } /* v8.3 随喜动线 v2.0：内联随喜/邀请小字——极淡金一行，像一缕烟从对话流底部飘出来。 不是弹窗不是卡；点击文字才开面板，× 关闭永不追。 */ #dialogue .inline-offer{ display:flex; align-items:center; justify-content:center; gap:10px; font-size:13px; letter-spacing:0.06em; margin:10px 0; opacity:0; animation:msgEmanate .9s ease forwards; } #dialogue .inline-offer .io-text{ color:rgba(201,168,110,.55); cursor:pointer; border-bottom:1px solid rgba(201,168,110,.22); padding-bottom:2px; transition:color .3s ease, border-color .3s ease; } #dialogue .inline-offer .io-text:hover{ color:rgba(201,168,110,.85); border-color:rgba(201,168,110,.5); } #dialogue .inline-offer .io-x{ color:rgba(245,240,232,.25); cursor:pointer; font-size:14px; padding:0 4px; transition:color .3s ease; } #dialogue .inline-offer .io-x:hover{ color:rgba(245,240,232,.6); } /* 2026-09-23（真机十问 P7）：「被看见的程度」连续量表——取代「准/不准」二元自动追问。 同一视觉家族（极淡金 · 从流底飘出来）；用户自己拉、默认落上次位置；>50 才算真被看见。 仅照见命中后出现，同会话 ≤3 次（频控在 shell-main.js showSeenSlider 内）。 */ #dialogue .seen-slider{ margin:10px 0; padding:8px 12px; border-radius:10px; background:rgba(201,168,110,.05); border:1px solid rgba(201,168,110,.16); opacity:0; animation:msgEmanate .9s ease forwards; } #dialogue .seen-slider .ss-row{ display:flex; align-items:center; justify-content:space-between; font-size:12.5px; letter-spacing:.05em; margin-bottom:6px; } #dialogue .seen-slider .ss-lab{ color:rgba(245,240,232,.72); white-space:nowrap; } #dialogue .seen-slider .ss-val{ color:#C9A96E; font-weight:600; white-space:nowrap; margin-left:10px; } #dialogue .seen-slider .ss-range{ width:100%; height:20px; margin:0; cursor:pointer; -webkit-appearance:none; appearance:none; background:transparent; } #dialogue .seen-slider .ss-range::-webkit-slider-runnable-track{ height:3px; border-radius:2px; background:linear-gradient(90deg, rgba(201,168,110,.55) 0%, rgba(201,168,110,.18) 100%); } #dialogue .seen-slider .ss-range::-webkit-slider-thumb{ -webkit-appearance:none; appearance:none; width:14px; height:14px; margin-top:-5.5px; border-radius:50%; background:#C9A96E; box-shadow:0 0 10px rgba(201,168,110,.55); } #dialogue .seen-slider .ss-range::-moz-range-track{ height:3px; border-radius:2px; background:linear-gradient(90deg, rgba(201,168,110,.55) 0%, rgba(201,168,110,.18) 100%); } #dialogue .seen-slider .ss-range::-moz-range-thumb{ width:14px; height:14px; border:none; border-radius:50%; background:#C9A96E; box-shadow:0 0 10px rgba(201,168,110,.55); } #dialogue .seen-slider .ss-foot{ display:flex; align-items:center; justify-content:space-between; margin-top:2px; } #dialogue .seen-slider .ss-hint{ color:rgba(245,240,232,.32); font-size:11px; letter-spacing:.04em; } #dialogue .seen-slider .ss-x{ color:rgba(245,240,232,.25); cursor:pointer; font-size:14px; padding:0 4px; transition:color .3s ease; } #dialogue .seen-slider .ss-x:hover{ color:rgba(245,240,232,.6); } /* ---------- V3.7 魂体合一：对话承接层（深空镜面·无框无气泡） ---------- */ /* 对话开启后对话区可滚动并让位真言，光点仍是唯一主角 */ body.talking #dialogue{ max-height:36vh; overflow-y:auto; pointer-events:auto; scrollbar-width:none; -ms-overflow-style:none; -webkit-mask-image:linear-gradient(180deg, transparent 0, #000 14%, #000 86%, transparent 100%); mask-image:linear-gradient(180deg, transparent 0, #000 14%, #000 86%, transparent 100%); } body.talking #dialogue::-webkit-scrollbar{ width:0; height:0; } /* 天枢 2026-08-10：对话控制条（收拢/关闭/新对话）+ 对话区三态 */ /* v8.4 双对话框2.0：窗台条=收拢栏新家——JS(syncSill) 实时锚定输入框上沿上方 6px， 废除 58% 锚点（旧锚点在面板下方留大空洞）。窗台↔输入框间距恒 6px ≤12px（断言 N1）。 */ #dlgBar{ position:absolute; z-index:27; top:auto; bottom:var(--dlg-sill-bottom,96px); left:50%; transform:translateX(-50%); display:flex; gap:18px; padding:5px 16px; border-radius:14px; background:rgba(22,22,26,.55); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); border:1px solid rgba(201,168,110,.18); box-shadow:0 4px 24px rgba(0,0,0,.3); opacity:0; pointer-events:none; transition:opacity .4s ease; } #dlgBar.show{ opacity:1; pointer-events:auto; } #dlgBar span{ font-size:11.5px; letter-spacing:.14em; color:rgba(201,169,110,.75); cursor:pointer; transition:color .25s; /* ★ 2026-09-22 修1b（主人真机「展开二字排列有问题」= 竖排成「展/开」）： #dlgBar 是 flex 行，挤位时子项会被压到 min-content 宽度——「展开」两字因此各占一行。 修法：全部子项 nowrap + 不参与收缩（挤位压力全部交给可省略的 #sillPreview）。 */ white-space:nowrap; flex:0 0 auto; } #dlgBar span:hover{ color:rgba(245,240,232,.95); } #dialogue.closed{ display:none; pointer-events:none; } /* v8.3.4 缺陷4 修复（L4）：collapsed 时面板盒子本身收起（不含摘要卡）—— 根治「画布月牙残影」：旧实现只藏 .msg，磨砂玻璃大盒仍按 ys_dlg_size 巨尺寸占屏。 */ #dialogue.collapsed{ overflow:hidden !important; background:transparent !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important; border-color:transparent !important; box-shadow:none !important; width:auto !important; height:auto !important; max-height:none !important; top:auto !important; bottom:auto !important; left:50% !important; transform:translateX(-50%) !important; padding:0 !important; pointer-events:none; } /* v8.4 事4：收拢态报信永远在窗台——窗台条切换为摘要卡（预览+金点+▴展开）， 面板内旧 .dlg-summary 退位（避免双重报信），唯一报信位=窗台。 */ body.sill-summary #dlgBar{ opacity:1 !important; pointer-events:auto; } body.sill-summary #dlgBar span:not(#dlgCollapse):not(#sillPreview):not(#sillDot){ display:none; } #sillPreview{ display:none; max-width:44vw; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; letter-spacing:.04em; color:rgba(245,240,232,.72); cursor:pointer; } body.sill-summary #sillPreview{ display:block; } #sillDot{ display:none; width:6px; height:6px; border-radius:50%; background:#C9A96E; box-shadow:0 0 8px rgba(201,169,110,.9); flex:0 0 auto; } body.sill-summary #sillDot.lit{ display:block; animation:sillBlink 1.2s ease-in-out infinite; } @keyframes sillBlink{ 0%,100%{ opacity:1; } 50%{ opacity:.25; } } /* 收拢态：面板内旧摘要卡退位（窗台接管报信），collapsed 盒子不再渲染摘要。 ★ 2026-09-22 修1（主人真机「有两个展开浮窗」）：本块原为「新规则 + 旧规则」并存—— 上一条判 display:none、下一条判 display:flex，**同选择器两条 !important，后写的赢** ⇒ 面板内摘要卡照样渲染，与 v8.4 事4「唯一报信位=窗台」正面冲突： 顶部出现面板卡的「▶ 展开」、底部窗台又出现一个「展开」= 双重报信。 处置：删去旧 flex 那条（属 v8.4 事4 之前口径，事4 时忘了删）。 ⚠️ 历史教训：同属性两条 !important 从不相加，只有后者生效——这类「新规则加了、旧规则没删」 必须靠断言守（0-E 断言 A11 已覆盖：两选择器不得同时存在）。 */ #dialogue.collapsed .dlg-summary{ display:none !important; } /* 收拢/关闭态点击窗台预览或「▴ 展开」→ 面板回停靠位弹出（N4 路径） */ #dialogue.collapsed > *{ display:none !important; } /* 工具条/手柄/全部内容藏起（含已退位的旧摘要卡） */ #dialogue.collapsed .msg{ display:none !important; } /* 2026-08-21 收拢摘要卡：收拢时唯一可见，点击展开 */ .dlg-summary{ display:none; align-items:center; gap:10px; cursor:pointer; padding:10px 16px; border-radius:14px; background:rgba(22,22,26,.55); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); border:1px solid rgba(201,168,110,.18); color:var(--pearl-dim); font-size:13px; line-height:1.6; transition:border-color .24s ease, transform .24s ease; } .dlg-summary:hover{ border-color:rgba(201,169,110,.42); transform:translateY(-1px); } .dlg-summary .sm-arrow{ color:#C9A96E; margin-left:auto; flex-shrink:0; font-size:12px; letter-spacing:.1em; white-space:nowrap; } /* ★ 2026-09-22 修1b 同源：防「▶ 展开」在中间空格处折行 */ /* v8.3.4 缺陷6：轻量 markdown 配套（列表/分割线/行内代码）——跟随对话区金色淡雅语言 */ #dialogue .ys-md-list{ margin:6px 0; padding-left:22px; text-align:left; } #dialogue .ys-md-list li{ margin:4px 0; line-height:1.8; } #dialogue .ys-md-hr{ border:none; border-top:1px solid rgba(201,168,110,.22); margin:14px auto; width:96%; } /* ===== v8.4.7 修9（P0）· 回复排版全面重构 ===== 主人真机（全对话最常见体验问题）：「#dialogue 全局 text-align:center → 长文本居中不可读； 无 markdown 渲染 → **星号裸露**；无字号分级 → 全文一个字号；无段落间距 → 文字糊成一团」。 规范（借 ChatGPT/Claude/豆包/DeepSeek 取长 + 深空美学适配）： 对齐=左（长文）/ 短回复(<50字，问候确认类)仍居中｜行高 1.8｜段间距 14px｜ 标题 17px 金｜强调 加粗米白｜正文 15px｜代码 等宽·深底浅字·圆角｜max-width 680px（中文 35~40 字/行）。 */ #dialogue .msg:not(.me){ text-align:left; } /* 长文左对齐——中文居中=反人类 */ #dialogue .msg.ys-short{ text-align:center; } /* 短回复（问候/确认）居中，保留呼吸感 */ #dialogue .msg .msg-text{ display:block; max-width:680px; margin:0 auto; text-align:left; line-height:1.8; } #dialogue .msg.ys-short .msg-text{ text-align:center; } /* 「我说的话」是自己的托付，保持居中窄行——左对齐只针对元神的长回复（别把用户气泡改跑偏） */ #dialogue .msg.me .msg-text{ text-align:center; max-width:none; } #dialogue .msg-text p{ margin:0 0 14px; } #dialogue .msg-text p:last-child{ margin-bottom:0; } #dialogue .ys-md-h{ font-size:17px; font-weight:600; color:var(--life-gold,#C9A96E); margin:14px 0 8px; line-height:1.5; letter-spacing:.01em; } #dialogue .ys-md-h:first-child{ margin-top:0; } #dialogue .msg-text strong{ font-weight:600; color:#F5F0E8; } #dialogue .msg-text em{ font-style:normal; color:#C9A96E; } #dialogue .msg-text code{ font-family:"SF Mono",Menlo,Consolas,monospace; font-size:13px; background:rgba(0,0,0,.42); color:#E3C88C; padding:2px 6px; border-radius:5px; } #dialogue .msg-text pre{ margin:10px 0; padding:12px 14px; border-radius:10px; background:rgba(0,0,0,.45); border:1px solid rgba(201,169,110,.18); overflow-x:auto; } #dialogue .msg-text pre code{ background:none; padding:0; font-size:13px; line-height:1.7; } #dialogue .ys-md-q{ margin:10px 0; padding:6px 0 6px 14px; border-left:2px solid #C9A96E; color:rgba(245,240,232,.82); } #dialogue .msg .ys-table{ max-width:680px; } #dialogue code{ font-family:var(--font-code); font-size:13px; padding:1px 6px; border-radius:6px; background:rgba(22,22,26,.7); border:1px solid rgba(201,168,110,.2); color:rgba(232,196,145,.95); } #dialogue strong{ color:#E8D5B0; font-weight:600; } /* 2026-08-21 第二对话框卡片（zd-card）：标签/钩子/操作三区，玻璃拟态，与 dialogue 同语言 */ .zd-card{ width:min(420px, 92%); margin-left:auto; box-sizing:border-box; background:rgba(20,20,26,.55); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); border:1px solid rgba(201,169,110,.28); border-radius:14px; padding:10px 14px 8px; box-shadow:0 8px 32px rgba(0,0,0,.35); border-top:3px solid transparent; border-image:linear-gradient(90deg,#c9a96e,transparent) 1; opacity:0; transform:translateY(6px); animation:zdIn .24s cubic-bezier(.4,0,.2,1) forwards; } @keyframes zdIn{ to{ opacity:1; transform:translateY(0); } } .zd-label{ font-size:12px; color:rgba(201,169,110,.6); display:flex; justify-content:space-between; align-items:center; letter-spacing:.06em; } .zd-x{ cursor:pointer; color:rgba(245,240,232,.35); font-size:14px; line-height:1; padding:0 2px; transition:color .2s; } .zd-x:hover{ color:rgba(245,240,232,.85); } .zd-body{ font-size:15px; line-height:1.6; color:var(--pearl); text-align:left; margin:6px 0 4px; word-break:break-word; } .zd-body.zone{ font-size:13px; } .zd-actions{ text-align:right; } /* ===== 2026-09-04 裂缝2 修复：天赋四阶工具卡 ===== 觉醒区识别到天赋议题 → 亮出四块砖，点一阶即切高我并带走该阶入口问题。 为什么做成"砖"而不是段落：天枢实证——用户在绽放之境拿到神谕句会满意但不动， 只有看到"下一步是哪一块"才会真的迈步。四块砖 = 把飞轮可视化成可点的选择。 */ .zd-stages{ display:flex; flex-wrap:wrap; gap:6px; margin:8px 0 2px; } .zd-stage{ flex:1 1 calc(50% - 3px); min-width:120px; box-sizing:border-box; cursor:pointer; text-align:left; font-size:13px; line-height:1.45; color:var(--pearl); padding:7px 10px; border-radius:10px; border:1px solid rgba(201,169,110,.3); background:rgba(201,169,110,.07); transition:background .2s, border-color .2s, transform .12s; } .zd-stage:hover{ background:rgba(201,169,110,.16); border-color:rgba(201,169,110,.55); } .zd-stage:active{ transform:scale(.97); } .zd-stage .st-n{ color:rgba(201,169,110,.85); font-size:11px; letter-spacing:.08em; display:block; } /* ===== v1.0.4 批A'·5 额度价值卡 ===== 09-03 版把按钮写成了 ，但**从未定义样式** —— 所谓"醒目升级引导"实际是一行裸文字，用户根本不认为那是按钮。 这里补齐：主按钮香槟金实心（唯一实心，全站最高召唤级），次级描边。 呼吸光晕 3.4s 与中央光点同频；零高饱和，守品牌三色铁律。 */ .zd-card.upgrade{ border-color:rgba(201,169,110,.34); background:linear-gradient(180deg, rgba(201,169,110,.075), rgba(26,26,30,.55)); } .zd-card.upgrade .zd-actions{ display:flex; gap:10px; justify-content:flex-end; align-items:center; flex-wrap:wrap; margin-top:10px; } .zd-upgrade{ display:inline-block; font-size:12.5px; letter-spacing:.06em; cursor:pointer; padding:7px 15px; border-radius:999px; background:linear-gradient(135deg,#D8BC85,#C9A96E); color:#1A1A1E; font-weight:600; border:1px solid rgba(201,169,110,.5); box-shadow:0 0 0 rgba(201,169,110,.34); animation:zdUpBreath 3.4s ease-in-out infinite; transition:transform .2s, filter .2s; } .zd-upgrade:hover{ filter:brightness(1.08); transform:translateY(-1px); } .zd-upgrade:active{ transform:translateY(0); } .zd-upgrade.alt{ background:transparent; color:rgba(201,169,110,.85); font-weight:400; border:1px solid rgba(201,169,110,.28); animation:none; box-shadow:none; } .zd-upgrade.alt:hover{ color:var(--pearl); border-color:rgba(201,169,110,.5); } @keyframes zdUpBreath{ 0%,100%{ box-shadow:0 0 0 0 rgba(201,169,110,.30); } 50%{ box-shadow:0 0 14px 2px rgba(201,169,110,.22); } } @media (prefers-reduced-motion: reduce){ .zd-upgrade{ animation:none; } } .zd-continue{ font-size:12px; color:#C9A96E; cursor:pointer; letter-spacing:.05em; transition:color .2s; } .zd-continue:hover{ color:rgba(245,240,232,.9); } /* v8.3：推演等待卡（.zd-card.wait/.zd-dots）样式已随整卡删除——「推演中」一个字不许出现 */ /* ===== v1.0.4 批A'·6 卡片坞（zdDeck）—— 修 bug#9「卡片点不了」===== 根因（Puppeteer 真实布局引擎实测：45 探测点 / 25 点不到）： 钩子卡·导引卡·价值卡·等待卡原先全部 appendChild 进 #dialogue， 而 body.talking #dialogue{ max-height:36vh; overflow-y:auto; mask-image:上下渐变 } —— 多轮对话后卡片被挤出 36vh 视窗（实测 rect.y=928 > 视口 800）， 且 dlg.scrollTop 归零未滚到底，上下渐变还把边缘蒙成透明； #dialogue.collapsed 更是 overflow:hidden !important 直接裁掉。 结果：卡片"看得见点不到"，连批A'·5 的商业化价值卡都会被一起吞掉。 修法：卡片彻底搬出对话流，改挂本坞——固定在输入区正上方， 永不参与对话滚动、永不被 mask/overflow 裁切、永不随收拢消失。 坞自身 pointer-events:none，空白区不抢四境门的点击。 定位方式（第二版·纯 CSS 锚定）：坞是 #inputbar 的绝对定位子节点， bottom:calc(100% + lift) 把它钉在输入区上沿之上。 为什么不用 JS 量：第一版 position:fixed + JS 算 bottom 在 390x844 实测翻车—— textarea 增高那一帧读到的还是旧 rect，坞反而压到输入框上（deck.bottom 687 > barTop 597）。 测量方案永远在跟时机赛跑；锚定方案让浏览器自己跟随—— 输入框增高、屏幕旋转、软键盘顶起，全部零代码自动正确。 层叠：坞在 #inputbar(z:26) 的层叠上下文内取 z:2，于是天然 盖过 #dialogue(26，DOM 在前)、让位 .zone-panel.show(40) 与 #insightFeedback(44) ——功能面板/对境展开时理应盖住卡片，关掉即恢复可点。 */ #zdDeck{ position:absolute; z-index:2; left:50%; bottom:calc(100% + var(--zd-lift, 8px)); transform:translateX(-50%); width:calc(100% - 8px); max-width:760px; display:flex; flex-direction:column; align-items:flex-end; gap:8px; pointer-events:none; transition:opacity .24s ease; } #zdDeck:empty{ display:none; } #zdDeck .zd-card{ pointer-events:auto; margin-left:0; } /* 额度提示（#quotaHint）也浮在输入区上沿，有字时坞再抬一行，不叠字 */ body.quota-on #zdDeck{ --zd-lift:26px; } /* 界标条「✕ 关闭」= 关闭整段对话语境，卡片一并退场；新消息/新对话自动解除 */ body.zd-hidden #zdDeck{ opacity:0; pointer-events:none; } /* v8.3.3 事5 预判卡让位：卡片在场时给右侧「来路」标志留出呼吸位—— 卡片右缘从输入区右沿左移 60px（=来路钮 46px + 间距），保证来路始终可点、输入框聚焦不被盖。 zd-card 宽度收紧到 calc(100% - 68px)，避免与来路同高重叠。 */ body.zd-layaway #zdDeck{ right:60px; left:auto; transform:none; width:calc(100% - 68px); } /* v8.4 事4：窗台条在输入框上方驻位时，卡片坞整体抬过窗台（高34px+间距12px）， 钩子卡/导引卡不再被窗台盖住。 */ body.sill-docked #zdDeck{ --zd-lift:52px; } body.zd-layaway #zdDeck .zd-card{ max-width:calc(100% - 8px); } /* ===== v8.4.3 K-1 预判卡不挡字（主人拍板：移到右侧空白区） ===== 钩子卡（#hookLine）不再进对话流卡片坞，改挂独立锚 #hookSide： 面板未全宽 → 正方形卡（约240×240）停靠面板右侧空白区中部（垂直居中对齐面板）； 面板全宽/移动端 → 自动落面板下方（窗台上方区域）。两种姿态与面板气泡区零相交（断言 K-1）。 */ #hookSide{ position:absolute; z-index:26; top:0; left:0; width:100%; height:100%; pointer-events:none; opacity:0; transition:opacity .24s ease; } #hookSide.on{ opacity:1; } #hookSide.on .zd-card{ pointer-events:auto; } /* 姿态一：右侧空白区中部——left 由 JS 按面板右缘实测写入（--hook-side-left），垂直居中面板 */ #hookSide.side .zd-card{ position:absolute; top:var(--hook-side-top,50%); left:var(--hook-side-left,74%); transform:translateY(-50%); width:240px; height:240px; display:flex; flex-direction:column; } #hookSide.side .zd-card .zd-body{ flex:1; display:flex; align-items:center; } /* 姿态二：面板下方（窗台上沿）——面板全宽/移动端 */ #hookSide.below .zd-card{ position:absolute; bottom:0; left:50%; transform:translateX(-50%); width:min(420px, 92%); } @media (max-width:520px){ #hookSide.side .zd-card{ position:static; transform:none; width:100%; height:auto; } #hookSide.side{ top:auto; bottom:0; height:auto; } } /* 移动端：卡片放宽到可读极限，间距收紧 */ @media (max-width:520px){ #zdDeck{ gap:6px; } #zdDeck .zd-card{ width:100%; } } /* 气泡复制按钮 */ #dialogue .msg{ position:relative; } /* D4 修复：对话区打开（未关闭）时消息可悬停，否则单条复制按钮在"非 talking"态无法 hover 触发 */ #dialogue:not(.closed) .msg{ pointer-events:auto; } #dialogue .msg .msg-copy{ position:absolute; right:-36px; top:50%; transform:translateY(-50%); width:26px; height:26px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:rgba(201,169,110,.15); border:1px solid rgba(201,169,110,.25); color:var(--life-gold); font-size:12px; opacity:0; pointer-events:none; cursor:pointer; transition:opacity .25s, background .25s; } #dialogue .msg:hover .msg-copy{ opacity:1; pointer-events:auto; } #dialogue .msg .msg-copy:hover{ background:rgba(201,169,110,.35); } body.talking #dialogue .msg .msg-copy{ right:8px; top:-14px; transform:none; } /* V5.3 购物表格化：markdown 表格轻量渲染 */ .ys-table{ margin:10px auto; border-collapse:collapse; font-size:13px; line-height:1.6; color:var(--pearl); background:rgba(26,26,30,.45); border:1px solid rgba(201,169,110,.22); border-radius:10px; overflow:hidden; } .ys-table th, .ys-table td{ padding:7px 12px; border:1px solid rgba(201,169,110,.15); text-align:left; } .ys-table th{ background:rgba(201,169,110,.18); color:var(--life-gold); font-weight:500; } .ys-table tbody tr:nth-child(even){ background:rgba(255,255,255,.04); } .zone-icon{ margin-right:4px; opacity:.9; } /* 真言让位：对话时哲学对仗退为底噪，不与文字争夺注意力 */ body.talking #creed{ opacity:0; transition:opacity 1.2s ease; } body.started #creed{ opacity:0 !important; transition:opacity 1.2s ease; } /* V5.3（2026-08-16·合一）：对话态四门让位 —— 上移+收缩+变淡，为对话区让出空间，绝不遮挡门（高我/元神不再被盖） 注：须同时取消 doorIn 入场动画（fill:both 会锁死 transform/opacity，覆盖本规则） */ body.talking #stage.awake .door{ animation:none; } body.talking .door{ transform:translate(var(--px,0px), calc(var(--py,0px) - 100px)) scale(.78); opacity:.42; transition:box-shadow .6s ease, color .6s ease, transform .55s cubic-bezier(.4,0,.2,1), opacity .55s ease; } body.talking .door:hover{ opacity:1; } body.talking .door .sub{ display:none; } /* V5.3：觉醒卡对话时收缩为呼吸光球（驻中心轨道线；点击恢复觉醒卡） v1.1.0 UX修复④（两光球去重）：对话态 nucleus 本身在呼吸，再叠 awakenOrb 出现两颗金球视觉重复。 去重：不再渲染第二颗球体，改为一条竖向呼吸金线（回归"轨道线"本意），点击区域不变，恢复觉醒卡功能不变。 */ #awakenOrb{ position:fixed; left:50%; top:calc(50% + 15vmin); transform:translate(-50%,-50%); width:2px; height:26px; z-index:28; border-radius:2px; cursor:pointer; pointer-events:none; opacity:0; background:linear-gradient(180deg, transparent, rgba(201,169,110,.85), transparent); box-shadow:0 0 8px rgba(201,169,110,.4); transition:opacity .5s ease; animation:awakenOrbBreath 3s ease-in-out infinite; } #awakenOrb.show{ opacity:1; pointer-events:auto; } @keyframes awakenOrbBreath{ 0%,100%{ transform:translate(-50%,-50%) scaleY(1); opacity:.55; box-shadow:0 0 6px rgba(201,169,110,.3); } 50%{ transform:translate(-50%,-50%) scaleY(1.35); opacity:1; box-shadow:0 0 14px rgba(201,169,110,.6); } } /* 我说的话：更淡、更小，是"托付"；元神说的话：米白带金晕，是"回响" */ #dialogue .msg.me{ font-size:13px; color:var(--pearl-dim-06); text-shadow:none; letter-spacing:.04em; margin:16px 0 6px; opacity:0; animation:msgOffer .6s ease forwards; } /* v1.1.0 能力魔方：agent 执行步骤卡（过程可见——"我真的在干活"） */ #dialogue .agent-step-card{ margin:10px auto 6px; padding:10px 14px; max-width:520px; border:1px solid rgba(201,169,110,.22); border-radius:12px; background:rgba(26,26,30,.55); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); text-align:left; font-size:12px; color:rgba(245,240,232,.75); line-height:1.7; opacity:0; animation:msgOffer .5s ease forwards; } #dialogue .agent-step-card .as-tool{ color:var(--life-gold-bright,#C9A96E); font-size:12.5px; letter-spacing:.05em; margin-bottom:4px; } #dialogue .agent-step-card .as-arg{ color:rgba(245,240,232,.55); word-break:break-all; } #dialogue .agent-step-card .as-plan-step{ padding:2px 0; border-top:1px dashed rgba(201,169,110,.12); } #dialogue .agent-step-card .as-plan-step:first-of-type{ border-top:none; } #dialogue .agent-step-card .as-plan-step b{ color:#C9A96E; margin-right:6px; } #dialogue .agent-step-card.as-result{ border-style:dashed; opacity:.85; } @keyframes msgOffer{ 0%{ opacity:0; transform:translateY(14px); filter:blur(3px); } 100%{ opacity:.62; transform:none; filter:none; } } /* 推演态：核心光点提频呼吸，与魂的 thinking 信号同步 */ body.thinking #nucleusWrap{ animation:thinkPulse 1.15s ease-in-out infinite; } /* P1-2（2026-08-11·合一）：思考态微文案 —— 随 body.thinking 持续可见（LIVE 流式期间不消失） */ #thinkHint{ position:fixed; left:50%; top:calc(50% + 13vmin); transform:translate(-50%,0); z-index:6; font-size:13px; letter-spacing:.18em; color:rgba(201,169,110,.7); opacity:0; pointer-events:none; text-align:center; transition:opacity .4s ease; } body.thinking #thinkHint{ opacity:1; animation:thinkHintPulse 1.4s ease-in-out infinite; } @keyframes thinkHintPulse{ 0%,100%{ opacity:.4; } 50%{ opacity:.85; } } /* v8.4.3 K-4（主人定稿一字不改）：思考期面板内一行极简淡金小字「元神正在照见……」 + 微光点自下而上升起——像光从深处升起，从底下把用户的来路托上来（流向统一）。 */ #dlgThinking{ display:none; align-items:flex-end; gap:9px; padding:4px 6px 10px 14px; font-size:12.5px; letter-spacing:.16em; color:rgba(201,169,110,.66); } body.thinking #dlgThinking{ display:flex; } #dlgThinking .dt-dots{ display:flex; flex-direction:column; gap:5px; align-items:center; padding-bottom:2px; } #dlgThinking .dt-dots i{ width:4px; height:4px; border-radius:50%; background:#C9A96E; opacity:0; animation:dtRise 1.8s ease-in-out infinite; } #dlgThinking .dt-dots i:nth-child(2){ animation-delay:.45s; } #dlgThinking .dt-dots i:nth-child(3){ animation-delay:.9s; } @keyframes dtRise{ 0%{ opacity:0; transform:translateY(8px); } 40%{ opacity:.85; } 100%{ opacity:0; transform:translateY(-10px); } } /* 注意：#nucleusWrap 靠 translate(-50%,-50%) 居中，关键帧必须带上位移否则光点甩出中心 */ @keyframes thinkPulse{ 0%,100%{ transform:translate(-50%,-50%) scale(1); } 50%{ transform:translate(-50%,-50%) scale(1.035); } } /* 语音键待燃料：静默禁用，不欺骗手指 */ #mic.mute{ opacity:.28; cursor:default; pointer-events:none; } /* v8.4.5 主人裁定（2026-09-16）：音色未达标前语音全链路下线 —— 入口整个收起，不留半开的门。 复活：把 YS_VOICE_ENABLED 改为 true（JS 内），本行 CSS 随之失效。 */ body.ys-voice-off #mic{ display:none; } /* v8.4.6 语音换装（2026-09-16 · 主人拍板四声）：设置面板音色选择器 四声：云健(元神主声) / 云扬(分身办事) / 云夏(高我洞见) / 晓晓慢速(备选)。 默认收起（藏而不是堆），点「音色」行才展开 —— 与设置卡整体的「用时才浮现」一致。 */ .fw-voicepick{ display:none; margin:2px 0 8px; padding:5px 6px; border-radius:10px; background:rgba(245,240,232,.028); border:1px solid rgba(245,240,232,.07); } .fw-voicepick.open{ display:block; animation:fvIn .22s ease both; } @keyframes fvIn{ from{ opacity:0; transform:translateY(-3px); } to{ opacity:1; transform:none; } } .fv-item{ display:flex; align-items:center; gap:8px; padding:7px 7px; border-radius:8px; cursor:pointer; transition:background .18s ease, box-shadow .18s ease; } .fv-item:hover{ background:rgba(245,240,232,.05); } .fv-item.on{ background:rgba(201,168,110,.12); box-shadow:inset 0 0 0 1px rgba(201,168,110,.34); } .fv-name{ flex:0 0 auto; font-size:12.5px; color:rgba(245,240,232,.92); } .fv-item.on .fv-name{ color:rgba(232,205,150,.98); font-weight:600; } .fv-tag{ flex:1 1 auto; font-size:11px; color:rgba(245,240,232,.42); letter-spacing:.02em; } .fv-role{ flex:0 0 auto; font-size:10.5px; color:rgba(245,240,232,.34); } .fv-listen{ flex:0 0 auto; cursor:pointer; font-size:11px; padding:2px 9px; border-radius:9px; border:1px solid rgba(245,240,232,.16); background:transparent; color:rgba(245,240,232,.72); font-family:inherit; transition:background .18s ease, border-color .18s ease; } .fv-listen:hover{ background:rgba(201,168,110,.16); border-color:rgba(201,168,110,.55); } .fv-listen:active{ transform:scale(.95); } @media (max-width:400px){ .fv-tag{ display:none; } } /* 窄屏优先保住名字与角色 */ /* ============================================================ V4.1 赋能层：让「省下的时间」变成「理解自己的深度」 三层聚焦法则：任何时刻只呈现 品牌锚点 + 当前任务 + 能量反馈 其余全部折叠，用时才浮现 ============================================================ */ /* ---- 洞察凝滞：世界静止的 0.5 秒 ---- */ /* 这半秒不是特效，是在说：接下来这句话，值得你用心听 */ #freeze{ position:absolute; inset:0; z-index:3; pointer-events:none; opacity:0; background:radial-gradient(circle at 50% 50%, rgba(201,169,110,.06) 0%, rgba(26,26,30,.5) 72%); transition:opacity .5s ease; } body.freezing #freeze{ opacity:1; } body.freezing #dialogue, body.freezing #inputbar{ filter:blur(1.5px); transition:filter .5s ease; } /* 凝滞时光点定住不呼吸——静止本身就是强调 */ body.freezing #nucleusWrap{ animation:none !important; } /* ---- 能量图谱：效率的终点，走心的起点 ---- */ /* 内景（能量流向）：右坞卡片——从右缘滑出，8s 自动滑回 + × + 点外收回（B 交互优化） */ #energyPanel{ position:fixed; right:0; top:10%; transform:translateX(24px); z-index:18; width:min(360px,86vw); padding:24px 24px 20px; border-radius:18px 0 0 18px; background:rgba(26,26,30,.86); border:1px solid rgba(201,168,110,.22); border-right:0; backdrop-filter:blur(26px) saturate(1.15); -webkit-backdrop-filter:blur(26px) saturate(1.15); box-shadow:inset 0 0 40px rgba(201,169,110,.06), -20px 0 60px rgba(0,0,0,.5); opacity:0; pointer-events:none; transition:opacity .7s ease, transform .7s ease; } #energyPanel.show{ opacity:1; transform:translateX(0); pointer-events:auto; } #energyPanel .ep-t{ font-size:15px; font-weight:400; color:var(--life-gold-bright); letter-spacing:.06em; margin-bottom:8px; } #energyPanel .ep-s{ font-size:12px; font-weight:400; color:var(--pearl-dim-06); line-height:1.9; margin-bottom:20px; } #energyPanel .ep-row{ margin:12px 0; } #energyPanel .ep-label{ display:flex; justify-content:space-between; font-size:12px; color:var(--pearl); opacity:.72; margin-bottom:6px; letter-spacing:.03em; } /* 用光带长度表达占比——光承担信息，但不取代按钮 */ #energyPanel .ep-bar{ height:2px; background:rgba(245,240,232,.07); border-radius:2px; overflow:hidden; } #energyPanel .ep-fill{ height:100%; width:0; border-radius:2px; background:linear-gradient(90deg, rgba(201,169,110,.35), var(--life-gold)); box-shadow:0 0 12px rgba(201,169,110,.45); transition:width 1.4s cubic-bezier(.22,1,.36,1); } #energyPanel .ep-insight{ margin-top:22px; padding-top:18px; font-size:13px; line-height:1.95; color:var(--pearl); border-top:1px solid rgba(245,240,232,.07); } #energyPanel .ep-close{ margin-top:18px; text-align:center; font-size:12px; color:var(--pearl-dim-06); cursor:pointer; letter-spacing:.1em; padding:8px; border-radius:14px; transition:color .3s ease, background .3s ease; } #energyPanel .ep-close:hover{ color:var(--life-gold-bright); background:rgba(201,169,110,.05); } /* ---- 禅室（禅修道场）：不解决任何事，只提供一个向内看的地方 ---- */ .ov-title{ font-size:12px; letter-spacing:.2em; color:rgba(201,169,110,.82); text-align:center; margin-bottom:14px; } #zenInvite{ position:fixed; left:50%; bottom:13%; transform:translateX(-50%); z-index:7; font-size:12px; font-weight:400; letter-spacing:.12em; color:var(--pearl-dim-06); cursor:pointer; padding:8px 20px; border-radius:20px; border:1px solid transparent; opacity:0; pointer-events:none; transition:opacity 1.6s ease, color .4s ease, border-color .4s ease; } #zenInvite.show{ opacity:.55; pointer-events:auto; } #zenInvite:hover{ color:var(--life-gold-bright); border-color:rgba(201,169,110,.18); } #zen{ position:fixed; inset:0; z-index:20; background:#141417; display:flex; align-items:center; justify-content:center; flex-direction:column; opacity:0; pointer-events:none; transition:opacity 1.8s ease; } #zen.show{ opacity:1; pointer-events:auto; } /* 禅修里只有一个呼吸的光点。没有文字，没有任务，元神在这里不说话 */ #zenOrb{ width:120px; height:120px; border-radius:50%; background:radial-gradient(circle, rgba(201,169,110,.32) 0%, rgba(201,169,110,.05) 60%, transparent 72%); animation:zenBreath 11s ease-in-out infinite; } @keyframes zenBreath{ 0%,100%{ transform:scale(.72); opacity:.42; } 36%,50%{ transform:scale(1.18); opacity:.92; } 86%{ transform:scale(.72); opacity:.42; } } #zenHint{ margin-top:56px; font-size:12px; letter-spacing:.34em; color:rgba(245,240,232,.16); opacity:0; animation:zenHintIn 3s ease 2.4s forwards; } @keyframes zenHintIn{ to{ opacity:1; } } #zenExit{ position:absolute; bottom:52px; font-size:11px; letter-spacing:.2em; color:rgba(245,240,232,.14); cursor:pointer; padding:10px 18px; transition:color .4s ease; } #zenExit:hover{ color:rgba(245,240,232,.42); } /* ---- P1 觉醒层三体验点（壳侧自包含，按需浮现，不点亮不占屏） ---- */ /* ① 迷茫陪伴入口：不解决迷茫，只陪伴迷茫（仿禅修） */ #lostInvite{ position:fixed; left:50%; bottom:18%; transform:translateX(-50%); z-index:7; font-size:12px; font-weight:400; letter-spacing:.12em; color:var(--pearl-dim-06); cursor:pointer; padding:8px 20px; border-radius:20px; border:1px solid transparent; opacity:0; pointer-events:none; transition:opacity 1.6s ease, color .4s ease, border-color .4s ease; } #lostInvite.show{ opacity:.55; pointer-events:auto; } #lostInvite:hover{ color:var(--life-gold-bright); border-color:rgba(201,169,110,.18); } #lost{ position:fixed; inset:0; z-index:20; background:#141417; display:flex; align-items:center; justify-content:center; flex-direction:column; opacity:0; pointer-events:none; transition:opacity 1.8s ease; } #lost.show{ opacity:1; pointer-events:auto; } #lostOrb{ width:120px; height:120px; border-radius:50%; background:radial-gradient(circle, rgba(201,169,110,.32) 0%, rgba(201,169,110,.05) 60%, transparent 72%); animation:zenBreath 11s ease-in-out infinite; } #lostHint{ margin-top:44px; font-size:13px; line-height:2; letter-spacing:.1em; text-align:center; color:rgba(245,240,232,.34); opacity:0; animation:zenHintIn 3s ease 2.4s forwards; padding:0 32px; } #lostExit{ position:absolute; bottom:52px; font-size:11px; letter-spacing:.2em; color:rgba(245,240,232,.14); cursor:pointer; padding:10px 18px; transition:color .4s ease; } #lostExit:hover{ color:rgba(245,240,232,.42); } /* ② 东坡时刻推送：逆境中，一个千年之前的灵魂为你鼓掌（玻璃拟态） */ #dongpo{ position:fixed; left:50%; bottom:16%; transform:translateX(-50%); z-index:8; width:min(420px,86vw); opacity:0; pointer-events:none; transition:opacity 1.4s ease; } #dongpo.show{ opacity:1; pointer-events:auto; } #dongpoCard{ background:rgba(26,26,30,.72); backdrop-filter:blur(22px); -webkit-backdrop-filter:blur(22px); border:1px solid rgba(201,169,110,.26); border-radius:18px; padding:22px 24px 18px; box-shadow:0 18px 60px rgba(0,0,0,.5); } #dongpoCard .dp-quote{ font-size:15px; line-height:1.9; color:var(--life-gold-bright); font-style:italic; } #dongpoCard .dp-from{ margin-top:12px; font-size:11px; letter-spacing:.18em; color:rgba(245,240,232,.38); text-align:right; } #dongpoCard .dp-close{ margin-top:14px; font-size:11px; letter-spacing:.2em; color:rgba(245,240,232,.22); cursor:pointer; text-align:right; transition:color .4s ease; } #dongpoCard .dp-close:hover{ color:var(--life-gold-bright); } /* ③ 天赋确认仪式：不立刻给方案，先帮你看见自己本有的光（星点亮 + 颂钵末音） */ #giftRite{ position:fixed; inset:0; z-index:45; background:rgba(10,10,12,.92); display:flex; align-items:center; justify-content:center; flex-direction:column; opacity:0; pointer-events:none; transition:opacity 1.2s ease; } #giftRite.show{ opacity:1; pointer-events:auto; } #giftStar{ position:relative; width:140px; height:140px; border-radius:50%; display:flex; align-items:center; justify-content:center; } #giftStar .star{ font-size:54px; color:rgba(201,169,110,0); transition:color .9s ease, text-shadow .9s ease; } #giftRite.lit #giftStar .star{ color:var(--life-gold-bright); text-shadow:0 0 40px rgba(201,169,110,.8); } #giftStar .ring{ position:absolute; width:120px; height:120px; border-radius:50%; border:1px solid rgba(201,169,110,0); transition:border-color .9s ease, transform .9s ease; } #giftRite.lit #giftStar .ring{ border-color:rgba(201,169,110,.7); transform:scale(1.25); } #giftRite .gift-word{ margin-top:30px; font-size:13px; letter-spacing:.24em; color:rgba(245,240,232,.4); opacity:0; transition:opacity 1s ease; padding:0 28px; text-align:center; } #giftRite.lit .gift-word{ opacity:1; } #giftRite .gift-exit{ position:absolute; bottom:54px; font-size:11px; letter-spacing:.2em; color:rgba(245,240,232,.2); cursor:pointer; padding:10px 18px; transition:color .4s ease; } #giftRite .gift-exit:hover{ color:rgba(245,240,232,.46); } /* ---- 关系锚：我们认识多久了（极淡常驻，关系资产的可视化） ---- v8.1（道一 2026-09-08 实测 #7）：移到「元神在线·因果引擎待命」正下方居中，字号更小更淡 */ #relAnchor{ position:fixed; left:50%; bottom:2px; transform:translateX(-50%); z-index:6; font-size:10px; letter-spacing:.08em; color:rgba(245,240,232,.10); opacity:0; transition:opacity 1.6s ease; text-align:center; } #relAnchor.show{ opacity:1; } /* ---------- 输入区 ---------- */ #inputbar{ display:flex; align-items:center; justify-content:center; gap:10px; padding:18px 24px 8px; opacity:0; transform:translateY(12px); transition:opacity 1.2s ease, transform 1.2s ease; position:relative; z-index:26; pointer-events:none; } #mic{ width:46px; height:46px; border-radius:50%; flex:0 0 auto; border:1px solid var(--glass-border); pointer-events:auto; background:var(--glass-bg); backdrop-filter:blur(20px) saturate(1.2); -webkit-backdrop-filter:blur(20px) saturate(1.2); color:var(--life-gold-bright); cursor:pointer; box-shadow:inset 0 0 20px var(--glass-highlight); display:flex; align-items:center; justify-content:center; transition:box-shadow .4s ease, transform .2s ease; } #mic .ico{ width:22px; height:22px; stroke:var(--life-gold-bright); fill:none; stroke-width:1.2; stroke-linecap:round; stroke-linejoin:round; } #mic:active{ transform:scale(.94); box-shadow:inset 0 0 26px rgba(201,169,110,.3), 0 0 24px rgba(201,169,110,.4); } /* 2026-09-23（真机十问 P5）：静音可见标志 —— 关闭朗读后，麦克风上叠一条斜杠并整体去饱和， 无需打开设置就能一眼看出「当前不出声」（天枢 P5 判据②）。class 由 shell-main.js 的 voiceRefreshSetting() 按 Voice.ttsOn 同步（body.ys-muted）。 */ body.ys-muted #mic{ position:relative; } body.ys-muted #mic .ico{ opacity:.4; } body.ys-muted #mic::after{ content:''; position:absolute; left:50%; top:50%; width:28px; height:1.5px; background:rgba(245,240,232,.45); border-radius:2px; transform:translate(-50%,-50%) rotate(-45deg); pointer-events:none; } /* v8.4.4 事C（W1 事8）：麦克风三态 —— ① 按住说话(listening) ② 松手发送中(v-sending) ③ 朗读中(speaking，点按=停止) */ #mic.listening{ border-color:rgba(232,176,75,.85); animation:micListen 1.2s ease-in-out infinite; } @keyframes micListen{ 0%,100%{ box-shadow:inset 0 0 20px var(--glass-highlight), 0 0 0 2px rgba(232,176,75,.22), 0 0 12px rgba(232,176,75,.3); } 50%{ box-shadow:inset 0 0 20px var(--glass-highlight), 0 0 0 4px rgba(232,176,75,.34), 0 0 26px rgba(232,176,75,.6); } } #mic.v-sending{ border-color:rgba(201,168,110,.55); opacity:.72; } #mic.speaking{ border-color:rgba(232,176,75,.7); box-shadow:inset 0 0 20px var(--glass-highlight), 0 0 18px rgba(232,176,75,.35); } #mic.speaking .ico{ stroke:#E8B04B; } #text{ flex:1; max-width:440px; min-height:46px; max-height:140px; height:46px; padding:12px 20px; border-radius:24px; pointer-events:auto; resize:none; overflow-y:auto; border:1px solid var(--glass-border); background:var(--glass-bg); backdrop-filter:blur(20px) saturate(1.2); -webkit-backdrop-filter:blur(20px) saturate(1.2); color:var(--pearl); font-family:var(--font-zh); font-size:15px; font-weight:400; line-height:1.5; box-shadow:inset 0 0 24px var(--glass-highlight); outline:none; } #text::-webkit-scrollbar{ width:0; height:0; } #quotaHint{ position:absolute; left:50%; top:-4px; transform:translate(-50%,-100%); font-size:11px; letter-spacing:.08em; color:rgba(201,169,110,.7); pointer-events:none; white-space:nowrap; z-index:27; } #quotaHint.warn{ color:#E8B04B; } #text::placeholder{ color:rgba(245,240,232,.3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } /* ---------- v8.3.3 「来路」标志（道一钦定名，主人设计稿逐字实现） ---------- 一条极细金色弧线从右下向左上扬=一路向上；弧线上光点越往左越淡=时间沉淀。 不叫「历史记录」——用户点开它，是看自己怎么走到今天（与命座成对：命座看模式，来路看过程）。 */ #lailu{ position:relative; width:46px; height:46px; border-radius:50%; flex:0 0 auto; pointer-events:auto; border:1px solid var(--glass-border); background:var(--glass-bg); backdrop-filter:blur(20px) saturate(1.2); -webkit-backdrop-filter:blur(20px) saturate(1.2); cursor:pointer; box-shadow:inset 0 0 20px var(--glass-highlight); padding:0; display:flex; align-items:center; justify-content:center; transition:box-shadow .4s ease, transform .2s ease; } #lailu:active{ transform:scale(.94); box-shadow:inset 0 0 26px rgba(201,169,110,.3), 0 0 24px rgba(201,169,110,.4); } #lailu .ico{ width:24px; height:24px; stroke:var(--life-gold-bright); fill:none; stroke-width:1.2; stroke-linecap:round; } #lailu .dot{ fill:var(--life-gold-bright); stroke:none; } #lailu .lp-unread{ position:absolute; top:9px; right:9px; width:7px; height:7px; border-radius:50%; background:#E8B04B; opacity:0; pointer-events:none; transition:opacity .3s ease; } #lailu.lp-lit .lp-unread{ opacity:1; animation:lailuPulse 1.6s ease-in-out infinite; } @keyframes lailuPulse{ 0%,100%{ box-shadow:0 0 0 0 rgba(232,176,75,.5); } 50%{ box-shadow:0 0 8px 2px rgba(232,176,75,.45); } } /* W2/B-7（2026-09-21 · 主人令「来路合并」）：左侧「楼梯式」轮次短横条—— 一条=一轮，越靠下越新、越长（楼梯感）；点击即平滑跳到该轮。窄视口（≤520px）不显示，避免压住全宽面板。 */ #lailuSteps{ position:fixed; left:16px; top:50%; transform:translateY(-50%); z-index:25; display:none; flex-direction:column; align-items:flex-start; gap:7px; padding:10px 9px; border-radius:12px; background:rgba(22,22,26,.55); border:1px solid rgba(201,169,110,.16); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); } #lailuSteps.on{ display:flex; animation:fvIn .22s ease both; } #lailuSteps .lb{ font-size:9.5px; letter-spacing:.16em; color:rgba(201,169,110,.72); margin-bottom:1px; } #lailuSteps i{ display:block; height:2.5px; border-radius:2px; background:rgba(201,169,110,.38); cursor:pointer; transition:background .18s ease, box-shadow .18s ease; } #lailuSteps i:hover{ background:rgba(232,200,136,.95); box-shadow:0 0 8px rgba(201,169,110,.5); } #lailuSteps i.cur{ background:rgba(232,200,136,.98); box-shadow:0 0 10px rgba(201,169,110,.55); } /* ---------- v8.3.3 事6 发送/停止键（道一增补指令） ---------- 待发态：有字时亮起（金色纸飞机）；空/输入法组合中=暗置。 流式态：变停止键（■），点击中断回复，已收文本即终稿。 */ #sendBtn{ position:relative; width:46px; height:46px; border-radius:50%; flex:0 0 auto; pointer-events:auto; border:1px solid var(--glass-border); background:var(--glass-bg); backdrop-filter:blur(20px) saturate(1.2); -webkit-backdrop-filter:blur(20px) saturate(1.2); cursor:pointer; box-shadow:inset 0 0 20px var(--glass-highlight); padding:0; display:flex; align-items:center; justify-content:center; transition:box-shadow .4s ease, transform .2s ease, opacity .3s ease, border-color .3s ease; } #sendBtn .ico{ width:20px; height:20px; fill:var(--life-gold-bright); stroke:none; } #sendBtn .ico-stop{ fill:#E8B04B; } #sendBtn:active{ transform:scale(.94); } #sendBtn:disabled{ opacity:.32; cursor:default; } #sendBtn:disabled:active{ transform:none; } #sendBtn[data-mode="stop"]{ border-color:rgba(232,176,75,.45); box-shadow:inset 0 0 22px rgba(232,176,75,.22), 0 0 16px rgba(232,176,75,.28); } /* ---------- v8.3.3 可伸缩对话面板（事4 · 从 v8.3.2 平移） ---------- 右下角拖拽手柄 + 四档快捷（小/中/大/全屏）+ localStorage 记忆；移动端只留 小/全屏。 v8.4.2 M-C（拉角无响应）：命中区 16px 太小且右下 2px 被圆角裁掉——扩到 28px 贴角 + touch-action:none；视觉 svg 不变（12px 右下对齐）；z-index 提到 9 压过气泡与摘要卡。 */ #dlgResize{ position:absolute; right:0; bottom:0; width:28px; height:28px; cursor:nwse-resize; z-index:9; touch-action:none; display:flex; align-items:flex-end; justify-content:flex-end; padding:0 3px 3px 0; opacity:.35; transition:opacity .3s ease; pointer-events:auto; } #dlgResize:hover{ opacity:.8; } #dlgResize svg{ width:12px; height:12px; stroke:var(--life-gold-bright,#C9A96E); stroke-width:1.4; fill:none; stroke-linecap:round; } #dlgSizeBar{ position:absolute; top:6px; right:6px; display:none; gap:8px; z-index:3; font-size:11px; letter-spacing:.1em; color:rgba(201,169,110,.75); cursor:pointer; } #dialogue.size-tuning #dlgSizeBar{ display:flex; } #dlgSizeBar span{ padding:3px 9px; border-radius:9px; background:rgba(22,22,26,.75); border:1px solid rgba(201,168,110,.18); transition:color .25s, border-color .25s; pointer-events:auto; } #dlgSizeBar span:hover{ color:rgba(245,240,232,.95); border-color:rgba(201,168,110,.5); } /* v8.4.4 事A2 修复（P0）：free-win 态拉角失灵 —— 真因②=圆角裁切死区。 #dialogue 有 border-radius:18px + overflow-y:auto（裁剪到内边距盒）， 右下角最外 ~5px 对角线区域落在圆角弧外被裁掉 → 在该处按下命中的是 #center， grip 收不到 pointerdown →「拖右下角 -5px 内纹丝不动」（停靠态因采样点更靠内而偶然可用）。 修法：#dlgGripShield —— 挂在 #center 下的【不被面板裁剪】的角部命中盾， 由 JS(__dlgSyncGrip) 钉在面板可视右下角；与 #dlgResize 共用同一段缩放逻辑。 */ #dlgGripShield{ position:absolute; width:36px; height:36px; z-index:30; display:none; cursor:nwse-resize; touch-action:none; background:transparent; } body.dlg-grip-on #dlgGripShield{ display:block; } /* v8.4.4 事A3：两态切换（阅读位 ⇄ 工作位）全量动画过渡——仅切换瞬间挂 .dlg-anim， 拖拽/拉角期间不挂（避免手感延迟）。 */ #dialogue.resizable.dlg-anim{ transition:left .3s cubic-bezier(.22,.8,.24,1), top .3s cubic-bezier(.22,.8,.24,1), width .3s cubic-bezier(.22,.8,.24,1), height .3s cubic-bezier(.22,.8,.24,1), opacity .3s ease; } /* v8.3.4 缺陷1/2 修复（L1/L2）：恢复滚动容器语义—— v8.3.3 的 max-height:none 让面板初始无高度约束，容器随内容无限增高， scrollHeight===clientHeight 恒成立（不可滚、气泡堆叠），且面板向下生长盖住输入区。 修法：resizable 面板高度恒由 dlgApplySize/拖拽显式设定（inline height）， max-height 只做保险丝（86vh），overflow-y:auto 恢复滚动；面板一律向上生长 （bottom 锚点），永不下探盖输入区；collapsed 时盒子本身也收起（缺陷4 残影根治）。 */ /* v8.4 事1：停靠位重定义（填满真空）——面板 bottom = 窗台条顶边(变量) + 2px， top = 顶栏底 + 12px（变量由 JS 顶栏实测写入），高度=可用区填满； 58% 锚点与 bottom:132px 旧模型废除（大空洞根治）。三层矩形零相交（断言 N1）。 */ #dialogue.resizable{ resize:none; overflow-y:auto; max-height:86vh; max-width:96vw; top:var(--dlg-dock-top,96px); bottom:var(--dlg-panel-bottom,98px); left:50%; transform:translateX(-50%); height:auto; } /* v8.4：talking 态 36vh 旧上限对停靠面板失效——高度由 dock 变量全权接管（填满可用区） */ body.talking #dialogue.resizable{ max-height:none; } /* v8.4 事2：自由窗模式——面板被拖走后不再走停靠位锚点，改为 left/top 双坐标自由定位。 */ #dialogue.resizable.free-win{ top:var(--dlg-free-top,auto); bottom:auto; } /* v8.4 事2：顶部把手带（高32px，含「来路」微标）——按住=整窗拖动；sticky 置顶不随内容滚走。 */ #dlgHandle{ position:sticky; top:0; z-index:8; height:32px; flex:0 0 auto; display:flex; align-items:center; gap:8px; padding:0 14px; margin:-20px -24px 12px; cursor:grab; user-select:none; -webkit-user-select:none; touch-action:none; border-radius:17px 17px 0 0; /* v8.4.4 事A1 修复（P0）：#dialogue 基础态 pointer-events:none（仅 body.talking 时 auto）， 把手此前【没有】显式改回 auto → 继承 none → 空闲态（刷新后恢复自由窗 / 会话结束） 整个把手不可命中：按住拖不动、双击归位完全无效（cls 恒 free-win、位置不归）。 修法：把手显式 pointer-events:auto（与 #dlgResize/.hg-btn/#mic 同一套「父 none 子 auto」范式）。 */ pointer-events:auto; background:rgba(22,22,26,.72); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); border-bottom:1px solid rgba(201,168,110,.22); } #dlgHandle:active{ cursor:grabbing; } #dlgHandle .hg-title{ font-size:11px; letter-spacing:.18em; color:rgba(201,169,110,.85); pointer-events:none; } /* v8.4.3 K-3：删除右上三个装饰点（hg-dots 被误认为操作菜单且点不了）； 「双击归位」提示升级为可单击真按钮「归位」（样式与窗台钮统一语言） */ #dlgHandle .hg-btn{ margin-left:auto; font-size:10.5px; letter-spacing:.12em; color:rgba(201,169,110,.8); background:rgba(201,168,110,.10); border:1px solid rgba(201,168,110,.32); border-radius:999px; padding:2px 10px; cursor:pointer; pointer-events:auto; transition:color .2s, border-color .2s, background .2s; } #dlgHandle .hg-btn:hover{ color:rgba(245,240,232,.95); border-color:rgba(201,168,110,.6); background:rgba(201,168,110,.2); } body.free-win #dialogue #dlgHandle{ border-radius:0 12px 0 0; } #dialogue.resizable::-webkit-scrollbar{ width:0; height:0; } /* 校准B：高亮态光带描边 */ #text:focus{ border-image:linear-gradient(180deg, transparent, var(--life-gold), transparent); border-image-slice:1; box-shadow:inset 0 0 24px var(--glass-highlight), 0 0 18px rgba(201,169,110,.25); } /* P0-2（2026-08-19·道一）：思考中输入框禁用 + 呼吸金边 —— 真模型首字延迟期间防连按回车，给明确呼吸反馈 */ #text:disabled{ opacity:.55; cursor:not-allowed; } #inputbar.thinking #text{ border-color:rgba(201,169,110,.85); animation:inputBreath 1.5s ease-in-out infinite; } @keyframes inputBreath{ 0%,100%{ box-shadow:inset 0 0 24px var(--glass-highlight), 0 0 10px rgba(201,169,110,.35); } 50%{ box-shadow:inset 0 0 24px var(--glass-highlight), 0 0 22px rgba(201,169,110,.7); } } /* ---------- 心锚（校准A 400/12px/0.6透） ---------- */ #heart{ text-align:center; padding:6px 0 18px; font-size:12px; font-weight:400; letter-spacing:0.02em; color:var(--pearl-dim-06); opacity:0; transition:opacity 1.4s ease; } /* v8.1（道一 2026-09-08 实测 #2）：版本号不再 fixed 悬浮右下（与交付把手重叠）， 改为隐藏元素——版本信息收入星枢设置二级，有新版本时由 JS 点亮「有新版本」提示。 */ #demoTag{ display:none !important; } #demoTag.newver{ display:block !important; position:fixed; right:14px; bottom:12px; z-index:5; font-size:11px; font-weight:400; letter-spacing:1px; color:rgba(201,168,110,.7); cursor:pointer; padding:4px 8px; border-radius:10px; } #demoTag.newver:hover{ color:rgba(201,168,110,1); } .beta-badge{ display:inline-block; margin-left:8px; padding:1px 7px; font-size:10px; letter-spacing:.12em; color:rgba(201,168,110,.85); border:1px solid rgba(201,168,110,.4); border-radius:8px; vertical-align:middle; } .bd-hint{ display:block; margin-top:6px; color:rgba(201,168,110,.82); font-size:11px; line-height:1.5; } /* ---------- 半隐藏悬浮窗（设置板块 / 交付区 · 智多星式悬浮窗借鉴） ---------- */ .fw-handle{ position:fixed; z-index:15; display:flex; align-items:center; gap:7px; padding:7px 13px; border-radius:22px; cursor:pointer; user-select:none; font-size:12px; letter-spacing:.1em; color:rgba(245,240,232,.5); background:rgba(26,26,30,.42); border:1px solid rgba(201,168,110,.18); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); opacity:.3; transition:opacity .5s ease, transform .35s ease, border-color .5s ease, box-shadow .5s ease; } .fw-handle:hover{ opacity:1; border-color:rgba(201,168,110,.5); box-shadow:0 0 22px rgba(201,168,110,.22); } .fw-handle .dot{ width:7px; height:7px; border-radius:50%; background:radial-gradient(circle, #C9A96E 0%, rgba(201,168,110,.25) 70%); box-shadow:0 0 10px rgba(201,168,110,.6); animation:fwBreath 3.4s ease-in-out infinite; } @keyframes fwBreath{ 0%,100%{ transform:scale(1); opacity:.7; } 50%{ transform:scale(1.45); opacity:1; } } /* v8.0（2026-09-09 道一定稿收口）：设置=左下角小图标 · 交付=右下角图标（对角布局，形态统一） */ #setHandle{ left:16px; bottom:18px; top:auto; right:auto; } #deliHandle{ right:16px; bottom:18px; top:auto; left:auto; } /* cornerDock 容器：仅占位语义，子项各自 fixed 定位（不挡输入框/对话流） */ #cornerDock{ position:static; pointer-events:none; } #cornerDock .corner-handle{ pointer-events:auto; } /* v8.0 小图标形态：图标+文字标签，hover 由 .3 显至 1（沿用 fw-handle 呼吸光点） */ .corner-handle{ padding:7px 11px; border-radius:18px; } .corner-handle .ch-ico{ font-size:15px; line-height:1; color:rgba(201,168,110,.85); } .corner-handle .ch-label{ font-size:11px; letter-spacing:.12em; color:rgba(245,240,232,.55); } .corner-handle:hover .ch-label{ color:rgba(245,240,232,.9); } /* v8.0 交付金点：有新交付物时点亮（默认熄灭为暗核，JS 加 .lit 类触发金光呼吸） */ #deliGold{ background:radial-gradient(circle, rgba(201,168,110,.28) 0%, rgba(201,168,110,.08) 70%); box-shadow:none; animation:none; opacity:.5; } #deliGold.lit{ background:radial-gradient(circle, #C9A96E 0%, rgba(201,168,110,.25) 70%); box-shadow:0 0 12px rgba(201,168,110,.75); animation:fwBreath 2.6s ease-in-out infinite; opacity:1; } .fw-card{ /* W2/B-4（2026-09-21）：原 z-index:16 → 30。病灶：#dialogue 与 #hookSide 均为 26， 设置/锦囊卡片被对话区与预判卡压住（主人实测「打开设置看不到全部」）。 层级表（勿再退回）：对话区/预判锚/输入条 26~27 ｜ 星枢·锦囊 30 ｜ 区域面板 40 ｜ 临在·纠偏 42~45 ｜ 弹窗 55~60 */ position:fixed; z-index:30; width:296px; max-width:84vw; padding:16px 18px 14px; border-radius:18px; color:var(--pearl,#F5F0E8); background:rgba(22,22,26,.8); border:1px solid rgba(201,168,110,.22); -webkit-backdrop-filter:blur(22px); backdrop-filter:blur(22px); box-shadow:0 18px 60px rgba(0,0,0,.55); opacity:0; pointer-events:none; transform:translateY(8px) scale(.98); transition:opacity .42s ease, transform .42s ease; /* 2026-09-08 道一实测修复（#363-②）：卡片超出视口底部=内容看不完。 限高 62vh + 内部滚动，矮屏/长内容（星枢设置、锦囊清单）全部可达。 */ max-height:62vh; overflow-y:auto; -webkit-overflow-scrolling:touch; scrollbar-width:thin; scrollbar-color:rgba(201,168,110,.35) transparent; } .fw-card::-webkit-scrollbar{ width:5px; } .fw-card::-webkit-scrollbar-thumb{ background:rgba(201,168,110,.35); border-radius:3px; } .fw-card.open{ opacity:1; pointer-events:auto; transform:translateY(0) scale(1); } /* v8.0 抽屉态：交付卡从右侧滑入（translateX 抽屉动效） */ #deliCard{ transform:translateX(24px) scale(.98); } #deliCard.open{ transform:translateX(0) scale(1); } #setCard{ left:16px; bottom:calc(18px + 46px); top:auto; transform-origin:bottom left; } /* 交付卡（v8.0 抽屉化）：右下把手触发 · 从右侧滑出抽屉 */ #deliCard{ right:16px; bottom:calc(18px + 46px); top:auto; left:auto; transform-origin:bottom right; } /* ---------- 外斋（右坞·向外求证）/ 内府（左坞·向内探索）：常驻收纳光点（命名体系·两坞落地，道一定稿映射） ---------- */ #neiFu, #waiZhai{ position:fixed; top:50%; transform:translateY(-50%); z-index:14; display:flex; flex-direction:column; gap:20px; padding:14px 7px; pointer-events:none; } #neiFu{ right:0; align-items:flex-end; } #waiZhai{ left:0; align-items:flex-start; } /* V5.2 线A：外斋一览聚合浮层（四镜归一网格） */ .wz-card{ width:300px; } .wz-grid{ display:grid; grid-template-columns:1fr 1fr; gap:10px; padding:6px 2px 10px; } .wz-cell{ display:flex; flex-direction:column; align-items:center; gap:4px; padding:14px 8px; border-radius:14px; cursor:pointer; background:rgba(245,240,232,.05); border:1px solid rgba(201,168,110,.18); transition:background .2s ease, transform .2s ease, border-color .2s ease; } .wz-cell:hover{ background:rgba(201,169,110,.12); transform:translateY(-2px); border-color:rgba(201,168,110,.42); } .wz-ico{ width:34px; height:34px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:15px; color:#1A1A1E; background:radial-gradient(circle at 50% 42%, #E6CF9C, #C9A96E); box-shadow:0 0 12px rgba(201,169,110,.45); } .wz-name{ font-size:14px; color:rgba(245,240,232,.95); letter-spacing:.06em; } .wz-sub{ font-size:11px; color:rgba(245,240,232,.5); letter-spacing:.04em; } /* V5.2 线E：记录可查可清标注 */ .fw-ethic{ color:rgba(201,169,110,.82); border-top:1px solid rgba(201,168,110,.18); padding-top:8px; margin-top:4px; } .dock-dot{ position:relative; width:13px; height:13px; border-radius:50%; pointer-events:auto; cursor:pointer; display:flex; align-items:center; background:radial-gradient(circle at 50% 45%, rgba(201,169,110,.95), rgba(201,169,110,.12) 72%); box-shadow:0 0 9px rgba(201,169,110,.5); animation:dockBreath 3.4s ease-in-out infinite; } .dock-dot:hover{ box-shadow:0 0 16px rgba(201,169,110,.85); } .dock-label{ position:absolute; top:50%; white-space:nowrap; font-size:12px; letter-spacing:.12em; color:rgba(245,240,232,.92); background:rgba(20,20,24,.86); padding:5px 11px; border-radius:11px; border:1px solid rgba(201,168,110,.32); opacity:0; pointer-events:none; transition:opacity .25s ease, transform .25s ease; } #neiFu .dock-label{ right:22px; transform:translate(8px,-50%); } #neiFu .dock-dot:hover .dock-label{ opacity:1; transform:translate(0,-50%); } #waiZhai .dock-label{ left:22px; transform:translate(-8px,-50%); } #waiZhai .dock-dot:hover .dock-label{ opacity:1; transform:translate(0,-50%); } @keyframes dockBreath{ 0%,100%{ transform:scale(1); opacity:.72; } 50%{ transform:scale(1.28); opacity:1; } } @media (max-width:768px){ #neiFu, #waiZhai{ display:none; } } /* P1-3（2026-08-11·合一）：移动端两坞入口条（默认隐藏，仅窄屏显示） */ .mobile-dock{ display:none; } .mobile-dock-panel{ display:none; } .mobile-dock-panel.show{ display:block; } @media (max-width:768px){ .mobile-dock{ display:flex; position:fixed; left:50%; bottom:14px; transform:translateX(-50%); z-index:21; gap:14px; padding:8px 14px; border-radius:999px; background:rgba(22,22,26,.9); border:1px solid rgba(201,168,110,.28); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); box-shadow:0 8px 30px rgba(0,0,0,.5); } .mobile-dock .md-btn{ appearance:none; -webkit-appearance:none; border:0; background:rgba(201,169,110,.12); color:rgba(245,240,232,.92); font-size:13px; letter-spacing:.1em; padding:9px 18px; border-radius:999px; cursor:pointer; font-family:var(--font-zh); } .mobile-dock .md-btn.active{ background:var(--life-gold); color:#1A1A1E; font-weight:600; } /* 浮层为底部小浮层，浮在输入框上方，对话区（中央）完全无遮挡 */ .mobile-dock-panel{ position:fixed; left:12px; right:12px; bottom:66px; z-index:22; max-height:42vh; overflow:auto; padding:16px 18px; border-radius:18px; background:rgba(22,22,26,.94); border:1px solid rgba(201,168,110,.26); backdrop-filter:blur(22px); -webkit-backdrop-filter:blur(22px); box-shadow:0 18px 60px rgba(0,0,0,.6); } .mobile-dock-panel .mdp-title{ display:flex; justify-content:space-between; align-items:center; font-size:14px; letter-spacing:.12em; color:rgba(201,168,110,.9); margin-bottom:12px; } .mobile-dock-panel .mdp-x{ cursor:pointer; color:rgba(245,240,232,.5); font-size:18px; padding:0 6px; line-height:1; } .mobile-dock-panel .mdp-item{ display:flex; align-items:center; justify-content:space-between; padding:13px 0; border-top:1px solid rgba(245,240,232,.07); font-size:14px; color:rgba(245,240,232,.9); cursor:pointer; } .mobile-dock-panel .mdp-item:first-of-type{ border-top:none; } .mobile-dock-panel .mdp-item .tip{ font-size:11px; color:rgba(245,240,232,.45); } } .fw-title{ font-size:13px; letter-spacing:.14em; color:rgba(201,168,110,.9); margin-bottom:10px; display:flex; align-items:center; justify-content:space-between; } .fw-title .x{ cursor:pointer; color:rgba(245,240,232,.4); font-size:15px; padding:0 4px; line-height:1; } .fw-title .x:hover{ color:rgba(245,240,232,.85); } .fw-row{ display:flex; align-items:center; justify-content:space-between; padding:9px 0; border-top:1px solid rgba(245,240,232,.07); font-size:13px; } .fw-row:first-of-type{ border-top:none; } .fw-row .k{ color:rgba(245,240,232,.6); letter-spacing:.04em; } .fw-row .v{ color:rgba(245,240,232,.92); font-weight:600; text-align:right; max-width:62%; } .fw-row .v.dim{ color:rgba(245,240,232,.4); font-weight:400; } .fw-btn{ cursor:pointer; padding:4px 12px; border-radius:11px; font-size:12px; border:1px solid rgba(201,168,110,.3); color:rgba(201,168,110,.95); background:rgba(201,168,110,.06); transition:background .3s ease, border-color .3s ease; } .fw-btn:hover{ background:rgba(201,168,110,.16); border-color:rgba(201,168,110,.55); } .fw-btn.warn{ border-color:rgba(220,120,90,.35); color:rgba(230,150,110,.95); background:rgba(220,120,90,.06); } .fw-btn.warn:hover{ background:rgba(220,120,90,.16); } .fw-note{ font-size:11px; line-height:1.6; color:rgba(245,240,232,.4); margin-top:10px; letter-spacing:.02em; } .fw-sep{ height:1px; background:rgba(201,168,110,.16); margin:10px 0 4px; } /* v8.0 五项分区标题（通用/能力魔方/引擎/模型/记忆） */ .fw-sec{ font-size:11px; letter-spacing:.22em; color:rgba(201,168,110,.65); margin:2px 0 6px; } /* W2/B-4（2026-09-21）：原 rgba(140,200,140,.95) 为绿——违反「绝不引入绿」红线， 改回 VI 香槟金亮色（与 kb 反馈、语音态统一）。 */ .fw-row .v.ok{ color:var(--life-gold-bright); font-weight:600; } .fw-row .v.warn{ color:rgba(230,170,110,.95); font-weight:600; } .fw-keyrow{ display:flex; gap:8px; margin:8px 0 2px; } .fw-input{ flex:1; min-width:0; height:32px; padding:0 10px; border-radius:9px; font-size:12px; color:var(--pearl); background:rgba(245,240,232,.06); border:1px solid rgba(201,168,110,.25); outline:none; } .fw-input::placeholder{ color:rgba(245,240,232,.35); } .fw-input:focus{ border-color:rgba(201,168,110,.6); background:rgba(245,240,232,.1); } .fw-btn.primary{ border-color:rgba(201,168,110,.55); color:var(--space-grey,#1A1A1E); background:rgba(201,168,110,.92); font-weight:600; } .fw-btn.primary:hover{ background:rgba(201,168,110,1); } /* ---------- 激活文字（V3.0：下移到圆下方不重叠，V2.1定稿） ---------- */ #voiceText{ position:fixed; left:50%; top:calc(50% + 22vmin); transform:translate(-50%,0); z-index:6; text-align:center; max-width:80%; font-size:28px; font-weight:700; letter-spacing:0.05em; line-height:1.9; color:var(--life-gold-bright); text-shadow:0 0 30px rgba(201,169,110,.4); opacity:0; transition:opacity 1.2s ease; } #voiceText.show{ opacity:1; } #voiceText.fade{ opacity:0; } /* ---------- 真言横幅（V4.1 P1-2：从对话区上方移除，改为开机视频后与"懂你"上下排列，3.5s淡出不常驻） ---------- */ #creed{ position:fixed; left:50%; top:calc(50% + 22vmin + 62px); transform:translate(-50%,0); z-index:6; text-align:center; max-width:84%; font-size:20px; font-weight:700; letter-spacing:0.06em; line-height:2.0; color:var(--life-gold); text-shadow:0 0 30px rgba(201,169,110,.4); opacity:0; transition:opacity 1.4s ease; } #creed.show{ opacity:1; } #creed.fade{ opacity:0; } #creed .row2{ color:var(--life-gold-bright); } /* ---------- V1.3 状态词横幅（进化形态人格，3-4s淡出不常驻） ---------- */ #stateWord{ position:fixed; left:50%; top:38%; transform:translate(-50%,0); z-index:6; text-align:center; max-width:84%; font-size:20px; font-weight:700; letter-spacing:0.05em; line-height:1.8; color:var(--life-gold-bright); text-shadow:0 0 30px rgba(201,169,110,.5); opacity:0; transition:opacity 1.0s ease; pointer-events:none; } #stateWord.show{ opacity:1; } #stateWord.fade{ opacity:0; } #stage.awake #topbar{ opacity:1; transform:none; } #stage.awake #dialogue{ opacity:1; } #stage.awake #inputbar{ opacity:1; transform:none; } #stage.awake #heart{ opacity:1; } /* 四区色温（暖度递增，无蓝） */ body[data-zone="shop"] #nucleusWrap{ filter:drop-shadow(0 0 40px var(--zone-shop)); } body[data-zone="avatar"] #nucleusWrap{ filter:drop-shadow(0 0 40px var(--zone-avatar)); } body[data-zone="gaowo"] #nucleusWrap{ filter:drop-shadow(0 0 40px var(--zone-gaowo)); } body[data-zone="awaken"] #nucleusWrap{ filter:drop-shadow(0 0 40px var(--zone-awaken)); } /* ===== v8.0（#367 道一拍板）：真理之境（gaowo）雷达扫描线 ===== */ /* 中心光球外围一圈扫描扇面 · 4s 一周 · 香槟金低透（不抢对话焦点） */ #radarScan{ position:fixed; left:50%; top:50%; width:min(58vmin, 420px); height:min(58vmin, 420px); transform:translate(-50%,-50%); border-radius:50%; pointer-events:none; z-index:9; opacity:0; transition:opacity .8s ease; display:none; } body[data-zone="gaowo"] #radarScan{ display:block; opacity:1; } #radarScan::before{ content:''; position:absolute; inset:0; border-radius:50%; border:1px solid rgba(201,168,110,.10); } #radarScan::after{ content:''; position:absolute; inset:0; border-radius:50%; background:conic-gradient(from 0deg, rgba(201,168,110,.22) 0deg, rgba(201,168,110,.05) 42deg, transparent 75deg, transparent 360deg); mask:radial-gradient(circle, transparent 30%, #000 31%); -webkit-mask:radial-gradient(circle, transparent 30%, #000 31%); animation:radarSpin 4s linear infinite; } @keyframes radarSpin{ from{ transform:rotate(0deg); } to{ transform:rotate(360deg); } } @media (prefers-reduced-motion: reduce){ #radarScan::after{ animation:none; } } /* ===== v8.0（#367 道一拍板）：绽放之境（awaken）螺旋光晕 ===== */ /* 中心光球外旋涡光环 · 14s 缓旋 · 双层伪元素错相（生长感） */ #spiralHalo{ position:fixed; left:50%; top:50%; width:min(64vmin, 470px); height:min(64vmin, 470px); transform:translate(-50%,-50%); border-radius:50%; pointer-events:none; z-index:9; opacity:0; transition:opacity .8s ease; display:none; } body[data-zone="awaken"] #spiralHalo{ display:block; opacity:1; } #spiralHalo::before, #spiralHalo::after{ content:''; position:absolute; inset:-6%; border-radius:50%; border:1.5px solid transparent; border-top-color:rgba(228,190,120,.35); border-left-color:rgba(228,190,120,.12); animation:spiralSpin 14s linear infinite; } #spiralHalo::after{ inset:-14%; border-top-color:rgba(228,190,120,.18); border-left-color:rgba(228,190,120,.07); animation-duration:21s; animation-direction:reverse; } @keyframes spiralSpin{ from{ transform:rotate(0deg); } to{ transform:rotate(360deg); } } @media (prefers-reduced-motion: reduce){ #spiralHalo::before, #spiralHalo::after{ animation:none; } } @media (max-width:768px){ #topbar{ padding:16px 18px; } #topbar .slogan{ display:none; } .door .label{ display:none; } #voiceText{ font-size:17px; top:calc(50% + 26vmin); } #creed{ font-size:16px; top:calc(50% + 26vmin + 58px); } #stateWord{ font-size:15px; } } /* ===== V4.1 魂体合一：五问钥匙化（非劫持·居中浮现）+ 右侧双图 ===== */ /* 灵魂五问：居中磨砂卡，浮现于深空（非全屏弹窗、非开场劫持） V4.1 P0-4：卡自适应 + 卡内输入区；P0-6：答题脉冲 */ #soulFive{ position:fixed; z-index:40; left:50%; top:50%; transform:translate(-50%,-50%) scale(.98); width:min(560px,90vw); max-height:85vh; overflow-y:auto; padding:30px 32px; text-align:center; opacity:0; pointer-events:none; background:rgba(22,22,26,.82); border:1px solid rgba(201,168,110,.22); border-radius:22px; backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); box-shadow:0 20px 70px rgba(0,0,0,.55); transition:opacity .55s ease, transform .55s ease; } #soulFive.show{ opacity:1; pointer-events:auto; transform:translate(-50%,-50%) scale(1); } #soulFive .q-mode{ font-size:12px; letter-spacing:.3em; color:rgba(201,169,110,.75); margin-bottom:14px; } #soulFive .q-no{ font-size:12px; letter-spacing:.25em; color:rgba(245,240,232,.4); margin-bottom:10px; } #soulFive .q-text{ font-size:21px; font-weight:600; color:var(--life-gold-bright); text-shadow:0 0 24px rgba(201,169,110,.35); line-height:1.7; max-width:520px; margin:0 auto; } #soulFive .q-hint{ font-size:13px; color:var(--pearl-dim); margin-top:14px; line-height:1.6; } /* 五问进度：高我=星点(dot)，元神=光路段(seg) */ #soulFive .q-prog{ display:flex; gap:10px; justify-content:center; margin-top:20px; } #soulFive .q-prog .dot{ width:9px; height:9px; border-radius:50%; background:rgba(245,240,232,.18); transition:all .4s; } #soulFive .q-prog .dot.on{ background:rgba(201,169,110,.95); box-shadow:0 0 12px rgba(201,169,110,.7); } #soulFive .q-prog .seg{ width:26px; height:3px; border-radius:2px; background:rgba(245,240,232,.18); transition:all .4s; } #soulFive .q-prog .seg.on{ background:linear-gradient(90deg,rgba(201,169,110,.5),rgba(201,169,110,.95)); box-shadow:0 0 10px rgba(201,169,110,.6); } /* V4.1 P0-6：刚点亮的星点/光段脉冲确认 */ #soulFive .q-prog .dot.pulse, #soulFive .q-prog .seg.pulse{ transform:scale(1.8); filter:brightness(1.5); transition:transform .3s ease, filter .3s ease; } /* V4.1 P0-4：卡内输入区（磨砂胶囊，聚焦金晕） */ .q-input-row{ margin-top:16px; display:flex; justify-content:center; } #sfInput{ width:80%; max-width:420px; height:44px; padding:0 16px; border-radius:22px; border:1px solid rgba(201,168,110,.22); background:rgba(26,26,30,.6); color:var(--pearl); font-size:14px; outline:none; backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); box-shadow:inset 0 0 20px rgba(201,169,110,.05); transition:border-color .3s, box-shadow .3s; } #sfInput::placeholder{ color:rgba(245,240,232,.35); } #sfInput:focus{ border-color:var(--life-gold); box-shadow:0 0 18px rgba(201,169,110,.3); } #soulFive .q-skip{ display:inline-block; margin-top:18px; font-size:12px; color:var(--pearl-dim-06); cursor:pointer; letter-spacing:.1em; } #soulFive .q-skip:hover{ color:var(--pearl-dim); } #soulFive .q-close{ position:absolute; top:12px; right:14px; font-size:20px; color:rgba(245,240,232,.5); cursor:pointer; line-height:1; width:28px; height:28px; display:flex; align-items:center; justify-content:center; border-radius:50%; z-index:2; transition:color .3s, box-shadow .3s, background .3s; } #soulFive .q-close:hover{ color:var(--pearl); box-shadow:0 0 14px rgba(201,169,110,.55); background:rgba(201,169,110,.14); } /* ===== V4.1 蓝图 P1 表现层：临在入口/确认开关/概率云/共建反馈/归因 ===== */ /* 临在入口：光点呼吸 + 文案，三态自适应（低频完整/高频2s/焦虑加深）；可跳过不打扰 */ #presence{ position:fixed; inset:0; z-index:43; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:22px; background:radial-gradient(circle at 50% 45%, rgba(16,16,20,.5), rgba(16,16,20,.86)); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); opacity:0; pointer-events:none; transition:opacity 1s ease; } #presence.show{ opacity:1; pointer-events:auto; } #presence .p-orb{ width:88px; height:88px; border-radius:50%; border:1px solid rgba(201,169,110,.35); box-shadow:0 0 40px rgba(201,169,110,.25), inset 0 0 30px rgba(201,169,110,.12); animation:presOrb 4s ease-in-out infinite; } @keyframes presOrb{ 0%,100%{ transform:scale(1); opacity:.7; } 50%{ transform:scale(1.12); opacity:1; } } #presence .p-text{ font-size:19px; letter-spacing:.18em; color:rgba(201,169,110,.9); text-shadow:0 0 30px rgba(201,169,110,.35); text-align:center; max-width:80%; line-height:1.8; } #presence .p-skip{ position:absolute; bottom:12%; font-size:12px; color:rgba(245,240,232,.35); cursor:pointer; letter-spacing:.15em; } #presence .p-skip:hover{ color:rgba(245,240,232,.8); } /* 确认开关探询气泡：说破前先经许可（用户主权） */ #insightAsk{ position:fixed; left:50%; top:50%; transform:translate(-50%,-50%) scale(.96); z-index:44; width:min(480px,90vw); padding:26px 28px; text-align:center; border-radius:18px; background:rgba(22,22,26,.9); border:1px solid rgba(201,168,110,.25); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); box-shadow:0 20px 70px rgba(0,0,0,.6); opacity:0; pointer-events:none; transition:opacity .45s ease, transform .45s ease; } #insightAsk.show{ opacity:1; pointer-events:auto; transform:translate(-50%,-50%) scale(1); } #insightAsk .ia-text{ font-size:15.5px; line-height:1.9; color:var(--pearl); margin-bottom:20px; white-space:pre-line; } #insightAsk .ia-keys{ display:flex; gap:14px; justify-content:center; } #insightAsk .ia-key{ padding:10px 30px; border-radius:999px; font-size:14px; cursor:pointer; letter-spacing:.1em; border:1px solid rgba(201,168,110,.35); color:rgba(201,169,110,.95); background:rgba(201,169,110,.06); transition:all .25s; } #insightAsk .ia-key:hover{ background:rgba(201,169,110,.18); transform:translateY(-1px); } #insightAsk .ia-key.no{ border-color:rgba(245,240,232,.2); color:rgba(245,240,232,.6); background:transparent; } /* 共建反馈光点：✓/➜/✗，✗弹归因输入（userCorrection 最高权重回流） */ #insightFeedback{ position:fixed; left:50%; top:calc(50% + 30vmin); transform:translate(-50%,0); z-index:44; display:flex; flex-direction:column; align-items:center; gap:12px; opacity:0; pointer-events:none; transition:opacity .5s ease; } #insightFeedback.show{ opacity:1; pointer-events:auto; } #insightFeedback .fb-title{ font-size:12.5px; letter-spacing:.12em; color:rgba(201,169,110,.75); text-align:center; line-height:1.7; } #insightFeedback .fb-row{ display:flex; gap:14px; } #insightFeedback .fb{ min-width:76px; height:40px; padding:0 14px; border-radius:20px; display:flex; align-items:center; justify-content:center; font-size:13.5px; cursor:pointer; border:1px solid rgba(201,168,110,.35); color:rgba(201,169,110,.9); background:rgba(22,22,26,.8); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); transition:all .25s; } #insightFeedback .fb:hover{ background:rgba(201,169,110,.2); transform:scale(1.08); } #insightFeedback .fb.done{ opacity:.4; pointer-events:none; } /* 双模协议 V1.1（2026-08-11·天枢）：对境静驻光点 —— 极淡呼吸光晕，最低打扰；点击展开三键 */ #insightDot{ position:fixed; left:50%; bottom:128px; transform:translateX(-50%); width:13px; height:13px; border-radius:50%; background:radial-gradient(circle, rgba(201,169,110,.95) 0%, rgba(201,169,110,.4) 60%, rgba(201,169,110,0) 100%); box-shadow:0 0 16px rgba(201,169,110,.5); opacity:0; pointer-events:none; cursor:pointer; transition:opacity .6s ease; z-index:43; } #insightDot.show{ opacity:1; pointer-events:auto; animation:insightBreath 2.8s ease-in-out infinite; } #insightDot.expanded{ opacity:.9; animation:none; pointer-events:auto; } @keyframes insightBreath{ 0%,100%{ opacity:.25; transform:translateX(-50%) scale(.85); } 50%{ opacity:.5; transform:translateX(-50%) scale(1.1); } } /* 归因输入浮层 */ #corrInput{ position:fixed; left:50%; top:50%; transform:translate(-50%,-50%) scale(.96); z-index:45; width:min(440px,90vw); padding:24px 26px; text-align:center; border-radius:18px; background:rgba(22,22,26,.92); border:1px solid rgba(201,168,110,.25); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); box-shadow:0 20px 70px rgba(0,0,0,.6); opacity:0; pointer-events:none; transition:opacity .4s ease, transform .4s ease; } #corrInput.show{ opacity:1; pointer-events:auto; transform:translate(-50%,-50%) scale(1); } #corrInput .ci-title{ font-size:13px; letter-spacing:.14em; color:rgba(201,169,110,.8); margin-bottom:14px; } #corrInput input{ width:100%; height:42px; padding:0 14px; border-radius:21px; font-size:14px; color:var(--pearl); background:rgba(26,26,30,.7); border:1px solid rgba(201,168,110,.3); outline:none; box-sizing:border-box; } #corrInput input:focus{ border-color:var(--life-gold); box-shadow:0 0 16px rgba(201,169,110,.3); } #corrInput .ci-send{ margin-top:14px; padding:8px 26px; border-radius:999px; font-size:13px; cursor:pointer; border:1px solid rgba(201,168,110,.4); color:rgba(201,169,110,.95); background:rgba(201,169,110,.08); display:inline-block; letter-spacing:.1em; } #corrInput .ci-send:hover{ background:rgba(201,169,110,.18); } /* 概率云图谱（右侧 side-map 复用，45%/30%/25% 非一锤定音） */ #cloudPanel .cp-row{ display:flex; flex-direction:column; gap:12px; margin-top:14px; } #cloudPanel .cp-item{ padding:12px 14px; border-radius:12px; background:rgba(201,169,110,.05); border:1px solid rgba(201,169,110,.14); } #cloudPanel .cp-name{ font-size:13.5px; color:var(--pearl); margin-bottom:8px; } #cloudPanel .cp-bar{ height:6px; border-radius:3px; background:rgba(245,240,232,.1); overflow:hidden; } #cloudPanel .cp-fill{ height:100%; border-radius:3px; background:linear-gradient(90deg, rgba(201,169,110,.5), rgba(201,169,110,.95)); box-shadow:0 0 10px rgba(201,169,110,.5); transition:width .8s ease; } #cloudPanel .cp-pct{ font-size:11.5px; color:rgba(201,169,110,.75); margin-top:6px; text-align:right; } #cloudPanel .cp-note{ font-size:11.5px; color:rgba(245,240,232,.4); margin-top:12px; line-height:1.7; } @media (max-width:768px){ #soulFive{ width:92vw; padding:22px 18px; } #soulFive .q-text{ font-size:17px; } #sfInput{ width:92%; } } /* 右侧个人因果图谱 / 觉醒地图（半隐藏右滑，按需浮现，可回看演化） */ .side-map{ position:fixed; z-index:25; top:0; right:0; height:100%; width:min(384px,88vw); transform:translateX(100%); transition:transform .5s cubic-bezier(.4,0,.2,1); background:rgba(22,22,26,.88); border-left:1px solid rgba(201,168,110,.22); backdrop-filter:blur(22px); -webkit-backdrop-filter:blur(22px); box-shadow:-20px 0 70px rgba(0,0,0,.5); padding:64px 24px 24px; overflow-y:auto; } .side-map.show{ transform:translateX(0); } .side-map .sm-close{ position:absolute; top:18px; right:18px; font-size:20px; color:rgba(245,240,232,.45); cursor:pointer; line-height:1; } .side-map .sm-close:hover{ color:rgba(245,240,232,.9); } .side-map .sm-title{ font-size:15px; letter-spacing:.14em; color:rgba(201,168,110,.92); margin-bottom:6px; } .side-map .sm-sub{ font-size:12px; color:var(--pearl-dim); margin-bottom:18px; line-height:1.6; } .side-map .sm-dim{ margin:16px 0 6px; font-size:12px; letter-spacing:.1em; color:rgba(201,168,110,.7); } .side-map .sm-row{ display:flex; gap:10px; padding:9px 0; border-bottom:1px solid rgba(245,240,232,.06); font-size:13px; line-height:1.6; } .side-map .sm-row .k{ flex:0 0 66px; color:rgba(201,168,110,.8); } .side-map .sm-row .v{ flex:1; color:var(--pearl); } .side-map .sm-card{ margin-top:16px; padding:16px; border-radius:14px; background:rgba(201,169,110,.06); border:1px solid rgba(201,169,110,.18); font-size:13.5px; line-height:1.8; color:var(--pearl); } /* V5.5（命座活化网络）：命座因果链 —— 尖叫点三实体化 */ .mz-chain{ margin-top:10px; padding:12px 14px; border-radius:12px; background:rgba(22,22,26,.5); border:1px solid rgba(201,168,110,.14); } .mz-chain .mz-trigger{ font-size:12.5px; color:var(--pearl); line-height:1.7; } .mz-chain .mz-trigger .t{ color:rgba(201,169,110,.75); margin-right:6px; } .mz-chain .mz-flow{ display:flex; align-items:center; gap:6px; margin-top:8px; font-size:11.5px; color:var(--pearl-dim-06); flex-wrap:wrap; } .mz-chain .mz-flow .step{ padding:3px 9px; border-radius:999px; background:rgba(201,169,110,.08); border:1px solid rgba(201,169,110,.2); color:rgba(245,240,232,.75); } .mz-chain .mz-flow .arr{ color:rgba(201,169,110,.5); font-size:11px; } .mz-chain .mz-count{ display:inline-block; margin-left:8px; padding:1px 8px; border-radius:8px; background:rgba(201,169,110,.15); color:rgba(201,169,110,.9); font-size:11px; } /* V5.5（命座活化网络 · 尖叫点三实体化）：导出/清空工具条（关系资产可查可清） */ .mz-tools{ display:flex; align-items:center; gap:8px; margin:12px 0 4px; } .mz-tools .mz-tip{ font-size:11px; color:rgba(201,168,110,.72); margin-right:auto; } .mz-tools .zp-btn{ margin-top:0; padding:6px 16px; font-size:12px; } .mz-tools .zp-btn.ghost{ background:transparent; color:rgba(245,240,232,.72); border:1px solid rgba(201,168,110,.35); box-shadow:none; } .mz-tools .zp-btn.ghost:hover{ box-shadow:0 0 14px rgba(201,169,110,.35); } .side-map .sm-title{ cursor:move; user-select:none; -webkit-user-select:none; } /* 修A：两卡右侧上下并列（right:0 + translateX(100%) 隐藏位移天然正确，彻底消除常驻挡屏 bug）；可拖拽保持 */ #causalMap{ right:0; top:0; height:52vh; } #awakenMap{ right:0; top:calc(52vh + 10px); height:auto; max-height:calc(48vh - 10px); } #causalMap.dragged, #awakenMap.dragged{ transition:none; } /* 因果星座（高我个人图谱） */ #constellation{ position:fixed; inset:0; z-index:42; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:18px; padding:32px; background:radial-gradient(circle at 50% 45%, rgba(20,20,24,.86), rgba(20,20,24,.96)); backdrop-filter:blur(8px); opacity:0; pointer-events:none; transition:opacity .6s ease; } #constellation.show{ opacity:1; pointer-events:auto; } #constellation canvas{ max-width:92vw; max-height:62vh; } #constellation .c-title{ font-size:13px; letter-spacing:.2em; color:rgba(201,169,110,.85); } #constellation .c-close{ font-size:12px; color:var(--pearl-dim); cursor:pointer; letter-spacing:.1em; } #constellation .c-close:hover{ color:var(--pearl); } /* v8.3.4 缺陷3 修复（L3）：反馈钮脱离 fixed 悬浮，归属对话流—— 改挂 #dialogue 内随消息流滚动的内联条；面板收拢/关闭即随流隐藏，不再错位残留。 */ #insightOpts{ display:flex; justify-content:center; gap:12px; margin:12px 0 6px; opacity:0; pointer-events:none; transition:opacity .5s ease; } #insightOpts.show{ opacity:1; pointer-events:auto; } #dialogue.collapsed #insightOpts, #dialogue.closed #insightOpts{ display:none !important; } #insightOpts .opt{ padding:9px 18px; border-radius:999px; font-size:13px; cursor:pointer; background:var(--glass-bg); border:1px solid var(--glass-border); color:var(--pearl-dim); backdrop-filter:blur(18px); transition:color .3s, border-color .3s, transform .2s; } #insightOpts .opt:hover{ color:var(--pearl); border-color:var(--life-gold-glow); transform:translateY(-1px); } #insightOpts .opt.done{ color:rgba(201,169,110,.9); border-color:rgba(201,169,110,.5); } /* 能量回声条 */ #energyEcho{ position:fixed; left:50%; top:calc(50% + 14vmin); transform:translate(-50%,0); z-index:7; font-size:13px; letter-spacing:.08em; color:var(--pearl-dim); opacity:0; transition:opacity 1s ease; text-align:center; max-width:80%; } #energyEcho.show{ opacity:1; } /* 四门温度文案（V4.1 P1-3：14px + 香槟金0.55 + 背景块rgba(26,26,30,0.6)——注释语降噪不抢戏） V5.3（2026-08-16）：两排排版 —— 取消"——"破折号，名称一行、注解一行，杜绝窄宽换行错乱 */ .temp-line{ position:absolute; z-index:4; font-size:14px; letter-spacing:.04em; color:rgba(201,169,110,.55); opacity:0; transition:opacity .8s ease; pointer-events:none; max-width:240px; line-height:1.75; white-space:pre-line; text-align:center; background:rgba(26,26,30,.6); border:1px solid rgba(201,168,110,.18); border-radius:10px; padding:8px 14px; backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); } .temp-line.show{ opacity:1; } /* 神经生长（思考态覆盖核） */ #neural{ position:fixed; inset:0; z-index:2; pointer-events:none; opacity:0; transition:opacity .5s ease; } #neural.on{ opacity:1; } /* V4.1 功能区浮层：购物参数漏斗 / 分身能力魔方（零外部依赖，本地高保真模拟） */ /* P1.4：面板降级为底部小浮层，浮在输入框上方，门所在中央区完全无遮挡（不弹居中大面板） */ .zone-panel{ position:fixed; z-index:25; left:50%; top:auto; bottom:132px; transform:translateX(-50%) translateY(8px) scale(.98); width:min(460px,88vw); max-height:48vh; overflow:auto; padding:22px 24px; opacity:0; pointer-events:none; background:rgba(22,22,26,.9); border:1px solid rgba(201,168,110,.22); border-radius:20px; backdrop-filter:blur(22px); box-shadow:0 20px 70px rgba(0,0,0,.6); transition:opacity .42s, transform .42s; } .zone-panel.show{ opacity:1; pointer-events:auto; transform:translateX(-50%) translateY(0) scale(1); z-index:40; } .zp-title{ font-size:15px; letter-spacing:.12em; color:rgba(201,168,110,.9); margin-bottom:14px; display:flex; justify-content:space-between; align-items:center; } /* P1.4：× 提亮（.4→.8）+ hover 光晕圈 */ .zp-title .x{ cursor:pointer; color:rgba(245,240,232,.8); font-size:18px; line-height:1; width:26px; height:26px; display:flex; align-items:center; justify-content:center; border-radius:50%; transition:color .3s, box-shadow .3s, background .3s; } .zp-title .x:hover{ color:var(--pearl); box-shadow:0 0 14px rgba(201,169,110,.55); background:rgba(201,169,110,.14); } .zp-input{ width:100%; background:rgba(201,169,110,.04); border:1px solid var(--glass-border); border-radius:12px; padding:11px 14px; color:var(--pearl); font-size:14px; font-family:var(--font-zh); outline:none; } .zp-input:focus{ border-color:var(--life-gold-glow); box-shadow:0 0 0 3px rgba(201,169,110,.12); } .zp-btn{ margin-top:12px; padding:10px 20px; border-radius:999px; background:var(--life-gold); color:#1A1A1E; font-weight:600; font-size:13px; cursor:pointer; border:0; transition:box-shadow .3s; } .zp-btn:hover{ box-shadow:0 0 24px rgba(201,169,110,.5); } .zp-card{ margin-top:12px; padding:14px 16px; border-radius:14px; background:rgba(201,169,110,.05); border:1px solid rgba(201,169,110,.14); } .zp-card .name{ font-size:14px; color:var(--life-gold-bright); font-weight:600; } .zp-card .meta{ font-size:12px; color:var(--pearl-dim); margin-top:6px; line-height:1.6; } .zp-card .soul{ font-size:12px; color:rgba(201,168,110,.8); margin-top:8px; font-style:italic; } .zp-cap{ font-size:11px; color:var(--pearl-dim-06); margin-top:14px; letter-spacing:.04em; line-height:1.6; } /* 京东接入（W1 · 2026-09-15）购物区正源：频道货架 + 参数卡「证据链」 */ .shop-ch{ display:flex; gap:6px; overflow-x:auto; margin-top:12px; padding-bottom:2px; scrollbar-width:none; } .shop-ch::-webkit-scrollbar{ display:none; } .shop-ch .ch{ flex:0 0 auto; font-size:12px; padding:5px 13px; border-radius:999px; cursor:pointer; white-space:nowrap; border:1px solid rgba(201,169,110,.24); color:rgba(245,240,232,.72); background:transparent; transition:background .25s, color .25s, border-color .25s; } .shop-ch .ch:hover{ border-color:rgba(201,169,110,.5); } .shop-ch .ch.on{ background:rgba(201,169,110,.16); color:var(--life-gold-bright); border-color:rgba(201,169,110,.62); } .jd-grid{ display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-top:12px; } .jd-it{ cursor:pointer; border-radius:12px; background:rgba(201,169,110,.05); border:1px solid rgba(201,169,110,.14); padding:8px; transition:border-color .25s, box-shadow .25s; } .jd-it:hover{ border-color:rgba(201,169,110,.48); box-shadow:0 6px 20px rgba(0,0,0,.32); } .jd-it img{ width:100%; height:76px; object-fit:contain; border-radius:8px; background:rgba(255,255,255,.03); } .jd-it .t{ font-size:11.5px; color:rgba(245,240,232,.86); line-height:1.45; margin-top:6px; height:33px; overflow:hidden; } .jd-it .p{ font-size:13px; color:var(--life-gold-bright); font-weight:600; margin-top:4px; } .jd-it .p small{ font-size:10px; color:var(--pearl-dim-06); font-weight:400; margin-left:4px; } .jd-it .s{ font-size:10px; color:var(--pearl-dim-06); margin-top:3px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .jd-hint{ margin-top:12px; padding:11px 14px; border-radius:12px; background:rgba(201,169,110,.05); border:1px dashed rgba(201,169,110,.28); font-size:11.5px; color:var(--pearl-dim); line-height:1.7; } .pc-card{ margin-top:12px; padding:14px; border-radius:14px; background:rgba(201,169,110,.06); border:1px solid rgba(201,169,110,.24); } .pc-head{ display:flex; gap:11px; } .pc-head img{ width:82px; height:82px; flex:0 0 auto; object-fit:contain; border-radius:10px; background:rgba(255,255,255,.03); } .pc-title{ font-size:12.5px; color:rgba(245,240,232,.92); line-height:1.5; } .pc-price{ font-size:19px; color:var(--life-gold-bright); font-weight:700; margin-top:5px; letter-spacing:.01em; } .pc-price small{ font-size:11px; color:var(--pearl-dim); font-weight:400; margin-left:7px; } .pc-sub{ font-size:11px; color:var(--pearl-dim); margin-top:5px; line-height:1.6; } .pc-ev{ margin-top:11px; padding-top:9px; border-top:1px solid rgba(201,169,110,.14); } .pc-ev .r{ display:flex; justify-content:space-between; gap:10px; font-size:11.5px; padding:3px 0; } .pc-ev .r .k{ color:var(--pearl-dim); white-space:nowrap; } .pc-ev .r .v{ color:rgba(245,240,232,.9); text-align:right; } .pc-ev .r .v.unk{ color:var(--pearl-dim-06); font-style:italic; } .pc-coupon{ margin-top:9px; font-size:11.5px; color:rgba(226,180,120,.95); line-height:1.6; } .pc-src{ font-size:10.5px; color:rgba(201,168,110,.72); margin-top:11px; letter-spacing:.03em; } .pc-buy{ display:inline-block; margin-top:11px; padding:8px 20px; border-radius:999px; background:var(--life-gold); color:#1A1A1E; font-size:12px; font-weight:600; text-decoration:none; border:0; cursor:pointer; transition:box-shadow .3s; } .pc-buy:hover{ box-shadow:0 0 22px rgba(201,169,110,.5); } .pc-back{ display:inline-block; margin-top:11px; margin-left:10px; font-size:11.5px; color:var(--pearl-dim); cursor:pointer; } .pc-back:hover{ color:var(--life-gold-bright); } /* W2/B-8（2026-09-21）：商品卡次级文字对比度提升 —— 原 rgba(245,240,232,.33) 在 #1A1A1E 上实测仅 ≈2.8:1（远低于 4.5:1）。 提升到 .62（实测 ≈6.5:1）。不改色相，仅提不透明度——三色铁律不破。 */ .jd-it .s{ color:rgba(245,240,232,.62); } .jd-it .p small{ color:rgba(245,240,232,.62); } .pc-ev .r .v.unk{ color:rgba(245,240,232,.62); } /* W2/B-9（2026-09-21）：商品图加载失败 → 淡金虚线占位，不留灰框/破图图标（断图测试可见） */ .jd-it img.img-fail, .pc-head img.img-fail{ background:rgba(201,169,110,.07); border:1px dashed rgba(201,169,110,.3); box-shadow:none; } /* 事7（W1 · 2026-09-15）知识库初稿区块 —— 与万应阁卡片同血统，不加高饱和 */ .kb-block{ margin-top:16px; padding-top:14px; border-top:1px solid rgba(201,169,110,.14); } .kb-head{ display:flex; align-items:baseline; justify-content:space-between; margin-bottom:10px; } .kb-t{ font-size:13px; letter-spacing:.1em; color:rgba(201,168,110,.9); } .kb-stat{ font-size:11px; color:var(--pearl-dim); } .kb-drop{ cursor:pointer; border:1px dashed rgba(201,169,110,.32); border-radius:12px; padding:16px 14px; text-align:center; transition:border-color .25s ease, background .25s ease; } .kb-drop:hover,.kb-drop.over{ border-color:rgba(201,169,110,.7); background:rgba(201,169,110,.06); } .kb-drop.busy{ pointer-events:none; opacity:.6; } .kb-drop-t{ font-size:12.5px; color:rgba(245,240,232,.85); line-height:1.7; } .kb-drop-s{ display:block; font-size:11px; color:var(--pearl-dim-06); margin-top:5px; letter-spacing:.04em; } .kb-queue{ margin-top:10px; } .kb-row{ display:flex; align-items:center; gap:8px; font-size:11.5px; padding:5px 0; border-bottom:1px solid rgba(201,169,110,.07); } .kb-row .n{ flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:rgba(245,240,232,.82); } .kb-row .s{ font-size:10.5px; color:var(--pearl-dim-06); white-space:nowrap; } .kb-row .st{ font-size:10.5px; color:var(--pearl-dim); white-space:nowrap; } .kb-row .st.ok{ color:var(--life-gold-bright); } .kb-row .st.warn{ color:rgba(220,180,120,.92); } .kb-row .st.err{ color:rgba(220,140,140,.92); } .kb-row .st.run{ color:rgba(201,169,110,.95); } /* W2/B-5（2026-09-21）：分身文件拖入反馈——每行一条进度条 + 顶部总进度。 病灶：拖入后只有文件名与状态字，无进度感，主人以为「没反应」。三色铁律内（香槟金/米白），不引新色。 */ .kb-row{ flex-wrap:wrap; } .kb-pg{ flex:0 0 100%; height:3px; margin-top:2px; border-radius:2px; overflow:hidden; background:rgba(245,240,232,.09); } .kb-pg b{ display:block; height:100%; width:0; border-radius:2px; background:linear-gradient(90deg,rgba(201,169,110,.7),rgba(232,200,136,.95)); transition:width .35s ease; } .kb-pg b.run{ width:38%; animation:kbPgFlow 1.15s ease-in-out infinite; } .kb-pg b.ok{ width:100%; background:linear-gradient(90deg,rgba(201,169,110,.8),rgba(232,200,136,1)); animation:none; } .kb-pg b.warn{ width:100%; background:rgba(220,180,120,.85); animation:none; } .kb-pg b.err{ width:100%; background:rgba(220,140,140,.85); animation:none; } @keyframes kbPgFlow{ 0%{ transform:translateX(0); } 100%{ transform:translateX(163%); } } .kb-total{ font-size:11px; color:rgba(245,240,232,.62); letter-spacing:.05em; margin:9px 0 2px; } .kb-out{ margin-top:12px; } .kb-card{ padding:13px 15px; border-radius:12px; background:rgba(201,169,110,.05); border:1px solid rgba(201,169,110,.14); margin-top:10px; } .kb-card .t{ font-size:13.5px; color:var(--life-gold-bright); font-weight:600; letter-spacing:.04em; } .kb-card .sub{ font-size:11.5px; color:var(--pearl-dim); margin-top:6px; line-height:1.7; } .kb-cat{ margin-top:10px; } .kb-cat .cn{ font-size:12px; color:rgba(201,168,110,.88); letter-spacing:.06em; } .kb-cat ul{ margin:5px 0 0; padding-left:16px; } .kb-cat li{ font-size:11.5px; color:rgba(245,240,232,.78); line-height:1.8; } .kb-hi li{ color:rgba(245,240,232,.9); } .kb-tag{ display:inline-block; font-size:10px; padding:2px 8px; border-radius:999px; margin-right:6px; background:rgba(201,169,110,.12); color:rgba(201,168,110,.9); border:1px solid rgba(201,169,110,.22); } .kb-note{ font-size:10.5px; color:var(--pearl-dim-06); margin-top:10px; line-height:1.7; } .kb-note b{ color:rgba(201,168,110,.8); font-weight:500; }