/* 0907第一刀: 自index.html迁出 */
/* 仅补：页面骨架级布局（复刻 screen-workchat-dialog 的组合关系，不改任何真身样式） */
body{margin:0;height:100vh;height:100dvh;display:flex;flex-direction:column;background:var(--bg,#F5F6F8);font-family:-apple-system,"PingFang SC",sans-serif}
html,body{min-width:0 !important;max-width:100vw !important;overflow-x:hidden !important}
#screen-group{min-width:0 !important;max-width:100vw !important;overflow-x:hidden}
.seg{display:flex;background:var(--seg,#EEF1F6);border-radius:999px;padding:3px;gap:2px;min-width:0}
.seg-b{border:none;background:transparent;border-radius:999px;padding:5px 11px;font-size:var(--fs-l5,12px);font-weight:600;color:var(--sub,#6B7280);white-space:nowrap}
.seg-b.on{background:var(--card,#FFF);color:var(--acc,#007AFF);box-shadow:0 1px 4px rgba(0,0,0,.12)}
@media (max-width:380px){.seg-b{padding:5px 8px}}
/* 终修：钉死输入行 flex 约束（textarea 不许撑爆，四件套必须同屏） */
#screen-group .wx-input,#screen-group .wcd-input{padding:5px 12px 24px !important;background:var(--bg,#F5F6F8) !important;border-top:0.5px solid var(--border,#E5E7EB)}
#screen-group .wx-row{display:flex;flex-wrap:wrap;overflow:visible;min-height:44px !important;gap:2px !important;background:var(--card,#FFF) !important;border:1px solid var(--border,#E5E7EB);border-radius:22px;padding:0 6px}
#screen-group .wx-field{flex:1 1 0 !important;min-width:0 !important;width:auto !important;max-width:none !important}
#screen-group .wx-vkey,#screen-group .wx-emoji,#screen-group .wx-plus,#screen-group .wx-send{flex-shrink:0;width:44px;height:44px}
/* 打字中：输入框独占全栏第一行，麦克风/表情/加号/发送自动下移到第二行 */
#screen-group .wx-row:focus-within .wx-field{flex:1 1 100% !important;order:-1}
#screen-group .wx-row:focus-within .wx-send{margin-left:auto}
#screen-group .wx-row:focus-within{padding-bottom:2px}
#screen-group .wx-ai-note{display:block;text-align:center;color:var(--sub,#6B7280);font-size:var(--fs-l6,10px);padding:2px 0 0}
#screen-group .wx-input:focus-within .wx-ai-note,#screen-group .wx-input.voice-hold .wx-ai-note,#screen-group .wx-input.kb-open .wx-ai-note{display:none}
/* 按住说话：整个输入板块变色示警（语音输入中） */
#screen-group .wx-input.voice-hold{background:var(--hold,#E8F1FF) !important}
#screen-group .wx-input.voice-hold .wx-row{border-color:var(--acc,#007AFF);box-shadow:0 0 0 2px var(--acc-soft,rgba(0,122,255,.15))}
/* 回到最新浮动钮 */
#grpJump{position:absolute;right:14px;bottom:96px;z-index:40;width:40px;height:40px;border-radius:50%;background:var(--card,#FFF);border:1px solid var(--border,#E5E7EB);box-shadow:var(--sh,0 2px 8px rgba(0,0,0,.12));display:none;align-items:center;justify-content:center;color:var(--sub,#6B7280)}
.grp-list{flex:1;overflow-y:auto;overflow-x:hidden;padding:12px;background:var(--bg,#F5F6F8);display:flex;flex-direction:column}
/* §9 像素级：头像36圆外侧/间距同组8pt跨组12pt/时间12pt灰组间/老板气泡70%+右下4pt尾巴 */
.grp-line{display:flex;justify-content:center;margin:12px 0 2px}
.grp-line span{font-size:var(--fs-l5,12px);color:var(--sub,#6B7280)}
.grp-row{margin:8px 0;width:96%}
.grp-row.cross{margin-top:12px}
.grp-row.mine{width:90%;margin-left:auto;margin-right:2%;text-align:right} /* 老板=右侧用户位 */
.grp-row.mine .grp-meta2{justify-content:flex-end}
.grp-row.mine .grp-ops{justify-content:flex-end}
.grp-meta2{display:flex;align-items:center;gap:6px;font-size:14px;font-weight:600;color:var(--text,#1F2329);margin:0 0 4px 2px}
.grp-meta2 .av{font-size:20px;line-height:1;height:22px;display:inline-flex;align-items:center} /* 头像与昵称同行等高 */
.grp-meta2 em{font-weight:500}
.grp-meta2 em{font-style:normal;color:var(--acc,#007AFF);font-weight:600}
/* 老板消息同样有头像行(右对齐) */
.grp-who{font-size:var(--fs-l5,12px);color:var(--sub,#6B7280);margin:0 2px 3px}
.grp-who em{font-style:normal;color:var(--acc,#007AFF);font-weight:600;margin-right:4px}
.grp-bubble{display:block;background:var(--card,#FFF);border-radius:12px;padding:9px 12px;font-size:18px;line-height:1.55;word-break:break-word;box-shadow:var(--sh-card,0 1px 4px rgba(0,0,0,.06));white-space:pre-wrap;text-align:left;width:100%}
.grp-row.mine .grp-bubble{background:var(--bubble-user,#007AFF);color:#fff;border-radius:12px 12px 4px 12px} /* 老板气泡也放开=几乎通栏96% */
.grp-row.theirs .grp-bubble{background:var(--card,#FFF);border:0.5px solid var(--line,#F0F1F3);box-shadow:var(--sh-card,0 1px 4px rgba(0,0,0,.05));border-radius:12px;padding:9px 12px;color:var(--text,#1F2329);display:block;width:100%}
.grp-ops{display:flex;gap:14px;margin:4px 4px 0}
.grp-ops button{background:none;border:none;color:var(--sub,#6B7280);font-size:12px;padding:2px 0;cursor:pointer}
.grp-ops button.speaking{color:var(--acc,#007AFF);font-weight:600}
.grp-tts-btn{position:absolute;right:6px;top:env(safe-area-inset-top, 0px);z-index:1;height:44px;min-width:44px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;color:var(--acc,#007AFF);cursor:pointer}
.grp-tts-btn .tts-on,.grp-tts-btn .tts-off{display:flex;align-items:flex-end;gap:2.5px;height:20px}
.grp-tts-btn .tts-on i{width:3.5px;background:currentColor;border-radius:2px;animation:ttsW 0.9s ease-in-out infinite}
.grp-tts-btn .tts-on i:nth-child(1){height:9px}.grp-tts-btn .tts-on i:nth-child(2){height:17px;animation-delay:.15s}.grp-tts-btn .tts-on i:nth-child(3){height:12px;animation-delay:.3s}.grp-tts-btn .tts-on i:nth-child(4){height:19px;animation-delay:.45s}
@keyframes ttsW{50%{transform:scaleY(.35)}}
.grp-tts-btn .tts-off svg{display:block;color:var(--sub,#6B7280)}
.grp-tts-btn.off .tts-on{display:none}
.grp-tts-btn:not(.off) .tts-off{display:none}
#grpToast{position:fixed;left:50%;bottom:140px;transform:translateX(-50%);background:rgba(0,0,0,.78);color:#fff;font-size:14px;padding:9px 16px;border-radius:10px;opacity:0;pointer-events:none;transition:opacity .25s;z-index:99;max-width:80%;text-align:center}
#grpToast.show{opacity:1}
.grp-att{margin-top:6px}
.grp-att img,.grp-att video{max-width:100%;border-radius:12px;display:block}
.grp-bubble-link{color:var(--acc,#007AFF);text-decoration:underline;word-break:break-all}
@keyframes grpPulse { 0%,100% { box-shadow: 0 0 0 0 rgba(7,160,88,.28); } 50% { box-shadow: 0 0 0 7px rgba(7,160,88,0); } }
.grp-row button.speaking { animation: grpPulse 1.2s ease-in-out infinite; }
.grp-h{font-weight:700;font-size:15.5px;color:var(--acc,#0A84FF);margin:6px 0 2px}
.grp-p{margin:3px 0;line-height:1.55}
.grp-li{margin:2px 0 2px 1.1em;position:relative;line-height:1.5}
.grp-li:before{content:"▸";position:absolute;left:-1.05em;color:var(--acc,#0A84FF)}
.grp-kw{color:var(--bad,#EF4444);font-style:normal;font-weight:600}
.grp-at{color:var(--at,#b8860b);font-weight:800;}
.grp-num{font-weight:700;color:var(--acc,#0A84FF)}
/* ↓ 0907自vmode62块迁入 */
/* ===== 0902-142: 统一加高导航条(语音/文字同构, 锁死底部, 不透内容) ===== */
#grpCapsule{display:none!important}
#grpAiNote{line-height:1.4!important} /* 0909修文字削边 */
#grpInputBar{position:fixed!important;left:0!important;right:0!important;bottom:0!important;z-index:60!important;margin:0!important;border-radius:0!important;background:var(--bg,#F5F6F8)!important;border-top:1px solid var(--border,#E5E7EB)!important;box-shadow:none!important;padding:8px 12px 10px !important;background:var(--bg,#F5F6F8)!important}
#grpList{padding-bottom:calc(115px + env(safe-area-inset-bottom, 24px))!important} /* 0909老板令锁死配套: fixed条清场垫 */
#grpInputBar .wx-row{display:flex!important;gap:8px!important;border:1px solid var(--border,#E5E7EB)!important;box-shadow:none!important;background:var(--card,#FFF)!important;border-radius:22px!important;padding:0 6px!important;min-height:52px!important;align-items:center!important;position:relative!important}
#grpInputBar .wx-field{max-height:150px!important;overflow-y:auto!important;flex:1 1 0!important;min-width:0!important;width:auto!important;max-width:none!important;min-height:44px!important;background:transparent!important;border:none!important;box-shadow:none!important;padding:0 8px!important;font-size:20px!important;line-height:1.4;color:var(--text,#111);-webkit-user-select:text!important;user-select:text!important}
#grpInputBar.voice-mode .wx-field{text-align:center!important;font-size:20px!important;line-height:44px!important;color:var(--ph,#9aa3ad)!important;caret-color:#0A7AFF}
#grpInputBar.voice-mode .wx-field.has-text{text-align:left!important;line-height:1.4!important;font-size:20px!important;color:var(--text,#111)!important}
#grpInputBar:not(.voice-mode) .wx-field{padding:12px 16px!important;flex:1 1 100%!important;order:-1}
#grpInputBar:not(.voice-mode) .wx-send{margin-left:auto!important}
/* 0907修③: @与看板全设备全模式常驻, 藏身令彻底废除 */
#grpInputBar.voice-mode .wx-send{display:none!important}
.wx-ai-note{display:block;text-align:center!important;font-size:12px!important;line-height:1;color:var(--ph,#9aa0a6)!important;padding:12px 0 0!important;margin:0!important;-webkit-user-select:none!important;user-select:none!important}
#grpInputBar.kb-open{padding:4px 16px 0!important}
#grpInputBar.kb-lift{z-index:70!important;transition:none!important}
/* 手势皮: 语音态覆盖输入区(按住=语音, 点=打字) */
#grpVoiceSkin{position:absolute;display:none;z-index:5}
#grpInputBar.voice-mode #grpVoiceSkin{display:block}
html{height:100%!important;background:#0d1117}
body{overflow:hidden!important}
#grpJump{bottom:96px!important;z-index:65!important} /* 0909老板令: 贴输入框上沿 */
#screen-group{height:100%!important;overflow:hidden!important}
body{overscroll-behavior-y:none!important}
body.recording #grpList{padding-bottom:calc(300px + env(safe-area-inset-bottom, 24px))!important}
.voice-overlay{width:115vw!important;margin-left:-57.5vw!important}
.voice-overlay{background:radial-gradient(ellipse 60% 16% at 50% 0%,rgba(255,255,255,.5),rgba(255,255,255,0) 72%),radial-gradient(ellipse 120% 115% at 50% 100%,#2563EB 0%,#1D4ED8 24%,#2563EB 46%,#3B82F6 63%,#60A5FA 70%,rgba(147,197,253,.45) 80%,rgba(147,197,253,.15) 88%,rgba(147,197,253,0) 94%)!important;box-shadow:0 -12px 80px rgba(59,130,246,.5)!important}
.voice-overlay.cancelling{background:radial-gradient(ellipse 60% 16% at 50% 0%,rgba(255,255,255,.4),rgba(255,255,255,0) 72%),radial-gradient(ellipse 120% 115% at 50% 100%,#475569 0%,#64748B 45%,#94A3B8 62%,#CBD5E1 72%,rgba(203,213,225,.25) 84%,rgba(203,213,225,0) 94%)!important;box-shadow:0 -12px 70px rgba(100,116,139,.4)!important}
.voice-overlay{padding:14px 20px 100px!important}
.voice-overlay.show{transform:scale(calc(1 + var(--vo-vol,0) * .3))!important}
.voice-overlay.show{filter:brightness(calc(1 + var(--vo-vol,0) * .35)) saturate(calc(1 + var(--vo-vol,0) * .3))!important;transition:filter .08s linear}
#grpVbar,.wx-voicebar{display:none!important}
.vo-ripple{position:absolute!important;left:0!important;right:0!important;top:0!important;bottom:0!important}
.vo-ripple i{top:35%!important;margin:0!important;width:120px!important;height:120px!important;border-width:4px!important;box-shadow:0 0 24px 6px rgba(255,255,255,.35)!important;animation-name:voRippleFix!important}
@keyframes voRippleFix{0%{transform:translate(-50%,-50%) scale(.25);opacity:1;border-color:rgba(255,255,255,.95)}60%{opacity:.5}100%{transform:translate(-50%,-50%) scale(2.1);opacity:0;border-color:rgba(255,255,255,0)}}
/* 0907: 占位词防吞行 */
#grpText::placeholder{font-size:15px!important;color:var(--ph,#9aa3ad)!important;letter-spacing:0}
/* 0907: 防换行双保险-图标收紧+占位再小一号 */
#grpInputBar .wx-vkey,#grpInputBar .wx-emoji,#grpInputBar .wx-plus,#grpInputBar .wx-send{width:40px!important;height:40px!important}
#grpInputBar .wx-row{gap:5px!important;padding:0 4px!important}
#grpText::placeholder{font-size:14px!important}
/* ===== 0909四色标记已撤(老板指认: 白条=条下方视图外死区) + 顶栏钉刘海区 ===== */
#screen-group .subbar{position:fixed!important;top:0!important;left:0!important;right:0!important;z-index:80!important;padding-top:env(safe-area-inset-top, 0px)!important}
/* 0909白条案归档: 品红到货铃已撤(老板终验24px高度认可,漂移搁置),复灰var(--bg)。全记录: 机器群白条战争全记录-0909.md */
/* ===== 0909 自 voice.js 拆出：按住说话蓝色半球光效（--vo-vol 音量联动，voice.rec.js 驱动） ===== */
.voice-overlay{position:fixed;left:50%;bottom:0;width:130vw;margin-left:-65vw;z-index:80;height:260px;border-radius:50% 50% 0 0;overflow:hidden;transform-origin:50% 100%;background:radial-gradient(ellipse 120% 115% at 50% 100%,#1E40AF 0%,#2563EB 32%,#3B82F6 55%,#93C5FD 72%,rgba(147,197,253,.35) 85%,rgba(147,197,253,0) 100%);box-shadow:0 -2px 24px rgba(59,130,246,.35);display:none;flex-direction:column;align-items:center;justify-content:flex-end;gap:18px;padding:54px 20px 22px;transition:transform .12s ease-out;pointer-events:none}
.voice-overlay.show{display:flex;transform:scale(calc(1 + var(--vo-vol,0) * .16));animation:voIn .18s ease-out}
.voice-overlay.cancelling{background:radial-gradient(ellipse 120% 115% at 50% 100%,#64748B 0%,#94A3B8 50%,#CBD5E1 72%,rgba(203,213,225,0) 100%);box-shadow:0 -2px 20px rgba(100,116,139,.4);transform:none}
.vo-ripple{position:absolute;inset:0;pointer-events:none}
.vo-ripple i{position:absolute;left:50%;top:60%;width:190px;height:190px;margin:-95px 0 0 -95px;border-radius:50%;border:2px solid rgba(255,255,255,.55);opacity:0;animation:voRipple 1.6s ease-out infinite}
.vo-ripple i:nth-child(2){animation-delay:.5s}.vo-ripple i:nth-child(3){animation-delay:1s}
.vo-wave{display:flex;align-items:center;gap:5px;height:34px;position:relative;z-index:2}
.vo-wave i{width:7px;border-radius:4px;background:#fff;animation:voWave 1s ease-in-out infinite}
.vo-wave i:nth-child(2n){animation-delay:.15s}.vo-wave i:nth-child(3n){animation-delay:.3s}
.vo-tip{font-size:14px;color:#fff;font-weight:400;position:relative;z-index:2;text-shadow:0 1px 4px rgba(30,64,175,.35)}
.voice-overlay .vo-timer{font-size:26px;color:#fff;font-weight:700;position:relative;z-index:2;text-shadow:0 1px 4px rgba(30,64,175,.35);font-variant-numeric:tabular-nums}
@keyframes voIn{from{opacity:0}to{opacity:1}}
@keyframes voRipple{0%{transform:scale(.25);opacity:.8}100%{transform:scale(2.2);opacity:0}}
@keyframes voWave{0%,100%{height:12px}50%{height:34px}}
/* ===== 0909v49 老板令⑨: 暗亮双态协调 =====
大盘背景/文字由tokens.css暗色档管; 本块只治两病:
①tokens暗色 --card==--bg=#191919 → 气泡贴底灰上灰 → 组件级把card抬到#22252B加边影分层;
②本页自有组件(seg/hold/ph)tokens不管 → 回退hex常驻亮色 → 暗色档在此定值。
手动固定亮(data-theme=light)时整块让路。 */
.grp-hr{height:1px;background:var(--line,#F0F1F3);margin:6px 0;border:0}
/* 0910v53 老板令: 排版渲染升级 —— 长编号自动换行+门牌灰章/版本蓝章/重点红显 */
.grp-p,.grp-li,.grp-h{overflow-wrap:anywhere;word-break:break-word}
.grp-id{display:inline-block;font-size:11px;line-height:18px;color:var(--mut,#98a1ad);background:rgba(148,161,173,.15);border-radius:6px;padding:0 6px;margin:0 2px;vertical-align:1px;white-space:nowrap}
.grp-tag{font-style:normal;font-weight:600;font-size:12px;line-height:18px;color:var(--pri,#2563EB);background:rgba(37,99,235,.12);border-radius:6px;padding:0 6px;margin:0 2px;vertical-align:1px;white-space:nowrap}
.grp-bubble code{font-family:ui-monospace,Menlo,monospace;font-size:.85em;background:var(--codebg,rgba(0,0,0,.06));padding:1px 5px;border-radius:5px}
@media (prefers-color-scheme: dark){
:root:not([data-theme="light"]){--seg:#2A2E35;--hold:#1D2B3E;--ph:#7C838C;--bad:#FF6B6B;--at:#E6C35C;--codebg:rgba(255,255,255,.08);--sh-card:0 1px 6px rgba(0,0,0,.35)}
:root:not([data-theme="light"]) .grp-bubble,:root:not([data-theme="light"]) .seg-b.on,:root:not([data-theme="light"]) #grpJump{--card:#22252B}
:root:not([data-theme="light"]) #screen-group .wx-row,:root:not([data-theme="light"]) #grpInputBar .wx-row{--card:#23262B}
:root:not([data-theme="light"]) .grp-row.theirs .grp-bubble{--line:#2B2F35}
:root:not([data-theme="light"]) .grp-row.mine .grp-bubble{color:#fff}
:root:not([data-theme="light"]) #grpToast{background:rgba(50,54,62,.92)}
}