/* chat bubble font: ins冷感情绪黑体 */ @font-face{ font-family: "InsLenggan"; src: url("/fonts/ins-lenggan.ttf") format("truetype"); font-weight: 100 900; font-style: normal; font-display: swap; } /* Theme pack · three skins: mist (default) / celadon / blossom. The skin switch lives on html[data-theme] (set by hsSkin() in app.js and pre-read in the so the page never flashes the wrong colours). :root below is the shared LIGHT base every skin builds on. There is no dark skin in this kit, and no code path that reaches one — if a skin block ever fails to match, the page falls back to these light values, not to a dark one. */ :root{ /* Shared light base. Mirrors the mist skin so that mist, celadon and blossom all start from a light ground. */ --line:#7E93A4; --line-dim:rgba(94,112,128,.38); --hairline:rgba(120,142,165,.28); --text:#253447; --text-dim:#7E93A4; --accent:#4C6378; --accent-soft:rgba(76,99,120,.5); --glow:rgba(76,99,120,.16); /* nav capsule: ink follows whatever accent the active skin sets */ --nav-ink:var(--accent); --nav-tint:#DBE0E4; --nav-cap-hi:#FDFEFE; --nav-cap-lo:#F4F7FA; --nav-glint:rgba(255,255,255,.9); --nav-shadow:0 1px 2px rgba(20,26,38,.10),0 10px 24px rgba(20,26,38,.12); --font-script:"Pinyon Script",cursive; --font-en:"Cormorant Garamond",Georgia,serif; --font-cn:"Songti SC","Noto Serif SC",serif; --font-ui:-apple-system,"PingFang SC",sans-serif; } *{box-sizing:border-box} html,body{margin:0;padding:0} /* One wallpaper layer: painted on a fixed body::before — iOS 不支持 background-attachment:fixed（会拉伸错位），fixed 伪元素才是正路。 三套皮各自换 --wall-image；聊天页仍走 body.chat-open 的 --wall-default 通道， 自定义壁纸只作用聊天页规则不变。 */ body{ background-color: var(--bg, #F7FAFC); color:var(--text); font-family:var(--font-ui); min-height:100vh; -webkit-tap-highlight-color:transparent; } body::before{ content:""; position:fixed; inset:0; z-index:-1; background-color: var(--bg, #F7FAFC); background-image: var(--wall-image, none); background-size: cover; background-position: center; } /* Star dust drifting over the wallpaper (transparent base so --wall-image shows through) */ .sky{ min-height:100vh; background-color: transparent; background-image: radial-gradient(1.2px 1.2px at 18% 12%,rgba(232,234,242,.8) 50%,transparent 51%), radial-gradient(1px 1px at 73% 7%,rgba(232,234,242,.55) 50%,transparent 51%), radial-gradient(1px 1px at 88% 21%,rgba(232,234,242,.4) 50%,transparent 51%), radial-gradient(1.4px 1.4px at 9% 33%,rgba(232,234,242,.5) 50%,transparent 51%), radial-gradient(1px 1px at 62% 29%,rgba(232,234,242,.35) 50%,transparent 51%), radial-gradient(1px 1px at 34% 47%,rgba(232,234,242,.45) 50%,transparent 51%), radial-gradient(1.2px 1.2px at 81% 55%,rgba(232,234,242,.4) 50%,transparent 51%), radial-gradient(1px 1px at 15% 68%,rgba(232,234,242,.4) 50%,transparent 51%), radial-gradient(1px 1px at 55% 76%,rgba(232,234,242,.3) 50%,transparent 51%), radial-gradient(1.3px 1.3px at 90% 83%,rgba(232,234,242,.45) 50%,transparent 51%); } /* 通用字role */ .hand{font-family:var(--font-script);font-weight:400} .fine{font-family:var(--font-en);font-style:italic;font-weight:400;letter-spacing:.08em} /* 星月分隔线 */ .divider{display:block;margin:13px auto;width:86%;opacity:.9} /* 偶尔眨眼的星 */ .wink{position:absolute;z-index:2;color:var(--line);opacity:.7;animation:wink 7s ease-in-out infinite} /* a121 实机截图：右上星被 duo 磨砂卡(backdrop-filter 层叠上下文视同 z0)压半——贴纸式骑边,完整浮上层 */ .wink.b{animation-delay:3.5s} @keyframes wink{0%,100%{opacity:.15}50%{opacity:.85}} @media (prefers-reduced-motion:reduce){ .wink{animation:none} .astro-rotor{animation:none !important} } /* ── 星河底栏 · a49 胶囊水渠 → a119 徽章胶囊（tab 栏回底，比老款小一号，只有选中的 tab 冒头。 波浪 svg 水渠造型退役；光斑 ::before 与 .river/.tab 波面字随之退役，app.js 的 --gx 派发落空无害） ── */ nav.river-nav{ position:fixed;bottom:calc(10px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%); width:min(86vw, 340px);height:40px;z-index:40; padding:0; pointer-events:none; /* The capsule is white, shaded with paper tint per skin: gradient ends, glint and the two shadow layers are all nav tokens (light base in :root, the per-skin tints live down in the skin blocks). */ background:linear-gradient(180deg,var(--nav-cap-hi) 0%,var(--nav-cap-lo) 100%); border:0; /* a120 描边圈退役（内联那处同步动，两处一起） */ border-radius:999px; box-shadow: inset 0 1px 0 var(--nav-glint), var(--nav-shadow); overflow:visible; /* a119 选中徽章要顶出上沿，管口放行（波浪已退役，无需再裁） */ } .riverband{pointer-events:auto;position:relative;height:100%} /* ── 页面切换 ── */ .page{display:none;position:relative;padding:0 22px calc(96px + env(safe-area-inset-bottom))} /* a119 tab 回底垫脚复役:40 管高+10 底距+11 徽章冒头+35 呼吸(与 a49 时代 104 的净空对齐) */ .page.on{display:block} /* 占位页面 */ .stub{min-height:70vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center} .stub .t{font-family:var(--font-script);font-size:44px;color:var(--text);text-shadow:0 0 22px var(--glow)} .stub .s{font-family:var(--font-en);font-style:italic;font-size:13px;letter-spacing:.14em;color:var(--text-dim)} /* ╔══════════════════════════════════════════════════════════════╗ ║ Murmur tab · 聊天引擎样式（2026-07-18 总装 a1） ║ ║ 基础层=web/index.html 旧样式区活件精选（死重不搬）， ║ ║ #page-murmur 前缀圈场、.app→.chat-app 避壳； ║ ║ 后接 SKIN 决议层（m11-m19），层叠次序与线上 murmur 一致。 ║ ╚══════════════════════════════════════════════════════════════╝ */ :root{ --screen-height: 100vh; --keyboard-offset: 0px; --ios-pwa-bottom-bleed: 0px; --ref-width: 430px; /* a78 桌面修：与壳外框 .app{max-width:430px} 同一列宽真相——941 是没人用过的旧账，chat-app 按它铺会溢出外框被裁 */ --ref-height: 1672px; --font-en: "Cormorant Garamond", Georgia, serif; --font-cn: "Noto Serif SC", "Songti SC", "STSong", "SimSun", serif; --wall-default: linear-gradient(180deg,#FBFDFF,#EEF4FA); --menu-wall-default: var(--wall-default); /* Placeholder avatar. Picking one in Dials overrides this with an inline --avatar-default on . */ --avatar-default: linear-gradient(150deg, var(--accent-soft, #b9c6d4), rgba(255,255,255,.25)); --bg: #F7FAFC; --header-bg: #F7FAFC; --hairline: rgba(120,142,165,.24); --text: #253447; --text-soft: #5E7080; --text-faint: #8A99A8; --bubble-ai-bg: rgba(248,249,252,.40); --bubble-ai-fg: #253447; --bubble-ai-line: rgba(255,255,255,0); --bubble-human-bg: rgba(242,235,245,.40); --bubble-human-fg: #253447; --bubble-human-line: rgba(255,255,255,0); --bubble-shadow: rgba(0,0,0,.06); --accent: #4C6378; --send-bg: #4E6B89; /* a85 发送键调浅（原 #2C4056 太沉，日夜两主题统一） */ --tick: #7E93A4; --accent-fg: #ffffff; --top-line: var(--hairline); --top-active-bg: var(--seg-track); --top-active-fg: var(--accent); --top-typing-shadow: rgba(76,99,120,.22); --think-flourish: rgba(99, 121, 142, 0.52); --think-label: #6A7E8E; --think-body: #56697A; --think-panel-bg: rgba(255,255,255,.20); --think-panel-line: rgba(255,255,255,.18); --think-glass-hi: rgba(255,255,255,.14); --think-glass-shadow: rgba(18,24,32,.08); --think-text-shadow: 0 1px 10px rgba(255,255,255,.72); --composer-bg: #EEF4FA; --field-bg: rgba(247,250,252,.92); --field-line: rgba(151,169,181,.09); /* a120 输入框描边调淡一档(.18→.09),与夜档同批 */ --shadow: 0 18px 46px rgba(74, 93, 108, 0.10); --soft-shadow: 0 14px 34px rgba(86, 104, 118, 0.08); --scrim: linear-gradient(180deg, rgba(255,255,255,0.38), rgba(255,255,255,0.12) 30%, rgba(255,255,255,0.04) 68%, rgba(255,255,255,0.22)); --header-h: clamp(56px, 10vw, 120px); --side-pad: clamp(16px, 4vw, 40px); --avatar-size: clamp(32px, 5vw, 48px); --bubble-radius: 20px; --composer-h: clamp(44px, 6vw, 72px); --motion-fast: 150ms; --motion-normal: 260ms; --ease-soft: cubic-bezier(0.22, 1, 0.36, 1); --composer-zone: calc(var(--composer-h) + 16px + env(safe-area-inset-bottom) + var(--keyboard-offset)); --edge-fade-top: clamp(24px, 5vw, 52px); --edge-fade-tail: clamp(16px, 3vw, 30px); --card-bg: rgba(244,248,250,.42); --card-line: rgba(150,168,182,.12); --card-shadow: 0 10px 28px rgba(70,92,108,.05); --seg-track: rgba(140,160,176,.11); --seg-thumb: rgba(255,255,255,.68); --seg-thumb-shadow: 0 2px 8px rgba(40,60,78,.08); --row-press: rgba(140,160,176,.09); --slider-track: rgba(143,162,176,.28); --slider-thumb: #44627b; --info-ring: rgba(143,162,176,.38); --status-dot: #5fbf8f; --call-glass-top: rgba(255,255,255,.46); --call-glass-bot: rgba(255,255,255,.20); --call-glass-edge: rgba(255,255,255,.58); --call-glass-hi: rgba(255,255,255,.72); --call-glass-glow: rgba(150,172,196,.20); --call-glass-shadow: 0 20px 50px rgba(74,93,108,.16); --call-scrim: rgba(64,82,102,.06); --call-hangup-bg: #cf8d92; --call-hangup-shadow: rgba(176,96,104,.34); } #page-murmur .chat-app{ display: flex; flex-direction: column; position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1; width: min(100vw, var(--ref-width)); margin: 0 auto; overflow: hidden; } #page-murmur .wall{ position:fixed; inset:0; width:100vw; height:var(--screen-height); z-index:0; background-color: var(--bg); background-image: var(--wall-default); background-size: cover; background-position: center; transform: translateZ(0); -webkit-transform: translateZ(0); } #page-murmur .wall::after{ content:""; position:absolute; inset:0; background: var(--scrim); pointer-events:none; } #page-murmur .topbar, #page-murmur .scroll, #page-murmur .composer{ position: relative; z-index: 1; } #page-murmur .topbar{ position: sticky; top: 0; z-index: 10; display: flex; align-items: center; justify-content: center; height: calc(var(--header-h) + env(safe-area-inset-top)); padding: calc(env(safe-area-inset-top) + 8px) var(--side-pad) 10px; border-bottom: 1px solid var(--top-line); pointer-events: none; } #page-murmur .topbar > *{ pointer-events: auto; } #page-murmur .topbar::after{ content:""; position:absolute; left:0; right:0; top:100%; height: var(--edge-fade-top); pointer-events:none; background: linear-gradient(180deg, rgba(255,255,255,.40), rgba(255,255,255,0)); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); -webkit-mask-image: linear-gradient(180deg, #000, transparent); mask-image: linear-gradient(180deg, #000, transparent); } #page-murmur .peerpill{ display:flex; flex-direction:column; align-items:center; line-height:1.15; background: transparent; border: none; border-radius: 0; padding: 0 76px; } #page-murmur .peerpill .name{ font-family: "Songti SC", "Noto Serif SC", "STSong", "SimSun", serif; font-size: clamp(18px, 3vw, 28px); font-weight: 500; color: var(--text); letter-spacing: 0; text-shadow: 0 1px 18px rgba(255,255,255,0.3); } #page-murmur .topbar .status{ position:absolute; left: calc(var(--side-pad) + 48px); top: calc(env(safe-area-inset-top) + clamp(14px, 2.5vw, 36px)); height:36px; display:inline-flex; align-items:center; font-family: var(--font-en), var(--font-cn); font-size: clamp(11px, 1.6vw, 14px); color: var(--text-soft); letter-spacing: 0; max-width: 24vw; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } #page-murmur .chat-app[data-conn="reconnecting"] .topbar .status{ color:var(--top-active-fg); } #page-murmur .topbar .status.typing{ color: var(--top-active-fg); font-weight: 500; text-shadow: 0 0 16px var(--top-typing-shadow); display: inline-flex; align-items: center; } #page-murmur .typing-dots{ display:inline-flex; align-items:center; gap:3px; margin-left:6px; } #page-murmur .typing-dots i{ width:4px; height:4px; border-radius:50%; background:currentColor; animation: typingDot 1.25s ease-in-out infinite; } #page-murmur .typing-dots i:nth-child(2){ animation-delay:.16s; } #page-murmur .typing-dots i:nth-child(3){ animation-delay:.32s; } @keyframes typingDot{ 0%,70%,100%{ transform:translateY(0); opacity:.4; } 35%{ transform:translateY(-3px); opacity:1; } } #page-murmur .avatar:focus-visible, #page-murmur .backbtn:focus-visible, #page-murmur button:focus-visible, #page-murmur textarea:focus-visible, #page-murmur input:focus-visible{ outline: 2px solid var(--accent); outline-offset: 3px; } #page-murmur .scroll{ flex: 1 1 auto; overflow-y: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; overflow-anchor: none; padding: clamp(14px, 2.4vw, 28px) var(--side-pad) var(--composer-zone); display: flex; flex-direction: column; transition: padding-bottom .28s cubic-bezier(.2,.8,.2,1); } #page-murmur .scroll::-webkit-scrollbar{ width:0; height:0; } #page-murmur .v-spacer{ flex: 0 0 auto; width: 100%; min-height: 0; pointer-events: none; } #page-murmur .day{ align-self: center; margin: 0; font-family: var(--font-en), var(--font-cn); font-size: clamp(12px, 1.6vw, 16px); color: var(--text-faint); padding: 0; border-radius: 0; background: transparent; border: none; } #page-murmur .row{ display:flex; position:relative; margin-top: clamp(20px, 3vw, 34px); } /* a35 间距放大 */ #page-murmur .day + .row{ margin-top: clamp(12px, 1.8vw, 20px); } #page-murmur .new-divider{ display:flex; align-items:center; justify-content:center; gap: clamp(16px, 2.4vw, 24px); margin: clamp(16px, 2.4vw, 28px) 0 clamp(12px, 1.8vw, 20px); color: var(--text-faint); font-family: var(--font-en), var(--font-cn); font-size: clamp(12px, 1.6vw, 16px); line-height:1; letter-spacing:0; } #page-murmur .new-divider::before, #page-murmur .new-divider::after{ content:""; width: clamp(94px, 24vw, 226px); height:1px; background: var(--hairline); } #page-murmur .row.grouped{ margin-top: clamp(8px, 1.2vw, 14px); } /* a35 连发间距也放大 */ #page-murmur .row.human{ justify-content: flex-end; } #page-murmur .row.ai{ justify-content: flex-start; padding-left: calc(var(--avatar-size) + clamp(10px, 1.6vw, 16px)); } #page-murmur .row.ai::before{ content:""; position:absolute; left:0; top: clamp(5px, 1vw, 9px); width: var(--avatar-size); height: var(--avatar-size); border-radius: 50%; background-image: var(--avatar-default); background-size: cover; background-position: center; box-shadow: 0 12px 24px rgba(24,46,67,0.14); } /* Your own avatar slot: once one is picked in Dials, body.has-human-avatar goes on and your side of the chat shows it */ body.has-human-avatar #page-murmur .row.human{ padding-right: calc(var(--avatar-size) + clamp(10px, 1.6vw, 16px)); } body.has-human-avatar #page-murmur .row.human::before{ content:""; position:absolute; right:0; top: clamp(5px, 1vw, 9px); width: var(--avatar-size); height: var(--avatar-size); border-radius: 50%; background-image: var(--avatar-human, none); background-size: cover; background-position: center; box-shadow: 0 12px 24px rgba(24,46,67,0.14); } #page-murmur .bubble{ /* a49 每行再窄两个字（约 30px），估高器 06-virtual-list 的 estCharsPerLine 同步 */ max-width: min(calc(61vw - 30px), 476px); padding: clamp(10px, 1.3vw, 14px) clamp(16px, 2vw, 21px) clamp(10px, 1.3vw, 14px); /* a39 内衬放宽（用户红笔标边） */ border-radius: 20px; position: relative; font-family: "InsLenggan", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Noto Sans SC", sans-serif; font-size: clamp(14px, 1.55vw, 16px); line-height: 1.58; word-wrap: break-word; overflow-wrap: break-word; animation: pop .24s cubic-bezier(.2,.8,.2,1) both; background: var(--bubble-bg, rgba(248,249,252,.40)); border: 1px solid var(--bubble-line, rgba(255,255,255,0)); box-shadow: 0 1px 2px var(--bubble-shadow); /* a117 阴影贴边:随下方 a106 规则一并收到 0 1px 2px */ /* a23：气泡近实色后，重雾退役，留一口薄雾衔接壁纸 */ -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); } #page-murmur .row[data-vkey] .bubble, #page-murmur .row[data-vkey] .think-block{ animation: none; } @keyframes pop{ from{ transform: translateY(5px) scale(.99);} to{ transform:none;} } #page-murmur .row[data-vkey].enter-human .bubble{ transform-origin: bottom right; animation: enterHuman .44s cubic-bezier(.34,1.46,.5,1) both; } #page-murmur .row[data-vkey].enter-ai .bubble{ transform-origin: bottom left; animation: enterAi .44s cubic-bezier(.34,1.46,.5,1) both; } @keyframes enterHuman{ from{ transform: translate(6px, 9px) scale(.95); opacity:0; } 55%{ opacity:1; } to{ transform:none; opacity:1; } } @keyframes enterAi{ from{ transform: translate(-6px, 9px) scale(.95); opacity:0; } 55%{ opacity:1; } to{ transform:none; opacity:1; } } #page-murmur .row.ai .bubble{ --bubble-bg: var(--bubble-ai-bg); --bubble-line: var(--bubble-ai-line); color: var(--bubble-ai-fg); } #page-murmur .row.human .bubble{ --bubble-bg: var(--bubble-human-bg); --bubble-line: var(--bubble-human-line); color: var(--bubble-human-fg); } #page-murmur .bubble .txt{ white-space: pre-wrap; font-family: "InsLenggan", "PingFang SC", "Noto Sans SC", sans-serif; } /* a100 章鱼保腿：连续空格不折叠；\n 早被 renderText 吃成
，不会双倍换行 */ #page-murmur .bubble.has-att{ display:flex; flex-direction:column; gap:6px; } #page-murmur .bubble.att-only{ background:transparent !important; padding:0 !important; box-shadow:none !important; } #page-murmur .att-img-link{ display:block; line-height:0; border-radius:14px; overflow:hidden; width:min(64vw,260px); aspect-ratio:var(--att-ratio, 1.04); max-height:340px; background:rgba(125,128,135,.10); } /* Images are wider than the bubble cap, so bubbles with attachments widen to fit image + 34px padding */ #page-murmur .bubble.has-att{ max-width:min(calc(64vw + 22px), 520px); } /* a98 内衬 11px 随动 */ #page-murmur .att-img{ display:block; width:100%; height:100%; object-fit:cover; border-radius:14px; } #page-murmur .att-file{ display:flex; align-items:center; gap:10px; padding:9px 11px; min-width:170px; max-width:250px; text-decoration:none; color:inherit; background:rgba(125,128,135,.12); border-radius:12px; } #page-murmur .att-file-ic{ flex:0 0 auto; width:36px; height:36px; display:grid; place-items:center; border-radius:9px; background:rgba(125,128,135,.20); } #page-murmur .att-file-ic svg{ width:20px; height:20px; opacity:.85; } #page-murmur .att-file-meta{ display:flex; flex-direction:column; min-width:0; } #page-murmur .att-file-name{ font-size:13px; font-weight:600; line-height:1.3; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } #page-murmur .att-file-size{ font-size:11px; opacity:.6; margin-top:2px; } #page-murmur .att-uploading{ opacity:.62; } #page-murmur .att-img-dead img{ display:none; } #page-murmur .att-img-dead::after{ content:"⚠ 图片已失效"; display:inline-block; padding:16px 20px; font-size:12px; color:var(--text-faint); background:rgba(125,128,135,.14); border-radius:14px; } #page-murmur .att-failed{ outline:1.5px solid #e3534d; outline-offset:1px; } #page-murmur .bubble .txt a{ color: inherit; text-decoration: underline; text-underline-offset: 2px; } #page-murmur .bubble .txt code{ font-family: ui-monospace, "SF Mono", Menlo, monospace; font-size: .92em; background: rgba(120,100,80,0.14); padding: 1px 5px; border-radius: 5px; } #page-murmur .bubble .txt strong{ font-weight: 700; } #page-murmur .meta{ display:inline; margin-left: clamp(10px, 1.4vw, 16px); white-space: nowrap; font-family: var(--font-en), var(--font-cn); font-size: clamp(11px, 1.3vw, 14px); color: var(--text-faint); user-select:none; vertical-align: baseline; } #page-murmur .meta .tick{ color: var(--tick); margin-left: 7px; letter-spacing:0; } #page-murmur .meta .state{ color: var(--accent); } #page-murmur .meta .fail{ color:#c0533f; cursor:pointer; } #page-murmur .row.human .meta, #page-murmur .row.ai .meta{ color: var(--text-faint); } #page-murmur .row.human .meta .tick, #page-murmur .row.ai .meta .tick{ color: var(--tick); } #page-murmur .meta .tick.clock{ color: var(--tick); } #page-murmur .meta .tick.clock svg{ width: 1.05em; height: 1.05em; vertical-align: -0.18em; } #page-murmur .row.think{ justify-content: flex-start; padding-left: calc(var(--avatar-size) + clamp(10px, 1.6vw, 16px)); padding-right: 0; /* a46 胶囊属于下面那条 AI 回复——离上一条消息远，贴自己的回复近 */ margin-top: clamp(18px, 2.8vw, 30px); margin-bottom: 0; } #page-murmur .row.think.think-open{ justify-content: center; padding-left: 0; padding-right: 0; margin-top: clamp(20px, 3.2vw, 34px); margin-bottom: clamp(18px, 2.8vw, 28px); } #page-murmur .think-block{ width: min(61vw, 506px); max-width: min(61vw, 506px); color: var(--think-body); text-align: left; animation: pop .24s cubic-bezier(.2,.8,.2,1) both; } #page-murmur .think-block.open{ width: 100%; max-width: min(100%, 760px); text-align: center; } #page-murmur .think-toggle{ appearance: none; -webkit-appearance: none; width: auto; max-width: 100%; padding: 0; border: 0; background: transparent; color: inherit; font: inherit; cursor: pointer; display: inline-flex; align-items: center; border-radius: 999px; } #page-murmur .think-block:not(.open) .think-toggle{ padding: 3px 9px; background: linear-gradient(135deg, var(--think-glass-hi), transparent 42%), var(--think-panel-bg); border: 1px solid var(--think-panel-line); box-shadow: inset 0 1px 0 var(--think-glass-hi), 0 8px 24px var(--think-glass-shadow); -webkit-backdrop-filter: blur(22px) saturate(1.55); backdrop-filter: blur(22px) saturate(1.55); } #page-murmur .think-block.open .think-toggle{ width: 100%; display: flex; flex-direction: column; align-items: center; gap: clamp(9px, 1.8vw, 14px); } #page-murmur .think-toggle:hover .think-caption{ color: var(--accent); } #page-murmur .think-toggle:active{ transform: translateY(1px); } #page-murmur .think-rule{ display: none; position: relative; width: 100%; height: 1px; color: var(--think-flourish); } #page-murmur .think-block.open .think-rule{ display: block; } #page-murmur .think-rule::before{ content: ""; position: absolute; left: clamp(22px, 6vw, 64px); right: clamp(22px, 6vw, 64px); top: 0; height: 1px; background: linear-gradient(90deg, transparent, var(--think-flourish) 16%, var(--think-flourish) 84%, transparent); opacity: .46; } #page-murmur .think-caption{ display: inline-flex; align-items: center; justify-content: flex-start; gap: 6px; color: var(--think-label); font-family: var(--font-en), var(--font-cn); font-size: clamp(12px, 1.38vw, 14px); line-height: 1.1; letter-spacing: .08em; transition: color var(--motion-fast) var(--ease-soft); } #page-murmur .think-caption-star, #page-murmur .think-state{ color: var(--think-flourish); font-size: 1.18em; line-height: 1; transform: translateY(-.02em); } #page-murmur .think-block.open .think-caption-star{ display: none; } #page-murmur .think-state::before{ content: "✧"; } #page-murmur .think-block.open .think-state::before{ content: "✦"; } #page-murmur .think-body[hidden]{ display: none !important; } #page-murmur .think-body{ margin-top: clamp(12px, 2.2vw, 20px); } #page-murmur .think-text{ width: min(82%, 520px); margin: 0 auto clamp(16px, 2.6vw, 24px); padding: clamp(12px, 2.2vw, 18px) clamp(14px, 3vw, 24px); border: 1px solid var(--think-panel-line); border-radius: 22px; background: linear-gradient(135deg, var(--think-glass-hi), transparent 38%), var(--think-panel-bg); box-shadow: inset 0 1px 0 var(--think-glass-hi), inset 0 -1px 0 rgba(255,255,255,.10), 0 14px 36px var(--think-glass-shadow); color: var(--think-body); font-family: var(--font-cn); font-size: clamp(12px, 1.25vw, 13.5px); line-height: 1.72; text-align: center; white-space: normal; overflow-wrap: break-word; -webkit-backdrop-filter: blur(26px) saturate(1.65); backdrop-filter: blur(26px) saturate(1.65); } #page-murmur .think-starline{ position: relative; width: 100%; height: 24px; display: flex; align-items: center; justify-content: center; color: var(--think-flourish); } #page-murmur .think-starline::before, #page-murmur .think-starline::after{ content: ""; position: absolute; top: 50%; height: 1px; background: linear-gradient(90deg, transparent, var(--think-flourish) 15%, var(--think-flourish) 85%, transparent); opacity: .5; } #page-murmur .think-starline::before{ left: 0; right: calc(50% + 34px); } #page-murmur .think-starline::after{ left: calc(50% + 34px); right: 0; } #page-murmur .think-star{ position: relative; z-index: 1; color: var(--think-flourish); display: grid; place-items: center; } #page-murmur .think-star svg{ width: 24px; height: 24px; display: block; } #page-murmur .think-copy{ min-width: 0; } #page-murmur .think-copy a{ color: inherit; text-decoration: underline; text-underline-offset: 2px; } #page-murmur .think-copy code{ font-family: ui-monospace, "SF Mono", Menlo, monospace; font-size: .9em; background: rgba(120,100,80,0.10); padding: 1px 5px; border-radius: 5px; } #page-murmur .think-caption, #page-murmur .think-text, #page-murmur .act-label, #page-murmur .act-detail, #page-murmur .act-k, #page-murmur .act-v{ text-shadow: var(--think-text-shadow); } #page-murmur .row.act{ justify-content: flex-start; padding-left: calc(var(--avatar-size) + clamp(10px, 1.6vw, 16px)); padding-right: clamp(12px, 4vw, 40px); /* a46 同 .row.think：胶囊归属下面的回复 */ margin-top: clamp(18px, 2.8vw, 30px); margin-bottom: 0; } /* Rows following a chip hug it — that is what makes them read as one group */ #page-murmur .row.think + .row, #page-murmur .row.act + .row{ margin-top: clamp(5px, 0.9vw, 9px); } #page-murmur .act-block{ max-width: min(80vw, 470px); animation: pop .24s cubic-bezier(.2,.8,.2,1) both; } #page-murmur .act-toggle{ appearance: none; -webkit-appearance: none; margin: 0; padding: 2px 8px; border: 1px solid var(--think-panel-line); /* a72 收腰 */ border-radius: 999px; background: linear-gradient(135deg, var(--think-glass-hi), transparent 42%), var(--think-panel-bg); color: inherit; font: inherit; cursor: pointer; text-align: left; max-width: 100%; display: inline-flex; align-items: baseline; gap: 5px; box-shadow: inset 0 1px 0 var(--think-glass-hi), 0 8px 24px var(--think-glass-shadow); -webkit-backdrop-filter: blur(22px) saturate(1.55); backdrop-filter: blur(22px) saturate(1.55); } #page-murmur .act-toggle.bare{ cursor: default; } #page-murmur .act-toggle:focus-visible{ outline: none; } #page-murmur .act-glyph{ flex: none; color: var(--think-flourish); font-size: .92em; line-height: 1; transform: translateY(.06em); } #page-murmur .act-label{ color: var(--think-label); font-family: var(--font-cn); font-size: clamp(10.5px, 1.2vw, 12px); line-height: 1.42; letter-spacing: .02em; } #page-murmur .act-state{ flex: none; color: var(--think-flourish); font-size: .95em; line-height: 1; transform: translateY(.02em); transition: color var(--motion-fast) var(--ease-soft); } #page-murmur .act-state::before{ content: "✧"; } #page-murmur .act-block.open .act-state::before{ content: "✦"; } #page-murmur .act-toggle:hover .act-state{ color: var(--accent); } #page-murmur .act-toggle:hover .act-label{ color: var(--think-body); } #page-murmur .act-toggle:active{ transform: translateY(1px); } #page-murmur .act-detail[hidden]{ display: none !important; } #page-murmur .act-detail{ margin-top: 8px; border-radius: 22px; background: linear-gradient(135deg, var(--think-glass-hi), transparent 38%), var(--think-panel-bg); border: 1px solid var(--think-panel-line); box-shadow: inset 0 1px 0 var(--think-glass-hi), inset 0 -1px 0 rgba(255,255,255,.10), 0 14px 36px var(--think-glass-shadow); padding: clamp(9px, 1.6vw, 13px) clamp(11px, 1.8vw, 14px); font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; font-size: 12px; line-height: 1.6; color: var(--think-body); overflow-x: auto; animation: pop .2s cubic-bezier(.2,.8,.2,1) both; -webkit-backdrop-filter: blur(26px) saturate(1.65); backdrop-filter: blur(26px) saturate(1.65); } #page-murmur .act-step + .act-step{ margin-top: 7px; padding-top: 7px; border-top: 1px dashed var(--field-line); } #page-murmur .act-line{ white-space: pre-wrap; overflow-wrap: anywhere; } #page-murmur .act-k{ color: var(--think-body); opacity:.58; user-select: none; } #page-murmur .act-v{ color: var(--think-body); } #page-murmur .composer{ position: fixed; left: 0; right: 0; bottom: 0; z-index: 100; width: min(100vw, var(--ref-width)); margin: 0 auto; display:flex; align-items:center; gap: clamp(6px, 1vw, 12px); background: transparent; border:none; padding: 0 var(--side-pad) clamp(10px, 1.6vw, 18px); padding-bottom: calc(clamp(10px, 1.6vw, 18px) + env(safe-area-inset-bottom)); transform: translate3d(0, calc(-1 * var(--keyboard-offset)), 0); -webkit-transform: translate3d(0, calc(-1 * var(--keyboard-offset)), 0); transition: transform .28s cubic-bezier(.2,.8,.2,1); } #page-murmur .composer::before{ content:""; position:absolute; left:0; right:0; bottom:0; top: calc(-1 * var(--edge-fade-tail)); z-index:-1; pointer-events:none; background: linear-gradient(180deg, rgba(255,255,255,0), rgba(255,255,255,.40) var(--edge-fade-tail)); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); -webkit-mask-image: linear-gradient(180deg, transparent, #000 var(--edge-fade-tail)); mask-image: linear-gradient(180deg, transparent, #000 var(--edge-fade-tail)); } #page-murmur .floatbtn{ flex:none; width: clamp(36px, 5vw, 48px); height: clamp(36px, 5vw, 48px); border-radius:50%; border: none; background: transparent; color: var(--accent); display:grid; place-items:center; cursor:pointer; padding:0; transition: transform .15s ease, color .2s ease; } #page-murmur .floatbtn:active{ transform: scale(.9); color: var(--text); } #page-murmur .floatbtn:hover{ color: var(--text); } #page-murmur .floatbtn svg{ width: clamp(20px, 2.8vw, 28px); height: clamp(20px, 2.8vw, 28px); display:block; } #page-murmur .floatbtn.send{ background: var(--send-bg); color:#ffffff; box-shadow: 0 16px 32px rgba(41, 60, 78, 0.22); /* a51 发送键收进输入框内——比外置时代缩一圈，撑不动输入框高度 */ width: clamp(32px, 4.2vw, 42px); height: clamp(32px, 4.2vw, 42px); } #page-murmur .floatbtn.send svg{ width: clamp(16px, 2.2vw, 22px); height: clamp(16px, 2.2vw, 22px); } #page-murmur .floatbtn.send:hover{ color:#ffffff; } #page-murmur .floatbtn.send:active{ transform: scale(.97); } @keyframes send-go{ from{ transform: scale(.96); } to{ transform: scale(1); } } #page-murmur .floatbtn.send.send-go{ animation: send-go .22s cubic-bezier(.2,.8,.2,1); } @media (prefers-reduced-motion: reduce){ #page-murmur .floatbtn.send.send-go{ animation: none; } } #page-murmur .composer .field{ flex:1 1 auto; display:flex; align-items:center; gap: clamp(4px, 0.8vw, 10px); background: var(--field-bg); border: 1px solid var(--field-line); border-radius: 999px; padding: clamp(4px, 0.6vw, 8px) clamp(8px, 1.2vw, 14px) clamp(4px, 0.6vw, 8px) clamp(10px, 1.5vw, 16px); min-height: clamp(42px, 5.5vw, 56px); box-shadow: var(--shadow); transition: border-color .2s ease; } #page-murmur .composer .field:focus-within{ border-color: var(--field-line); } #page-murmur .composer textarea:focus, #page-murmur .composer textarea:focus-visible, #page-murmur .composer button:focus-visible{ outline: none; } #page-murmur textarea{ flex:1 1 auto; border:none; outline:none; resize:none; background:transparent; color: var(--text); font-family: var(--font-en), var(--font-cn); font-size: clamp(15px, 2vw, 18px); line-height:1.35; max-height: 110px; padding: 6px 0; margin:0; } #page-murmur textarea::placeholder{ color: var(--text-faint); opacity: 1; } #page-murmur .newmsg-pill{ position: fixed; left: 50%; z-index: 90; bottom: calc(clamp(78px, 13vw, 96px) + env(safe-area-inset-bottom)); display: inline-flex; align-items: center; gap: 5px; padding: 7px 14px 7px 11px; border: none; border-radius: 999px; background: rgba(34, 46, 60, .52); color: #fff; font-family: var(--font-en), var(--font-cn); font-size: 13px; line-height: 1; letter-spacing: .01em; -webkit-backdrop-filter: blur(10px) saturate(1.2); backdrop-filter: blur(10px) saturate(1.2); box-shadow: 0 8px 24px rgba(18, 28, 40, .26); cursor: pointer; opacity: 0; pointer-events: none; transform: translate3d(-50%, calc(8px - var(--keyboard-offset, 0px)), 0); transition: opacity .2s ease, transform .28s cubic-bezier(.2,.8,.2,1); } #page-murmur .newmsg-pill.show{ opacity: 1; pointer-events: auto; transform: translate3d(-50%, calc(-1 * var(--keyboard-offset, 0px)), 0); } #page-murmur .newmsg-pill svg{ width: 15px; height: 15px; flex: none; } @media (prefers-reduced-motion: reduce){ #page-murmur .newmsg-pill{ transition: opacity .2s ease; } } #page-murmur .hidden{ display:none !important; } #page-murmur .chat-app.kb .composer{ padding-bottom: 8px; } @media (max-width: 520px){ :root{ --side-pad: 16px; --header-h: 56px; --avatar-size: 32px; } #page-murmur .peerpill{ padding: 0 44px; } #page-murmur .peerpill .name{ font-size: 18px; } #page-murmur .topbar .status{ font-size: 11px; max-width: 22vw; } #page-murmur .row{ margin-top: 26px; } /* a35 间距放大 */ #page-murmur .row.grouped{ margin-top: 13px; } #page-murmur .row.ai{ padding-left: 42px; } #page-murmur .bubble{ max-width: min(63vw, 520px); font-size: 14px; letter-spacing: .022em; line-height: 1.62; padding: 10px 17px 10px; } /* a39 内衬放宽；a75 的 14.5 被用户退回；7-31 用户点单 14px+字距.022（a84 热补今转正）——现行定案 */ #page-murmur .meta{ font-size: 11px; margin-left: 8px; } #page-murmur .day{ font-size: 12px; } #page-murmur .new-divider{ font-size: 12px; margin: 14px 0 10px; } #page-murmur .composer{ gap: 5px; padding-left: 16px; padding-right: 16px; } #page-murmur .floatbtn{ width: 36px; height: 36px; } #page-murmur .floatbtn svg{ width: 20px; height: 20px; } #page-murmur .composer .field{ min-height: 42px; padding: 4px 8px 4px 12px; } #page-murmur textarea{ font-size: 15px; } #page-murmur .row.think{ padding-left: 42px; padding-right: 0; } #page-murmur .think-block{ width: min(63vw, 520px); max-width: min(63vw, 520px); } #page-murmur .think-block.open{ width: 100%; max-width: 100%; } #page-murmur .row.think.think-open{ padding-left: 0; padding-right: 0; } #page-murmur .think-caption{ font-size: 12.5px; letter-spacing: .07em; } #page-murmur .think-caption-star, #page-murmur .think-state{ font-size: 1.2em; } #page-murmur .think-body{ margin-top: 12px; } #page-murmur .think-text{ width: min(86%, 360px); font-size: 12px; line-height: 1.66; } #page-murmur .think-star svg{ width: 22px; height: 22px; } } #page-murmur #scroll, #page-murmur #scroll *{ -webkit-user-select:none !important; user-select:none !important; -webkit-touch-callout:none !important; } #page-murmur textarea, #page-murmur input, #page-murmur .composer, #page-murmur .composer *{ -webkit-user-select:text !important; user-select:text !important; -webkit-touch-callout:default !important; } #page-murmur .msg-menu{ position:fixed; inset:0; z-index:250; opacity:0; pointer-events:none; } #page-murmur .msg-menu.open{ opacity:1; pointer-events:auto; } #page-murmur .msg-menu-scrim{ position:absolute; inset:0; background:rgba(10,16,24,.30); -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px); opacity:0; transition:opacity .26s var(--ease-soft); } #page-murmur .msg-menu.open .msg-menu-scrim{ opacity:1; } #page-murmur .msg-menu-clone{ position:fixed !important; margin:0 !important; animation:none !important; pointer-events:none; box-sizing:border-box; box-shadow:0 22px 50px rgba(18,34,52,.30); transform:scale(1); transition:transform .26s var(--ease-soft); will-change:transform; } #page-murmur .msg-menu.open .msg-menu-clone{ transform:scale(1.02); } #page-murmur .msg-menu-clone.clone-human{ background:var(--bubble-human-bg) !important; color:var(--bubble-human-fg) !important; border-radius:20px !important; border:1px solid var(--bubble-human-line) !important; box-shadow:var(--soft-shadow) !important; } #page-murmur .msg-menu-clone.clone-ai{ background:var(--bubble-ai-bg) !important; color:var(--bubble-ai-fg) !important; border-radius:20px !important; border:1px solid var(--bubble-ai-line) !important; box-shadow:var(--soft-shadow) !important; } #page-murmur .msg-menu-actions{ position:fixed; display:flex; flex-direction:column; min-width:150px; padding:5px; border-radius:16px; background:var(--composer-bg); border:1px solid var(--hairline); box-shadow:var(--shadow); -webkit-backdrop-filter:blur(20px) saturate(1.4); backdrop-filter:blur(20px) saturate(1.4); opacity:0; transform:translateY(8px) scale(.96); transform-origin:top center; transition:opacity .2s var(--ease-soft) .05s, transform .26s var(--ease-soft) .05s; } #page-murmur .msg-menu.open .msg-menu-actions{ opacity:1; transform:none; } #page-murmur .msg-act{ appearance:none; -webkit-appearance:none; border:0; background:transparent; color:var(--text); font-family:var(--font-en), var(--font-cn); font-size:15px; display:flex; align-items:center; gap:11px; padding:10px 14px; border-radius:12px; cursor:pointer; text-align:left; width:100%; transition:background var(--motion-fast); } #page-murmur .msg-act:hover{ background:var(--row-press); } #page-murmur .msg-act:active{ background:var(--row-press); transform:scale(.98); } #page-murmur .msg-act svg{ width:18px; height:18px; opacity:.82; flex:0 0 auto; } #page-murmur .msg-act.danger{ color:#e05a4d; } #page-murmur .row.think.api-trace, #page-murmur .row.act.api-trace{ padding-left:calc(var(--avatar-size) + clamp(10px,1.6vw,16px)); /* a46 胶囊归属下面那条回复——串首离上一条消息拉开，串内保持 3px 紧凑 */ margin-top:clamp(16px,2.4vw,26px); margin-bottom:0; } #page-murmur .row.think.api-trace + .row.think.api-trace, #page-murmur .row.think.api-trace + .row.act.api-trace, #page-murmur .row.act.api-trace + .row.act.api-trace, #page-murmur .row.act.api-trace + .row.think.api-trace{ margin-top:3px; } /* With tool rows embedded in the reply, bubble -> tool row also hugs */ #page-murmur .row.ai + .row.act.api-trace, #page-murmur .row.ai + .row.think.api-trace{ margin-top: clamp(5px, 0.9vw, 9px); } #page-murmur .row.think.api-trace.think-open{ justify-content:flex-start; padding-left:calc(var(--avatar-size) + clamp(10px,1.6vw,16px)); } #page-murmur .row.think.api-trace .think-block, #page-murmur .row.think.api-trace .think-block.open{ width:min(61vw,506px); max-width:min(61vw,506px); text-align:left; } #page-murmur .row.think.api-trace .think-caption, #page-murmur .row.act.api-trace .act-label{ font-size:11px; color:var(--text-faint); letter-spacing:.01em; } #page-murmur .row.think.api-trace .think-block.open .think-toggle{ width:auto; display:inline-flex; flex-direction:row; gap:5px; } #page-murmur .row.think.api-trace .think-rule, #page-murmur .row.think.api-trace .think-starline{ display:none !important; } #page-murmur .row.think.api-trace .think-body{ margin:4px 0 0 12px; } #page-murmur .row.think.api-trace .think-text{ width:auto; margin:0; color:var(--text-faint); font-size:11px; line-height:1.55; text-align:left; } #page-murmur .row.act.api-trace .act-detail{ margin:4px 0 0 12px; padding:0; border:0; border-radius:0; background:transparent; color:var(--text-faint); font-size:11px; font-family:var(--font-cn); line-height:1.5; } @media (prefers-reduced-motion: reduce){ #page-murmur *, #page-murmur *::before, #page-murmur *::after{ animation: none !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; } #page-murmur .call-wave i{ animation: callWave var(--dur, 1s) var(--ease-soft) var(--d, 0s) infinite alternate !important; } } /* ══════════ Murmur tab · SKIN 决议层（m11-m19 定案迁入，源=murmur.html style#2） ══════════ 迁移规则：聊天内部选择器加 #page-murmur 前缀；.app→.chat-app； html/body/星河栏级别的决议圈进 .chat-open（只在聊天 tab 生效，别的页面不受染）； 已死 DOM（terminalBtn/emojiBtn/login/profile）的隐藏令不搬。 */ :root{ --murmur-nav: 74px; /* a119 tab 回底 60(40管+10底+10余量) → a123 实测徽章冒头顶到输入框:+14 净空(徽章顶=nav上沿+11,composer field 下沿抬到 66+safe 留 5px 呼吸);composer-zone/newmsg-pill 跟变量自动让 */ --line:#c7cedd; --line-dim:rgba(199,206,221,.32); --text-dim:#8a91a6; --glow:rgba(216,179,106,.22); --font-script:"Pinyon Script",cursive; --bg:#F7FAFC; --header-bg:transparent; --hairline:rgba(199,206,221,.14); --text:#253447; --text-soft:#5E7080; --text-faint:#8A99A8; /* Whole-shell wallpaper (painted on the body layer). The chat page has its own --wall-default channel below. */ --wall-image: linear-gradient(180deg,#FBFDFF 0%,#F5F9FC 34%,#EFF4F9 78%,#ECF1F6 100%); /* Bubble roles: the two sides get their own tokens, near-opaque so the wallpaper never bleeds through, with a hairline + shadow lifting the message layer off the wall. The user's four custom bubble colours (inline, from custom-theme.js) still outrank all of this. */ --bubble-ai-bg:rgba(252,253,255,.95); --bubble-ai-fg:#253447; --bubble-ai-line:rgba(120,142,165,0); --bubble-human-bg:rgba(240,233,244,.96); --bubble-human-fg:#3a3247; --bubble-human-line:rgba(140,120,165,0); --bubble-shadow:rgba(74,93,108,.14); --accent:#4C6378; --send-bg:#4E6B89; --accent-fg:#ffffff; --tick:#7E93A4; --top-line:rgba(120,142,165,.24); --top-active-bg:rgba(140,160,176,.11); --top-active-fg:#4C6378; --top-typing-shadow:rgba(76,99,120,.22); --think-flourish:rgba(99,121,142,.52); --think-label:#6A7E8E; --think-body:#56697A; --think-panel-bg:rgba(255,255,255,.20); --think-panel-line:rgba(255,255,255,.18); --think-glass-hi:rgba(255,255,255,.14); --think-glass-shadow:rgba(18,24,32,.08); --think-text-shadow:0 1px 10px rgba(255,255,255,.72); --composer-bg:transparent; --field-bg:rgba(255,255,255,.55); --field-line:rgba(120,142,165,.18); /* the act-step dashed rule shares --field-line */ --shadow:0 18px 46px rgba(74,93,108,.10); --soft-shadow:0 14px 34px rgba(86,104,118,.08); --scrim:linear-gradient(180deg, rgba(255,255,255,.38), rgba(255,255,255,.12) 30%, rgba(255,255,255,.04) 68%, rgba(255,255,255,.22)); --card-bg:rgba(244,248,250,.42); --card-line:rgba(150,168,182,.12); --card-shadow:0 10px 28px rgba(70,92,108,.05); --seg-track:rgba(140,160,176,.11); --seg-thumb:rgba(255,255,255,.68); --seg-thumb-shadow:0 2px 8px rgba(40,60,78,.08); --row-press:rgba(140,160,176,.09); --slider-track:rgba(143,162,176,.28); --slider-thumb:#44627b; --info-ring:rgba(143,162,176,.38); --status-dot:#5fbf8f; /* Default chat wallpaper. A wallpaper picked in Dials overrides this through the inline variables written by custom-theme.js. */ --wall-default: linear-gradient(180deg,#FBFDFF 0%,#F5F9FC 34%,#EFF4F9 78%,#ECF1F6 100%); --menu-wall-default: var(--wall-default); /* composer 底部让出星河栏的高度；--vp-gap=浏览器工具栏吃掉的布局底（JS 实时量，PWA 里恒为 0） */ --composer-zone: calc(var(--composer-h) + 10px + var(--murmur-nav) + env(safe-area-inset-bottom) + var(--keyboard-offset) + var(--vp-gap, 0px)); } /* ── iOS 底部黑区 · m11：100vh 统一战——高度链不许混 auto/100%/dvh（只在聊天 tab 生效） ── */ html.chat-open, body.chat-open{ height:100vh; } html.chat-open{ overflow:hidden; overscroll-behavior:none; } body.chat-open{ position:static; overflow:hidden; overscroll-behavior:none; font-family:var(--font-cn); font-size:clamp(14px, 1.45vw, 16px); line-height:1.5; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; background-color:var(--bg); background-image:var(--wall-default); background-size:cover; background-position:center; } #page-murmur.page{ padding:0; } #page-murmur .chat-app{ position:relative; height:100vh; } #page-murmur .wall{ position:absolute; inset:0; width:100%; height:100%; } /* 顶/底白雾边缘渐隐：m16 拆除（夜色渐隐在浅色壁纸上糊成烟灰） */ #page-murmur .topbar::after{ background:none; } #page-murmur .composer::before{ display:none; } /* composer 抬到星河栏之上；键盘弹出时栏让位、composer 归位（m12 公式+m18 收 6px） */ #page-murmur .composer{ bottom: calc(var(--murmur-nav) + env(safe-area-inset-bottom) - 16px + var(--vp-gap, 0px)); padding-bottom: 8px; } /* a99 输入框贴近 tab 栏;a109 tab 上天曾置底,a119 tab 回底让位公式复役 */ body.kb nav.river-nav{ display:none; } body.kb #page-murmur .composer{ bottom: 0; } body:not(.kb) #page-murmur .newmsg-pill{ bottom: calc(clamp(78px, 13vw, 96px) + env(safe-area-inset-bottom) + var(--murmur-nav) + var(--vp-gap, 0px)); } /* ── a2 实色三件套 token（胶囊/输入框/tab栏退磨砂，固定主题色， an ink-brightness step plus a 1px hairline; a new skin only swaps these tokens） ── */ :root{ --solid-card:#fcfdff; /* card face (pills / input) */ --solid-bar:#eef3f8; /* tab bar */ --solid-line:rgba(255,255,255,.08);/* 细边保底 */ --solid-press:#edf2f7; /* a35 按压态：夜=同调抬亮（定案） */ --frost-card:rgba(252,253,255,.55); --frost-press:rgba(233,240,246,.72); } /* 顶栏=极简悬浮胶囊：名字＋状态（m14 压扁版；a2 改实色固定；a97 两侧都靠最左，回模型胶囊的老墙角） */ #page-murmur .topbar{ position:fixed; top:calc(env(safe-area-inset-top) + 10px); left:max(10px, calc(50vw - 205px)); width:auto; height:auto; padding:1px 11px; border:1px solid var(--solid-line); border-radius:999px; background:var(--solid-card); display:flex; align-items:center; gap:7px; z-index:60; box-shadow:0 8px 30px rgba(0,0,0,.30); } #page-murmur .topbar::after{ display:none; } #page-murmur .peerpill{ padding:0; flex-direction:row; align-items:baseline; gap:7px; } /* a2：胶囊底固定 → 名字/状态也固定跟主题字色，任何壁纸任何气泡自定义都读得清 */ #page-murmur .peerpill .name{ font-size:12px; color:var(--text); } #page-murmur .topbar .status{ position:static; max-width:none; font-size:9px; } /* 气泡磨砂与胶囊同参 */ #page-murmur .bubble{ -webkit-backdrop-filter:blur(18px) saturate(1.2); backdrop-filter:blur(18px) saturate(1.2); } /* a69 定案（推翻 a2 实色案）：顶部胶囊改有色磨砂，稍透（a96 起模型段/返回键并入顶栏，不再单独上妆） */ #page-murmur .topbar, #page-murmur .api-sessions, #page-murmur .cc-search-btn{ background:var(--frost-card); -webkit-backdrop-filter:blur(14px) saturate(1.15); backdrop-filter:blur(14px) saturate(1.15); } /* ── a96 模型名并入名字胶囊，住输入状态楼下（用户红笔：不与状态并排、胶囊尺寸不动） ── */ #page-murmur .pill-left{ display:flex; flex-direction:column; align-items:flex-start; justify-content:center; row-gap:1px; min-height:36px; } body:not(.api-mode) #page-murmur .topbar .status{ height:auto; max-width:30vw; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } /* ── a96 API 态返回键并入名字胶囊（由独立圆钮改为胶囊内左段，胶囊尺寸不动） ── */ #page-murmur .topbar .api-back{ position:static; width:auto; height:auto; border-radius:0; background:transparent; border:none; padding:0 3px 0 0; color:var(--text); display:none; align-items:center; justify-content:center; cursor:pointer; -webkit-tap-highlight-color:transparent; } body.api-mode #page-murmur .topbar .api-back{ display:flex; } #page-murmur .topbar .api-back svg{ width:16px; height:16px; } /* 点睛色跟随壳的 Dials 选择（补足 send 键等聊天专属 token） */ /* 顶栏退出文档流后，消息区自己留出胶囊的头部空间 */ #page-murmur .scroll{ padding-top: calc(env(safe-area-inset-top) + 46px); } /* 消息列宽度（a35 收窄；a49 再收窄；a118 反向加宽一档：每行多 3 个字≈41px——真生效的是这两条，上游 61vw 那些是空军。 390px 屏行宽账：内容 358 − 异侧空档 42 = 316px ≥ 68vw+13 = 278px，不顶破；估高器 06-virtual-list 同步 */ #page-murmur .bubble{ max-width:min(calc(60vw - 14px), 486px); } /* a123 回吐 2 字(a118 +3 净+1) */ @media (max-width: 520px){ #page-murmur .bubble{ max-width:calc(68vw - 14px); } /* a123 同批收 27px */ #page-murmur .think-block{ width:min(76vw, 520px); max-width:min(76vw, 520px); } #page-murmur .think-block.open{ width:100%; max-width:100%; } #page-murmur .att-img-link{ width:min(70vw, 300px); } #page-murmur .bubble.has-att{ max-width:min(calc(70vw + 22px), 322px); } /* a85 图更宽气泡跟着放；a98 内衬 11px 随动（图宽+2×内衬） */ } /* ── 星河底栏（a2 写实——固定主题色实底+细边，取代 m17 隐形毛化）——只在聊天 tab 换这身衣服 ── */ /* a10 tab 栏拉平：聊天页专属 nav 几何退役——聊天页原来吃全额安全区 padding，比其他四页高 18px （用户 a9 截图点名"murmur 的 tab 栏太高"）。现在五页共用 index 内联那一套几何+实色， 只留 vp-gap 跟浏览器工具栏（PWA 恒 0）和标签的浅底描边。 */ nav.river-nav{ bottom:calc(10px + env(safe-area-inset-bottom) + var(--vp-gap, 0px)); } /* a49 胶囊悬浮：这条在层叠末端，底距必须写在这 */ /* a12 的 7px 下移是贴底通栏时代的产物，胶囊悬浮后会把波浪压出管子——退役 */ @media (display-mode: standalone){ .riverband{ transform: none; } } /* a12 呼吸感 → a13 精确镜像：对面一侧留出与头像列等宽的空档， 两人气泡的左右边线严格重合（验收："还是无法对齐"——大概齐不行，要同一条线） */ #page-murmur .row.ai{ padding-right: calc(var(--avatar-size) + clamp(10px, 1.6vw, 16px)); } #page-murmur .row.human{ padding-left: calc(var(--avatar-size) + clamp(10px, 1.6vw, 16px)); } #page-murmur .bubble{ line-height: 1.62; padding: 7px 11px 7px; } /* tighter padding so the bubble hugs the text */ /* a98 一条消息拆多泡=只留首泡头像（❌ 图定稿），后续泡贴紧站队 */ #page-murmur .row.cont::before{ content:none; } #page-murmur .row.cont{ margin-top:7px; } body.chat-open nav.river-nav{ z-index:110; } /* a121 rlabel 夜影退役：胶囊改固定纯白后标签底不再是磨砂暗面，text-shadow 失义（blossom 同款覆写一并摘） */ /* ── m19 Markdown 全套的衣服（结构由 renderText 生成） ── */ #page-murmur .bubble .txt .md-pre{ background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.14); border-radius:10px; padding:8px 11px; margin:6px 0; overflow-x:auto; } #page-murmur .bubble .txt .md-pre code{ background:none; padding:0; font-size:.87em; line-height:1.55; white-space:pre; display:block; } #page-murmur .bubble .txt .md-ul, #page-murmur .bubble .txt .md-ol{ margin:4px 0; padding-left:20px; } #page-murmur .bubble .txt .md-ul li, #page-murmur .bubble .txt .md-ol li{ margin:2px 0; } #page-murmur .bubble .txt .md-quote{cursor:pointer;-webkit-tap-highlight-color:transparent; display:block; border-left:2px solid var(--accent); padding:2px 0 2px 10px; margin:6px 0; opacity:.94; } #page-murmur .bubble .txt .md-h{ display:block; font-weight:700; margin:8px 0 3px; } #page-murmur .bubble .txt .md-h1{ font-size:1.16em; } #page-murmur .bubble .txt .md-h2{ font-size:1.10em; } #page-murmur .bubble .txt .md-h3, #page-murmur .bubble .txt .md-h4{ font-size:1.03em; } #page-murmur .bubble .txt .md-hr{ display:block; height:1px; margin:9px 2px; background:linear-gradient(90deg,transparent,var(--line-dim),transparent); } #page-murmur .bubble .txt em{ font-style:italic; } #page-murmur .bubble .txt del{ opacity:.72; } /* ── 输入框（a2 实色跟主题，取代 m18 跟气泡案）——固定底配固定字，任何壁纸不盲打 ── */ #page-murmur .composer .field{ background: var(--solid-card); border-color: var(--solid-line); } #page-murmur .composer textarea{ color: var(--text); caret-color: var(--text); } #page-murmur .composer textarea::placeholder{ color: var(--text-dim); opacity:.8; } /* 总装验收暗号 */ #page-murmur .mstamp{position:fixed;top:calc(env(safe-area-inset-top) + 52px);right:10px;font-size:8px;letter-spacing:.14em;color:var(--text-dim);opacity:.75;font-family:var(--font-en);font-style:italic;pointer-events:none;z-index:400} /* ── a22 API 门：侧钮（返回/三横）+ 会话列表页（实色定案，退老磨砂） ── */ #page-murmur .api-side{ /* z above any floating decoration; generous hit area */ position:fixed; top:calc(env(safe-area-inset-top) + 10px); z-index:130; width:38px; height:38px; border-radius:50%; display:none; align-items:center; justify-content:center; background:var(--solid-card); color:var(--text); border:1px solid var(--solid-line); cursor:pointer; -webkit-tap-highlight-color:transparent; padding:0; } #page-murmur .api-side svg{ width:16px; height:16px; } #page-murmur .api-back{ left:max(10px, calc(50vw - 205px)); } /* a78 桌面上锚到 430 列边而非窗角 */ #page-murmur .api-sessions{ right:max(10px, calc(50vw - 205px)); } body.api-mode #page-murmur .api-side{ display:flex; } .session-scrim{ position:fixed; inset:0; z-index:249; background:rgba(12,18,28,.34); opacity:0; pointer-events:none; transition:opacity .28s ease; -webkit-tap-highlight-color:transparent; } .session-scrim.open{ opacity:1; pointer-events:auto; } .session-scrim[hidden]{ display:none !important; } .session-pop{ display:flex; flex-direction:column; position:fixed; top:0; right:0; bottom:0; z-index:250; width:min(340px, 88vw); padding:calc(env(safe-area-inset-top) + 14px) 14px calc(env(safe-area-inset-bottom) + 18px); background:rgba(255,255,255,.55); color:var(--text); border-left:1px solid rgba(255,255,255,.42); box-shadow:-18px 0 48px rgba(12,18,28,.14); -webkit-backdrop-filter: blur(28px) saturate(1.4); backdrop-filter: blur(28px) saturate(1.4); transform:translateX(104%); transition:transform .32s cubic-bezier(.22,.8,.24,1); overflow:hidden; -webkit-overflow-scrolling:touch; } .session-pop.open{ transform:translateX(0); } .session-pop[hidden]{ display:none !important; } .session-head{ display:grid; grid-template-columns:auto 1fr auto auto; align-items:center; gap:8px; padding:2px 2px 12px; flex:none; } .session-title{ font-family:"Great Vibes", "Segoe Script", "Apple Chancery", cursive; font-size:28px; font-weight:400; letter-spacing:.02em; color:var(--text); text-transform:none; line-height:1.1; min-width:0; padding-top:2px; } .session-nav-back, .session-back{ border:1px solid rgba(255,255,255,.5); background:rgba(255,255,255,.42); color:var(--text); width:34px; height:34px; border-radius:50%; font:inherit; font-size:22px; line-height:1; padding:0; cursor:pointer; display:grid; place-items:center; -webkit-backdrop-filter: blur(14px) saturate(1.25); backdrop-filter: blur(14px) saturate(1.25); box-shadow:inset 0 1px 0 rgba(255,255,255,.65); } .session-back{ display:none !important; } /* 菜单关闭靠点遮罩 / 右滑，不显示叉 */ .session-nav-back[hidden], .session-new[hidden]{ display:none !important; } .session-new{ border:1px solid color-mix(in srgb, var(--accent) 35%, rgba(255,255,255,.5)); border-radius:999px; padding:5px 12px; background:rgba(255,255,255,.42); -webkit-backdrop-filter: blur(14px) saturate(1.25); backdrop-filter: blur(14px) saturate(1.25); color:var(--accent); font:inherit; font-size:11.5px; cursor:pointer; box-shadow:inset 0 1px 0 rgba(255,255,255,.65); } .session-menu{ display:flex; flex-direction:column; gap:10px; padding:2px 1px 8px; flex:none; } .session-menu[hidden]{ display:none !important; } .session-list{ display:flex; flex-direction:column; gap:10px; flex:1; min-height:0; overflow:auto; padding:2px 1px 8px; -webkit-overflow-scrolling:touch; } .session-list[hidden]{ display:none !important; } .session-pop[data-view="search"] .session-search-panel, .session-pop[data-view="conv"] .session-list{ flex:1; min-height:0; } .session-item{ border:1px solid rgba(255,255,255,.55); width:100%; background:rgba(255,255,255,.42); -webkit-backdrop-filter: blur(18px) saturate(1.3); backdrop-filter: blur(18px) saturate(1.3); box-shadow:0 6px 20px rgba(20,28,40,.06), inset 0 1px 0 rgba(255,255,255,.65); color:var(--text); display:grid; grid-template-columns:1fr auto; align-items:center; gap:8px; padding:11px 12px; border-radius:14px; text-align:left; cursor:pointer; font:inherit; } .session-item.active{ border-color:var(--accent-soft); box-shadow:inset 3px 0 0 var(--accent); } .session-item:active{ background:rgba(255,255,255,.55); transform:scale(.992); } .session-main{ min-width:0; display:flex; flex-direction:column; align-items:flex-start; gap:3px; } .session-name{ font-size:14px; line-height:1.25; } .session-meta{ font-size:11px; color:var(--text-faint); } .session-preview{ font-size:11.5px; color:var(--text-soft); max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .session-rename{ border:0; background:transparent; color:var(--text-faint); width:30px; height:30px; border-radius:50%; display:grid; place-items:center; cursor:pointer; padding:0; } .session-rename svg{ width:15px; height:15px; display:block; } .session-actions{ position:fixed; inset:0; z-index:420; display:flex; align-items:flex-end; justify-content:center; padding:18px max(18px, env(safe-area-inset-right)) calc(18px + env(safe-area-inset-bottom)); background:rgba(8,11,19,.45); } .session-actions[hidden]{ display:none !important; } .session-actions-card{ width:min(100%,420px); padding:8px; border-radius:20px; background:var(--solid-card); border:1px solid var(--solid-line); box-shadow:0 18px 60px rgba(0,0,0,.35); } .session-actions-title{ padding:10px 12px 8px; color:var(--text-faint); font-size:12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .session-action{ width:100%; border:0; border-radius:13px; padding:13px; background:transparent; color:var(--text); font:inherit; text-align:center; cursor:pointer; } .session-action:active{ background:var(--solid-press, rgba(255,255,255,.06)); } .session-action.danger{ color:#c96a6a; } /* toast（a4 随 showToast 从 murmur.html 迁入；挂 body 上，聊天/壳通用） */ .toast{ position: fixed; left:50%; bottom: calc(40px + env(safe-area-inset-bottom)); transform: translate(-50%, 12px); z-index:300; background: rgba(20,34,48,.92); color:#eef5fb; font-size:14px; padding:10px 18px; border-radius:999px; box-shadow: 0 14px 34px rgba(0,0,0,.28); opacity:0; pointer-events:none; transition: opacity .24s ease, transform .24s ease; } .toast.show{ opacity:1; transform: translate(-50%, 0); } /* ── 壳色权守卫（2026-07-18 a1）── 房子的点睛色只由 Dials 的 gold/ice 管；custom-theme.js 写在 html 内联的旧"主色/正文色" 不许染壳里的其他页面（body 层变量压过 html 内联）。用户的气泡四件套/壁纸自定义照旧全归用户。 */ body[data-accent="base"]{ --accent:#4C6378; --accent-soft:rgba(76,99,120,.5); --glow:rgba(76,99,120,.16); --text:#253447; } /* ══════════ 三套皮肤 ══════════ 开关挂 html[data-theme]（app.js 的 hsSkin + 里的早读脚本，键名 chat-skin）。 权力次序与壳色权守卫同理： · html[data-theme] 层 = 皮肤改写 SKIN 决议层，仍让位于用户 html 内联的气泡四件套/壁纸自定义； · html[data-theme] body 层 = 皮肤结构色（正文/点睛/实色三件套），压过 custom-theme 旧主色； 门（gate）三套皮共用同一副深色造型——进门仪式感不随皮肤变。 */ /* ── nav capsule baseline for the light skins: bright glint, shallow shadow. Each skin block then tints it a shade of its own paper colour. [data-theme] and [data-theme="X"] have the same specificity (0,1,0), so this rule MUST stay above the skin blocks and yield by source order. ── */ html[data-theme]{ --nav-cap-hi:#fdfdfe; --nav-cap-lo:#f2f3f5; --nav-glint:rgba(255,255,255,.9); --nav-shadow:0 1px 2px rgba(20,26,38,.10),0 10px 24px rgba(20,26,38,.12); } /* ════ 雨青（celadon）· a46 选用的青瓷色卡：E2E4E5/CFE3DE/BAD6CF/A1C3BA/9AB8BA "雨过天青云破处"——雾白起，青瓷收，你那侧是薄荷瓷，AI 那侧是冷白瓷 ════ */ html[data-theme="celadon"]{ /* 壳 token */ --line:#7E9A92; --line-dim:rgba(94,120,112,.38); --hairline:rgba(120,150,140,.28); --text:#283B36; --text-dim:#7E958D; --accent:#527A72; --accent-soft:rgba(82,122,114,.5); --glow:rgba(82,122,114,.16); --nav-tint:#DCE4E3; --nav-cap-hi:#FDFEFD; --nav-cap-lo:#F1F7F4; /* a121 nav 徽章浅档;a122 胶囊白蘸一成青白纸色(solid-bar #e9f2ee) */ /* 聊天 SKIN 改写 */ --bg:#F3F7F5; --header-bg:transparent; --wall-image: linear-gradient(180deg,#F7FAF8 0%,#EEF5F1 34%,#E4EFEA 78%,#DCE9E4 100%); --text-soft:#57706A; --text-faint:#82988F; /* 角色分层：虞=冷白瓷，文=薄荷青瓷，实体化+细边（沿 a23 会诊方向） */ --bubble-ai-bg:rgba(252,254,253,.95); --bubble-ai-fg:#283B36; --bubble-ai-line:rgba(120,150,140,0); --bubble-human-bg:rgba(216,232,226,.96); --bubble-human-fg:#2D423C; --bubble-human-line:rgba(122,158,146,0); --bubble-shadow:rgba(74,108,98,.14); --send-bg:#5F837A; --accent-fg:#ffffff; --tick:#7E9A92; /* a88 雨青发送键调淡 */ --top-line:rgba(120,150,140,.24); --top-active-bg:rgba(140,170,160,.12); --top-active-fg:#527A72; --top-typing-shadow:rgba(82,122,114,.22); --think-flourish:rgba(99,132,122,.52); --think-label:#6A837B; --think-body:#566B64; --think-panel-bg:rgba(255,255,255,.20); --think-panel-line:rgba(255,255,255,.18); --think-glass-hi:rgba(255,255,255,.14); --think-glass-shadow:rgba(18,32,28,.08); --think-text-shadow:0 1px 10px rgba(255,255,255,.72); --shadow:0 18px 46px rgba(74,108,98,.10); --soft-shadow:0 14px 34px rgba(86,118,108,.08); --scrim:linear-gradient(180deg, rgba(255,255,255,.38), rgba(255,255,255,.12) 30%, rgba(255,255,255,.04) 68%, rgba(255,255,255,.22)); --card-bg:rgba(244,250,247,.42); --card-line:rgba(150,178,168,.12); --card-shadow:0 10px 28px rgba(70,108,96,.05); --seg-track:rgba(140,170,160,.11); --seg-thumb:rgba(255,255,255,.68); --seg-thumb-shadow:0 2px 8px rgba(40,78,66,.08); --row-press:rgba(140,170,160,.09); --slider-track:rgba(143,176,166,.28); --slider-thumb:#486F66; --info-ring:rgba(143,176,166,.38); --status-dot:#5fbf8f; --wall-default:linear-gradient(180deg,#F7FAF8,#E7F1EC); --menu-wall-default:var(--wall-default); /* 实色三件套 · 青瓷台阶（底 F3F7F5 → 卡提白 → 栏压青一档） */ --solid-card:#f9fcfa; --solid-bar:#e9f2ee; --solid-line:rgba(40,59,54,.10); --solid-press:#edf2f7; --frost-card:rgba(250,253,252,.55); --frost-press:rgba(233,240,246,.72); } html[data-theme="celadon"] body{ background:#F3F7F5; } html[data-theme="celadon"] .sky{ background-color: transparent; background-image: radial-gradient(1.2px 1.2px at 18% 12%,rgba(82,122,114,.26) 50%,transparent 51%), radial-gradient(1px 1px at 73% 7%,rgba(82,122,114,.18) 50%,transparent 51%), radial-gradient(1px 1px at 88% 21%,rgba(82,122,114,.14) 50%,transparent 51%), radial-gradient(1.4px 1.4px at 9% 33%,rgba(82,122,114,.17) 50%,transparent 51%), radial-gradient(1px 1px at 62% 29%,rgba(82,122,114,.12) 50%,transparent 51%), radial-gradient(1px 1px at 34% 47%,rgba(82,122,114,.15) 50%,transparent 51%), radial-gradient(1.2px 1.2px at 81% 55%,rgba(82,122,114,.14) 50%,transparent 51%), radial-gradient(1px 1px at 15% 68%,rgba(82,122,114,.13) 50%,transparent 51%), radial-gradient(1px 1px at 55% 76%,rgba(82,122,114,.10) 50%,transparent 51%), radial-gradient(1.3px 1.3px at 90% 83%,rgba(82,122,114,.15) 50%,transparent 51%); } html[data-theme="celadon"] body.chat-open{ background-color:#F3F7F5; } html[data-theme="celadon"] .medal svg > circle:nth-of-type(3){ fill:rgba(255,255,255,.60); } html[data-theme="celadon"] #page-murmur .topbar{ box-shadow:0 8px 24px rgba(74,108,98,.16); } html[data-theme="celadon"] #page-murmur .bubble .txt .md-pre{ background:rgba(40,59,54,.05); border-color:rgba(40,59,54,.10); } /* 守卫的雨青分店：本色=青瓷；冰蓝沿通用深一档 */ html[data-theme="celadon"] body[data-accent="base"]{ --accent:#527A72; --accent-soft:rgba(82,122,114,.5); --glow:rgba(82,122,114,.16); --text:#283B36; } /* ════ 花信（blossom）· a46 豆沙×灰绿 → a118 用户给的新色卡整体调粉：FFE9ED/FFD1D7/E8C0C9/FFF9FA 花信风·樱：FFF9FA 是信纸底，磨砂走 FF 系亮粉（a119 卡片内里去灰：F5E6E8 隔着 blur 发闷， 底色升 FFF1F3/FFEFF2 家族，透明度不动），两粉分两侧（用户侧更粉），E8C0C9 走线脚边框点缀 ════ */ html[data-theme="blossom"]{ /* 壳 token */ --line:#C98FA0; --line-dim:rgba(201,143,160,.38); --hairline:rgba(200,145,160,.16); /* a121 压淡;a125 除灰:灰紫→玫瑰(用户给的 C98FA0 方向,装饰档放宽) */ --text:#463731; --text-dim:#A07A85; /* a125 除灰:主文往暖一丝(11.1:1 不牺牲);次级字灰褐→淡玫瑰(对比 3.67 反超原 3.44) */ --accent:#B57E86; --accent-soft:rgba(181,126,134,.5); --glow:rgba(181,126,134,.15); /* a88 豆沙→偏粉 */ --nav-tint:#F0E5E7; --nav-cap-hi:#FFFEFE; --nav-cap-lo:#FFF9FB; /* a122 蘸色→a126 随整屋再浅一档 */ /* 聊天 SKIN 改写 */ --bg:#FFFDFE; --header-bg:transparent; /* a126 随壁纸 0% 停 */ --wall-image: linear-gradient(180deg,#FFFDFE 0%,#FFFAFB 30%,#FFF5F7 65%,#FFEEF1 100%); /* a124 提亮→a126 卡片亮上来后背景再上一档(相对论追击) */ --text-soft:#6E5B55; --text-faint:#95867F; /* 角色分层 a123 用户换色：虞=白系 FFFDFD，文=浅樱粉 FFDDE2（用户侧仍更粉）；默认细边全皮退役(令牌置透明,custom 磨砂不在此列) */ --bubble-ai-bg:rgba(255,253,253,.96); --bubble-ai-fg:#403633; --bubble-ai-line:rgba(232,192,201,0); --bubble-human-bg:rgba(255,221,226,.96); --bubble-human-fg:#4A383C; --bubble-human-line:rgba(232,192,201,0); --bubble-shadow:rgba(170,105,125,.12); --send-bg:#C2848E; --accent-fg:#ffffff; --tick:#95867F; /* a88 发送键调淡+随粉 */ --top-line:rgba(200,145,160,.14); --top-active-bg:rgba(205,160,172,.12); /* a121 线条压淡 .24→.14 */ --top-active-fg:#B57E86; --top-typing-shadow:rgba(181,126,134,.20); --think-flourish:rgba(185,135,150,.50); --think-label:#8A736C; --think-body:#6E5B55; --think-panel-bg:rgba(255,255,255,.22); --think-panel-line:rgba(255,255,255,.18); --think-glass-hi:rgba(255,255,255,.15); --think-glass-shadow:rgba(40,28,24,.08); --think-text-shadow:0 1px 10px rgba(255,255,255,.72); --shadow:0 18px 46px rgba(170,105,125,.10); --soft-shadow:0 14px 34px rgba(170,105,125,.08); --scrim:linear-gradient(180deg, rgba(255,255,255,.38), rgba(255,255,255,.12) 30%, rgba(255,255,255,.04) 68%, rgba(255,255,255,.22)); --card-bg:rgba(255,246,248,.55); --card-line:rgba(232,192,201,.16); /* a125 除灰 FFE5EA→FFF6F8 */ --card-shadow:0 10px 28px rgba(170,100,120,.05); /* a119 卡底去灰:F5E6E8→FFF1F3;a121 卡边压淡 .40→.16 */ --seg-track:rgba(215,155,170,.12); --seg-thumb:rgba(255,255,255,.68); --seg-thumb-shadow:0 2px 8px rgba(140,80,100,.08); --row-press:rgba(215,155,170,.10); --slider-track:rgba(220,160,175,.28); --slider-thumb:#B57E86; --info-ring:rgba(220,160,175,.38); --status-dot:#8FAE94; --wall-default:linear-gradient(180deg,#FFFDFE,#FFF5F7); /* a126 同族跟停 */ --menu-wall-default:var(--wall-default); /* 实色三件套 · 信纸台阶（底 FFF9FA → 卡提白 → 栏压粉一档；a119 去灰:F5E6E8→FFEFF2） */ --solid-card:#FFFDFE; --solid-bar:#FFF9FB; --solid-line:rgba(232,192,201,.22); /* a126 胶囊追平背景层,不当屋里最深 */ /* a121 实机反馈点名:全屋描边太显眼 .50→.22(别家 .10 上下但色相深,玫瑰浅色相补两档) */ --solid-press:#edf2f7; --frost-card:rgba(255,243,246,.62); /* a124 FFE7EC→a125 需要除灰:宁浅不灰(FFF3F6),分离度交 card-shadow 兜底 */ --frost-press:rgba(233,240,246,.72); /* a125 随卡提亮保按压差(FFE9EE@.80,合成差 g9 可感) */ } html[data-theme="blossom"] body{ background:#FFFDFE; } /* a126 随提 */ html[data-theme="blossom"] .sky{ background-color: transparent; /* 星尘换成花瓣：a118 全粉两调——玫瑰为主，掺三粒深绛作层次（原灰绿叶随新色卡退役） */ background-image: radial-gradient(1.2px 1.2px at 18% 12%,rgba(214,120,140,.24) 50%,transparent 51%), radial-gradient(1px 1px at 73% 7%,rgba(214,120,140,.17) 50%,transparent 51%), radial-gradient(1px 1px at 88% 21%,rgba(172,116,138,.14) 50%,transparent 51%), radial-gradient(1.4px 1.4px at 9% 33%,rgba(214,120,140,.16) 50%,transparent 51%), radial-gradient(1px 1px at 62% 29%,rgba(214,120,140,.11) 50%,transparent 51%), radial-gradient(1px 1px at 34% 47%,rgba(172,116,138,.13) 50%,transparent 51%), radial-gradient(1.2px 1.2px at 81% 55%,rgba(214,120,140,.13) 50%,transparent 51%), radial-gradient(1px 1px at 15% 68%,rgba(214,120,140,.12) 50%,transparent 51%), radial-gradient(1px 1px at 55% 76%,rgba(172,116,138,.10) 50%,transparent 51%), radial-gradient(1.3px 1.3px at 90% 83%,rgba(214,120,140,.14) 50%,transparent 51%); } html[data-theme="blossom"] body.chat-open{ background-color:#FFFDFE; } /* a126 随提 */ /* a121 blossom rlabel 白影随夜影同批退役（白胶囊后失义） */ html[data-theme="blossom"] .medal svg > circle:nth-of-type(3){ fill:rgba(255,255,255,.60); } html[data-theme="blossom"] #page-murmur .topbar{ box-shadow:0 8px 24px rgba(170,105,125,.16); } html[data-theme="blossom"] #page-murmur .bubble .txt .md-pre{ background:rgba(64,54,51,.05); border-color:rgba(64,54,51,.10); } /* 守卫的花信分店：本色=豆沙；冰蓝沿通用深一档 */ html[data-theme="blossom"] body[data-accent="base"]{ --accent:#B57E86; --accent-soft:rgba(181,126,134,.5); --glow:rgba(181,126,134,.15); --text:#463731; } /* a88 豆沙→偏粉（本色档） */ /* ════ 山楂（haw）· 山楂之恋：E62F56 红 × FEF8E7 暖奶 × CFF0FE 浅蓝 × C60D3B 深红 ════ */ html[data-theme="haw"]{ --line:#E6828A; --line-dim:rgba(198,13,59,.18); --hairline:rgba(230,47,86,.14); --text:#3D1520; --text-dim:#B87A7A; --accent:#E62F56; --accent-soft:rgba(230,47,86,.5); --glow:rgba(230,47,86,.14); --nav-tint:#FDDDE2; --nav-cap-hi:#FFFEFA; --nav-cap-lo:#FEF8E7; --bg:#FEF8E7; --header-bg:transparent; --wall-image: linear-gradient(180deg,#FFF8F0 0%,#FEF3E5 30%,#FDE8E8 60%,#E8F6FE 100%); --text-soft:#6B3A3A; --text-faint:#B0888A; --bubble-ai-bg:rgba(255,254,250,.96); --bubble-ai-fg:#3D1520; --bubble-ai-line:rgba(230,47,86,0); --bubble-human-bg:rgba(207,240,254,.92); --bubble-human-fg:#1A3A4A; --bubble-human-line:rgba(207,240,254,0); --bubble-shadow:rgba(198,13,59,.10); --send-bg:#C60D3B; --accent-fg:#ffffff; --tick:#B87A7A; --top-line:rgba(230,47,86,.18); --top-active-bg:rgba(230,47,86,.08); --top-active-fg:#E62F56; --top-typing-shadow:rgba(230,47,86,.18); --think-flourish:rgba(198,13,59,.45); --think-label:#E62F56; --think-body:#6B3A3A; --think-panel-bg:rgba(255,255,255,.22); --think-panel-line:rgba(255,255,255,.20); --think-glass-hi:rgba(255,255,255,.15); --think-glass-shadow:rgba(60,20,30,.07); --think-text-shadow:0 1px 10px rgba(255,255,255,.75); --shadow:0 18px 46px rgba(198,13,59,.08); --soft-shadow:0 14px 34px rgba(198,13,59,.06); --scrim:linear-gradient(180deg, rgba(255,255,255,.40), rgba(255,255,255,.14) 30%, rgba(255,255,255,.05) 68%, rgba(255,255,255,.24)); --card-bg:rgba(255,255,255,.55); --card-line:rgba(230,47,86,.10); --card-shadow:0 10px 28px rgba(198,13,59,.05); --seg-track:rgba(230,47,86,.08); --seg-thumb:rgba(220,244,255,.80); --seg-thumb-shadow:0 2px 8px rgba(198,13,59,.08); --row-press:rgba(230,47,86,.06); --slider-track:rgba(230,47,86,.22); --slider-thumb:#C60D3B; --info-ring:rgba(230,47,86,.30); --status-dot:#5fbf8f; --wall-default:linear-gradient(180deg,#FFF8F0,#E8F6FE); --menu-wall-default:var(--wall-default); --solid-card:#FFFFFF; --solid-bar:#FEF8E7; --solid-line:rgba(198,13,59,.10); --solid-press:#fdf0e0; --frost-card:rgba(255,255,255,.58); --frost-press:rgba(253,240,220,.72); } html[data-theme="haw"] body{ background:#FEF8E7; } html[data-theme="haw"] .sky{ background-color: transparent; background-image: radial-gradient(1.2px 1.2px at 18% 12%,rgba(230,47,86,.20) 50%,transparent 51%), radial-gradient(1px 1px at 73% 7%,rgba(230,47,86,.14) 50%,transparent 51%), radial-gradient(1px 1px at 88% 21%,rgba(100,180,220,.22) 50%,transparent 51%), radial-gradient(1.4px 1.4px at 9% 33%,rgba(230,47,86,.15) 50%,transparent 51%), radial-gradient(1px 1px at 62% 29%,rgba(230,47,86,.09) 50%,transparent 51%), radial-gradient(1px 1px at 34% 47%,rgba(100,180,220,.20) 50%,transparent 51%), radial-gradient(1.2px 1.2px at 81% 55%,rgba(230,47,86,.11) 50%,transparent 51%), radial-gradient(1px 1px at 15% 68%,rgba(230,47,86,.10) 50%,transparent 51%), radial-gradient(1px 1px at 55% 76%,rgba(100,180,220,.18) 50%,transparent 51%), radial-gradient(1.3px 1.3px at 90% 83%,rgba(230,47,86,.12) 50%,transparent 51%); } html[data-theme="haw"] body.chat-open{ background-color:#FEF8E7; } html[data-theme="haw"] .medal svg > circle:nth-of-type(3){ fill:rgba(255,255,255,.65); } html[data-theme="haw"] #page-murmur .topbar{ box-shadow:0 8px 24px rgba(198,13,59,.12); } html[data-theme="haw"] #page-murmur .bubble .txt .md-pre{ background:rgba(61,21,32,.04); border-color:rgba(61,21,32,.08); } html[data-theme="haw"] body[data-accent="base"]{ --accent:#E62F56; --accent-soft:rgba(230,47,86,.5); --glow:rgba(230,47,86,.14); --text:#3D1520; } /* ════ 薄巧（choco）· 淡甜薄巧：b5dfd4 薄荷 × 8d7a69 巧克力 × d1c3b6 奶茶 × f5f1ec 暖白 ════ */ html[data-theme="choco"]{ --line:#d1c3b6; --line-dim:rgba(141,122,105,.30); --hairline:rgba(141,122,105,.18); --text:#3D3228; --text-dim:#8d7a69; --accent:#6bb5a6; --accent-soft:rgba(107,181,166,.5); --glow:rgba(107,181,166,.14); --nav-tint:#E4F0ED; --nav-cap-hi:#FDFCFB; --nav-cap-lo:#F5F1EC; --bg:#f5f1ec; --header-bg:transparent; --wall-image: linear-gradient(180deg,#FAF8F5 0%,#F5F1EC 34%,#F0EBE4 78%,#EBE5DC 100%); --text-soft:#6B5E52; --text-faint:#A0937E; --bubble-ai-bg:rgba(255,253,250,.96); --bubble-ai-fg:#3D3228; --bubble-ai-line:rgba(141,122,105,0); --bubble-human-bg:rgba(181,223,212,.88); --bubble-human-fg:#2A3D38; --bubble-human-line:rgba(181,223,212,0); --bubble-shadow:rgba(141,122,105,.10); --send-bg:#6bb5a6; --accent-fg:#ffffff; --tick:#A0937E; --top-line:rgba(141,122,105,.20); --top-active-bg:rgba(107,181,166,.10); --top-active-fg:#6bb5a6; --top-typing-shadow:rgba(107,181,166,.22); --think-flourish:rgba(107,181,166,.45); --think-label:#6bb5a6; --think-body:#6B5E52; --think-panel-bg:rgba(255,255,255,.22); --think-panel-line:rgba(255,255,255,.20); --think-glass-hi:rgba(255,255,255,.15); --think-glass-shadow:rgba(50,38,28,.06); --think-text-shadow:0 1px 10px rgba(255,255,255,.75); --shadow:0 18px 46px rgba(141,122,105,.08); --soft-shadow:0 14px 34px rgba(141,122,105,.06); --scrim:linear-gradient(180deg, rgba(255,255,255,.40), rgba(255,255,255,.14) 30%, rgba(255,255,255,.05) 68%, rgba(255,255,255,.22)); --card-bg:rgba(249,245,240,.50); --card-line:rgba(209,195,182,.30); --card-shadow:0 10px 28px rgba(141,122,105,.04); --seg-track:rgba(107,181,166,.10); --seg-thumb:rgba(255,255,255,.70); --seg-thumb-shadow:0 2px 8px rgba(141,122,105,.08); --row-press:rgba(141,122,105,.06); --slider-track:rgba(141,122,105,.22); --slider-thumb:#5a9e90; --info-ring:rgba(107,181,166,.35); --status-dot:#5fbf8f; --wall-default:linear-gradient(180deg,#FAF8F5,#F0EBE4); --menu-wall-default:var(--wall-default); --solid-card:#FDFCFB; --solid-bar:#F5F1EC; --solid-line:rgba(141,122,105,.12); --solid-press:#ede7e0; --frost-card:rgba(249,245,240,.58); --frost-press:rgba(240,234,226,.72); } html[data-theme="choco"] body{ background:#f5f1ec; } html[data-theme="choco"] .sky{ background-color: transparent; background-image: radial-gradient(1.2px 1.2px at 18% 12%,rgba(181,223,212,.28) 50%,transparent 51%), radial-gradient(1px 1px at 73% 7%,rgba(141,122,105,.16) 50%,transparent 51%), radial-gradient(1px 1px at 88% 21%,rgba(181,223,212,.18) 50%,transparent 51%), radial-gradient(1.4px 1.4px at 9% 33%,rgba(141,122,105,.14) 50%,transparent 51%), radial-gradient(1px 1px at 62% 29%,rgba(181,223,212,.15) 50%,transparent 51%), radial-gradient(1px 1px at 34% 47%,rgba(141,122,105,.12) 50%,transparent 51%), radial-gradient(1.2px 1.2px at 81% 55%,rgba(181,223,212,.16) 50%,transparent 51%), radial-gradient(1px 1px at 15% 68%,rgba(141,122,105,.11) 50%,transparent 51%), radial-gradient(1px 1px at 55% 76%,rgba(181,223,212,.13) 50%,transparent 51%), radial-gradient(1.3px 1.3px at 90% 83%,rgba(141,122,105,.13) 50%,transparent 51%); } html[data-theme="choco"] body.chat-open{ background-color:#f5f1ec; } html[data-theme="choco"] .medal svg > circle:nth-of-type(3){ fill:rgba(255,255,255,.65); } html[data-theme="choco"] #page-murmur .topbar{ box-shadow:0 8px 24px rgba(141,122,105,.12); } html[data-theme="choco"] #page-murmur .bubble .txt .md-pre{ background:rgba(61,50,40,.04); border-color:rgba(61,50,40,.08); } html[data-theme="choco"] body[data-accent="base"]{ --accent:#6bb5a6; --accent-soft:rgba(107,181,166,.5); --glow:rgba(107,181,166,.14); --text:#3D3228; } /* ════ 白雪（snow）· 纯银无彩：F1F2F1 雪白 × E1E1E1 浅灰 × D7D7D7 中灰 × CCCCCC 银 × C0C0C0 深银 ════ */ html[data-theme="snow"]{ --line:#C0C0C0; --line-dim:rgba(192,192,192,.50); --hairline:rgba(204,204,204,.45); --text:#2D2D2D; --text-dim:#8A8A8A; --accent:#9A9A9A; --accent-soft:rgba(154,154,154,.5); --glow:rgba(154,154,154,.12); --nav-tint:#E8E8E8; --nav-cap-hi:#FAFAFA; --nav-cap-lo:#F1F2F1; --bg:#F1F2F1; --header-bg:transparent; --wall-image: linear-gradient(180deg,#F8F8F8 0%,#F1F2F1 34%,#EBEBEB 78%,#E5E5E5 100%); --text-soft:#5A5A5A; --text-faint:#9A9A9A; --bubble-ai-bg:rgba(255,255,255,.96); --bubble-ai-fg:#2D2D2D; --bubble-ai-line:rgba(192,192,192,0); --bubble-human-bg:rgba(225,225,225,.92); --bubble-human-fg:#2D2D2D; --bubble-human-line:rgba(225,225,225,0); --bubble-shadow:rgba(0,0,0,.06); --send-bg:#9A9A9A; --accent-fg:#ffffff; --tick:#AAAAAA; --top-line:rgba(192,192,192,.35); --top-active-bg:rgba(192,192,192,.12); --top-active-fg:#7A7A7A; --top-typing-shadow:rgba(154,154,154,.18); --think-flourish:rgba(154,154,154,.42); --think-label:#8A8A8A; --think-body:#5A5A5A; --think-panel-bg:rgba(255,255,255,.25); --think-panel-line:rgba(255,255,255,.22); --think-glass-hi:rgba(255,255,255,.18); --think-glass-shadow:rgba(0,0,0,.04); --think-text-shadow:0 1px 10px rgba(255,255,255,.80); --shadow:0 18px 46px rgba(0,0,0,.05); --soft-shadow:0 14px 34px rgba(0,0,0,.03); --scrim:linear-gradient(180deg, rgba(255,255,255,.44), rgba(255,255,255,.16) 30%, rgba(255,255,255,.06) 68%, rgba(255,255,255,.26)); --card-bg:rgba(250,250,250,.50); --card-line:rgba(204,204,204,.30); --card-shadow:0 10px 28px rgba(0,0,0,.03); --seg-track:rgba(192,192,192,.14); --seg-thumb:rgba(255,255,255,.75); --seg-thumb-shadow:0 2px 8px rgba(0,0,0,.05); --row-press:rgba(192,192,192,.10); --slider-track:rgba(192,192,192,.35); --slider-thumb:#7A7A7A; --info-ring:rgba(192,192,192,.40); --status-dot:#5fbf8f; --wall-default:linear-gradient(180deg,#F8F8F8,#EBEBEB); --menu-wall-default:var(--wall-default); --solid-card:#FAFAFA; --solid-bar:#F1F2F1; --solid-line:rgba(192,192,192,.28); --solid-press:#E8E8E8; --frost-card:rgba(250,250,250,.60); --frost-press:rgba(235,235,235,.72); } html[data-theme="snow"] body{ background:#F1F2F1; } html[data-theme="snow"] .sky{ background-color: transparent; background-image: radial-gradient(1.2px 1.2px at 18% 12%,rgba(192,192,192,.22) 50%,transparent 51%), radial-gradient(1px 1px at 73% 7%,rgba(192,192,192,.16) 50%,transparent 51%), radial-gradient(1px 1px at 88% 21%,rgba(204,204,204,.14) 50%,transparent 51%), radial-gradient(1.4px 1.4px at 9% 33%,rgba(192,192,192,.15) 50%,transparent 51%), radial-gradient(1px 1px at 62% 29%,rgba(204,204,204,.12) 50%,transparent 51%), radial-gradient(1px 1px at 34% 47%,rgba(192,192,192,.13) 50%,transparent 51%), radial-gradient(1.2px 1.2px at 81% 55%,rgba(204,204,204,.13) 50%,transparent 51%), radial-gradient(1px 1px at 15% 68%,rgba(192,192,192,.11) 50%,transparent 51%), radial-gradient(1px 1px at 55% 76%,rgba(204,204,204,.10) 50%,transparent 51%), radial-gradient(1.3px 1.3px at 90% 83%,rgba(192,192,192,.14) 50%,transparent 51%); } html[data-theme="snow"] body.chat-open{ background-color:#F1F2F1; } html[data-theme="snow"] .medal svg > circle:nth-of-type(3){ fill:rgba(255,255,255,.75); } html[data-theme="snow"] #page-murmur .topbar{ box-shadow:0 8px 24px rgba(0,0,0,.06); } html[data-theme="snow"] #page-murmur .bubble .txt .md-pre{ background:rgba(0,0,0,.03); border-color:rgba(0,0,0,.06); } html[data-theme="snow"] body[data-accent="base"]{ --accent:#9A9A9A; --accent-soft:rgba(154,154,154,.5); --glow:rgba(154,154,154,.12); --text:#2D2D2D; } /* ════ 紫星（star）· 585E6B 深灰蓝 × F2E1EB 粉紫白 × BDB2C7 淡紫灰 × 9795A3 中灰紫 ════ */ html[data-theme="star"]{ --line:#BDB2C7; --line-dim:rgba(189,178,199,.40); --hairline:rgba(189,178,199,.28); --text:#3D424D; --text-dim:#9795A3; --accent:#BDB2C7; --accent-soft:rgba(189,178,199,.5); --glow:rgba(189,178,199,.14); --nav-tint:#E4DBE8; --nav-cap-hi:#FFFFFF; --nav-cap-lo:#FFFFFF; --bg:#C9B7E7; --header-bg:transparent; --wall-image: linear-gradient(180deg,#F9F2F6 0%,#F2E1EB 34%,#ECD8E5 78%,#E6D0E0 100%); --text-soft:#585E6B; --text-faint:#9795A3; --bubble-ai-bg:rgba(255,253,255,.96); --bubble-ai-fg:#3D424D; --bubble-ai-line:rgba(189,178,199,0); --bubble-human-bg:rgba(189,178,199,.72); --bubble-human-fg:#3D424D; --bubble-human-line:rgba(189,178,199,0); --bubble-shadow:rgba(88,94,107,.10); --send-bg:#A89AB5; --accent-fg:#ffffff; --tick:#9795A3; --top-line:rgba(189,178,199,.30); --top-active-bg:rgba(189,178,199,.12); --top-active-fg:#BDB2C7; --top-typing-shadow:rgba(189,178,199,.22); --think-flourish:rgba(189,178,199,.48); --think-label:#BDB2C7; --think-body:#585E6B; --think-panel-bg:rgba(255,255,255,.22); --think-panel-line:rgba(255,255,255,.20); --think-glass-hi:rgba(255,255,255,.16); --think-glass-shadow:rgba(40,38,50,.06); --think-text-shadow:0 1px 10px rgba(255,255,255,.75); --shadow:0 18px 46px rgba(88,94,107,.08); --soft-shadow:0 14px 34px rgba(88,94,107,.06); --scrim:linear-gradient(180deg, rgba(255,255,255,.40), rgba(255,255,255,.14) 30%, rgba(255,255,255,.05) 68%, rgba(255,255,255,.24)); --card-bg:rgba(251,247,250,.50); --card-line:rgba(189,178,199,.22); --card-shadow:0 10px 28px rgba(88,94,107,.04); --seg-track:rgba(189,178,199,.18); --seg-thumb:rgba(255,255,255,.72); --seg-thumb-shadow:0 2px 8px rgba(88,94,107,.07); --row-press:rgba(189,178,199,.10); --slider-track:rgba(189,178,199,.30); --slider-thumb:#A89AB5; --info-ring:rgba(151,149,163,.35); --status-dot:#5fbf8f; --wall-default:linear-gradient(180deg,#F9F2F6,#ECD8E5); --menu-wall-default:var(--wall-default); --solid-card:#FFFFFF; --solid-bar:#C9B7E7; --solid-line:rgba(88,94,107,.10); --solid-press:#e8d8e3; --frost-card:rgba(251,247,250,.58); --frost-press:rgba(236,226,234,.72); } html[data-theme="star"] body{ background:#C9B7E7; } html[data-theme="star"] .sky{ background-color: transparent; background-image: radial-gradient(1.4px 1.4px at 12% 8%,rgba(88,94,107,.22) 50%,transparent 51%), radial-gradient(1px 1px at 68% 5%,rgba(151,149,163,.18) 50%,transparent 51%), radial-gradient(1.1px 1.1px at 85% 18%,rgba(88,94,107,.15) 50%,transparent 51%), radial-gradient(1.6px 1.6px at 6% 30%,rgba(151,149,163,.20) 50%,transparent 51%), radial-gradient(1px 1px at 55% 25%,rgba(88,94,107,.12) 50%,transparent 51%), radial-gradient(1.3px 1.3px at 30% 44%,rgba(151,149,163,.16) 50%,transparent 51%), radial-gradient(1px 1px at 78% 52%,rgba(88,94,107,.13) 50%,transparent 51%), radial-gradient(1.2px 1.2px at 18% 65%,rgba(151,149,163,.14) 50%,transparent 51%), radial-gradient(1px 1px at 50% 72%,rgba(88,94,107,.11) 50%,transparent 51%), radial-gradient(1.5px 1.5px at 88% 80%,rgba(151,149,163,.18) 50%,transparent 51%); } html[data-theme="star"] body.chat-open{ background-color:#C9B7E7; } html[data-theme="star"] .medal svg > circle:nth-of-type(3){ fill:rgba(255,255,255,.65); } html[data-theme="star"] #page-murmur .topbar{ box-shadow:0 8px 24px rgba(88,94,107,.10); } html[data-theme="star"] #page-murmur .bubble .txt .md-pre{ background:rgba(61,66,77,.04); border-color:rgba(61,66,77,.08); } html[data-theme="star"] body[data-accent="base"]{ --accent:#BDB2C7; --accent-soft:rgba(189,178,199,.5); --glow:rgba(189,178,199,.14); --text:#3D424D; } /* a90 雨青/花信的呼吸灯（模型胶囊小圆点）调淡 */ /* ═══════════ a106 组头 header（用户 8-8 三改·QQ 风）+ thinking 云卡 + 工具圆点行 ═══════════ 头像挪进组头,旁边竖排日期/时间(系统字体),时间旁小云朵=thinking,脚边小虚线; 工具行(api-trace)圆点裸行排虚线楼下,气泡压轴、左缘与头像平齐(缩进列退役); 点云在下方展开 thinking 磨砂卡。展开态复用 openThinkKeys。 */ #page-murmur .row.stamp{ -webkit-user-select:none; user-select:none; } #page-murmur .row.stamp.stamp-ai{ justify-content: flex-start; } #page-murmur .row.stamp.stamp-human{ justify-content: flex-end; } #page-murmur .stamp-head{ display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding-bottom: 2px; } #page-murmur .row.stamp.stamp-human .stamp-head{ align-items: flex-end; } #page-murmur .stamp-top{ display:flex; align-items:center; gap:8px; } #page-murmur .row.stamp.stamp-human .stamp-top{ flex-direction:row-reverse; } #page-murmur .stamp-avatar{ flex: none; width: var(--avatar-size); height: var(--avatar-size); border-radius: 50%; background-image: var(--avatar-default); background-size: cover; background-position: center; box-shadow: 0 2px 6px rgba(24,46,67,0.14); } #page-murmur .row.stamp.stamp-human .stamp-avatar{ background-image: var(--avatar-human, none); } body:not(.has-human-avatar) #page-murmur .row.stamp.stamp-human .stamp-avatar{ display: none; } #page-murmur .stamp-col{ display: flex; flex-direction: row; align-items: center; gap: 6px; } #page-murmur .stamp-date, #page-murmur .stamp-clock{ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; line-height: 1.35; } #page-murmur .stamp-date{ font-size: 10px; letter-spacing: .08em; color: var(--text-faint, var(--text-dim)); } #page-murmur .stamp-clock{ font-size: 10px; letter-spacing: .03em; color: var(--text-faint, var(--text-dim)); } #page-murmur .stamp-col{ opacity:.82; } #page-murmur .stamp-clock{ display: inline-flex; align-items: center; gap: 6px; } #page-murmur .stamp-cloud{ appearance: none; -webkit-appearance: none; margin: 0; padding: 0 1px; border: 0; background: none; color: var(--text-faint, var(--text-dim)); cursor: pointer; line-height: 1; display: inline-flex; align-items: center; transition: color var(--motion-fast) var(--ease-soft); } #page-murmur .stamp-cloud svg{ width: 13px; height: 13px; display: block; } #page-murmur .stamp-cloud:hover, #page-murmur .stamp-cloud[aria-expanded="true"]{ color: var(--accent); } #page-murmur .stamp-cloud:active{ transform: translateY(1px); } #page-murmur .stamp-think[hidden]{ display: none !important; } #page-murmur .stamp-think{ margin-top: 8px; text-align: left; animation: pop .2s cubic-bezier(.2,.8,.2,1) both; } /* a117 回滚 a116 裸摊：用户看后说裸摊叠背景看不清，磨砂卡展开态回炉；云朵点开交互不动 */ #page-murmur .tcard{ border-radius: 16px; background: var(--frost-card); border: 1px solid var(--solid-line); box-shadow: 0 10px 28px rgba(0,0,0,.07); -webkit-backdrop-filter: blur(14px) saturate(1.4); backdrop-filter: blur(14px) saturate(1.4); padding: clamp(12px, 2vw, 16px) clamp(14px, 2.2vw, 18px); max-width: min(80vw, 470px); } #page-murmur .tcard-cap{ text-align: center; font-family: var(--font-en); font-style: italic; font-size: 11px; letter-spacing: .28em; color: var(--text-dim); margin-bottom: 8px; } #page-murmur .tcard-cap-star{ letter-spacing: 0; font-style: normal; } #page-murmur .tcard-body{ font-family: var(--font-cn); font-size: 12.5px; line-height: 1.78; color: var(--think-body); overflow-wrap: anywhere; } #page-murmur .tcard-tail{ text-align: center; color: var(--text-dim); font-size: 12px; margin-top: 8px; } /* 气泡行头像退役(头像住进组头),缩进列一并收回——气泡与头像同一左缘(用户的参考图) */ #page-murmur .row.ai::before{ content: none; } body.has-human-avatar #page-murmur .row.human::before{ content: none; } #page-murmur .row.ai{ padding-left: 0; } body.has-human-avatar #page-murmur .row.human{ padding-right: 0; } #page-murmur .row.think.api-trace, #page-murmur .row.act.api-trace{ padding-left: 0; } #page-murmur .row.think.api-trace.think-open{ padding-left: 0; } /* header 楼下的行贴紧;工具行串首规则(16-26px)在这里让位 */ #page-murmur .row.stamp + .row{ margin-top: 8px; } #page-murmur .row.stamp + .row.act.api-trace{ margin-top: 8px; } /* 工具行去胶囊 → 圆点裸行(只动 api-trace 系,历史碎碎念的动作胶囊不受累) */ #page-murmur .row.act.api-trace .act-toggle{ border: 0; border-radius: 0; padding: 0; background: none; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; } /* a106 圆点加粗:字符换真圆,尺寸自控 */ #page-murmur .row.act.api-trace .act-glyph{ font-size: 0; width: 5px; height: 5px; border-radius: 50%; background: currentColor; color: var(--accent); display: inline-block; transform: none; align-self: center; flex: none; } #page-murmur .row.act.api-trace .act-label{ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size: 11.5px; } #page-murmur .row.act.api-trace .act-state{ font-size: .78em; } /* a104 星星缩小;cc 侧裸行也带星(JS 侧放行) */ /* a106 默认气泡阴影收身(此前 0 6px 18px 漂浮影);a117 再收:0 2px 5px→0 1px 2px,贴边不晕染 */ #page-murmur .bubble{ box-shadow: 0 1px 2px var(--bubble-shadow); } /* a111 输入框字体跟随系统(与气泡同款) */ #page-murmur .composer textarea{ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; } /* ---- 输入框里的图片附件 ---- */ /* .composer 本来是单行 flex；开 wrap 后托盘用 order:-1 单独占一行浮在上面， 原有的 field / 发送键排布完全不受影响。 */ #page-murmur .composer{ flex-wrap: wrap; } #page-murmur .attach-tray{ order: -1; width: 100%; display: flex; gap: 8px; flex-wrap: wrap; padding: 0 4px 8px; } #page-murmur .attach-tray[hidden]{ display: none; } #page-murmur .attach-chip{ position: relative; width: 62px; height: 62px; border-radius: 12px; overflow: hidden; background: var(--field-bg); border: 1px solid var(--field-line); box-shadow: var(--shadow); } #page-murmur .attach-chip img{ width: 100%; height: 100%; object-fit: cover; display: block; } #page-murmur .attach-chip.busy img{ opacity: .45; } #page-murmur .attach-chip .spin{ position: absolute; inset: 0; display: none; place-items: center; font-size: 11px; color: var(--text); } #page-murmur .attach-chip.busy .spin{ display: grid; } #page-murmur .attach-x{ position: absolute; top: 2px; right: 2px; width: 20px; height: 20px; border: none; border-radius: 50%; padding: 0; cursor: pointer; background: rgba(0,0,0,.55); color: #fff; font-size: 13px; line-height: 20px; } #page-murmur .attachbtn{ flex: none; width: clamp(28px, 3.6vw, 34px); height: clamp(28px, 3.6vw, 34px); display: grid; place-items: center; border-radius: 50%; color: var(--accent); cursor: pointer; transition: transform .15s ease, background .2s ease; } #page-murmur .attachbtn:active{ transform: scale(.9); background: rgba(0,0,0,.06); } #page-murmur .attachbtn svg{ width: 60%; height: 60%; display: block; } /* ════════════ Search (16-search) ════════════ */ .session-menu-item{ width:100%; display:grid; grid-template-columns:40px 1fr auto; align-items:center; gap:10px; padding:11px 12px; border:1px solid rgba(255,255,255,.55); border-radius:14px; background:rgba(255,255,255,.42); -webkit-backdrop-filter: blur(18px) saturate(1.3); backdrop-filter: blur(18px) saturate(1.3); box-shadow:0 6px 20px rgba(20,28,40,.06), inset 0 1px 0 rgba(255,255,255,.65); color:var(--text); text-align:left; font:inherit; cursor:pointer; -webkit-tap-highlight-color:transparent; } .session-menu-item:active{ background:var(--solid-press, var(--solid-card)); transform:scale(.992); } .session-menu-ico{ width:40px; height:40px; border-radius:12px; display:grid; place-items:center; background:color-mix(in srgb, var(--accent) 16%, rgba(255,255,255,.35)); color:var(--accent); border:1px solid rgba(255,255,255,.4); } .session-menu-ico svg{ width:18px; height:18px; display:block; } .session-menu-copy{ min-width:0; display:flex; flex-direction:column; gap:2px; } .session-menu-copy strong{ font-size:14px; font-weight:600; line-height:1.25; } .session-menu-copy small{ font-size:10.5px; color:var(--text-faint); line-height:1.35; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .session-menu-chev{ color:var(--text-faint); font-size:18px; line-height:1; padding-right:2px; } .session-search-panel{ display:flex; flex-direction:column; gap:8px; min-height:0; padding:2px 1px 8px; } .session-search-panel[hidden]{ display:none !important; } .session-search-bar{ display:flex; align-items:center; gap:8px; padding:8px 10px; border:1px solid rgba(255,255,255,.55); border-radius:14px; background:rgba(255,255,255,.42); -webkit-backdrop-filter: blur(18px) saturate(1.3); backdrop-filter: blur(18px) saturate(1.3); box-shadow:0 6px 20px rgba(20,28,40,.06), inset 0 1px 0 rgba(255,255,255,.65); flex:none; } .session-search-icon{width:16px;height:16px;color:var(--text-dim);flex:none} .session-search-bar input{flex:1;min-width:0;border:0;background:none;outline:none;color:var(--text);font-size:14px;font-family:var(--font-ui,system-ui)} .session-search-bar input::placeholder{color:var(--text-dim)} .session-search-clear{border:0;background:none;color:var(--text-dim);font-size:18px;padding:0 2px;cursor:pointer;line-height:1} .session-search-results{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch} .search-result{ display:block; width:100%; text-align:left; background:rgba(255,255,255,.42); border:1px solid rgba(255,255,255,.55); border-radius:14px; padding:11px 12px; margin:0 0 8px; cursor:pointer; -webkit-tap-highlight-color:transparent; font-family:var(--font-ui,system-ui); color:var(--text); -webkit-backdrop-filter: blur(18px) saturate(1.3); backdrop-filter: blur(18px) saturate(1.3); box-shadow:0 6px 20px rgba(20,28,40,.06), inset 0 1px 0 rgba(255,255,255,.65); } .search-result:active{ background:rgba(255,255,255,.55); transform:scale(.992); } .search-result-meta{ font-size:10.5px; color:var(--text-faint); margin-bottom:4px; } .search-result-text{ font-size:13px; line-height:1.45; color:var(--text); word-break:break-word; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; } .search-result-text b.sh{font-weight:inherit;background:rgba(var(--accent-rgb,181,126,134),.22);color:var(--text,#333);border-radius:2px;padding:0 1px} @keyframes searchFlash{0%{background:rgba(var(--accent-rgb,181,126,134),.25)}100%{background:transparent}} .search-highlight{animation:searchFlash 2.2s ease-out;border-radius:8px} .gallery-save-toggle{ display:inline-flex; align-items:center; gap:6px; border:1px solid var(--field-line, rgba(20,28,40,.12)); border-radius:999px; padding:6px 12px; background:rgba(255,255,255,.55); color:var(--text-dim); font:inherit; font-size:12px; cursor:pointer; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); } .gallery-save-toggle.on{ color:var(--accent); border-color:color-mix(in srgb, var(--accent) 35%, transparent); background:color-mix(in srgb, var(--accent) 10%, rgba(255,255,255,.5)); } /* ==== letter composer bar (2026-09-08) ==== */ #page-murmur .composer{ position: fixed !important; z-index: 100 !important; gap: 10px; align-items: center; } #page-murmur .composer .field{ flex: 1 1 auto; min-width: 0; gap: 2px; padding: 6px 8px 6px 14px; min-height: 48px; border-radius: 999px; background: rgba(252, 252, 253, .94); border: 1px solid rgba(120, 142, 165, .14); box-shadow: 0 10px 28px rgba(40, 55, 75, .08), inset 0 1px 0 rgba(255,255,255,.8); } #page-murmur .composer .attachbtn{ color: #3a4656; width: 34px; height: 34px; } #page-murmur .composer .attachbtn svg{ width: 52%; height: 52%; } #page-murmur .composer .kao-btn, #page-murmur .composer .stk-btn, #page-murmur .composer .express-btn{ color: #3a4656; } #page-murmur .composer textarea{ font-family: var(--font-en), var(--font-cn), Georgia, serif; font-size: 13px; line-height: 1.35; padding: 7px 4px; color: #2a3544; } #page-murmur .composer textarea::placeholder{ font-family: var(--font-en), var(--font-cn), Georgia, serif; font-style: italic; font-size: 13px; color: rgba(90, 104, 120, .55); opacity: 1; } #page-murmur .floatbtn.send{ flex: none; width: 46px; height: 46px; margin: 0; background: var(--send-bg, #3d4f63); color: #fff; box-shadow: 0 12px 26px rgba(35, 50, 70, .28); } #page-murmur .floatbtn.send svg{ width: 20px; height: 20px; } @media (max-width: 520px){ #page-murmur .composer{ gap: 8px; } #page-murmur .composer .field{ min-height: 46px; padding: 5px 6px 5px 12px; } #page-murmur .floatbtn.send{ width: 44px; height: 44px; } } /* ==== /letter composer bar ==== */