/* v47.css —— 排版 / 重叠 / 错行 修复（放在最后加载，只改有冲突的地方，不动别的样式）
 * 1. 聊天页顶栏在 v46 改成「悬浮透明」后，v37 的「线上·手机聊天」模式条还留在原位，被顶到状态栏底下（和时间、电量叠在一起）
 * 2. 各应用顶部的「角色」选择条：标签被挤成竖排（角/色），右边的下拉框在窄屏上超出手机屏幕
 * 3. 提示条（toast）太窄，一句话被拆成 4 行，最后一行只剩 1 个字
 * 5. 聊天顶栏的心情小标签（「平静」）：style.css 把它缩成 8×8 的小圆点，v46 又把字放回来却没恢复宽高，结果文字溢出、底色错位
 * 4. 中文标题 / 说明文字的「孤字」换行（最后一行只剩 1 个字）
 */

/* ---------- 1. 聊天页：模式条放到悬浮顶栏下面 ---------- */
#chatRoomApp#chatRoomApp #modeBar { position: relative; z-index: 25; margin-top: var(--ch-top, 96px); flex: 0 0 auto; }
#chatRoomApp#chatRoomApp #groupNotice:not(.hidden) + #modeBar { margin-top: 0; }
#chatRoomApp#chatRoomApp:has(#modeBar:not([style*="none"])) .chat-box { padding-top: 12px; -webkit-mask-image: none; mask-image: none; }
#chatRoomApp#chatRoomApp #modeBar b, #chatRoomApp#chatRoomApp #modeBar i { flex: 0 0 auto; white-space: nowrap; }

/* ---------- 2. 角色选择条 ---------- */
.char-picker-bar > span:first-child { flex: 0 0 auto; white-space: nowrap; }
.char-picker-bar select, .char-picker-bar .char-picker-select { min-width: 0; max-width: 100%; text-overflow: ellipsis; }
.char-picker-bar > select:not(:only-of-type), .char-picker-bar > select + select { flex: 0 1 auto !important; max-width: 42%; }
#takeoutPicker, #shoppingPicker { box-sizing: border-box; max-width: calc(100% - 28px); }

/* ---------- 3. 提示条 ---------- */
.ui-toast { width: max-content; max-width: min(88%, 340px); text-wrap: balance; box-sizing: border-box; }

/* ---------- 4. 孤字换行（不支持 text-wrap 的老系统会自动忽略，不会出错） ---------- */
.taobao-tab, .product-title, .mcp-name, #mcpName, .lw-title, .lw-sub, .fl-hero-foot, .app-header #chatTitle { text-wrap: balance; }
.phone :where(p, small, li, .hint-line, .cell-item > span) { text-wrap: pretty; }
/* 聊天气泡里的长文本别因为一个长单词/网址撑破气泡 */
.bubble { overflow-wrap: anywhere; }

/* ---------- 5. 心情小标签：恢复成正常的胶囊 ---------- */
#chatRoomApp#chatRoomApp #chatMoodPill { width: auto; height: auto; min-width: 0; border-radius: 999px; white-space: nowrap; }