/* =====================================================================
   CHAT-RESP-v1 — 对话页响应式系统层（2026-09-15）
   只挂 chat.html；必须排在 console-perf-lite.css 之后加载（覆盖
   console.css 对 #chat-input 的硬编码 height:42px / max-height:180px 老刀）。
   只管对话域响应式（composer 自适应 / 安全区 / 移动端防缩放 / 消息横向
   溢出兜底 / FAB 抬升），不碰主题与特效规则（那些归 perf-lite 管）。
   回滚 = 删除 chat.html 中本文件的 <link> 一行即可（JS 侧对缺失本层
   安全退化：min/max 不生效时 autoGrowChatInput 仍产出合法高度）。
   ===================================================================== */

/* ---------------------------------------------------------------
   P0 · composer 自适应增高（与 console.js autoGrowChatInput 配套）
   旧账：console.css `#chat-input{height:42px;max-height:180px}` ——
   42px 低于单行自然高（text-sm×leading-relaxed + py-[10px] ≈ 45px），
   首行常年被裁出「输入区特别小」的观感；180px 死上限与视口无关，
   大屏长文本永远一小条。现在：
   - min-height:44px → 单行不裁剪，且满足最小可点区域；
   - max-height:35vh → 输入框随视口拉伸，顶到上限后内滚（JS 切
     overflow-y），大屏能写长 prompt、小屏不吃光消息区。
   同 id 权重、本文件后加载 → 覆盖 console.css 旧值。
   --------------------------------------------------------------- */
#chat-input {
    min-height: 44px;
    max-height: 35vh;
}

/* ---------------------------------------------------------------
   P0 · iPhone 底部安全区（home indicator）
   前提：chat.html viewport meta 已加 viewport-fit=cover，否则 env()
   恒为 0。composer 与 FAB 的贴边高度都叠上安全带。
   --------------------------------------------------------------- */
#view-chat .chat-composer {
    padding-bottom: calc(0.75rem + env(safe-area-inset-bottom, 0px));
    padding-left: calc(1rem + env(safe-area-inset-left, 0px));
    padding-right: calc(1rem + env(safe-area-inset-right, 0px));
}
#scroll-to-bottom-btn {
    bottom: calc(80px + env(safe-area-inset-bottom, 0px));
}

/* ---------------------------------------------------------------
   P1 · 移动端附件预览条：多文件时封顶内滚，防 composer 无限撑高
   --------------------------------------------------------------- */
#view-chat .attachment-preview {
    max-height: 28vh;
    overflow-y: auto;
}

/* ---------------------------------------------------------------
   P0 · iOS Safari 聚焦自动缩放
   字号 <16px 的输入框在 iOS 获焦会触发整页 zoom ≈2x——用户感知即
   「一输入字界面就变得非常小」且不可逆（需双指缩回）。小屏一律 16px。
   暗色下 14px 被 overlay 用 !important 钉死，需同名对抗规则后置覆盖。
   媒体串取 `not all and (min-width:768px)`：与 Play CDN JIT 的 max-md
   真实媒体串逐字同值（overlay v1.5 R1-13 实测先例），杜绝缩放后
   767~768px 小数视口宽的双标缝。
   --------------------------------------------------------------- */
@media not all and (min-width: 768px) {
    #chat-input {
        font-size: 16px;
    }
    html.dark #chat-input {
        font-size: 16px !important;
    }
}

/* ---------------------------------------------------------------
   P0 · 与暗色 overlay 和解（console-premium-overlay.css）
   该层用 `html.dark #chat-input{max-height:120px !important}` 把输入框
   夹在 120px——「输入区有时候非常小」的**暗色侧真凶**（默认主题=dark，
   「有时候」=暗色 120px / 亮色 180px 两套死高度）。按钮侧同理：
   new/clear/attach/mic=36px、send/FAB=40px 全带 !important，Tailwind
   max-md:min-h-[44px] 压不动，暗色下移动端触摸目标集体回到 <44px。
   本文件在 overlay 之后加载：同 `html.dark`+id 权重、同 !important，
   后来者胜。
   --------------------------------------------------------------- */
html.dark #chat-input {
    min-height: 44px !important;
    max-height: 35vh !important;
    /* overlay 的 `padding:12px 16px !important` 会抹掉 pr-11/max-md:pr-14 避让位，
       暗色下麦克风钮压字。补避让：桌面 8(right-2)+36(暗钮)+8=52；移动端钮升 44 → 56。 */
    padding-right: 52px !important;
}
@media not all and (min-width: 768px) {
    html.dark #chat-input {
        padding-right: 56px !important;
    }
    html.dark #new-chat-btn,
    html.dark #clear-context-btn,
    html.dark #attach-btn,
    html.dark #mic-btn,
    html.dark #send-btn,
    html.dark #send-btn:disabled,
    html.dark #scroll-to-bottom-btn {
        width: 44px !important;
        height: 44px !important;
    }
}

/* ---------------------------------------------------------------
   P0 · WO-RESP-04（2026-09-16）窄屏 header 定高溢出急修
   现场：WO-RESP-02 给 header 挂 flex-wrap 治图标裁切，但 `<header
   class="h-14">` 是 56px 定高——390px 手机内容换行两行后溢出容器，
   第二行图标（简体/主题/书/首页/GitHub/登出）叠压正文标题（实拍
   「配置管理」被压半截）；header 为 SPA 全页共用 ⇒ 每个页面都叠。
   刀（纯 CSS，不动 chat.html 头部 DOM——兄弟票 M 在飞资产节）：
   · `#main-content > header`（433 行 header 是 #main-content 唯一直接
     子 header，全文档仅此一个 <header>）；id 权重 (1,0,1) 压 overlay 的
     `html.dark header{height:56px !important}` (0,1,2)——同为 !important
     时 id 胜，暗色（默认主题）硬钉就此解除；亮色压 h-14 类同理。
   · height:auto + min-height:3.5rem：单行时 44px 触摸钮 + padding-block
     6px×2 ≈ 56px，与原 h-14 等高，桌面观感零回跳；两行时自然撑开，
     row-gap 由 header 自带 gap-3(12px) 拉开，正文下移不重叠。
   · 媒体串取本文件先例 `not all and (min-width: 768px)`——与 Play CDN
     JIT 的 max-md 真实媒体串逐字同值（见上方 iOS 防缩放块注释），
     ≥768px 桌面本块不激活，h-14 原样零变化。
   · 前提核验（grep）：JS 侧无 header offsetHeight/56 类硬依赖——
     console.js:1546 量的是 composer textarea（autoGrow），chat.js/
     console.js 其余 clientHeight 均在消息滚动区与弹层定位。
   --------------------------------------------------------------- */
@media not all and (min-width: 768px) {
    #main-content > header {
        height: auto !important;
        min-height: 3.5rem;
        padding-block: 0.375rem;
    }
}

/* ---------------------------------------------------------------
   P2 · 消息区横向溢出兜底
   · 长 URL / 连续 token：overflow-wrap:anywhere 同时压缩 min-content，
     气泡不再被撑破（user/bot 气泡都挂 .msg-content）。
   · 宽表格：table 默认 display 不能当滚动容器 → 块级化获得 overflow-x
     （`.msg-content pre` 的横向滚动 console.css 已有，不重复）。
   --------------------------------------------------------------- */
.msg-content {
    overflow-wrap: anywhere;
}
.msg-content table {
    display: block;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* ---------------------------------------------------------------
   P1 · TICKET-UIX-0917 M5：状态抽屉 FAB 窄屏贴底叠安全区
   桌面 bottom:100px 基位不动，仅 <768px 抬 home indicator（先例
   #scroll-to-bottom-btn 同款姿势）。z 档已随 M5 沉到 35（chat.html
   内联 style），team 视图显形由 body[data-uix-view] 规则摘除。
   --------------------------------------------------------------- */
@media not all and (min-width: 768px) {
    #chat-drawer-toggle {
        bottom: calc(100px + env(safe-area-inset-bottom, 0px));
    }
}

/* ---------------------------------------------------------------
   P1 · TICKET-UIX-0917 M8：横向过滚掐断
   Android Chrome 横向 overscroll 会触发系统返回手势，与左缘右滑
   呼出侧栏打架——#app 一层 contain 掐死过滚传播（卷案点名一行 CSS）。
   手势逻辑本体在 core/gestures.js（touchmove 仅在候选态临时挂）。
   --------------------------------------------------------------- */
#app {
    overscroll-behavior-x: contain;
}