/* 共同帳戶頁:清單(我的帳戶、建立新帳戶)與管理視圖(原設定頁)。身分與跨帳戶
   合計的樣式在 F17 跟著版面搬去 account.css。 */

/* 頁首那個名字(#poolNote.mine-name)在 #215 拿掉了 —— 它是帳號層級的預設顯示
   名稱,擺在成員清單的標題位上沒有謂語,理由寫在 me-list.js 的 paintList()。 */

.mine { margin-top: 10px; }
.mine-head { display: block; margin: 14px 0 2px; }
.mine-head:first-child { margin-top: 0; }
.mine-row {
  display: flex; align-items: center; gap: 10px; cursor: pointer;
  padding: 13px 0; border-bottom: 1px solid var(--line);
  -webkit-user-select: none; user-select: none; -webkit-touch-callout: none;
}
.mine-row:last-child { border-bottom: 0; }
/* 主要帳戶那一列的記號 — #215。它佔的是「設為主要」那顆鈕的位置(一列上只有
   一個 affordance:有動作給鈕,沒動作給狀態),而**顏色是它的工作**:切換前後
   眼睛看得出東西動了,靠的就是那個位置從一顆灰框鈕變成一行 accent 字。以前這裡
   是一顆 `.star`(☆/★ 同一個 var(--dim)、同樣 15px),兩個狀態在螢幕上幾乎
   一樣。 */
.mine-row .mine-primary { flex: none; font-size: 0.8125rem; font-weight: 600; color: var(--accent); }
.mine-row .id { flex: 1; min-width: 0; }
.mine-row .id b { font-weight: 600; }
.mine-row .id > span { display: block; font-size: 0.75rem; color: var(--dim); }
.mine-row[aria-current="true"] .id b::after {
  content: " ·現在"; color: var(--accent); font-weight: 450; font-size: 0.75rem;
}
.mine-go { flex: none; font-size: 0.8125rem; color: var(--dim); }

.mine-note { margin-top: 8px; }

/* 「＋ 建立新帳本」不再自己佔一張白卡 — #255(UI 評審 #244:「白色大卡片中央僅放
   一顆按鈕,造成視覺排版鬆散與多餘間距 → 建議將『＋ 建立新帳本』整合至帳本清單
   頂部或底部」)。

   量的是 style.css 的 `.card`:18px 內距 + 1px 框 + 16px 圓角 + 陰影,裝的是一顆
   高 29px 的 `.ghost` 藥丸 —— 一張 65px 高的卡片裡有 36px 是空的,而它夾在「帳本」
   與「加入別的帳本」兩張真的有內容的卡片中間。

   **改的是那一張卡的外觀,不是那顆鈕搬家。** 評審建議「整合至清單卡片內」,而那個
   `<div class="card" id="meNewGo">` 是 `me.js` 畫的骨架(#255 的檔案範圍不含它,
   而搬家會動到那一頁的 pane 結構)。把底、框、陰影與內距從這一個 id 上撤掉之後,
   鈕直接落在清單那張卡底下 —— 版面上讀到的正是「清單的下一個動作」,而骨架一個字
   都沒有動。

   `margin-bottom` 從 `.card` 的 14px 補到 18px:內距沒了之後,鈕與下一張卡的距離
   本來會塌成 14px,比它與上面那張清單卡的距離還近,兩張卡就開始搶它。

   id 選擇器(1,0,0)贏得過 `.card`(0,1,0),所以不必 `!important`。 */
#meNewGo {
  background: none; border: 0; box-shadow: none;
  padding: 0; margin-bottom: 18px;
}

/* 「＋ 建立新帳本」那一顆從 `.ghost` 換成 `.primary` — #277 ⑥(使用者裁示
   2026-08-29:#255 把它從卡片裡搬出來之後太小、也看不出是主要動作)。

   **只收上緣那一段。** `.primary` 自帶 `margin-top: 18px`,而 #255 已經把這張卡
   的內距整個撤掉了(上面那一條)—— 兩段加起來會把鈕從清單那張卡底下推開,而它
   要讀起來是「清單的下一個動作」。寬度、底色與字級一個字都不覆寫:那正是換成
   `.primary` 要拿到的東西。

   選擇器 (1,0,1) 贏得過 style.css 的 `.primary` (0,1,0)。 */
#meNewGo .primary { margin-top: 0; }

.mine-sub { margin-top: 16px; }

.np-row { display: flex; align-items: center; gap: 8px; margin-top: 8px; }
.np-row .ghost { flex: none; }

/* 「帳本型態」那一格放寬到整行 — #158。當年的量測:style.css 的
   `select { max-width: 60% }` 在 390 寬時把這一顆壓成 192px(內容區只剩 152px),
   三個選項的字量到 204–283px,全部被截。放寬只放這一顆:同一頁其他的下拉選項都
   短,60% 對它們是對的版面。

   **#229 之後這一格是自訂下拉,`#npConsume` 是它收合面那顆鈕**(picker.js 的
   `pickHTML` 把 `name` 寫成 element id),所以這一條原封不動地還是它。留在這裡
   而不是搬進 style.css 的判準沒變:只有這一頁用得到。

   **`#npClose` 在 #233 一起進來** —— 它是同一張表單上的第二顆,而且是三顆下拉裡
   字最長的一顆(關帳那兩案沒有短名字,標題就是整句話,見 me-list.js 的
   `CLOSE_KINDS`)。收合面 `.pick-now` 是 nowrap + 省略號,不放寬的話 390 上又是
   一句被截掉的話 —— 那正是 `select { max-width: 60% }` 當年做的事。

   量測(390×844、chromium 頭無介面,sandbox 18971,2026-08-24):放寬之後收合面
   320px 寬,整句 18 個字沒有被省略號吃掉(`scrollWidth === clientWidth`);紙上
   那兩列各 83 / 82px 高,說明自己換行,兩列都沒有溢出。 */
#npConsume, #npClose { max-width: 100%; width: 100%; }

/* ------------------------------------------------------------ 管理視圖 */

/* ⚠️ **這裡以前有兩條,兩條都在 #346 收掉了。**
   `.mg-head .ghost` 畫的是 `#mgBack`「‹ 帳本」那顆自畫的返回鈕 —— 返回鈕全站只有
   一顆(#subBack,D-F82);`.mg-head h3` 畫的是 `#mgName`,而那個名字現在就是標題
   列上的那個名字(D-F85 ②)。那張卡本身留著:它裝的是「我在這裡是誰」那一行
   (#mgRole,#256)。 */

/* 帳本自檢的燈號。帳不平是要看得見的,所以用 --warn 的實心點。 */
.mg-dot {
  display: inline-block; width: 8px; height: 8px; border-radius: 50%;
  margin-right: 6px; background: currentColor; vertical-align: middle;
}
.mg-dot.bad { color: var(--warn); }

/* 一位成員兩行:上面三個可編輯欄位,下面是餘額與動作。名字吃掉剩下的寬度,
   末四碼與權重是固定寬的數字欄,右對齊才好比對。非管理者看到的是同一列的
   唯讀版本,行高不變,切換身分時清單不會跳。 */
.mrow { padding: 12px 0; border-bottom: 1px solid var(--line); }
.mrow:last-child { border-bottom: 0; }
/* 動作鈕最多五顆 — #211 重數(舊註解寫的是「四顆(…移交管理權…)」,而那顆鈕
   早就拆成兩顆了)。同時到齊的那一列是:別人、還沒被別的使用者綁走、而且不是
   管理者 —— 存資料、邀請碼、設為管理者、這是我、移除。換一種人換一組字:管理者
   那一列第三顆是「取消管理權」,自己那一列是「解除綁定」與「我要離開」。名單在
   me-members.js 的 `.seg` 裡,數目會再變,所以這裡寫的是**上界怎麼來的**而不是
   一份會過期的清單。
   五顆在窄螢幕上擠不進同一行,所以整排允許換行、字不斷詞:寧可多一行,也不要
   一顆鈕上寫著「移 除」。 */
.mrow .row { margin-top: 8px; align-items: center; flex-wrap: wrap; }
.mrow .seg { flex-wrap: wrap; }
.mrow .seg button { padding: 5px 10px; white-space: nowrap; }

/* F45:月繳金額成為第四欄。**四個輸入框在手機上排不進一行**,所以整排換行,而
   flex-basis 挑成「名字+末四碼」一行、「權重+月繳」一行 —— 換行點是算出來的,
   不是撞出來的:兩個純數字欄一起換到下一行,才對得起來比較。桌機寬度四欄仍在
   同一行。

   兩個數字欄各自帶一個單位(% / 月),因為換行之後它們是畫面上僅有的兩個沒有
   標題的框:一個「40.00」與一個「25000」誰是誰,只有單位講得清楚。 */
.mfields { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.mfields input { padding: 8px 10px; }
.mfields .mname { flex: 1 1 140px; min-width: 0; }
/* 末四碼那一格從 92px 撐到 132px — #251。placeholder 從「末四碼」改成「銀行帳號
   末四碼」(那一格以前沒有說是誰的帳號),而七個字在 92px 裡是被切掉的:一個
   讀不完的提示字比沒有提示更糟。輸入的內容仍然只有四碼,寬的是提示。 */
.mfields .mlast4 { flex: 0 0 132px; text-align: right; }
.mnum { flex: 1 1 140px; display: flex; align-items: center; gap: 6px; min-width: 0; }
.mnum input { flex: 1 1 auto; min-width: 0; text-align: right; }
.mnum i { flex: none; font-style: normal; font-size: 0.75rem; color: var(--dim); }
.mfields.mread { justify-content: space-between; padding: 8px 0; }
.mfields.mread b { font-weight: 600; }
.mfields.mread .num { color: var(--dim); font-size: 0.8125rem; }

/* 「帳上淨額 X · 權益 Y」旁邊那顆 (?) — #251。外觀跟著首頁那兩顆問號走
   (`.bal-q`),尺寸小一號:它站在一列說明字裡,不是兩個大數字旁邊。點開的那句
   話貼在同一列底下(`.mwhybody`),不是一張蓋住畫面的紙 —— 一句話撐不起一張紙,
   而這一列本來就有 `.stmsg` 用同一個位置說話(bind 失敗的原文)。

   ⚠️ **盒子 44×44、圓圈仍然 20px — D-F100(#373)。** 招數與整段理由逐字同
   home.css 的 `.bal-q`(框搬到 `::before`,不用 `z-index`,因為它沒有底色):外觀
   跟著首頁那兩顆走這件事因此也沒變 —— 換的只是「44 寫在哪一層」。

   **左右的 margin 從 `0 2px 0 6px` 換成負的**:盒子左右各多出 12px,原本那 6+2 的
   縫已經在盒子裡面了。 */
.mrow .mwhy {
  position: relative; flex: none; font: inherit; font-size: 0.6875rem; line-height: 1;
  width: 44px; height: 44px; padding: 0; margin: 0 -10px 0 -6px;
  color: var(--dim); background: none; border: 0;
  cursor: pointer; display: inline-flex; align-items: center; justify-content: center;
  vertical-align: middle;
}
.mrow .mwhy::before {
  content: ""; position: absolute; left: 50%; top: 50%;
  width: 20px; height: 20px; margin: -10px 0 0 -10px;
  border: 1px solid var(--line); border-radius: 50%;
}
.mrow .mwhy[aria-expanded="true"] { color: var(--accent); }
.mrow .mwhy[aria-expanded="true"]::before { border-color: var(--accent); }
.mrow .mwhybody { margin-top: 6px; }

/* 頁尾:兩組「合計 + 儲存」與提醒日。跟名單之間拉開一條線,免得最後一位成員
   的動作鈕與「儲存權重」看起來像同一列。 */
.mfoot { margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--line); }
.mfoot .row { align-items: center; }

/* 集資戶頭隱藏提醒日那一格時,style.css 的 .hide 是單一 class,壓不過
   `label.f`(元素+class,特異度更高)——同 add.css 那一條註解講的同一件事,
   同一個修法:這個節點自己用 id 把特異度拉高,不把 style.css 的 .hide 改成
   !important(那會波及每一個 view)。實測抓到的:沒有這一行,「每月提醒日
   (1–31)」那個 <label> 會在集資戶頭的成員管理卡上照樣印出來,雖然它管的那個
   輸入框自己(非 label 元素)乖乖被 .hide 蓋住。

   **#stCloseLabel 漏在這一行外 — #174**,同一個坑第三次(#158 的 #payerLabel
   是第二次)。me-pool.js 對「關帳分配政策」那個 label.f 呼叫的是同一支
   classList.toggle("hide", …),但只有 #stRuleDayLabel 在這一行上:非
   pool_absorbs 的帳戶上標籤留在畫面、底下的選項是空的。這一行漏一個 id 就是
   一個殘標籤,所以 test_web_states.TheHideClassActuallyHides 改成掃全部的
   css/js,不再只掃 add.css。掃出來的第三個是 #stNewWeightLabel(新增成員那一格
   的「權重(0–1,留空則平均)」,集資戶頭上輸入框收了、標籤還在),它從來沒有
   人報過——那正是只掃 add.css 的代價。 */
/* 第四個 — #232:集資資金池的銀行戶頭卡上那一格期初金額整個退場(那個帳本的
   第一筆錢是入金,不是期初),而它的 <label class="f"> 走的是同一個坑。 */
/* `#stRoutingLabel` 是 #243 補進來的(個人記帳收掉結算路由那一組):同一條理由
   逐字成立 —— `label.f` 是 `.f` 加元素選擇器,特異度贏過單一 class 的 `.hide`。 */
/* 第六個 — #256:個人記帳再收掉目標水位那一組(它只有水位計畫一個讀者,而單人
   帳本發不出一條結算指令),同一條理由第六次逐字成立。 */
#stRuleDayLabel.hide, #stCloseLabel.hide, #stRoutingLabel.hide,
#stNewWeightLabel.hide, #stBankOpeningLabel.hide,
#stTargetLabel.hide { display: none; }

/* 帳戶名底下那張選單:三列入口 — #231(使用者裁示 2026-08-23:「在點擊這些的時候
   我希望他都跳在一個完整的頁上,左上角有返回的那種」)。

   ⚠️ **這一組取代了 F45 的 `h3.fold` / `.cardfold`。** 那一套是「卡片標題本身就是
   收合的切換鈕」(帳本設定、成員管理、結算指令三張共用),而三張卡在這一票變成
   三個子頁 —— 沒有東西要收合了,所以那三條規則跟著它們的 `aria-expanded` 一起
   退役,不是留著沒人用。字級、字重與 `.fold-s` 那一格原封搬過來:入口列在畫面上
   本來就該跟它取代的那顆標題一樣重。

   **caret 從 `▸` 換成 `›` 而且不再轉向**:轉 90° 講的是「這一塊要攤開了」,而這
   一列講的是「走進另一頁」——同一個記號兩種意思,人會以為按下去只是展開。
   #367(D-H6)把那句話升成全站規則,而且兩個記號改用同一段 path(`web/icons/
   chevron.js`,轉向規則在 style.css 的 `.cv`)—— 這一行的 `font-size` 因此從 17px
   降到 13px:同一個數字,一個是字元的字級、一個是那顆 svg 的邊長。

   一張卡裝三列而不是三張卡:三列合起來才是一張選單,而分成三張卡的話它們之間的
   間距會跟旁邊那幾張獨立的卡(邀請、銀行戶頭)一樣大,讀起來就不是一組。 */
.mg-menu { padding: 2px 18px; }
.mg-entry {
  font: inherit; font-size: 1.125rem; font-weight: 640; letter-spacing: -.015em;
  color: inherit; cursor: pointer; text-align: left;
  display: flex; align-items: baseline; gap: 8px; width: 100%;
  background: none; border: 0; padding: 16px 0;
}
.mg-entry .fold-s { flex: 1; font-size: 0.8125rem; font-weight: 400; color: var(--dim); }
.mg-entry .caret { margin-left: auto; flex: none; font-size: 0.8125rem; color: var(--dim); }
.mg-entry .fold-s + .caret { margin-left: 0; }
/* 列與列之間一條線,第一列上面沒有。**第二條規則不是潔癖**:非管理者看不到
   「帳本設定」那一列(me-pool.js 的 OWNER_ONLY 對 `#mgPoolEntry` 切 `.hide`),
   而 `display: none` 的元素在 DOM 上仍然是它下一個的相鄰兄弟 —— 少了它,那些人
   會在選單最上面看到一條沒有東西在它上面的橫線。 */
.mg-menu > div + div .mg-entry { border-top: 1px solid var(--line); }
.mg-menu > div.hide + div .mg-entry { border-top: 0; }

/* 關帳與危險區自成一段 — #256(UI 評審 #244)。前面幾列講的是這個帳本平常怎麼
   運作,這兩列講的是結束它:關帳之後只剩登記匯款與解散,解散一去不回。一段留白
   加一條分段線,讓「往下捲到底」不再等於「順手點到最後一列」。

   **分段線畫在 `.mg-break` 這個容器上,而列與列之間那條照舊畫在 `.mg-entry` 上**
   ——同一條線畫兩次的話,分段處會出現兩條間隔 10px 的橫線。所以底下那一行把該列
   自己的 border 收掉。

   `#mgDangerEntry` 的紅字與 `.dz` 那張卡的紅框同一個 `--danger`(#392 之前兩者
   共用 `--warn`,而那與「差額還掛著」是同一個顏色):選單上那一列與它
   點進去的那一頁講的是同一件事,顏色不該只有其中一邊說得出來。

   **兩列都掛 `.mg-break`,而線只畫一次。** 掛在第一列上就好的寫法會在關帳那一列
   收起來時把分段線一起收掉(它只有有公積金的那種帳本才有 —— close.js 對其餘每一
   種 `classList.add("hide")`),而危險區那一列每一種帳本都在。所以兩列都掛,再由
   底下那一組把「前面已經有一列看得見的 `.mg-break`」的那一列退回成普通的一列。 */
.mg-menu > div.mg-break {
  margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--line);
}
.mg-menu > div.mg-break .mg-entry { border-top: 0; }
.mg-menu > div.mg-break:not(.hide) ~ div.mg-break {
  margin-top: 0; padding-top: 0; border-top: 0;
}
.mg-menu > div.mg-break:not(.hide) ~ div.mg-break .mg-entry {
  border-top: 1px solid var(--line);
}
#mgDangerEntry .mg-entry { color: var(--danger); }

/* ⚠️ **`.mg-title` 也在 #346 收掉了** — D-F85 ②:它畫的是子頁卡片裡那一行頁內
   標題,而那一行與標題列上的字逐字相同(「帳本設定」「成員管理」「結算指令 ·
   淨部位與帳齡」「跨帳本合計」「週期記帳」…),一頁一個標題現在就是標題列那一個。
   頁**裡面**的分段標題不受影響(結算那一頁的 `<h3 id="planTitle">結算指令</h3>`、
   系統設定的「外觀」`.label`):它們講的是頁裡的一段,不是這一頁叫什麼。 */

/* 邀請卡:那句說明可以折行,鈕上的四個字不行(同 .mrow .seg button)。 */
#stInviteRow .ghost { flex: none; white-space: nowrap; }

/* CP13:「這三種帳本差在哪裡」的摺疊說明,兩個入口(me-list.js 建帳戶表單、
   me-pool.js 帳本種類唯讀顯示旁)共用同一組樣式。慣例同 .cardfold 的 caret 轉向,
   但字級輕一點 —— 這是欄位旁的補充說明,不是卡片標題。

   ⚠️ **轉向那一條在 #367(D-H6)搬去 style.css 了**:記號現在是一顆 svg
   (`web/icons/chevron.js`),而轉的是它 —— 這一層也轉的話就是 180°。 */
.ledger-fold {
  margin-top: 10px; display: inline-flex; align-items: center; gap: 6px;
  font-size: 0.8125rem;
}
.ledger-fold .caret { font-size: 0.6875rem; color: var(--dim); }
.ledger-body { margin-top: 8px; }
.ledger-kind { margin-top: 10px; }
.ledger-kind:first-child { margin-top: 0; }
.ledger-kind b { font-weight: 600; }
.ledger-kind p { margin: 2px 0 0; }

/* F17:銀行戶頭卡的「現況」那一段,和它下面的綁定表單之間留一條呼吸的距離。 */
.mg-bank-cur { margin-top: 2px; }
#mgBankNow { margin-top: 6px; }
#mgBankForm { margin-top: 14px; }

.stnote { margin-top: 8px; font-size: 0.8125rem; }
.stmsg { margin-top: 10px; font-size: 0.8125rem; color: var(--dim); }

/* 邀請碼與退出結清是按了才有東西的區塊,沒內容時不占版面。

   **.stbox 從一行變成一疊 — #200。** 它只有 #stInvite 一個用戶,而那一格現在裝
   的是四件事(碼、整條連結、動作鈕、說明),橫著排在 390 寬上連結那一格會被擠成
   一條縫。`align-items: stretch`(flex column 的預設)讓連結那個 input 佔滿整列。

   ⚠️ **「只有一個用戶」在 #234 之後是兩個**:成員管理子頁自己也有一格
   (`#stMembersInvite`),因為 #231 之後 `#stInvite` 是蓋在底下的。上面那一句
   要說的事沒有變 —— 這一組規則是**那個框**的樣子,而框只有一份實作
   (me-invite.js 的 showInvite),所以兩格共用它、不必各自再寫一組。 */
.stbox { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; font-size: 0.8125rem; }
/* 連結是拿來看、拿來選的,不是拿來打字的:字級跟著小字走,寬度佔滿那一疊。 */
.inv-link { font-size: 0.75rem; padding: 8px 10px; }
.inv-acts { display: flex; gap: 8px; }
.inv-note { font-size: 0.75rem; }
/* 成員管理子頁那一格捲進畫面時,底下要留得下那條固定的導覽列 — #234。

   `scroll-margin-bottom` 是 `scrollIntoView()` 的落點補償(同 #225 的
   `#bankSubmit`,那一條的量測寫在 home.css)。**390 實測**(390×844,五位成員,
   按最後一列的「邀請碼」):沒有這一條時那一格停在 `[35, 687, 320, 157]` —— 下緣
   844 正好是視窗底,而 `nav` 是 `position: fixed` 的 `[0, 776, 390, 68]`
   (z-index 22),所以「複製連結 / 分享」那一列整個壓在導覽列底下,`elementFromPoint`
   在複製鈕上回的是 `NAV`。這一票修的就是「按了什麼都不會發生」,再讓它的兩顆鈕
   落在同一個坑裡等於只修了一半。

   **不補 `.fab` 的 84px**(那是 `#bankSubmit` 多的那一段):浮動的「記一筆」只
   站在三個分頁上,子畫面蓋著時 nav.js 的 paint() 把它收起來(`FAB_PANES`),這
   一格底下沒有第二層浮的東西。12 是呼吸,同那一條的末尾。 */
#stMembersInvite { scroll-margin-bottom: calc(var(--navh, 68px) + 12px); }

.stpanel { margin-top: 10px; padding: 12px 14px; background: var(--chip); border-radius: var(--radius-m); font-size: 0.8125rem; }
.stpanel > div { margin-bottom: 4px; }
.stpanel button { margin-top: 6px; }
.stbox:empty, .stpanel:empty { display: none; }

/* Batch 6a 之前的全部帳戶清單。舊標記還在別處被引用時仍然靠這幾條規則。 */
.pool { display: block; padding: 14px 0; border-bottom: 1px solid var(--line); text-decoration: none; color: inherit; cursor: pointer; }
.pool:last-child { border-bottom: 0; }
.pool[aria-current="true"] b::after { content: " ·現在"; color: var(--accent); font-weight: 450; font-size: 0.75rem; }

/* #34:清單上的已解散標記。

   **選擇器要跟上面那條一樣長,而那不是潔癖** — #211 實測(Chrome headless、
   `.wrap` 壓到 390 寬,量的是 `getComputedStyle` 與 `getBoundingClientRect`):
   這顆膠囊是 `.id` 的直接子 span,所以 `.mine-row .id > span { display: block }`
   (特異度 0,2,1)照樣打到它,而原本的 `.mine-dead`(0,1,0)贏不過 —— 量到的是
   `display: block`、寬 359px 佔滿整個 `.id`、y 比帳戶名字低 20px,font-size 也被
   那條的 12px 蓋掉(11px 沒生效)。畫面上的樣子是「帳戶名字底下一條圓角橫槓」,
   而它本來要貼在名字右邊。修法是把選擇器補到 0,3,1 贏得了,不是 `!important`
   (特異度前科見 HANDOFF §1)。`.mine-dead` 只出現在這一處(me-list.js 的
   dissolved 那一列),所以加長選擇器不會漏掉別的用法。 */
.mine-row .id > span.mine-dead {
  display: inline-block;
  font-size: 0.6875rem; border: 1px solid var(--line); border-radius: var(--radius-pill);
  padding: 1px 7px; color: var(--dim);
}

/* 身份小字與帳戶型態並排在同一行上 — #222(票的原話「身份小字旁」)。**選擇器
   要跟上面那兩條一樣長,理由逐字相同**:兩個都是 `.id` 的直接子 span,而
   `.mine-row .id > span { display: block }`(0,2,1)會讓它們各佔一整行,
   `.mine-kind`(0,1,0)贏不過。前面那句(要匯 / 溢繳 / 權益)仍然是 block,所以
   這一對自己成為第三行,不會被它接到後面去。 */
.mine-row .id > span.mine-role,
.mine-row .id > span.mine-kind { display: inline-block; }
.mine-row .id > span.mine-kind { margin-left: 6px; }

/* F7:出資比例(只在 pool_absorbs 池出現)。跟 .mfields 分開一行,不擠進
   名字/末四碼/權重那三欄,免得那排本來就緊的欄寬再被擠壓。 */
.mcontrib { margin-top: 4px; align-items: center; }
.mc-in { display: flex; align-items: center; gap: 6px; }
.mc-in input { width: 78px; text-align: right; padding: 6px 8px; }
.mc-in .ghost { padding: 4px 8px; font-size: 0.75rem; }

#stContribBlock { margin-bottom: 10px; }
#stContribBlock button { margin-top: 6px; }

/* 集資戶頭:權重欄的位置換成唯讀的持份 — CP6、§6-D。
   同一個版位、同一個寬度,只是那一格不再是輸入。 */
.mnum.mshare { font-size: 0.75rem; color: var(--dim); gap: 4px; }
.mnum.mshare b { color: var(--ink); font-size: 0.8125rem; }

/* 結算凍結卡 — CP15、me-capital.js。形狀刻意貼著關帳卡(close.css 的 .cz*):
   同一種生命週期事件、同一種兩段確認,使用者不必分兩套讀法。 */
.cp-note { margin-top: 6px; line-height: 1.55; }
.cp-facts { margin: 10px 0; border: 1px solid var(--line); border-radius: var(--radius-s); padding: 8px 10px; }
.cp-facts div { display: flex; justify-content: space-between; gap: 10px; padding: 3px 0; font-size: 0.8125rem; }
.cp-facts span { color: var(--dim); }
.cp-act { display: flex; gap: 8px; justify-content: flex-end; margin-top: 10px; }
.cp-go { flex: 0 0 auto; }
.cp-block { margin-top: 8px; color: var(--warn); font-size: 0.8125rem; line-height: 1.5; }
.cp-ok { margin-top: 8px; color: var(--accent); font-size: 0.8125rem; line-height: 1.5; }