/* ============================================================================
   久方生技 Maxima Biotech — 雙版統一設計系統  mx-system.css
   ----------------------------------------------------------------------------
   定位：全站「單一設計語言層」。公開版（投資人）與內部版（DD 戰情室）
        共用同一套 token、同一組元件、同一種排版節奏；差異只由兩個參數控制：

            body.sys-public    公開版：電影感、大留白、大數字、故事導軌
            body.sys-internal  內部版：高密度、等寬數據、可稽核表格

   載入順序（必須最後）：
        max-layout.css → max-brand.css → iv-simple.css / iv.css
        → mx-version.css → mx-system.css        ← 本檔

   設計原則（對應憲法）
        第27①條　單一渲染實作：本檔是唯一的視覺層，不新增第三條私接通道。
        第36④⑤條　版面一致：兩版共用同一元件表，不各自發明。
        第37①條　公開版不出現我方比對結論：本檔只管「怎麼呈現」，不管「呈現什麼」；
                 版本切換器在公開版只露 EN，不 advertising 內部版。
   ========================================================================== */

/* ── 0. 設計代幣 ───────────────────────────────────────────────────────── */
:root{
  /* 深海軍藍系（主舞台） */
  --sys-ink:#061A30;
  --sys-navy:#0A2E52;
  --sys-navy-2:#12417F;
  --sys-blue:#006CB4;
  --sys-blue-lt:#3E9BD6;
  --sys-teal:#18A884;
  --sys-teal-lt:#2FC4A0;
  --sys-glow:rgba(24,168,132,.22);

  /* 中性 */
  --sys-white:#FFFFFF;
  --sys-paper:#F7FAFD;
  --sys-line:#DFE7F0;
  --sys-line-soft:#EDF2F7;
  --sys-text:#2C4055;
  --sys-muted:#63748A;
  --sys-faint:#94A3B5;

  /* 語意 */
  --sys-ok:#0E7C45;
  --sys-warn:#B26A00;
  --sys-risk:#A32D2D;
  --sys-unknown:#5B48A8;

  /* 尺度 */
  --sys-r:16px;
  --sys-r-sm:10px;
  --sys-gap:26px;
  --sys-maxw:1180px;
  --sys-shadow:0 1px 3px rgba(6,26,48,.05),0 8px 28px rgba(6,26,48,.06);
  --sys-shadow-lift:0 2px 6px rgba(6,26,48,.07),0 18px 44px rgba(6,26,48,.13);
  --sys-ease:cubic-bezier(.22,.68,.32,1);
}

/* 公開版：呼吸感 */
body.sys-public{
  --sys-gap:30px;
  --sys-lead:1.8;
}
/* 內部版：密度 */
body.sys-internal{
  --sys-gap:18px;
  --sys-lead:1.68;
  --sys-maxw:1440px;
}

html{scroll-behavior:smooth}
body{
  background:
    radial-gradient(1200px 520px at 82% -8%,rgba(0,108,180,.055),transparent 62%),
    radial-gradient(900px 420px at 8% 4%,rgba(24,168,132,.05),transparent 60%),
    var(--sys-paper);
  min-height:100vh;
}
body.sys-internal{
  background:
    linear-gradient(180deg,#EEF3F9 0,#F7FAFD 240px),
    var(--sys-paper);
}

/* 全站字級節奏 */
.s-wrap, .mx-wrap{max-width:var(--sys-maxw); margin-left:auto; margin-right:auto}
body.sys-public .s-wrap{
  padding-top:26px;
  padding-bottom:64px;
}

/* 公開版各章節統一置中，與 Hero 標題區左右對齊 */
body.sys-public > .s-bignums,
body.sys-public > .s-claim,
body.sys-public > .s-timeline,
body.sys-public > .s-kpinote,
body.sys-public > .s-row,
body.sys-public > .s-list,
body.sys-public > .s-more,
body.sys-public > .s-sech,
body.sys-public > .s-vs,
body.sys-public > .s-tree,
body.sys-public > .s-fig3,
body.sys-public > .s-fig6,
body.sys-public > .s-wrap.pm-wrap,
body.sys-public > .mm-embed,
body.sys-public > section,
body.sys-public > p{
  max-width:var(--sys-maxw);
  margin-left:auto;
  margin-right:auto;
  padding-left:40px;
  padding-right:40px;
}

/* ══════════════════════════════════════════════════════════════════════
   1. 品牌列（兩版共用：深海軍藍 ＋ 青綠光暈）
   ══════════════════════════════════════════════════════════════════════ */
.mx-head{position:sticky; top:0; z-index:60}
.mx-brandbar{
  background:
    radial-gradient(560px 120px at 84% 50%,var(--sys-glow),transparent 70%),
    linear-gradient(100deg,var(--sys-ink) 0%,var(--sys-navy) 52%,var(--sys-navy-2) 100%);
  border-bottom:0;
  box-shadow:0 2px 18px rgba(6,26,48,.22);
  position:static;
}
.mx-brandbar-in{
  max-width:var(--sys-maxw); margin:0 auto;
  padding:8px 22px; gap:13px; min-height:57px;
}
.mx-logo{display:inline-flex; align-items:center; height:42px}
.mx-logo img{height:42px; width:auto; display:block}
.mx-brandname{
  color:#fff; font-size:15px; letter-spacing:.1em; font-weight:800;
  text-shadow:0 1px 0 rgba(0,0,0,.25);
}
.mx-brandsub{color:rgba(191,239,224,.9); font-size:10.5px; letter-spacing:.1em}
.mx-brandtag{
  margin-left:auto;
  background:linear-gradient(100deg,var(--sys-teal),var(--sys-teal-lt));
  color:#fff; font-weight:800; font-size:11px; letter-spacing:.05em;
  padding:5px 13px; border-radius:999px;
  box-shadow:0 2px 10px rgba(24,168,132,.4);
}
body.sys-internal .mx-brandtag{
  background:linear-gradient(100deg,#8A6A16,#C79A2A);
  box-shadow:0 2px 10px rgba(199,154,42,.35);
}

/* 版本切換器（僅內部版顯示三顆；公開版只露 EN） */
.mx-vswitch{display:inline-flex; gap:3px; padding:3px; border-radius:999px;
  background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.16)}
.mx-vs{
  display:inline-block; padding:4px 11px; border-radius:999px;
  font-size:11px; font-weight:700; letter-spacing:.04em;
  color:rgba(255,255,255,.72); text-decoration:none; transition:all .18s var(--sys-ease);
}
.mx-vs:hover{background:rgba(255,255,255,.16); color:#fff}
.mx-vs.on{background:#fff; color:var(--sys-navy); box-shadow:0 1px 6px rgba(0,0,0,.2)}
.mx-brandtag + .mx-vswitch{margin-left:10px}
.mx-vswitch.alone{margin-left:auto}

/* ══════════════════════════════════════════════════════════════════════
   2. 導覽列
   ══════════════════════════════════════════════════════════════════════ */
.nav{
  background:rgba(255,255,255,.92);
  backdrop-filter:saturate(180%) blur(10px);
  border-bottom:1px solid var(--sys-line);
  box-shadow:0 1px 0 rgba(6,26,48,.03),0 6px 18px rgba(6,26,48,.05);
  position:static; z-index:auto;
}
.navin{max-width:var(--sys-maxw); margin:0 auto; padding:0 22px}
.navl{display:flex; flex-wrap:wrap; gap:2px}
.navl a{
  position:relative; padding:11px 12px;
  font-size:13.5px; font-weight:600; letter-spacing:.01em;
  color:var(--sys-text); text-decoration:none; border-radius:8px 8px 0 0;
  transition:color .16s var(--sys-ease),background .16s var(--sys-ease);
}
.navl a:hover{color:var(--sys-blue); background:var(--sys-line-soft)}
.navl a.on{color:#fff; background:var(--sys-blue); font-weight:800}
.navl a.on::after{
  content:""; position:absolute; left:10px; right:10px; bottom:-1px; height:3px;
  border-radius:3px 3px 0 0;
  background:rgba(255,255,255,.6);
}
.navl a.dim{color:var(--sys-muted); font-weight:500}
.nav-sep{width:1px; background:var(--sys-line); margin:10px 8px; align-self:stretch}
body.sys-internal .navl a{font-size:13px; padding:9px 10px}

/* ══════════════════════════════════════════════════════════════════════
   3. 公開版主舞台 .s-open（電影感，但保持淺底以相容產品圖）
   ══════════════════════════════════════════════════════════════════════ */
body.sys-public .s-open{
  position:relative; overflow:hidden;
  border-radius:22px;
  padding:38px 40px 34px;
  margin-bottom:var(--sys-gap);
  background:
    radial-gradient(720px 300px at 88% -10%,rgba(24,168,132,.13),transparent 66%),
    linear-gradient(122deg,#FFFFFF 0%,#F4F9FE 58%,#EAF3FB 100%);
  border:1px solid var(--sys-line);
  box-shadow:var(--sys-shadow);
}
body.sys-public .s-open::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background-image:linear-gradient(rgba(0,108,180,.045) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(0,108,180,.045) 1px,transparent 1px);
  background-size:44px 44px;
  mask-image:linear-gradient(180deg,rgba(0,0,0,.55),transparent 78%);
  -webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.55),transparent 78%);
}
body.sys-public .s-open > *{position:relative; z-index:1}
body.sys-public .s-kicker{
  display:inline-block; font-size:11px; font-weight:800; letter-spacing:.16em;
  color:var(--sys-teal); background:rgba(24,168,132,.10);
  border:1px solid rgba(24,168,132,.28);
  padding:4px 12px; border-radius:999px; margin-bottom:14px;
}
body.sys-public .s-h1{
  font-size:clamp(30px,4.4vw,50px); line-height:1.18; font-weight:900;
  letter-spacing:-.01em; color:var(--sys-ink); margin:0 0 14px;
}
body.sys-public .s-h1 em{
  font-style:normal;
  background:linear-gradient(96deg,var(--sys-blue),var(--sys-teal));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
body.sys-public .s-lede{
  font-size:clamp(14.5px,1.45vw,17px); line-height:1.85; color:var(--sys-text);
  max-width:62ch; margin:0;
}
/* 內部版主舞台：收斂為資料標題列 */
body.sys-internal .s-open{
  border-radius:var(--sys-r); padding:16px 20px; margin-bottom:var(--sys-gap);
  background:linear-gradient(100deg,var(--sys-navy),var(--sys-navy-2));
  color:#fff; box-shadow:var(--sys-shadow);
}
body.sys-internal .s-open .s-kicker,
body.sys-internal .s-open .s-h1,
body.sys-internal .s-open .s-lede{color:#fff}
body.sys-internal .s-open .s-kicker{
  font-size:10.5px; letter-spacing:.14em; opacity:.8; font-weight:800;
}
body.sys-internal .s-open .s-h1{font-size:24px; font-weight:800; margin:2px 0 6px}
body.sys-internal .s-open .s-lede{font-size:13.5px; opacity:.92; margin:0}
body.sys-internal .s-open a{color:#BFEFE0}

/* ══════════════════════════════════════════════════════════════════════
   4. 一句話重點 .s-brief（暗色反轉面板）
   ══════════════════════════════════════════════════════════════════════ */
.s-brief{
  border-radius:var(--sys-r); overflow:hidden; margin-bottom:var(--sys-gap);
  background:linear-gradient(118deg,var(--sys-ink) 0%,var(--sys-navy) 55%,#103A66 100%);
  color:#fff; border:0; box-shadow:var(--sys-shadow-lift);
  position:relative;
}
.s-brief::after{
  content:""; position:absolute; right:-70px; top:-70px; width:240px; height:240px;
  border-radius:50%; background:radial-gradient(circle,var(--sys-glow),transparent 70%);
  pointer-events:none;
}
.s-brief-top{padding:20px 26px 14px; position:relative; z-index:1}
.s-brief-lab{
  display:inline-block; font-size:10.5px; font-weight:800; letter-spacing:.16em;
  color:#BFEFE0; border:1px solid rgba(191,239,224,.4);
  padding:3px 10px; border-radius:999px; margin-bottom:11px;
}
.s-brief-one{
  margin:0; font-size:clamp(15px,1.6vw,19px); font-weight:700; line-height:1.7; color:#fff;
}
.s-brief-one em{
  font-style:normal; color:#5FE3C0;
  border-bottom:2px solid rgba(95,227,192,.45); padding-bottom:1px;
}
.s-brief-keys{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px;
  background:rgba(255,255,255,.13); position:relative; z-index:1;
}
.s-brief-key{
  background:rgba(255,255,255,.045); padding:15px 20px 17px;
  display:flex; flex-direction:column; gap:4px;
}
.s-brief-key .n{
  font-family:var(--mx-font-num); font-size:clamp(22px,2.6vw,32px); font-weight:900;
  letter-spacing:-.02em; color:#fff; line-height:1.1;
  font-variant-numeric:tabular-nums;
}
.s-brief-key .t{font-size:12px; line-height:1.6; color:rgba(255,255,255,.76)}
.s-brief-ask{
  padding:16px 26px 20px; position:relative; z-index:1;
  border-top:1px dashed rgba(255,255,255,.16);
}
.s-brief-ask h4{
  margin:0 0 8px; font-size:10.5px; font-weight:800; letter-spacing:.14em; color:#BFEFE0;
}
.s-brief-ask ul{margin:0; padding-left:20px}
.s-brief-ask li{font-size:13px; line-height:1.85; color:rgba(255,255,255,.86)}
@media (max-width:760px){ .s-brief-keys{grid-template-columns:1fr} }

/* ══════════════════════════════════════════════════════════════════════
   5. 關鍵數字 .s-bignums / .s-bignum
   ══════════════════════════════════════════════════════════════════════ */
.s-bignums{display:grid; gap:16px; margin-bottom:var(--sys-gap)}
.s-bignums.cols3{grid-template-columns:repeat(3,minmax(0,1fr))}
.s-bignum{
  position:relative; overflow:hidden;
  background:var(--sys-white); border:1px solid var(--sys-line);
  border-radius:var(--sys-r); padding:20px 22px 18px;
  box-shadow:var(--sys-shadow);
  transition:transform .22s var(--sys-ease),box-shadow .22s var(--sys-ease);
}
.s-bignum::before{
  content:""; position:absolute; left:0; right:0; top:0; height:3px;
  background:linear-gradient(90deg,var(--sys-blue),var(--sys-teal));
  opacity:.85;
}
.s-bignum:hover{transform:translateY(-3px); box-shadow:var(--sys-shadow-lift)}
.s-bignum .n{
  display:block; font-family:var(--mx-font-num);
  font-size:clamp(28px,3.4vw,42px); font-weight:900; line-height:1.05;
  letter-spacing:-.025em; font-variant-numeric:tabular-nums;
  background:linear-gradient(96deg,var(--sys-navy),var(--sys-blue) 60%,var(--sys-teal));
  -webkit-background-clip:text; background-clip:text; color:transparent;
  margin-bottom:7px;
}
.s-bignum .n small{font-size:.44em; font-weight:800; color:var(--sys-muted);
  -webkit-text-fill-color:var(--sys-muted)}
.s-bignum .t{
  display:block; font-size:13.5px; font-weight:800; color:var(--sys-ink);
  margin-bottom:6px; letter-spacing:.01em;
}
.s-bignum .d{display:block; font-size:12.5px; line-height:1.75; color:var(--sys-muted)}
body.sys-internal .s-bignum{padding:14px 16px}
body.sys-internal .s-bignum .n{font-size:clamp(22px,2.4vw,30px)}
@media (max-width:860px){
  .s-bignums,.s-bignums.cols3{grid-template-columns:1fr}
}

/* ══════════════════════════════════════════════════════════════════════
   6. 主張帶 .s-claim
   ══════════════════════════════════════════════════════════════════════ */
.s-claim{
  border-radius:var(--sys-r); margin-bottom:var(--sys-gap);
  padding:22px 26px;
  font-size:clamp(15px,1.5vw,18px); font-weight:800; line-height:1.72;
  color:var(--sys-ink);
  background:linear-gradient(100deg,#EAF4FB,#F1FBF7);
  border:1px solid var(--sys-line);
  border-left:5px solid var(--sys-blue);
  box-shadow:var(--sys-shadow);
}
.s-claim em{
  font-style:normal; color:var(--sys-teal);
  border-bottom:2px solid rgba(24,168,132,.35); padding-bottom:1px;
}
.s-claim-sub{
  margin:10px 0 0; font-size:13px; font-weight:500; line-height:1.8;
  color:var(--sys-muted);
}

/* ══════════════════════════════════════════════════════════════════════
   7. 時序帶 .s-timeline
   ══════════════════════════════════════════════════════════════════════ */
.s-timeline{
  position:relative; margin:16px 0 var(--sys-gap);
  padding-left:26px; border-left:2px solid var(--sys-line);
}
.s-timeline::before{
  content:""; position:absolute; left:-2px; top:0; width:2px; height:100%;
  background:linear-gradient(180deg,var(--sys-teal),var(--sys-blue) 40%,transparent);
}
.s-tl-item{position:relative; padding:0 0 18px}
.s-tl-item:last-child{padding-bottom:0}
.s-tl-item::before{
  content:""; position:absolute; left:-33px; top:5px;
  width:13px; height:13px; border-radius:50%;
  background:#fff; border:3px solid var(--sys-blue);
  box-shadow:0 0 0 4px rgba(0,108,180,.10);
}
.s-tl-item:first-child::before{border-color:var(--sys-teal); box-shadow:0 0 0 4px rgba(24,168,132,.14)}
.s-tl-date{
  font-family:var(--mx-font-num); font-size:13px; font-weight:900;
  letter-spacing:.02em; color:var(--sys-blue); margin-bottom:3px;
}
.s-tl-body{font-size:clamp(13px,1.4vw,14.5px); line-height:1.8; color:var(--sys-text)}
.s-tl-body b{color:var(--sys-ink)}

/* ══════════════════════════════════════════════════════════════════════
   8. 五幕故事導軌 .mx-story
   ══════════════════════════════════════════════════════════════════════ */
.mx-story{
  border-radius:var(--sys-r); padding:22px 24px 24px; margin-bottom:var(--sys-gap);
  background:var(--sys-white); border:1px solid var(--sys-line);
  box-shadow:var(--sys-shadow);
}
.mx-story-h{margin-bottom:16px; display:flex; flex-wrap:wrap; gap:6px 12px; align-items:baseline}
.mx-story-h b{font-size:16px; font-weight:900; color:var(--sys-ink); letter-spacing:.01em}
.mx-story-h span{font-size:12.5px; color:var(--sys-muted)}
.mx-story-ol{display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px}
.mx-story-act{
  position:relative; display:flex; flex-direction:column; gap:8px;
  padding:16px 15px 14px; border-radius:var(--sys-r-sm);
  background:linear-gradient(180deg,#FBFDFF,#F4F8FC);
  border:1px solid var(--sys-line); text-decoration:none; color:inherit;
  transition:transform .2s var(--sys-ease),box-shadow .2s var(--sys-ease),border-color .2s var(--sys-ease);
}
.mx-story-act:hover{
  transform:translateY(-3px); box-shadow:var(--sys-shadow-lift);
  border-color:var(--sys-blue);
}
.mx-story-n{display:flex; align-items:center; gap:7px}
.mx-story-n i{
  flex:none; width:24px; height:24px; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  font-style:normal; font-family:var(--mx-font-num); font-size:12.5px; font-weight:900;
  color:#fff; background:linear-gradient(120deg,var(--sys-navy),var(--sys-blue));
}
.mx-story-n em{
  font-style:normal; font-size:9.5px; font-weight:800; letter-spacing:.12em;
  color:var(--sys-muted);
}
.mx-story-b{display:block}
.mx-story-b h4{margin:0 0 5px; font-size:14px; font-weight:800; color:var(--sys-ink)}
.mx-story-b p{margin:0; font-size:12px; line-height:1.72; color:var(--sys-text)}
.mx-story-go{
  margin-top:auto; font-size:11.5px; font-weight:800; color:var(--sys-blue);
  letter-spacing:.02em;
}
.mx-story-go::after{content:" →"}
@media (max-width:1080px){ .mx-story-ol{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:620px){ .mx-story-ol{grid-template-columns:1fr} }

/* ══════════════════════════════════════════════════════════════════════
   9. 揭露／補充／下一步 區塊
   ══════════════════════════════════════════════════════════════════════ */
.s-disclose{
  border-radius:var(--sys-r); padding:20px 24px; margin-bottom:var(--sys-gap);
  background:#FFFDF6; border:1px solid #F0E4C4;
  box-shadow:var(--sys-shadow);
}
.s-disclose h3{
  margin:0 0 12px; font-size:15.5px; font-weight:900; color:#7A5608;
  padding-bottom:10px; border-bottom:1px solid #F0E4C4;
}
.s-disclose p{color:#6B5320; font-size:13.2px; line-height:1.82}
.s-disclose b{color:#4E3C0C}
.s-disclose .s-timeline{margin-top:14px}

.s-next{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:var(--sys-gap)}
.s-next-box{
  border-radius:var(--sys-r); padding:18px 20px; box-shadow:var(--sys-shadow);
}
.s-next-box.limit{background:#FFF9F9; border:1px solid #F3D9D9}
.s-next-box.go{background:#F2FBF7; border:1px solid #CFE9DC}
.s-next-box h4{
  margin:0 0 8px; font-size:10.5px; font-weight:800; letter-spacing:.14em;
}
.s-next-box.limit h4{color:var(--sys-risk)}
.s-next-box.go h4{color:var(--sys-ok)}
.s-next-box p{margin:0; font-size:13px; line-height:1.8; color:var(--sys-text)}
.s-next-box a{font-weight:800; color:var(--sys-blue)}
@media (max-width:860px){ .s-next{grid-template-columns:1fr} }

.s-more{
  border-radius:var(--sys-r); padding:16px 20px; margin-bottom:var(--sys-gap);
  background:var(--sys-line-soft); border:1px dashed var(--sys-line);
  font-size:13px; color:var(--sys-muted);
}
.s-more p{margin:0; line-height:1.8}

.s-kpinote{
  font-size:12.5px; line-height:1.85; color:var(--sys-muted);
  padding:14px 18px; border-radius:var(--sys-r-sm);
  background:var(--sys-line-soft); border-left:3px solid var(--sys-faint);
  margin-bottom:var(--sys-gap);
}
.s-kpinote b{color:var(--sys-text)}

/* 證據連結 */
.s-ev{
  display:inline; font-size:11.5px; font-weight:800; color:var(--sys-blue);
  border-bottom:1px dashed rgba(0,108,180,.5); cursor:help; white-space:nowrap;
}
.s-ev::after{content:" →"}

/* ══════════════════════════════════════════════════════════════════════
   10. 表格（內部版 DD 主力）
   ══════════════════════════════════════════════════════════════════════ */
table{
  border-radius:var(--sys-r-sm); border:1px solid var(--sys-line);
  box-shadow:var(--sys-shadow); font-size:13.2px;
}
th{
  background:linear-gradient(180deg,#F3F8FC,#EAF2F9);
  color:var(--sys-navy); font-size:12.2px; font-weight:800; letter-spacing:.02em;
  border-bottom:1px solid var(--sys-line);
  position:sticky; top:calc(var(--mx-bar-h,57px) + 44px); z-index:2;
}
tbody tr:nth-child(even){background:#FAFCFE}
tbody tr:hover{background:#EEF6FC}
td.n{color:var(--sys-blue); font-weight:700}
tr.hl{background:linear-gradient(90deg,#E8F4FC,#F3FAF8) !important}
body.sys-internal table{font-size:12.5px}
body.sys-internal th,body.sys-internal td{padding:7px 10px}
body.sys-internal th{position:static}

/* 證據等級徽章 */
.g{font-family:var(--mx-font-num); font-size:10.5px; font-weight:900; letter-spacing:.04em}
.gA{background:#E1F5EA; color:var(--sys-ok)}
.gB{background:#FCF2DC; color:var(--sys-warn)}
.gC{background:#FAE6E6; color:var(--sys-risk)}
.gX{background:#EAE6F7; color:var(--sys-unknown)}

/* ══════════════════════════════════════════════════════════════════════
   11. 版本條 ＋ 免責聲明
   ══════════════════════════════════════════════════════════════════════ */
.mx-vbar{
  background:linear-gradient(100deg,var(--sys-ink),var(--sys-navy) 70%,#103A66);
  color:#fff; padding:11px 0; margin-top:34px;
}
.mx-vbar-in{
  max-width:var(--sys-maxw); margin:0 auto; padding:0 22px;
  display:flex; flex-wrap:wrap; gap:8px 16px; align-items:center;
  font-size:12px; line-height:1.7;
}
.mx-vbar-tag{
  display:inline-block; padding:3px 11px; border-radius:999px;
  font-size:10.5px; font-weight:800; letter-spacing:.05em; color:#fff;
  background:linear-gradient(100deg,var(--sys-teal),var(--sys-teal-lt));
}
.mx-vbar-tag.int{background:linear-gradient(100deg,#8A6A16,#C79A2A)}
.mx-vbar-txt{color:rgba(255,255,255,.82)}
.mx-vbar-txt b{color:#fff}
.mx-disc{
  max-width:var(--sys-maxw); margin:0 auto; padding:14px 22px 30px;
  font-size:11.5px; line-height:1.85; color:var(--sys-muted);
}
.mx-disc b{color:var(--sys-text)}

/* ══════════════════════════════════════════════════════════════════════
   12. 頁尾
   ══════════════════════════════════════════════════════════════════════ */
.mx-foot{
  background:linear-gradient(100deg,var(--sys-ink) 0%,var(--sys-navy) 60%,#103A66 100%);
  color:rgba(255,255,255,.78); padding:26px 0 24px;
  position:relative; overflow:hidden;
}
.mx-foot::after{
  content:""; position:absolute; left:-60px; bottom:-90px; width:260px; height:260px;
  border-radius:50%; background:radial-gradient(circle,var(--sys-glow),transparent 70%);
  pointer-events:none;
}
.mx-foot-in{max-width:var(--sys-maxw); margin:0 auto; padding:0 22px; position:relative; z-index:1;
  font-size:12.5px; line-height:1.9}
.mx-foot-brand{
  display:flex; align-items:center; gap:11px; margin-bottom:10px;
  padding-bottom:12px; border-bottom:1px solid rgba(255,255,255,.14);
}
.mx-foot-brand img{
  height:26px; width:auto; display:block;
}
.mx-foot-brand span{
  font-family:var(--mx-font-num); font-size:12.5px; font-weight:800;
  letter-spacing:.09em; color:#fff;
}
.mx-foot b{color:#fff}
.mx-foot-in br + *{margin-top:2px}
html{scroll-padding-top:130px}
@media (max-width:760px){ html{scroll-padding-top:150px} }
.mx-foot .ft-ver{font-size:11.5px; color:rgba(255,255,255,.72); margin:10px 0 0; line-height:1.7}
.mx-foot .ft-disc{font-size:11px; color:rgba(255,255,255,.6); margin:6px 0 0; line-height:1.7}
.mx-foot .ft-disc b{color:#fff}
.s-tl-item.muted{opacity:.82}
.s-tl-item.muted .s-tl-date{color:var(--sys-muted)}

/* ══════════════════════════════════════════════════════════════════════
   13. 內部版專屬：卡片／網格密度
   ══════════════════════════════════════════════════════════════════════ */
body.sys-internal .card,
body.sys-internal .mx-card{
  border-radius:var(--sys-r-sm); box-shadow:var(--sys-shadow);
  border:1px solid var(--sys-line);
}
body.sys-internal .mx-wrap{padding-bottom:52px}
body.sys-internal h2{
  font-size:19px; font-weight:900; color:var(--sys-ink);
  padding-bottom:9px; margin:26px 0 14px;
  border-bottom:2px solid var(--sys-line);
}
body.sys-internal h3{font-size:15.5px; font-weight:800; color:var(--sys-navy); margin:20px 0 10px}
.note{border-radius:0 var(--sys-r-sm) var(--sys-r-sm) 0; border-left-width:4px}

/* 通用小工具 */
.sys-grid{display:grid; gap:14px}
.sys-grid.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.sys-grid.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.sys-grid.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:980px){ .sys-grid.g3,.sys-grid.g4{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:640px){ .sys-grid{grid-template-columns:1fr !important} }

/* ══════════════════════════════════════════════════════════════════════
   14. 動画與 RWD
   ══════════════════════════════════════════════════════════════════════ */
@media (prefers-reduced-motion:reduce){
  *{transition:none !important; animation:none !important; scroll-behavior:auto}
}
@media (max-width:860px){
  body.sys-public .s-open{padding:26px 20px 24px; border-radius:16px}
  body.sys-public > .s-bignums,
  body.sys-public > .s-claim,
  body.sys-public > .s-timeline,
  body.sys-public > .s-kpinote,
  body.sys-public > .s-row,
  body.sys-public > .s-list,
  body.sys-public > .s-more,
  body.sys-public > .s-sech,
  body.sys-public > .s-vs,
  body.sys-public > .s-tree,
  body.sys-public > .s-fig3,
  body.sys-public > .s-fig6,
  body.sys-public > .s-wrap.pm-wrap,
  body.sys-public > .mm-embed,
  body.sys-public > section,
  body.sys-public > p{
    padding-left:20px;
    padding-right:20px;
  }
  .mx-brandbar-in{padding:7px 14px; gap:10px}
  .mx-vswitch{display:none}
  .navin{padding:0 12px}
  .navl a{font-size:12.5px; padding:9px 8px}
  .mx-vbar-in,.mx-disc,.mx-foot-in{padding-left:14px; padding-right:14px}
}
@media (max-width:760px){ :root{--mx-bar-h:55px} }

/* ── 15. 列印（投資人會把公開版印出來） ─────────────────────────────── */
@media print{
  body{background:#fff; font-size:11pt}
  .nav,.mx-vswitch{display:none !important}
  .mx-brandbar{position:static; background:var(--sys-navy) !important; -webkit-print-color-adjust:exact; print-color-adjust:exact}
  .s-bignum,.mx-story,.s-brief,.s-claim,.s-disclose,.s-next-box,.mx-foot,.mx-vbar{
    box-shadow:none !important; break-inside:avoid; page-break-inside:avoid;
    -webkit-print-color-adjust:exact; print-color-adjust:exact;
  }
  .s-bignum:hover,.mx-story-act:hover{transform:none !important}
  th{position:static}
  a{text-decoration:none; color:inherit}
  a[href^="http"]::after{content:" (" attr(href) ")"; font-size:8pt; color:#666}
}
