/* 台灣公共建築地圖
   兩個方向共用同一套版型與元件，只換設定值：
   A「建築年鑑」（預設）：米白紙、墨色細線、明朝標題、直角。
   D「柔和」（data-theme="d"）：暖紙、圓角四階、底色分區不用線、圓體標題、柔和色。
   UI 強調色只有一種（--accent），只用在「目前選取」。類型色是資料編碼。 */

/* 方向 D 標題字：jf open 粉圓（SIL OFL 1.1，授權檔 assets/fonts/jf-openhuninn_LICENSE.txt），已縮成本站用字 */
@font-face { font-family: "jfOpenHuninn"; src: url("../fonts/jf-openhuninn-subset.woff2") format("woff2"); font-display: swap; }

:root {
  --paper: #f2ede3;
  --paper-2: #e9e2d4;
  --paper-3: #ddd4c2;
  --card: transparent;          /* 主體段落底色 */
  --base-bg: #e9e2d4;           /* 資料底稿底色 */
  --land: #e2d9c7;
  --land-hl: #cbbd9f;
  --land-line: #b9ad96;
  --ink: #1d1b18;
  --ink-2: #4a463f;
  --ink-3: #5f594f;
  --rule: #cfc5b2;
  --line: #1d1b18;              /* 結構線：A 用墨線，D 不用線 */
  --band: #23211d;
  --band-ink: #efe9dd;
  --accent: #c8401f;

  --c-culture: #263f78;
  --c-transit: #1f7f7a;
  --c-sport: #a9690c;
  --c-land: #557f31;
  --c-edu: #7a5ba6;
  --c-welfare: #b85676;
  --c-housing: #8b5233;
  --c-civic: #5a5a5a;   /* 2026-10-31 由 #76808c 改：對陸地原 2.86:1 未達 3:1；改後 4.92:1，綠色盲下與交通也拉開（ΔE 6.4→不再是最近組） */

  --f-head: "Noto Serif TC", "Songti TC", "Source Han Serif TC", serif;
  --w-head: 600;
  --w-hero: 700;
  --f-sans: "Noto Sans TC", "PingFang TC", "Heiti TC", "Microsoft JhengHei", system-ui, sans-serif;
  --f-mono: "IBM Plex Mono", ui-monospace, Menlo, monospace;   /* 只用在經緯度、比例尺、座標 */

  --r1: 0px; --r2: 0px; --r3: 0px; --r4: 0px; --pill: 999px;
  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 24px; --s6: 32px; --s7: 48px; --s8: 64px;
  --measure: 36em;
  --aside: 440px;
  --grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.012 .9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .3 0 0 0 0 .25 0 0 0 0 .2 0 0 0 .1 0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E");
}

[data-theme="d"] {
  --paper: #f7f1e8;
  --paper-2: #efe5d6;
  --paper-3: #e3d6c2;
  --card: #fffaf2;
  --base-bg: #efe5d6;
  --land: #ece1cf;
  --land-hl: #d9c6a6;
  --land-line: #cdbda3;
  --ink: #2c2824;
  --ink-2: #554e47;
  --ink-3: #625a51;
  --rule: #e2d6c4;
  --line: transparent;
  --band: #3b3430;
  --band-ink: #f7f1e8;
  --accent: #d0532f;
  --c-culture: #4a6aa0;
  --c-transit: #3b8a82;
  --c-sport: #b07a22;
  --c-land: #6a9346;
  --c-edu: #8a70b4;
  --c-welfare: #c27088;
  --c-housing: #9c6446;
  --c-civic: #7d8793;
  --f-head: "jfOpenHuninn", "Noto Sans TC", "PingFang TC", sans-serif;
  --w-head: 400;
  --w-hero: 400;
  --r1: 8px; --r2: 12px; --r3: 16px; --r4: 24px;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 120px; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 400 16px/1.8 var(--f-sans); text-rendering: optimizeLegibility; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { text-decoration-thickness: 2px; }
:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
button, select, input { font: inherit; color: inherit; }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.muted { color: var(--ink-3); }
.btn-sm { min-height: 44px; padding: 0 14px; border: 1px solid var(--ink-2); border-radius: var(--r2); background: var(--paper); cursor: pointer; font-size: 15px; }
.btn-sm:hover { background: var(--paper-2); }
.btn-sm:disabled { opacity: .35; cursor: default; }
[data-theme="d"] .btn-sm { border-color: transparent; background: var(--paper-2); }

/* ---------- 共用：導覽、刊頭 ---------- */
.site-nav { display: flex; gap: var(--s5); font-size: 15px; letter-spacing: .06em; }
.site-nav a { text-decoration: none; padding: 8px 0; border-bottom: 2px solid transparent; }
.site-nav a[aria-current="page"] { border-bottom-color: var(--ink); font-weight: 700; }
.kicker { font-size: 13px; letter-spacing: .12em; color: var(--ink-2); margin: 0; }
.masthead-title { font-family: var(--f-head); font-weight: var(--w-hero); letter-spacing: .04em; font-size: clamp(38px, 4.2vw, 60px); line-height: 1.14; margin: var(--s3) 0 var(--s2); }
.site-foot { border-top: 1px solid var(--rule); margin-top: var(--s8); padding: var(--s5) 0 var(--s7); font-size: 13px; line-height: 1.8; color: var(--ink-3); max-width: 48em; }
.site-foot p { margin: 0 0 var(--s2); }

/* ---------- 首頁版面 ---------- */
.atlas { position: relative; display: grid; grid-template-columns: var(--aside) 1fr; min-height: 100vh; }
.atlas-aside { border-right: 1px solid var(--line); padding: var(--s6) var(--s6) 0; display: flex; flex-direction: column; min-width: 0; height: 100vh; position: sticky; top: 0; overflow: hidden; }
[data-theme="d"] .atlas-aside { background: var(--card); border-radius: 0 var(--r4) var(--r4) 0; }
.atlas-head { flex: none; }
.bignum-lbl { margin: 0 0 var(--s3); font-size: 14px; color: var(--ink-2); }
.lede-s { font-size: 16px; line-height: 1.8; color: var(--ink-2); margin: 0 0 var(--s3); max-width: 26em; }
.atlas-scroll { flex: 1; overflow-y: auto; margin: 0 calc(-1 * var(--s6)); padding: 0 var(--s6) var(--s6); scrollbar-width: thin; }
.atlas-map { position: relative; height: 100vh; position: sticky; top: 0; overflow: hidden; }
.map-svg { width: 100%; height: 100%; display: block; touch-action: pan-y; cursor: grab; user-select: none; -webkit-user-select: none; }
.map-svg.dragging { cursor: grabbing; }

/* 破框：只有數字跨過左欄邊線（全頁唯一一處）；面板開啟時隱藏 */
.bignum { position: absolute; z-index: 3; top: 22px; left: calc(var(--aside) - .32em); font-family: var(--f-head); font-weight: var(--w-hero); font-size: 128px; line-height: .9; letter-spacing: -.02em; color: var(--ink); pointer-events: none; transition: opacity .2s; }
.atlas.has-panel .bignum { opacity: 0; }

/* 地圖元素 */
.base .land path { fill: var(--land); stroke: var(--land-line); stroke-width: .7; vector-effect: non-scaling-stroke; transition: fill .15s; }
.base .land path.hl { fill: var(--land-hl); }
.base .grat path { stroke: var(--rule); stroke-width: .6; fill: none; stroke-dasharray: 2 4; vector-effect: non-scaling-stroke; }
.base .grat-label text { font: 500 10px var(--f-mono); fill: var(--ink-3); letter-spacing: .04em; }
.base .inset { fill: none; stroke: var(--ink-2); stroke-width: .8; vector-effect: non-scaling-stroke; rx: var(--r2); }
[data-theme="d"] .base .inset { stroke: var(--land-line); }
.base .tp-bg { fill: var(--paper); rx: var(--r2); }
[data-theme="d"] .base .tp-bg { fill: var(--card); }
.base .inset-label { font: 500 12px var(--f-sans); fill: var(--ink-2); letter-spacing: .1em; }
.base .sea-label { font: 400 15px var(--f-head); fill: var(--ink-3); letter-spacing: .5em; }
.base .tp-lead rect, .base .tp-lead path { fill: none; stroke: var(--ink-3); stroke-width: .8; stroke-dasharray: 3 3; vector-effect: non-scaling-stroke; }
.pt .dot { transition: opacity .15s; }
.pt.dim { opacity: .1; pointer-events: none; }
.pt.is-hover .dot { stroke: var(--ink) !important; }
.pt .ring { fill: none; stroke: none; }
.pt.is-sel .ring { stroke: var(--accent); }
.pt { cursor: pointer; }

.map-ctrl { position: absolute; right: var(--s5); top: var(--s5); display: flex; flex-direction: column; border: 1px solid var(--ink-2); border-radius: var(--r2); background: var(--paper); z-index: 4; overflow: hidden; }
.map-ctrl button { min-width: 44px; height: 44px; border: 0; background: none; font-size: 18px; cursor: pointer; padding: 0 10px; }
.map-ctrl .z-all { font-size: 14px; padding: 0 14px; }
.map-ctrl button + button { border-top: 1px solid var(--ink-2); }
.map-ctrl button:hover { background: var(--paper-2); }
[data-theme="d"] .map-ctrl { border-color: transparent; box-shadow: 0 2px 10px rgba(60, 40, 20, .12); }
[data-theme="d"] .map-ctrl button + button { border-color: var(--rule); }

.regions { position: absolute; right: var(--s5); top: 170px; z-index: 4; display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
.regions button { min-height: 40px; padding: 0 12px; border: 1px solid var(--rule); background: var(--paper); border-radius: var(--pill); cursor: pointer; font-size: 14px; display: inline-flex; gap: 6px; align-items: center; }
.regions button span { color: var(--ink-3); font-size: 13px; }
.regions button:hover { border-color: var(--ink-2); }

.legend { position: absolute; left: var(--s5); bottom: var(--s5); z-index: 4; background: color-mix(in srgb, var(--paper) 90%, transparent); padding: var(--s2) var(--s4); border-radius: var(--r2); font-size: 13px; line-height: 1.6; display: flex; flex-direction: column; }
.legend-row { display: inline-flex; align-items: center; gap: 8px; color: var(--ink-2); }
.map-scale { position: absolute; right: var(--s5); bottom: var(--s5); font: 500 11px var(--f-mono); color: var(--ink-2); z-index: 4; text-align: right; }
.map-scale .bar { display: block; height: 6px; border: 1px solid var(--ink-2); border-top: 0; margin-top: 4px; }

.tip { position: absolute; z-index: 6; pointer-events: none; background: var(--ink); color: var(--paper); font-size: 14px; line-height: 1.5; padding: 6px 10px; border-radius: var(--r1); max-width: 280px; transform: translate(-50%, calc(-100% - 14px)); opacity: 0; transition: opacity .12s; }
.tip.on { opacity: 1; }
.tip small { display: block; font-size: 12px; opacity: .85; }

/* 叢集清單 */
.cluster { position: absolute; z-index: 7; width: 360px; max-height: 340px; overflow-y: auto; background: var(--paper); border: 1px solid var(--ink-2); border-radius: var(--r3); box-shadow: 0 16px 40px -16px rgba(0, 0, 0, .35); padding: 0 var(--s4) var(--s3); }
[data-theme="d"] .cluster { border-color: transparent; background: var(--card); }
.cluster-bar { position: sticky; top: 0; background: inherit; display: flex; justify-content: space-between; align-items: center; padding: 8px 0; border-bottom: 1px solid var(--rule); }
.cluster-bar h2 { font-size: 16px; margin: 0; }

/* 篩選 */
.filters { border-top: 1px solid var(--line); padding-top: var(--s3); margin-top: var(--s2); }
.f-title { display: flex; justify-content: space-between; align-items: baseline; margin: 0 0 var(--s2); }
.f-title h2 { font-size: 15px; font-weight: 700; margin: 0; letter-spacing: .08em; }
.f-reset { border: 0; background: none; font-size: 14px; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; color: var(--ink-2); min-height: 44px; padding: 0; }
.chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 var(--s3); padding: 0; list-style: none; }
.chip { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 4px 12px 4px 10px; border: 1px solid var(--rule); background: transparent; cursor: pointer; font-size: 15px; border-radius: var(--pill); }
[data-theme="d"] .chip { background: var(--card); border-color: transparent; }
.chip .sw { width: 12px; height: 12px; border-radius: 50%; background: var(--cat); }
.chip .n { font-size: 13px; color: var(--ink-3); }
.chip[aria-pressed="false"] { color: var(--ink-3); border-style: dashed; }
.chip[aria-pressed="false"] .sw { background: transparent; box-shadow: inset 0 0 0 2px var(--cat); }
.tag-active { display: flex; align-items: center; gap: var(--s3); font-size: 15px; margin: 0 0 var(--s3); padding: 4px 4px 4px 12px; background: var(--paper-2); border-radius: var(--r2); }
.tag-active .btn-sm { min-height: 36px; margin-left: auto; }
.f-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s2) var(--s3); }
.f-grid label { display: flex; flex-direction: column; font-size: 13px; color: var(--ink-2); gap: 2px; }
.f-grid .wide { grid-column: 1 / -1; }
.f-grid select, .f-grid input { min-height: 44px; border: 0; border-bottom: 1px solid var(--ink-2); background: transparent; padding: 4px 2px; font-size: 16px; border-radius: 0; -webkit-appearance: none; appearance: none; color: var(--ink); }
[data-theme="d"] .f-grid select, [data-theme="d"] .f-grid input { background-color: var(--card); border: 0; border-radius: var(--r2); padding: 4px 12px; }
.f-grid select { background-image: linear-gradient(45deg, transparent 50%, var(--ink) 50%), linear-gradient(135deg, var(--ink) 50%, transparent 50%); background-position: calc(100% - 14px) 55%, calc(100% - 9px) 55%; background-size: 5px 5px; background-repeat: no-repeat; padding-right: 24px; }
.f-note { font-size: 14px; color: var(--ink-3); margin: var(--s2) 0 0; line-height: 1.7; }
.f-toggle { display: none; }

/* 結果清單：目錄式 */
.results-head { display: flex; justify-content: space-between; align-items: baseline; border-top: 1px solid var(--line); margin-top: var(--s4); padding-top: var(--s3); }
.results-head h2 { font-size: 15px; font-weight: 700; margin: 0; letter-spacing: .08em; }
.results-head .count { font-size: 14px; color: var(--ink-2); }
.results { list-style: none; margin: 0; padding: 0; }
.results li { border-bottom: 1px solid var(--rule); }
.r-btn { display: grid; grid-template-columns: 52px 1fr; gap: 0 var(--s3); width: 100%; text-align: left; background: none; border: 0; padding: 12px 6px 12px 12px; cursor: pointer; position: relative; border-radius: var(--r1); min-height: 44px; }
.r-btn::before { content: ""; position: absolute; left: 0; top: 14px; bottom: 14px; width: 3px; border-radius: 2px; background: var(--cat); }
.r-btn.est::before { background: repeating-linear-gradient(var(--cat) 0 3px, transparent 3px 6px); }
.r-year { font-size: 14px; line-height: 1.9; color: var(--ink-2); }
.r-name { font-family: var(--f-head); font-weight: var(--w-head); font-size: 17px; line-height: 1.5; }
.r-sub { grid-column: 2; font-size: 14px; color: var(--ink-2); line-height: 1.6; }
.r-btn:hover .r-name, .r-btn.is-hover .r-name { text-decoration: underline; text-underline-offset: 4px; }
.r-btn[aria-current="true"] { background: var(--paper-2); }
.r-btn[aria-current="true"] .r-year { color: var(--accent); font-weight: 700; }

/* ---------- 作品面板 ---------- */
.panel { position: absolute; z-index: 8; top: 0; right: 0; bottom: 0; width: min(620px, 100%); background: var(--paper); border-left: 1px solid var(--line); overflow-y: auto; transform: translateX(100%); transition: transform .32s cubic-bezier(.2, .7, .2, 1); box-shadow: -24px 0 48px -32px rgba(0,0,0,.35); overscroll-behavior: contain; }
[data-theme="d"] .panel { border-radius: var(--r4) 0 0 var(--r4); }
.panel.open { transform: none; }
.panel-bar { position: sticky; top: 0; z-index: 3; display: flex; align-items: center; gap: var(--s2); padding: 8px var(--s5); background: var(--paper); border-bottom: 1px solid var(--rule); }
.panel-bar .grip { display: none; }
.panel-bar .crumb { font-size: 13px; color: var(--ink-3); flex: 1; }
.panel-bar .pn { display: flex; gap: 6px; }
.panel-body { padding: var(--s5) var(--s6) var(--s8); }

.work { --cat: var(--ink); }
.w-kicker { display: flex; align-items: center; font-size: 14px; color: var(--ink-2); margin: 0 0 var(--s2); }
.w-kicker .sw { width: 12px; height: 12px; border-radius: 50%; margin-right: 8px; }
.w-kicker .sep { color: var(--ink-3); }
.w-title { font-family: var(--f-head); font-weight: var(--w-head); font-size: clamp(28px, 3.4vw, 40px); line-height: 1.25; letter-spacing: .02em; margin: 0; text-wrap: balance; }
.w-en { font-family: var(--f-head); font-style: italic; color: var(--ink-2); margin: 6px 0 0; font-size: 16px; line-height: 1.5; }
[data-theme="d"] .w-en { font-style: normal; font-family: var(--f-sans); }
.w-deck { margin: var(--s3) 0 0; font-size: 17px; line-height: 1.7; color: var(--ink); }
.w-meta { display: flex; flex-wrap: wrap; gap: 4px 20px; margin: var(--s4) 0 0; font-size: 14px; }
.w-meta div { display: flex; gap: 6px; }
.w-meta dt { color: var(--ink-3); }
.w-meta dd { margin: 0; }
.w-est, .w-note { font-size: 14px; color: var(--ink-2); margin: var(--s2) 0 0; }
.w-est { padding-left: 10px; border-left: 3px dashed var(--cat); }

.w-summary { margin-top: var(--s5); padding: var(--s4); background: var(--paper-2); border-radius: var(--r3); }
[data-theme="d"] .w-summary { background: var(--card); }
.nums { display: flex; flex-wrap: wrap; gap: var(--s3) var(--s6); margin-bottom: var(--s3); }
.num { display: flex; flex-direction: column; }
.n-big { font-family: var(--f-head); font-weight: var(--w-head); font-size: 30px; line-height: 1.15; }
.n-lbl { font-size: 13px; color: var(--ink-3); }
.sum-h { font-size: 14px; font-weight: 700; margin: var(--s2) 0 4px; color: var(--ink-2); letter-spacing: .06em; }

/* 外連列：整列可點、至少 44px */
.parties { list-style: none; margin: 0 0 var(--s2); padding: 0; }
.party { display: flex; align-items: center; gap: var(--s3); min-height: 52px; padding: 8px 10px; margin: 0 -10px; border-radius: var(--r2); text-decoration: none; }
a.party:hover { background: color-mix(in srgb, var(--ink) 6%, transparent); }
.p-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.p-name { font-weight: 700; line-height: 1.5; }
.p-meta { font-size: 14px; color: var(--ink-2); line-height: 1.5; }
.p-warn { font-size: 13px; color: var(--ink); line-height: 1.5; margin-top: 2px; padding-left: 8px; border-left: 3px solid var(--ink-2); }
.p-none { align-self: flex-start; font-size: 13px; color: var(--ink-3); background: color-mix(in srgb, var(--ink) 6%, transparent); padding: 0 8px; border-radius: var(--r1); margin-top: 4px; }
.p-btn { flex: none; display: inline-flex; align-items: center; min-height: 44px; padding: 0 14px; border: 1px solid var(--ink); border-radius: var(--pill); font-size: 15px; font-weight: 500; white-space: nowrap; }
a.party:hover .p-btn { background: var(--ink); color: var(--paper); }
.party.is-warn .p-btn { border-style: dashed; }
.tbd-line { font-size: 15px; color: var(--ink-3); margin: var(--s2) 0 0 !important; }
.tbd { color: var(--ink-3); }

/* 無照片的資料圖版：淺色、竣工年、風格詞、縣市剪影 */
.w-figs { margin-top: var(--s5); }
.plate { margin: 0 0 var(--s4); }
.plate img { display: block; width: 100%; height: auto; max-height: 460px; object-fit: cover; background: var(--paper-3); border-radius: var(--r3); }
.plate figcaption { font-size: 13px; line-height: 1.6; color: var(--ink-3); margin-top: 6px; }
.plate-more { width: 60%; margin-left: auto; }
.pcard { position: relative; margin: 0; height: 112px; border-radius: var(--r3); background: color-mix(in srgb, var(--cat) 14%, var(--paper)); background-image: var(--grain); display: flex; align-items: center; justify-content: space-between; padding: 0 var(--s5); overflow: hidden; }
.pc-text { display: flex; flex-direction: column; min-width: 0; }
.pc-year { font-family: var(--f-head); font-weight: var(--w-hero); font-size: 44px; line-height: 1; color: color-mix(in srgb, var(--cat) 80%, var(--ink)); }
.pc-year.is-city { font-size: 30px; }
.pc-words { font-size: 14px; color: var(--ink-2); margin-top: 6px; }
.pc-shape { flex: none; height: 92px; width: 92px; }
.pc-shape .cs-land { fill: color-mix(in srgb, var(--cat) 26%, var(--paper)); stroke: color-mix(in srgb, var(--cat) 45%, var(--paper)); stroke-width: 1; vector-effect: non-scaling-stroke; }
.pc-shape .cs-dot { stroke: var(--paper); stroke-width: 2; vector-effect: non-scaling-stroke; }
.pc-cap { font-size: 13px; color: var(--ink-3); margin: 6px 0 0; }

/* 段落導覽：吸頂 */
.w-toc { position: sticky; top: 61px; z-index: 2; display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; margin: var(--s5) calc(-1 * var(--s6)) 0; padding: 8px var(--s6); background: color-mix(in srgb, var(--paper) 94%, transparent); border-bottom: 1px solid var(--rule); }
.w-toc::-webkit-scrollbar { display: none; }
.w-toc a { flex: none; display: inline-flex; align-items: center; min-height: 40px; padding: 0 14px; border-radius: var(--pill); background: var(--paper-2); text-decoration: none; font-size: 14px; }
.w-toc a:hover { background: var(--paper-3); }

/* 主體段落 */
.w-main { margin-top: var(--s3); }
.w-sec { margin-top: var(--s5); padding: var(--s4) 0 0; border-top: 1px solid var(--line); background: var(--card); }
[data-theme="d"] .w-sec { padding: var(--s4) var(--s4) var(--s4); border-radius: var(--r3); }
.w-sec h2 { font-family: var(--f-head); font-weight: var(--w-head); font-size: 21px; line-height: 1.4; margin: 0 0 var(--s3); }
.sub-h { font-size: 14px; font-weight: 700; color: var(--ink-2); margin: var(--s4) 0 4px; letter-spacing: .04em; }
.w-sec p { margin: 0; max-width: var(--measure); }
.concept { font-size: 17px; line-height: 1.85; }
.concept.is-red { color: var(--ink-2); }
.fn { font-size: 13px !important; color: var(--ink-3); margin-top: 6px !important; line-height: 1.7; }
.red-note { font-size: 14px; color: var(--ink-2); margin-top: 8px !important; padding-left: 10px; border-left: 3px solid var(--ink-2); }
.tag-groups { display: flex; flex-direction: column; gap: 6px; }
.tg { display: grid; grid-template-columns: 6.5em 1fr; gap: var(--s2); align-items: start; }
.tg-l { font-size: 13px; color: var(--ink-3); line-height: 40px; }
.tg-v { display: flex; flex-wrap: wrap; gap: 6px; }
.tag { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 14px; border-radius: var(--pill); background: color-mix(in srgb, var(--cat) 12%, var(--paper)); text-decoration: none; font-size: 15px; }
.tag small { font-size: 12px; color: var(--ink-3); }
.tag:hover { background: color-mix(in srgb, var(--cat) 22%, var(--paper)); }
.fields { margin: 0; }
.f-row { display: grid; grid-template-columns: 6.5em 1fr; gap: var(--s3); padding: 10px 0; border-bottom: 1px solid var(--rule); }
.f-row:last-child { border-bottom: 0; }
.f-row dt { font-size: 14px; color: var(--ink-2); line-height: 1.8; }
.f-row dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.f-row small { color: var(--ink-3); font-size: 14px; }
.cost-big { display: block; font-family: var(--f-head); font-weight: var(--w-head); font-size: 26px; line-height: 1.3; }
.cost-rest { display: block; font-size: 14px; color: var(--ink-2); line-height: 1.7; }
.awards, .dash, .links, .todo, .tenders { list-style: none; margin: 0; padding: 0; }
.awards li { display: grid; grid-template-columns: 3.4em 1fr; gap: var(--s2); }
.a-year { font-size: 14px; line-height: 1.9; color: var(--ink-2); }
.dash li { position: relative; padding-left: 1.2em; }
.dash li::before { content: "—"; position: absolute; left: 0; color: var(--ink-3); }
.jury { margin: 0; font-size: 17px; line-height: 1.85; padding-left: var(--s4); border-left: 3px solid var(--cat); max-width: var(--measure); }
.tenders li { padding: 8px 0; border-bottom: 1px dotted var(--rule); font-size: 15px; display: flex; flex-wrap: wrap; gap: 4px 14px; }
.tenders em { font-style: normal; color: var(--ink-3); font-size: 13px; margin-right: 6px; }
.w-contro { padding: var(--s4) !important; background: var(--paper-2); border-top: 0; border-radius: var(--r3); }
.flag { display: inline-block; font-size: 12px; line-height: 1.6; padding: 0 6px; border: 1px solid currentColor; border-radius: var(--r1); vertical-align: 2px; white-space: nowrap; }
.flag-ok { color: var(--c-land); }
.flag-mid { color: var(--ink-3); }
.flag-red { color: var(--paper); background: var(--ink); border-color: var(--ink); }
.ext-arrow { font-size: .9em; text-decoration: none; display: inline-block; }

/* 資料底稿：小一階、底色區分 */
.w-base { margin: var(--s7) calc(-1 * var(--s6)) 0; padding: var(--s5) var(--s6) var(--s6); background: var(--base-bg); font-size: 15px; line-height: 1.75; border-radius: var(--r4) var(--r4) 0 0; }
.base-h { font-family: var(--f-head); font-weight: var(--w-head); font-size: 20px; margin: 0 0 var(--s2); }
.b-sec { margin-top: var(--s5); }
.b-sec h2 { font-size: 15px; font-weight: 700; margin: 0 0 var(--s2); letter-spacing: .04em; }
.b-sec .f-row { border-color: color-mix(in srgb, var(--ink) 12%, transparent); }
.b-sec .f-row dt { font-size: 14px; }
.loc-grid { display: grid; grid-template-columns: 150px 1fr; gap: var(--s4); align-items: start; }
.locator { width: 150px; height: auto; aspect-ratio: 790 / 1070; }
.locator .land path { fill: var(--paper-3); stroke: var(--base-bg); stroke-width: 1.5; }
.locator .land path.hl { fill: var(--land-hl); }
.loc-halo { fill: none; stroke: var(--ink); stroke-width: 3; }
.coord { font-family: var(--f-mono); font-size: 14px; }
.sources { margin: 0; padding-left: 1.6em; font-size: 14px; line-height: 1.7; }
.sources li { margin-bottom: 6px; overflow-wrap: anywhere; }
.src-red .src { text-decoration-style: dashed; }
.src-note { display: block; color: var(--ink-3); font-size: 13px; }
.todo li { padding: 6px 0 6px 1.5em; position: relative; font-size: 15px; line-height: 1.7; border-bottom: 1px dotted color-mix(in srgb, var(--ink) 15%, transparent); }
.todo li::before { content: "□"; position: absolute; left: 0; color: var(--ink-3); }
.w-prov { margin-top: var(--s5); font-size: 14px; }
.w-prov summary { cursor: pointer; color: var(--ink-2); min-height: 44px; display: flex; align-items: center; }
.w-origin { font-size: 13px; color: var(--ink-3); margin-top: var(--s4); }
.w-open a { display: inline-flex; align-items: center; min-height: 44px; border: 1px solid var(--ink); border-radius: var(--pill); padding: 0 18px; text-decoration: none; font-size: 15px; }
.w-open a:hover { background: var(--ink); color: var(--paper); }

.to-map { position: fixed; right: 16px; bottom: 20px; z-index: 9; min-height: 48px; padding: 0 18px; border-radius: var(--pill); border: 0; background: var(--ink); color: var(--paper); font-size: 15px; box-shadow: 0 6px 16px rgba(0,0,0,.25); cursor: pointer; }

/* ---------- 內頁 ---------- */
.page { max-width: 1240px; margin: 0 auto; padding: var(--s6) var(--s6) 0; }
.page-head { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: var(--s4); border-bottom: 1px solid var(--line); padding-bottom: var(--s3); }
.brand { font-family: var(--f-head); font-weight: var(--w-hero); font-size: 20px; letter-spacing: .06em; text-decoration: none; }
.page-title { font-family: var(--f-head); font-weight: var(--w-hero); font-size: clamp(40px, 6vw, 76px); line-height: 1.12; letter-spacing: .03em; margin: var(--s7) 0 var(--s4); }
.page-lede { font-size: 18px; line-height: 1.85; max-width: 34em; color: var(--ink-2); margin: 0 0 var(--s6); }

.work-page { max-width: 1240px; margin: 0 auto; padding: var(--s6) var(--s6) 0; }
.work-page .work { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); gap: 0 var(--s8); }
.work-page .w-head { grid-column: 1 / -1; padding-top: var(--s5); }
.work-page .w-title { font-size: clamp(34px, 4.6vw, 56px); }
.work-page .w-summary, .work-page .w-figs { grid-column: 1; }
.work-page .w-figs { position: sticky; top: var(--s5); align-self: start; }
.work-page .w-toc, .work-page .w-main { grid-column: 2; }
.work-page .w-summary { grid-row: 2; align-self: start; }
.work-page .w-figs { grid-row: 3; }
.work-page .w-toc { grid-row: 2; position: sticky; top: 0; margin: var(--s5) 0 0; padding: 8px 0; }
.work-page .w-main { grid-row: 3 / span 2; }
.work-page .w-base { grid-column: 1 / -1; margin: var(--s7) 0 0; border-radius: var(--r4); column-gap: var(--s7); }
.back { font-size: 15px; }

/* 建築師索引 */
.firm-tools { display: flex; flex-wrap: wrap; gap: var(--s4); align-items: end; margin-bottom: var(--s5); }
.firm-tools label { display: flex; flex-direction: column; font-size: 13px; color: var(--ink-2); }
.firm-tools input, .firm-tools select { min-height: 44px; min-width: 240px; border: 0; border-bottom: 1px solid var(--ink-2); background: transparent; font-size: 17px; padding: 4px 2px; border-radius: 0; }
[data-theme="d"] .firm-tools input, [data-theme="d"] .firm-tools select { background: var(--card); border: 0; border-radius: var(--r2); padding: 4px 12px; }
.firm-tools .check { flex-direction: row; align-items: center; gap: 8px; font-size: 15px; color: var(--ink); min-height: 44px; }
.firm-tools .check input { min-width: 0; width: 20px; height: 20px; }
.firm { display: grid; grid-template-columns: 110px minmax(0, 1fr) 200px; gap: var(--s5); padding: var(--s6) 0; border-top: 1px solid var(--line); }
[data-theme="d"] .firm { background: var(--card); border-radius: var(--r4); padding: var(--s5); margin-bottom: var(--s4); }
.firm-n { font-family: var(--f-head); font-weight: var(--w-hero); font-size: 64px; line-height: .95; }
.firm-n small { display: block; font: 400 13px/1.6 var(--f-sans); color: var(--ink-2); margin-top: 8px; }
.firm h2 { font-family: var(--f-head); font-weight: var(--w-head); font-size: 24px; line-height: 1.4; margin: 0 0 4px; text-wrap: balance; }
.firm h2 .nb { white-space: nowrap; }
.firm-meta { font-size: 14px; color: var(--ink-2); margin: 0 0 var(--s3); display: flex; gap: var(--s3); flex-wrap: wrap; align-items: center; }
.firm-meta .p-btn { min-height: 40px; }
.firm-meta a.p-btn { text-decoration: none; }
.firm-meta a.p-btn:hover { background: var(--ink); color: var(--paper); }
.firm-intro { font-size: 16px; line-height: 1.8; color: var(--ink-2); max-width: var(--measure); margin: 0 0 var(--s3); }
.firm-works { list-style: none; margin: 0; padding: 0; columns: 2 280px; column-gap: var(--s5); }
.firm-works li { break-inside: avoid; padding: 6px 0 6px 14px; position: relative; border-bottom: 1px dotted var(--rule); }
.firm-works li::before { content: ""; position: absolute; left: 0; top: 15px; width: 8px; height: 8px; border-radius: 50%; background: var(--cat); }
.firm-works a { font-family: var(--f-head); font-weight: var(--w-head); text-decoration: none; }
.firm-works a:hover { text-decoration: underline; }
.firm-works .y { font-size: 13px; color: var(--ink-3); margin-left: 6px; }
.firm-works .role { display: block; font-size: 13px; color: var(--ink-3); line-height: 1.5; }
.firm-map { width: 200px; aspect-ratio: 790 / 1070; height: auto; }
.firm-map .land { fill: var(--paper-3); stroke: var(--paper); stroke-width: 2; }
.firm-single { columns: 3 260px; column-gap: var(--s6); list-style: none; padding: var(--s4) 0 0; margin: 0; border-top: 1px solid var(--line); }
.firm-single li { break-inside: avoid; padding: 8px 0; border-bottom: 1px dotted var(--rule); }
.firm-single .fn2 { font-weight: 700; display: block; }
.firm-single .fw { font-size: 14px; color: var(--ink-2); }
.sec-label { font-family: var(--f-head); font-weight: var(--w-head); font-size: 22px; margin: var(--s8) 0 var(--s3); }

/* 分析頁 */
.an-hero { background: var(--band); color: var(--band-ink); margin: 0 calc(50% - 50vw); padding: var(--s8) calc(50vw - 50%) var(--s7); background-image: var(--grain); }
[data-theme="d"] .an-hero { margin: var(--s4) 0 0; padding: var(--s7) var(--s6); border-radius: var(--r4); }
.an-hero .inner { max-width: 1240px; margin: 0 auto; padding: 0 var(--s6); }
.an-hero .kicker { color: #c9bfae; }
.an-hero h1 { font-family: var(--f-head); font-weight: var(--w-hero); font-size: clamp(40px, 6.4vw, 88px); line-height: 1.12; letter-spacing: .03em; margin: var(--s4) 0 var(--s5); }
.an-hero p { font-size: 18px; line-height: 1.85; max-width: 34em; color: #ddd5c6; margin: 0; }
.an-sec { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: var(--s7); padding: var(--s8) 0; }
.an-sec:nth-of-type(even) { background: var(--paper-2); margin: 0 calc(50% - 50vw); padding-left: calc(50vw - 50%); padding-right: calc(50vw - 50%); }
[data-theme="d"] .an-sec:nth-of-type(even) { margin: 0; padding: var(--s7) var(--s6); border-radius: var(--r4); background: var(--card); }
.an-sec > header .num { font-family: var(--f-head); font-weight: var(--w-hero); font-size: 18px; color: var(--ink-2); }
.an-sec > header h2 { font-family: var(--f-head); font-weight: var(--w-head); font-size: 28px; line-height: 1.4; margin: var(--s2) 0 var(--s3); }
.an-sec > header p { color: var(--ink-2); margin: 0 0 var(--s3); font-size: 16px; line-height: 1.8; }
.an-sec .src { font-size: 13px; color: var(--ink-3); line-height: 1.7; }
.chart-cap { font-size: 13px; color: var(--ink-3); margin-top: var(--s3); line-height: 1.7; max-width: 48em; }
.waffle { display: grid; grid-template-columns: repeat(20, 1fr); gap: 3px; max-width: 520px; }
.waffle i { aspect-ratio: 1; display: block; background: var(--ink); border-radius: calc(var(--r1) / 3); }
.waffle i.dom { background: var(--paper-3); box-shadow: inset 0 0 0 1px var(--land-line); }
.waffle i.tbdq { background: transparent; box-shadow: inset 0 0 0 1px var(--ink-3); }
.waffle-key { display: flex; gap: var(--s5); flex-wrap: wrap; font-size: 14px; margin: var(--s3) 0 var(--s5); }
.waffle-key span { display: inline-flex; gap: 8px; align-items: center; }
.waffle-key i { width: 14px; height: 14px; display: inline-block; }
.bars { list-style: none; margin: 0; padding: 0; }
.bars li { display: grid; grid-template-columns: 12.5em 1fr 5.5em; gap: var(--s3); align-items: center; padding: 6px 0; font-size: 15px; }
.bars .b { height: 18px; background: var(--ink); border-radius: 0 var(--r1) var(--r1) 0; }
.bars .b.dom { background: var(--land-line); }
.bars .v { font-size: 14px; text-align: right; }
.bars .lbl small { display: block; font-size: 12px; color: var(--ink-3); line-height: 1.4; }
.firm-bars .b.stack { display: flex; background: none; overflow: hidden; }
.firm-bars .b.stack span { display: block; height: 100%; }
.firm-bars .lbl a { text-decoration: none; font-weight: 700; }
.firm-bars li { grid-template-columns: 11em 1fr 4em; }
.cat-legend { display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: 13px; color: var(--ink-2); margin: 0 0 var(--s3); }
.cat-legend span { display: inline-flex; align-items: center; gap: 6px; }
.cat-legend i { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }
.an-sub { font-size: 14px; font-weight: 700; margin: 0 0 var(--s3); }
.chart-svg { width: 100%; height: auto; display: block; overflow: visible; }
.chart-svg text { font-family: var(--f-sans); font-size: 12px; fill: var(--ink-2); }
.chart-svg .axis { stroke: var(--ink); stroke-width: 1; }
.chart-svg .gridl { stroke: var(--rule); stroke-dasharray: 2 3; }
.matrix { border-collapse: collapse; width: 100%; font-size: 14px; }
.matrix th { font-weight: 500; color: var(--ink-2); padding: 4px; font-size: 13px; }
.matrix thead th { writing-mode: vertical-rl; text-orientation: upright; letter-spacing: .1em; height: 4.6em; vertical-align: bottom; }
.matrix tbody th { text-align: left; white-space: nowrap; }
.matrix td { text-align: center; padding: 2px; height: 30px; border-bottom: 1px dotted var(--rule); }
.matrix td i { display: inline-block; border-radius: 50%; background: var(--cat); vertical-align: middle; }
.matrix td.tot { font-size: 13px; color: var(--ink-2); }
.timeline { position: relative; display: grid; grid-template-columns: 1fr 72px 1fr; }
.timeline .tl-axis { position: absolute; left: 50%; top: 0; bottom: 0; border-left: 1px solid var(--ink-2); grid-row: 1 / 99; }
.tl-item { padding: 0 0 var(--s5); font-size: 15px; line-height: 1.75; }
.tl-item.left { grid-column: 1; text-align: right; }
.tl-item.right { grid-column: 3; }
.tl-year { grid-column: 2; font-weight: 700; font-size: 15px; text-align: center; background: var(--paper); position: relative; z-index: 1; align-self: start; padding: 2px 0; }
.an-sec:nth-of-type(even) .tl-year { background: var(--paper-2); }
.tl-item h4 { font-family: var(--f-head); font-weight: var(--w-head); font-size: 18px; margin: 0 0 4px; }
.tl-item p { margin: 0; color: var(--ink-2); }
.tl-item .src { font-size: 13px; }
.tl-head { display: grid; grid-template-columns: 1fr 72px 1fr; font-weight: 700; font-size: 14px; margin-bottom: var(--s4); }
.tl-head span:first-child { text-align: right; }
.tl-head span:last-child { grid-column: 3; }
.key-num { color: var(--accent); }
.method p { max-width: 36em; margin: 0 0 var(--s3); }
.style-table { width: 100%; border-collapse: collapse; font-size: 15px; }
.style-table th { text-align: left; font-size: 13px; font-weight: 500; color: var(--ink-3); padding: 6px 8px 6px 0; }
.style-table td { padding: 8px 8px 8px 0; border-top: 1px dotted var(--rule); vertical-align: middle; }
.style-table .tw { font-weight: 700; white-space: nowrap; }
.style-table .tw a { text-decoration: none; }
.style-table .tw a:hover { text-decoration: underline; }
.dots i { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin: 0 2px 0 0; background: var(--cat); }
.era { display: flex; gap: 2px; align-items: flex-end; height: 22px; }
.era span { width: 18px; background: var(--ink-2); border-radius: 2px 2px 0 0; }
.era span.z { background: var(--rule); height: 2px !important; }

/* ---------- 手機（Owner 主要裝置） ---------- */
@media (max-width: 900px) {
  :root { --s6: 20px; }
  .atlas { display: flex; flex-direction: column; }
  .atlas-aside { display: contents; }
  .atlas-head { order: 1; padding: var(--s5) var(--s6) var(--s3); }
  .atlas-map { order: 2; position: relative; height: auto; display: flex; flex-direction: column; border-top: 1px solid var(--line); }
  .atlas-scroll { order: 3; overflow: visible; margin: 0; padding: var(--s4) var(--s6) 0; }
  .bignum-d { display: none; }
  .masthead-title { font-size: 40px; }
  .map-svg { height: 124vw; max-height: 74vh; flex: none; }
  .legend { position: static; background: none; padding: 8px 20px 12px; font-size: 13px; border-radius: 0; }
  .map-scale { display: none; }
  .map-ctrl { right: 12px; top: auto; bottom: auto; top: calc(min(124vw, 74vh) - 56px); flex-direction: row; }
  .map-ctrl button + button { border-top: 0; border-left: 1px solid var(--ink-2); }
  [data-theme="d"] .map-ctrl button + button { border-color: var(--rule); }
  .regions { position: static; flex-direction: row; overflow-x: auto; padding: 10px 20px 2px; gap: 8px; scrollbar-width: none; align-items: center; }
  .regions button { flex: none; }
  .filters { border-top: 0; margin-top: 0; padding-top: 0; }
  .chips { flex-wrap: nowrap; overflow-x: auto; margin: 0 calc(-1 * var(--s6)) var(--s3); padding: 0 var(--s6) 4px; scrollbar-width: none; -webkit-mask-image: linear-gradient(90deg, #000 85%, transparent); mask-image: linear-gradient(90deg, #000 85%, transparent); }
  .chip { flex: none; }
  .f-toggle { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; border: 1px solid var(--ink-2); border-radius: var(--r2); background: none; padding: 0 16px; font-size: 15px; cursor: pointer; }
  [data-theme="d"] .f-toggle { border-color: transparent; background: var(--card); }
  .f-more[hidden] { display: none; }
  .f-more { margin-top: var(--s3); }
  .cluster { position: fixed; left: 0 !important; right: 0; bottom: 0; top: auto !important; width: auto; max-height: 60vh; border-radius: var(--r4) var(--r4) 0 0; border-width: 1px 0 0; padding-bottom: 20px; }
  .panel { position: fixed; width: 100%; border-left: 0; transform: translateY(100%); border-radius: 0; box-shadow: 0 -12px 32px -12px rgba(0,0,0,.3); }
  [data-theme="d"] .panel { border-radius: var(--r4) var(--r4) 0 0; }
  .panel.open { transform: none; }
  .panel.open.peek { transform: translateY(42vh); }
  .panel.peek { border-top: 1px solid var(--line); }
  .panel-bar { padding: 14px 12px 8px; flex-wrap: nowrap; }
  .panel-bar .grip { display: block; position: absolute; top: 5px; left: 50%; width: 44px; height: 5px; margin-left: -22px; border-radius: 3px; background: var(--rule); }
  .panel-bar .crumb { font-size: 12px; text-align: center; }
  .panel-bar .btn-sm { padding: 0 12px; }
  .panel-body { padding: var(--s4) var(--s6) var(--s8); }
  .w-toc { top: 66px; margin: var(--s4) calc(-1 * var(--s6)) 0; padding: 8px var(--s6); }
  .w-title { font-size: 28px; }
  .n-big { font-size: 26px; }
  .f-row { grid-template-columns: 1fr; gap: 0; }
  .f-row dt { font-size: 13px; }
  .tg { grid-template-columns: 1fr; gap: 2px; }
  .tg-l { line-height: 1.6; }
  .loc-grid { grid-template-columns: 104px 1fr; }
  .locator { width: 104px; }
  .w-base { margin: var(--s6) calc(-1 * var(--s6)) 0; padding: var(--s5) var(--s6) var(--s6); }
  .pcard { height: 104px; padding: 0 var(--s4); }
  .pc-year { font-size: 38px; }
  .pc-shape { width: 84px; height: 84px; }
  .page { padding: var(--s4) var(--s6) 0; }
  .page-head { grid-template-columns: 1fr; gap: var(--s2); }
  .page-title { margin-top: var(--s6); font-size: 38px; }
  .work-page { padding: var(--s4) var(--s6) 0; }
  .work-page .work { display: block; }
  .work-page .w-figs { position: static; }
  .work-page .w-title { font-size: 32px; }
  .work-page .w-toc { position: sticky; top: 0; margin: var(--s4) calc(-1 * var(--s6)) 0; padding: 8px var(--s6); }
  .work-page .w-base { margin: var(--s6) calc(-1 * var(--s6)) 0; border-radius: var(--r4) var(--r4) 0 0; }
  .firm { grid-template-columns: 1fr 92px; gap: var(--s3); padding: var(--s5) 0; }
  [data-theme="d"] .firm { padding: var(--s4); }
  .firm-n { grid-column: 1 / -1; font-size: 48px; display: flex; align-items: baseline; gap: 12px; }
  .firm-n small { display: inline; margin: 0; }
  .firm-body { grid-column: 1 / -1; grid-row: 3; }
  .firm-map { width: 92px; grid-column: 2; grid-row: 2; }
  .firm-head { grid-column: 1; grid-row: 2; }
  .firm-works { columns: 1; }
  .firm-tools input, .firm-tools select { min-width: 0; width: 100%; }
  .firm-tools label { flex: 1 1 100%; }
  .an-sec { grid-template-columns: 1fr; gap: var(--s5); padding: var(--s7) 0; }
  .an-sec:nth-of-type(even) { padding-top: var(--s7); padding-bottom: var(--s7); }
  [data-theme="d"] .an-sec:nth-of-type(even) { padding: var(--s6) var(--s4); }
  .bars li { grid-template-columns: 7.5em 1fr 4.6em; font-size: 14px; }
  .firm-bars li { grid-template-columns: 7.5em 1fr 3.4em; }
  .timeline, .tl-head { grid-template-columns: 52px 1fr; }
  .timeline .tl-axis { left: 26px; }
  .tl-year { grid-column: 1; }
  .tl-item.left, .tl-item.right { grid-column: 2; text-align: left; }
  .tl-head span:first-child { display: none; }
  .tl-head span:last-child { grid-column: 2; }
  .tl-item .lane { font-size: 12px; letter-spacing: .1em; color: var(--ink-3); display: block; }
  .matrix { font-size: 13px; }
  .matrix td { height: 26px; }
  .style-table .era-col { display: none; }
}
@media (min-width: 901px) { .tl-item .lane { display: none; } .to-map { display: none; } }
@media (prefers-reduced-motion: reduce) { .panel { transition: none; } }
@media (min-width: 901px) {
  .firm-n { grid-column: 1; grid-row: 1 / 3; }
  .firm-head { grid-column: 2; grid-row: 1; }
  .firm-body { grid-column: 2; grid-row: 2; }
  .firm-map { grid-column: 3; grid-row: 1 / 3; }
}
.tag-active[hidden], .cluster[hidden], .to-map[hidden] { display: none !important; }
.base .tp-label-bg { fill: var(--paper); opacity: .92; }
[data-theme="d"] .base .tp-label-bg { fill: var(--card); }
.chips li { flex: none; } .chip { white-space: nowrap; }
.f-grid { grid-template-columns: 3fr 2fr; }

/* =========================================================
   多層次地圖（三個方向共用）
   ========================================================= */
:root {
  --pt-edge: var(--paper); --pt-est: var(--paper);
  --inf-0: #e2d9c7; --inf-1: #d6c49c; --inf-2: #c4a66a; --inf-3: #a8833e; --inf-4: #7e5d22;
  --net-line: #8a6420; --net-halo: var(--paper); --gold-select: var(--accent);
  --label-pill-bg: rgba(29,27,24,.86); --label-pill-ink: #f2ede3;
  --sea: transparent;
}
[data-theme="d"] { --inf-0: #ece1cf; --inf-1: #e2cfa8; --inf-2: #d4b27a; --inf-3: #bf914e; --inf-4: #9a6c2c; --net-line: #9a6c2c; }
.read-toggle { display: none; }
.slot-desk { margin-top: var(--s3); }
.views { display: inline-flex; gap: 4px; padding: 4px; border-radius: var(--pill); background: var(--paper-2); }
.views button { min-height: 44px; padding: 0 16px; border: 0; border-radius: var(--pill); background: none; cursor: pointer; font-size: 15px; color: var(--ink-2); }
.views button[aria-pressed="true"] { background: var(--ink); color: var(--paper); font-weight: 700; }
.layer-info { margin-top: var(--s3); padding: var(--s3) var(--s4); background: var(--paper-2); border-radius: var(--r3); font-size: 15px; line-height: 1.7; }
.layer-info p { margin: 0 0 6px; }
.li-k { font-size: 13px; color: var(--ink-3); letter-spacing: .06em; }
.li-name { font-family: var(--f-head); font-weight: var(--w-head); font-size: 20px; line-height: 1.4; }
.li-sum { color: var(--ink-2); }
.li-legend { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 13px; color: var(--ink-2); }
.li-legend span { display: inline-flex; align-items: center; gap: 6px; }
.li-legend i { display: inline-block; width: 12px; height: 12px; border-radius: 50%; }
.lg-lead { background: var(--c-culture); box-shadow: 0 0 0 2px var(--gold-select); }
.lg-assist { width: 8px !important; height: 8px !important; background: var(--c-culture); }
.lg-line { width: 18px !important; height: 0 !important; border-top: 2px solid var(--net-line); border-radius: 0 !important; }
.inf-legend { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 13px; color: var(--ink-2); margin: 4px 0 8px; }
.inf-legend span { display: inline-flex; align-items: center; gap: 6px; }
.inf-legend i { display: inline-block; width: 22px; height: 12px; border-radius: 4px; box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ink) 18%, transparent); }
.li-act { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 8px !important; }
.li-act a.btn-sm { display: inline-flex; align-items: center; text-decoration: none; }
.li-check { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-size: 15px; }
.li-check input { width: 20px; height: 20px; }
.fp-lines .fp-halo { fill: none; stroke: var(--net-halo); stroke-width: 4.5; stroke-linecap: round; vector-effect: non-scaling-stroke; opacity: .9; }
.fp-lines .fp-line { fill: none; stroke: var(--net-line); stroke-width: 1.8; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.fp-lines .fp-line.is-est { stroke-dasharray: 4 4; }
.pt.off { opacity: .12; pointer-events: none; }
body[data-view="region"] .pt.off { display: none; }
.pt.fp-lead .ring { stroke: var(--gold-select) !important; stroke-width: 1.75px; }
.pt.fp-assist .dot { transform-box: fill-box; transform-origin: center; transform: scale(.7); }
.pt.neutral .dot { fill: var(--ink-2) !important; stroke: var(--pt-edge) !important; }
.pt.neutral { pointer-events: none; }
.fp-badge circle { fill: var(--gold-select); stroke: var(--net-halo); stroke-width: 1.5; }
.fp-badge text { font: 600 12px var(--f-sans); fill: #17130F; }
.cty-pill { cursor: pointer; }
.cty-pill rect { fill: var(--label-pill-bg); }
.cty-pill text { font: 600 14px var(--f-sans); fill: var(--label-pill-ink); }
.cty-pill.is-sel rect { stroke: var(--gold-select); stroke-width: 2; }
.base .land path.inf-sel { stroke: var(--gold-select) !important; stroke-width: 2 !important; }
.pick-search input { width: 100%; min-height: 44px; border: 0; border-bottom: 1px solid var(--ink-2); background: transparent; font-size: 16px; color: var(--ink); margin: 8px 0; }
.pick-list { list-style: none; margin: 0; padding: 0; }
.pick-row { display: flex; flex-direction: column; align-items: flex-start; width: 100%; min-height: 52px; padding: 8px 6px; border: 0; border-bottom: 1px solid var(--rule); background: none; text-align: left; cursor: pointer; color: var(--ink); }
.pick-row:hover { background: var(--paper-2); }
.pr-name { font-weight: 700; }
.pr-meta { font-size: 14px; color: var(--ink-2); }
.cc-body { padding: 8px 0; border: 0 !important; }
.cc-body p { margin: 0 0 6px; }
.cc-h { font-size: 13px; color: var(--ink-3); margin-top: 8px !important; }
.cc-firms { list-style: none; margin: 0 0 8px; padding: 0; }
.cc-firms li { display: flex; justify-content: space-between; gap: 12px; min-height: 44px; align-items: center; border-bottom: 1px solid var(--rule); }
.cc-firms a { font-weight: 700; text-decoration: none; }
.cc-firms span { font-size: 14px; color: var(--ink-2); white-space: nowrap; }
.fp-links { display: flex; flex-direction: column; gap: 2px; margin: 4px 0 var(--s2) !important; }
.fp-link { display: inline-flex; align-items: center; min-height: 44px; font-size: 15px; }
@media (max-width: 900px) {
  .slot-mob { padding: 10px 20px 0; }
  .views { display: flex; width: fit-content; }
  .views button { padding: 0 14px; }
}
@media (min-width: 901px) { .slot-mob:empty { display: none; } }

/* ---------- 縣市頁、建築師詳細頁（三個方向共用） ---------- */
.dk-head { padding: var(--s6) 0 var(--s4); }
.dk-head h1 { font-family: var(--f-head); font-weight: var(--w-hero); font-size: clamp(40px, 6vw, 64px); line-height: 1.2; letter-spacing: .04em; margin: var(--s2) 0 var(--s3); text-wrap: balance; }
.dk-head .lede { font-size: 17px; line-height: 1.85; color: var(--ink-2); max-width: 34em; margin: 0 0 var(--s3); }
.dk-head .acts { display: flex; flex-wrap: wrap; gap: 8px; }
.dk-head .acts a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; border-radius: var(--pill); border: 1px solid var(--ink-2); text-decoration: none; font-size: 15px; }
.metrics { display: flex; flex-wrap: wrap; gap: var(--s4) var(--s7); margin: var(--s4) 0 var(--s5); }
.metric { display: flex; flex-direction: column; }
.metric .mv { font-family: var(--f-head); font-weight: var(--w-head); font-size: 40px; line-height: 1.1; }
.metric .ml { font-size: 14px; color: var(--ink-2); }
.dk-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: var(--s7); align-items: start; }
.inf-map { width: 100%; max-width: 520px; height: auto; aspect-ratio: 790 / 1070; display: block; }
.inf-map .land path { stroke: var(--paper); stroke-width: 1.2; vector-effect: non-scaling-stroke; }
.inf-map .pt-s { stroke: var(--pt-edge); stroke-width: 2; vector-effect: non-scaling-stroke; }
.inf-map .pt-s.lead { stroke: var(--gold-select); stroke-width: 3; }
.inf-map text { font: 600 22px var(--f-sans); }
.sent { font-size: 16px; color: var(--ink-2); margin: var(--s3) 0; max-width: 34em; }
.sec-h2 { font-family: var(--f-head); font-weight: var(--w-head); font-size: 24px; margin: var(--s6) 0 var(--s3); }
.cbars { list-style: none; margin: 0; padding: 0; }
.cbars li { display: grid; grid-template-columns: 6em 1fr 4em; gap: var(--s3); align-items: center; min-height: 40px; font-size: 15px; }
.cbars .b { height: 12px; border-radius: var(--pill); background: var(--inf-3); }
.cbars .v { text-align: right; color: var(--ink-2); font-size: 14px; }
.cbars a { text-decoration: none; }
.tl-axis-h { position: relative; height: 66px; margin: var(--s3) 0; overflow-x: auto; }
.tl-axis-h .ax { position: absolute; left: 0; right: 0; top: 30px; border-top: 1px solid var(--ink-3); min-width: 560px; }
.tl-axis-h i { position: absolute; top: 24px; width: 12px; height: 12px; margin-left: -6px; border-radius: 50%; background: var(--cat); border: 2px solid var(--pt-edge); }
.tl-axis-h span { position: absolute; top: 44px; font-size: 13px; color: var(--ink-3); transform: translateX(-50%); }
.wlist { list-style: none; margin: 0; padding: 0; }
.wlist li { display: grid; grid-template-columns: 4.2em 1fr auto; gap: var(--s3); align-items: center; min-height: 52px; padding: 6px 0; border-bottom: 1px solid var(--rule); }
.wlist .y { font-size: 14px; color: var(--ink-2); }
.wlist a { font-family: var(--f-head); font-weight: var(--w-head); text-decoration: none; }
.wlist a::before { content: ""; display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: var(--cat); margin-right: 8px; vertical-align: 1px; }
.wlist small { display: block; font-size: 13px; color: var(--ink-3); }
.rchip { font-size: 13px; padding: 2px 10px; border-radius: var(--pill); background: var(--paper-2); color: var(--ink-2); white-space: nowrap; }
.rchip.lead { background: color-mix(in srgb, var(--gold-select) 26%, var(--paper-2)); color: var(--ink); }
.stack { display: flex; height: 18px; border-radius: var(--pill); overflow: hidden; gap: 2px; margin: var(--s2) 0; }
.stack span { display: block; height: 100%; }
.stack-key { display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: 14px; color: var(--ink-2); }
.stack-key i { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 6px; }
.shapers { list-style: none; margin: 0; padding: 0; }
.shapers li { padding: var(--s3) 0; border-bottom: 1px solid var(--rule); }
.shapers .sh-top { display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: baseline; }
.shapers .sh-name { font-family: var(--f-head); font-weight: var(--w-head); font-size: 19px; text-decoration: none; }
.shapers .sh-bar { display: flex; height: 10px; border-radius: var(--pill); overflow: hidden; margin: 8px 0 4px; max-width: 420px; background: var(--paper-2); }
.shapers .sh-bar .l { background: var(--inf-4); } .shapers .sh-bar .a { background: var(--inf-2); } .shapers .sh-bar .t { background: var(--ink-3); opacity: .5; }
.shapers .sh-meta { font-size: 14px; color: var(--ink-2); }
.cty-nav { display: flex; justify-content: space-between; gap: var(--s3); margin: var(--s6) 0; }
.cty-nav a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; border-radius: var(--pill); background: var(--paper-2); text-decoration: none; }
.cty-index { list-style: none; margin: 0; padding: 0; columns: 2 260px; column-gap: var(--s6); }
.cty-index li { break-inside: avoid; display: grid; grid-template-columns: 5em 1fr 3.5em; gap: var(--s3); align-items: center; min-height: 48px; border-bottom: 1px solid var(--rule); }
.cty-index a { font-family: var(--f-head); font-weight: var(--w-head); font-size: 18px; text-decoration: none; }
.cty-index .b { height: 10px; border-radius: var(--pill); }
.cty-index .v { font-size: 14px; color: var(--ink-2); text-align: right; }
.note-s { font-size: 13px; color: var(--ink-3); }
@media (max-width: 900px) {
  .dk-grid { grid-template-columns: 1fr; gap: var(--s4); }
  .metrics { gap: var(--s3) var(--s5); }
  .metric .mv { font-size: 32px; }
  .inf-map { max-width: none; max-height: 70vh; }
}

/* =========================================================
   方向 E「黑金」（設計規範 review/方向E_黑金_設計規範.md）
   ========================================================= */
[data-theme="e"] {
  color-scheme: dark;
  --bg-0: #0E0C0A; --bg-1: #16130F; --bg-2: #1F1B16; --bg-3: #2A251E;
  --page-glow: radial-gradient(120% 80% at 18% 0%, #2A2116 0%, #16130F 55%, #0E0C0A 100%);
  --paper: var(--bg-1); --paper-2: var(--bg-2); --paper-3: var(--bg-3); --card: var(--bg-2); --base-bg: var(--bg-2);
  --ink: #E4DCCB; --ink-2: #B5AB99; --ink-3: #978D7C;
  --rule: rgba(212,175,106,.16); --line: transparent; --band: #0E0C0A; --band-ink: #E4DCCB;
  --accent: #F0C75E;
  --gold-text: #D4AF6A; --gold-text-dim: #8E7A52;
  --gold-title: linear-gradient(95deg, #F6E3AE 0%, #DDB86F 38%, #B98B45 68%, #E9CE8D 100%);
  --gold-emph: linear-gradient(135deg, #E9CE8E, #C69B52);
  --gold-on-emph: #17130F; --gold-select: #F0C75E;
  --gold-line: rgba(212,175,106,.30); --control-edge: #8A8070; /* L2 第十三節：控制項邊線去金，中性暖灰；對 bg-1 4.76、bg-2 4.40、bg-3 3.91 */
  --net-line: #D4AF6A; --net-halo: #0E0C0A;
  --sea: #12100D; --land: #352E24; --land-hl: #3F362A; --land-line: rgba(212,175,106,.20);
  --inf-0: #352E24; --inf-1: #554832; --inf-2: #6B5A3C; --inf-3: #816C46; --inf-4: #997F50; /* L2 第十三節第 4 項重排：相鄰階亮度比 1.50／1.34／1.32／1.32（工具實算） */
  --label-pill-bg: rgba(14,12,10,.88); --label-pill-ink: #E4DCCB;
  --pt-edge: #0E0C0A; --pt-est: #16130F;
  /* 2026-10-31 工具複驗後調整（scripts/contrast_check.py）：規範原值 文化 #7F95EA、景觀 #8DC46F、教育 #BC8CE0、行政 #A4AEBB
     在紅色盲模擬下交通–行政 ΔE 4.4、綠色盲下運動–景觀 5.6，容易混；改後四種模擬最小 ΔE 8.2，對陸地仍 ≥ 3.65:1。
     L2（第十三節第 12 項）嫌行政 #D9D2C4 太亮，建議 #B9B2A6；工具複驗該色在綠色盲下與景觀 ΔE 只有 2.1，改用 #888888（ΔE 最小 14.5，對陸地 3.78:1） */
  --c-culture: #6F86E6; --c-transit: #4BBCC8; --c-sport: #F0897A; --c-land: #6FC9A0;
  --c-edu: #D2A6F2; --c-welfare: #E78DB3; --c-housing: #B07866; --c-civic: #888888;
  --f-head: "Noto Serif TC", "Source Han Serif TC", "Songti TC", serif;
  --f-quote: "Cactus Classical Serif", "Noto Serif TC", serif;
  --f-en: "Cormorant Garamond", "Noto Serif TC", serif;
  --f-mono: var(--f-sans);
  --w-head: 600; --w-hero: 600;
  --measure: 34em;
  --r1: 10px; --r2: 16px; --r3: 24px; --r4: 32px; --pill: 999px;
  --r-leaf: 28px 8px 28px 8px;
  --arc-aside: 28px; --arc-hero: clamp(12px, 2.8vw, 40px); --arc-read: 28px; --sheet-top: 28px;
  --shadow-float: 0 12px 32px -12px rgba(0,0,0,.6);
  --shadow-panel: -24px 0 60px -28px rgba(0,0,0,.7);
  --grain: none;
}
[data-theme="e"] body { background: var(--bg-1) var(--page-glow) no-repeat; background-attachment: fixed; font-size: 17px; line-height: 1.9; letter-spacing: .02em; line-break: strict; }
[data-theme="e"] a { text-decoration-color: rgba(212,175,106,.6); }
/* 金漸層：只給 ≥24px 的標題與大數字 */
[data-theme="e"] :is(.masthead-title, .bignum, .w-title, .page-title, .dk-head h1, .an-hero h1, .n-big, .metric .mv, .firm-n, .pc-year, .cost-big) {
  background: var(--gold-title); -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent;
}
[data-theme="e"] :is(.n-big, .metric .mv, .firm-n, .pc-year, .bignum) { font-family: var(--f-en); font-weight: 500; font-variant-numeric: lining-nums; }
[data-theme="e"] .bignum { font-size: 140px; font-weight: 400; }
[data-theme="e"] .w-en { font-family: var(--f-en); font-size: 21px; font-style: italic; font-weight: 500; color: var(--ink-2); }
[data-theme="e"] .w-deck { font-family: var(--f-quote); font-size: 20px; color: var(--gold-text); }
[data-theme="e"] .kicker, [data-theme="e"] .w-kicker { color: var(--gold-text); }
[data-theme="e"] .site-nav a[aria-current="page"] { border-bottom-color: var(--gold-text); color: var(--gold-text); }
/* 首頁框架 */
[data-theme="e"] .atlas-aside { background: var(--bg-1); border-right: 0; border-radius: 0 var(--arc-aside) var(--arc-aside) 0 / 0 50% 50% 0; padding-right: 40px; box-shadow: 18px 0 40px -30px rgba(212,175,106,.35); z-index: 2; }
[data-theme="e"] .atlas-map { background: radial-gradient(ellipse at 60% 45%, #1A1611 0%, #12100D 60%, #0E0C0A 100%); }
[data-theme="e"] .base .land { filter: drop-shadow(0 0 6px rgba(212,175,106,.18)); }
[data-theme="e"] .map-svg.dragging .base .land { filter: none; }
[data-theme="e"] .base .land path { stroke: var(--land-line); stroke-width: .6; }
[data-theme="e"] .base .grat path { stroke: rgba(212,175,106,.10); stroke-dasharray: 1 5; }
[data-theme="e"] .base .grat-label text { font: 400 12px var(--f-sans); fill: var(--ink-3); font-variant-numeric: tabular-nums; letter-spacing: .06em; }
[data-theme="e"] .base .sea-label { fill: var(--gold-text-dim); font-family: var(--f-head); }
[data-theme="e"] .base .inset { stroke: var(--gold-line); }
[data-theme="e"] .base .tp-bg { fill: var(--bg-2); }
[data-theme="e"] .base .tp-label-bg { fill: var(--bg-2); }
[data-theme="e"] .base .inset-label { fill: var(--gold-text); }
[data-theme="e"] .base .tp-lead rect { stroke: var(--gold-line); }
[data-theme="e"] .base .tp-lead path { stroke: rgba(212,175,106,.6); stroke-dasharray: none; stroke-width: 1.25; }
[data-theme="e"] .pt.is-sel .ring { stroke: var(--gold-select); filter: drop-shadow(0 0 6px rgba(240,199,94,.7)); }
[data-theme="e"] :is(.btn-sm, .f-toggle, .map-ctrl, .regions button, .chip) { border: 1px solid var(--control-edge); background: var(--bg-2); color: var(--ink); }
[data-theme="e"] :is(.btn-sm, .f-toggle, .regions button):hover { background: var(--bg-3); }
[data-theme="e"] .map-ctrl { box-shadow: var(--shadow-float); }
[data-theme="e"] .map-ctrl button + button { border-color: var(--control-edge); }
[data-theme="e"] .chip[aria-pressed="true"] { background: var(--bg-3); }
[data-theme="e"] .chip[aria-pressed="false"] { background: transparent; color: var(--ink-3); }
[data-theme="e"] :is(.f-grid select, .f-grid input, .firm-tools input, .firm-tools select) { background-color: var(--bg-2); border: 1px solid var(--control-edge); border-radius: var(--r2); padding: 4px 12px; color: var(--ink); }
[data-theme="e"] .f-grid select { background-image: linear-gradient(45deg, transparent 50%, var(--gold-text) 50%), linear-gradient(135deg, var(--gold-text) 50%, transparent 50%); padding-right: 28px; }
[data-theme="e"] .legend { background: rgba(22,19,15,.92); }
[data-theme="e"] .views { background: var(--bg-2); border: 1px solid var(--control-edge); }
[data-theme="e"] .views button[aria-pressed="true"] { background: var(--gold-emph); color: var(--gold-on-emph); }
[data-theme="e"] .layer-info { background: var(--bg-2); }
[data-theme="e"] .r-btn[aria-current="true"] { background: var(--bg-3); }
[data-theme="e"] .r-btn[aria-current="true"] .r-year { color: var(--gold-select); }
[data-theme="e"] .cluster { background: var(--bg-2); border: 0; box-shadow: var(--shadow-float); border-radius: var(--r3); }
[data-theme="e"] .tip { background: #E4DCCB; color: #16130F; border-radius: var(--r1); }
[data-theme="e"] .to-map { background: var(--gold-emph); color: var(--gold-on-emph); }
[data-theme="e"] .btn-gold, [data-theme="e"] .w-open a { background: var(--gold-emph); color: var(--gold-on-emph); border: 0; }
/* 面板：深頭淺身 */
[data-theme="e"] .read-toggle { display: inline-flex; align-items: center; }
[data-theme="e"] .panel { background: var(--bg-1); border-left: 0; box-shadow: var(--shadow-panel); border-radius: var(--r4) 0 0 var(--r4); }
[data-theme="e"] .panel-bar { background: var(--bg-1); border-bottom-color: var(--rule); }
[data-theme="e"] .panel-bar .grip { background: rgba(212,175,106,.5); width: 36px; height: 4px; margin-left: -18px; }
[data-theme="e"] .w-summary { background: var(--bg-2); border-radius: var(--r-leaf); }
[data-theme="e"] .w-toc { background: color-mix(in srgb, var(--bg-1) 94%, transparent); border-bottom-color: var(--rule); }
[data-theme="e"] .w-toc a { background: var(--bg-2); border: 1px solid var(--control-edge); }
[data-theme="e"] .p-btn { border-color: var(--control-edge); }
[data-theme="e"] a.party:hover .p-btn { background: var(--gold-emph); color: var(--gold-on-emph); border-color: transparent; }
[data-theme="e"] .pcard { border-radius: var(--r-leaf); background: color-mix(in srgb, var(--cat) 16%, var(--bg-2)); }
[data-theme="e"] .pc-shape .cs-land { fill: color-mix(in srgb, var(--cat) 30%, var(--bg-2)); stroke: color-mix(in srgb, var(--cat) 50%, var(--bg-2)); }
[data-theme="e"] .read-zone {
  color-scheme: light;
  --paper: #F6EFE3; --paper-2: #EADFCD; --paper-3: #DFD2BC; --card: #FFFAF0; --base-bg: #EADFCD;
  --ink: #2A241D; --ink-2: #51473A; --ink-3: #6B6051; --rule: #DDD0BA; --accent: #B5472F;
  --gold-select: #8A6420; --pt-edge: #F6EFE3;
  --c-culture: #3A4FA8; --c-transit: #17707D; --c-sport: #B5472F; --c-land: #46722A;
  --c-edu: #6A4BB0; --c-welfare: #B03E78; --c-housing: #8A5240; --c-civic: #5C6878;
  --land: #E2D6C2; --land-hl: #CDBB98;
  background: var(--paper); color: var(--ink);
  margin: var(--s5) calc(-1 * var(--s6)) 0; padding: var(--s5) var(--s6) 0;
  border-radius: 50% 50% 0 0 / var(--arc-read) var(--arc-read) 0 0;
  box-shadow: 0 -1px 0 rgba(212,175,106,.30);
}
[data-theme="e"] .read-zone a { color: #664A12; text-decoration-color: #664A12; }
[data-theme="e"] .read-zone .w-sec { background: transparent; }
[data-theme="e"] .read-zone .w-sec h2, [data-theme="e"] .read-zone .sub-h { color: var(--ink); }
[data-theme="e"] .read-zone .concept { font-size: 17px; line-height: 1.9; letter-spacing: .02em; text-wrap: pretty; }
[data-theme="e"] .read-zone .w-base { margin-left: calc(-1 * var(--s6)); margin-right: calc(-1 * var(--s6)); border-radius: var(--r4) var(--r4) 0 0; }
[data-theme="e"] .read-zone .p-btn { border-color: #6B6051; }
[data-theme="e"] .read-zone a.party:hover .p-btn { background: #2A241D; color: #F6EFE3; }
[data-theme="e"] .read-zone .fp-link { color: #664A12; }
[data-theme="e"][data-reading="dark"] .read-zone {
  color-scheme: dark;
  --paper: #1F1B16; --paper-2: #2A251E; --paper-3: #352E24; --card: #2A251E; --base-bg: #2A251E;
  --ink: #E4DCCB; --ink-2: #B5AB99; --ink-3: #978D7C; --rule: rgba(212,175,106,.16);
  --c-culture: #6F86E6; --c-transit: #4BBCC8; --c-sport: #F0897A; --c-land: #6FC9A0;
  --c-edu: #D2A6F2; --c-welfare: #E78DB3; --c-housing: #B07866; --c-civic: #888888;
  --gold-select: #F0C75E; --pt-edge: #0E0C0A; --land: #352E24; --land-hl: #3F362A;
  letter-spacing: .03em;
}
[data-theme="e"][data-reading="dark"] .read-zone a, [data-theme="e"][data-reading="dark"] .read-zone .fp-link { color: #D4AF6A; text-decoration-color: rgba(212,175,106,.6); }
[data-theme="e"][data-reading="dark"] .read-zone .concept { line-height: 1.95; }
/* 內頁 */
[data-theme="e"] .page-head { border-bottom: 1px solid var(--rule); }
[data-theme="e"] .brand { color: var(--gold-text); }
[data-theme="e"] .firm { background: var(--bg-2); border-radius: var(--r3); padding: var(--s5); margin-bottom: var(--s4); border: 0; }
[data-theme="e"] .firm-single { border-top-color: var(--rule); }
[data-theme="e"] .an-hero { margin: var(--s4) 0 0; padding: var(--s7) var(--s6) calc(var(--s7) + 10px); border-radius: 0 0 50% 50% / 0 0 var(--arc-hero) var(--arc-hero); background: var(--bg-0) radial-gradient(90% 120% at 15% 0%, rgba(212,175,106,.16), transparent 60%); }
[data-theme="e"] .an-sec:nth-of-type(even) { margin: 0; padding: var(--s7) var(--s6); border-radius: var(--r4); background: var(--bg-2); }
[data-theme="e"] .tl-year, [data-theme="e"] .an-sec:nth-of-type(even) .tl-year { background: transparent; }
[data-theme="e"] .bars .b { background: var(--gold-emph); }
[data-theme="e"] .bars .b.dom { background: #6F6757; }
[data-theme="e"] .waffle i { background: #D4AF6A; }
[data-theme="e"] .waffle i.dom { background: #3A3328; box-shadow: none; }
[data-theme="e"] .cbars .b { background: var(--gold-emph); }
[data-theme="e"] .dk-head .acts a { border-color: var(--control-edge); background: var(--bg-2); }
[data-theme="e"] .dk-head .acts a.btn-gold { background: var(--gold-emph); color: var(--gold-on-emph); border: 0; }
[data-theme="e"] .rchip.lead { background: rgba(212,175,106,.22); color: var(--ink); }
[data-theme="e"] .shapers .sh-bar { background: var(--bg-3); }
[data-theme="e"] .cty-nav a { background: var(--bg-2); border: 1px solid var(--control-edge); }
[data-theme="e"] .site-foot { border-top-color: var(--rule); }
@media (max-width: 900px) {
  [data-theme="e"] .atlas-aside { border-radius: 0; padding-right: 0; box-shadow: none; }
  [data-theme="e"] .atlas-head { background: var(--page-glow); }
  [data-theme="e"] .atlas-map { border-top: 0; }
  [data-theme="e"] .panel { border-radius: var(--sheet-top) var(--sheet-top) 0 0; }
  [data-theme="e"] .read-zone { border-radius: 50% 50% 0 0 / 20px 20px 0 0; }
  [data-theme="e"] .panel-bar { flex-wrap: wrap; }
  [data-theme="e"] .bignum-lbl { font-size: 15px; color: var(--gold-text); }
}
@media (prefers-reduced-motion: reduce) { .fp-lines path { transition: none; } }
.firm-map .land use { stroke: var(--paper); stroke-width: 2; }
.firm-map-link { display: block; grid-column: 3; grid-row: 1 / 3; }
@media (max-width: 900px) { .firm-map-link { grid-column: 2; grid-row: 2; } }
.nb { white-space: nowrap; }
@media (max-width: 900px) { [data-theme="e"] .an-hero h1 { font-size: 34px; } [data-theme="e"] .an-hero { padding-left: 20px; padding-right: 20px; } }
@media (max-width: 900px) { [data-theme="e"] .panel-bar .crumb { display: none; } [data-theme="e"] .panel-bar .pn { margin-left: auto; } }
/* 建築師與影響地域視角：首頁大數字與大臺北放大框讓位給圖層 */
body[data-view="architect"] .bignum, body[data-view="region"] .bignum { opacity: 0; }
body[data-view="architect"] .tp-inset, body[data-view="architect"] .tp-lead { display: none; }

/* =========================================================
   L2 第十三節修正（2026-10-31）
   ========================================================= */
:root { --lead-ring: var(--ink-2); }
[data-theme="e"] { --lead-ring: #D4AF6A; }
.pt .ring, .pt .lring, .pt .gap { fill: none; stroke: none; vector-effect: non-scaling-stroke; }
.pt.fp-lead .lring { stroke: var(--lead-ring); stroke-width: 1.75px; }
.pt.is-sel .gap { stroke: var(--pt-edge); stroke-width: 2px; }
.pt.is-sel .ring { stroke: var(--gold-select); stroke-width: 2.5px; }
.pt.fp-lead .ring { stroke: none !important; }
.pt.fp-lead.is-sel .ring { stroke: var(--gold-select) !important; }
[data-theme="e"] .pt.is-sel .ring { filter: drop-shadow(0 0 5px rgba(240,199,94,.75)); }
[data-theme="e"] .pt.fp-lead .lring { filter: none; }
body[data-view="architect"] .pt.off .dot { fill: var(--ink-3) !important; stroke: none !important; }
body[data-view="architect"] .pt.off { opacity: .12; }
.fp-badge text { dominant-baseline: central; }
.fp-badge.range { cursor: pointer; }
.fp-badge rect { fill: var(--gold-select); stroke: var(--net-halo); stroke-width: 1.5; }
.fp-order { margin: 6px 0 0; font-size: 14px; }
.fp-order summary { min-height: 44px; display: flex; align-items: center; cursor: pointer; color: var(--ink-2); }
.fp-order ol { list-style: none; margin: 0; padding: 0; max-height: 260px; overflow-y: auto; }
.fp-order li button { display: grid; grid-template-columns: 2.2em 3.4em 1fr; gap: 6px; width: 100%; min-height: 40px; align-items: center; text-align: left; background: none; border: 0; border-bottom: 1px solid var(--rule); color: var(--ink); cursor: pointer; font-size: 14px; }
.fp-order .no { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: var(--gold-select); color: #17130F; font-size: 12px; font-weight: 700; }
.fp-order .yr { color: var(--ink-2); }
/* 金色去重：kicker、風格句、導覽目前頁、插圖標籤改象牙或灰；摘要只留造價一個金數字 */
[data-theme="e"] .kicker, [data-theme="e"] .w-kicker { color: var(--ink-2); }
[data-theme="e"] .w-deck { color: var(--ink); }
[data-theme="e"] .bignum-lbl { color: var(--ink-2) !important; }
[data-theme="e"] .site-nav a[aria-current="page"] { color: var(--ink); border-bottom-color: var(--ink); }
[data-theme="e"] .base .inset-label { fill: var(--ink-2); }
[data-theme="e"] .num + .num .n-big { background: none; -webkit-text-fill-color: currentColor; color: var(--ink); }
[data-theme="e"] .views button[aria-pressed="true"] { background: #E4DCCB; color: #16130F; }
[data-theme="e"] .brand { color: var(--ink); }
/* 大臺北引線：曲線 */
.base .tp-lead path.curve { fill: none; stroke-linecap: round; stroke-dasharray: none; }
[data-theme="e"] .base .tp-lead path.curve { stroke: rgba(212,175,106,.6); stroke-width: 1.25; }
.base .tp-lead circle { fill: none; stroke: var(--ink-3); stroke-width: 1; vector-effect: non-scaling-stroke; }
[data-theme="e"] .base .tp-lead circle { stroke: rgba(212,175,106,.6); }
.atlas.has-panel .tp-inset, .atlas.has-panel .tp-lead { display: none; }
/* 強度色階圖例：未收錄用斜紋樣本 */
.inf-legend i.none { background: repeating-linear-gradient(45deg, var(--inf-0) 0 3px, color-mix(in srgb, var(--ink) 25%, var(--inf-0)) 3px 4.5px) !important; }
/* checkbox */
.li-check { min-height: 44px; padding-right: 8px; margin-right: 8px; }
.li-check input, .firm-tools .check input { accent-color: var(--ink); width: 22px; height: 22px; }
[data-theme="e"] .li-check input, [data-theme="e"] .firm-tools .check input { accent-color: #D4AF6A; }
/* 小地圖：圓角與邊緣漸隱，不硬裁 */
.inf-map { border-radius: var(--r3); background: var(--sea); -webkit-mask-image: radial-gradient(ellipse 75% 70% at 50% 50%, #000 70%, transparent 100%); mask-image: radial-gradient(ellipse 75% 70% at 50% 50%, #000 70%, transparent 100%); }
.zoom-box { margin-top: var(--s4); }
.zoom-box h3 { font-size: 15px; margin: 0 0 6px; color: var(--ink-2); font-weight: 500; }
/* 建築師頁指標 2×2（手機） */
@media (max-width: 900px) { .metrics { display: grid; grid-template-columns: 1fr 1fr; } }
/* 作品清單去虛線 */
.firm-works li { border-bottom: 0; padding-bottom: 10px; }
/* 閱讀區標籤與圖版：暖色基底 */
[data-theme="e"] .read-zone .tag { background: #EADFCD; }
[data-theme="e"] .pcard { background: color-mix(in srgb, var(--cat) 10%, #241F19); }
/* 手機首屏：收緊刊頭，視角膠囊放在導覽下、地圖上方，地圖與膠囊同屏 */
@media (max-width: 900px) {
  .atlas-head { padding-top: var(--s4); padding-bottom: var(--s2); }
  .masthead-title { font-size: 36px; margin: 4px 0 4px; }
  .bignum-lbl { margin-bottom: 6px; }
  .lede-s { margin-bottom: 4px; line-height: 1.7; }
  .atlas-head .site-nav { gap: var(--s4); }
  .atlas-head .slot-desk { margin-top: 6px; }
  .atlas-head .views button { min-height: 42px; }
  [data-theme="e"] .atlas-map::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 28px; background: linear-gradient(var(--bg-1), transparent); z-index: 2; pointer-events: none; }
}
.fp-order-list { list-style: none; margin: 0; padding: 0; }
.fp-no { display: inline-grid; place-items: center; min-width: 22px; height: 22px; border-radius: 11px; background: var(--gold-select); color: #17130F; font-size: 12px; font-weight: 700; margin-right: 4px; }
@media (max-width: 900px) { body[data-page="county"] .inf-map { max-height: 54vh; margin: 0 auto; } }
[data-theme="e"] .pt.fp-lead .lring { filter: drop-shadow(0 0 1.2px #0E0C0A) drop-shadow(0 0 1.2px #0E0C0A); } /* 主設計環在金色縣市上：加深色細邊（環對第 4 階只有 1.84:1，描邊對第 4 階 5.12:1） */
@media (max-width: 900px) { [data-theme="e"] .an-hero .inner { padding: 0; } }
/* L2 複驗殘留修正（2026-10-31） */
.n-big.is-tbd { font-size: 20px !important; color: var(--ink-3) !important; background: none !important; -webkit-text-fill-color: currentColor !important; font-family: var(--f-sans) !important; }
@media (max-width: 900px) { .w-title.is-long { font-size: 24px; } }
body[data-view="architect"] .pt.off { opacity: .1; }
[data-theme="e"] .pcard { background: color-mix(in srgb, var(--cat) 6%, #2A2219); }
[data-theme="e"] .read-zone .tag, [data-theme="e"] .read-zone .tag:hover { background: #EADFCD; }

/* =========================================================
   方向 E-1＋第十四節質感修正（2026-10-31）
   ?theme=e1：版面退後（4）＋影響地域新色階與細曲線（2）＋一道光（3），類型色沿用現行
   ?theme=e1a：再換 A 金屬八色（1-A）；?theme=e1b：再換 B 單色點加聚焦（1-B）
   ?theme=e 保留原版對照。色碼經 scripts/contrast_check.py 公式實算（~/tmp-twarch-tools/e2/）
   ========================================================= */
[data-variant="e1"] {
  --r-ctl: 10px;
  /* 2：影響地域五階，只有最高階帶金；相鄰亮度比 1.37／1.31／1.39／1.46（實算） */
  --inf-0: #352E24; --inf-1: #4A4338; --inf-2: #5D5446; --inf-3: #74695A; --inf-4: #9C8250;
  /* 3.2：標題區光柱，alpha 上限 .12（text-3 對最亮處 4.57:1，實算） */
  /* L2 抽驗第二節：alpha .12 → .18（區內不放 text-3）。圓心放容器外 (22%, -30%) 實測頂邊仍是最亮處，硬邊更明顯；
     改用 closest-side：光暈在碰到任何一邊之前就衰減到透明，四邊都不會切出矩形（L2 第六節 1 的第二種修法） */
  --hero-light: radial-gradient(ellipse closest-side at 30% 42%, rgba(212,175,106,.18), rgba(212,175,106,.07) 55%, transparent 100%);
  --land-c: #403629;
}
/* 2：足跡曲線變細 */
[data-variant="e1"] .fp-lines .fp-line { stroke-width: 1.4; }
[data-variant="e1"] .fp-lines .fp-halo { stroke-width: 3.5; }

/* ---------- 3.1 地圖舞台的一道光（光在海面與島後，不在陸地中心） ----------
   L2 抽驗第二節：光束桌機 .10（手機維持 .06）；暗角最暗 #060605 只用在 90% 以外 */
[data-variant="e1"] .atlas-map {
  background:
    linear-gradient(115deg, transparent 28%, rgba(212,175,106,var(--beam-a, .10)) 44%, rgba(212,175,106,calc(var(--beam-a, .10) * .4)) 52%, transparent 66%),
    radial-gradient(ellipse 55% 70% at 56% 46%, var(--halo-c, #1B1610) 0%, #13100C 55%, transparent 100%),
    radial-gradient(ellipse 140% 120% at 56% 46%, #12100D 40%, #0A0908 90%, #060605 100%);
}
body[data-view="architect"] { --beam-a: .05; }
body[data-view="region"] { --beam-a: 0; --halo-c: #13100C; }
[data-variant="e1"] .base .land { filter: drop-shadow(0 0 6px rgba(212,175,106,.18)) drop-shadow(0 0 28px rgba(212,175,106,.10)); }
[data-variant="e1"] body[data-view="region"] .base .land { filter: drop-shadow(0 0 6px rgba(212,175,106,.18)); }
[data-variant="e1"] .map-svg.dragging .base .land { filter: none; }
[data-variant="e1"] .base .land path { fill: url(#e1-land-glow); }
[data-variant="e1"] .base .land path.hl { fill: var(--land-hl); }
[data-variant="e1"] #e1-land-glow .lg-c { stop-color: var(--land-c); }
[data-variant="e1"] #e1-land-glow .lg-e { stop-color: var(--land); }
/* 3.2 標題區光柱 */
[data-variant="e1"] :is(.w-head, .dk-head, .atlas-head) { background-image: var(--hero-light); background-repeat: no-repeat; }
/* 光柱區內不得有 text-3（對最亮處只有 4.03:1）：區內 text-3 一律升 text-2 */
[data-variant="e1"] :is(.w-head, .dk-head, .atlas-head, .an-hero) :is(.w-meta dt, .muted, .note, small, .kicker, .w-kicker, .sep, .dk-sub, .grat-label) { color: var(--ink-2); }
@media (max-width: 900px) { [data-variant="e1"] .atlas-head { background-image: var(--hero-light), var(--page-glow); } }
[data-variant="e1"] .an-hero { background: var(--bg-0) var(--hero-light); }

/* ---------- 4.2 篩選：一行「篩選 N ▾｜類型文字鍵」，其餘收進抽屜 ---------- */
[data-variant="e1"] .filters { border-top: 1px solid var(--rule); padding-top: var(--s2); margin: var(--s2) 0 var(--s4); }
[data-variant="e1"] .f-title { display: flex; flex-wrap: wrap; align-items: center; gap: 0 var(--s3); margin: 0; }
[data-variant="e1"] .f-title h2 { display: flex; align-items: center; margin: 0; font-size: 15px; letter-spacing: 0; }
[data-variant="e1"] .f-title h2::after { content: ""; width: 1px; height: 16px; margin-left: var(--s3); background: var(--rule); }
[data-variant="e1"] .f-drawer { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0; border: 0; background: none; color: var(--ink-2); font: 500 15px/1.4 var(--f-sans); letter-spacing: .04em; cursor: pointer; }
[data-variant="e1"] .f-drawer .f-n { color: var(--gold-text); font-variant-numeric: tabular-nums; }
[data-variant="e1"] .f-drawer .f-caret { font-size: 13px; transition: transform .25s ease; }
[data-variant="e1"] .f-drawer[aria-expanded="true"] .f-caret { transform: rotate(180deg); }
[data-variant="e1"] :is(.f-drawer, .chip, .regions button, .map-ctrl button, .panel-bar .btn-back, .panel-bar .pn .btn-sm, .f-close, .f-reset):is(:hover, :focus-visible) { color: var(--ink); text-decoration: underline; text-decoration-color: var(--gold-line); text-underline-offset: 6px; }
/* 類型文字鍵（兼圖例） */
[data-variant="e1"] .chips { display: contents; }
[data-variant="e1"] .f-title { column-gap: 10px; justify-content: flex-start; }
[data-variant="e1"] .chip, [data-variant="e1"] .chip[aria-pressed] { min-height: 40px; padding: 0; gap: 6px; border: 0; border-radius: 0; background: none; color: var(--ink-2); font-size: 15px; }
[data-variant="e1"] .chip .sw { width: 9px; height: 9px; }
[data-variant="e1"] .chip .n { font-size: 13px; color: var(--ink-3); font-variant-numeric: tabular-nums; }
[data-variant="e1"] .chips.is-subset .chip[aria-pressed="true"] { color: var(--ink); text-decoration: underline; text-decoration-color: var(--gold-text); text-underline-offset: 6px; }
[data-variant="e1"] .chips.is-subset .chip[aria-pressed="false"] { color: var(--ink-3); }
[data-variant="e1"] .chip[aria-pressed="false"] .sw { background: transparent; box-shadow: inset 0 0 0 1.5px var(--cat); opacity: .7; }
/* 抽屜（桌機：左欄內展開；手機：底部抽屜） */
[data-variant="e1"] .f-body { margin: var(--s2) 0 var(--s3); padding: var(--s3) 0 0; border-top: 1px solid var(--rule); }
[data-variant="e1"] .f-body[hidden], [data-variant="e1"] .f-scrim[hidden] { display: none; }
[data-variant="e1"] .f-body-head { display: flex; align-items: center; gap: var(--s4); margin-bottom: var(--s2); }
[data-variant="e1"] .f-body-t { flex: 1; font-size: 13px; color: var(--ink-3); letter-spacing: .08em; }
[data-variant="e1"] .f-reset { font-size: 15px; text-decoration: none; color: var(--ink-2); }
[data-variant="e1"] .f-reset[hidden] { display: none; }
[data-variant="e1"] .f-close { display: none; min-height: 44px; padding: 0; border: 0; background: none; color: var(--ink-2); font-size: 15px; cursor: pointer; }
[data-variant="e1"] #more-toggle { display: none !important; }
[data-variant="e1"] .f-body .f-more { margin: 0; }
[data-variant="e1"] .f-note { font-size: 13px; }
[data-variant="e1"] .f-body-foot { margin-top: var(--s3); }
[data-variant="e1"] .f-go { width: 100%; min-height: 48px; border-radius: var(--r-ctl); font: 700 15px/1 var(--f-sans); letter-spacing: .06em; cursor: pointer; }
[data-variant="e1"] :is(.f-grid select, .f-grid input, .firm-tools input, .firm-tools select) { border-radius: var(--r-ctl); }
@media (max-width: 900px) {
  [data-variant="e1"] .f-body { position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; max-height: 82vh; overflow-y: auto; margin: 0; padding: 18px 20px calc(16px + env(safe-area-inset-bottom)); background: var(--bg-1); border-top: 0; border-radius: var(--sheet-top) var(--sheet-top) 0 0; box-shadow: 0 -18px 50px rgba(0,0,0,.6); }
  [data-variant="e1"] .f-body::before { content: ""; display: block; width: 36px; height: 4px; margin: -8px auto 10px; border-radius: 2px; background: rgba(212,175,106,.5); }
  [data-variant="e1"] .f-close { display: inline-flex; align-items: center; }
  [data-variant="e1"] .f-body-foot { position: sticky; bottom: 0; padding-top: var(--s2); background: var(--bg-1); }
  [data-variant="e1"] .f-scrim { position: fixed; inset: 0; z-index: 39; background: rgba(10,9,8,.6); }
  body.f-sheet-open { overflow: hidden; }
  [data-variant="e1"] .f-title h2::after { display: none; }
  [data-variant="e1"] .chips { display: flex; flex-basis: 100%; flex-wrap: nowrap; gap: 0 18px; overflow-x: auto; }
  [data-variant="e1"] .chip, [data-variant="e1"] .chip[aria-pressed] { min-height: 44px; }
}

/* ---------- 區域快速鍵：純文字標籤 ---------- */
[data-variant="e1"] .regions { gap: 0; }
[data-variant="e1"] .regions button { min-height: 36px; padding: 0 2px; border: 0; border-radius: 0; background: transparent; color: var(--ink-2); font-size: 13px; letter-spacing: .06em; gap: 8px; }
[data-variant="e1"] .regions button span { font-size: 13px; color: var(--ink-3); font-variant-numeric: tabular-nums; }
[data-variant="e1"] .regions button:hover { background: transparent; }
/* ---------- 縮放：無框文字鍵（桌機垂直；手機保留 ＋ － 全島，依協調指示不移除） ---------- */
/* E 的 :is(.map-ctrl, .regions button…) 取最高特異度 (0,2,1)，這裡多加一層 .atlas-map 才蓋得過 */
[data-variant="e1"] .atlas-map .map-ctrl { border: 0; border-radius: var(--r-ctl); background: transparent; box-shadow: none; }
[data-variant="e1"] .map-ctrl button { min-width: 44px; height: 40px; color: var(--ink-2); font-size: 17px; background: transparent; }
[data-variant="e1"] .map-ctrl button + button { border: 0; }
[data-variant="e1"] .map-ctrl .z-all { font-size: 15px; }
[data-variant="e1"] .map-ctrl button:hover { background: transparent; }
@media (max-width: 900px) {
  [data-variant="e1"] .atlas-map .map-ctrl { background: rgba(14,12,10,.62); }
  [data-variant="e1"] .map-ctrl button { height: 44px; }
  [data-variant="e1"] .regions { gap: 20px; padding-top: 6px; }
  [data-variant="e1"] .regions button { min-height: 44px; }
}

/* ---------- 4.1 首屏字級：13／15／17／24／34／48（130 大數字為裝飾、地圖內 12px 標籤為例外） ---------- */
[data-variant="e1"] .masthead-title { font-size: 48px; }
[data-variant="e1"] .lede-s { font-size: 17px; }
[data-variant="e1"] .bignum-lbl, [data-variant="e1"] .map-scale, [data-variant="e1"] .legend { font-size: 13px; }
[data-variant="e1"] :is(.r-year, .r-sub, .results-head .count) { font-size: 13px; }
@media (max-width: 900px) { [data-variant="e1"] .masthead-title { font-size: 34px; } [data-variant="e1"] .bignum-lbl { font-size: 13px; } }

/* ---------- 作品面板：文字鍵，只留「深色閱讀」有框 ---------- */
[data-variant="e1"] .panel-bar { gap: 2px; }
[data-variant="e1"] .panel-bar .btn-sm { border: 0; border-radius: var(--r-ctl); background: transparent; color: var(--ink-2); padding: 0 8px; font-size: 15px; }
[data-variant="e1"] .panel-bar .btn-sm:hover { background: transparent; }
[data-variant="e1"] .panel-bar .read-toggle { border: 1px solid var(--control-edge); color: var(--ink); margin-left: 4px; padding: 0 12px; }
[data-variant="e1"] .panel-bar .read-toggle:hover { background: var(--bg-2); }
[data-variant="e1"] .panel-bar .pn { gap: 4px; align-items: center; }
[data-variant="e1"] #prev::before { content: "‹ " / ""; }
[data-variant="e1"] #next::after { content: " ›" / ""; }
[data-variant="e1"] .w-toc { gap: 2px; }
[data-variant="e1"] .w-toc a { border: 0; border-radius: 0; background: transparent; color: var(--ink-2); padding: 0 10px; font-size: 15px; }
[data-variant="e1"] .w-toc a:hover { background: transparent; color: var(--ink); text-decoration: underline; text-decoration-color: var(--gold-line); text-underline-offset: 6px; }
[data-variant="e1"] .p-btn { border: 0; border-radius: 0; padding: 0 2px; font-weight: 400; color: var(--ink-2); text-decoration: underline; text-decoration-color: var(--gold-line); text-underline-offset: 6px; }
[data-variant="e1"] .party.is-warn .p-btn { text-decoration-style: dashed; }
[data-variant="e1"] a.party:hover .p-btn { background: transparent; color: var(--ink); text-decoration-color: currentColor; }
[data-variant="e1"] .read-zone .p-btn { color: var(--ink-2); text-decoration-color: #9C8A6A; }
[data-variant="e1"] .read-zone a.party:hover .p-btn { background: transparent; color: var(--ink); }
[data-variant="e1"] .read-zone .tag { border-radius: var(--r-ctl); }
[data-variant="e1"] .w-kicker, [data-variant="e1"] .p-meta, [data-variant="e1"] .w-meta dt { font-size: 13px; }
[data-variant="e1"] .w-meta dd, [data-variant="e1"] .sum-h { font-size: 15px; }
[data-variant="e1"] :is(.w-en, .w-deck) { font-size: 17px; }
[data-variant="e1"] .w-title { font-size: clamp(24px, 3vw, 34px); }
[data-variant="e1"] .pc-year { font-size: 48px; }
[data-variant="e1"] .n-big { font-size: 34px; }
@media (max-width: 900px) { [data-variant="e1"] .n-big { font-size: 24px; } }

/* ---------- 1-A 金屬八色（交通依規範補救順序只提明度 L*+4：#7FB3B0 → #8ABEBB；
   L2 抽驗第六節：運動與社宅一般視覺太近，運動再提明度 L*+6：#D08A62 → #E29A71，運動–社宅一般 ΔE 11.2 → 16.3，全模式最小 ΔE 9.0（景觀–教育，綠色盲）） ---------- */
[data-theme="e"][data-pal="a"] {
  --c-culture: #8FA3BD; --c-transit: #8ABEBB; --c-sport: #E29A71; --c-land: #C3D0B0;
  --c-edu: #D4A5A0; --c-welfare: #E8D5A8; --c-housing: #B8735A; --c-civic: #9A9186;
}
[data-theme="e"][data-pal="a"] .read-zone, [data-theme="e"][data-pal="b"] .read-zone {
  --c-culture: #4A6180; --c-transit: #2F7472; --c-sport: #A5552F; --c-land: #55703F;
  --c-edu: #94524E; --c-welfare: #84651F; --c-housing: #8A4A38; --c-civic: #6F675C;
}
[data-theme="e"][data-pal][data-reading="dark"] .read-zone {
  --c-culture: #8FA3BD; --c-transit: #8ABEBB; --c-sport: #E29A71; --c-land: #C3D0B0;
  --c-edu: #D4A5A0; --c-welfare: #E8D5A8; --c-housing: #B8735A; --c-civic: #9A9186;
}
/* 香檳點上的主設計金環：靠 bg-0 間隔分開（規範 1-A 代價補救） */
[data-theme="e"][data-pal] .pt.fp-lead .gap { stroke: var(--pt-edge); stroke-width: 2px; }
/* ---------- 1-B 單色點：預設象牙，選了類型才上色（由程式設 --c-* = --c-focus-*） ---------- */
[data-theme="e"][data-pal="b"] {
  --c-dot-base: #C4BBA8;
  --c-culture: var(--c-dot-base); --c-transit: var(--c-dot-base); --c-sport: var(--c-dot-base); --c-land: var(--c-dot-base);
  --c-edu: var(--c-dot-base); --c-welfare: var(--c-dot-base); --c-housing: var(--c-dot-base); --c-civic: var(--c-dot-base);
  --c-focus-culture: #8FA3BD; --c-focus-transit: #8ABEBB; --c-focus-sport: #E29A71; --c-focus-land: #C3D0B0;
  --c-focus-edu: #D4A5A0; --c-focus-welfare: #E8D5A8; --c-focus-housing: #B8735A; --c-focus-civic: #9A9186;
}
[data-theme="e"][data-pal="b"] .pt.dim { opacity: .35; }
[data-theme="e"][data-pal="b"] .pt.is-sel .dot { fill: var(--cf) !important; }
[data-theme="e"][data-pal="b"] .chips:not(.is-subset) .chip .sw { background: transparent; box-shadow: inset 0 0 0 1.5px var(--c-dot-base); }
@media (max-width: 900px) {
  /* 3.1 手機：光束 100 度、alpha ≤ .06；島周光暈集中上半部；影響地域視角關光（body 變數 --beam-a: 0） */
  [data-variant="e1"] .atlas-map {
    background:
      linear-gradient(100deg, transparent 28%, rgba(212,175,106,var(--beam-a-m, .06)) 44%, rgba(212,175,106,calc(var(--beam-a-m, .06) * .4)) 52%, transparent 66%),
      radial-gradient(ellipse 90% 60% at 52% 40%, var(--halo-c, #1B1610) 0%, #13100C 55%, transparent 100%),
      radial-gradient(ellipse 140% 120% at 52% 40%, #12100D 40%, #0A0908 90%, #060605 100%);
  }
  body[data-view="architect"] { --beam-a-m: .03; }
  body[data-view="region"] { --beam-a-m: 0; }
}
/* 導言 17px 在手機會剩「事。」孤字：用 text-wrap: pretty 平衡尾行（不改字句） */
[data-variant="e1"] .lede-s { text-wrap: pretty; }

/* =========================================================
   L2 抽驗（review/方向E_十四_L2抽驗.md）修正，2026-10-31
   ========================================================= */
/* 4：「篩選」小三角放大到約 10px；類型文字鍵 hover 與鍵盤焦點一律出底線 */
[data-variant="e1"] .f-drawer .f-caret { display: inline-block; width: 0; height: 0; font-size: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 6px solid currentColor; margin-left: 2px; }
[data-variant="e1"] .chips .chip:is(:hover, :focus-visible) { color: var(--ink); text-decoration: underline; text-decoration-color: var(--gold-text); text-decoration-thickness: 1px; text-underline-offset: 6px; }
[data-variant="e1"] .chips .chip:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }
/* 3：篩選列「清除」文字鍵 */
[data-variant="e1"] .f-clear { min-height: 44px; padding: 0 2px; border: 0; background: none; color: var(--ink-2); font-size: 15px; cursor: pointer; text-decoration: underline; text-decoration-color: var(--gold-line); text-underline-offset: 6px; }
[data-variant="e1"] .f-clear:hover { color: var(--ink); }
[data-variant="e1"] .f-clear[hidden] { display: none; }
/* 3：B 案未聚焦點 ≥30%（取 35%），可點，點了即選取並完整亮度 */
[data-theme="e"][data-pal="b"] .pt.dim { opacity: .35; pointer-events: auto; }
[data-theme="e"][data-pal="b"] .pt.dim.is-sel { opacity: 1; }
/* 7：手機導言平均斷行，「誰蓋」「待查的事」不拆 */
[data-variant="e1"] .lede-s { text-wrap: balance; }
[data-variant="e1"] .lede-s .nb-e1 { white-space: nowrap; }
@media (max-width: 900px) {
  /* 8：篩選列上下收緊；類型列右緣漸隱減輕 */
  [data-variant="e1"] .atlas-scroll { padding-top: var(--s2); }
  [data-variant="e1"] .filters { padding-top: 0; margin-bottom: var(--s2); }
  [data-variant="e1"] .results-head { margin-top: var(--s2); }
  [data-variant="e1"] .chips { -webkit-mask-image: linear-gradient(90deg, #000 90%, rgba(0,0,0,.45)); mask-image: linear-gradient(90deg, #000 90%, rgba(0,0,0,.45)); }
}
@media (max-width: 900px) {
  /* 手機：「清除」與「篩選」同一行，類型列換到下一行 */
  [data-variant="e1"] .f-title h2 { order: 0; }
  [data-variant="e1"] .f-clear { order: 1; margin-left: auto; }
  [data-variant="e1"] .chips { order: 2; }
}