/* 手機版 v2 內容組（10-30 m2-content）：市場資訊三頁 —— 每日快報（.bfx）／市場週報（.wk）／懶人包圖庫（.lp-*）。
   每條規則 html[data-dev="phone"] 開頭；iPad／電腦一條都唔受影響。淨呢三頁載（life.html 屬保險工具組，唔載）。
   v2 標準：第一屏見最多有用資料、唔重複、頁名唔重複（頂欄已寫，1A）、說明句手機唔出、字 ≥12、撳位 ≥44、唔淨靠顏色（#429）。
   分享圖舞台（#bfxStage .bfx-scard，html2canvas 固定像素）唔准受影響 → 快報規則一律 #bfApp 開頭。
   閘：tools/headless/content-phone.spec.js（briefing／marketupdate／lazypack × 375／420／440）。 */

/* ── 每日快報 ── */
/* 報頭（每日市場快報／DAILY MARKET BRIEFING／日期）同頂欄頁名、hero 日期重複 → 唔出 */
html[data-dev="phone"] #bfApp .bfx .mast{display:none}
html[data-dev="phone"] #bfApp .bfx .bfx-hero{display:block;padding:4px 0 18px}
html[data-dev="phone"] #bfApp .bfx .eyebrow{font-size:12px;letter-spacing:.12em}
/* hero 上面嗰行日期：手機頂欄右邊已經出資料日期（TH.fresh）→ 唔重複 */
html[data-dev="phone"] #bfApp .bfx .bfx-hero .eyebrow{display:none}
html[data-dev="phone"] #bfApp .bfx .bfx-hero h1{margin-top:0}
html[data-dev="phone"] #bfApp .bfx .bfx-hero h1{font-size:26px;line-height:1.25;margin-top:8px}
html[data-dev="phone"] #bfApp .bfx .bfx-hero .lead{font-size:16px;line-height:1.7;margin-top:12px}
html[data-dev="phone"] #bfApp .bfx .bfx-hero .mood{margin-top:14px;gap:8px}
/* hero 大圖＝焦點新聞第二張相（同一張相下面新聞卡再出）；頂部五格＝快報朝早收市價，下面「市場動向」同一批標的有即時價 → 兩樣手機都唔重複出 */
html[data-dev="phone"] #bfApp .bfx .heroart,
html[data-dev="phone"] #bfApp .bfx .snap{display:none}
html[data-dev="phone"] #bfApp .bfx .sec{padding:20px 0}
html[data-dev="phone"] #bfApp .bfx .sh{gap:10px;margin-bottom:12px}
html[data-dev="phone"] #bfApp .bfx .sh h2{font-size:20px}
/* 「撳卡睇全文 · 可一鍵分享」「撳標的睇大圖」呢類用法說明 —— 張卡本身撳得，手機唔出 */
html[data-dev="phone"] #bfApp .bfx .sh .hint{display:none}
/* 焦點新聞：一則一行（左相 88 正方、右標題＋摘要），唔再每則一張全闊大相卡 */
html[data-dev="phone"] #bfApp .bfx .grid,
html[data-dev="phone"] #bfApp .bfx .tgrid{gap:10px}
html[data-dev="phone"] #bfApp .bfx .card{flex-direction:row;align-items:stretch}
html[data-dev="phone"] #bfApp .bfx .card:hover,
html[data-dev="phone"] #bfApp .bfx .card:hover .ph img{transform:none}
html[data-dev="phone"] #bfApp .bfx .card .ph{flex:0 0 88px;aspect-ratio:auto;min-height:88px}
html[data-dev="phone"] #bfApp .bfx .card .bd{padding:12px 14px;min-width:0}
html[data-dev="phone"] #bfApp .bfx .card .top{font-size:12px;letter-spacing:.06em}
html[data-dev="phone"] #bfApp .bfx .card h3{font-size:16px;line-height:1.4;margin-top:4px;-webkit-line-clamp:2}
html[data-dev="phone"] #bfApp .bfx .card .tz{font-size:14px;margin-top:4px}
/* 「撳入睇全文 →」「深入了解 →」「睇全文 →」：成張卡撳得，手機唔出呢行提示 */
html[data-dev="phone"] #bfApp .bfx .card .more,
html[data-dev="phone"] #bfApp .bfx .tc .more,
html[data-dev="phone"] #bfApp .bfx .tip .more{display:none}
html[data-dev="phone"] #bfApp .bfx .tc{padding:14px 16px}
html[data-dev="phone"] #bfApp .bfx .tc h3{font-size:16px;margin-bottom:6px}
html[data-dev="phone"] #bfApp .bfx .tc p{font-size:14px}
/* 市場動向表：一欄、字 ≥12 */
html[data-dev="phone"] #bfApp .bfx .snapfb{margin-top:0}
html[data-dev="phone"] #bfApp .bfx .snapfb .fbhd{font-size:12px;letter-spacing:0}
html[data-dev="phone"] #bfApp .bfx .mg{grid-template-columns:1fr}
html[data-dev="phone"] #bfApp .bfx .grp{font-size:12px;letter-spacing:.1em;padding:14px 0 4px}
html[data-dev="phone"] #bfApp .bfx .mv{align-items:center;min-height:44px;padding:6px 0;font-size:15px}
html[data-dev="phone"] #bfApp .bfx .mv .q{gap:8px}
html[data-dev="phone"] #bfApp .bfx .mv .p{min-width:60px}
html[data-dev="phone"] #bfApp .bfx .cico,
html[data-dev="phone"] #bfApp .bfx .cno,
html[data-dev="phone"] #bfApp .bfx .mv .mk{font-size:12px}
html[data-dev="phone"] #bfApp .bfx .two{grid-template-columns:1fr;gap:20px}
html[data-dev="phone"] #bfApp .bfx .tip{padding:14px 16px;margin-bottom:10px}
html[data-dev="phone"] #bfApp .bfx .tip .k,
html[data-dev="phone"] #bfApp .bfx .risk .k{font-size:12px;letter-spacing:.08em}
html[data-dev="phone"] #bfApp .bfx .risk{padding:14px 16px}
html[data-dev="phone"] #bfApp .bfx .disc{padding-top:16px}

/* ── 市場週報 ── */
/* 報頭（WEEKLY MARKET UPDATE／市場週報／日期範圍）：頁名頂欄已寫、期數由下面選單見到 → 唔出 */
html[data-dev="phone"] #muApp .wk .mast{display:none}
html[data-dev="phone"] #muApp .wk .eyebrow{font-size:12px;letter-spacing:.12em}
/* 揀期數＋下載 PDF：選單全闊 44 高（「本期」標籤唔出，選單本身寫住日期＋題目）；PDF 掣全闊落第二行 */
html[data-dev="phone"] #muApp .wk-bar{gap:8px;margin:4px 0 0}
html[data-dev="phone"] #muApp .wk-bar .wk-pick{flex:1 1 100%;min-width:0;flex-wrap:wrap;gap:6px}
html[data-dev="phone"] #muApp .wk-pick label{display:none}
html[data-dev="phone"] #muApp .wk-pick select{max-width:none;min-width:0;width:100%;flex:1 1 100%;min-height:44px;font-size:16px}
/* 「往後每週自動加一期…」用法說明唔出；過期警告（.stale）照出 */
html[data-dev="phone"] #muApp .wk-pick-note:not(.stale){display:none}
html[data-dev="phone"] #muApp .wk-pick-note.stale{flex:1 1 100%}
html[data-dev="phone"] #muApp .wk-pdf{flex:1 1 100%;min-height:44px}
html[data-dev="phone"] #muApp .wk-hero{display:block;padding:18px 0}
html[data-dev="phone"] #muApp .wk-hero h1{font-size:26px;line-height:1.25;margin-top:8px}
html[data-dev="phone"] #muApp .wk-hero .lead{margin-top:12px;line-height:1.7}
html[data-dev="phone"] #muApp .wk-hero .mood{margin-top:12px}
/* 封面／主線配圖：冇真相嗰陣淨係一塊漸變色加英文關鍵字（冇資料）→ 唔出；有真相收矮做橫幅 */
html[data-dev="phone"] #muApp .wk-cover:not(.hasimg),
html[data-dev="phone"] #muApp .wk-ph:not(.hasimg){display:none}
html[data-dev="phone"] #muApp .wk-cover.hasimg{aspect-ratio:16/7;margin-top:14px}
html[data-dev="phone"] #muApp .wk-ph.hasimg{min-height:0;aspect-ratio:16/7}
/* 五個指數：列表行（名｜價＋變幅），唔再兩欄方格 */
html[data-dev="phone"] #muApp .wk .snap{display:block;margin:16px 0 4px}
html[data-dev="phone"] #muApp .wk .snap .c{display:flex;align-items:baseline;gap:10px;min-height:44px;padding:10px 16px;border-right:0;border-top:1px solid var(--line)}
html[data-dev="phone"] #muApp .wk .snap .c:first-child{border-top:0}
html[data-dev="phone"] #muApp .wk .snap .snm{flex:1;min-width:0;font-size:15px;color:var(--ink)}
html[data-dev="phone"] #muApp .wk .snap .px{font-size:15px;margin-top:0}
html[data-dev="phone"] #muApp .wk .snap .ch{font-size:13px;margin-top:0;min-width:64px;text-align:right}
html[data-dev="phone"] #muApp .wk .sh{margin:28px 0 12px}
html[data-dev="phone"] #muApp .wk .sh h2{font-size:20px}
html[data-dev="phone"] #muApp .wk-th{margin-bottom:10px}
html[data-dev="phone"] #muApp .wk-tb{padding:14px 16px}
html[data-dev="phone"] #muApp .wk-tb h3{font-size:18px}
html[data-dev="phone"] #muApp .wk-tb summary{min-height:44px;display:flex;align-items:center}
html[data-dev="phone"] #muApp .wk-chart{padding:14px 16px}
html[data-dev="phone"] #muApp .wk-ind .kpi .l,
html[data-dev="phone"] #muApp .wk-ind .kpi .s,
html[data-dev="phone"] #muApp .wk-ind .tag,
html[data-dev="phone"] #muApp .wk-ind-asof,
html[data-dev="phone"] #muApp .wk-disc .cr{font-size:12px}
html[data-dev="phone"] #muApp .wk-outlook{padding:14px 16px}
html[data-dev="phone"] #muApp .wk-deep{margin-top:24px;padding:0 16px 14px}
html[data-dev="phone"] #muApp .wk-deep>summary,
html[data-dev="phone"] #muApp .wk-admin>summary{min-height:44px;display:flex;align-items:center;padding:0}
html[data-dev="phone"] #muApp .wk-disc{margin-top:20px}

/* ── 懶人包圖庫 ── */
/* 頁題（懶人包圖庫）同頂欄重複、副題係用法說明 → 唔出 */
html[data-dev="phone"] #lpApp .mpf-head{display:none}
html[data-dev="phone"] #lpApp .lp-tools{margin:0 0 10px}
html[data-dev="phone"] #lpApp .lp-tools .lb{font-size:12px}
/* 「N 個題目有多款版式」：講解句，手機唔出（版式選單掣本身寫住揀緊乜） */
html[data-dev="phone"] #lpApp .lp-tools .seg ~ .lb{display:none}
html[data-dev="phone"] #lpApp .lp-grid{columns:2;column-gap:10px}
html[data-dev="phone"] #lpApp .lp-cell{margin-bottom:10px}
html[data-dev="phone"] #lpApp .lp-cell .cap{padding:10px 12px}
html[data-dev="phone"] #lpApp .lp-cell .cap .t{font-size:15px}
html[data-dev="phone"] #lpApp .lp-cell .cap .c,
html[data-dev="phone"] #lpApp .lp-cell .cap .w,
html[data-dev="phone"] #lpApp .ct-toolbar .chip{font-size:12px}
html[data-dev="phone"] #lpApp .lp-cell .cap .acts .btn{min-height:44px;width:100%}
/* 燈箱：手機全屏、掣 44 */
html[data-dev="phone"] .lp-modal{padding:0}
html[data-dev="phone"] .lp-modal .box{max-width:none;max-height:100%;height:100%;border-radius:0}
html[data-dev="phone"] .lp-modal .hd .x{min-width:44px;min-height:44px}
html[data-dev="phone"] .lp-modal .acts .btn{min-height:44px}
/* 公司配色：手機收做選單（TH.phoneMenu 登記 .lp-pals）；選項＝色波＋公司名（#429 唔淨靠顏色）。未收（引擎未行）時色波照排、名唔出 */
html[data-dev="phone"] #lpApp .lp-pals .sw .lp-nm{display:none}
html[data-dev="phone"] .th-sheet .phm-r .tx:has(> .lp-nm){display:inline-flex;align-items:center;gap:12px}
html[data-dev="phone"] .th-sheet .phm-r .tx:has(> .lp-nm) > i{display:inline-block;width:24px;height:24px;border-radius:50%;flex:none}
/* 10-30 用戶 iPhone：三粒選單掣（公司配色／版式／類別）各佔一行、外面標籤同掣入面前綴重複講兩次 →
   選單引擎收咗掣組（出咗 .phm-mb）先至：外面標籤（.lb）唔出；配色＋版式兩粒一行平分、同高，類別落第二行全闊。
   引擎未收（冇 .phm-mb）就照舊直排，唔會擠爆色波／版式掣。 */
html[data-dev="phone"] #lpApp:has(> .lp-tools > .phm-mb){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;align-items:stretch}
html[data-dev="phone"] #lpApp:has(> .lp-tools > .phm-mb) > *{grid-column:1 / -1}
html[data-dev="phone"] #lpApp:has(> .lp-tools > .phm-mb) > .lp-tools{grid-column:auto;display:flex;margin:0;min-width:0}
html[data-dev="phone"] #lpApp:has(> .lp-tools > .phm-mb) > .lp-tools > .lb{display:none}
html[data-dev="phone"] #lpApp:has(> .lp-tools > .phm-mb) .phm-mb{width:100%;min-width:0;min-height:44px;margin:0}
html[data-dev="phone"] #lpApp:has(> .lp-tools > .phm-mb) > .lp-grid{margin-top:4px}

/* 10-30 用戶 iPhone：焦點新聞每則右邊一粒「分享成圖片」圖示掣（briefing.js 淨手機先加）—— 44 闊、成張卡高、圖示 20；撳唔會開詳情 */
html[data-dev="phone"] #bfApp .bfx .card .bfx-cshare{flex:0 0 44px;display:flex;align-items:center;justify-content:center;border:0;border-left:1px solid var(--line2);background:none;color:var(--brand-green-deep);padding:0;cursor:pointer}
html[data-dev="phone"] #bfApp .bfx .card .bfx-cshare svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
html[data-dev="phone"] #bfApp .bfx .card .bfx-cshare:active{background:var(--accent-soft)}
html[data-dev="phone"] #bfApp .bfx .card .bfx-cshare.busy svg{animation:bfxSpin 1s linear infinite;opacity:.5}
@keyframes bfxSpin{to{transform:rotate(360deg)}}
/* 新聞／主題詳情：手機邊距 16（同內文一條線）；「分享成圖片」全闊置中、黐喺詳情底（唔使碌到最底），嗰屏唯一實心掣 */
html[data-dev="phone"] .bfx-ovl{padding:12px}
html[data-dev="phone"] .bfx-modal .mbd{padding:18px 16px 20px}
html[data-dev="phone"] .bfx-modal h3{font-size:22px}
html[data-dev="phone"] .bfx-modal .cat,
html[data-dev="phone"] .bfx-modal .box .k,
html[data-dev="phone"] .bfx-modal .src{font-size:12px;letter-spacing:.08em}
html[data-dev="phone"] .bfx-modal .mbd:has(> .mact){position:sticky;bottom:0;z-index:2;background:var(--card);padding:10px 16px 12px;border-top:1px solid var(--line2)}
html[data-dev="phone"] .bfx-modal .mact{margin:0;display:block}
html[data-dev="phone"] .bfx-modal .mact .bfx-sharebtn{display:flex;width:100%;min-height:48px;justify-content:center;align-items:center;border-radius:12px;font-size:16px}
html[data-dev="phone"] .bfx-xbtn{width:44px;height:44px}
