/* 以安 · 藍灰版設計系統
 *
 * 從 D:\笑笑總幹事\以安_陪伴引導原型_藍灰版.html 的 <style> 原封不動抽出來。
 * **顏色、字級、圓角一律用這裡的 CSS 變數，不要自己調** —— 原型裡的值是
 * 挑過的，改一個就會跟其他畫面對不起來。
 *
 * 用不到的區塊可以刪，但**先確認真的沒有畫面用到**：這份是三頁共用的。
 *
 * 一個跟原型不同的地方：原型的 fitStage() 把 --stage-zoom 寫死 0.675
 * （它只在示範的那台機器上對），正式版改成照視窗算，見 app/app.js。
 */

:root{
  --ink:#282b6f;   /* 主視覺藍（深海軍藍）：字與主要物件都用它 */
  --secondary:#5d6080;--muted:#8b8c9e;
  --em:#f1551a;   /* LOGO 橘：只給特定需要強調的文字 */
  --logo:#282b6f;   /* 主視覺藍 */
  --brand:#282b6f;--brand-soft:#e2e2e7;--brand-wash:#f1f1f3;
  --accent:#404394;--accent-soft:#e4e4ea;
  --line:#d4d4de;--surface:#f8f8fa;--bg:#dddee6;
  /* 參考圖的淺灰／中灰：中央淺灰微亮、往外收到中灰，保留空間感 */
  --page-bg:radial-gradient(44% 48% at 50% 44%,#f6f6f8 0%,#f6f6f800 72%),
    radial-gradient(78% 64% at 50% 46%,#eeedf0 0%,#e5e4e8 38%,#dcdbe0 70%,#cfced5 100%);
  --t-lb:1.44rem;--t-in:1.44rem;--t-sub:1.18rem;--t-tag:1rem;   /* 卡片標題／輸入／說明／標籤，全站同級同字級 */
  --hint:var(--em);   /* 說明小字：強調用，LOGO 橘 */
  --font:"Noto Serif TC","Songti TC","PMingLiU",serif;
  --shadow:0 1px 2px #282b6f1a;
}
*{box-sizing:border-box}
html{color-scheme:light;font-size:16px;height:100%}
body{margin:0;min-height:100vh;display:flex;background:var(--page-bg);background-attachment:fixed;background-color:#dcdbe0;color:var(--ink);font-family:var(--font);-webkit-font-smoothing:antialiased}
button,input,textarea,select{font-family:inherit}
button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}
button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid var(--brand);outline-offset:3px}
svg{display:block;width:1.5rem;height:1.5rem;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
[hidden]{display:none!important}
/* showToast（shared/ui.js）加到 body 的提示：body 是 flex，沒有 fixed 會擠進版面讓整頁位移（#110） */
.toast{position:fixed;bottom:1.5rem;left:50%;transform:translateX(-50%);z-index:10000;pointer-events:none;
  max-width:calc(100vw - 32px);padding:.75rem 1.5rem;border-radius:.75rem;color:#fff;font-size:1rem;font-weight:600;
  text-align:center;box-shadow:0 6px 20px #282b6f33;opacity:0;transition:opacity .3s}
.toast.show{opacity:1}
.toast-info{background:var(--ink)}
.toast-success{background:#2f6b4f}
.toast-error{background:#8d2a3c}
.toast-warning{background:var(--em)}

/* 設計畫布固定 1600×880（約等於 1270×593 視窗在 67.5% 縮放時的頁框），由 fitStage() 設定整塊的 zoom。
   畫面比例與物件相對位置在任何橫式螢幕都一樣；螢幕較寬或較高時只有 body 的背景往外延伸。 */
.app{position:relative;width:1600px;height:878px;flex-shrink:0;margin:auto;padding:0 60px;display:flex;flex-direction:column;overflow:hidden;
  background:transparent;zoom:var(--stage-zoom,.675)}
#mode{position:absolute;left:28px;bottom:24px;z-index:200;box-shadow:0 10px 28px #282b6f2e;width:68px;height:68px;padding:0;border-radius:20px;justify-content:center}
/* 語音開關只放喇叭圖示：開著有聲波，關掉變叉叉並轉淡 */
#mode svg{width:34px;height:34px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#mode[aria-pressed="true"] .voff{display:none}
#mode[aria-pressed="false"] .von{display:none}
#mode[aria-pressed="false"]{color:#a6a7b9}
main{flex:1;min-height:0;display:flex;flex-direction:column}

/* ---------- header ---------- */
.header{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:96px;flex-shrink:0}
.lead{display:flex;align-items:center;gap:14px}
.brand-mark{height:46px;width:auto}
/* 首頁招呼語：跟雲朵人並排，字比內文再大一階 */
.says .nw{white-space:nowrap}
.hello-lead{margin:0 0 0 6px;font-size:2.4rem;font-weight:700;line-height:1.2;letter-spacing:.03em;color:var(--ink);white-space:nowrap}
.hello-lead em{font-style:normal;color:var(--em)}   /* 首頁稱呼：LOGO 橘強調 */
.tools{display:flex;align-items:center;gap:14px}
.iconbtn{width:50px;height:50px;border-radius:15px;display:grid;place-items:center;border:1px solid var(--line);background:var(--surface);color:var(--secondary);transition:color .22s ease,border-color .22s ease,transform .22s ease}
.iconbtn:hover{color:var(--brand);border-color:var(--brand);transform:translateY(-2px)}
.iconbtn svg{width:24px;height:24px}
.iconbtn[aria-pressed="false"]{color:#adaebf}
.iconbtn[aria-pressed="false"] .von{display:none}
.iconbtn[aria-pressed="true"] .voff{display:none}
.back{width:50px;height:50px;border-radius:15px;display:grid;place-items:center;border:1px solid var(--line);background:var(--surface);color:var(--secondary);transition:color .22s ease,border-color .22s ease,transform .22s ease}
.back:hover{color:var(--brand);border-color:var(--brand);transform:translateY(-2px)}
.seg{display:inline-flex;align-items:center;padding:11px 20px;border-radius:14px;background:#ececf1;color:var(--secondary);font-size:1.05rem;letter-spacing:.05em;font-family:var(--font);transition:background .2s ease,color .2s ease}
.seg.on{background:var(--surface);color:var(--brand);font-weight:600;box-shadow:var(--shadow)}
.site{width:50px;height:50px;border-radius:15px;display:grid;place-items:center;font-size:1.5rem;color:#fff;background:var(--logo)}   /* 仁 */

/* ---------- 共用：全螢幕以安 + 左側文字 ---------- */
.talk{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1fr);gap:20px;padding-bottom:26px}
.talk > .figure{order:-1}
.talk-text{display:flex;flex-direction:column;justify-content:center;min-height:0;padding-left:14px;container-type:inline-size}
.talk-text.home{justify-content:flex-start;padding-top:clamp(52px,18%,170px)}
.eyebrow{font-size:1.06rem;letter-spacing:.14em;color:var(--accent);margin:0 0 16px}
.talk-text h1{font-size:max(1.4rem,5.6cqi);font-weight:600;line-height:1.5;letter-spacing:.02em;margin:0 0 26px}
.talk-text h1.says{font-size:max(1.5rem,4.6cqi);line-height:1.85;margin:0 0 30px}
.talk-text h1 em{font-style:normal;color:var(--brand)}
.talk-text h2{font-size:max(1.3rem,4.4cqi);font-weight:600;line-height:1.55;letter-spacing:.02em;margin:0 0 22px}
.talk-p{font-size:1.32rem;line-height:2.2;letter-spacing:.04em;color:var(--ink);margin:0 0 14px;max-width:34em}
.talk-p b{color:var(--brand);font-weight:600}
.voiceline{display:flex;align-items:center;gap:14px;margin:8px 0 30px;color:var(--accent)}
.voiceline svg{width:26px;height:26px}
.figure{position:relative;min-height:0}
/* 靜態基準格在最底下，上面兩個 <video> 交替（app/figure.js）。影片是去背的：
   播放時要把基準格藏起來，不然會從去背的地方透出來。片段之間直接換，不淡化（#59）。 */
.figure video.yv{opacity:0;transition:none}
.figure video.yv.on{opacity:1}
.figure:has(video.yv.on) > img{visibility:hidden}
/* 寬版片段（P1A、P2A，1:1）：寬 1438÷1080，高不變；本來就 left:50% 置中，人物位置跟 3:4 的完全重疊 */
.figure video.wide{width:133.15%}
.figure img,.figure video{position:absolute;left:50%;bottom:0;transform:translateX(-50%);height:99%;width:100%;object-fit:contain;object-position:center bottom;
  mask-image:linear-gradient(to bottom,#000 0%,#000 89%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,#000 0%,#000 89%,transparent 100%)}
.plate{position:absolute;left:4px;bottom:22px;z-index:3;display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.plate .who{margin:0;font-size:1.1rem;color:var(--secondary);letter-spacing:.09em;white-space:nowrap}
.plate .who b{font-size:1.32rem;color:var(--ink);font-weight:600;letter-spacing:.06em}
.wave{display:flex;align-items:center;gap:2px;height:22px;opacity:.5;transition:opacity .3s ease}
.wave i{display:block;width:3px;height:var(--h,40%);min-height:3px;border-radius:2px;background:currentColor;
  transform-origin:center;animation:bar 1.8s ease-in-out infinite;animation-delay:var(--d,0s)}
body.is-speaking .wave{opacity:1}
body.is-speaking .wave i{animation-duration:.85s}
@keyframes bar{0%,100%{transform:scaleY(.45)}50%{transform:scaleY(1)}}

/* ---------- 按鈕 ---------- */
.btn{display:inline-flex;align-items:center;gap:12px;border-radius:16px;padding:17px 30px;font-size:1.28rem;letter-spacing:.06em;transition:transform .2s ease,box-shadow .2s ease,background .2s ease,color .2s ease}
.btn-main{background:var(--brand);color:#fff;box-shadow:0 10px 24px #282b6f33}
.btn-main:hover{transform:translateY(-2px);box-shadow:0 14px 30px #282b6f40}
.btn-ghost{border:1px solid var(--line);background:var(--surface);color:var(--secondary)}
.btn-ghost:hover{color:var(--brand);border-color:var(--brand);transform:translateY(-2px)}
.btn:disabled{opacity:.45;cursor:default;transform:none;box-shadow:none}
.btnrow{display:flex;align-items:center;gap:16px;flex-wrap:wrap}

/* ---------- 首頁 ---------- */
.home-head{display:flex;align-items:center;gap:22px;margin:0 0 30px}
.home-head .voicecol{flex-shrink:0;color:var(--accent);align-self:center}
.home-head .voicecol .wave{height:50px;gap:2px}
.home-head .voicecol .wave i{width:3px}
.home-head .lines{min-width:0}
.home-head h1.says{margin:0 0 14px;font-size:max(1.32rem,3.95cqi);white-space:nowrap}
.notice{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.notice .tx{font-size:max(1.32rem,3.95cqi);font-weight:600;line-height:1.85;letter-spacing:.02em;white-space:nowrap}
.go{flex-shrink:0;color:var(--brand);border:1px solid #ceced8;background:#fff;border-radius:999px;padding:15px 28px;font-size:1.34rem;letter-spacing:.06em;animation:breathe 2.2s ease-in-out infinite}
.go:hover{animation:none;background:var(--brand);color:#fff;border-color:var(--brand)}
@keyframes breathe{0%,100%{opacity:1;background:#fff;box-shadow:0 0 0 0 #282b6f00;transform:scale(1)}
  50%{opacity:.45;background:#dcdce2;box-shadow:0 0 0 10px #282b6f1f;transform:scale(1.05)}}
.tasks{display:grid;grid-template-columns:1fr 1fr;gap:18px;flex:1 1 auto;min-height:0;max-height:min(460px,80%);margin-top:auto}
.task{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:18px;border-radius:20px;border:1px solid var(--line);background:var(--surface);box-shadow:var(--shadow);text-align:center;transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease}
.task:hover{transform:translateY(-3px);border-color:var(--brand);box-shadow:0 14px 30px #282b6f20}
.task .ic{width:60px;height:60px;border-radius:18px;display:grid;place-items:center;flex-shrink:0;background:var(--accent-soft);color:var(--accent)}
.task .ic svg{width:31px;height:31px}
.task.blue .ic{background:var(--brand-soft);color:var(--brand)}
.task b{font-size:1.38rem;font-weight:600;letter-spacing:.06em}
/* 還沒開放的：**按不下去**，而且卡片上直接寫「（製作中）」。
   按了才跳提示等於逼使用者一張一張試，而且提示會跑到角落的 toast 去。
   註：disabled 只擋 click，pointerdown 仍然往上冒 —— 環形的拖曳掛在
   .tasks 上，所以抓著這幾張一樣轉得動。 */
.task.soon .ic{background:#ededf1;color:var(--muted)}
.task.soon b{color:var(--muted);font-size:1.16rem}
.task.soon{cursor:not-allowed}
/* :hover 在 disabled 上照樣生效，不關掉的話會浮起來、看起來像能按 */
.task.soon:hover{transform:none;border-color:var(--line);box-shadow:var(--shadow)}

/* ---------- 首頁：招呼語左上、人像滿版置中、卡片弧形環繞（滑鼠拖曳旋轉） ---------- */
.talk.home{position:relative;display:block}
.talk.home .talk-text.home{position:absolute;left:7%;top:10.8%;z-index:60;width:560px;padding:0;margin:0;align-items:flex-start;text-align:left}
.talk.home .home-head{flex-direction:column;align-items:flex-start;gap:14px}
/* 招呼語固定佔這麼高：不管副標一行還兩行，下面的卡片都落在同一個位置 */
.talk.home.first .home-head{min-height:174px}
.talk.home .home-head .voicecol{color:var(--accent);align-self:flex-start}
.talk.home .home-head .voicecol .wave{height:34px}
.talk.home .home-head h1.says{white-space:normal;font-size:max(2.1rem,5.6cqi)}
/* 提醒句固定框：寬度 = 「10/30開會，會議資料還沒做完，接著做？」在這個字級剛好一行（量過 19.07em），
   右緣貼齊文字欄右緣（原本 GO 的右緣）。用 em 定寬，畫布縮放時框跟字一起縮；更長的句子在框裡換行 */
.talk.home .notice{display:block;font-size:max(1.56rem,4.3cqi);width:19.1em}
.talk.home .notice .who-row{display:flex;align-items:center;gap:12px;margin:0 0 8px;color:var(--em)}   /* 首頁「以安：」LOGO 橘 */
.talk.home .notice .who-row .wave{height:30px;gap:3px;flex-shrink:0}
.talk.home .notice .who{font-size:max(1.56rem,4.3cqi);font-weight:700;letter-spacing:.08em;color:var(--em)}
.talk.home .notice .tx{white-space:normal;font-size:max(1.56rem,4.3cqi);font-weight:700;line-height:1.5;display:inline}
/* 句子靠左，GO 永遠在下一行、靠框右 */
.talk.home .notice .ln{display:flex;flex-direction:column;align-items:flex-start}
.talk.home .notice .ln .go{align-self:flex-end}
.talk.home .notice .go{display:flex;width:-moz-fit-content;width:fit-content;margin:16px 0 0;padding:10px 26px;font-size:1.02rem;letter-spacing:.08em;font-weight:600;
  background:var(--ink);color:#fff;border-color:var(--ink);animation:goGlow 2.8s ease-in-out infinite}
.talk.home .notice .go:hover{background:#282b6f;border-color:#282b6f;color:#fff;animation:none;box-shadow:0 8px 24px #282b6f59}
@keyframes goGlow{0%,100%{box-shadow:0 4px 14px #282b6f33,0 0 0 0 #282b6f00}
  50%{box-shadow:0 4px 14px #282b6f33,0 0 26px 7px #282b6f40}}
.home-orbit{position:absolute;inset:0;background:var(--page-bg);background-attachment:fixed;isolation:isolate}
.home-orbit .figure{position:absolute;left:0;right:0;top:0;height:100%;aspect-ratio:1080/1438;margin:0 auto;z-index:20;pointer-events:none}
.home-orbit .tasks{position:absolute;inset:0;display:block;margin:0;max-height:none;min-height:0;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none}
.home-orbit .tasks.dragging{cursor:grabbing}
.home-orbit .task{position:absolute;left:50%;top:50%;width:280px;height:158px;margin:-79px 0 0 -140px;padding:16px 22px;gap:11px;will-change:transform,opacity;
  /* 毛玻璃：半透明白底 + 背後模糊，卡片經過以安身上時會透出她的顏色 */
  /* 上亮下暗的漸層、貼地的近影加上遠影，做出一點厚度 */
  background:linear-gradient(168deg,#f7faffe8 0%,#eef3fcbd 46%,#dde6f3c2 100%);   /* 微微透著淡藍 */
  -webkit-backdrop-filter:blur(18px) saturate(150%) brightness(1.08);backdrop-filter:blur(18px) saturate(150%) brightness(1.08);
  border:1px solid #ffffffc7;border-bottom-color:#282b6f1f;
  box-shadow:0 1px 2px #282b6f1f,0 4px 6px #282b6f1c,0 12px 20px #282b6f26,0 28px 54px #282b6f33,inset 0 1px 0 #fff,inset 0 -2px 3px #282b6f17}
.home-orbit .task{transition:border-color .2s ease,box-shadow .2s ease}
.home-orbit .task:hover{transform:none;border-color:#ffffffe0;box-shadow:0 3px 5px #282b6f1a,0 12px 22px #282b6f24,0 30px 56px #282b6f33,inset 0 1px 0 #fff,inset 0 -1px 0 #282b6f12}
.home-orbit .task .ic{width:62px;height:62px;border-radius:19px;box-shadow:0 3px 7px #282b6f26,inset 0 1px 0 #ffffffcc,inset 0 -1px 2px #282b6f1a}
.home-orbit .task .ic svg{width:32px;height:32px}
.home-orbit .task b{font-size:1.42rem;letter-spacing:.04em;color:var(--logo)}
/* 環形卡片的圖示與字一律用 --logo（深褐灰），圖示底是很淡的暖灰 */
.home-orbit .task .ic,.home-orbit .task.blue .ic{background:#e8e8ec;color:var(--logo)}
.home-orbit .task{width:240px;height:137px;margin:-68px 0 0 -120px;padding:14px 20px}

/* ---------- 首頁過場：卡片像素化散掉 → 以安兩側長出兩顆按鈕 ---------- */
/* 每張卡片的時間差，進場與消失共用 */
.home-orbit .task:nth-child(1){--base:0s}
.home-orbit .task:nth-child(2){--base:.08s}
.home-orbit .task:nth-child(3){--base:.16s}
.home-orbit .task:nth-child(4){--base:.24s}
.home-orbit .task:nth-child(5){--base:.32s}
.home-orbit .task:nth-child(6){--base:.4s}
.home-orbit .task:nth-child(7){--base:.48s}
/* 卡片登場：由小放大、從模糊轉清楚 */
.home-orbit .task{animation:floaty 4.6s ease-in-out var(--fd,0s) infinite}
.talk.home.intro .home-orbit .task{animation:cardIn 1.05s cubic-bezier(.2,.7,.3,1) var(--base,0s) backwards,floaty 4.6s ease-in-out calc(1.1s + var(--fd,0s)) infinite}
.home-orbit .task:nth-child(2){--fd:.7s}
.home-orbit .task:nth-child(3){--fd:1.4s}
.home-orbit .task:nth-child(4){--fd:2.1s}
.home-orbit .task:nth-child(5){--fd:2.8s}
.home-orbit .task:nth-child(6){--fd:3.5s}
.home-orbit .task:nth-child(7){--fd:4.2s}
@keyframes cardIn{from{scale:.6;opacity:0;filter:blur(10px)}}
/* 沒人碰的時候也會輕輕飄，讓人知道是活的 */
@keyframes floaty{0%,100%{translate:0 0}50%{translate:0 var(--fl,-15px)}}
/* 按下會議之後：卡片一張張往以安身上收、化掉；招呼語與 GO 一起淡出 */
.talk.home.leaving .home-orbit .tasks{pointer-events:none}
.talk.home.leaving .home-orbit .task{animation:cardVanish .95s cubic-bezier(.45,0,.75,.2) forwards;animation-delay:var(--base,0s)}
.talk.home.leaving .talk-text.home{animation:greetOut .7s ease forwards}
@keyframes cardVanish{to{scale:.48;opacity:0;filter:blur(13px)}}
@keyframes greetOut{to{opacity:0;transform:translateY(-16px)}}
/* 轉動時的魔法碎片：只在環真的在動的時候亮 */
.sparks{position:absolute;inset:-16px;z-index:4;pointer-events:none;opacity:0;transition:opacity .8s ease}
.home-orbit .tasks.spinning .sparks{opacity:1;transition:opacity .2s ease}
.sparks i{position:absolute;left:var(--sx);top:var(--sy);width:var(--ss);height:var(--ss);border-radius:50%;
  background:#f5fbff;box-shadow:0 0 6px 2px #cfe8ff,0 0 16px 6px #6fb3f5b3,0 0 30px 10px #8cc4ff4d;opacity:0}
.home-orbit .tasks.sparkling .sparks i{animation:spark var(--sr,1.2s) ease-in-out var(--sd,0s) infinite}
@keyframes spark{0%{opacity:0;transform:translate(0,0) scale(.25)}
  35%{opacity:1;transform:translate(calc(var(--dx) * .5),calc(var(--dy) * .5)) scale(1)}
  100%{opacity:0;transform:translate(var(--dx),var(--dy)) scale(.2)}}
/* 虛擬像素層：消失時一格一格散開，生成時一格一格聚回來 */
.px{position:absolute;inset:0;display:grid;gap:2px;padding:5px;border-radius:inherit;overflow:hidden;pointer-events:none}
.px i{border-radius:3px;background:#fff;box-shadow:0 0 9px #282b6f4d;opacity:0}
.intro .px i{animation:pxIn .95s ease-out backwards;animation-delay:calc(var(--base,0s) + var(--d,0s))}
/* 同一頁換介面：舊的介面像素化散掉，以安同時換位置 */
.talk.home.ui-out .home-ask,.talk.home.ui-out .home-prep,.talk.home.ui-out .home-list{animation:uiOut .9s cubic-bezier(.45,0,.75,.3) forwards;pointer-events:none}
.talk.home.ui-out .talk-text.home{animation:greetOut .7s ease forwards}
.ui-out .px i{animation:pxOut .8s ease-in forwards;animation-delay:var(--d,0s)}
.talk.home.intro .talk-text.home{animation:uiIn .9s cubic-bezier(.2,.7,.3,1) backwards;animation-delay:.12s}
@keyframes uiOut{to{opacity:0;transform:translateY(-12px) scale(.97);filter:blur(10px)}}
@keyframes uiIn{from{opacity:0;transform:translateY(16px)}}
.talk.home.leaving .home-orbit .task .px i{animation:pxOut .7s ease-in forwards;animation-delay:calc(var(--base,0s) + var(--d,0s))}
@keyframes pxIn{0%{opacity:0;transform:translate(var(--tx),var(--ty)) scale(.45)}
  45%{opacity:1;transform:none}
  100%{opacity:0;transform:none}}
@keyframes pxOut{0%{opacity:0}
  20%{opacity:.92;transform:none}
  100%{opacity:0;transform:translate(var(--tx),var(--ty)) scale(.28)}}
/* 以安左右兩側的兩顆按鈕 */
.home-sides{position:absolute;inset:0;z-index:30;pointer-events:none}
.home-sides .side{position:absolute;top:40%;margin-top:-105px;width:330px;height:210px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:22px 24px;border-radius:26px;text-align:center;cursor:pointer;pointer-events:auto;color:var(--ink);font-family:var(--font);
  background:#ffffffa8;-webkit-backdrop-filter:blur(18px) saturate(150%) brightness(1.08);backdrop-filter:blur(18px) saturate(150%) brightness(1.08);
  border:1px solid #ffffff99;box-shadow:0 16px 40px #282b6f26,inset 0 1px 0 #ffffffb3;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.home-sides .side{--fl:-18px;animation:floaty 4.4s ease-in-out var(--fd,0s) infinite}
.home-sides .side.r{--fd:1.8s}
.talk.home.intro .home-sides .side{animation:sideIn 1.05s cubic-bezier(.2,.7,.3,1) var(--base) backwards,floaty 4.4s ease-in-out calc(1.1s + var(--fd,0s)) infinite}
.home-sides .side:hover{transform:translateY(-4px);border-color:#ffffffd9;box-shadow:0 22px 48px #282b6f30,inset 0 1px 0 #ffffffcc}
.home-sides .side .ic{width:70px;height:70px;border-radius:22px;display:grid;place-items:center;background:var(--brand-soft);color:var(--brand)}
.home-sides .side .ic svg{width:36px;height:36px}
.home-sides .side.r .ic{background:var(--accent-soft);color:var(--accent)}
.home-sides .side b{font-size:1.5rem;font-weight:600;letter-spacing:.05em}
.home-sides .side.l{right:calc(50% + 372px);--base:.18s}
.home-sides .side.r{left:calc(50% + 372px);--base:.4s}
@keyframes sideIn{0%{opacity:0;transform:translateY(20px) scale(.93)}
  35%{opacity:.45}
  100%{opacity:1;transform:none}}
/* ---------- 按下「會議資料」：會議紀錄化掉、會議資料收成標題、以安讓到右邊 ---------- */
.home-prep.two{width:min(318px,23%);top:15%;height:70%;max-height:70%}
/* 系統自動帶入：外觀與手動上傳一致，但不可點，並標明來源 */
.home-prep .pslot.auto{cursor:default;background:#e2e2e7d9;border-color:#282b6f40;box-shadow:0 14px 34px #282b6f26,inset 0 1px 0 #ffffffb3}
.home-prep .pslot.auto .ic{background:#e2e2e7d9;color:var(--brand)}
.home-prep .pslot .ok{margin-left:auto;display:flex;align-items:center;gap:6px;flex-shrink:0;white-space:nowrap;color:var(--brand);font-size:var(--t-tag)}
.home-prep .pslot .ok svg{width:17px;height:17px}
/* 工作日誌：一次數十份，清單自己捲 */
.home-prep .logblk{position:relative;display:flex;flex-direction:column;padding:18px 20px;border-radius:20px;color:var(--ink);font-family:var(--font);
  background:#ffffffa8;-webkit-backdrop-filter:blur(18px) saturate(150%) brightness(1.08);backdrop-filter:blur(18px) saturate(150%) brightness(1.08);
  border:1px solid #ffffff99;box-shadow:0 14px 34px #282b6f26,inset 0 1px 0 #ffffffb3}
.home-prep .logblk .hd{display:flex;align-items:center;gap:9px;font-size:var(--t-lb);font-weight:600;letter-spacing:.04em;margin:0 0 11px}
.home-prep .logblk .hd .tag{font-size:var(--t-tag);font-weight:400;letter-spacing:0;color:var(--brand);background:#e2e2e7b8;border-radius:999px;padding:3px 10px;white-space:nowrap}
.home-prep .loglist{display:flex;flex-direction:column;gap:6px;max-height:none;overflow:auto;overscroll-behavior:contain;padding-right:4px}
.home-prep .logrow{display:flex;align-items:center;gap:9px;padding:7px 10px;border-radius:11px;border:1px solid #282b6f20;background:#ffffff5c}
.home-prep .logrow .ic{width:26px;height:26px;border-radius:8px;flex-shrink:0;display:grid;place-items:center;background:#e4e4eab3;color:var(--accent)}
.home-prep .logrow .ic svg{width:14px;height:14px}
.home-prep .logrow b{font-size:var(--t-lb);font-weight:400;letter-spacing:.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.home-prep .logrow .day{margin-left:auto;flex-shrink:0;font-size:var(--t-sub);color:var(--muted)}
.home-prep .logblk .more{align-self:flex-start;margin-top:11px;padding:8px 16px;border-radius:999px;font-size:var(--t-sub);font-family:var(--font);
  background:var(--accent-soft);border:1px solid #40439445;color:var(--accent)}
.home-prep .logblk .more:hover{background:var(--accent);border-color:var(--accent);color:#fff}
.home-prep.two.l{left:6%;right:auto}
.home-prep.two.r{right:6%;left:auto}
.home-prep.two.l{justify-content:space-between}
.home-prep.two.r .logblk{flex:1;min-height:0}
.home-prep.two.r .logblk .loglist{flex:1;min-height:0}
.home-prep.two .pslot{padding:16px 18px}
.home-prep.two .pslot .ic{width:46px;height:46px;border-radius:14px}
.home-prep.two .pslot .ic svg{width:24px;height:24px}
.home-prep.two .pslot .tx b{font-size:var(--t-lb);letter-spacing:.05em;white-space:nowrap}
.home-prep.two .pslot{gap:13px}
.home-prep.two .pslot .tx{min-width:0}
.home-prep.two .pslot .tx span{font-size:var(--t-sub);display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* 兩顆按鈕一起化掉，以安留在原地 */
.talk.home.to-two .home-sides{pointer-events:none}
.talk.home.to-two .home-sides .side{animation:sideOut .85s ease forwards}
.talk.home.to-two .home-sides .side .px i{animation:pxOut .75s ease-in forwards;animation-delay:var(--d,0s)}
.talk.home.to-prep .home-sides{pointer-events:none}
.talk.home.to-prep .home-sides .side.l{animation:sideOut .85s ease forwards}
.talk.home.to-prep .home-sides .side.l .px i{animation:pxOut .75s ease-in forwards;animation-delay:var(--d,0s)}
.talk.home.to-prep .home-sides .side.r{animation:sideToTitle 1.1s cubic-bezier(.45,0,.2,1) forwards}
.talk.home.to-prep .home-sides .side.r .ic{animation:icOut .55s ease forwards}
@keyframes sideOut{to{opacity:0;transform:scale(.93)}}
@keyframes icOut{to{opacity:0;transform:scale(.55)}}
@keyframes sideToTitle{to{transform:translate(var(--tx-title,0px),var(--ty-title,0px)) scale(.94);
  background:#ffffff00;border-color:#ffffff00;box-shadow:none;
  -webkit-backdrop-filter:blur(0) saturate(100%) brightness(1);backdrop-filter:blur(0) saturate(100%) brightness(1)}}
/* ---------- 會議資料頁：以安讓到右邊，左邊三個上傳卡 ---------- */
.home-orbit .figure.moving{transition:transform 1.15s cubic-bezier(.45,0,.2,1)}
/* 會議資料換頁有側走影片（T1／T2）時，人像框跟著影片走 4 秒 */
.home-orbit .figure.moving.slow{transition:transform 4s cubic-bezier(.45,0,.2,1)}
/* 以安一律讓到左邊；第一次見面那一段再往右挪一點 */
.home-orbit .figure.aside{transform:translateX(calc(var(--shift-lg,0px) * -1)) scale(var(--fig-sc,1))}
.home-prep{position:absolute;right:0;top:37.8%;width:844px;max-height:60%;z-index:30;display:flex;flex-direction:column;gap:10px}
.home-prep .pslot{position:relative;display:flex;align-items:center;gap:18px;padding:20px 24px;border-radius:20px;text-align:left;cursor:pointer;color:var(--ink);font-family:var(--font);
  background:#ffffffa8;-webkit-backdrop-filter:blur(18px) saturate(150%) brightness(1.08);backdrop-filter:blur(18px) saturate(150%) brightness(1.08);
  border:1px solid #ffffff99;box-shadow:0 14px 34px #282b6f26,inset 0 1px 0 #ffffffb3;
  transition:border-color .2s ease,background .2s ease}
.talk.home.intro .home-prep .pslot{animation:sideIn 1.05s cubic-bezier(.2,.7,.3,1) backwards;animation-delay:var(--base)}
.home-prep .pslot:nth-child(1){--base:.15s}
.home-prep .pslot:nth-child(2){--base:.33s}
.home-prep .pslot:nth-child(3){--base:.51s}
.home-prep .pslot:hover{border-color:#ffffffe0}
.home-prep .pslot.filled{background:#e2e2e773;border-color:#ffffffcc}
.home-prep .pslot .ic{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;background:#e2e2e7b8;color:var(--brand);flex-shrink:0}
.home-prep .pslot .ic svg{width:28px;height:28px}
.home-prep .pslot .tx{display:flex;flex-direction:column;gap:5px;min-width:0}
.home-prep .pslot .tx b{font-size:1.22rem;letter-spacing:.04em}
.home-prep .pslot .tx span{font-size:1rem;color:var(--secondary)}
.home-prep .pslot .ok{margin-left:auto;display:flex;align-items:center;gap:7px;color:var(--brand);font-size:.98rem;flex-shrink:0}
.home-prep .pslot .ok svg{width:20px;height:20px}
.home-prep #go{align-self:flex-end;margin-top:4px}
/* 會議資料那一頁的按鈕在窄欄裡，靠左比較好按到 */
.home-prep.two.l #go{align-self:flex-start}
.talk.home.intro .home-prep #go{animation:sideIn 1.05s cubic-bezier(.2,.7,.3,1) backwards;animation-delay:.68s}
/* ---------- 會議資料第一頁：左上填開會資訊，下面兩張上傳卡跟「會議資料／會議紀錄」兩顆同形同位 ---------- */
.prep1{position:absolute;inset:0;z-index:30;pointer-events:none}
.prep1 > *{pointer-events:auto}
.prep1 .pcard{position:absolute;color:var(--ink);font-family:var(--font);
  background:#ffffffa8;-webkit-backdrop-filter:blur(18px) saturate(150%) brightness(1.08);backdrop-filter:blur(18px) saturate(150%) brightness(1.08);
  border:1px solid #ffffff99;box-shadow:0 16px 40px #282b6f26,inset 0 1px 0 #ffffffb3}
.prep1 .pcard{top:40%;margin-top:-125px;width:384px;height:250px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;
  padding:22px 26px;border-radius:30px;text-align:center;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease,background .2s ease}
.prep1 .pcard.l{right:calc(50% + 376px)}
.prep1 .pcard.r{left:calc(50% + 376px)}
.prep1 .pcard:hover:not(:disabled){transform:translateY(-4px);border-color:#ffffffd9;box-shadow:0 22px 48px #282b6f30,inset 0 1px 0 #ffffffcc}
.prep1 .pcard .ic{width:88px;height:88px;border-radius:26px;display:grid;place-items:center;background:var(--brand-soft);color:var(--brand)}
.prep1 .pcard .ic svg{width:44px;height:44px}
.prep1 .pcard b{font-size:1.8rem;font-weight:600;letter-spacing:.05em}
.prep1 .pcard .sub{max-width:100%;font-size:1.3rem;color:var(--hint);letter-spacing:.03em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.prep1 .pcard.filled{background:#e2e2e78c;border-color:#ffffffcc}
.prep1 .pcard.filled .sub{color:var(--brand)}
.prep1 .pcard.auto{background:#e2e2e7d9;border-color:#282b6f40}
/* 系統帶入的也能換成自己的（#48）；上傳中有轉圈，傳完才打勾 */
.prep1 .pcard .swap{font-size:1.1rem;color:var(--brand);text-decoration:underline;text-underline-offset:4px}
.prep1 .pcard.uploading{cursor:progress;pointer-events:none}
.prep1 .pcard .spin{position:absolute;top:18px;right:20px}
.spin{display:inline-block;width:26px;height:26px;border-radius:50%;border:3px solid var(--brand-soft);border-top-color:var(--brand);animation:upSpin .8s linear infinite}
@keyframes upSpin{to{transform:rotate(360deg)}}
.home-prep .upmsg{display:flex;align-items:center;gap:10px;margin:10px 0 0;font-size:var(--t-sub);color:var(--brand)}
.home-prep .upmsg .spin{width:20px;height:20px;border-width:2px}
.prep1 .pcard .ok{position:absolute;top:18px;right:20px;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--brand);color:#fff}
.prep1 .pcard .ok svg{width:16px;height:16px}
.prep1 .pcard.guide{border-color:#404394a6;animation:guideRing 1.7s ease-in-out infinite}
.prep1 .pcard .guide-dot{position:absolute;left:-13px;top:50%;margin-top:-13px;width:26px;height:26px;border-radius:50%;
  display:grid;place-items:center;background:var(--accent);color:#fff;box-shadow:0 4px 10px #40439459;animation:guideDot 1.7s ease-in-out infinite}
.prep1 .pcard .guide-dot svg{width:15px;height:15px}
.prep1 #go{position:absolute;top:calc(40% + 125px + 34px);right:calc(50% - 760px)}
.talk.home.intro .prep1 .pcard.l{animation:sideIn 1.05s cubic-bezier(.2,.7,.3,1) backwards;animation-delay:.3s}
.talk.home.intro .prep1 .pcard.r{animation:sideIn 1.05s cubic-bezier(.2,.7,.3,1) backwards;animation-delay:.45s}
.talk.home.intro .prep1 #go{animation:sideIn 1.05s cubic-bezier(.2,.7,.3,1) backwards;animation-delay:.62s}
.talk.home.ui-out .prep1 > *{animation:uiOut .9s cubic-bezier(.45,0,.75,.3) forwards;pointer-events:none}
.talk.home.intro .prep1 .pcard.guide{animation:sideIn 1.05s cubic-bezier(.2,.7,.3,1) .3s backwards,guideRing 1.7s ease-in-out 1.35s infinite}
/* ---------- 會議資料第二頁：工作日誌在右欄，位置大小同會議紀錄那一頁 ---------- */
.home-prep.logs{top:12%;max-height:84%;gap:14px}
.home-prep.logs .logblk{flex:0 1 auto;min-height:0}
.home-prep.logs .loglist{flex:1 1 auto;min-height:0}
.home-prep.logs .logblk .hd{margin:0 0 12px}
.home-prep.logs .fs{flex:none;width:100%;padding:14px 16px;gap:13px}
.home-prep.logs .fs .tx b{font-size:var(--t-lb)}
.home-prep.logs .fs .tx span{font-size:var(--t-sub)}
.home-prep.logs .fs{position:relative}
.home-prep.logs .fs.guide{border-color:#404394a6;animation:guideRing 1.7s ease-in-out infinite}
.home-prep.logs .fs .guide-dot{position:absolute;left:-13px;top:50%;margin-top:-13px;width:26px;height:26px;border-radius:50%;
  display:grid;place-items:center;background:var(--accent);color:#fff;box-shadow:0 4px 10px #40439459;animation:guideDot 1.7s ease-in-out infinite}
.home-prep.logs .fs .guide-dot svg{width:15px;height:15px}
.home-prep.logs .acts{display:flex;justify-content:flex-end;gap:12px;flex-shrink:0;margin-top:4px}
.talk.home.intro .home-prep.logs .logblk{animation:sideIn 1.05s cubic-bezier(.2,.7,.3,1) backwards;animation-delay:.15s}
.talk.home.intro .home-prep.logs .acts{animation:sideIn 1.05s cubic-bezier(.2,.7,.3,1) backwards;animation-delay:.4s}
/* ---------- 會議紀錄：帶入會議資料 + 錄音檔排序 ---------- */
.home-min{position:absolute;right:0;top:12%;width:844px;max-height:84%;z-index:30;display:flex;flex-direction:column;gap:14px}
.home-min .blk{min-height:0}
/* 會議資料那一塊與開始整理不縮；空間不夠時只由錄音清單自己捲 */
.home-min .blk:nth-child(1),.home-min #go{flex-shrink:0}
.home-min .blk:nth-child(2){display:flex;flex-direction:column;overflow:hidden;flex:0 1 auto}
.home-min .blk{position:relative;padding:18px 20px;border-radius:20px;color:var(--ink);font-family:var(--font);
  background:#ffffffa8;-webkit-backdrop-filter:blur(18px) saturate(150%) brightness(1.08);backdrop-filter:blur(18px) saturate(150%) brightness(1.08);
  border:1px solid #ffffff99;box-shadow:0 14px 34px #282b6f26,inset 0 1px 0 #ffffffb3}
.talk.home.intro .home-min .blk{animation:sideIn 1.05s cubic-bezier(.2,.7,.3,1) backwards;animation-delay:var(--base)}
.home-min .blk:nth-child(1){--base:.15s}
.home-min .blk:nth-child(2){--base:.33s}
.home-min .hd{display:flex;align-items:center;gap:10px;font-size:var(--t-lb);font-weight:600;letter-spacing:.04em;margin:0 0 12px}
.home-min .hd .tag{font-size:var(--t-tag);font-weight:400;letter-spacing:0;color:var(--brand);background:#e2e2e7b8;border-radius:999px;padding:3px 11px}
.home-min .sysrow{display:flex;align-items:center;gap:13px;padding:12px 14px;border-radius:14px;border:1px solid #282b6f33;background:#e2e2e773}
.home-min .sysrow .ic{width:38px;height:38px;border-radius:12px;flex-shrink:0;display:grid;place-items:center;background:#e2e2e7d9;color:var(--brand)}
.home-min .sysrow .ic svg{width:20px;height:20px}
.home-min .sysrow .tx{display:flex;flex-direction:column;gap:2px;min-width:0}
.home-min .sysrow .tx b{font-size:var(--t-lb)}
.home-min .sysrow .tx span{font-size:var(--t-sub);color:var(--hint)}
.home-min .fs .tx b{font-size:var(--t-lb)}
.home-min .fs .tx span{font-size:var(--t-sub)}
.home-min .sysrow .mini{margin-left:auto;flex-shrink:0;padding:9px 16px;border-radius:999px;font-size:var(--t-sub);border:1px solid #282b6f33;background:#ffffff5c;color:var(--secondary)}
.home-min .sysrow .mini:hover{border-color:var(--brand);color:var(--brand)}
.home-min .note{font-size:var(--t-sub);color:var(--hint);margin:10px 0 0}
.home-min .auds{display:flex;flex-direction:column;gap:8px;margin:0 0 12px;flex:1 1 auto;min-height:0;overflow:auto;overscroll-behavior:contain}
.home-min .aud{display:flex;align-items:center;gap:11px;padding:10px 12px;border-radius:13px;border:1px solid #282b6f24;background:#ffffff5c}
.home-min .aud .no{width:26px;height:26px;border-radius:50%;flex-shrink:0;display:grid;place-items:center;background:#e4e4eab3;color:var(--accent);font-size:.9rem}
.home-min .aud b{font-size:var(--t-lb);font-weight:400}
.home-min .aud .len{font-size:var(--t-sub);color:var(--muted)}
.home-min .aud .ord{margin-left:auto;display:flex;gap:4px;flex-shrink:0}
.home-min .aud .ord button{width:30px;height:30px;border-radius:9px;border:1px solid #282b6f24;background:#ffffff73;color:var(--secondary);display:grid;place-items:center}
.home-min .aud .ord button:hover:not(:disabled){border-color:var(--brand);color:var(--brand)}
.home-min .aud .ord button:disabled{opacity:.3;cursor:default}
.home-min .aud .ord svg{width:16px;height:16px}
/* 刪除和排序分開一點，免得點錯 */
.home-min .aud .ord .del{margin-left:8px;color:var(--accent);border-color:#40439433}
.home-min .aud .ord .del:hover{background:var(--accent);border-color:var(--accent);color:#fff}
.home-min .empty{font-size:var(--t-sub);color:var(--hint);padding:14px 0 12px}
.home-min .add{padding:11px 20px;border-radius:999px;font-size:var(--t-sub);border:1px solid #282b6f33;background:#ffffff5c;color:var(--secondary)}
.home-min .add:hover{border-color:var(--brand);color:var(--brand)}
.home-min #go{align-self:flex-end;margin-top:4px}
.talk.home.intro .home-min #go{animation:sideIn 1.05s cubic-bezier(.2,.7,.3,1) backwards;animation-delay:.5s}
.talk.home.ui-out .home-min{animation:uiOut .9s cubic-bezier(.45,0,.75,.3) forwards;pointer-events:none}
/* 按下會議紀錄（左邊那顆）：右邊那顆化掉、左邊那顆收成標題 */
.talk.home.to-min .home-sides{pointer-events:none}
.talk.home.to-min .home-sides .side.r{animation:sideOut .85s ease forwards}
.talk.home.to-min .home-sides .side.r .px i{animation:pxOut .75s ease-in forwards;animation-delay:var(--d,0s)}
.talk.home.to-min .home-sides .side.l{animation:sideToTitle 1.1s cubic-bezier(.45,0,.2,1) forwards}
.talk.home.to-min .home-sides .side.l .ic{animation:icOut .55s ease forwards}
/* ---------- 全新帳號：打招呼取稱呼 → 上傳資料 → 委員名單 ---------- */
.talk.home.first .talk-text.home{width:540px;top:10.8%}
.talk.home.first .home-head h1.says{line-height:1.5}
/* 這一句比較長，字級收一點讓它維持一行，下面的卡片才留得住位置 */
.talk.home.step-upload .home-head h1.says{font-size:max(1.7rem,4.4cqi)}
.talk.home.first.step-upload .talk-text.home,.talk.home.first.step-members .talk-text.home{width:min(760px,50%)}
/* 「…以後都照著做。」20 字放不進 19.1em，「做。」會掉到下一行（#146）：放寬到整欄（跟三期格子同寬） */
.talk.home.first.step-upload .notice{width:auto}
/* 第一次見面這一段左右對調：以安在左，招呼語與輸入框在右，整塊上下置中 */
.talk.home.step-hello .talk-text.home{left:auto;right:7%;width:min(760px,50%)}
.talk.home.step-upload .talk-text.home,.talk.home.step-members .talk-text.home{left:auto;right:7%}
.talk.home.stage-minutes .talk-text.home{left:auto;right:7%;width:min(760px,50%)}
.talk.home.stage-ring .talk-text.home{left:auto;right:64px;align-items:flex-end}
/* 文字欄是 container（字級用 cqi），不能用 max-content 收寬；改成整塊靠右排，提醒框右緣就落在「仁」的右緣。
   仁 右邊只剩設定鈕 50px 與間距 14px，所以是內容區右緣往內 64px */
/* 會議資料這一段以安留在中間，標題放左邊那一欄的上方 */
.talk.home.stage-prep .talk-text.home{left:6%;right:auto;width:min(400px,29%)}
.home-ask .fld{display:flex;flex-direction:column;gap:8px;width:100%}
.home-ask .fld input{width:100%}
.home-ask #go{align-self:flex-end;margin-top:4px}
.talk.home.intro .home-ask .box{animation:sideIn 1.05s cubic-bezier(.2,.7,.3,1) backwards;animation-delay:.15s}
.talk.home.intro .home-ask #go{animation:sideIn 1.05s cubic-bezier(.2,.7,.3,1) backwards;animation-delay:.4s}
.talk.home.ui-out .home-ask{animation:uiOut .9s cubic-bezier(.45,0,.75,.3) forwards;pointer-events:none}
/* 檔案格：成對上傳時共用 */
.fs{flex:1;min-width:0;display:flex;align-items:center;gap:11px;padding:11px 13px;border-radius:14px;border:1px solid #282b6f24;background:#ffffff5c;cursor:pointer;color:var(--ink);font-family:var(--font);text-align:left;transition:border-color .2s ease,background .2s ease}
.fs:hover{border-color:#282b6f66;background:#ffffff8c}
.fs .ic{width:38px;height:38px;border-radius:12px;flex-shrink:0;display:grid;place-items:center;background:#e4e4eab3;color:var(--accent)}
.fs .ic svg{width:20px;height:20px}
.fs .tx{display:flex;flex-direction:column;gap:2px;min-width:0}
.fs .tx b{font-size:var(--t-lb);letter-spacing:.03em}
.fs .tx span{font-size:var(--t-sub);color:var(--hint)}
.fs.filled{background:#e2e2e78f;border-color:#282b6f33}
.fs.filled .ic{background:#e2e2e7d9;color:var(--brand)}
.fs.filled .tx span{color:var(--brand)}   /* 填上之後那一行是檔名，不是說明 */
.home-prep .pair-slot{gap:14px;padding:11px 18px;cursor:default}
.home-prep .pair-slot .pl{flex-shrink:0;width:104px;font-size:var(--t-lb);font-weight:600;letter-spacing:.02em;color:var(--secondary)}
.home-prep .pair-slot .fs{padding:14px 14px;gap:12px}
.home-prep .pair-slot .fs .ic{width:42px;height:42px;border-radius:13px}
.home-prep .pair-slot .fs .ic svg{width:22px;height:22px}
.home-prep .pair-slot .fs .tx b{font-size:var(--t-lb);letter-spacing:.05em}
.home-prep .pair-slot .fs .tx span{font-size:var(--t-sub);white-space:nowrap;overflow:hidden}
.home-prep .ps-row{display:flex;gap:10px;flex:1;min-width:0}
/* 怎麼稱呼您 */
.home-ask{position:absolute;right:0;top:37.8%;width:844px;max-height:58%;z-index:30;display:flex;flex-direction:column;gap:14px}
.home-ask .box{position:relative;width:100%;display:flex;flex-direction:column;align-items:flex-start;gap:14px;padding:20px 22px;border-radius:22px;color:var(--ink);font-family:var(--font);
  background:#ffffffa8;-webkit-backdrop-filter:blur(18px) saturate(150%) brightness(1.08);backdrop-filter:blur(18px) saturate(150%) brightness(1.08);
  border:1px solid #ffffff99;box-shadow:0 16px 40px #282b6f26,inset 0 1px 0 #ffffffb3}
.home-ask .row{display:flex;align-items:center;gap:12px;width:100%}
.home-ask .hint{font-size:var(--t-sub);color:var(--hint)}
.home-ask .hint em{font-style:normal;color:var(--brand);font-weight:600}
.home-ask .lb{font-size:var(--t-lb);color:var(--secondary)}
.home-ask input{flex:1;min-width:0;padding:13px 18px;border-radius:16px;border:1px solid #282b6f33;background:#ffffff5c;font-family:var(--font);font-size:var(--t-in);color:var(--ink);letter-spacing:.04em}
.home-ask input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px #282b6f1f}
/* 委員名單 */
.home-list{position:absolute;right:0;top:37.8%;width:844px;z-index:30;display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.home-list .box{position:relative;width:100%;max-height:400px;overflow:auto;overscroll-behavior:contain;display:grid;grid-template-columns:1fr 1fr;gap:16px 20px;padding:26px 28px;border-radius:24px;color:var(--ink);font-family:var(--font);
  background:#ffffffa8;-webkit-backdrop-filter:blur(18px) saturate(150%) brightness(1.08);backdrop-filter:blur(18px) saturate(150%) brightness(1.08);
  border:1px solid #ffffff99;box-shadow:0 16px 40px #282b6f26,inset 0 1px 0 #ffffffb3}
.home-list .mrow{display:flex;align-items:center;gap:12px;min-width:0}
.home-list .mrow input{padding:11px 16px;border-radius:14px;border:1px solid #282b6f33;background:#ffffff5c;font-family:var(--font);font-size:var(--t-in);color:var(--ink)}
.home-list .mrow input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px #282b6f1f}
.home-list .mrow .role{width:142px;flex-shrink:0;min-width:0;padding-left:12px;padding-right:8px;color:var(--secondary)}
.home-list .add{grid-column:1/-1;justify-self:end}
.home-list .mrow .nm{flex:1;min-width:0;width:100%}
.home-list .add{align-self:flex-end;padding:10px 20px;border-radius:999px;font-size:var(--t-sub);font-weight:600;letter-spacing:.04em;
  background:var(--accent-soft);border:1px solid #40439445;color:var(--accent)}
.home-list .add:hover{background:var(--accent);border-color:var(--accent);color:#fff;transform:translateY(-2px)}
.home-list .go-row{display:flex;align-self:flex-end}
.home-sides .side{width:384px;height:250px;margin-top:-125px;gap:16px;padding:22px 26px;border-radius:30px}
.home-sides .side .ic{width:88px;height:88px;border-radius:26px}
.home-sides .side .ic svg{width:44px;height:44px}
.home-sides .side b{font-size:1.8rem}
.home-sides .side .left,.home-sides .side .resume{font-size:1.3rem}
.home-sides .side.l{right:calc(50% + 376px)}
.home-sides .side.r{left:calc(50% + 376px)}


/* ---------- 操作畫面 ---------- */
.work{flex:1;min-height:0;display:flex;flex-direction:column;padding-bottom:26px}
.work-head{display:flex;align-items:center;gap:26px;margin:0 0 18px;flex-wrap:wrap}
/* 會議資料／會議紀錄的每一頁都同一個版型：以安在左，標題、階段橫條、卡片都在右欄的固定位置 */
.work.duo{flex:1;min-height:0;display:grid;grid-template-columns:616px minmax(0,1fr);gap:20px;padding:0}
/* 以安的框與首頁靠左時完全一樣：同寬、同高、同一個底線，從會議資料滑過來才不會跳 */
.work.duo > .figure{min-height:0;height:100%;width:auto;aspect-ratio:1080/1438;justify-self:start;margin-left:-22px}
.work.duo .duo-main{display:flex;flex-direction:column;min-height:0;justify-content:flex-start;padding:105px 0 26px 0}
.work.duo .work-head{flex-shrink:0}
.work.duo .card{flex:0 1 auto;max-height:none}
.work.duo.tall .card{flex:1 1 auto}
.work.duo .said{font-size:1.3rem;line-height:1.9;margin:0 0 18px}
.work-head h2{font-size:2.1rem;font-weight:600;letter-spacing:.05em;margin:0}
.steps{display:flex;align-items:center;gap:6px;margin-left:auto}
.step{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:999px;font-size:1.06rem;color:var(--secondary);background:#eaeaef;font-family:var(--font)}
button.step{cursor:pointer;transition:background .2s ease,color .2s ease}
button.step:hover{background:var(--brand-soft);color:var(--brand)}
.step b{font-weight:600;font-size:.95rem;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:#c9c9d6;color:#fff}
.step.on{background:var(--brand);color:#fff}
.step.on b{background:#ffffff33}
.step.done{background:var(--brand-wash);color:var(--brand)}
.step.done b{background:var(--brand)}
.card{position:relative;flex:1 1 auto;min-height:0;overflow:auto;background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:30px 34px;box-shadow:var(--shadow)}
.work.mid .card{flex:0 0 auto;overflow:visible;align-self:center;width:min(660px,100%);margin:auto auto 14px}
.work.mid .actions{width:min(660px,100%);align-self:center;margin-bottom:auto}
.actions{display:flex;align-items:center;gap:14px;margin-top:20px;flex-shrink:0}
.actions .spacer{margin-left:auto}

/* 上傳列 */
.slot{display:flex;align-items:center;gap:18px;padding:19px 22px;border:1px solid var(--line);border-radius:16px;background:#fbfbfc;width:100%;text-align:left;transition:border-color .2s ease,background .2s ease,transform .2s ease}
.slot+.slot{margin-top:14px}
.slot:hover{border-color:var(--brand);transform:translateY(-2px)}
.slot .ic{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;background:var(--brand-wash);color:var(--brand);flex-shrink:0}
.slot .tx b{display:block;font-size:1.4rem;font-weight:600;letter-spacing:.04em}
.slot .tx span{font-size:1.16rem;color:var(--hint);letter-spacing:.04em}
.slot .ok{margin-left:auto;display:flex;align-items:center;gap:9px;color:var(--brand);font-size:1.1rem}
.slot.filled{background:var(--brand-wash);border-color:#d8d8df}
.slot.sm{flex:1;min-width:0;padding:14px 16px;gap:13px}
.slot.sm .ic{width:40px;height:40px;border-radius:12px}
.slot.sm .ic svg{width:21px;height:21px}
.slot.sm .tx b{font-size:1.12rem}
.slot.sm .tx span{font-size:.98rem}
.slot.sm .ok svg{width:20px;height:20px}
.pair{display:flex;align-items:center;gap:12px}
.pair+.pair{margin-top:14px}
.pair .pl{flex-shrink:0;width:4.6em;font-size:1.18rem;color:var(--secondary);letter-spacing:.06em}
.side-main{display:flex;flex-direction:column;min-height:0;justify-content:center;padding-bottom:20px}
.filecard{display:flex;align-items:center;gap:18px;padding:22px 24px;border:1px solid #d8d8df;border-radius:18px;background:var(--brand-wash)}
.filecard .ic{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;background:#fff;color:var(--brand);flex-shrink:0}
.filecard .ic svg{width:29px;height:29px}
.filecard .tx b{display:block;font-size:1.36rem;font-weight:600;letter-spacing:.03em;line-height:1.6;color:var(--brand)}
.filecard .tx span{font-size:1.16rem;color:var(--hint);letter-spacing:.05em}
.donenote{margin:18px 2px 0;font-size:1.28rem;line-height:1.95;color:var(--hint);letter-spacing:.03em}
.side-main .card{flex:0 0 auto;overflow:visible}

/* 議題卡 */
.tcard{border:1px solid var(--line);border-radius:18px;background:#fff;padding:20px 24px}
.tcard-head{display:flex;align-items:center;gap:14px}
.tcard-no{font-size:1.46rem;font-weight:600;letter-spacing:.06em;white-space:nowrap}
.tcard input.ti{flex:1;min-width:0;border:0;border-bottom:1px solid var(--line);background:transparent;font-size:1.44rem;padding:8px 2px;color:var(--ink)}
.mic{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--line);background:var(--accent-soft);color:var(--accent);flex-shrink:0}
.mic.rec{background:var(--accent);color:#fff}
.mic:disabled,.ttab.plus:disabled{background:var(--surface);color:var(--line);border-color:var(--line);cursor:not-allowed}
.ttab-max{font-size:1.05rem;color:var(--secondary)}
.t-desc{display:flex;gap:12px;margin-top:16px}
.t-desc>span{color:var(--secondary);font-size:1.26rem;letter-spacing:.35em;padding-top:8px;white-space:nowrap}
.t-desc textarea{flex:1;min-width:0;border:0;border-bottom:1px solid var(--line);background:transparent;font:inherit;font-size:1.38rem;line-height:2.1;color:var(--ink);resize:none;overflow:hidden;padding:4px 2px}
/* 議題頁籤 */
.ttabs{display:flex;align-items:center;gap:8px;margin:0 0 20px;flex-wrap:wrap}
.ttab{padding:9px 20px;border-radius:999px;border:1px solid var(--line);background:var(--surface);font-family:var(--font);font-size:1.2rem;letter-spacing:.05em;color:var(--secondary);transition:background .2s ease,color .2s ease,border-color .2s ease}
.ttab:hover{color:var(--brand);border-color:var(--brand)}
.ttab.on{background:var(--brand);border-color:var(--brand);color:#fff}
.ttab.plus{width:44px;height:44px;padding:0;display:grid;place-items:center;border-style:dashed;font-size:1.26rem}
.t-tools{display:flex;justify-content:flex-end;gap:10px;margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}
.chip.ico{width:48px;height:48px;padding:0;justify-content:center;border-style:solid;background:var(--accent-soft);border-color:#40439440;color:var(--accent)}
.chip.ico:hover{background:var(--accent);border-color:var(--accent);color:#fff}
.chip.ico svg{width:22px;height:22px}
.chip{display:inline-flex;align-items:center;gap:9px;padding:12px 20px;border-radius:13px;border:1px solid var(--line);background:var(--surface);font-size:1.24rem;color:var(--secondary);transition:color .2s ease,border-color .2s ease,transform .2s ease}
.chip:hover{color:var(--brand);border-color:var(--brand);transform:translateY(-2px)}
.chip.dashed{border-style:dashed}
.tchips{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.tchip{display:inline-flex;align-items:flex-start;gap:9px;padding:9px 13px;border:1px solid var(--line);border-radius:12px;background:#ececf1;font-size:1.18rem;line-height:1.75;color:var(--ink)}
.tchip.wide{flex:1 1 100%}
.tchip svg{width:17px;height:17px;color:var(--accent);flex-shrink:0;margin-top:4px}

/* 校對 */
.frows{display:flex;flex-direction:column;gap:12px}
.frow{display:flex;align-items:flex-start;gap:6px}
.flab{flex-shrink:0;width:6.6rem;font-size:1.34rem;line-height:2.05;color:var(--secondary)}
.frow textarea{flex:1;min-width:0;border:1px solid var(--line);border-radius:12px;background:#fbfbfc;padding:8px 14px;font:inherit;font-size:1.34rem;line-height:2.05;color:var(--ink);resize:none;overflow:hidden}
.findent{margin-left:calc(5.98rem + 6px)}
table{width:100%;border-collapse:separate;border-spacing:0;border:1px solid var(--line);border-radius:14px;overflow:hidden;font-size:1.24rem}
th{background:var(--accent-soft);color:var(--ink);font-weight:600;text-align:left;padding:13px 16px;letter-spacing:.05em}
td{padding:13px 16px;border-top:1px solid var(--line);letter-spacing:.03em}
.sitem{display:flex;align-items:flex-start;gap:10px;border:1px solid var(--line);border-radius:12px;background:#fbfbfc;padding:8px 14px}
.sitem+.sitem{margin-top:6px}
.sitem .tick{width:24px;height:24px;border-radius:7px;border:1.5px solid #b6b7c9;display:grid;place-items:center;flex-shrink:0;margin-top:2px;background:#fff}
.sitem .tick svg{width:14px;height:14px;color:#fff;opacity:0;stroke-width:2.6}
.sitem[data-on="true"] .tick{background:var(--brand);border-color:var(--brand)}
.sitem[data-on="true"] .tick svg{opacity:1}
.sitem.off{opacity:.5}
.sitem .no{font-size:1.3rem;color:var(--brand);font-weight:600;flex-shrink:0;line-height:1.45}
.sitem .bd{flex:1;min-width:0;font-size:1.3rem;line-height:1.45;letter-spacing:.03em}
.grp{font-size:1.38rem;font-weight:600;color:var(--brand);margin:0 0 12px;letter-spacing:.05em}

/* 進度 */
.busy{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1fr);gap:20px;padding-bottom:26px}
.busy > .figure{order:-1}
.busy-left{display:flex;flex-direction:column;justify-content:center;min-height:0;padding-left:20px}
.busy-left h3{font-size:1.8rem;font-weight:600;margin:0 0 10px;letter-spacing:.04em}
.busy-left .said{font-size:1.38rem;line-height:2.05;color:var(--secondary);margin:0 0 26px;max-width:26em}
.papers{position:absolute;left:6%;top:34%;width:120px;height:150px;z-index:2;pointer-events:none}
.papers i{position:absolute;left:0;top:0;width:96px;height:120px;border-radius:8px;background:#fdfdfd;border:1px solid #d6d6e0;box-shadow:0 8px 20px #282b6f20;
  transform-origin:left center;animation:flip 3s ease-in-out infinite}
.papers i:nth-child(2){animation-delay:.6s}
.papers i:nth-child(3){animation-delay:1.2s}
.papers i::after{content:"";position:absolute;left:14px;right:14px;top:22px;height:6px;border-radius:3px;background:#dddde5;box-shadow:0 18px 0 #dddde5,0 36px 0 #dddde5,0 54px 0 #e4e4eb}
@keyframes flip{0%{transform:rotateY(0) translateY(0);opacity:1}
  45%{transform:rotateY(-72deg) translateY(-10px);opacity:.9}
  70%{transform:rotateY(-104deg) translateY(-4px);opacity:0}
  71%,100%{transform:rotateY(0) translateY(0);opacity:1}}
.prog{height:8px;border-radius:999px;background:#dedee6;overflow:hidden;margin:6px 0 26px}
.prog i{display:block;height:100%;width:0;border-radius:999px;background:var(--brand);animation:fill 3.6s linear forwards}
.prog.slow i{animation-duration:10.8s}   /* 彙整中：跟著拉長三倍 */
/* 真的進度（watchJob）：寬度由步數決定，不跑動畫；正在做的那一行亮著但還沒打勾 */
.prog.live i{animation:none;width:0;transition:width .6s ease}
.log li.now{color:var(--ink)}
.log li.now .d{background:var(--accent-soft);animation:recpulse 1.2s ease-in-out infinite}
@keyframes fill{to{width:100%}}
.log{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
.log li{display:flex;align-items:center;gap:12px;font-size:1.34rem;color:var(--muted);letter-spacing:.04em}
.log li.on{color:var(--ink)}
.log .d{width:26px;height:26px;border-radius:50%;background:#dedee6;color:#fff;display:grid;place-items:center;flex-shrink:0}
.log .d svg{width:15px;height:15px;opacity:0;stroke-width:2.6}
.log li.on .d{background:var(--brand)}
.log li.on .d svg{opacity:1}
.done-big{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:22px;text-align:center}
.done-big .ring{width:96px;height:96px;border-radius:50%;background:var(--brand-wash);color:var(--brand);display:grid;place-items:center}
.done-big .ring svg{width:46px;height:46px;stroke-width:2.2}
.done-big h3{font-size:1.7rem;font-weight:600;margin:0;letter-spacing:.05em}
.done-big p{font-size:1.34rem;color:var(--secondary);margin:0;line-height:2}

/* ---------- 小幫手 ---------- */
.spot{position:relative;z-index:6;animation:spot 1.2s ease-in-out infinite;border-radius:16px}
@keyframes spot{
  0%,100%{outline:2px solid #40439440;outline-offset:3px;box-shadow:0 0 0 0 #40439400}
  50%{outline:2px solid var(--accent);outline-offset:5px;box-shadow:0 0 0 9px #40439424}}
.coach{position:absolute;z-index:40;display:flex;align-items:flex-end;gap:4px;animation:pop .28s ease}
@keyframes pop{from{opacity:0;transform:translateY(6px) scale(.97)}to{opacity:1;transform:none}}
.coach .av{width:104px;height:132px;flex-shrink:0;background-repeat:no-repeat;background-size:104% auto;background-position:50% 0;
  mask-image:linear-gradient(to bottom,#000 78%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,#000 78%,transparent 100%)}
.coach .tx{display:none}
.coach .qm{flex-shrink:0;width:34px;height:34px;border-radius:50%;border:1px solid #cdcdd9;background:#fff;color:var(--accent);display:grid;place-items:center;font-size:1.06rem;font-weight:600;margin-bottom:16px;box-shadow:0 4px 12px #282b6f24;transition:background .2s ease,color .2s ease,transform .2s ease}
.coach .qm:hover{background:var(--accent);color:#fff;transform:scale(1.06)}
.coach .wave{color:var(--accent);margin-bottom:18px;opacity:.55}
body.is-speaking .coach .wave{opacity:1}
.helpbox{position:absolute;z-index:41;max-width:30em;padding:18px 22px;border-radius:16px;background:#282b6f;color:#eeeef2;font-size:1.24rem;line-height:1.95;letter-spacing:.03em;box-shadow:0 20px 44px #282b6f40}
.helpbox b{display:block;margin-bottom:6px;color:#cdceda;font-weight:600}
.helpbox .x{position:absolute;right:10px;top:8px;color:#a6a7b9;font-size:1rem}

/* ---------- 設定頁 ---------- */
.work.duo.solo{grid-template-columns:minmax(0,1fr);padding-right:0}
/* 設定頁沒有以安，不必跟著她的版型往下站；整塊往上拉，卡片置中，標題與頁籤切齊卡片左緣 */
.work.duo.solo .duo-main{padding:14px 0 18px 0;align-items:center}
.work.duo.solo .duo-main > *{width:min(1080px,100%)}
.work.duo.solo .work-head{margin:0 0 12px}
.set-close{margin-left:auto;width:46px;height:46px;border-radius:14px;display:grid;place-items:center;flex-shrink:0;
  border:1px solid var(--line);background:var(--surface);color:var(--secondary);transition:color .2s ease,border-color .2s ease,transform .2s ease}
.set-close:hover{color:var(--brand);border-color:var(--brand);transform:rotate(90deg)}
.set-close svg{width:22px;height:22px}
.work.duo.solo .ttabs{margin:0 0 10px}
.work.duo.solo .card{padding:16px 30px}
.work.duo.solo .card.set-card{flex:1 1 auto;min-height:0;overflow:auto}
.set-note{margin:0 0 22px;font-size:1.2rem;line-height:1.9;color:var(--hint);letter-spacing:.03em}
.setfield{display:flex;align-items:center;gap:20px;padding:16px 0;border-bottom:1px solid var(--line)}
.setfield:last-child{border-bottom:0}
.setfield .lb{flex-shrink:0;width:9em;font-size:var(--t-lb);color:var(--secondary);letter-spacing:.04em}
.setfield input{flex:1;min-width:0;padding:13px 18px;border-radius:14px;border:1px solid var(--line);background:#fbfbfc;
  font-family:var(--font);font-size:var(--t-in);color:var(--ink);letter-spacing:.04em}
.setfield input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px #282b6f1f}
.set-period{display:flex;align-items:center;gap:20px;padding:14px 0;border-bottom:1px solid var(--line)}
.set-period:last-child{border-bottom:0}
.set-period .pl{flex-shrink:0;width:6em;font-size:var(--t-lb);font-weight:600;color:var(--secondary);letter-spacing:.03em}
.set-files{display:flex;gap:14px;flex:1;min-width:0}
.set-file{flex:1;min-width:0;display:flex;align-items:center;gap:13px;padding:13px 16px;border-radius:15px;border:1px solid #d8d8df;background:var(--brand-wash)}
.set-file.empty{border-color:var(--line);background:#fbfbfc}
.set-file .ic{width:40px;height:40px;border-radius:12px;flex-shrink:0;display:grid;place-items:center;background:#e2e2e7d9;color:var(--brand)}
.set-file.empty .ic{background:#e4e4eab3;color:var(--accent)}
.set-file .ic svg{width:21px;height:21px}
.set-file .tx{display:flex;flex-direction:column;gap:2px;min-width:0}
.set-file .tx b{font-size:var(--t-lb);font-weight:600;letter-spacing:.03em}
.set-file .tx span{font-size:var(--t-sub);color:var(--secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.set-file .mini{margin-left:auto;flex-shrink:0;padding:9px 16px;border-radius:999px;font-family:var(--font);font-size:var(--t-sub);
  border:1px solid #282b6f33;background:#fff;color:var(--secondary)}
.set-file .mini:hover{border-color:var(--brand);color:var(--brand)}
.set-members{display:grid;grid-template-columns:1fr 1fr;gap:16px 20px}
.set-members .mrow{display:flex;align-items:center;gap:12px;min-width:0}
.set-members .mrow input{padding:12px 16px;border-radius:14px;border:1px solid var(--line);background:#fbfbfc;
  font-family:var(--font);font-size:var(--t-in);color:var(--ink)}
.set-members .mrow input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px #282b6f1f}
.set-members .mrow .role{width:9em;flex-shrink:0;color:var(--secondary)}
.set-members .mrow .nm{flex:1;min-width:0;width:100%}
.set-members .add{grid-column:1/-1;justify-self:end;padding:11px 22px;border-radius:999px;font-size:var(--t-sub);font-weight:600;
  background:var(--accent-soft);border:1px solid #40439445;color:var(--accent)}
.set-members .add:hover{background:var(--accent);border-color:var(--accent);color:#fff}
.set-h{margin:0 0 9px;font-size:1.46rem;font-weight:600;letter-spacing:.05em;color:var(--ink)}
.set-h+.set-opt{margin-top:0}
.set-opt{display:block;width:100%;text-align:left;padding:12px 20px;margin-bottom:6px;border-radius:18px;border:1px solid var(--line);
  background:#fbfbfc;font-family:var(--font);transition:border-color .2s ease,background .2s ease}
.set-opt:hover{border-color:var(--brand)}
.set-opt.on{border-color:var(--brand);background:var(--brand-wash)}
.set-opt .hd{display:flex;align-items:center;gap:12px;margin-bottom:6px}
.set-opt .hd b{font-size:var(--t-lb);font-weight:600;letter-spacing:.05em;color:var(--ink)}
.set-opt .hd .tag{font-size:var(--t-sub);color:var(--secondary);letter-spacing:.03em}
.set-opt .hd .now{margin-left:auto;font-size:var(--t-sub);font-weight:600;color:var(--brand)}
.set-opt p{margin:0;font-size:var(--t-sub);line-height:1.65;color:var(--secondary);letter-spacing:.03em}
.set-check{display:flex;align-items:center;gap:14px;font-size:var(--t-lb);color:var(--ink);letter-spacing:.04em;cursor:pointer}
.set-check input{width:22px;height:22px;accent-color:var(--brand);cursor:pointer}
.set-vote{width:100%;margin-top:8px;padding:11px 18px;border-radius:15px;border:1px solid var(--line);background:#fbfbfc;
  font:inherit;font-size:var(--t-sub);line-height:1.85;color:var(--ink);resize:none;overflow:hidden;min-height:2.7em}
.set-vote:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px #282b6f1f}
.set-card .set-h:nth-of-type(2),.set-card .set-h:nth-of-type(3){margin-top:10px}
/* 條列凸排（app.js hang()，#148）：標號自己一欄，內文換行對齊標號後的第一個字。
   v2-skin.css、shared/style.css 有同一段，改的話三份一起改 */
.hang{display:flex}
.hang>.mk{flex:none;margin-right:.25em}
.hang>.mk+*{flex:1;min-width:0}
/* 上傳三期說明（app.js uploadGuide，#134）：首次設定的說明視窗、設定頁社區格式九格下方 */
.up-guide b{display:block;color:var(--ink);font-weight:600}
/* 設定頁：九格下方還有「上傳好了」那一列（#135），標題跟內文同一行、字小一級，整頁才不出捲軸 */
.set-card .up-guide{margin-top:10px;padding-top:10px;border-top:1px solid var(--line)}
.set-card .up-guide b{display:inline;margin-right:.7em}
.set-card .up-guide p{margin:0 0 4px;font-size:var(--t-tag);line-height:1.6;color:var(--secondary);letter-spacing:.02em}
.set-card .up-guide p:last-child{margin:0}

/* ---------- 提醒視窗 ---------- */
.modal-back{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:40px;background:#282b6f66;
  grid-template-rows:minmax(0,1fr);
  -webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);animation:modalBack .22s ease}
/* 內容比畫面高（例如儲值選統編多三格）時視窗自己捲，按鈕才點得到 */
.modal{width:min(620px,100%);max-height:100%;overflow-y:auto;padding:38px 42px 32px;border-radius:24px;background:var(--surface);border:1px solid var(--line);
  box-shadow:0 30px 70px #282b6f40;animation:modalIn .28s cubic-bezier(.2,.7,.3,1)}
.modal h3{margin:0 0 20px;font-size:1.92rem;font-weight:600;letter-spacing:.05em;color:var(--ink)}
.modal p{margin:0 0 14px;font-size:1.44rem;line-height:1.95;letter-spacing:.03em;color:var(--secondary)}
.modal-row{display:flex;justify-content:flex-end;gap:14px;margin-top:28px}
.modal-row .btn{font-size:1.4rem;padding:16px 30px}
/* 歡迎畫面（#127）：沒有卡片，淺底上置中的大標題＋副標＋圓角按鈕 */
.modal-back.welcome{background:#f4f4f7f0}
.welcome .modal{width:auto;padding:0;border:0;border-radius:0;background:none;box-shadow:none;text-align:center;font-family:var(--font)}
.welcome .modal h3{margin:0 0 26px;font-size:5.2rem;font-weight:700;letter-spacing:.06em;line-height:1.2;color:var(--ink)}
.welcome .modal h3 em{font-style:normal;color:var(--em)}
.welcome .modal p{margin:0;font-size:1.6rem;letter-spacing:.12em;color:var(--ink)}
.welcome .modal-row{justify-content:center;margin-top:44px}
.welcome .modal-row .btn{font-family:var(--font);font-size:1.7rem;padding:20px 64px;border-radius:999px;letter-spacing:.12em}
/* 選單：再次下載／接著做／做新的 */
.mchoices{display:flex;flex-direction:column;gap:12px}
.mchoice{display:flex;align-items:center;gap:18px;width:100%;padding:18px 22px;border-radius:18px;border:1px solid var(--line);background:#fbfbfc;
  text-align:left;font-family:var(--font);color:var(--ink);transition:border-color .2s ease,background .2s ease,transform .2s ease}
.mchoice:hover:not(:disabled),.mchoice:focus-visible{outline:none;border-color:var(--brand);background:var(--brand-wash);transform:translateY(-2px)}
.mchoice .ic{width:52px;height:52px;border-radius:15px;flex-shrink:0;display:grid;place-items:center;background:var(--brand-soft);color:var(--brand)}
.mchoice .ic svg{width:26px;height:26px}
.mchoice .tx{display:flex;flex-direction:column;gap:4px;min-width:0}
.mchoice .tx b{font-size:1.5rem;font-weight:600;letter-spacing:.05em}
.mchoice .tx span{font-size:1.2rem;color:var(--hint);letter-spacing:.03em}
.mchoice:disabled{opacity:.45;cursor:default}
.modal.menu .modal-row{margin-top:22px}
/* 做新的會議資料：視窗裡填這次開會 */
.mfields{display:flex;flex-direction:column;gap:14px;margin:6px 0 4px}
.mfields .mf{display:flex;align-items:center;gap:16px}
.mfields .lb{width:5.2em;flex-shrink:0;font-size:1.3rem;color:var(--secondary);letter-spacing:.04em}
.mfields .in{display:flex;align-items:center;gap:10px}
.mfields input,.mfields select{padding:11px 14px;border-radius:14px;border:1px solid var(--line);background:#fbfbfc;
  font-family:var(--font);font-size:1.36rem;color:var(--ink);letter-spacing:.03em}
.mfields input{width:110px;text-align:center}
.mfields select{min-width:88px;cursor:pointer}
.mfields input:focus,.mfields select:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px #282b6f1f}
.mfields .miss{border-color:var(--accent);background:#f3f3f6}
.mfields .sf{font-size:1.36rem;color:var(--secondary)}
.mfields .mwarn{margin:2px 0 0;font-size:1.2rem;line-height:1.8;color:var(--em)}
.modal .modal-note{margin:18px 0 0;font-size:1.2rem;color:var(--hint)}
/* 儲值視窗（#89）：方案、付款方式、發票都是一排可點的選項 */
.topup-form h4{margin:14px 0 8px;font-size:1.3rem;font-weight:600;color:var(--secondary);letter-spacing:.04em}
.topup-form h4:first-child{margin-top:0}
.topup-plans,.topup-row{display:flex;flex-wrap:wrap;gap:10px}
.topup-opt{display:flex;align-items:center;gap:10px;padding:12px 16px;border-radius:14px;border:1px solid var(--line);
  background:#fbfbfc;cursor:pointer;font-size:1.3rem;color:var(--ink)}
.topup-opt:has(input:checked){border-color:var(--brand);background:var(--brand-wash)}
.topup-opt span{display:flex;flex-direction:column;gap:2px}
.topup-opt span span{font-size:1.1rem;color:var(--hint)}
.topup-in{display:block;width:100%;margin-top:10px;padding:11px 14px;border-radius:14px;border:1px solid var(--line);
  background:#fbfbfc;font-family:var(--font);font-size:1.3rem;color:var(--ink)}
.topup-in[hidden]{display:none}
.topup-in:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px #282b6f1f}
@keyframes modalBack{from{opacity:0}}
@keyframes modalIn{from{opacity:0;transform:translateY(18px) scale(.97)}}

/* ---------- 功能卡片上的次數與進度 ---------- */
.home-sides .side .left{font-size:var(--t-sub);letter-spacing:.04em;color:var(--hint)}
.home-sides .side .left.none{color:var(--em)}
.home-sides .side .resume{font-size:var(--t-sub);letter-spacing:.04em;font-weight:600;color:var(--brand)}
/* 還有新會員免費次數（#92）：首頁會議卡、會議頁兩張卡的右上角。只有點、不帶數字 */
.red-dot{position:absolute;top:14px;right:14px;width:14px;height:14px;border-radius:50%;background:#e5484d;box-shadow:0 0 0 3px #fff;pointer-events:none}

/* ---------- 會議資料：下一個該上傳的那一張會閃 ---------- */
.home-prep .pslot.guide{border-color:#404394a6;animation:guideRing 1.7s ease-in-out infinite}
@keyframes guideRing{0%,100%{box-shadow:0 14px 34px #282b6f26,inset 0 1px 0 #ffffffb3,0 0 0 0 #40439400}
  50%{box-shadow:0 14px 34px #282b6f26,inset 0 1px 0 #ffffffb3,0 0 0 7px #4043941f}}
.home-prep .pslot .guide-dot{position:absolute;left:-13px;top:50%;margin-top:-13px;width:26px;height:26px;border-radius:50%;
  display:grid;place-items:center;background:var(--accent);color:#fff;box-shadow:0 4px 10px #40439459;animation:guideDot 1.7s ease-in-out infinite}
.home-prep .pslot .guide-dot svg{width:15px;height:15px}
@keyframes guideDot{0%,100%{transform:translateX(0);opacity:.85}50%{transform:translateX(4px);opacity:1}}

/* ---------- 小螢幕 ---------- */
.picks{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.pick{display:flex;flex-direction:column;align-items:flex-start;gap:14px;padding:26px 24px;border-radius:20px;border:1px solid var(--line);background:var(--surface);box-shadow:var(--shadow);text-align:left;transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease}
.pick:hover{transform:translateY(-3px);border-color:var(--brand);box-shadow:0 14px 30px #282b6f20}
.pick .ic{width:58px;height:58px;border-radius:17px;display:grid;place-items:center;background:var(--brand-soft);color:var(--brand)}
.pick .ic svg{width:29px;height:29px}
.pick b{font-size:1.44rem;font-weight:600;letter-spacing:.06em}
.pick span{font-size:1.1rem;line-height:1.85;color:var(--secondary);letter-spacing:.03em}
.demo{display:inline-flex;align-items:center;gap:8px;padding:9px 15px;border-radius:12px;border:1px dashed #a6a7b9;background:#ffffff66;color:#282b6f;font-size:.98rem;letter-spacing:.04em;transition:color .2s ease,border-color .2s ease}
.demo:hover{color:var(--accent);border-color:var(--accent);background:#ffffff73}

@media (orientation:portrait) and (max-width:1100px){
  .app{padding:0 26px}
  .talk{grid-template-columns:1fr}
  .talk:not(.home) .figure{display:none}
  .tasks{grid-template-columns:1fr}
  .picks{grid-template-columns:1fr}
}

/* ---------- 齒輪選單（管理員才有兩種設定）---------- */
.gearmenu{position:absolute;right:0;top:calc(100% + 10px);z-index:120;min-width:300px;
  display:flex;flex-direction:column;gap:2px;padding:8px;border-radius:18px;
  border:1px solid var(--line);background:var(--surface);box-shadow:0 18px 40px #282b6f24}
.gearitem{display:flex;flex-direction:column;gap:3px;align-items:flex-start;text-align:left;
  padding:12px 14px;border-radius:13px;transition:background .18s ease}
.gearitem:hover{background:var(--brand-wash)}
.gearitem b{font-size:var(--t-lb);font-weight:600;letter-spacing:.04em;color:var(--ink)}
.gearitem span{font-size:var(--t-tag);color:var(--muted);letter-spacing:.02em}
.tools{position:relative}

@keyframes recpulse{0%,100%{opacity:1}50%{opacity:.55}}

/* 案場鈕在正式版是按鈕（原型是 div）：補上按鈕該有的樣子，外觀照 .site */
button.site{border:0;cursor:pointer;font:inherit;font-size:1.5rem;font-weight:600}
button.site:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
/* 儲值鈕（#89）：在案場鈕左邊，高度跟案場鈕一樣 50px */
.topup{height:50px;padding:0 20px;border-radius:15px;border:1px solid var(--brand);background:var(--surface);
  color:var(--brand);font:inherit;font-size:1.2rem;font-weight:600;letter-spacing:.06em;cursor:pointer;
  transition:background .22s ease,transform .22s ease}
.topup:hover{background:var(--brand-wash);transform:translateY(-2px)}
.topup[hidden]{display:none}

/* 頂列的工作進度（#60）：一件直接寫名字＋狀態，兩件以上是圖示＋件數、點了展開。
   高度照齒輪 50px；彙整中轉圈、已完成打勾、沒有完成是 LOGO 橘的驚嘆號 */
.jobs{position:relative}
.jobchip{height:50px;display:inline-flex;align-items:center;gap:10px;padding:0 18px;border-radius:15px;
  border:1px solid var(--line);background:var(--surface);color:var(--ink);font-size:var(--t-tag);
  letter-spacing:.04em;white-space:nowrap;transition:border-color .22s ease,transform .22s ease}
.jobchip:hover{border-color:var(--brand);transform:translateY(-2px)}
.jobchip b{font-weight:600;font-size:1.1rem}
.jobchip .js,.jobitem .js{color:var(--secondary)}
.jobchip.many{padding:0 16px 0 14px}
.jobchip .jn{min-width:26px;height:26px;padding:0 7px;border-radius:13px;display:grid;place-items:center;
  background:var(--brand);color:#fff;font-size:1rem}
.ji{display:grid;place-items:center;width:24px;height:24px;flex-shrink:0}
.ji svg{width:22px;height:22px;stroke-width:2}
.jobs .run .ji svg{animation:upSpin 1s linear infinite}
.jobs .ok .ji{color:var(--brand)}
.jobs .bad .ji,.jobs .bad .js{color:var(--em)}
.jobmenu{min-width:260px}
.jobitem{display:flex;align-items:center;gap:10px;text-align:left;padding:12px 14px;border-radius:13px;
  font-size:var(--t-tag);transition:background .18s ease}
.jobitem:hover{background:var(--brand-wash)}
.jobitem b{font-size:1.1rem;font-weight:600;color:var(--ink);flex:1}

/* ── 會議流程補的（原本寫在 meeting.html 的 <style>；首頁與會議現在是同一頁內換畫面）── */
/* 議題卡（原型的 .tcard / .tchip / .chip.ico 都在 app/style.css），這裡只補原型沒有的：
   製表資料可以刪（原型是示範，沒做刪除）、錄音中的狀態、處理中的字樣 */
.tchip{align-items:center}
.tchip > span{flex:1;min-width:0}
.tchip-x{width:24px;height:24px;flex-shrink:0;border:0;border-radius:8px;background:none;
  font:inherit;font-size:.9em;color:var(--muted);cursor:pointer}
.tchip-x:hover{color:#a33246;background:#0000000d}
.chip.ico.rec{background:var(--accent);border-color:var(--accent);color:#fff}
/* 刪除靠左、跟右邊的新增分開；平常是淡的，滑過去才轉紅 —— 不要搶「加入製表資料」的注意力 */
.chip.del-topic{margin-right:auto;border-color:transparent;background:none;color:var(--muted)}
.chip.del-topic:hover{color:#a33246;border-color:#e3bcc5;transform:none}
/* 附件與口述在背景讀（#69）：那一筆自己顯示讀取中／讀取失敗，畫面其他地方照常能按 */
.tchip .st{flex:none;font-size:.9em;color:var(--muted)}
.tchip.reading{background:var(--brand-wash);border-style:dashed}
.tchip.reading .spin,.t-note .spin{width:16px;height:16px;border-width:2px;flex:none;align-self:center}
.tchip.failed{background:#fbeef1;border-color:#e3bcc5}
.tchip.failed .st{color:#a33246;font-weight:600}
.t-note{display:flex;align-items:center;gap:9px;margin:8px 0 0;font-size:1.12rem;color:var(--brand)}
.t-note.failed{color:#a33246}
.t-count{margin:6px 0 0;text-align:right;font-size:1.02rem;color:var(--secondary)}
.t-count.near{color:#a33246}
.wait-note{align-self:center;margin-right:14px;font-size:1.12rem;color:var(--brand)}
.fail-list{margin:0 0 10px;padding-left:1.2em;line-height:1.8}
.card.tall{flex:1 1 auto;min-height:0;overflow:auto}

.btn.sm{padding:10px 20px;font-size:1.16rem;border-radius:12px}
/* 工作畫面散場：右欄跟人像滿版那幾頁一樣淡出（app.js 的 pxLeave） */
.work.ui-out .duo-main{animation:uiOut .9s cubic-bezier(.45,0,.75,.3) forwards;pointer-events:none}
/* 彙整中回首頁（#111）：整頁透明遮罩擋點擊，正中一塊「即將返回首頁」；散場時那一塊跟著淡掉、遮罩留到卡片長出來 */
.leave-wait{position:fixed;inset:0;z-index:300;display:grid;place-items:center;cursor:progress}
.leave-wait .box{display:flex;align-items:center;gap:16px;padding:22px 34px;border-radius:20px;background:#ffffffeb;box-shadow:0 14px 40px #282b6f2e;color:var(--ink);font-size:1.3rem;font-family:var(--font);transition:opacity .8s ease}
.leave-wait.out .box{opacity:0}
/* 簡易版（#131）：app.js 量到卡就在 <html> 加 .lite。模糊與毛玻璃全拿掉（!important 蓋得過 keyframes 裡的 filter），
   像素碎片與轉動亮點不畫（換頁剩卡片本身的淡入淡出），卡片不飄 */
html.lite *,html.lite *::before,html.lite *::after{filter:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
html.lite .px,html.lite .sparks{display:none}
html.lite .home-orbit .task,html.lite .home-sides .side{animation:none}
html.lite .talk.home.intro .home-orbit .task{animation:cardIn 1.05s cubic-bezier(.2,.7,.3,1) var(--base,0s) backwards}
html.lite .talk.home.intro .home-sides .side{animation:sideIn 1.05s cubic-bezier(.2,.7,.3,1) var(--base) backwards}