/* 客戶管理中心。左欄入口＋客戶列表、右欄客戶詳情。跟 token，唔用 emoji。 */
.cc-wrap{display:grid;grid-template-columns:312px minmax(0,1fr);gap:var(--sp-4);align-items:start}
.cc-side{display:flex;flex-direction:column;gap:var(--sp-3);position:sticky;top:0;max-height:calc(100vh - var(--topbar-h) - 24px);min-height:0}
.cc-main{min-width:0;display:flex;flex-direction:column;gap:var(--sp-4)}
@media (max-width:1000px){.cc-wrap{grid-template-columns:minmax(0,1fr)}.cc-side{position:static;max-height:none}}

.cc-drop{border:1.5px dashed var(--line);border-radius:var(--r-md);background:var(--card);padding:var(--sp-4) var(--sp-3h);text-align:center;cursor:pointer;transition:border-color .15s,background .15s}
.cc-drop:hover,.cc-drop.over{border-color:var(--brand-green-deep);background:var(--ok-soft)}
.cc-drop .t{font-size:var(--fs-md);font-weight:700}
.cc-drop .s{font-size:var(--fs-xs);color:var(--muted);margin-top:var(--sp-1)}
.cc-drop .h{font-size:var(--fs-2xs);color:var(--faint);margin-top:var(--sp-1h)}
.cc-drop.big{padding:var(--sp-7) var(--sp-5);border-radius:var(--r-lg)}
.cc-drop.big .t{font-size:var(--fs-xl)}.cc-drop.big .s{font-size:var(--fs-sm);margin-top:var(--sp-2)}
.cc-drop.big .h{font-size:var(--fs-xs);margin-top:var(--sp-3h);line-height:1.9}

/* 篩選區：搜尋 → 篩選掣＋排序 → 生效中嘅標籤 → 展開嘅篩選面板。
   舊版五個下拉逼喺一行度自動斷行，窄欄位下好難撳。 */
.cc-filt{display:flex;flex-direction:column;gap:var(--sp-2)}
.cc-sbox{position:relative;display:flex;align-items:center}
.cc-sbox .i{position:absolute;left:10px;width:14px;height:14px;stroke:var(--muted);fill:none;stroke-width:2;stroke-linecap:round;pointer-events:none}
.cc-sbox input[type=search]{width:100%;border:1px solid var(--line);background:var(--card);border-radius:var(--r-sm);height:36px;padding:0 30px 0 30px;font-size:var(--fs-sm)}
.cc-sbox input[type=search]::-webkit-search-cancel-button{display:none}
.cc-sbox input:focus{border-color:var(--brand-green-deep);outline:none;box-shadow:0 0 0 3px var(--focus)}
.cc-sbox .x{position:absolute;right:6px;width:22px;height:22px;border:0;border-radius:50%;background:var(--line2);color:var(--ink2);font-size:var(--fs-md);line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
.cc-sbox .x:hover{background:var(--muted);color:#fff}
.cc-fbar{display:flex;align-items:center;gap:var(--sp-2)}
.cc-fbar .fbtn{display:inline-flex;align-items:center;gap:var(--sp-1h);border:1px solid var(--line);background:var(--card);border-radius:var(--r-sm);height:30px;padding:0 var(--sp-2h);font-size:var(--fs-xs);font-weight:500;color:var(--ink2);cursor:pointer;white-space:nowrap}
.cc-fbar .fbtn:hover{border-color:var(--brand-green-deep)}
.cc-fbar .fbtn.on{border-color:var(--brand-green-deep);color:var(--brand-green-deep)}
.cc-fbar .fbtn i{font-style:normal;background:var(--brand-green-deep);color:#fff;border-radius:var(--r-md);min-width:16px;height:16px;font-size:var(--fs-3xs);display:inline-flex;align-items:center;justify-content:center;padding:0 var(--sp-1)}
.cc-fbar .sortsel{flex:1;min-width:0;border:1px solid var(--line);background:var(--card);border-radius:var(--r-sm);height:30px;padding:0 var(--sp-1h);font-size:var(--fs-xs);color:var(--ink2)}
.cc-fbar .cnt{font-size:var(--fs-2xs);color:var(--muted);font-family:var(--mono);white-space:nowrap}
.cc-chips{display:flex;flex-wrap:wrap;gap:var(--sp-1h)}
.cc-chips .chip{display:inline-flex;align-items:center;gap:var(--sp-1h);border:1px solid var(--brand-green-deep);background:rgba(0,112,60,.08);color:var(--brand-green-deep);border-radius:var(--r-pill);padding:3px var(--sp-2);font-size:var(--fs-2xs);cursor:pointer;max-width:100%}
.cc-chips .chip b{font-weight:500;opacity:.65}
.cc-chips .chip i{font-style:normal;font-size:var(--fs-sm);line-height:1;opacity:.7}
.cc-chips .chip:hover{background:rgba(0,112,60,.16)}
.cc-chips .chip.all{border-color:var(--line);background:transparent;color:var(--muted)}
.cc-fpanel{display:flex;flex-direction:column;gap:var(--sp-1h);padding:var(--sp-2h);border:1px solid var(--line);border-radius:var(--r-sm);background:var(--card2)}
.cc-fpanel.hidden{display:none}
.cc-fpanel .frow{display:flex;align-items:center;gap:var(--sp-2)}
.cc-fpanel .frow>span{flex:none;width:62px;font-size:var(--fs-2xs);color:var(--muted)}
.cc-fpanel .frow select{flex:1;min-width:0;border:1px solid var(--line);background:var(--card);border-radius:var(--r-sm);height:30px;padding:0 6px;font-size:var(--fs-xs)}
.cc-fpanel .frow.set>span{color:var(--brand-green-deep);font-weight:500}
.cc-fpanel .frow.set select{border-color:var(--brand-green-deep);color:var(--brand-green-deep)}
.cc-rows{flex:1;min-height:120px;overflow-y:auto;border:1px solid var(--line);border-radius:var(--r-md);background:var(--card)}
.cc-row{display:block;position:relative;padding:var(--sp-2h) var(--sp-6) var(--sp-2h) var(--sp-3);border-bottom:1px solid var(--line2);cursor:pointer}
.cc-row:last-child{border-bottom:0}
.cc-row:hover{background:var(--card2)}
.cc-row.on{background:var(--accent-soft)}
.cc-row .nm{font-size:var(--fs-sm);font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cc-row .sub{font-size:var(--fs-2xs);color:var(--muted);margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cc-row .del{position:absolute;right:6px;top:50%;transform:translateY(-50%);border:0;background:none;color:var(--faint);font-size:var(--fs-lg);line-height:1;cursor:pointer;padding:2px var(--sp-1h);border-radius:var(--r-sm)}
.cc-row .del:hover{color:var(--bad);background:var(--bad-soft)}
.cc-empty{padding:var(--sp-6) var(--sp-4);text-align:center;color:var(--muted);font-size:var(--fs-sm);line-height:1.9}
.cc-empty span{font-size:var(--fs-xs);color:var(--faint)}
.cc-empty2{padding:var(--sp-5);text-align:center;color:var(--muted);font-size:var(--fs-xs)}
.cc-err{padding:var(--sp-5);text-align:center;color:var(--bad)}

.cc-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);box-shadow:var(--shadow);padding:var(--sp-4) var(--sp-4)}
.cc-card>h3{font-size:var(--fs-md);display:flex;align-items:center;gap:var(--sp-2h);flex-wrap:wrap;margin-bottom:var(--sp-2h)}
.cc-card>h3 .c{font-size:var(--fs-2xs);font-weight:400;color:var(--muted)}
.cc-head{background:var(--primary);color:var(--primary-ink);border-radius:var(--r-lg);padding:var(--sp-5) var(--sp-6);display:flex;align-items:center;gap:var(--sp-4);flex-wrap:wrap}
.cc-head h2{font-size:var(--fs-xl);line-height:1.25}
.cc-head p{margin:var(--sp-1) 0 0;font-size:var(--fs-xs);opacity:.82}

.cc-dash{display:grid;grid-template-columns:repeat(auto-fit,minmax(172px,1fr));gap:var(--sp-2h)}
.cc-stat{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);padding:var(--sp-3) var(--sp-3h);cursor:pointer;transition:border-color .15s}
.cc-stat:hover{border-color:var(--brand-green-deep)}
.cc-stat.open{border-color:var(--brand-green-deep);background:var(--ok-soft)}
.cc-stat.warn{border-left:3px solid var(--warn)}
.cc-stat .l{font-size:var(--fs-2xs);color:var(--muted);white-space:nowrap}
.cc-stat .v{font-family:var(--mono);font-size:var(--fs-xl);font-weight:500;font-variant-numeric:tabular-nums;margin-top:2px;white-space:nowrap}
.cc-stat .s{font-size:var(--fs-2xs);color:var(--muted);margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cc-drill{background:var(--card);border:1px solid var(--brand-green-deep);border-radius:var(--r-md);overflow:hidden}
.cc-drill .dh{background:var(--ok-soft);padding:var(--sp-2h) var(--sp-3h);font-size:var(--fs-sm);font-weight:700;display:flex;align-items:center;gap:var(--sp-1h)}
.cc-drill .dh span{font-weight:400;font-size:var(--fs-2xs);color:var(--muted)}
.cc-drill .dh .x{margin-left:auto;border:1px solid var(--line);background:var(--card);border-radius:var(--r-sm);font-size:var(--fs-2xs);padding:3px var(--sp-2h);cursor:pointer}
.cc-lap{background:var(--bad-soft);color:var(--bad);border-radius:var(--r-sm);padding:var(--sp-2h) var(--sp-3h);font-size:var(--fs-xs);line-height:1.75}

/* 09-12 方案 B：保單檢視＋保障覆蓋合併成「保障缺口」一格；按類別嗰段用小標題分隔 */
.cc-covbody{margin-top:var(--sp-3)}
.cc-covsum{font-size:var(--fs-sm);font-weight:600;display:flex;align-items:center;gap:var(--sp-2h);margin-bottom:var(--sp-1h)}
.cc-covsum .c{font-size:var(--fs-2xs);font-weight:400;color:var(--muted)}
.cc-cov .row{display:flex;gap:var(--sp-3);align-items:flex-start;padding:var(--sp-2) 0;border-top:1px solid var(--line2)}
.cc-cov .row .lb{flex:none;width:96px;font-size:var(--fs-xs);color:var(--muted);padding-top:var(--sp-1h)}
.cc-cov .row .lb b{color:var(--ink);font-family:var(--mono)}
.cc-cov .bar{display:flex;gap:var(--sp-1h);flex-wrap:wrap;flex:1;min-width:0}
.cc-cov .bar .none{font-size:var(--fs-xs);color:var(--faint);padding-top:var(--sp-1h)}
.cc-cvt{border:1px solid var(--line);background:var(--card);border-radius:var(--r-sm);padding:var(--sp-1h) var(--sp-2h);cursor:pointer;text-align:left;min-width:88px}
.cc-cvt:hover{border-color:var(--brand-green-deep)}
.cc-cvt.on{border-color:var(--brand-green-deep);background:var(--ok-soft)}
.cc-cvt.gap{border-style:dashed;background:var(--warn-soft)}
.cc-cvt.gap.on{border-color:var(--warn)}
.cc-cvt .n{display:block;font-size:var(--fs-xs);font-weight:700}
.cc-cvt .s{display:block;font-size:var(--fs-3xs);color:var(--muted);margin-top:1px;white-space:nowrap}
.cc-cvpanel{margin-top:var(--sp-2h);border:1px solid var(--line);border-radius:var(--r-sm);overflow:hidden}
.cc-cvpanel .hd{background:var(--card2);padding:var(--sp-2) var(--sp-3);font-size:var(--fs-xs);font-weight:700;display:flex;align-items:center;gap:var(--sp-1h)}
.cc-cvpanel .hd span{font-weight:400;color:var(--muted)}
.cc-cvpanel .hd .x{margin-left:auto;border:1px solid var(--line);background:var(--card);border-radius:var(--r-sm);font-size:var(--fs-2xs);padding:3px var(--sp-2h);cursor:pointer}
.cc-cvpanel.gap .hd{background:var(--warn-soft);color:var(--warn)}

.cc-ptbl tr.pg{cursor:pointer;background:var(--card2)}
.cc-ptbl tr.pg:hover{background:var(--accent-soft)}
.cc-ptbl tr.pg td{font-size:var(--fs-xs);padding:var(--sp-2) var(--sp-3)}
.cc-ptbl tr.pg .cr{color:var(--muted);margin-right:var(--sp-1h);font-size:var(--fs-3xs)}
.cc-ptbl tr.pg .pn{color:var(--muted);font-size:var(--fs-2xs);margin-left:var(--sp-2h)}
.cc-ptbl tr.pg .cnt{color:var(--muted);font-size:var(--fs-2xs);margin-left:var(--sp-2h)}
.cc-ptbl tr.pg .sm{float:right;color:var(--muted);font-size:var(--fs-2xs)}
.cc-ptbl tr.pg .pill{margin-left:var(--sp-2h)}
.cc-ptbl tr.pr td{font-size:var(--fs-xs)}
.cc-ptbl tr.pr .nm{padding-left:var(--sp-5)}
/* 09-12 對比度根治（用戶兩次指正「太淺色」）：shell.css 有個通用 .flat{color:muted}，而保單一覽主行就係 tr.pr.flat → 成行變灰。
   呢度全部明寫：主文字 ink、次要 ink2、計劃名粗體、數字 ink。 */
.cc-ptbl tr.pr,.cc-ptbl tr.pr.flat{color:var(--ink)}
.cc-ptbl tr.pr td{color:var(--ink);font-size:var(--fs-sm)}
.cc-ptbl .nm{font-weight:600}
.cc-ptbl .nm .en{display:block;font-size:var(--fs-2xs);color:var(--ink2);font-weight:400}
.cc-ptbl td.dim,.cc-ptbl td.dim.mono{color:var(--ink2)}
.cc-ptbl td.num{color:var(--ink);font-weight:500}
.tbl td.cv .sub{color:var(--ink2)}
.cc-ptbl tr.pr.sub td{background:var(--bg2);color:var(--ink)}
.cc-ptbl tr.pr.lap td{opacity:.8}
.cc-ptbl .prdel{color:var(--ink2)}
.cc-ptbl .pmq{font-size:var(--fs-3xs);background:var(--neutral-soft);color:var(--muted);border-radius:var(--r-xs);padding:1px var(--sp-1)}
/* 09-12 用戶：淺灰太多、對比度不足 —— 次要文字用 ink2（唔用 muted／faint） */
/* 09-16 終審 🟡：clients.css 而家亦喺理財需要分析頁載（手動保單表格共用殼），呢條 bare .tbl 會蓋過 needs2.css 嘅 .q2-histtbl td.dim → 收窄到客戶頁 */
body[data-page="clients"] .tbl td.dim,body[data-page="clients"] .tbl th.dim{color:var(--ink2);font-size:var(--fs-xs)}

.cc-det>summary{font-size:var(--fs-md);font-weight:700;cursor:pointer;list-style:none;display:flex;align-items:center;gap:var(--sp-2h)}
.cc-det>summary::-webkit-details-marker{display:none}
.cc-det>summary::after{content:"▾";margin-left:auto;font-size:var(--fs-2xs);color:var(--muted)}
.cc-det[open]>summary::after{content:"▴"}
.cc-det>summary .c{font-size:var(--fs-2xs);font-weight:400;color:var(--muted)}
.cc-list{margin-top:var(--sp-2h);display:flex;flex-direction:column}
.cc-drow{padding:var(--sp-2) 0;border-bottom:1px solid var(--line2);font-size:var(--fs-xs)}
.cc-drow:last-child{border-bottom:0}
.cc-drow s{display:block;text-decoration:none;font-size:var(--fs-2xs);color:var(--muted);margin-top:2px;word-break:break-all}
.cc-notes{margin-top:var(--sp-2h);display:flex;flex-direction:column;gap:var(--sp-2)}
.cc-notes textarea{border:1px solid var(--line);border-radius:var(--r-sm);padding:9px 11px;font-size:var(--fs-sm);min-height:88px;font-family:var(--sans);resize:vertical}
.cc-notes .btn{align-self:flex-start}

.cc-busy{position:fixed;left:50%;bottom:26px;transform:translateX(-50%);background:var(--ink);color:var(--bg);padding:var(--sp-2h) var(--sp-4);border-radius:var(--r-pill);font-size:var(--fs-sm);box-shadow:var(--shadow);z-index:60;opacity:0;pointer-events:none;transition:opacity .2s;max-width:80vw;text-align:center}
.cc-busy.on{opacity:1}

/* 匯入結果報告（幾百份文件之後要交代清楚） */
.cc-report .rp-chips{display:flex;gap:var(--sp-2);flex-wrap:wrap;margin-bottom:var(--sp-4)}
.rp-sec{border-top:1px solid var(--line2);padding-top:var(--sp-3);margin-top:var(--sp-3)}
.rp-sec>h4{font-size:var(--fs-xs);font-weight:700;color:var(--ink2);margin-bottom:var(--sp-2)}
/* 名單自動跟顯示闊度分欄：闊芒幾多欄就幾多欄，窄芒自動跌返一欄 */
.rp-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));column-gap:var(--sp-5);max-height:280px;overflow:auto}
.rp-list.one-col{grid-template-columns:1fr}
.rp-row{display:flex;align-items:baseline;gap:var(--sp-2h);padding:var(--sp-1h) 0;border-bottom:1px solid var(--line2);font-size:var(--fs-xs);min-width:0}
.rp-row b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rp-row b{font-weight:700}
.rp-row .n{font-family:var(--mono);font-size:var(--fs-2xs);color:var(--muted);white-space:nowrap}
.rp-row s{text-decoration:none;color:var(--warn);font-size:var(--fs-2xs);margin-left:auto;text-align:right}
.rp-note{font-size:var(--fs-2xs);color:var(--muted);line-height:1.8;margin:var(--sp-3h) 0 0;padding-top:var(--sp-2h);border-top:1px solid var(--line2)}

/* 篩選列 */
/* 列表行 */
.cc-row .nm{display:flex;align-items:center;gap:var(--sp-1h)}
.cc-row .dot{width:7px;height:7px;border-radius:50%;flex:none;background:transparent}
.cc-row .dot.lapsed{background:var(--bad)}.cc-row .dot.grace{background:var(--warn)}
.cc-row .dot.nodoc{background:var(--faint)}.cc-row .dot.due{background:var(--warn)}
.cc-row .urg{margin-left:auto;font-size:var(--fs-3xs);font-weight:700;padding:1px var(--sp-1h);border-radius:var(--r-pill);white-space:nowrap}
.cc-row .urg.lapsed{background:var(--bad);color:#fff}
.cc-row .urg.grace{background:var(--warn-soft);color:var(--warn)}
.cc-row .dbtn{border:0;background:var(--neutral-soft);color:var(--ink2);border-radius:var(--r-xs);font-size:var(--fs-3xs);padding:0 var(--sp-1h);cursor:pointer}
.cc-row .dbtn:hover{background:var(--accent-soft)}
.cc-row .roles{display:flex;gap:var(--sp-1);margin-top:3px}
.cc-row .role{font-size:var(--fs-3xs);font-weight:700;padding:1px var(--sp-1h);border-radius:var(--r-pill);background:var(--ok-soft);color:var(--ok)}
.cc-row .role.own{background:var(--info-soft);color:var(--info)}
/* 頭部：貨幣切換同匯出 */
.cc-head{position:relative}
.cc-csw{margin-left:auto;display:inline-flex;background:rgba(255,255,255,.14);border-radius:var(--r-sm);padding:2px;gap:2px}
.cc-csw button{border:0;background:transparent;color:var(--primary-ink);border-radius:var(--r-sm);padding:var(--sp-1h) var(--sp-2h);font-size:var(--fs-xs);font-weight:700;cursor:pointer;opacity:.72}
.cc-csw button.on{background:var(--primary-ink);color:var(--primary);opacity:1}
.cc-exp{border:1px solid rgba(255,255,255,.3);background:none;color:var(--primary-ink);border-radius:var(--r-sm);padding:var(--sp-1h) var(--sp-3);font-size:var(--fs-xs);cursor:pointer}
.cc-exp:hover{background:rgba(255,255,255,.12)}
/* 09-14：hero 兩粒主動作（理財需要分析／醫療儲備計算）用金色實心，同其餘工具掣分開 */
.cc-exp.pri{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:700}
.cc-exp.pri:hover{background:var(--brand-gold-deep);border-color:var(--brand-gold-deep)}
/* 保單全部資料 */
.fgs{margin-top:var(--sp-2h);display:flex;flex-direction:column;gap:var(--sp-3h)}
.fg>h4{font-size:var(--fs-xs);font-weight:700;color:var(--ink2);padding-bottom:var(--sp-1h);border-bottom:1px solid var(--line2);margin-bottom:var(--sp-1)}
.fr{display:flex;align-items:baseline;gap:var(--sp-2h);padding:var(--sp-1h) 0;font-size:var(--fs-xs);border-bottom:1px solid var(--line2)}
.fr:last-child{border-bottom:0}
.fl{flex:none;width:120px;color:var(--muted)}
.fv{flex:1;min-width:0;word-break:break-word}
.fv.na{color:var(--faint)}
.src{flex:none;font-size:var(--fs-3xs);padding:1px var(--sp-1h);border-radius:var(--r-xs);white-space:nowrap}
.src.s-doc{background:var(--ok-soft);color:var(--ok)}
.src.s-todo{background:var(--warn-soft);color:var(--warn)}
/* 計劃明細 */
.pd{margin-top:var(--sp-2h)}
.pd-row{display:flex;align-items:baseline;gap:var(--sp-3);padding:var(--sp-1h) 0;border-bottom:1px solid var(--line2);font-size:var(--fs-xs)}
.pd-row:last-child{border-bottom:0}
.pd-row s{display:block;text-decoration:none;font-size:var(--fs-2xs);color:var(--muted);margin-top:2px}
.pd-row .v{margin-left:auto;font-family:var(--mono);white-space:nowrap}
.pd-row.tot{border-top:1px solid var(--line);font-weight:700}
/* ILAS */
.fu{margin-top:var(--sp-2h)}
.fu-h{display:flex;font-size:var(--fs-2xs);font-weight:700;color:var(--ink2);background:var(--card2);padding:var(--sp-1h) var(--sp-2h);border-radius:var(--r-sm);margin:var(--sp-2) 0 var(--sp-1)}
.fu-h span{margin-left:auto;font-family:var(--mono);font-weight:500}
/* 09-12 圖像化投資組合：四格數 ＋ 比重色條 ＋ 精簡表 */
.cc-invtiles{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-2);margin:var(--sp-2) 0 var(--sp-2h)}
.cc-invtiles .t{background:var(--card2);border:1px solid var(--line2);border-radius:var(--r-sm);padding:var(--sp-2) var(--sp-2h);display:flex;flex-direction:column;gap:2px;min-width:0}
.cc-invtiles .t .l{font-size:var(--fs-2xs);color:var(--ink2)}
.cc-invtiles .t .l i{font-style:normal;color:var(--muted);font-family:var(--mono)}
.cc-invtiles .t b{font-family:var(--mono);font-size:var(--fs-md);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cc-invtiles .t em{font-style:normal;font-family:var(--mono);font-size:var(--fs-xs)}
.cc-invtiles .t em.up,.fu-tbl em.up{color:var(--ok)}
.cc-invtiles .t em.down,.fu-tbl em.down{color:var(--bad)}
.cc-invtiles .t.divy b,.cc-invtiles .t.divs b{color:var(--ok)}
.fu-bar{display:flex;height:10px;border-radius:5px;overflow:hidden;background:var(--line2);margin:var(--sp-1) 0 var(--sp-2)}
.fu-bar i{display:block;height:100%}
.fu-tbl td{font-size:var(--fs-xs);vertical-align:middle}
.fu-tbl td.n{min-width:0}
.fu-tbl td.n b{font-weight:600}
.fu-tbl td.n .dot{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.fu-tbl td.n small{margin-left:6px;color:var(--ink2);font-size:var(--fs-2xs)}
.fu-tbl td.n .pill{margin-left:6px}
.fu-tbl td.num{font-family:var(--mono);white-space:nowrap}
.fu-tbl td.price .rp,.fu-tbl td.val .rv{color:var(--muted);display:block;font-size:var(--fs-2xs)}
.fu-tbl td.price .lp,.fu-tbl td.val .lv{display:block}
.fu-tbl td.price .lp em{margin-left:6px;font-size:var(--fs-2xs)}
.fu-tbl td .na{color:var(--muted)}
.fu-tbl td.divc small{display:block;font-size:var(--fs-3xs);color:var(--ok)}
.fu-tbl td.divc b{color:var(--ok)}
@media (max-width:820px){.cc-invtiles{grid-template-columns:repeat(2,1fr)}}
.fu-row{font-size:var(--fs-xs)}
.fu-row:last-child{border-bottom:0}
.fu-row .n{flex:1;min-width:0}
.fu-row .n s{display:block;text-decoration:none;font-size:var(--fs-3xs);color:var(--muted);margin-top:2px}
.fu-row .p,.fu-row .v,.fu-row .g{flex:none;font-family:var(--mono);white-space:nowrap;text-align:right}
.fu-row .p{width:56px;color:var(--muted)}
.fu-row .v{width:132px}
.fu-row .g{width:56px}
.fu-row .g.up{color:var(--ok)}.fu-row .g.down{color:var(--bad)}
.fu-row.tot{font-weight:700;border-top:1px solid var(--line)}
.cc-note2{font-size:var(--fs-2xs);color:var(--muted);line-height:1.8;margin:var(--sp-2) 0 0}
.cc-note2.warn{color:var(--warn)}
/* 待辦 */
.cc-todo{border-left:3px solid var(--warn);font-size:var(--fs-xs);line-height:1.8}
.unk-row{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:wrap;padding:var(--sp-2) 0;border-bottom:1px solid var(--line2)}
.unk-row:last-child{border-bottom:0}
.unk-row b{flex:1;min-width:140px}
.unk-row select{border:1px solid var(--line);border-radius:var(--r-sm);height:30px;padding:0 8px;font-size:var(--fs-xs)}
/* 揀保單 */
/* 09-12 精簡 3：保單一覽就地展開嘅明細行 */
.cc-ptbl tr.pr-det td{padding:0 0 var(--sp-3);background:var(--card2)}
.pr-detbox{padding:var(--sp-3) var(--sp-3h);border-top:2px solid var(--line)}
.pr-detbox .hd{display:flex;align-items:center;gap:var(--sp-2h);flex-wrap:wrap;font-size:var(--fs-xs);color:var(--muted)}
.pr-detbox .hd b{color:var(--ink)}
.pr-detbox .hd .x{margin-left:auto;border:1px solid var(--line);background:var(--card);border-radius:var(--r-sm);font-size:var(--fs-2xs);padding:3px var(--sp-2h);cursor:pointer}
.pr-detbox .cc-det{margin-top:var(--sp-3)}
.rv-tbl tr.rv-tot td{border-top:2px solid var(--line)}
.cc-todo .td-sec{padding:var(--sp-2) 0;border-bottom:1px solid var(--line2)}
.cc-todo .td-sec:last-child{border-bottom:0}
.cc-polbar{display:flex;align-items:center;gap:var(--sp-2h);flex-wrap:wrap;background:var(--card2);border:1px solid var(--line);border-radius:var(--r-sm);padding:var(--sp-2h) var(--sp-3h);font-size:var(--fs-xs);color:var(--muted)}
.cc-polbar b{color:var(--ink)}
.cc-polbar select{border:1px solid var(--line);background:var(--card);border-radius:var(--r-sm);height:30px;padding:0 8px;font-size:var(--fs-xs);max-width:420px}
.cc-polbar .pn{font-size:var(--fs-2xs)}
.cc-polbar .cnt{margin-left:auto;font-family:var(--mono);font-size:var(--fs-2xs)}
.cc-ptbl tr.pr.lap td{opacity:.72}
.cc-ptbl tr.pr td .pill{opacity:1}
.cc-ptbl tr.pr.flat .nm{padding-left:var(--sp-3)}

/* 多選 + 刪除 */
.cc-row{padding-left:var(--sp-6)}
.cc-row.picked{background:var(--info-soft)}
.cc-row .pick{position:absolute;left:9px;top:50%;transform:translateY(-50%);display:flex;padding:var(--sp-1);cursor:pointer}
.cc-row .pick input{width:15px;height:15px;accent-color:var(--brand-green-deep);cursor:pointer}
.cc-pick{display:none}
.cc-pick.on{display:flex;align-items:center;gap:var(--sp-1h);flex-wrap:wrap;background:var(--info-soft);border:1px solid var(--info);border-radius:var(--r-sm);padding:var(--sp-2) var(--sp-2h);font-size:var(--fs-xs)}
.cc-pick .n{color:var(--info);white-space:nowrap}
.cc-pick .n b{font-family:var(--mono)}
.cc-pick .btn{padding:5px 9px;font-size:var(--fs-xs)}
.cc-pick .btn.danger{color:var(--bad);border-color:var(--bad)}
.cc-pick .btn.danger:hover{background:var(--bad);color:#fff}
.cc-trash{border:1px dashed var(--line);background:none;border-radius:var(--r-sm);padding:var(--sp-2);font-size:var(--fs-xs);color:var(--muted);cursor:pointer;flex:none}
.cc-trash:hover{border-color:var(--bad);color:var(--bad)}
/* 保單刪除掣：平時淡，hover 先明顯 —— 唔想成版都係紅色刪除掣 */
.prdel{border:1px solid transparent;background:none;color:var(--faint);border-radius:var(--r-sm);padding:2px var(--sp-1h);font-size:var(--fs-2xs);cursor:pointer;white-space:nowrap}
tr:hover .prdel{color:var(--muted);border-color:var(--line)}
.prdel:hover{color:#fff;background:var(--bad);border-color:var(--bad)}
.cc-ptbl tr.pg .prdel{float:right;margin-left:var(--sp-2h)}
/* 回收桶 */
.tr-sec{border-top:1px solid var(--line2);padding-top:var(--sp-3);margin-top:var(--sp-3)}
.tr-sec>h4{font-size:var(--fs-xs);font-weight:700;color:var(--ink2);margin-bottom:var(--sp-2)}
.tr-row{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-2h) 0;border-bottom:1px solid var(--line2);font-size:var(--fs-xs)}
.tr-row:last-child{border-bottom:0}
.tr-row>div{flex:1;min-width:0}
.tr-row s{display:block;text-decoration:none;font-size:var(--fs-2xs);color:var(--muted);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cc-card>h3 .btn{margin-left:auto;font-size:var(--fs-xs);padding:5px 10px}

/* 全選列（常駐） */
.cc-selall{display:none}
.cc-selall.on{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-1h) var(--sp-2h) var(--sp-1h) var(--sp-2h);border:1px solid var(--line);border-bottom:0;border-radius:var(--r-md) var(--r-md) 0 0;background:var(--card2);font-size:var(--fs-xs)}
.cc-selall label{display:flex;align-items:center;gap:var(--sp-1h);cursor:pointer;color:var(--ink2)}
.cc-selall input{width:15px;height:15px;accent-color:var(--brand-green-deep);cursor:pointer}
.cc-selall .k{margin-left:auto;font-family:var(--mono);font-size:var(--fs-2xs);color:var(--info)}
.cc-selall.on + .cc-rows{border-radius:0 0 var(--r-md) var(--r-md)}

/* 附加保障子列：縮入少少，同基本計劃分開 */
.cc-ptbl tr.pr.sub .nm{padding-left:var(--sp-5)}
.cc-ptbl tr.pr.sub td{background:var(--bg2)}

/* 投資組合 section */
.cc-inv .cc-invhd{display:flex;align-items:baseline;gap:var(--sp-2h);flex-wrap:wrap;margin:var(--sp-3h) 0 2px;padding-top:var(--sp-3);border-top:1px solid var(--line2)}
.cc-inv .cc-invhd:first-of-type{margin-top:var(--sp-2);padding-top:0;border-top:0}
.cc-inv .cc-invhd b{font-size:var(--fs-sm)}
.cc-inv .cc-invhd .pn{font-size:var(--fs-2xs);color:var(--muted)}
.cc-inv .cc-invhd .nf{font-size:var(--fs-2xs);color:var(--muted)}
.cc-inv .cc-invhd .v{margin-left:auto;font-family:var(--mono);font-size:var(--fs-sm);font-weight:700}
.cc-inv details.cc-det{border:0;box-shadow:none;background:transparent;padding:0;margin:var(--sp-1) 0 0}
/* 保單一覽：撳行可以切換下面詳情 */
.cc-ptbl tr.pr[data-pi]{cursor:pointer}
.cc-ptbl tr.pr[data-pi]:hover td{background:var(--neutral-soft)}
/* 揀咗嗰行（展開明細）：成行淡金底，只喺第一格左邊一條線 —— 以前每一格都有條綠線，睇落似一格格隔開（用戶 09-12） */
.cc-ptbl tr.pr.cur td{background:var(--accent-soft)}
.cc-ptbl tr.pr.cur td:first-child{box-shadow:inset 3px 0 0 var(--accent)}
.cc-ptbl tr.pr{cursor:pointer}
/* 保單之間嘅分隔行：一條淡底粗線，唔係另一層資料 */
.cc-ptbl tr.pr-gap td{padding:0;height:10px;background:var(--bg2);border-top:2px solid var(--line);border-bottom:1px solid var(--line)}
.cc-ptbl tr.pr:hover td{background:var(--card2)}
.cc-ptbl tr.pr.cur:hover td{background:var(--accent-soft)}
.cc-inv .cc-invsub{font-size:var(--fs-2xs);color:var(--muted);font-family:var(--mono);margin:2px 0 0}
.cc-inv .cc-invwarn{font-size:var(--fs-2xs);line-height:1.6;color:var(--warn);background:var(--warn-soft);border-radius:var(--r-sm);padding:var(--sp-1h) var(--sp-2h);margin:var(--sp-1h) 0 0}
.cc-inv .cc-invnote{font-size:var(--fs-2xs);line-height:1.6;color:var(--muted);background:var(--bg2);border-radius:var(--r-sm);padding:var(--sp-1h) var(--sp-2h);margin:var(--sp-1h) 0 0}

.cc-back{display:inline-flex;align-items:center;gap:var(--sp-1h);font-size:var(--fs-sm);color:var(--link);margin-bottom:2px}

/* ── 通用彈窗（同 calendar.css .cal-mo 一樣規格）── */
.cc-mo{position:fixed;inset:0;z-index:50;display:none}
.cc-mo.on{display:block}
.cc-mo .scrim{position:absolute;inset:0;background:rgba(20,33,27,.4)}
.cc-mo .box{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(600px,94vw);max-height:88vh;overflow:auto;background:var(--bg);border-radius:var(--r-lg);box-shadow:var(--shadow);padding:var(--sp-5)}
.cc-mo h3{font-size:var(--fs-lg);margin-bottom:var(--sp-3h)}
.cc-mo .f{display:flex;flex-direction:column;gap:var(--sp-1h);margin-bottom:var(--sp-3)}
.cc-mo .f2{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-3)}
.cc-mo label{font-size:var(--fs-xs);color:var(--muted)}
.cc-mo input,.cc-mo select,.cc-mo textarea{border:1px solid var(--line);border-radius:var(--r-sm);padding:8px 10px;font-size:var(--fs-sm);font-family:var(--sans);background:var(--card)}
.cc-mo .hint{font-size:var(--fs-2xs);color:var(--muted);line-height:1.6}
.cc-mo .hint .warn{color:var(--warn);font-weight:600}
.cc-mo .hint a{color:var(--info);text-decoration:underline}
.cc-mo .mact{display:flex;justify-content:flex-end;gap:var(--sp-2);margin-top:var(--sp-4)}
/* ── 客戶檔案卡 ── */
.cc-new{width:100%;margin-bottom:var(--sp-3)}
.cc-hub .hd{display:flex;align-items:center;gap:var(--sp-2h);flex-wrap:wrap;margin-bottom:var(--sp-3)}
.cc-hub .hd h3{margin:0;font-size:var(--fs-md)}
.cc-hub .hd .sp{flex:1}
.cc-hub.off{display:flex;gap:var(--sp-2h);align-items:baseline;color:var(--muted);font-size:var(--fs-xs)}
.cc-hub .lnk{background:none;border:0;padding:0;color:var(--info);cursor:pointer;font-size:var(--fs-xs);text-decoration:underline}
/* 09-16 終審 ⚪：表格內「＋ 加一行／加一項」（#mpRidAdd／#ypSurrAdd）用 .lnk 但以前冇一條規則套到 .cc-mo，出咗瀏覽器預設掣 */
.cc-mo .lnk{background:none;border:0;padding:0;color:var(--info);cursor:pointer;font-size:var(--fs-xs);text-decoration:underline}
.cc-hub h4{margin:var(--sp-4) 0 var(--sp-2);font-size:var(--fs-sm)}
.cc-hub h4 .dim{font-weight:400;font-size:var(--fs-2xs);margin-left:var(--sp-2)}
/* 09-12 第四期：家庭關係圖（第三版：圖像化）—— 每層等寬 grid；卡＝頭像＋四格保障燈＋三個數＋資產條；細節喺彈窗 */
.cc-fam .hd{display:flex;align-items:center;gap:var(--sp-2h);flex-wrap:wrap;margin-bottom:var(--sp-2)}
.cc-fam .hd h3{margin:0;font-size:var(--fs-md)}
.cc-fam .hd .sp{flex:1}
.cc-notes.compact textarea{min-height:0;height:auto;transition:min-height .15s}
.cc-notes.compact textarea:focus{min-height:140px}
/* 本人做核心，其他人向外擴展：上父母／中（其他｜本人｜配偶）／下子女；連線由 ::before 畫 */
.fc-hub{display:flex;flex-direction:column;align-items:stretch;gap:0;position:relative}
.fc-ring{display:flex;flex-direction:column;align-items:center;gap:var(--sp-1h);position:relative;padding:var(--sp-2) 0}
.fc-ring.empty{display:none}
.fc-ring .fc-lb{font-size:var(--fs-2xs);color:var(--muted);display:flex;gap:4px;align-items:baseline}
.fc-ring .fc-lb i{font-style:normal;font-family:var(--mono);color:var(--faint)}
.fc-ring .fc-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--sp-2h);width:100%}
.fc-ring .fc-node{flex:0 1 250px;min-width:220px}
/* 上下連線：父母 → 本人、本人 → 子女 */
.fc-hub.has-top .fc-ring.top::after,.fc-hub.has-bottom .fc-ring.bottom::before{content:"";display:block;width:2px;height:18px;background:var(--line);margin:0 auto}
.fc-hub.has-top .fc-ring.top::after{margin-top:var(--sp-1h)}
.fc-hub.has-bottom .fc-ring.bottom::before{margin-bottom:var(--sp-1h)}
.fc-mid{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:var(--sp-3);padding:var(--sp-2) 0}
.fc-mid .fc-ring.left,.fc-mid .fc-ring.right{padding:0}
.fc-mid .fc-ring.left .fc-grid{justify-content:flex-end}
.fc-mid .fc-ring.right .fc-grid{justify-content:flex-start}
.fc-mid .fc-ring.empty{display:block}
/* 左右連線：配偶 ↔ 本人、其他 ↔ 本人 */
.fc-mid.has-right .fc-ring.right::before,.fc-mid.has-left .fc-ring.left::after{content:"";display:block;height:2px;width:18px;background:var(--line);flex:none}
.fc-mid .fc-ring.left,.fc-mid .fc-ring.right{flex-direction:row;align-items:center;gap:0}
.fc-mid .fc-ring.right{justify-content:flex-start}
.fc-mid .fc-ring.left{justify-content:flex-end}
.fc-mid .fc-ring .fc-lb{display:none}
.fc-core{flex:none;width:320px;max-width:100%}
.fc-core .fc-node{width:100%}
.fc-core .fc-node.me{box-shadow:0 0 0 2px var(--accent) inset;background:linear-gradient(180deg,var(--accent-soft),var(--card) 40%)}
.fc-core .fc-av{width:42px;height:42px;font-size:var(--fs-md)}
@media (max-width:820px){.fc-mid{grid-template-columns:1fr}.fc-mid .fc-ring.left::after,.fc-mid .fc-ring.right::before{display:none}.fc-mid .fc-ring .fc-lb{display:flex}.fc-mid .fc-ring.left,.fc-mid .fc-ring.right{flex-direction:column;justify-content:center}.fc-core{width:100%}}
.fc-key{display:flex;gap:var(--sp-3);flex-wrap:wrap;align-items:center;font-size:var(--fs-2xs);color:var(--muted);padding-bottom:var(--sp-2)}
.fc-key .sp{flex:1}
.fc-key .k{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:4px;vertical-align:-1px}
.fc-key .k.ok,.fc-lamp.ok i{background:var(--ok)}
.fc-key .k.gap,.fc-lamp.gap i{background:var(--bad)}
.fc-key .k.na,.fc-lamp.na i{background:var(--line)}
.fc-node{min-width:0;border:1px solid var(--line);border-radius:var(--r-md);background:var(--card);padding:var(--sp-2h) var(--sp-3) calc(var(--sp-2h) + 12px);display:flex;flex-direction:column;gap:var(--sp-2h);cursor:pointer;position:relative;transition:border-color .15s,box-shadow .15s}
.fc-node:hover{border-color:var(--ink2);box-shadow:var(--shadow)}
.fc-node.me{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset}
.fc-node .fc-more{position:absolute;right:var(--sp-3);bottom:var(--sp-1h);font-size:var(--fs-3xs);color:var(--faint)}
.fc-node:hover .fc-more{color:var(--info)}
.fc-hd{display:flex;align-items:center;gap:var(--sp-2h);min-width:0}
.fc-av{flex:none;width:34px;height:34px;border-radius:50%;background:var(--card2);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-weight:600;font-size:var(--fs-sm);color:var(--ink2)}
.fc-av.f{background:rgba(180,35,35,.08);border-color:rgba(180,35,35,.25)}
.fc-av.m{background:rgba(31,122,69,.08);border-color:rgba(31,122,69,.25)}
.fc-node.me .fc-av{background:var(--accent-soft);border-color:var(--accent)}
.fc-who{min-width:0;display:flex;flex-direction:column;gap:2px;flex:1}
.fc-who b{font-size:var(--fs-sm);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fc-meta{display:flex;gap:var(--sp-1h);align-items:center}
.fc-rel{font-size:var(--fs-2xs);color:var(--accent-ink);background:var(--accent-soft);border-radius:var(--r-pill);padding:1px 7px;white-space:nowrap}
.fc-age{font-size:var(--fs-2xs);color:var(--muted);font-family:var(--mono);white-space:nowrap}
.fc-link{font-size:var(--fs-2xs);color:var(--ok);white-space:nowrap;text-decoration:none;align-self:flex-start}
.fc-lamps{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}   /* 09-15：加儲蓄／投資兩粒 → 三粒一行、兩行（卡 220–250px 闊，六粒一行塞唔落個數） */
.fc-lamp{display:flex;flex-direction:column;align-items:center;gap:2px;padding:4px 2px 3px;border-radius:var(--r-sm);background:var(--card2);min-width:0}
.fc-lamp i{display:block;width:100%;height:6px;border-radius:3px}
.fc-lamp .l{font-size:var(--fs-3xs);color:var(--muted);white-space:nowrap}
.fc-lamp b{font-family:var(--mono);font-size:var(--fs-2xs);font-weight:500;white-space:nowrap;min-height:13px}
.fc-lamp.ok b{color:var(--ok)}
.fc-lamp.gap b{color:var(--bad)}
.fc-lamp.na b{color:var(--faint)}
.fc-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}
.fc-stats .st{display:flex;flex-direction:column;gap:1px;min-width:0;color:var(--ink2);padding:4px 6px;border-radius:var(--r-sm);background:var(--card2)}
.fc-stats .st .lab{display:flex;align-items:center;gap:4px;font-size:var(--fs-3xs);color:var(--muted);white-space:nowrap}
.fc-stats .st svg{flex:none;color:var(--muted)}
.fc-stats .st b{font-family:var(--mono);font-size:var(--fs-sm);font-weight:600;white-space:nowrap}
.fc-stats .st.none b{color:var(--faint)}
.fc-bar{width:100%}
.fc-bar .track{display:flex;height:8px;border-radius:4px;overflow:hidden;background:var(--line2)}
.fc-bar i,.fc-legend i{display:inline-block}
.fc-bar i{height:100%}
.fc-bar i.savings,.fc-legend i.savings{background:var(--accent)}
.fc-bar i.annuity,.fc-legend i.annuity{background:var(--accent-ink)}
.fc-bar i.ilas,.fc-legend i.ilas{background:var(--info)}
.fc-bar i.other,.fc-legend i.other{background:var(--muted)}
.fc-legend{display:flex;gap:var(--sp-2h);flex-wrap:wrap;font-size:var(--fs-3xs);color:var(--muted);margin-top:3px}
.fc-legend i{width:8px;height:8px;border-radius:2px;margin-right:3px;vertical-align:-1px}
/* 成員詳情彈窗（唔喺原位展開，卡唔會重新排位） */
.fd-hd{display:flex;align-items:baseline;gap:var(--sp-2h);flex-wrap:wrap;padding-bottom:var(--sp-2h);border-bottom:1px solid var(--line);margin-bottom:var(--sp-3)}
.fd-hd h3{margin:0;font-size:var(--fs-lg)}
.fd-sec{margin-top:var(--sp-3h)}
.fd-sec h4{margin:0 0 var(--sp-2);font-size:var(--fs-sm);display:flex;align-items:baseline;gap:var(--sp-2)}
.fd-sec h4 .c{font-size:var(--fs-2xs);font-weight:400;color:var(--muted);font-family:var(--mono)}
.fd-cov{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--sp-1h);margin-bottom:var(--sp-2h);max-width:640px}
.fd-tbl td a{color:var(--ink);text-decoration:none;border-bottom:1px dotted var(--line)}
.fd-tbl td a:hover{color:var(--info)}
.fd-tbl tr.rv-tot td{border-top:2px solid var(--line)}
.fc-node.me{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset}
.fc-hd{display:flex;align-items:baseline;gap:var(--sp-2);min-width:0;padding-bottom:var(--sp-1h);border-bottom:1px solid var(--line2);flex-wrap:wrap}
.fc-hd b{font-size:var(--fs-sm);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.fc-rel{font-size:var(--fs-2xs);color:var(--accent-ink);background:var(--accent-soft);border-radius:var(--r-pill);padding:1px 7px;white-space:nowrap}
.fc-age{font-size:var(--fs-2xs);color:var(--muted);font-family:var(--mono);white-space:nowrap}
.fc-link{font-size:var(--fs-2xs);color:var(--ok);white-space:nowrap;text-decoration:none}
.fc-sum{margin-left:auto;font-size:var(--fs-2xs);color:var(--muted);white-space:nowrap}
.fc-sum b{font-family:var(--mono);color:var(--ink);font-weight:500}
.fc-sum i{font-style:normal;color:var(--faint);margin:0 5px}
.fc-empty{font-size:var(--fs-xs);color:var(--faint);padding:var(--sp-1) 0}
.fc-row{display:grid;grid-template-columns:28px 1fr;gap:var(--sp-2);align-items:start;min-width:0}
.fc-lbl{font-size:var(--fs-2xs);color:var(--muted);padding-top:3px}
.fc-covs{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;min-width:0}
.fc-cov{display:flex;flex-direction:column;gap:1px;min-width:0;padding:3px 6px;border-radius:var(--r-sm);background:var(--card2);border:1px solid var(--line2)}
.fc-cov.gap{background:var(--bad-soft);border-color:transparent}
.fc-cov .l{font-size:var(--fs-3xs);color:var(--muted);white-space:nowrap}
.fc-num{font-family:var(--mono);font-size:var(--fs-xs);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fc-yes{font-size:var(--fs-xs);color:var(--ok);white-space:nowrap}
.fc-no{font-size:var(--fs-xs);color:var(--bad);white-space:nowrap}
.fc-na{font-size:var(--fs-xs);color:var(--faint)}
.fc-bens{display:flex;flex-direction:column;gap:2px;min-width:0}
.fc-line{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,170px);gap:var(--sp-1h);font-size:var(--fs-2xs);align-items:baseline;min-width:0}
.fc-line.four{grid-template-columns:minmax(0,1fr) 38px 52px minmax(0,150px)}
.fc-line .a{font-family:var(--mono);white-space:nowrap;text-align:right}
.fc-line .a b{font-weight:600}
.fc-line .n{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fc-line .p{font-family:var(--mono);white-space:nowrap}
.fc-line .w{color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:right}
.fc-asset{min-width:0;display:flex;flex-direction:column;gap:var(--sp-1h)}
.fc-wsum{display:flex;align-items:baseline;gap:var(--sp-1h);flex-wrap:wrap;font-size:var(--fs-2xs);color:var(--muted)}
.fc-wsum .fc-w b{font-family:var(--mono);color:var(--ink);font-weight:500}
.fc-wsum i{font-style:normal;color:var(--faint)}
.fc-tot{margin-left:auto;white-space:nowrap}
.fc-tot b{font-family:var(--mono);color:var(--ink);font-weight:600;font-size:var(--fs-xs)}
/* 09-12：投資組合 —— 最新基金價估算 */
.cc-invlive{display:flex;align-items:baseline;gap:var(--sp-2h);flex-wrap:wrap;font-size:var(--fs-xs);padding:var(--sp-1h) 0 var(--sp-2);border-bottom:1px dashed var(--line2);margin-bottom:var(--sp-2)}
.cc-invlive .l{color:var(--muted)}
.cc-invlive b{font-family:var(--mono);font-size:var(--fs-sm)}
.cc-invlive em,.fu-row .live em{font-style:normal;font-family:var(--mono)}
.cc-invlive em.up,.fu-row .live em.up{color:var(--ok)}
.cc-invlive em.down,.fu-row .live em.down{color:var(--bad)}
.cc-invlive .lnk{margin-left:auto;font-size:var(--fs-2xs);color:var(--info);text-decoration:none}
.fu-row .live{display:block;font-size:var(--fs-2xs);color:var(--muted);margin-top:2px}
.fu-row .live b{font-family:var(--mono);color:var(--ink)}
.skel-inline{color:var(--faint);font-size:var(--fs-2xs)}
.fu-row .live.div{color:var(--ok)}
.fu-row .live.div b{color:var(--ok)}
.cc-invlive .divsum{color:var(--ok);font-size:var(--fs-xs)}
.cc-invlive .divsum b{font-family:var(--mono)}
.cc-invlive .divsum i{font-style:normal}
/* 09-12：助理清單（要跟進／商機） */
.cc-ai{border-left:3px solid var(--accent)}
.ai-list{display:flex;flex-direction:column}
.ai-row{display:grid;grid-template-columns:10px 1fr auto;gap:var(--sp-2h);align-items:center;padding:var(--sp-2) var(--sp-2h);border-top:1px solid var(--line2)}
/* 09-14：商機（綠）喺上、跟進（琥珀）喺下，兩組各自一個色框 */
.ai-grp{border-radius:var(--r-md);border:1px solid var(--line);margin-top:var(--sp-2h);overflow:hidden}
.ai-grp .ai-gh{display:flex;align-items:baseline;gap:var(--sp-2);padding:var(--sp-1h) var(--sp-2h);font-size:var(--fs-xs)}
.ai-grp .ai-gh b{font-size:var(--fs-sm)}
.ai-grp .ai-gh span{font-family:var(--mono);font-size:var(--fs-2xs)}
.ai-grp .ai-gh i{font-style:normal;font-size:var(--fs-2xs);opacity:.75;margin-left:auto;white-space:nowrap}
.ai-grp.opp{border-color:var(--brand-green-deep)}
.ai-grp.opp .ai-gh{background:var(--ok-soft);color:var(--ok)}
.ai-grp.todo{border-color:var(--warn)}
.ai-grp.todo .ai-gh{background:var(--warn-soft);color:var(--warn)}
.ai-grp .ai-list .ai-row:first-child{border-top:0}
.ai-more{font-size:var(--fs-2xs);color:var(--muted);padding:var(--sp-1h) var(--sp-2h);border-top:1px solid var(--line2)}
.ai-row:first-child{border-top:0}
.ai-dot{width:10px;height:10px;border-radius:50%;background:var(--faint)}
.ai-row.high .ai-dot{background:var(--bad)}
.ai-row.mid .ai-dot{background:var(--warn)}
.ai-row.low .ai-dot{background:var(--faint)}
.ai-kind{font-size:var(--fs-3xs);color:var(--muted);border:1px solid var(--line);border-radius:var(--r-pill);padding:1px 6px;text-align:center;white-space:nowrap}
.ai-body{display:flex;flex-direction:column;gap:1px;min-width:0}
.ai-body b{font-size:var(--fs-sm)}
.ai-body span{font-size:var(--fs-2xs);color:var(--muted)}
.ai-row .btn.sm{white-space:nowrap}
/* 09-12：建議家庭成員 */
.fs-box{margin-top:var(--sp-3);padding:var(--sp-2h) var(--sp-3);border:1px dashed var(--line);border-radius:var(--r-sm);background:var(--card2)}
.fs-box h4{margin:0 0 var(--sp-2)}
.fs-row{display:flex;align-items:center;gap:var(--sp-2h);flex-wrap:wrap;padding:var(--sp-2) 0;border-top:1px solid var(--line2)}
.fs-row .fs-who{flex:1;min-width:200px;display:flex;flex-direction:column;gap:2px;font-size:var(--fs-xs)}
.fs-row .fs-who .dim{font-size:var(--fs-2xs)}
.fs-row .fs-role{display:flex;align-items:center;gap:var(--sp-1h);font-size:var(--fs-2xs);color:var(--muted);flex-wrap:wrap}
.fs-row .fs-role select{border:1px solid var(--line);border-radius:var(--r-sm);height:28px;padding:0 6px;font-size:var(--fs-xs)}
.fs-unl{margin-top:var(--sp-2);font-size:var(--fs-2xs);color:var(--muted);display:flex;gap:var(--sp-1h);flex-wrap:wrap;align-items:center}
.cc-hub .warn{color:var(--warn);font-size:var(--fs-2xs)}
.cc-hub .facts{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:var(--sp-2h) var(--sp-3)}
.cc-hub .facts label{display:flex;flex-direction:column;gap:3px;font-size:var(--fs-2xs);color:var(--muted)}
.cc-hub .facts input{border:1px solid var(--line);border-radius:var(--r-sm);padding:7px 9px;font-size:var(--fs-sm);font-family:var(--mono);background:var(--card);text-align:right}
.cc-hub .facts input:disabled{background:var(--card2)}
.cc-hub .facts i{font-style:normal;font-size:var(--fs-3xs);color:var(--muted)}
.cc-hub .acts{display:flex;gap:var(--sp-2);margin-top:var(--sp-3h)}

/* ── 保單檢視卡 ── */
.cc-rv .hd{display:flex;align-items:center;gap:var(--sp-2h);flex-wrap:wrap;margin-bottom:var(--sp-3)}
.cc-rv .hd h3{margin:0;font-size:var(--fs-md)}
.cc-rv .hd .sp{flex:1}
.rv-tbl td,.rv-tbl th{font-size:var(--fs-xs)}
.rv-gap{color:var(--warn);font-weight:600}
.rv-un{margin-top:var(--sp-2h);font-size:var(--fs-2xs);color:var(--warn);line-height:1.6}
.rv-head{display:flex;justify-content:space-between;align-items:baseline;gap:var(--sp-3);margin-bottom:var(--sp-3);font-size:var(--fs-sm)}
@media print{.th-side,.th-top,.cc-side,.cc-head,.cc-dash,.cc-hub,.cc-cov,.cc-ptbl,.cc-det,.cc-notes,.cc-mo .scrim,.cc-mo .mact{display:none!important}.cc-mo .box{position:static;transform:none;width:auto;max-height:none;box-shadow:none}}

a.cc-exp{text-decoration:none;display:inline-block;line-height:1.4}

.cc-needs{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;font-size:var(--fs-xs);background:var(--card2);border-radius:var(--r-sm);padding:8px 12px;margin-bottom:8px}

/* ═══════════════════════════════════════════════════════════════════════
   v2（2026-09-07）：列表由「左欄卡片＋右欄詳情」改成「今週要做 ＋ 全寬表格」，詳情整頁顯示。
   設計依據＝agent 打開客戶管理中心嘅動機（錢會走／聽日見客／客戶問嘢／機會到期）。
   舊 .cc-wrap／.cc-side／.cc-row 樣式保留俾回收桶等舊區塊，新區塊一律用下面嘅 class。 */
.cc-view.hidden{display:none}
.cc-topbar .sp,.cc-drop.strip .sp{flex:1 1 auto}
/* 顯示設定面板 */
.cc-settings{margin-bottom:var(--sp-3)}
.cc-settings .hd{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-2);margin-bottom:var(--sp-1)}
.cc-settings .hd b{font-size:var(--fs-lg)}
.cc-settings .hint{font-size:var(--fs-sm);color:var(--muted);margin:0 0 var(--sp-3)}
.cc-settings .grp{margin-bottom:var(--sp-2)}
.cc-settings .gt{font-size:var(--fs-2xs);color:var(--muted);margin-bottom:var(--sp-1)}
.cc-settings .opts{display:flex;flex-wrap:wrap;gap:var(--sp-1h) var(--sp-3)}
.cc-settings .opts label{display:inline-flex;align-items:center;gap:var(--sp-1h);font-size:var(--fs-sm);color:var(--ink2);cursor:pointer}
.cc-settings .opts input{accent-color:var(--brand-green-deep);cursor:pointer}
/* 匯入條：由側欄大方格收細成一條，成頁都收 drop */
.cc-drop.strip{display:flex;align-items:center;gap:var(--sp-3);text-align:left;padding:var(--sp-2h) var(--sp-3);margin-bottom:var(--sp-3);background:var(--card2)}
.cc-drop.strip .t{font-size:var(--fs-md)}
.cc-drop.strip .s{margin-top:2px}
.cc-drop.strip .h{margin-top:2px}
.cc-drop.strip .btn{pointer-events:none}
/* 今週要做 */
.cc-tile{display:flex;flex-direction:column;align-items:flex-start;text-align:left;padding:var(--sp-2h) var(--sp-3);border:1px solid var(--line);border-radius:var(--r-md);background:var(--card);cursor:pointer;font-family:inherit;color:var(--ink);min-width:0}
.cc-tile:hover{background:var(--bg2)}
.cc-tile.on{border-color:var(--brand-deep);box-shadow:inset 0 0 0 1px var(--brand-deep)}
.cc-tile.zero{opacity:.5;cursor:default}
.cc-tile .t{font-size:var(--fs-2xs);color:var(--muted);display:flex;align-items:center;gap:var(--sp-1h)}
.cc-tile .t i{width:7px;height:7px;border-radius:50%;display:inline-block;background:var(--line2)}
.cc-tile .n{font-size:var(--fs-2xl);font-weight:700;line-height:1.1;margin:2px 0;font-variant-numeric:tabular-nums}
.cc-tile .n small{font-size:var(--fs-sm);font-weight:400;color:var(--muted);margin-left:2px}
.cc-tile .w{font-size:var(--fs-2xs);color:var(--ink2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.cc-tile.bad .n{color:var(--bad)}.cc-tile.bad .t i{background:var(--bad)}
.cc-tile.warn .n{color:var(--warn)}.cc-tile.warn .t i{background:var(--warn)}
.cc-tile.info .t i{background:var(--info)}
.cc-tile.gold .t i{background:var(--brand-gold)}
.cc-tile.grey .t i{background:var(--faint)}
/* 搜尋＋更多篩選 */
.cc-tools{display:flex;gap:var(--sp-2);align-items:center}
.cc-tools .cc-sbox{flex:1 1 auto}
.cc-tools .cc-sbox input[type=search]{height:40px;font-size:var(--fs-md)}
/* 用戶 09-15：篩選掣改實色主色＋漏斗圖示＋開合箭嘴（舊嗰粒淺色細字冇人見到）；生效緊嘅篩選數用金色圓點 */
.cc-tools .fbtn{display:inline-flex;align-items:center;gap:var(--sp-1h);border:1px solid var(--primary);background:var(--primary);border-radius:var(--r-sm);height:40px;padding:0 var(--sp-3);font-size:var(--fs-sm);font-weight:700;color:var(--primary-ink);cursor:pointer;white-space:nowrap}
.cc-tools .fbtn:hover{background:var(--brand-deeper);border-color:var(--brand-deeper)}
.cc-tools .fbtn.on{box-shadow:0 0 0 3px var(--focus)}
.cc-tools .fbtn .fi{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;stroke-linejoin:round}
.cc-tools .fbtn i{font-style:normal;background:var(--accent);color:var(--accent-ink);border-radius:var(--r-md);min-width:18px;height:18px;font-size:var(--fs-3xs);display:inline-flex;align-items:center;justify-content:center;padding:0 var(--sp-1)}
.cc-tools .fbtn .chev{width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .15s;margin-left:2px}
.cc-tools .fbtn.on .chev{transform:rotate(-135deg) translateY(-2px)}
.cc-fpanel .frow{align-items:flex-start}
.cc-fpanel .frow>span{padding-top:5px}
.cc-fpanel .frow .chips{display:flex;flex-wrap:wrap;gap:var(--sp-1h);flex:1;min-width:0}
.cc-fchip{padding:var(--sp-1) var(--sp-2h);font-size:var(--fs-sm);border:1px solid var(--line);border-radius:var(--r-pill);background:var(--card);color:var(--ink2);cursor:pointer;white-space:nowrap}
.cc-fchip i{font-style:normal;margin-left:var(--sp-1h);font-size:var(--fs-2xs);opacity:.7}
.cc-fchip.on{background:var(--brand-deep);color:#fff;border-color:transparent}
.cc-filt .hint{font-size:var(--fs-2xs);color:var(--muted)}
/* 選取列（v2：唔再貼住 .cc-rows）*/
.cc-selall.on{border-bottom:1px solid var(--line);border-radius:var(--r-md);margin-top:var(--sp-2)}
/* 客戶表格 */
.cc-list2{margin-top:var(--sp-2)}
.cc-count{font-size:var(--fs-sm);color:var(--muted);margin-bottom:var(--sp-2)}
.cc-tblwrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-md);background:var(--card)}
.cc-ltbl{width:100%;border-collapse:collapse;font-size:var(--fs-sm)}
.cc-ltbl th,.cc-ltbl td{text-align:left;padding:var(--sp-2) var(--sp-2h);border-bottom:1px solid var(--line);white-space:nowrap;vertical-align:middle}
.cc-ltbl thead th{position:sticky;top:0;z-index:1;background:var(--bg2);color:var(--muted);font-weight:600;font-size:var(--fs-2xs)}
.cc-ltbl th[data-sort]{cursor:pointer;user-select:none}
.cc-ltbl th[data-sort]:hover{color:var(--ink)}
.cc-ltbl th.on{color:var(--brand-green-deep)}
.cc-ltbl th.num,.cc-ltbl td.num{text-align:right;font-variant-numeric:tabular-nums}
.cc-ltbl th.pk,.cc-ltbl td.pk{width:34px;text-align:center}
.cc-ltbl td.pk input{width:15px;height:15px;accent-color:var(--brand-green-deep);cursor:pointer}
.cc-ltbl th.x,.cc-ltbl td.x{width:32px;text-align:center}
.cc-ltbl tbody tr{cursor:pointer}
.cc-ltbl tbody tr:hover{background:var(--bg2)}
.cc-ltbl tbody tr.picked{background:var(--info-soft)}
.cc-ltbl tbody tr:last-child td{border-bottom:0}
.cc-ltbl td.nm{font-weight:600;color:var(--ink)}
.cc-ltbl td.act{min-width:150px}
.cc-ltbl td.mono{font-family:var(--mono);font-size:var(--fs-2xs);color:var(--ink2)}
.cc-ltbl .dim{color:var(--muted);font-size:var(--fs-2xs)}
.cc-ltbl .dot{display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:var(--sp-1h);background:var(--line2);vertical-align:middle}
.cc-ltbl .dot.bad{background:var(--bad)}.cc-ltbl .dot.warn{background:var(--warn)}.cc-ltbl .dot.info{background:var(--info)}.cc-ltbl .dot.gold{background:var(--brand-gold)}
.cc-ltbl .del{border:0;background:none;color:var(--faint);font-size:var(--fs-lg);line-height:1;cursor:pointer;padding:2px var(--sp-1h);border-radius:var(--r-sm)}
.cc-ltbl .del:hover{color:var(--bad);background:var(--bad-soft)}
.cc-ltbl .dbtn{border:0;background:var(--neutral-soft);color:var(--ink2);border-radius:var(--r-xs);font-size:var(--fs-2xs);padding:1px var(--sp-1h);cursor:pointer}
.cc-ltbl .dbtn:hover{background:var(--accent-soft)}
.cc-ltbl .role{font-size:var(--fs-3xs);font-weight:700;padding:1px var(--sp-1h);border-radius:var(--r-pill);background:var(--ok-soft);color:var(--ok)}
.cc-ltbl .role.own{background:var(--info-soft);color:var(--info)}
/* 09-15：客戶名下面一行 —— 同一份檔案入面嘅其他人（受保人／第三者持有人），逐個帶標籤 */
.cc-ltbl .cc-ppl{display:flex;flex-wrap:wrap;gap:var(--sp-1) var(--sp-2);margin-top:3px;font-weight:400;font-size:var(--fs-2xs);color:var(--ink2)}
.cc-ltbl .cc-ppl .pp{display:inline-flex;align-items:center;gap:var(--sp-1);white-space:nowrap}
.cc-tag{font-size:var(--fs-2xs);padding:2px var(--sp-1h);border-radius:var(--r-pill);white-space:nowrap}
.cc-tag.bad{background:var(--bad-soft);color:var(--bad)}
.cc-tag.warn{background:var(--warn-soft);color:var(--warn)}
.cc-tag.ok{background:var(--ok-soft);color:var(--ok)}
.cc-tag.info{background:var(--info-soft);color:var(--info)}
.cc-tag.gold{background:var(--accent-soft);color:var(--brand-gold-deep)}
.cc-tag.grey{background:var(--neutral-soft);color:var(--muted)}
.cc-gap{font-size:var(--fs-2xs);padding:1px var(--sp-1h);border-radius:var(--r-pill);border:1px dashed var(--line2);color:var(--muted);white-space:nowrap}
.cc-chips2{display:flex;flex-wrap:wrap;gap:var(--sp-1)}
.cc-chips2 .chip{font-size:var(--fs-2xs);padding:2px var(--sp-1h);border-radius:var(--r-pill);background:var(--accent-soft);color:var(--accent-ink);white-space:nowrap}
.cc-chips2 .chip.more{background:none;color:var(--muted)}
/* 詳情視圖：頂欄（返回／上一位／下一位）*/
.cc-topbar{display:flex;align-items:center;gap:var(--sp-1h);margin-bottom:var(--sp-3)}
.cc-back2{background:none;border:0;color:var(--link);font-size:var(--fs-md);cursor:pointer;padding:var(--sp-1) 0}
.cc-head p .mono{font-family:var(--mono)}
.cc-exp.wa{background:var(--primary-ink);color:var(--primary);border-color:var(--primary-ink);font-weight:700}
/* 最急一件事提示條 */
.cc-alert{padding:var(--sp-2h) var(--sp-3);border-radius:var(--r-md);display:flex;align-items:center;gap:var(--sp-3);flex-wrap:wrap;font-size:var(--fs-sm)}
.cc-alert b{font-size:var(--fs-md)}
.cc-alert.bad{background:var(--bad-soft);color:var(--bad)}
.cc-alert.warn{background:var(--warn-soft);color:var(--warn)}
.cc-alert.info{background:var(--info-soft);color:var(--info)}
.cc-alert.gold{background:var(--accent-soft);color:var(--brand-gold-deep)}
/* 重要日子 */
.cc-dates ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:0 var(--sp-5)}
.cc-dates li{display:flex;justify-content:space-between;gap:var(--sp-2);padding:var(--sp-1h) 0;border-bottom:1px solid var(--line2);font-size:var(--fs-sm)}
.cc-dates li span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cc-dates .d{font-family:var(--mono);font-size:var(--fs-2xs);color:var(--muted);white-space:nowrap}
.cc-dates .d.soon{color:var(--bad);font-weight:600}
/* 保單表：現值格（粗體退保價值＋細字拆解）*/
.tbl td.cv b{display:block;font-weight:600}
.tbl td.cv .sub{display:block;font-size:var(--fs-2xs);color:var(--ink2);white-space:nowrap}
@media (max-width:760px){.cc-ltbl th,.cc-ltbl td{padding:var(--sp-1h) var(--sp-2)}}

/* 診斷紀錄（用戶 2026-09-08 要求）—— 平時摺埋，出事時自動展開。
   刻意做到唔使開 console 都攞得到：手機上開唔到 console。 */
.ccy-diag { margin: 12px 0; border: 1px solid var(--line); border-radius: 8px; background: var(--card, #fff); }
.ccy-diag > summary { cursor: pointer; padding: 8px 12px; font-size: 13px; color: var(--dim); }
.ccy-diag > pre { margin: 0; padding: 10px 12px; font-size: 11.5px; line-height: 1.5; white-space: pre-wrap; word-break: break-word; max-height: 320px; overflow: auto; background: rgba(0,0,0,.03); }
.ccy-diag > .btn { margin: 8px 12px 12px; }
.ccy-err-sub { font-size: 13px; color: var(--dim); margin: 4px 0 10px; }

/* 手動保單嘅附加保障（09-11）：一行一項，名／類型／保額／每期保費 ＋ 刪掣；醫療多一行兩個選單 */
.cc-mo .mp-rid-wrap{display:flex;flex-direction:column;gap:4px}
/* 09-11：rider 改用同主計劃一樣嘅 .f／.f2（label 喺上），唔再逼窄成一行 grid。
   一項一張細卡，睇得出邊幾格屬同一項附加保障。 */
.cc-mo .mp-rid{border:1px solid var(--line);border-radius:var(--r-md);padding:var(--sp-3);margin-bottom:var(--sp-3);background:var(--card)}
.cc-mo .mp-rid-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--sp-2)}
.cc-mo .mp-rid-head b{font-size:var(--fs-xs);color:var(--ink2)}

.cc-mo .mp-rid .rx{border:1px solid var(--line);background:var(--card);border-radius:var(--r-sm);cursor:pointer;padding:2px 10px;color:var(--muted);font-size:var(--fs-2xs)}
.cc-mo .mp-rid .rx:hover{color:var(--bad);border-color:var(--bad)}

/* 09-11：手動保單表格嘅「公司 → 類型 → 計劃名稱」三層 ＋ 受益人列 */
.cc-mo .mp-plan{position:relative}
.cc-mo .mp-sug{display:flex;flex-direction:column;gap:2px;margin-top:4px}
.cc-mo .mp-sug .mp-sug-h{font-size:var(--fs-2xs);color:var(--muted);font-weight:700;margin:2px 0}
.cc-mo .mp-sug .mp-sug-i{text-align:left;border:1px solid var(--line);background:var(--card);border-radius:var(--r-sm);padding:6px 10px;cursor:pointer;font:inherit;font-size:var(--fs-2xs);color:var(--ink)}
.cc-mo .mp-sug .mp-sug-i:hover{border-color:var(--ink2);background:var(--bg2)}
/* 09-11：未打字嗰陣個框係「清單」（可以捲），打咗字先變「最接近」——  兩個狀態同一個框。 */
.cc-mo .mp-sug.browse{max-height:220px;overflow-y:auto}
.cc-mo .mp-sug .mp-sug-f{font-size:var(--fs-2xs);padding:4px 2px 0}
/* 附加保障「詳細」（生效日期／保障期）—— 唔塞入同一行，展開先出 */
.cc-mo .mp-rid .rdet{grid-column:1 / -1;justify-self:start;border:0;background:none;padding:2px 0;cursor:pointer;font:inherit;font-size:var(--fs-2xs);color:var(--ink2);text-decoration:underline}
.cc-mo .mp-rid .rdt{grid-column:1 / -1;display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px;margin-bottom:6px}
.cc-mo .mp-rid .rdt label{display:flex;flex-direction:column;gap:2px;font-size:var(--fs-2xs);color:var(--muted)}
@media (max-width: 640px){ .cc-mo .mp-rid .rdt{grid-template-columns:1fr} }
.cc-mo .mp-bnf-box{display:flex;flex-direction:column;gap:4px}
.cc-mo .mp-bnf-box .bh{font-size:var(--fs-2xs);color:var(--muted);font-weight:700}
.cc-mo .mp-bnf{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr) minmax(0,.8fr) 28px;gap:6px;align-items:center;margin-bottom:6px}
.cc-mo .mp-bnf.bnf-act{grid-template-columns:auto 1fr}
.cc-mo .mp-bnf .rx{border:1px solid var(--line);background:var(--card);border-radius:var(--r-sm);cursor:pointer;height:34px;color:var(--muted);font-size:16px;line-height:1}
.cc-mo .mp-bnf .rx:hover{color:var(--bad);border-color:var(--bad)}
.cc-mo .mp-bnf .bs{font-size:var(--fs-2xs);color:var(--muted)}
.cc-mo .mp-bnf .bs.bad{color:var(--bad);font-weight:700}
@media (max-width: 640px){ .cc-mo .mp-bnf{grid-template-columns:1fr 1fr} .cc-mo .mp-bnf .bn{grid-column:1 / -1} .cc-mo .mp-bnf .rx{justify-self:end;width:34px} }

/* 手動保單分段（09-11 用戶：主計劃同附加保障之間冇明顯分隔）。
   唔用粗線／底色，用一條幼線加一個標題就夠 —— 表單本身已經好長，重手嘅分隔會令佢更散。 */
.cc-mo .mp-sec{border-top:1px solid var(--line);margin:var(--sp-4) 0 var(--sp-3);padding-top:var(--sp-3)}
.cc-mo .mp-sec.first{border-top:0;margin-top:0;padding-top:0}
.cc-mo .mp-sec h4{margin:0 0 2px;font-size:var(--fs-sm);color:var(--ink)}
.cc-mo .mp-sec small{display:block;font-size:var(--fs-2xs)}
/* 醫療計劃五層級聯（公司→計劃名稱→計價貨幣→計劃類型→保障類別）—— 主計劃同附加保障共用 */
.cc-mo .mp-med{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.cc-mo .mp-med-f{display:flex;flex-direction:column;gap:2px;font-size:var(--fs-2xs);color:var(--muted);min-width:0}
.cc-mo .mp-med-f .mo{margin-top:2px}
.cc-mo .mp-med-n{margin-top:4px}
@media (max-width: 640px){ .cc-mo .mp-med{grid-template-columns:1fr} }
/* 附加保障入面嗰個級聯要佔成行（rider 一行係 grid） */
.cc-mo .mp-rid .rmedpick{grid-column:1 / -1}
.cc-mo .mp-rid .rmedpick:empty{display:none}
/* rider 嘅計劃建議：同主計劃嗰個 .mp-sug 同款，但要佔成行（rider 一行係 grid） */

.cc-mo .mp-rid .rsug:empty{display:none}

/* 醫療計劃建議：右邊標「非可扣稅自願醫保」—— 唔標嘅話顧問會以為全部都可扣稅（09-11 用戶） */
.cc-mo .mp-sug-tag{margin-left:6px;font-size:var(--fs-3xs);color:var(--warn)}

/* 「由產品目錄帶入」嘅標示 —— 要分得出邊啲係系統填、邊啲係用戶自己揀（09-12） */
.cc-mo .mp-med-src{color:var(--info);font-size:var(--fs-3xs)}

/* 09-16：「由匯入檔帶入」嘅欄位標記（富衛 CSV）—— 同 mp-med-src 一樣係細字標籤，唔搶眼但睇得到。
   本來喺 yf-policy-form.js 嘅 inline CSS（.yfpol-form .cat）；表格合併之後規則一律入呢度。 */
.cc-mo .cat{display:inline-block;margin-left:6px;padding:1px 6px;border-radius:var(--r-sm);background:var(--info-soft,var(--bg2));color:var(--info,var(--ink2));font-size:var(--fs-3xs);font-weight:700;font-style:normal;vertical-align:middle}

/* ── 09-16：萬通手動保單專有嘅兩樣嘢（同宏利同一張表，所以規則入呢度，唔准再開第二個彈窗殼）──
   ① 逐年退保價值列（年齡／金額／刪）—— 同受益人列（.mp-bnf）同一種視覺語言
   ② 多行文字欄（不保事項／顧問備注）—— .cc-mo 本來冇 textarea 嘅闊度規則 */
.cc-mo .yp-surr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr) 28px;gap:6px;align-items:center;margin-bottom:6px}
.cc-mo .yp-surr .rx{border:1px solid var(--line);background:var(--card);border-radius:var(--r-sm);cursor:pointer;height:34px;color:var(--muted);font-size:16px;line-height:1}
.cc-mo .yp-surr .rx:hover{color:var(--bad);border-color:var(--bad)}
.cc-mo textarea{width:100%;resize:vertical;line-height:1.6}
@media (max-width: 640px){ .cc-mo .yp-surr{grid-template-columns:1fr 1fr} .cc-mo .yp-surr .sv{grid-column:1 / -1} .cc-mo .yp-surr .rx{justify-self:end;width:34px} }
/* 09-16 Trinity WP-A：自訂欄位行（.yp-cf 借用 .yp-surr 格式）；保單目標多選用現成 .pill 做 checkbox 標籤，唔另起爐灶 */
@media (max-width: 640px){ .cc-mo .yp-cf .cv{grid-column:1 / -1} }
.cc-mo .yp-purp{display:flex;flex-wrap:wrap;gap:var(--sp-1h)}
.cc-mo .yp-purp .pill{cursor:pointer;background:var(--neutral-soft);color:var(--ink2);font-weight:500}
.cc-mo .yp-purp .pill input{margin:0 4px 0 0;vertical-align:middle}

/* ── 09-12 估算現值入資產現值格／關係圖／成員詳情（同投資組合同一個比例）── */
.cc-stat .s em{font-style:normal;font-weight:700}
.cc-stat .s em.up{color:var(--ok)}
.cc-stat .s em.down{color:var(--bad)}
.fc-stats .st .lab .est{display:inline-block;margin-left:4px;padding:0 4px;border-radius:3px;font-size:10px;line-height:15px;font-weight:700;background:var(--accent-soft);color:var(--brand-gold-deep)}
.fd-tbl td em{font-style:normal;font-size:12px;font-weight:600}
.fd-tbl td em.up{color:var(--ok)}
.fd-tbl td em.down{color:var(--bad)}

/* 09-14：家庭關係圖「年繳」下面出繳費方式＋每期（用戶：要知呢張單本身係年繳定月繳） */
.fd-tbl td .sub{display:block;font-size:var(--fs-2xs);color:var(--muted);font-weight:400;white-space:nowrap}

/* 09-14：保單一覽「繳費方式」下面出每期實付（月繳 HK$527） */
.cc-ptbl td.dim .sub{display:block;font-size:var(--fs-2xs);color:var(--ink2);font-family:var(--mono);white-space:nowrap;margin-top:1px}

/* 09-14：三格 KPI 入 hero（要跟嘅事／今年應繳／資產現值）—— 深底上嘅半透明磚，撳落去照樣出明細 */
.cc-hero-kpi{flex:1 1 100%;margin-top:var(--sp-2)}
.cc-hero-kpi .cc-dash{gap:var(--sp-2h)}
.cc-hero-kpi .cc-stat{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.18);color:var(--primary-ink)}
.cc-hero-kpi .cc-stat .l,.cc-hero-kpi .cc-stat .s{color:var(--primary-ink);opacity:.78}
.cc-hero-kpi .cc-stat .v{color:var(--primary-ink)}
.cc-hero-kpi .cc-stat.warn{border-left-color:var(--brand-gold)}
.cc-hero-kpi .cc-stat.open{background:rgba(255,255,255,.16);border-color:var(--brand-gold)}
.cc-hero-kpi .cc-stat:hover{border-color:rgba(255,255,255,.4)}
.cc-hero-kpi .cc-drill{margin-top:var(--sp-2h);color:var(--ink)}

/* 用戶 09-15：列表頁 hero（同詳情頁 cc-head 同一套）；「要即刻跟嘅客」三格搬入 hero，改半透明白底 */
.cc-lhero{margin-bottom:var(--sp-3)}
.cc-lhero h1{font-size:var(--fs-2xl);font-weight:700;line-height:1.2;margin:0}
.cc-lhero .cc-exp.on{background:rgba(255,255,255,.18);border-color:rgba(255,255,255,.6)}
.cc-lhero .cc-hero-kpi .hl{font-size:var(--fs-xs);font-weight:700;margin-bottom:var(--sp-1h);display:flex;align-items:baseline;gap:var(--sp-2);flex-wrap:wrap}
.cc-lhero .cc-hero-kpi .hl span{font-weight:400;font-size:var(--fs-2xs);opacity:.72}
.cc-lhero .tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:var(--sp-2)}
.cc-lhero .cc-tile{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.18);color:var(--primary-ink)}
.cc-lhero .cc-tile:hover{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.4)}
.cc-lhero .cc-tile.on{background:rgba(255,255,255,.16);border-color:var(--brand-gold);box-shadow:inset 0 0 0 1px var(--brand-gold)}
.cc-lhero .cc-tile.zero{opacity:.45}
.cc-lhero .cc-tile .t,.cc-lhero .cc-tile .w,.cc-lhero .cc-tile .n small{color:var(--primary-ink);opacity:.78}
.cc-lhero .cc-tile.bad .n{color:#FF9B9B}.cc-lhero .cc-tile.warn .n{color:var(--brand-gold)}
@media (max-width:760px){.cc-lhero h1{font-size:var(--fs-xl)}.cc-lhero .tiles{grid-template-columns:repeat(2,1fr)}}

/* 09-14：hero 四塊磚（商機／要跟進／今年應繳／資產現值） */
.cc-dash.four{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.cc-hero-kpi .cc-stat[data-dk="opp"]{border-left:3px solid var(--brand-green)}
.cc-hero-kpi .cc-stat[data-dk="todo"]{border-left:3px solid var(--brand-gold)}

/* 09-14：撳 hero「商機／要跟進」磚 → 助理清單對應組閃兩下（唔用 emoji、唔用彈窗，靠動畫引視線） */
@keyframes ai-flash{0%,100%{box-shadow:0 0 0 0 transparent}25%,75%{box-shadow:0 0 0 4px var(--accent-soft),0 0 0 6px var(--accent)}50%{box-shadow:0 0 0 0 transparent}}
.ai-grp.flash{animation:ai-flash 1.6s ease-out 1}
@media (prefers-reduced-motion:reduce){.ai-grp.flash{animation:none;box-shadow:0 0 0 3px var(--accent)}}
