:root{
  --ink:#15202b; --ink2:#3d4b5a; --ink3:#6b7a8b;
  --bg:#f6f7f9; --card:#ffffff; --line:#e3e7ec;
  --brand:#0f4c5c; --brand2:#12707f; --accent:#b5651d;
  --ok:#1f7a4d; --warn:#b3541e; --bad:#a4262c; --info:#1f5fa8;
  --radius:14px; --sh:0 1px 2px rgba(16,32,48,.04),0 8px 24px rgba(16,32,48,.06);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:"Noto Sans TC",-apple-system,"PingFang TC","Microsoft JhengHei",sans-serif;
  line-height:1.75; -webkit-font-smoothing:antialiased;
}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}
a{color:var(--brand2);text-decoration:none;border-bottom:1px solid rgba(18,112,127,.25)}
a:hover{color:var(--accent);border-bottom-color:var(--accent)}

/* nav */
.nav{position:sticky;top:0;z-index:900;background:rgba(255,255,255,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.nav-in{display:flex;align-items:center;justify-content:space-between;gap:16px;height:58px}
.brand{font-family:"Noto Serif TC",serif;font-weight:700;letter-spacing:.02em}
.brand .dot{color:var(--accent);margin:0 2px}
.nav nav{display:flex;gap:18px;flex-wrap:wrap;font-size:.9rem}
.nav nav a{border:0;color:var(--ink2)}
.nav nav a:hover{color:var(--brand)}

/* hero */
.hero{background:linear-gradient(180deg,#fff 0%,#f2f5f7 100%);border-bottom:1px solid var(--line);padding:54px 0 34px}
.eyebrow{margin:0 0 10px;font-size:.8rem;letter-spacing:.14em;color:var(--brand2);text-transform:uppercase}
.hero h1{font-family:"Noto Serif TC",serif;font-size:clamp(1.7rem,4vw,2.6rem);line-height:1.35;margin:0 0 18px;letter-spacing:.01em}
.lede{color:var(--ink2);font-size:1.03rem;max-width:760px;margin:0 0 26px}
.lede em{font-style:normal;color:var(--brand);font-weight:700}
.hero-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:26px 0 20px}
.hero-stats>div{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px;box-shadow:var(--sh)}
.hero-stats b{display:block;font-size:1.5rem;font-family:"Noto Serif TC",serif;color:var(--brand)}
.hero-stats span{font-size:.8rem;color:var(--ink3)}
.disclaimer{font-size:.85rem;color:var(--ink2);background:#fff8f1;border:1px solid #f0dcc8;border-left:4px solid var(--accent);border-radius:10px;padding:12px 16px;margin:0}

/* blocks */
.block{padding:52px 0 8px}
.block h2{font-family:"Noto Serif TC",serif;font-size:1.45rem;margin:0 0 6px;display:flex;align-items:baseline;gap:12px}
.block h2 .num{font-size:.8rem;color:var(--accent);letter-spacing:.16em;font-family:"Noto Sans TC",sans-serif}
.sub{color:var(--ink3);font-size:.92rem;margin:0 0 22px}
.fine{font-size:.85rem;color:var(--ink3);line-height:1.7}

/* grid + cards */
.grid{display:grid;gap:16px}
.axis{grid-template-columns:repeat(2,1fr)}
@media(max-width:820px){.axis{grid-template-columns:1fr}.hero-stats{grid-template-columns:repeat(2,1fr)}}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:20px;box-shadow:var(--sh)}
.card h3{margin:0 0 4px;font-family:"Noto Serif TC",serif;font-size:1.08rem;color:var(--brand)}
.card .lead{margin:0 0 10px;font-size:.86rem;color:var(--accent);font-weight:500}
.card p{margin:0 0 12px;font-size:.94rem;color:var(--ink2)}
.card ul{margin:0;padding-left:18px}
.card li{font-size:.9rem;color:var(--ink2);margin-bottom:6px}
.card .stance{margin-top:12px;padding:10px 12px;background:#f4f8fa;border-left:3px solid var(--brand2);border-radius:8px;font-size:.88rem;color:var(--ink)}

/* filters */
.filters{display:flex;gap:18px;flex-wrap:wrap;align-items:center;margin-bottom:22px;padding:14px 16px;background:var(--card);border:1px solid var(--line);border-radius:var(--radius)}
.fgroup{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.flabel{font-size:.78rem;color:var(--ink3);letter-spacing:.08em}
.chip{border:1px solid var(--line);background:#fff;color:var(--ink2);border-radius:999px;padding:4px 12px;font-size:.82rem;cursor:pointer;font-family:inherit}
.chip:hover{border-color:var(--brand2);color:var(--brand)}
.chip.on{background:var(--brand);border-color:var(--brand);color:#fff}
.reset{margin-left:auto;border:0;background:none;color:var(--ink3);font-size:.82rem;cursor:pointer;text-decoration:underline}

/* timeline */
.timeline{list-style:none;margin:0;padding:0 0 0 26px;position:relative}
.timeline:before{content:"";position:absolute;left:6px;top:6px;bottom:6px;width:2px;background:linear-gradient(180deg,var(--brand2),#d9e2e7)}
.timeline li{position:relative;margin-bottom:14px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px 16px;box-shadow:var(--sh)}
.timeline li:before{content:"";position:absolute;left:-26px;top:20px;width:10px;height:10px;border-radius:50%;background:#fff;border:2px solid var(--brand2)}
.timeline li.hi:before{background:var(--accent);border-color:var(--accent)}
.tl-top{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:4px}
.tl-date{font-variant-numeric:tabular-nums;font-size:.8rem;color:var(--ink3);letter-spacing:.04em}
.tag{font-size:.72rem;padding:2px 9px;border-radius:999px;background:#eef3f6;color:var(--brand);border:1px solid #dde7ec}
.tag.土地,.tag.司法,.tag.資金,.tag.綠能{background:#fdf1ec;color:var(--warn);border-color:#f2ddd2}
.tag.里程碑,.tag.施政,.tag.政策{background:#eef7f1;color:var(--ok);border-color:#d8ecdf}
.tag.選舉,.tag.政治{background:#eff3fb;color:var(--info);border-color:#dde5f4}
.tl-t{font-weight:500;font-size:.98rem}
.tl-who{font-size:.78rem;color:var(--accent);font-weight:700}
.tl-src{font-size:.8rem;color:var(--ink3);margin-top:6px}
.more{color:var(--ink3);font-size:.85rem;padding:6px 0 0 26px}

/* table */
.tbl-wrap{overflow-x:auto;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--sh)}
.tbl{width:100%;border-collapse:collapse;font-size:.9rem;min-width:900px}
.tbl th,.tbl td{padding:11px 14px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
.tbl thead th{background:#f3f6f8;color:var(--ink2);font-size:.8rem;letter-spacing:.06em;white-space:nowrap}
.tbl tbody tr:hover{background:#fafcfd}
.tbl td.amt{font-variant-numeric:tabular-nums;white-space:nowrap;font-weight:500}
.st{font-size:.74rem;padding:2px 8px;border-radius:999px;white-space:nowrap;border:1px solid}
.st.完工,.st.已舉辦{background:#eef7f1;color:var(--ok);border-color:#d8ecdf}
.st.爭議,.st.延宕{background:#fdf1ec;color:var(--warn);border-color:#f2ddd2}
.st.施工中{background:#eff3fb;color:var(--info);border-color:#dde5f4}

/* family */
.fam{grid-template-columns:repeat(3,1fr)}
@media(max-width:900px){.fam{grid-template-columns:1fr}}
.fam .card h3{color:var(--ink)}
.fam .rel{font-size:.78rem;color:var(--accent);font-weight:700;margin-bottom:6px}
.fam .roles{font-size:.88rem;color:var(--ink2);margin:0 0 8px}
.fam .notes{font-size:.86rem;color:var(--ink2);margin:0;padding-top:8px;border-top:1px dashed var(--line)}

/* map */
#map-canvas{height:460px;border-radius:var(--radius);border:1px solid var(--line);box-shadow:var(--sh);z-index:1}
.legend{display:flex;gap:16px;flex-wrap:wrap;margin-top:12px;font-size:.82rem;color:var(--ink2)}
.legend i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px}

/* method */
.method{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:22px 26px 22px 44px;box-shadow:var(--sh)}
.method li{font-size:.92rem;color:var(--ink2);margin-bottom:10px}
.method li::marker{color:var(--brand2);font-weight:700}

/* footer */
.foot{margin-top:56px;padding:28px 0 46px;background:#fff;border-top:1px solid var(--line);color:var(--ink3);font-size:.88rem}
.foot strong{color:var(--ink)}

/* ===== 第 2 版增補:標記圖示、名字行銷、資訊公開查核 ===== */
.tl-ico{font-size:1.02rem;line-height:1;margin-right:.4rem;vertical-align:-1px}
.tl-note{font-size:.86rem;color:#5b6774;margin:.2rem 0 .1rem}
.ico-legend{display:flex;flex-wrap:wrap;gap:.4rem .95rem;margin:.55rem 0 1.1rem;font-size:.82rem;color:#5b6774}
.ico-legend span{display:inline-flex;align-items:center;gap:.32rem}
.fgroup .chip.ico{font-size:.92rem}
.grid.brand-grid{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.card.brand .rel{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap}
.badge{display:inline-block;padding:.08rem .5rem;border-radius:999px;font-size:.7rem;font-weight:700;white-space:nowrap}
.badge.high{background:#e7f5ec;color:#1f7a4d}
.badge.medium{background:#fdf3e3;color:#8a5a12}
.badge.low{background:#fdeaea;color:#a4262c}
.st.open{background:#e7f5ec;color:#1f7a4d}
.st.partial{background:#fdf3e3;color:#8a5a12}
.st.missing{background:#fdeaea;color:#a4262c}
.st.limited{background:#eef1f4;color:#5b6774}
.byline{font-size:.9rem;color:#4b5563;background:#f5f7fa;border-left:3px solid #0f4c5c;padding:.6rem .8rem;margin:.9rem 0 0;border-radius:3px}

/* ===== 第 3 版:施政方向分類、標記說明 ===== */
.ico-hint{font-size:.8rem;color:#6b7a8b;margin:-.5rem 0 1rem}
.grid.focus-grid{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
.card.focus .rel{display:flex;align-items:center;gap:.45rem;flex-wrap:wrap;font-size:.92rem}
.card.focus .bar{height:8px;background:#eef1f4;border-radius:99px;overflow:hidden;margin:.6rem 0 .55rem}
.card.focus .bar i{display:block;height:100%;background:#0f4c5c;border-radius:99px}
.focus-items{margin:.15rem 0 .5rem;padding-left:1.1rem;font-size:.84rem;color:#4b5563;line-height:1.65}
.focus-obs{margin:.3rem 0 0;font-size:.9rem;line-height:1.75;color:#26313c}
.focus-stat{font-size:.86rem;color:#3f4a56;background:#f5f7fa;border-left:3px solid #0f4c5c;border-radius:4px;padding:.55rem .75rem;margin:0 0 .95rem;line-height:1.7}
