/* 聊天：想法折叠、动作条、输入框、回到最新。2026-10-02 从 index.html 拆出来；加载顺序见 index.html 的 <link>，前后顺序就是层叠顺序，别乱调 */
  /* ── thinking ── 气泡上方一行「⌄ 展开想法」，展开后是左边一道竖线的小字，底下一道细线跟气泡隔开 ── */
  .row.think{
    justify-content: flex-start;
    padding-left: calc(var(--avatar-size) + 9px);
    margin-top: 16px;
  }
  .row.think + .row.ai{ margin-top: 6px; }
  .think-block{
    max-width: 78%;
    animation: pop .24s cubic-bezier(.2,.8,.2,1) both;
  }
  .think-block.open{ padding-bottom: 7px; border-bottom: 1px solid rgba(60,72,100,.12); }
  .think-toggle{
    appearance: none; -webkit-appearance: none;
    display: flex; align-items: center; gap: 4px;
    border: 0; background: none; padding: 0; margin: 0; cursor: pointer; text-align: left;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
    font-size: 11px; color: var(--text-faint);
    transition: color .15s var(--ease-soft);
  }
  .think-toggle:hover{ color: var(--text-dim); }
  .think-chev{
    width: 11px; height: 11px; flex: none; display: block;
    transition: transform .2s var(--ease-soft);
  }
  .think-block.open .think-chev{ transform: rotate(180deg); }
  .think-body[hidden]{ display: none !important; }
  .think-body{ margin-top: 7px; }
  .think-text{
    margin: 0; padding-left: 10px;
    border-left: 1px solid rgba(60,72,100,.16);
    font-family: var(--font-cn); font-size: 12px; line-height: 1.68; color: var(--text-dim);
    white-space: normal; overflow-wrap: break-word;
  }
  .think-copy{ min-width: 0; }
  .think-copy a{ color: inherit; text-decoration: underline; text-underline-offset: 2px; }
  .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;
  }

  /* ── act ── the AI's action chip: a quiet "what it just did", optionally expand to see raw tool calls ──
     视觉与 thinking 同一族(--think-* 配色),但更小、更收,贴在头像缝隙里,不抢气泡 ── */
  .row.act{
    justify-content: flex-start;
    padding-left: calc(var(--avatar-size) + 9px);
    padding-right: clamp(12px, 4vw, 40px);
    margin-top: clamp(4px, 0.9vw, 9px);
    margin-bottom: clamp(4px, 0.9vw, 9px);
  }
  .act-block{
    max-width: min(80vw, 470px);
    animation: pop .24s cubic-bezier(.2,.8,.2,1) both;
  }
  .act-toggle{
    appearance: none; -webkit-appearance: none;
    margin: 0; padding: 2px 0; border: 0; background: transparent;
    color: inherit; font: inherit; cursor: pointer; text-align: left;
    max-width: 100%;
    display: inline-flex; align-items: baseline; gap: 7px;
  }
  .act-toggle.bare{ cursor: default; }
  .act-toggle:focus-visible{ outline: none; }
  .act-glyph{
    flex: none;
    color: var(--think-flourish);
    font-size: 1.04em; line-height: 1;
    transform: translateY(.06em);
  }
  .act-label{
    color: var(--think-label);
    font-family: var(--font-cn);                /* 统一宋体:--font-en 末尾的通用 serif 会先吃掉 CJK→iOS 回退黑体 */
    font-size: clamp(12px, 1.32vw, 13.5px);
    line-height: 1.46;
    letter-spacing: .02em;
  }
  /* 展开指示:沿用 thinking 的空心星 ✧(收起)→ 实心 ✦(展开),比"· 展开"文字更轻、不突兀 */
  .act-state{
    flex: none;
    color: var(--think-flourish);
    font-size: 1.1em;
    line-height: 1;
    transform: translateY(.02em);
    transition: color var(--motion-fast) var(--ease-soft);
  }
  .act-state::before{ content: "✧"; }
  .act-block.open .act-state::before{ content: "✦"; }
  .act-toggle:hover .act-state{ color: var(--accent); }
  .act-toggle:hover .act-label{ color: var(--think-body); }
  .act-toggle:active{ transform: translateY(1px); }
  .act-detail[hidden]{ display: none !important; }
  .act-detail{
    margin-top: 8px;
    border-radius: 12px;
    background: rgba(127,127,127,0.08);
    border: 1px solid var(--field-line);
    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;
  }
  .act-step + .act-step{
    margin-top: 7px; padding-top: 7px;
    border-top: 1px dashed var(--field-line);
  }
  .act-line{ white-space: pre-wrap; overflow-wrap: anywhere; }
  .act-k{ color: var(--text-faint); user-select: none; }
  .act-v{ color: var(--think-body); }


  /* ── Composer ── */
  .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; flex-wrap:wrap; gap: 8px;
    background: transparent; border:none;
    padding: 8px var(--side-pad) calc(env(safe-area-inset-bottom) + 10px);
    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);
  }
  .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;
  }
  .floatbtn:active{ transform: scale(.9); color: var(--text); }
  .floatbtn:hover{ color: var(--text); }
  .floatbtn svg{ width: clamp(20px, 2.8vw, 28px); height: clamp(20px, 2.8vw, 28px); display:block; }
  /* 发送键：没字时是一颗透明玻璃，打了字才变蓝 */
  .floatbtn.send{
    width:36px; height:36px;
    border:1px solid var(--glass-border);
    background: var(--glass);
    color: var(--text-dim);
    transition: background .2s var(--ease-soft), color .2s var(--ease-soft), box-shadow .2s var(--ease-soft), transform .15s ease;
  }
  .floatbtn.send svg{ width:18px; height:18px; transform: translateY(-1px); }
  .floatbtn.send:hover{ color: var(--text-dim); }
  /* 跟主页面开关同一个藕粉 */
  .floatbtn.send.live{
    background: var(--badge); color: #fff; border-color: var(--badge);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.4), 0 4px 14px rgba(189,160,161,.4);
  }
  .floatbtn.send.live:hover{ color: #fff; }
  .floatbtn.send:active{ transform: scale(.97); }      /* 发送键按压:轻收 3%(比通用 .floatbtn 的 .9 克制) */
  @keyframes send-go{ from{ transform: scale(.96); } to{ transform: scale(1); } }
  .floatbtn.send.send-go{ animation: send-go .22s cubic-bezier(.2,.8,.2,1); }
  @media (prefers-reduced-motion: reduce){ .floatbtn.send.send-go{ animation: none; } }
  .composer .field{
    flex:1 1 auto; display:flex; align-items:center; gap: 6px; min-width:0;
    background: var(--glass-strong);
    border: 1px solid var(--glass-border);
    border-radius: 14px;
    padding: 8px 12px 8px 10px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.55), 0 6px 16px rgba(64,76,112,.08);
  }
  .composer .field .floatbtn,
  .composer .emojibtn{ width:26px; height:26px; color: var(--text-dim); }
  .composer .field .floatbtn svg,
  .composer .emojibtn svg{ width:19px; height:19px; }
  .composer .field .floatbtn:hover,
  .composer .emojibtn:hover{ color: var(--text); }
  .composer textarea{
    font-family: var(--font-cn); font-size: 14px; line-height: 1.5; letter-spacing: .02em;
    padding: 0; max-height: 105px;
  }
  .composer textarea:focus,
  .composer textarea:focus-visible,
  .composer button:focus-visible{
    outline: none;
  }
  textarea{
    flex:1 1 auto; min-width:0; 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: 120px; padding: 6px 0; margin:0;
    scrollbar-width: none; /* Firefox：内容超高时还能滚动，只是不画那条滚动条 */
  }
  textarea::-webkit-scrollbar{ display:none; } /* Chrome/WebKit：同上，Android Chrome上这条滚动条会被误认成一根黑色光标 */
  textarea::placeholder{ color: var(--text-faint); opacity: 1; }
  .emojibtn{
    flex:none; width: clamp(28px, 3.8vw, 38px); height: clamp(28px, 3.8vw, 38px); border:none; background:transparent;
    color: var(--accent); display:grid; place-items:center; cursor:pointer; padding:0;
    transition: transform .15s ease, color .2s ease;
  }
  .emojibtn:active{ transform: scale(.85); color: var(--text); }
  .emojibtn:hover{ color: var(--text); }
  .emojibtn svg{ width: clamp(22px, 3vw, 30px); height: clamp(22px, 3vw, 30px); display:block; }
  .clip-menu{
    position:absolute; left:var(--side-pad); bottom:calc(100% + 2px); z-index:40;
    background:var(--glass-strong);
    -webkit-backdrop-filter:blur(20px) saturate(1.6); backdrop-filter:blur(20px) saturate(1.6);
    border:1px solid var(--glass-border); border-radius:14px;
    box-shadow:inset 0 1px 0 var(--glass-edge), 0 8px 24px rgba(64,76,112,.14);
    padding:6px; display:flex; flex-direction:column; gap:2px; min-width:128px;
    animation: pop .16s cubic-bezier(.2,.8,.2,1) both;
  }
  .clip-menu.hidden{ display:none; }
  .clip-menu button{
    display:flex; align-items:center; gap:10px; width:100%; text-align:left;
    border:none; background:transparent; border-radius:9px; padding:9px 10px;
    font-family:var(--font-cn); font-size:13.5px; color:var(--text); cursor:pointer;
    transition: background-color .15s var(--ease-soft);
  }
  .clip-menu button:hover, .clip-menu button:active{ background:rgba(255,255,255,.5); }
  .clip-menu button svg{ width:18px; height:18px; flex-shrink:0; color:var(--ink); stroke-width:1.5; }
  /* ── 回到最新 · 翻历史时来新消息,底部悬浮一枚安静的半透明胶囊 ── */
  .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(255,255,255,.72); color: #3C4759; border: 1px solid rgba(255,255,255,.5);
    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: inset 0 1px 0 rgba(255,255,255,.7), 0 8px 22px rgba(64,76,112,.18);
    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);
  }
  .newmsg-pill.show{ opacity: 1; pointer-events: auto; transform: translate3d(-50%, calc(-1 * var(--keyboard-offset, 0px)), 0); }
  .newmsg-pill svg{ width: 15px; height: 15px; flex: none; }
  @media (prefers-reduced-motion: reduce){ .newmsg-pill{ transition: opacity .2s ease; } }
