/* 多軌時間軸 dock（SPEC_v2 §13）、手機橫放、鍵盤與選段命名 */
  /* ==================== 多軌時間軸 dock（SPEC_v2 §13）==================== */
  /* 軌道本體的樣式在 /tl/multitrack.css；這裡只管 dock 的版面、把手、標頭上的按鈕與兩個浮層。
     所有規則以 body.has-dock 起頭（JS 依「有開啟的版本、不在首頁／專案頁／登入／挑片」決定），權重高於舊版面規則。 */
  .tl-dock{display:none}
  body.show-home .tl-dock,body.show-dash .tl-dock,body.show-login .tl-dock,body.mode-like .tl-dock{display:none!important}
  body.has-dock .tl-dock{display:flex;flex-direction:column;grid-area:dock;position:relative;z-index:5;min-width:0;min-height:0;background:var(--panel)}
  .tl-dock #mtRoot{flex:1 1 auto;min-height:0;min-width:0}
  body.has-dock .tl-dock{animation:tldockin .34s cubic-bezier(.2,.8,.2,1) both}
  @keyframes tldockin{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
  /* 舊的細時間軸：dock 展開時由多軌時間軸取代（收合時留著，免得完全沒得拖） */
  body.has-dock:not(.dock-collapsed) .scrubber-box .timeline{display:none}
  body.has-dock:not(.dock-collapsed) .scrubber-box .tl-head{margin-bottom:0}
  /* 頂端把手：拖曳調高度（120px～60vh），雙擊還原；鍵盤 ↑↓ */
  .tl-dock-grip{display:none;position:absolute;left:0;right:0;top:-6px;height:12px;z-index:30;cursor:ns-resize;touch-action:none;outline:none}
  body.has-dock .tl-dock-grip{display:block}
  body.has-dock.dock-collapsed .tl-dock-grip{display:none}
  .tl-dock-grip::before{content:"";position:absolute;left:50%;top:4px;width:40px;height:4px;margin-left:-20px;border-radius:2px;background:var(--txt-faint);opacity:0;transition:opacity .15s,width .18s,background-color .15s}
  .tl-dock-grip::after{content:"";position:absolute;left:0;right:0;top:5px;height:2px;background:var(--accent);opacity:0;transition:opacity .15s}
  .tl-dock-grip:hover::before,.tl-dock-grip:focus-visible::before,.tl-dock-grip.on::before{opacity:.9;width:56px;margin-left:-28px;background:var(--accent)}
  .tl-dock-grip:hover::after,.tl-dock-grip:focus-visible::after,.tl-dock-grip.on::after{opacity:.55}
  body.dock-resizing{cursor:ns-resize;user-select:none;-webkit-user-select:none}
  body.dock-resizing .tl-dock,body.dock-resizing .stage{pointer-events:none}
  body.dock-resizing .tl-dock-grip{pointer-events:auto}
  @media (min-width:1001px){
    body.has-dock.mode-landscape .stage,body.has-dock.mode-portrait .stage{
      grid-template-rows:minmax(0,1fr) var(--dock-eff,268px);grid-template-areas:"video right" "dock dock"}
    body.has-dock.mode-text .stage{grid-template-rows:minmax(0,1fr) var(--dock-eff,268px);grid-template-areas:"text video" "dock dock"}
    body.has-dock .stage{transition:grid-template-rows .22s cubic-bezier(.2,.8,.2,1)}
    body.dock-resizing .stage{transition:none}
    /* 影片高度讓出 dock 的位置：影片＋時間碼列要整個看得到，其餘（留言框）在欄內捲 */
    body.has-dock{--pw-h:max(190px,calc(100vh - var(--tb-h,60px) - 51px - var(--dock-eff,268px) - 134px))}
    body.has-dock .player-wrap{flex:none}   /* 欄高變矮時影片不准被 flex 壓扁（fixPlayerBox 會誤判成塌陷） */
    body.has-dock.mode-landscape:not(.mode-text) .player-wrap{max-height:min(62vh,var(--pw-h));max-width:calc(min(62vh,var(--pw-h)) * 16 / 9)}
    body.has-dock.mode-portrait:not(.mode-text):not(.portrait-fill) .player-wrap{max-height:min(72vh,var(--pw-h));max-width:calc(min(72vh,var(--pw-h)) * 9 / 16)}
  }
  /* 手機／窄螢幕：dock 是底部面板；預設收成只剩標頭，展開最高 40vh（再高就把閱讀空間吃光了） */
  .tl-lbl-m,.tl-mini{display:none}
  /* 收合條裡的一次性提示（rv_tl_seen／rv_tl_chint 都沒有才出現；高度同 MT_CHINT_H） */
  .tl-chint{display:none}
  body.has-dock.dock-collapsed.tl-chint-on .tl-chint{display:flex;align-items:center;gap:8px;flex:none;width:100%;height:28px;padding:0 14px;text-align:left;
    font:600 12.5px/1 var(--sans);color:var(--txt-dim);border-top:1px solid color-mix(in srgb,var(--line) 70%,transparent);animation:tlpop .24s cubic-bezier(.2,.9,.3,1.3) both}
  body.has-dock.dock-collapsed.tl-chint-on .tl-chint::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:#ff6b81;box-shadow:0 0 0 3px rgba(255,107,129,.2)}
  .tl-chint:hover{color:var(--txt)}
  .tl-chint:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
  /* 觸控：提示條本身是按鈕，高度 44px（MT_CHINT_H 在粗指標時也是 44；手機的 stage 底部留白、toast 位置同步多 16px） */
  @media (pointer:coarse){body.has-dock.dock-collapsed.tl-chint-on .tl-chint{height:44px}}
  @media (max-width:1000px){
    body.has-dock .tl-dock{position:fixed;grid-area:auto;left:0;right:0;bottom:0;z-index:40;
      height:min(40vh,var(--dock-nat,420px));height:min(40dvh,var(--dock-nat,420px));
      padding-bottom:env(safe-area-inset-bottom);border-radius:14px 14px 0 0;overflow:hidden;
      box-shadow:0 -14px 36px rgba(0,0,0,.55),0 -1px 0 var(--line)}
    body.has-dock.dock-collapsed .tl-dock{height:auto}
    body.has-dock .tl-dock-grip{display:none}
    body.has-dock .mt-head{height:56px}
    /* 觸控目標一律 ≥44px 高（標頭按鈕、設起點／設終點／建立、收合鈕、選段清單的刪除鈕） */
    body.has-dock .mt-head .mt-btn,body.has-dock .mt-head .mt-ib,body.has-dock .mt-head .mt-seg .mt-btn,body.has-dock .tl-hb{height:44px;min-height:44px}
    body.has-dock .mt-head .mt-ib{width:44px}
    body.has-dock .mt-head .mt-btn{min-width:44px}
    body.has-dock .tl-hb{min-width:44px;justify-content:center}   /* round 8：窄螢幕「起點／終點」文字只有 2 字，按鈕寬 43px（差 1px）：寬度也守 44px */
    body.has-dock .mt-coach .mt-coach-x,body.has-dock .mt-more{min-height:44px;padding-left:16px;padding-right:16px}   /* 元件內的提示泡泡「知道了」、「還有 N 軌」也是觸控目標 */
    body.has-dock .tl-hb{padding:0 12px;font-size:13px}
    body.has-dock .tl-ms .tl-go{min-width:48px;justify-content:center}
    body.has-dock .tl-rr{grid-template-columns:8px minmax(0,1fr) 44px;min-height:48px}
    body.has-dock .tl-rx{width:44px;height:44px;opacity:.8}
    body.has-dock .tl-mi{min-height:52px}
    body.has-dock .mt-pend{display:none}
    body.has-dock .stage{padding-bottom:calc(min(40vh,var(--dock-nat,420px)) + env(safe-area-inset-bottom) + 14px);padding-bottom:calc(min(40dvh,var(--dock-nat,420px)) + env(safe-area-inset-bottom) + 14px)}
    body.has-dock.dock-collapsed .stage{padding-bottom:calc(84px + env(safe-area-inset-bottom))}
    body.has-dock.dock-collapsed.tl-chint-on .stage{padding-bottom:calc(112px + env(safe-area-inset-bottom))}
    body.has-dock .toast{bottom:calc(min(40vh,var(--dock-nat,420px)) + 18px);bottom:calc(min(40dvh,var(--dock-nat,420px)) + 18px)}
    body.has-dock.dock-collapsed .toast{bottom:calc(94px + env(safe-area-inset-bottom))}
    body.has-dock.dock-collapsed.tl-chint-on .toast{bottom:calc(122px + env(safe-area-inset-bottom))}
    .tl-ms{display:flex!important}
    /* 收合條＝「時間軸・選段 N」＋起點／終點鈕＋展開鈕；下面一條 8px 迷你總覽（選段色塊＋播放頭） */
    body.has-dock.dock-collapsed .tl-lbl-m{display:inline-flex;align-items:center;gap:8px;margin-right:auto;min-height:44px;padding:0 6px 0 2px;font:700 14px/1 var(--sans);color:var(--txt);white-space:nowrap}
    body.has-dock.dock-collapsed .tl-lbl-m b{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:20px;padding:0 6px;border-radius:10px;font:700 12px/1 var(--mono);background:#ff6b81;color:#1d0a10}
    body.has-dock.dock-collapsed .tl-hx{flex:1;min-width:0}
    body.has-dock.dock-collapsed .tl-hx.pend .tl-lbl-m{display:none}
    body.has-dock.dock-collapsed .tl-hx.pend{justify-content:flex-end}
    body.has-dock.dock-collapsed .tl-rb,body.has-dock.dock-collapsed .tl-xb,body.has-dock.dock-collapsed .mt-spacer,body.has-dock.dock-collapsed .mt-clock{display:none}
    body.has-dock.dock-collapsed .mt-extra{flex:1;min-width:0}
    body.has-dock.dock-collapsed .tl-mini{display:block;flex:none;padding:2px 14px 8px;cursor:pointer;touch-action:manipulation}
    .tl-mini-t{position:relative;height:8px;border-radius:4px;background:color-mix(in srgb,var(--txt) 13%,transparent)}
    .tl-mini-r{position:absolute;inset:0;border-radius:4px;overflow:hidden}
    .tl-mini-r i{position:absolute;top:0;bottom:0;min-width:3px;border-radius:2px;background:#ff6b81}
    .tl-mini-r i.oth{background:rgba(255,107,129,.28);box-shadow:inset 0 0 0 1px rgba(255,107,129,.8)}
    .tl-mini-ph{position:absolute;top:-3px;bottom:-3px;width:2px;margin-left:-1px;border-radius:1px;background:var(--txt);box-shadow:0 0 0 1px rgba(0,0,0,.45)}
    .tl-coach{bottom:70px}
  }
  @media (max-width:640px){
    body.has-dock .mt-seg,body.has-dock .mt-snapbtn,body.has-dock .mt-zoom .mt-ib{display:none}
    .tl-hx{gap:4px}
    body.has-dock .tl-hb{padding:0 10px}
    /* round 7：標頭的「選段 N」「匯出」以前在手機上只剩圖示（[-]① ⬇▾），對怕剪輯的客戶看不出是什麼：留文字、拿掉前面的小圖示，「設起點／設終點」縮成「起點／終點」換出寬度 */
    .tl-hb .tl-ph{display:none}
    body.has-dock.dock-collapsed .tl-hb .tl-ph{display:inline}   /* 收合條空間夠：維持「設起點／設終點」 */
    .tl-rb>svg:first-child,.tl-xb>svg:first-child{display:none}
    .tl-hb i{font-style:normal}
  }
  @media (max-width:420px){
    body.has-dock .mt-zoom{display:none}
    body.has-dock .tl-ms .tl-hb{padding:0 9px;font-size:12.5px}
  }

  /* 觸控目標 ≥44px（第五輪）：頂列按鈕與 logo、專案首頁的搜尋／分組／分頁／✎、對話框按鈕、時間軸總覽條（手機觸控把條本身加高到 44px，見下）。
     收合條裡的迷你總覽（#tlMini）是 aria-hidden 的點整條展開捷徑，真正的展開鈕（標籤、⌃）本來就 ≥44px */
  @media (pointer:coarse){
    .topbar .icon-btn,.topbar .logo{min-height:44px}
    .ih-tools input,.ih-tools select,.ih-tabs button,.ih-owner{min-height:44px}
    .ih-ed{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center}
    .modal-actions .cancel,.modal-actions .ok{min-height:44px}
    @media (max-width:640px){.ih-row .ih-ed{position:absolute;top:0;right:0}.ih-row .ih-rt{padding-right:40px}}   /* 手機列會換行：✏️ 放在列的右上角，不要自己佔一整行 */
  }
  @media (max-width:1000px) and (pointer:coarse){.tl-dock .mt-root{--mt-ovw-h:45px}}   /* 總覽條（拖動平移的滑桿）22→45px：元件的自然高度／精簡判斷讀同一個變數（multitrack.js _ovwH）。45＝44px 的點擊區＋.mt-ovw 上緣 1px 邊線（以前設 44，滑桿本身只有 43px，差 1px 不到 44） */
  @media (max-width:1000px) and (pointer:coarse){   /* 收合條提示 28→44px：stage 底部留白、toast 位置跟著多 16px（接在 ≤1000px 那組規則後面，同權重靠順序） */
    body.has-dock.dock-collapsed.tl-chint-on .stage{padding-bottom:calc(128px + env(safe-area-inset-bottom))}
    body.has-dock.dock-collapsed.tl-chint-on .toast{bottom:calc(138px + env(safe-area-inset-bottom))}
  }
  /* round 8：展開的時間軸，收合鈕旁加可見的「收合」（以前只有一個 ⌄ 圖示，名稱只在 aria-label）。≥412px 才放得下（375 寬標頭已經滿了：時間／起點／終點／選段／匯出／⌄） */
  @media (min-width:412px) and (max-width:1000px){
    body.has-dock:not(.dock-collapsed) .mt-head .mt-collapse{width:auto;min-width:44px;padding:0 10px 0 8px;gap:2px;display:inline-flex;align-items:center;justify-content:center}
    body.has-dock:not(.dock-collapsed) .mt-head .mt-collapse::after{content:"收合";font:600 12.5px/1 var(--sans);color:var(--txt-dim)}
  }
  @media (max-width:411px){   /* 更窄（375）標頭沒有橫向空間：⌄ 圖示下面疊一行小字「收合」，按鈕維持 44×44 */
    body.has-dock:not(.dock-collapsed) .mt-head .mt-collapse{flex-direction:column;gap:2px;justify-content:center}
    body.has-dock:not(.dock-collapsed) .mt-head .mt-collapse::after{content:"收合";font:600 11px/1 var(--sans);color:var(--txt-dim)}
  }
  /* ---- round 8：手機橫放（高 ≤480，667x375／844x390…）文字模式＝左影片、右逐字稿 ----
     以前單欄堆疊：頂列 60＋影片列 57＋收合的 dock 75，閱讀區只剩約 183px（1–2 句）；dock 展開（150px）只剩 108px，播放中的句子還被蓋住大半。
     現在跟桌機同一套結構：影片（常駐展開、不再收成一條）在左欄，逐字稿在右欄（#textCol 自己捲，stScroller／位置還原照舊），
     時間軸 dock 只蓋右欄（左欄的影片一直看得到）；dock／選段列蓋住的高度（--rv-padb）當逐字稿底部留白與 scroll-padding，播放跟隨的句子對準「看得到的那一塊」的中心，不會被 dock 蓋住。 */
  @media (max-width:1000px) and (max-height:480px) and (orientation:landscape){
    body.mode-text{--tx-vcw:clamp(220px,38%,380px)}
    body.mode-text .stage{overflow:hidden;grid-template-columns:var(--tx-vcw) minmax(0,1fr);grid-template-rows:minmax(0,1fr);grid-template-areas:"video text";padding-bottom:0!important}
    body.mode-text .video-col{position:static;overflow-x:hidden;overflow-y:auto;min-height:0;padding:8px;border-bottom:0;border-right:1px solid var(--line)}
    body.mode-text .player-wrap,body.mode-text.mode-landscape .player-wrap{max-height:none;max-width:none;width:100%}
    body.mode-text.mode-portrait .player-wrap{max-height:calc(100dvh - var(--tb-h,52px) - 100px);max-width:calc((100dvh - var(--tb-h,52px) - 100px) * 9 / 16)}
    body.mode-text #txVidMin{display:none}   /* 影片一直展開，不需要「收起影片」 */
    body.mode-text .tl-controls{display:none}   /* 左欄只有 ≈250–380px：比照 ≤640px 手機，時間碼盤只留時間＋進度條＋CC 字幕鈕（逐格／變速／fps 收掉） */
    body.mode-text .tl-time{font-size:14px;white-space:nowrap}
    body.mode-text #ccBtn{white-space:nowrap}
    body.mode-text .tl-head{flex-wrap:wrap;row-gap:4px;column-gap:8px}   /* 窄左欄（568x320＝220px）：時間放不下 CC 字幕鈕就換行，不要把鈕擠出欄外 */
    body.mode-text .text-col{overflow-y:auto;overscroll-behavior:contain;scroll-padding-bottom:var(--rv-padb,0px)}
    body.mode-text .tx-lines{padding-bottom:calc(var(--rv-padb,0px) + 16px)}
    body.has-dock.mode-text .tl-dock{left:var(--tx-vcw);border-left:1px solid var(--line);border-radius:14px 0 0 0}
    body.has-dock.dock-collapsed.mode-text .tl-mini{display:none}   /* 收合條下面那條 8px 迷你總覽（+ 上下留白共 19px）：矮橫放的每一像素都是閱讀區；展開鈕與起訖鈕照舊 */
    /* dock 只剩右欄那麼寬（≈250–620px）：標頭排版比照 ≤640px 的手機（那組規則看的是視窗寬，這裡視窗是 667–932 但 dock 才 414–580） */
    body.has-dock.mode-text .mt-seg,body.has-dock.mode-text .mt-snapbtn,body.has-dock.mode-text .mt-zoom .mt-ib{display:none}
    body.has-dock.mode-text .tl-hx{gap:4px}
    body.has-dock.mode-text .tl-hb{padding:0 10px}
    body.has-dock.mode-text .tl-hb .tl-ph{display:none}
    body.has-dock.dock-collapsed.mode-text .tl-hb .tl-ph{display:inline}
    body.has-dock.mode-text .tl-rb>svg:first-child,body.has-dock.mode-text .tl-xb>svg:first-child{display:none}
    body.has-dock.mode-text .tl-hb i{font-style:normal}
    body.mode-text.lv-pickbar-on .lv-pickbar{left:var(--tx-vcw)}
    body.has-dock.mode-text .toast{left:calc(50% + var(--tx-vcw) / 2)}
  }
  @media (max-width:720px) and (max-height:480px) and (orientation:landscape){body.has-dock.mode-text .mt-zoom{display:none}}   /* dock 窄於約 430px（≤420px 手機那組規則同理由）：縮放滑桿讓位 */
  @media (min-width:641px) and (max-width:1000px) and (max-height:480px) and (orientation:landscape){.topbar{height:52px}}   /* 矮橫放：頂列 60→52（--tb-h 跟著量到）；≤640 寬的橫放手機維持原本的換行頂列 */

  /* 標頭上的按鈕（掛在 MultiTrack 的 header extra 槽） */
  .tl-hx{display:flex;align-items:center;gap:6px;min-width:0}
  .tl-coach{position:absolute;right:14px;bottom:58px;z-index:20;display:flex;align-items:center;gap:10px;max-width:min(380px,calc(100% - 28px));padding:8px 8px 8px 14px;border-radius:10px;
    background:var(--panel-2);border:1px solid color-mix(in srgb,#ff6b81 55%,var(--line));box-shadow:0 10px 30px rgba(0,0,0,.5);font-size:13px;line-height:1.5;color:var(--txt-dim)}
  .tl-coach[hidden]{display:none}
  .tl-coach button{flex:none;min-height:36px;padding:0 12px;border-radius:7px;font-size:13px;font-weight:700;color:#1d0a10;background:#ff6b81}
  .tl-hb{flex:none;height:28px;padding:0 10px;display:inline-flex;align-items:center;gap:6px;border-radius:6px;font:600 12px/1 var(--sans);
    color:var(--txt-dim);box-shadow:inset 0 0 0 1px var(--line);white-space:nowrap;transition:background-color .12s,color .12s,box-shadow .12s,transform .12s}
  .tl-hb:hover{color:var(--txt);background:color-mix(in srgb,var(--txt) 7%,transparent)}
  .tl-hb:active{transform:scale(.97)}
  .tl-hb:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
  .tl-hb svg{flex:none}
  .tl-hb[aria-expanded="true"]{color:var(--txt);background:var(--panel-2);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 60%,var(--line))}
  .tl-hb b{display:inline-flex;align-items:center;justify-content:center;min-width:19px;height:18px;padding:0 5px;border-radius:9px;
    font:700 12px/1 var(--mono);font-variant-numeric:tabular-nums;background:color-mix(in srgb,var(--txt) 12%,transparent);color:var(--txt-dim)}
  .tl-hb.has{color:var(--txt)}
  .tl-hb.has b{background:#ff6b81;color:#1d0a10}
  .tl-hb b.bump{animation:tlbump .46s cubic-bezier(.2,.9,.3,1.5)}
  @keyframes tlbump{0%{transform:scale(1)}38%{transform:scale(1.4)}100%{transform:scale(1)}}
  .tl-hb.tl-xb.has{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 45%,var(--line))}
  .tl-hb.tl-xb.has svg:first-child{color:var(--accent)}
  .tl-ms{display:none;align-items:center;gap:4px}
  .tl-ms .tl-hb em{font:600 12px/1 var(--mono);font-style:normal;font-variant-numeric:tabular-nums}
  .tl-ms .tl-hb em:empty{display:none}
  .tl-ms .tl-hb.set{color:#ff6b81;background:rgba(255,107,129,.12);box-shadow:inset 0 0 0 1px rgba(255,107,129,.5)}
  .tl-ms .tl-go{display:none;background:#ff6b81;color:#1d0a10;box-shadow:none;font-weight:700}
  .tl-ms.has .tl-go{display:inline-flex;animation:tlfade .2s ease both}   /* 只淡入、不縮放：縮放動畫中量到的按鈕只有 43×40，觸控目標檢查會誤判 */
  @keyframes tlfade{from{opacity:0}to{opacity:1}}
  @keyframes tlpop{0%{opacity:0;transform:scale(.9)}100%{opacity:1;transform:none}}
  /* 觸控：>1000px 的平板橫放時標頭矮，按鈕外觀維持 32px、用 ≥44×44 的偽元素當點擊區；≤1000px 時按鈕本身就是 44px（見上面 dock 區段） */
  @media (pointer:coarse){.tl-hb{height:32px;position:relative}
    .tl-hb::before{content:"";position:absolute;left:50%;top:50%;width:max(100%,44px);height:44px;transform:translate(-50%,-50%)}}

  /* 浮層：選段清單／匯出選單（掛在 body，貼著按鈕往上開） */
  .tl-pop{position:fixed;z-index:48;left:0;top:0;width:min(392px,calc(100vw - 16px));max-height:min(58vh,440px);display:flex;flex-direction:column;overflow:hidden;
    background:var(--panel-2);border:1px solid var(--line);border-radius:12px;color:var(--txt);font:13px/1.5 var(--sans);
    box-shadow:0 22px 60px rgba(0,0,0,.62),0 0 0 1px rgba(0,0,0,.28);
    opacity:0;transform:translateY(8px) scale(.985);transform-origin:50% 100%;
    transition:opacity .13s ease,transform .18s cubic-bezier(.2,.9,.3,1.1)}
  .tl-pop.on{opacity:1;transform:none}
  .tl-pop-h{flex:none;display:flex;align-items:baseline;gap:9px;padding:11px 14px 9px;border-bottom:1px solid var(--line)}
  .tl-pop-h b{font-size:13px;font-weight:700}
  .tl-pop-h span{font:500 12px/1 var(--mono);color:var(--txt-faint);font-variant-numeric:tabular-nums}
  .tl-pop-list{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:5px}
  .tl-rr{position:relative;display:grid;grid-template-columns:8px minmax(0,1fr) 28px;column-gap:11px;align-items:start;width:100%;padding:8px 4px 8px 11px;
    border-radius:8px;text-align:left;cursor:pointer;transition:background-color .1s}
  .tl-rr:hover,.tl-rr:focus-visible{background:color-mix(in srgb,var(--txt) 7%,transparent);outline:none}
  .tl-rr:focus-visible{box-shadow:inset 0 0 0 2px var(--accent)}
  .tl-rr.sel{background:color-mix(in srgb,#ff6b81 11%,transparent)}
  .tl-rr i{width:8px;height:8px;border-radius:50%;margin-top:6px;background:#ff6b81}
  .tl-rr.oth i{background:transparent;box-shadow:inset 0 0 0 1.5px #ff6b81;opacity:.8}
  .tl-rr .rt{display:flex;align-items:baseline;gap:8px;min-width:0}
  .tl-rr .rt b{font-size:13px;font-weight:700;max-width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .tl-rr .rt span{font:600 12px/1 var(--mono);color:var(--txt-dim);font-variant-numeric:tabular-nums;white-space:nowrap}
  .tl-rr .rt em{font:600 12px/1 var(--mono);font-style:normal;color:var(--txt-dim);font-variant-numeric:tabular-nums;margin-left:auto;white-space:nowrap}
  /* 跳轉按鈕＝時間範圍：真正的 <button>（讀屏器知道能按、有名稱）；::after 撐滿整列當點擊區，名稱／✎／✕ 疊在它上面各自可點 */
  .tl-rr .rt .tl-rj{font:600 12px/1 var(--mono);color:var(--txt-dim);font-variant-numeric:tabular-nums;white-space:nowrap;background:none;border:0;padding:6px 0;margin:-6px 0;cursor:pointer}   /* r7 comp：padding 6px＋負 margin＝按鈕本身 24px 高、版面不動（舊：94×12；::after 本來就把整列變成點擊範圍） */
  .tl-rr .rt .tl-rj::after{content:"";position:absolute;inset:0}
  .tl-rr .rt b[data-rn],.tl-rr .tl-rn,.tl-rr .tl-rx,.tl-rr .tl-ov{position:relative;z-index:1}
  .tl-rr .rt .tl-rj:focus-visible{outline:none}
  .tl-rr:has(.tl-rj:focus-visible){background:color-mix(in srgb,var(--txt) 7%,transparent);box-shadow:inset 0 0 0 2px var(--accent)}
  .tl-rr .rs{margin-top:2px;font-size:12px;line-height:1.5;color:var(--txt-dim);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
  .tl-rr .rs q{quotes:none;color:var(--txt-dim)}
  .tl-rr .rs .rn-note{color:var(--txt-dim)}
  /* 窄螢幕：名稱＋✎ 自成一行（不被時間、「重疊」標籤擠成「白血…」），時間與長度換到下一行 */
  @media (max-width:480px){.tl-rr .rt{flex-wrap:wrap;row-gap:1px}.tl-rr .rt b{max-width:calc(100% - 34px)}.tl-rr .rt em{margin-left:auto}}
  /* 名稱旁的 ✎（改名／備註）：滑過、選取、焦點時才出現；觸控裝置一直在，點擊範圍 44px */
  .tl-rr .rt b[data-rn]{cursor:text;border-radius:4px}
  .tl-rr .rt b[data-rn]:hover{text-decoration:underline dotted;text-underline-offset:3px;text-decoration-color:var(--txt-faint)}
  .tl-rn{position:relative;flex:none;align-self:center;width:24px;height:24px;margin-left:-6px;margin-right:-2px;border-radius:5px;font-size:12px;line-height:1;color:var(--txt-dim);opacity:0;transition:opacity .1s,background-color .1s,color .1s}
  .tl-rr:hover .tl-rn,.tl-rr:focus-within .tl-rn,.tl-rr.sel .tl-rn,.tl-rn:focus-visible{opacity:1}
  .tl-rn:hover,.tl-rn:focus-visible{background:color-mix(in srgb,var(--txt) 12%,transparent);color:var(--txt);outline:none}
  .tl-rn:focus-visible{box-shadow:0 0 0 2px var(--accent)}
  .tl-rn::before{content:"";position:absolute;left:50%;top:50%;width:24px;height:24px;transform:translate(-50%,-50%)}   /* round 6：滑鼠也有 24×24 的點擊範圍（WCAG 2.5.8）；觸控 44×44 */
  @media (pointer:coarse){.tl-rn{opacity:.9;width:24px;height:24px}.tl-rn::before{width:44px;height:44px}}
  .tl-ov{flex:none;display:inline-flex;align-items:center;height:18px;padding:0 7px;border-radius:9px;text-decoration:none;font:700 12px/1 var(--sans);letter-spacing:.02em;color:var(--note);background:rgba(255,184,77,.13);box-shadow:inset 0 0 0 1px rgba(255,184,77,.42);white-space:nowrap}
  .tl-rr.editing{background:color-mix(in srgb,var(--accent) 8%,transparent);cursor:default}
  .tl-ed{display:flex;flex-direction:column;gap:7px;padding:1px 0 2px;cursor:default}
  .tl-ed label{display:flex;flex-direction:column;gap:3px;font-size:12px;color:var(--txt-faint)}
  .tl-ed input{width:100%;box-sizing:border-box;min-height:32px;padding:5px 9px;border-radius:6px;border:1px solid var(--line);background:var(--panel);color:var(--txt);font:13px/1.4 var(--sans);outline:none}
  .tl-ed input:focus{border-color:var(--accent);box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 28%,transparent)}
  .tl-ed-b{display:flex;gap:6px;justify-content:flex-end}
  .tl-ed-b button{min-height:32px;padding:0 14px;border-radius:7px;font:600 12.5px/1 var(--sans);color:var(--txt-dim);box-shadow:inset 0 0 0 1px var(--line)}
  .tl-ed-b button:hover{color:var(--txt)}
  .tl-ed-b button.ok{background:var(--accent-fill);color:#fff;box-shadow:none}
  .tl-ed-b button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
  @media (pointer:coarse){.tl-ed input{min-height:44px;font-size:16px}.tl-ed-b button{min-height:44px;padding:0 18px}}
  .tl-rx{width:26px;height:26px;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;color:var(--txt-dim);font-size:13px;opacity:0;transition:opacity .1s,background-color .1s,color .1s}
  .tl-rr:hover .tl-rx,.tl-rr:focus-within .tl-rx,.tl-rr.sel .tl-rx{opacity:1}
  .tl-rx:hover,.tl-rx:focus-visible{background:rgba(255,107,107,.16);color:var(--warn);opacity:1;outline:none}
  @media (pointer:coarse){.tl-rx{opacity:.9}}
  .tl-empty{padding:26px 22px 24px;text-align:center;color:var(--txt-faint);line-height:1.85;font-size:12.5px}
  .tl-empty svg{display:block;margin:0 auto 10px;opacity:.55}
  .tl-empty b{display:block;color:var(--txt-dim);font-size:14px;font-weight:600;margin-bottom:2px}
  .tl-empty .m{display:none}
  @media (max-width:1000px){.tl-empty .d{display:none}.tl-empty .m{display:inline}}
  .tl-pop-menu{width:min(330px,calc(100vw - 16px))}
  .tl-pop-menu .tl-pop-list{padding:5px}
  .tl-mi{display:grid;grid-template-columns:38px minmax(0,1fr);column-gap:12px;align-items:center;width:100%;padding:9px 10px;border-radius:8px;text-align:left;cursor:pointer;transition:background-color .1s}
  .tl-mi:hover,.tl-mi:focus-visible{background:color-mix(in srgb,var(--txt) 8%,transparent);outline:none}
  .tl-mi:focus-visible{box-shadow:inset 0 0 0 2px var(--accent)}
  .tl-mi u{text-decoration:none;display:flex;align-items:center;justify-content:center;height:30px;border-radius:7px;font:700 12px/1 var(--mono);letter-spacing:.02em;
    color:var(--txt);background:color-mix(in srgb,var(--accent) 13%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 30%,transparent)}
  .tl-mi b{display:block;font-size:13px;font-weight:600;line-height:1.35}
  .tl-mi small{display:block;font-size:12px;line-height:1.4;color:var(--txt-dim);margin-top:1px}
  .tl-mi[disabled]{opacity:.38;cursor:not-allowed;pointer-events:none}
  .tl-pop-note{padding:2px 14px 11px;font-size:12px;color:var(--txt-faint);line-height:1.6}
  /* 匯出選單的影格率：偵測中、選擇（4x2）、選單底部「影格率 29.97 fps　更改」 */
  .tl-pop-note b{color:var(--txt-dim);font-weight:600;overflow-wrap:anywhere}
  .tl-fp-wait{padding:12px 14px 6px}
  .tl-fp-line{display:flex;align-items:center;gap:8px;padding-bottom:4px}
  .tl-fp-line b{font-variant-numeric:tabular-nums}
  .tl-fp-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;padding:2px 12px 8px}
  .tl-fp-act{display:flex;justify-content:flex-end;padding:0 12px 10px}
  .tl-fpb{min-height:44px;padding:0 12px;border-radius:8px;border:1px solid var(--line);background:transparent;color:var(--txt);font:600 13px/1 var(--mono);font-variant-numeric:tabular-nums;cursor:pointer;transition:background-color .1s,border-color .1s}
  .tl-fpb:hover{background:color-mix(in srgb,var(--txt) 8%,transparent)}
  .tl-fpb:focus-visible{outline:none;box-shadow:0 0 0 2px var(--accent)}
  .tl-fpb[aria-checked="true"]{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 14%,transparent)}
  /* 輸出範圍（全部／只要我的）：匯出選單裡 .tl-sc，右欄選段卡上 .tx-scope（同一個設定 rv_ex_scope） */
  .tl-sc{display:flex;gap:6px;padding:8px 12px 2px}
  .tl-scb,.tx-scope button{min-height:32px;padding:0 10px;border-radius:8px;border:1px solid var(--line);background:transparent;color:var(--txt-dim);font-size:12.5px;font-weight:600;line-height:1.2;transition:background-color .1s,border-color .1s,color .1s}
  .tl-scb{flex:1 1 0;min-height:36px}
  .tl-scb:hover,.tx-scope button:hover{color:var(--txt);border-color:var(--accent)}
  .tl-scb[aria-checked="true"],.tx-scope button[aria-checked="true"]{color:var(--txt);border-color:var(--accent);background:color-mix(in srgb,var(--accent) 14%,transparent)}
  .tl-scb:focus-visible,.tx-scope button:focus-visible{outline:none;box-shadow:0 0 0 2px var(--accent)}
  .tx-scope{flex:none;display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0 0 6px;font-size:12px;color:var(--txt-dim)}
  .tx-scope[hidden]{display:none}
  @media (pointer:coarse){.tl-scb,.tx-scope button{min-height:44px}}
  @media (prefers-reduced-motion:reduce){.tl-scb,.tx-scope button{transition:none}}
  .tl-fp-act .tl-fpb,.tl-fp-line .tl-fpb{font:600 12px/1 var(--sans,inherit);min-height:32px;padding:0 10px;border-color:transparent;color:var(--txt-dim)}
  .tl-fp-line .tl-fpb{margin-left:auto;text-decoration:underline;text-underline-offset:3px}
  @media (pointer:coarse){.tl-fp-act .tl-fpb,.tl-fp-line .tl-fpb{min-height:44px}}
  @media (prefers-reduced-motion:reduce){.tl-pop,.tl-hb,.tl-rr,.tl-mi,.tl-dock-grip::before,.tl-dock-grip::after,body.has-dock .stage{transition:none!important}.tl-ms.has .tl-go,body.has-dock .tl-dock,.tl-hb b.bump,.tl-chint{animation:none!important}}
  /* 文字模式：時間軸雙擊句子塊 → 逐字稿捲到該句並閃一下 */
  .tx-line.tx-flash{animation:txflash 1.5s ease-out}
  @keyframes txflash{0%,18%{background:rgba(91,140,255,.42);box-shadow:inset 3px 0 0 var(--accent)}100%{background:transparent;box-shadow:none}}
  /* ==================== 第四輪（SPEC_v2 §13.6）：鍵盤、選段命名、右欄、手機標頭、減少動態 ==================== */
  /* 跳到時間軸／逐字稿：平常藏在畫面外，Tab 到才滑進來（第一個、第二個停靠點） */
  .skip-links{position:fixed;left:12px;top:10px;z-index:300;display:flex;gap:8px;transform:translateY(calc(-100% - 24px));transition:transform .14s ease}
  .skip-links:focus-within{transform:none}
  .skip-link{display:none;align-items:center;min-height:44px;padding:0 18px;border-radius:9px;background:var(--accent-fill);color:#fff;font:700 14px/1 var(--sans);text-decoration:none;
    box-shadow:0 8px 24px rgba(0,0,0,.5)}
  .skip-link:focus-visible{outline:2px solid #fff;outline-offset:-5px}
  body.has-dock #skipTl,body.mode-text:not(.show-home) #skipTx{display:inline-flex}
  /* 逐字稿用「移動式 tabindex」：整份只有一個停靠點，↑／↓ 在句子間移動。焦點在哪一句要看得出來 */
  .tx-ck input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
  .tx-line:has(.tx-ck input:focus-visible){outline:2px solid var(--accent);outline-offset:-2px;background:rgba(91,140,255,.09)}
  /* 右欄：選段在上、待確認用字可收合 */
  .tx-hint{font-size:13px;line-height:1.55;color:var(--txt-dim);margin:-2px 0 6px}
  .tx-ch-btn{width:100%;margin-bottom:0;text-align:left;color:inherit;font-family:inherit;min-height:32px;border-radius:6px}
  .tx-ch-btn:hover{color:var(--txt)}
  .tx-ch-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
  .tx-ch-btn .arr{display:inline-block;width:10px;flex:none;color:var(--txt-faint);font-size:11px;transition:transform .15s}
  .tx-card.open .tx-ch-btn .arr{transform:rotate(90deg)}
  .tx-card.open .tx-ch-btn{margin-bottom:6px}
  #txTerms[hidden]{display:none}
  /* 選段卡片：名稱（粗）＋時間；講者／選的人是次要字；備註自己一行；逐字稿摘錄在後 */
  .tx-pick .tpn{display:flex;align-items:baseline;gap:8px;min-width:0}
  .tx-pick .tpn .nm{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px}
  .tx-pick .tpn .tc{margin:0 0 0 auto;flex:none}
  .tx-pick .tps{font-size:13px;color:var(--txt-faint);margin-top:1px}
  .tx-pick .tpnote{margin-top:3px;font-size:13px;line-height:1.5;color:var(--txt);overflow-wrap:anywhere}
  .tx-pick .tpnote span{color:var(--txt-faint)}
  .tx-pick .tpt{margin-top:3px;font-size:13px;line-height:1.55;color:var(--txt-dim);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
  /* 時間軸上的選段清單：備註自己一行、不截斷；講者（＋選的人）是次要字，摘錄在最後 */
  .tl-rr .rn{margin-top:3px;font-size:12.5px;line-height:1.5;color:var(--txt);overflow-wrap:anywhere}
  .tl-rr .rn span{color:var(--txt-faint)}
  .tl-rr .rs .rm{color:var(--txt-faint);margin-right:7px}
  /* 沒有逐字稿的版本（例如成片）：沒有句子可貼齊，「貼齊句子」鈕不出現 */
  body.tl-notext .mt-snapbtn{display:none}
  /* 觸控：CC 字幕、影片列的按鈕至少 44×44 */
  @media (pointer:coarse){.tl-btn,.tl-speed{min-height:44px;min-width:44px}.cc-btn{padding:0 16px}}
  /* 手機：展開 dock 後閱讀空間只剩一小塊 → 文字模式的標頭收成一列（標題＋「篩選」＋影片鈕），篩選條與搜尋藏在「篩選」後面 */
  #txFiltBtn{display:none}
  #txFiltBtn[hidden]{display:none!important}
  @media (max-width:1000px){
    #txFiltBtn{min-height:44px}
    /* round 7：精簡標題（單顆「篩選」鈕）不只在 dock 展開時用——矮螢幕（高 ≤700：375x667）一律用（JS txApplyVidMin 依「手機＋（高 ≤700 或 dock 展開）」切 body.tx-fold）：
       標題＋篩選＋搜尋原本佔 220px，第一句從 y≈398 才開始；收成一列 48px 後 375x667 首屏約 5 句 */
    body.mode-text.tx-fold #txFiltBtn{display:inline-flex;align-items:center;gap:6px;flex:none;padding:0 12px;border:1px solid var(--line);border-radius:7px;background:var(--panel-2);color:var(--txt-dim);font-size:13px;font-weight:600}
    body.mode-text.tx-fold #txFiltBtn[aria-expanded="true"]{color:var(--txt);border-color:var(--accent);background:rgba(91,140,255,.15)}
    body.mode-text.tx-fold #txFiltBtn.act::after{content:"";width:7px;height:7px;border-radius:50%;background:var(--accent)}
    body.mode-text.tx-fold .tx-head{padding:2px 10px;gap:0}
    body.mode-text.tx-fold #txItemMeta{display:none}
    body.mode-text.tx-fold .tx-title b{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
    body.mode-text.tx-fold .tx-filters{display:none}
    body.mode-text.tx-fold.tx-filt-open .tx-filters{display:flex;padding:4px 0 8px}
    /* 影片列（釘在頂端）與底部浮層（dock／選段列）佔掉的高度當作捲動邊界：播放跟隨用的 scrollIntoView({block:'center'}) 對準「看得到的那一塊」的中心，目前句不會被蓋住（橫放手機＋時間軸展開以前蓋住 15–44px） */
    .stage{scroll-padding-top:var(--rv-padt,0px);scroll-padding-bottom:var(--rv-padb,0px)}
  }
  /* 減少動態：逐字稿閃一下改成靜態高亮（不動畫）；選段清單的 ✎／✕ 不再淡入淡出；跳過連結不滑動 */
  @media (prefers-reduced-motion:reduce){
    .tx-line.tx-flash{animation:none!important;background:rgba(91,140,255,.3)!important;box-shadow:inset 3px 0 0 var(--accent)!important}
    .tl-rn,.tl-rx,.tl-rr .tl-rn,.tl-rr .tl-rx,.tx-ch-btn .arr,.skip-links{transition:none!important}
    /* 錄音鈕的無限脈動、挑片的愛心彈跳：改成靜態（錄音中＝實心外圈；愛心＝短暫顯示、不放大不位移） */
    .mic.rec,.mic-big.rec{animation:none!important;box-shadow:0 0 0 3px rgba(255,107,107,.5)}
    #likeBurst.go{animation:none!important}
    #likeBurst.rm{opacity:.95}
  }