/* misaye.com - v6 港灣藍金 Harbor。樣張與取捨見 design/2026-10-v6/ */
:root{
  --bg:#FFFFFF; --card:#FFFFFF; --soft:#F2F5FA; --line:#E2E7EF;
  --ink:#0E1B33; --body:#36445A; --body2:#36445A; --mut:#5E6B80; --mut2:#5E6B80;
  --brand:#143F86; --brand-d:#0D2E68; --link:#1C4FA6; --pin:#F2B33D; --pin-soft:#FFF5DF;
  --ph:#EEF2F8; --ph-line:#D4DCE8; --ph-txt:#55657C; --cta-bg:#EEF3FB;
  --r-photo:16px; --r-thumb:10px; --dark:#0E1B33; --max:1180px;
  --sans:'Noto Sans TC',system-ui,sans-serif;
  --latin:'Space Grotesk','Noto Sans TC',system-ui,sans-serif;
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:90px}
body{background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:18px;
 line-height:1.9;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:var(--link);text-decoration:none}
a:hover{color:var(--brand-d)}
img,svg{max-width:100%;height:auto}
b,strong{font-weight:700;color:var(--ink)}
h1,h2,h3,h4{color:var(--ink);line-height:1.35}

/* 版面骨架 */
.container{max-width:var(--max);margin:0 auto;padding:0 28px}
.wide{--max:1180px}
.stack{display:flex;flex-direction:column}
.section{margin-top:80px}
.card{background:none;border-radius:0;padding:0}
.grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fill,minmax(270px,1fr))}
.grid--2{display:grid;gap:18px;grid-template-columns:1fr 1fr}
.grid--3{display:grid;gap:18px;grid-template-columns:repeat(3,1fr)}
.grid--4{display:grid;gap:18px;grid-template-columns:repeat(4,1fr)}
.hero{display:grid;gap:48px;grid-template-columns:1.15fr .85fr;align-items:start}
.hero--index{grid-template-columns:1.25fr .75fr}
/* 主視覺右欄（指標卡＋照片）：直排要有間距，否則照片佔位貼著指標卡 */
.hero>.stack{gap:18px}
.hero--region{grid-template-columns:1fr 300px;gap:48px;align-items:start}
.sidecol{position:sticky;top:100px;display:flex;flex-direction:column;gap:18px}

/* 頁首 */
.site-head{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);
 border-bottom:1px solid var(--line);backdrop-filter:saturate(1.4) blur(12px)}
.site-head__in{max-width:var(--max);margin:0 auto;padding:14px 28px;display:flex;
 align-items:center;gap:28px}
.brand{display:flex;align-items:center;gap:10px;color:var(--ink)}
.brand:hover{color:var(--ink)}
.brand__mark{width:52px;height:34px;display:block;flex:0 0 auto}
.brand__name{display:flex;align-items:baseline;gap:8px;font-size:20px;font-weight:900;
 letter-spacing:.02em;white-space:nowrap}
.brand__en{font-family:var(--latin);font-size:11px;font-weight:700;letter-spacing:.2em;
 text-transform:uppercase;color:var(--mut)}
.nav{display:flex;gap:4px;margin-left:auto}
.nav a{font-size:15px;font-weight:700;color:var(--ink);padding:8px 14px;border-radius:999px}
.nav a:hover{background:var(--soft);color:var(--ink)}
.head-cta{font-size:15px;font-weight:700;padding:10px 20px;border-radius:10px;
 background:var(--brand);color:#fff;white-space:nowrap}
.head-cta:hover{background:var(--brand-d);color:#fff}
.nav-chips{display:none}

/* 麵包屑 */
.crumb{max-width:var(--max);margin:0 auto;padding:22px 28px 0;display:flex;flex-wrap:wrap;
 gap:8px;align-items:center;font-size:14px;color:var(--mut)}
.crumb a{color:var(--mut);padding:8px 0;display:inline-block}
.crumb a:hover{color:var(--link)}
.crumb b{color:var(--ink);font-weight:600}

/* 標籤 */
.pills{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}
.pill{font-size:13px;font-weight:700;letter-spacing:.04em;padding:5px 14px;border-radius:6px;
 display:inline-block;background:#E8EEF8;color:#143F86}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{font-size:15px;font-weight:600;background:var(--soft);color:var(--ink);padding:8px 16px;
 border-radius:999px;display:inline-block;transition:background .15s,color .15s}
a.chip:hover{background:var(--brand);color:#fff}
.eyebrow{font-family:var(--latin);font-size:13px;font-weight:700;letter-spacing:.16em;
 color:var(--brand);text-transform:uppercase;margin-bottom:14px;display:flex;align-items:center;gap:10px}
.eyebrow::before{content:"";width:22px;height:3px;border-radius:2px;background:var(--pin);flex:0 0 auto}

/* 標題 */
h1{font-size:44px;font-weight:900;line-height:1.28;letter-spacing:-.01em;margin-bottom:22px;
 text-wrap:pretty}
.h1--home{font-size:54px;line-height:1.18}
.h1--index{font-size:46px}
h2{font-size:30px;font-weight:900;line-height:1.4;letter-spacing:-.01em;margin-bottom:20px}
.h2--home{font-size:34px}
.h2--sm{font-size:22px}
.lead{font-size:20px;line-height:1.85;color:var(--body);max-width:780px;margin-bottom:26px}
.lead b{color:var(--ink)}
.meta-row{display:flex;flex-wrap:wrap;gap:6px 22px;margin-top:26px;font-size:14px;color:var(--mut)}
.headrow{display:flex;align-items:baseline;justify-content:space-between;gap:16px;
 margin-bottom:20px;flex-wrap:wrap}
.headrow h2{margin-bottom:0}
.headrow a{font-size:15px;font-weight:700;padding:8px 0;display:inline-block}


/* 按鈕 */
.btn{display:inline-block;font-size:16px;font-weight:700;color:#fff;background:var(--brand);
 padding:14px 28px;border-radius:10px;transition:background .15s}
.btn:hover{background:var(--brand-d);color:#fff}
.btn--ghost{background:var(--soft);color:var(--ink)}
.btn--ghost:hover{background:#E3E9F3;color:var(--ink)}
.btn--block{display:block;text-align:center;padding:13px}
.btn--white{background:#fff;color:var(--brand-d)}
.btn--white:hover{background:#E8EEF8;color:var(--brand-d)}
.btn-row{display:flex;flex-wrap:wrap;gap:12px}

/* 數字格 */
.kpi{border-radius:14px;padding:22px}
.kpi__n{font-family:var(--latin);font-size:38px;font-weight:700;letter-spacing:-.02em;line-height:1.1}
.kpi__l{font-size:14px;font-weight:500;margin-top:6px}
.kpi--sm .kpi__n{font-size:30px}

/* 側欄資訊卡（舊版是深色卡；新版不用暗色底） */
.dark-card{background:var(--soft);border-radius:16px;padding:24px;color:var(--ink)}
.dark-card h2,.dark-card h3{color:var(--ink)}
.dark-card__k{font-size:12px;font-weight:800;letter-spacing:.16em;color:var(--mut);
 text-transform:uppercase;margin-bottom:8px}
.dark-card p{color:var(--body);font-size:15.5px;line-height:1.85}
.dark-card a:not(.btn){color:var(--link)}
.dark-card__t{font-size:17px;font-weight:800;line-height:1.5;margin-bottom:14px}
.metric{display:flex;align-items:center;gap:14px;margin-top:12px}
.metric__n{font-size:14px;width:120px;flex:0 0 auto;color:var(--ink)}
.metric__t{flex:1;height:8px;border-radius:99px;background:#E1E7F1;overflow:hidden;display:block}
.metric__f{display:block;height:8px;border-radius:99px}

/* 方法論卡 */
.mcard{background:#fff;border:1px solid var(--line);border-radius:16px;padding:26px 24px;
 display:block;color:var(--ink);transition:border-color .15s,transform .15s}
.mcard:hover{border-color:var(--brand);transform:translateY(-2px);color:var(--ink)}
.mcard__no{width:38px;height:38px;border-radius:50% 50% 50% 6px;display:flex;align-items:center;
 justify-content:center;font-family:var(--latin);font-size:15px;font-weight:700;margin-bottom:16px}
.mcard h3{font-size:20px;font-weight:800;margin-bottom:8px}
.mcard p{font-size:15.5px;color:var(--body);line-height:1.8}
.mcard__tag{font-family:var(--latin);font-size:12.5px;font-weight:700;letter-spacing:.08em;
 margin-top:14px;display:block}

/* 連結卡與清單 */
.lcard{background:#fff;border:1px solid var(--line);border-radius:12px;padding:20px;
 display:flex;flex-direction:column;gap:8px;color:var(--ink);transition:border-color .15s}
.lcard:hover{border-color:var(--brand);color:var(--ink)}
.lcard--w{background:#fff;border-top:3px solid var(--pin)}
.lcard__k{font-size:12.5px;font-weight:800;letter-spacing:.1em;color:var(--brand)}
.lcard__t{font-size:16px;font-weight:700;line-height:1.6}
.lcard__m{font-size:13.5px;color:var(--mut);margin-top:auto}
.rowlist{display:flex;flex-direction:column;border-top:2px solid var(--brand)}
.rowlist a{display:grid;grid-template-columns:1fr 140px;gap:16px;align-items:center;
 padding:16px 4px;border-bottom:1px solid var(--line);color:var(--ink);transition:background .15s}
.rowlist a:hover{background:var(--soft)}
.rowlist__t{font-size:16.5px;font-weight:700;line-height:1.55}
.rowlist__m{font-size:13.5px;font-weight:700;color:var(--brand-d);text-align:right}
.rowlist--3 a{grid-template-columns:120px 1fr 90px}
.rowlist__d{font-size:15px;color:var(--body);line-height:1.7}
.rowlist__n{font-size:13px;font-weight:700;padding:4px 12px;border-radius:999px;text-align:center;
 white-space:nowrap}

/* 文章版面：左目錄、右正文 */
.shell{max-width:var(--max);margin:0 auto;padding:48px 28px 0;display:grid;
 grid-template-columns:260px minmax(0,1fr);gap:64px;align-items:start}
.shell--wide{grid-template-columns:minmax(0,1fr)}
.shell--region{grid-template-columns:minmax(0,1fr) 300px}
.toc{position:sticky;top:96px;display:flex;flex-direction:column;gap:22px}
.toc__k{font-size:12px;font-weight:800;letter-spacing:.18em;color:var(--mut);margin-bottom:10px}
.toc__list{display:flex;flex-direction:column}
.toc__list a{display:flex;gap:12px;font-size:14.5px;line-height:1.55;color:var(--body);padding:7px 0}
.toc__list a:hover{color:var(--link)}
.toc__no{font-family:var(--latin);font-weight:700;font-size:13px;color:var(--brand);flex:0 0 22px}
.shell>.stack{max-width:760px}
/* 文章頁：單欄，不用側邊欄（2026-10-11 使用者指定）。標題、麵包屑、正文對齊同一欄；
   主視覺照片維持寬版 */
.shell--article,.container--article,body:has(.shell--article) .crumb{max-width:816px}
.shell--article{grid-template-columns:minmax(0,1fr)}
.shell--article>.stack{max-width:none}
.toc--inline{position:static;display:block;margin-bottom:56px;padding:18px 22px;
 border-left:3px solid var(--brand);border-radius:0 12px 12px 0;background:var(--soft)}
.toc--inline>summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:12px;margin:0}
.toc--inline>summary::-webkit-details-marker{display:none}
.toc--inline>summary::after{content:"展開";margin-left:auto;font-size:13px;font-weight:700;
 letter-spacing:0;color:var(--brand)}
.toc--inline[open]>summary::after{content:"收合"}
.toc--inline[open]>summary{margin-bottom:12px}
.toc__n{font-weight:600;letter-spacing:0;color:var(--mut)}
.shell--region>.stack,.shell--wide>.stack{max-width:none}
.stack>.card+.card{margin-top:72px}
.stack>.card>h2{font-size:30px;margin-bottom:24px}
.secno{display:flex;align-items:center;gap:10px;font-family:var(--latin);font-size:14px;
 font-weight:700;letter-spacing:.14em;color:var(--brand);margin-bottom:8px}
.secno::before{content:"";width:20px;height:3px;border-radius:2px;background:var(--pin);flex:0 0 auto}

/* 內文排版（既有文章重新上妝） */
.prose{font-size:18px;color:var(--ink);line-height:1.9}
.prose>*+*{margin-top:22px}
.prose p{text-align:left}
.prose h3{font-size:22px;font-weight:800;margin-top:44px;line-height:1.5}
.prose h4{font-size:19px;font-weight:800;margin-top:32px}
.prose h5,.prose h6{font-size:17px;font-weight:800;margin-top:24px}
.prose ul,.prose ol{padding-left:1.3em}
.prose li+li{margin-top:10px}
.prose li::marker{color:var(--pin)}
/* 資料來源（media._sources，參考 roetta 的 .src）：參考資料比內文小一級，標題當連結、網址灰字在下 */
.prose .src{list-style:none;padding:0;margin:0 0 8px;border-top:1px solid var(--line)}
.prose .src li{margin:0;padding:12px 0;border-bottom:1px solid var(--line);font-size:15px;line-height:1.7}
.prose .src a{font-weight:700;text-decoration-thickness:1px}
.prose .src span{display:block;font-size:13px;line-height:1.6;color:var(--mut);margin-top:2px;overflow-wrap:anywhere}
.prose .src-note{font-size:14px;line-height:1.9;color:var(--mut);margin-top:12px}
.prose a{color:var(--link);text-decoration:underline;text-decoration-thickness:1px;
 text-underline-offset:4px}
.prose blockquote{border-left:3px solid var(--pin);padding:2px 0 2px 20px;color:var(--body)}
.prose hr{display:none}
.prose em{font-style:normal;color:var(--ink)}
.prose sup{font-size:12px}
.prose code,.prose .code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
 font-size:.88em;background:var(--soft);border-radius:5px;padding:1px 6px}
.prose pre{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:14px;
 line-height:1.75;white-space:pre;overflow-x:auto;padding:20px 22px;border-radius:14px;
 background:var(--soft);color:var(--body)}
.prose pre code{background:none;padding:0;font-size:inherit}
.tablewrap{overflow-x:auto;border-top:2px solid var(--brand);border-bottom:1px solid var(--line)}
.prose table{border-collapse:collapse;width:100%;font-size:15.5px;line-height:1.7}
.prose th,.prose td{padding:13px 14px;text-align:left;vertical-align:top;
 border-bottom:1px solid var(--line)}
.prose th{font-size:13.5px;font-weight:800;letter-spacing:.06em;color:var(--mut);white-space:nowrap}
.prose tr:last-child td{border-bottom:0}
.prose td{text-wrap:balance}
.prose table:has(tr>:nth-child(3)){min-width:540px}
.prose td.nw{white-space:nowrap}
/* 第一欄多是短標籤：不拆字，只在標點、空格處換行（參考 nomuula）；三欄以上的表格手機最少 540px、改左右捲動 */
.prose td:first-child{word-break:keep-all;overflow-wrap:normal}
/* 平板以上所有格子都只在標點、空格處換行：表格格子多是「名詞、名詞」短句，拆在詞中間（「餘額有多／少」）比多一行難讀 */
@media (min-width:768px){.prose td{word-break:keep-all;overflow-wrap:break-word}}
@media (min-width:1081px){.shell--article .prose .tablewrap{margin-left:-96px;margin-right:-96px}}
.figbox{background:var(--soft);border-radius:14px;padding:18px;overflow-x:auto}
.figbox svg,.prose figure svg{display:block;max-width:100%;height:auto;margin:0 auto}
.prose figure{margin:0;overflow-x:auto}
.prose figcaption{font-size:14px;color:var(--mut);margin-top:12px}
.prose .muted,.muted{color:var(--mut);font-size:15px}
.prose .rule{border:0;border-top:1px solid var(--line);height:0;margin:32px 0;padding:0;display:block}
.kw{font-weight:700;color:var(--ink)}
/* 長串網址參數（utm_source=…&utm_medium=…）沒有斷行點，手機會把整頁撐寬 */
.prose,.cal,.subcard,.lcard,.rowlist{overflow-wrap:break-word}
.prose :not(pre)>code,.prose .code,.prose .mono,.prose .kbd,.kw{overflow-wrap:anywhere}
pre{max-width:100%;overflow-x:auto}
/* 原稿有些 <pre> 圖表寫死深色行內底色（#0f172a 之類）；<pre> 原樣保留，只能在這裡蓋掉 */
pre[style]{background:var(--soft)!important;color:var(--body)!important;border-color:var(--line)!important}

/* 提示框：全站唯一的強調框，左側色條 */
.cal{background:var(--pin-soft);border-left:4px solid var(--bar,var(--pin));
 border-radius:0 12px 12px 0;padding:20px 24px;font-size:17px;line-height:1.85;color:var(--ink)}
.cal>*+*{margin-top:10px}
.cal p{text-align:left}
.cal__k{font-family:var(--latin);font-size:13px;font-weight:700;letter-spacing:.12em;
 text-transform:uppercase;display:block;margin-bottom:6px}

/* 一排短標籤 */
.chiprow{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.chiprow>*{background:var(--soft);border-radius:999px;padding:5px 14px;font-size:14.5px;
 font-weight:600;color:var(--ink);line-height:1.6}
.chiprow>a{color:var(--link)}
.prose .chiprow>*+*,.subcard .chiprow>*+*,.cal .chiprow>*+*{margin-top:0}

/* 子格：只有真的「一格一張子卡」時才分欄；裸的 p/ul 照一般段落排 */
.subgrid{display:block}
.subgrid>*+*{margin-top:18px}
.subgrid:has(>.subcard){display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.subgrid:has(>.subcard)>*+*,.prose .subgrid:has(>.subcard)>*{margin-top:0}
.subcard{background:var(--soft);border-radius:14px;padding:22px}
.subcard>*+*{margin-top:10px}

/* 照片佔位：灰藍底＋虛線框＋相機圖示，產圖後整塊換成 <img> */
.photo{position:relative;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;
 gap:4px;padding:22px 26px;min-height:140px;border-radius:var(--r-photo);overflow:hidden;color:var(--ph-txt);
 background:var(--ph);border:1px dashed var(--ph-line)}
.photo::before{content:"";position:absolute;left:50%;top:42%;width:44px;height:44px;margin:-34px 0 0 -22px;
 opacity:.55;background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235B6B82' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 8h3l2-3h6l2 3h3v11H4z'/%3E%3Ccircle cx='12' cy='13' r='3.5'/%3E%3C/svg%3E")}
.photo__k{position:relative;font-family:var(--latin);font-size:11px;font-weight:700;letter-spacing:.2em;
 text-transform:uppercase}
.photo__d{position:relative;max-width:100%;font-size:14px}
.photo--hero{aspect-ratio:1600/640;min-height:220px}
.photo--wide{height:230px}
.photo--card{aspect-ratio:16/9;min-height:0;border-radius:0}
.pcard{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;
 display:block;color:var(--ink);transition:border-color .15s,transform .15s}
.pcard:hover{border-color:var(--brand);transform:translateY(-2px);color:var(--ink)}
.pcard__b{padding:20px 22px 22px}
.pcard__t{font-size:20px;font-weight:800}
.pcard__d{font-size:15px;color:var(--body);line-height:1.75;margin-top:8px}
.pcard__m{font-size:13.5px;font-weight:600;color:var(--mut);margin-top:10px;display:block}

/* 轉換區 */
.cta{max-width:var(--max);margin:96px auto 0;padding:44px;display:grid;
 grid-template-columns:1.3fr 1fr;gap:40px;align-items:center;border-radius:18px;
 background:var(--cta-bg);color:var(--ink)}
.stack .cta,.container .cta{margin:96px 0 0}
.cta--home{padding:52px 48px}
.cta h2{color:var(--ink);font-size:28px;line-height:1.4;margin-bottom:12px}
.cta p{font-size:16.5px;color:var(--body);line-height:1.85}
.cta__panel{display:flex;flex-direction:column;gap:12px}
.cta__note{font-size:14px;color:var(--body)}
.cta .btn--white{background:var(--brand);color:#fff}
.cta .btn--white:hover{background:var(--brand-d);color:#fff}

/* 延伸閱讀 */
.stack>.card:last-child:has(.headrow){margin-top:88px}

/* 頁尾／手機行動列 */
.site-foot{max-width:var(--max);margin:96px auto 0;padding:28px 28px 48px;
 border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:12px 24px;
 justify-content:space-between;font-size:14px;color:var(--mut)}
.site-foot a{color:var(--mut)}
.site-foot a:hover{color:var(--link)}
.site-foot__legal{display:flex;flex-wrap:wrap;gap:6px 20px}
.site-foot__cats{flex-basis:100%;display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 20px;
 padding-bottom:16px;border-bottom:1px solid var(--line);font-size:15px}
.site-foot__cats a{color:var(--body)}
.site-foot__k{font-size:12px;font-weight:800;letter-spacing:.18em;color:var(--mut)}
/* 連結膠囊列：「全部文章」頁的依身分／欄目找 */
.chiplinks{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.chiplinks__k{font-size:13px;font-weight:800;letter-spacing:.12em;color:var(--mut);margin-right:4px}
.chiplinks a{display:inline-block;padding:8px 16px;border-radius:999px;background:var(--soft);
 color:var(--ink);font-size:15px;font-weight:600}
.chiplinks a:hover{background:var(--brand);color:#fff}
.legal h2{font-size:22px;margin-top:40px;margin-bottom:12px}
.legal h2:first-child{margin-top:0}
.action-bar{display:none}

/* ── v6 新元件：首頁主視覺、文章主圖、照片清單（樣張 design/2026-10-v6/）──────────── */
/* 標題區：v5 右側留給等高線的 34% 不用了 */
.container>.card:has(>h1){padding:40px 0 8px}
/* 首頁主視覺：文字＋照片 */
.mhero{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:56px;align-items:center}
.mhero__txt .lead{margin-bottom:0}
.photo--mhero{aspect-ratio:4/3;min-height:0}
/* 文章主圖：比正文欄寬一點 */
.post-hero{max-width:1000px;margin:36px auto 0;padding:0 28px}
.photo--post{aspect-ratio:16/9;min-height:0}
/* 文章清單（首頁、身分頁、欄目頁、全部文章）：左縮圖、右文字；首頁最新一篇放大 */
.postlist{display:flex;flex-direction:column;border-top:2px solid var(--brand)}
.pitem{display:grid;grid-template-columns:240px minmax(0,1fr);gap:28px;align-items:start;color:var(--ink);
 padding:24px 0;border-bottom:1px solid var(--line)}
.pitem:hover{color:var(--ink)}
.pitem:hover .pitem__t{color:var(--link)}
.photo--thumb{aspect-ratio:16/9;min-height:0;padding:10px 12px;border-radius:var(--r-thumb)}
.photo--thumb .photo__d{display:none}
.photo--thumb::before{width:30px;height:30px;margin:-15px 0 0 -15px}
.pitem__b{display:flex;flex-direction:column;gap:6px;min-width:0}
.pitem__k{font-size:13px;font-weight:700;letter-spacing:.04em;color:var(--brand)}
.pitem__t{font-size:21px;font-weight:800;line-height:1.5;transition:color .15s}
.pitem__d{font-size:15.5px;line-height:1.8;color:var(--body);display:-webkit-box;-webkit-line-clamp:2;
 -webkit-box-orient:vertical;overflow:hidden}
.pitem__m{font-size:13.5px;color:var(--mut)}
@media (min-width:761px){
  .pitem--lead{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:36px;padding:32px 0}
  .pitem--lead .pitem__t{font-size:28px;line-height:1.45}
  .pitem--lead .pitem__d{-webkit-line-clamp:4}
  .pitem--lead .photo--thumb{border-radius:var(--r-photo)}
}
@media (max-width:1080px){
  .mhero{grid-template-columns:minmax(0,1fr);gap:32px}
  .pitem{grid-template-columns:200px minmax(0,1fr);gap:20px}
}
@media (max-width:760px){
  .post-hero{padding:0;margin-top:24px}
  .photo--post{border-radius:0;border-left:0;border-right:0}
  .pitem{grid-template-columns:112px minmax(0,1fr);gap:14px;padding:18px 0}
  .pitem__t{font-size:17px}
  .pitem__d{display:none}
  .photo--thumb{aspect-ratio:1/1}
  .photo--thumb::before{width:24px;height:24px;margin:-12px 0 0 -12px}
  .photo--thumb .photo__k{display:none}
}

/* 實景照片（取代空白佔位）＋署名 */
.photo-img{display:block;width:100%;height:auto;object-fit:cover;background:var(--ph)}
.post-hero .photo-img{aspect-ratio:16/9;border-radius:var(--r-photo)}
.mhero__fig{margin:0}
.mhero__fig .photo-img{aspect-ratio:4/3;border-radius:var(--r-photo)}
.pitem .photo-img{aspect-ratio:16/9;border-radius:var(--r-thumb)}
.pitem--lead .photo-img{border-radius:var(--r-photo)}
.credits td:nth-child(2){width:180px}
.credits .photo-img{border-radius:8px;aspect-ratio:16/9}
.credits td{font-size:14.5px}
.photo-credit{margin-top:10px;font-size:12.5px;line-height:1.6;color:var(--mut)}
.photo-credit a{color:var(--mut);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.photo-credit a:hover{color:var(--link)}
@media (max-width:760px){
  .post-hero .photo-img{border-radius:0}
  .post-hero .photo-credit{padding:0 16px}
  .pitem .photo-img{aspect-ratio:1/1}
}

/* 斷點：1080 平板 / 760 手機 */
@media (max-width:1080px){
  .nav{display:none}
  .site-head__in{justify-content:space-between}
  .nav-chips{display:flex;gap:8px;overflow-x:auto;padding:0 28px 12px;max-width:var(--max);
   margin:0 auto;scrollbar-width:none}
  .nav-chips a{flex:0 0 auto;font-size:14px;font-weight:600;color:var(--body);padding:6px 14px;
   border-radius:999px;background:var(--soft);white-space:nowrap}
  /* 欄寬一律 minmax(0,1fr)：用 1fr 會被正文的 <pre> 等寬圖表撐到 700px 以上 */
  .shell,.shell--region{grid-template-columns:minmax(0,1fr);gap:0}
  .stack,.toc,.sidecol{min-width:0}
  .toc{position:static;margin-bottom:56px}
  .toc .dark-card{display:none}
  .shell>.stack{max-width:none}
  .grid--3,.grid--4{grid-template-columns:repeat(2,1fr)}
  .hero,.hero--index,.hero--region{grid-template-columns:minmax(0,1fr);gap:40px}
  .sidecol{position:static}
  /* 平板：54px 會讓首頁主標（每行 9 字）在 768px 折成 4 行 */
  .h1--home{font-size:44px}
}
@media (max-width:760px){
  body{font-size:17px;line-height:1.85}
  .site-head{position:static}
  .container,.site-head__in,.crumb,.shell,.site-foot{padding-left:16px;padding-right:16px}
  .nav-chips{padding:0 16px 12px}
  .head-cta{padding:9px 16px;font-size:14px}
  .container>.card:has(>h1){padding:28px 0 8px}
  h1{font-size:30px;line-height:1.35}
  .h1--home{font-size:36px;line-height:1.25}
  .h1--index{font-size:32px}
  h2,.h2--home{font-size:24px}
  .h2--sm{font-size:20px}
  .lead{font-size:17.5px}
  .section{margin-top:56px}
  .shell{padding-top:32px}
  .stack>.card+.card{margin-top:56px}
  .stack>.card>h2{font-size:24px}
  .prose{font-size:17px}
  .prose h3{font-size:19.5px;margin-top:36px}
  .photo--hero{aspect-ratio:4/3;border-radius:0}
  .container[style]>.photo--hero{margin:0 -16px}
  .grid--2,.grid--3{grid-template-columns:1fr}
  .grid--4{grid-template-columns:repeat(2,1fr)}
  .kpi__n{font-size:30px}
  .kpi--sm .kpi__n{font-size:26px}
  .meta-row{gap:6px 14px;font-size:13.5px}
  .cta,.cta--home{grid-template-columns:1fr;padding:30px 22px;gap:24px}
  .cta h2{font-size:23px}
  .btn,.btn--ghost{display:block;text-align:center}
  .rowlist a,.rowlist--3 a{grid-template-columns:1fr;gap:6px}
  .rowlist__m{text-align:left}
  .site-foot{flex-direction:column;padding-bottom:28px}
  .action-bar{display:grid;grid-template-columns:1fr;gap:10px;position:fixed;left:0;right:0;
   bottom:0;z-index:60;padding:10px 14px;background:rgba(255,255,255,.94);
   backdrop-filter:blur(14px);border-top:1px solid var(--line)}
  .action-bar a{font-size:15px;font-weight:700;padding:12px 18px;border-radius:10px;
   background:var(--soft);color:var(--ink);text-align:center;white-space:nowrap}
  .action-bar .action-bar__main{background:var(--brand);color:#fff}
}
/* 320px 小手機：首頁主標兩行各 8、9 字，36px 會擠成 4 行 */
@media (max-width:360px){
  .h1--home{font-size:30px}
}
/* ── 手機選單（2026-10-12 重新設計，參考 natahlee）────────────────────────────
   按鈕＋JS 開關；選單是頁首「外面」的同層元素 —— 頁首有 backdrop-filter，放在裡面的
   fixed 元素會以頁首為基準，鋪不滿螢幕。沒有 JS 時不顯示按鈕，退回橫向捲動的欄目膠囊。
   白底全螢幕（設計原則：不用深色底）；背景 inert、Esc 關閉、鎖捲動，見 theme.JS。 */
.menu-btn{display:none}
.site-menu{display:none}
@media (max-width:1080px){
  .js-nav .nav-chips{display:none}
  .js-nav .menu-btn{display:inline-flex;align-items:center;gap:10px;margin-left:auto;height:44px;padding:0 18px;
   border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--ink);font:inherit;font-size:15px;
   font-weight:700;cursor:pointer;flex:0 0 auto;white-space:nowrap}
  .js-nav .menu-btn:hover{background:var(--soft)}
  .menu-icon{position:relative;display:block;width:18px;height:2px;border-radius:2px;background:currentColor;
   transition:background .15s}
  .menu-icon::before,.menu-icon::after{content:"";position:absolute;left:0;width:18px;height:2px;border-radius:2px;
   background:currentColor;transition:transform .2s,top .2s}
  .menu-icon::before{top:-6px}
  .menu-icon::after{top:6px}
  .site-head.is-open .menu-icon{background:transparent}
  .site-head.is-open .menu-icon::before{top:0;transform:rotate(45deg)}
  .site-head.is-open .menu-icon::after{top:0;transform:rotate(-45deg)}
  html.nav-lock{overflow:hidden}
  .site-head.is-open{position:fixed;left:0;right:0;top:0;background:#fff;backdrop-filter:none}
  /* 從螢幕頂端鋪滿、上方留出頁首高度：頁首（z-index 50）蓋在上面。不用 top:頁首高度 ——
     量高度的時間點差幾 px，選單上緣就會被頁首吃掉（實測 6px） */
  .site-menu.is-open{display:flex;flex-direction:column;position:fixed;z-index:49;inset:0;
   padding:calc(var(--head-h,73px) + 4px) 28px 0;background:#fff;overflow-y:auto;
   overscroll-behavior:contain;-webkit-overflow-scrolling:touch;animation:menu-in .18s ease-out}
  .site-menu__k{font-size:12px;font-weight:800;letter-spacing:.18em;color:var(--mut);margin:20px 0 2px}
  .site-menu__list,.site-menu__more{list-style:none;margin:0;padding:0}
  .site-menu__list a{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:2px 16px;
   padding:15px 4px;border-bottom:1px solid var(--line);color:var(--ink)}
  .site-menu__t{grid-column:1;font-size:20px;font-weight:800;line-height:1.4}
  .site-menu__d{grid-column:1;font-size:14px;line-height:1.6;color:var(--mut)}
  .site-menu__list a::after{content:"→";grid-column:2;grid-row:1/span 2;font-weight:700;color:var(--brand)}
  .site-menu__list a[aria-current]{box-shadow:inset 3px 0 0 var(--pin);padding-left:16px}
  .site-menu__list a[aria-current] .site-menu__t{color:var(--brand)}
  .site-menu__more{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
  .site-menu__more a{display:inline-block;padding:10px 18px;border-radius:999px;background:var(--soft);
   color:var(--ink);font-size:15px;font-weight:600}
  .site-menu__more a[aria-current]{background:var(--brand);color:#fff}
  .site-menu__foot{position:sticky;bottom:0;display:flex;flex-direction:column;gap:8px;margin:auto -28px 0;
   padding:16px 28px calc(16px + env(safe-area-inset-bottom,0px));background:#fff;border-top:1px solid var(--line);
   text-align:center}
  .site-menu__mail{font-size:14px;color:var(--mut)}
}
/* 小手機（320–360px）：logo 改成橫向 52px 後，「MISAYE」＋選單按鈕會超出畫面 3px（2026-10-12 實測 320px） */
@media (max-width:360px){
  .brand__en{display:none}
}
@media (max-width:760px){
  .site-menu.is-open{padding-left:16px;padding-right:16px}
  .site-menu__foot{margin:auto -16px 0;padding-left:16px;padding-right:16px}
}
@keyframes menu-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
/* ── 返回頂部（2026-10-12 使用者指定：桌機版右下方）────────────────────────────
   只在 >1080px 顯示（手機有選單按鈕與系統的捲到頂手勢，不再加浮動物件擋內文）。
   往下捲超過一個視窗高度才出現；沒有 JS 時按鈕保持 hidden。白底細框＋路線綠箭頭，不用深色底。 */
.to-top{display:none}
@media (min-width:1081px){
  .to-top:not([hidden]){display:grid;place-items:center;position:fixed;right:28px;bottom:28px;z-index:40;
   width:52px;height:52px;padding:0;border:1px solid var(--line);border-radius:50%;background:#fff;
   color:var(--brand);box-shadow:0 6px 18px rgba(19,32,43,.10);cursor:pointer;
   opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .2s,transform .2s,visibility .2s}
  .to-top.is-shown{opacity:1;visibility:visible;transform:none}
  .to-top:hover{background:var(--soft);border-color:var(--brand)}
  .to-top:focus-visible{outline:3px solid var(--pin);outline-offset:3px}
  .to-top svg{width:22px;height:22px}
  /* 捲到底時按鈕（距底 28–80px）不能壓到頁尾右側的法律連結：頁尾底部留到 80＋24 */
  .site-foot{padding-bottom:104px}
}
@media (prefers-reduced-motion:reduce){
  .site-menu.is-open{animation:none}
  .menu-icon,.menu-icon::before,.menu-icon::after{transition:none}
  .to-top:not([hidden]){transition:none}
}
.tint--blue{background:#E8EEF8;color:#143F86;--bar:#143F86}.tint--blue strong,.tint--blue b,.tint--blue a,.tint--blue h3,.tint--blue h4,.tint--blue .cal__k,.tint--blue li::marker{color:#143F86}
.tint--orange{background:#FFF3D6;color:#7A4F00;--bar:#F2B33D}.tint--orange strong,.tint--orange b,.tint--orange a,.tint--orange h3,.tint--orange h4,.tint--orange .cal__k,.tint--orange li::marker{color:#7A4F00}
.tint--green{background:#E8EEF8;color:#143F86;--bar:#143F86}.tint--green strong,.tint--green b,.tint--green a,.tint--green h3,.tint--green h4,.tint--green .cal__k,.tint--green li::marker{color:#143F86}
.tint--purple{background:#EEF1F5;color:#34435A;--bar:#8A97AB}.tint--purple strong,.tint--purple b,.tint--purple a,.tint--purple h3,.tint--purple h4,.tint--purple .cal__k,.tint--purple li::marker{color:#34435A}
.tint--teal{background:#E8EEF8;color:#143F86;--bar:#143F86}.tint--teal strong,.tint--teal b,.tint--teal a,.tint--teal h3,.tint--teal h4,.tint--teal .cal__k,.tint--teal li::marker{color:#143F86}
.tint--rose{background:#FFF3D6;color:#7A4F00;--bar:#F2B33D}.tint--rose strong,.tint--rose b,.tint--rose a,.tint--rose h3,.tint--rose h4,.tint--rose .cal__k,.tint--rose li::marker{color:#7A4F00}