/* 過場：消 jank 用（D）。display 由 .active 切，opacity 給短淡入淡出 */
.screen { display: none; transition: opacity 0.2s ease; }
.screen.active { display: block; }
/* 結構版：s-input／s-record 是唯二需要跟著鍵盤縮放的畫面，覆寫成 flex column、
高度綁 visualViewport（--chat-vh，由 syncChatViewportHeight 寫入）。height 疊三層
fallback：100vh（連 dvh 語法都不認得的環境）→ 100dvh（認得 dvh 但 JS 還沒跑之前）→
var(--chat-vh, 100dvh)（JS 跑過之後的正式值）。padding-top 是頂部呼吸空間，box-sizing:
border-box 是全域規則，不會破壞這裡的高度算術。
真機補丁：鍵盤動畫開始時，Safari 會對「還沒縮小的舊版面」做一次把 focus 輸入框捲進畫面
的動作；文件被 overflow:hidden 鎖住捲不動，Safari 改用平移 visual viewport（offsetTop
變成非 0）。容器高度縮小跟上之後，visual viewport 還停在舊的平移量，導致容器在畫面裡
對不齊（輸入列跑到最上緣甚至畫面中間）。translateY(--chat-offset) 讓容器跟著 visual
viewport 的 offsetTop 平移，兩者才會永遠對齊——正負號是 +offsetTop（往下），不是
-offsetTop，這是真機量測量出來的，不是憑印象猜的方向。
捲動修正（取代先前 #chat-history／#record-chat-history 各自 overflow-y:auto 的做法）：
那個寫法讓捲動軌道只涵蓋訊息區自己的高度，紀錄頁還要再扣掉標題／任務卡，軌道永遠到不了
螢幕底部。改成整個 screen（已經是滿版 viewport 高度）當唯一的 scroll port，軌道自然頂到
視窗上下緣；overscroll-behavior:contain／-webkit-overflow-scrolling:touch 從舊規則原封
搬過來，語意不變。overflow-x:hidden 是新增的防呆：只設 overflow-y 時瀏覽器會把
overflow-x 隱性算成 auto，可能意外冒出水平捲軸，明講擋掉。 */
#s-input.active, #s-record.active {
display: flex; flex-direction: column;
height: 100vh;
height: 100dvh;
height: var(--chat-vh, 100dvh);
transform: translateY(var(--chat-offset, 0px));
overflow-y: auto; overflow-x: hidden;
overscroll-behavior: contain; -webkit-overflow-scrolling: touch;
}
/* padding-top 只留在 #s-input：它沒有 sticky 標題，這段呼吸空間直接當內容的一部分，
捲動時自然跟著訊息一起滑走，沒問題。#s-record 不在這裡設 padding-top（見下方
.record-header）——scroll port 本身的 padding-top 會在還沒捲動前佔住空間，一捲動
就跟著內容滑走，標題會被拖著一起消失，達不到「標題／任務卡固定」的效果。 */
#s-input.active { padding-top: 1.5rem; }
/* 結構版：這兩頁不再用 position:fixed，document/body 本身也不用再捲動——捲動改交給
上面 #s-input.active/#s-record.active 本身（04d Emily 回饋：改掉舊版「軌道到不了
螢幕底部」的問題）。html 才是 iOS Safari 實際的捲動根（document.scrollingElement），
只讓 body overflow:hidden 未必真的擋得住，class 掛在 上才能同時管到兩層。
⚠️ 這裡**曾經**還要用 `html.chat-fullscreen body.has-fixed-input { padding-bottom: 0 }`
把全站那格輸入列預留在這兩頁蓋掉。2026-08-28 那格預留整條移除（見 10-base.css），
這條蓋回去的規則就成了空操作，一併刪掉。 */
html.chat-fullscreen {
height: 100%; overflow: hidden;
/* 04d Emily 回饋 #6：對話頁捲軸貼視窗右緣。body 在這兩頁改成 100vw 撐滿（見下），
#s-input.active/#s-record.active 這個 flex column 改用這個 padding 把內容（含
#chat-history、.input-bar，#s-record 還多 h1／.info-card）拉回 --content-w 欄寬置中——
公式與原本「body max-width:--content-w + body-pad-x 內距」在各斷點算出同一個內容寬度，
純視覺等價，不是新排版。 */
--bleed-pad: max(var(--body-pad-x), calc((100vw - var(--content-w)) / 2 + var(--body-pad-x)));
}
html.chat-fullscreen body {
margin: 0 auto; overflow: hidden; height: 100%;
max-width: 100vw; padding-left: 0; padding-right: 0;
}
/* 入口行→輸入框視覺上＝輸入框→「建立」鈕的 2.25rem（自建區塊內三元素等距節奏）。
數值取 2rem 是光學補償：「我想到別的」行盒（0.9rem 字 × line-height 1.6）筆畫下緣多 ~5px
透明空隙，margin 若同設 2.25rem 視覺會上大下小；別改回等值，也別動行高
（行高會連帶縮短它與上方選項的視覺距離，破壞對齊 h1 的 2rem 上距） */
#custom-form { margin-top: 2rem; }
/* Dogfood-8：輸入框跟建立任務鈕拉開距離（原 input 通用 margin-bottom 0.875rem 太貼）。
建立任務的緊湊尺寸現在全由 .btn-centered 提供（跟「完成」統一），不再另開 id 覆寫。 */
/* 部分對齊對話輸入框：外觀（圓角 8px、寬鬆高度/內距）統一到同一套語言，
但不做框內送出圖示、保留下方「建立」鈕——這裡是「選一條方向」的提交，不是聊天回合。
padding 左右對稱（對話框右側 2.5rem 是留給送出圖示，這裡無圖示故不沿用）。 */
/* 2026-08-19 由 改成