/* 全國據點 22 縣市地圖（R2 C3，2026-10-30）：part/county-map.blade.php 用。品牌深藍＋米白（ADR-0010），純 CSS 動畫，減少動態時不做過渡。
   地圖上的縣市、地圖旁標籤、下方清單按鈕都帶 data-slug；任何一個被滑過、聚焦或按下，同一縣市就在地圖上亮起並顯示名稱（:has）。
   每個縣市一條規則，由 docs/r2-evidence/county-map/method/gen-county-css.py 產生，新增縣市要一起補。 */
.cmap{--cm-blue:#2e5195;--cm-navy:#163e6f;--cm-cream:#f7f1e3;--cm-focus:#f39801;width:100%}
.cmap-figure{position:relative;width:min(100%,520px);aspect-ratio:250/300;margin:0 auto}
.cmap-svg{display:block;width:100%;height:100%;overflow:visible}
.cmap-area{cursor:pointer;outline:none}
.cmap-county{fill:var(--cm-blue);stroke:var(--cm-cream);stroke-width:.8;transition:fill .2s ease,stroke .2s ease}
.cmap-area:hover .cmap-county,.cmap-area:focus-visible .cmap-county,.cmap-area:active .cmap-county,
.cmap:has([data-slug="taipei"]:is(:hover,:focus-visible,:active)) .cmap-county[data-slug="taipei"],
.cmap:has([data-slug="newtaipei"]:is(:hover,:focus-visible,:active)) .cmap-county[data-slug="newtaipei"],
.cmap:has([data-slug="taoyuan"]:is(:hover,:focus-visible,:active)) .cmap-county[data-slug="taoyuan"],
.cmap:has([data-slug="taichung"]:is(:hover,:focus-visible,:active)) .cmap-county[data-slug="taichung"],
.cmap:has([data-slug="tainan"]:is(:hover,:focus-visible,:active)) .cmap-county[data-slug="tainan"],
.cmap:has([data-slug="kaohsiung"]:is(:hover,:focus-visible,:active)) .cmap-county[data-slug="kaohsiung"],
.cmap:has([data-slug="keelung"]:is(:hover,:focus-visible,:active)) .cmap-county[data-slug="keelung"],
.cmap:has([data-slug="hsinchu"]:is(:hover,:focus-visible,:active)) .cmap-county[data-slug="hsinchu"],
.cmap:has([data-slug="hsinchu-county"]:is(:hover,:focus-visible,:active)) .cmap-county[data-slug="hsinchu-county"],
.cmap:has([data-slug="miaoli"]:is(:hover,:focus-visible,:active)) .cmap-county[data-slug="miaoli"],
.cmap:has([data-slug="changhua"]:is(:hover,:focus-visible,:active)) .cmap-county[data-slug="changhua"],
.cmap:has([data-slug="nantou"]:is(:hover,:focus-visible,:active)) .cmap-county[data-slug="nantou"],
.cmap:has([data-slug="yunlin"]:is(:hover,:focus-visible,:active)) .cmap-county[data-slug="yunlin"],
.cmap:has([data-slug="chiayi"]:is(:hover,:focus-visible,:active)) .cmap-county[data-slug="chiayi"],
.cmap:has([data-slug="chiayi-county"]:is(:hover,:focus-visible,:active)) .cmap-county[data-slug="chiayi-county"],
.cmap:has([data-slug="pingtung"]:is(:hover,:focus-visible,:active)) .cmap-county[data-slug="pingtung"],
.cmap:has([data-slug="yilan"]:is(:hover,:focus-visible,:active)) .cmap-county[data-slug="yilan"],
.cmap:has([data-slug="hualien"]:is(:hover,:focus-visible,:active)) .cmap-county[data-slug="hualien"],
.cmap:has([data-slug="taitung"]:is(:hover,:focus-visible,:active)) .cmap-county[data-slug="taitung"],
.cmap:has([data-slug="penghu"]:is(:hover,:focus-visible,:active)) .cmap-county[data-slug="penghu"],
.cmap:has([data-slug="kinmen"]:is(:hover,:focus-visible,:active)) .cmap-county[data-slug="kinmen"],
.cmap:has([data-slug="matsu"]:is(:hover,:focus-visible,:active)) .cmap-county[data-slug="matsu"]{fill:var(--cm-cream);stroke:var(--cm-navy);stroke-width:1.2}
.cmap-area:focus-visible .cmap-county{stroke:var(--cm-focus);stroke-width:2}
.cmap-tips{pointer-events:none}
.cmap-tip{opacity:0;transform:translateY(3px) scale(.85);transform-box:fill-box;transform-origin:center;transition:opacity .2s ease,transform .2s ease}
.cmap-tip rect{fill:var(--cm-navy);stroke:var(--cm-cream);stroke-width:.8}
.cmap-tip text{fill:var(--cm-cream);font:700 11px/1 "Noto Sans TC","PingFang TC","Microsoft JhengHei",system-ui,sans-serif;letter-spacing:.04em}
.cmap:has([data-slug="taipei"]:is(:hover,:focus-visible,:active)) .cmap-tip[data-slug="taipei"],
.cmap:has([data-slug="newtaipei"]:is(:hover,:focus-visible,:active)) .cmap-tip[data-slug="newtaipei"],
.cmap:has([data-slug="taoyuan"]:is(:hover,:focus-visible,:active)) .cmap-tip[data-slug="taoyuan"],
.cmap:has([data-slug="taichung"]:is(:hover,:focus-visible,:active)) .cmap-tip[data-slug="taichung"],
.cmap:has([data-slug="tainan"]:is(:hover,:focus-visible,:active)) .cmap-tip[data-slug="tainan"],
.cmap:has([data-slug="kaohsiung"]:is(:hover,:focus-visible,:active)) .cmap-tip[data-slug="kaohsiung"],
.cmap:has([data-slug="keelung"]:is(:hover,:focus-visible,:active)) .cmap-tip[data-slug="keelung"],
.cmap:has([data-slug="hsinchu"]:is(:hover,:focus-visible,:active)) .cmap-tip[data-slug="hsinchu"],
.cmap:has([data-slug="hsinchu-county"]:is(:hover,:focus-visible,:active)) .cmap-tip[data-slug="hsinchu-county"],
.cmap:has([data-slug="miaoli"]:is(:hover,:focus-visible,:active)) .cmap-tip[data-slug="miaoli"],
.cmap:has([data-slug="changhua"]:is(:hover,:focus-visible,:active)) .cmap-tip[data-slug="changhua"],
.cmap:has([data-slug="nantou"]:is(:hover,:focus-visible,:active)) .cmap-tip[data-slug="nantou"],
.cmap:has([data-slug="yunlin"]:is(:hover,:focus-visible,:active)) .cmap-tip[data-slug="yunlin"],
.cmap:has([data-slug="chiayi"]:is(:hover,:focus-visible,:active)) .cmap-tip[data-slug="chiayi"],
.cmap:has([data-slug="chiayi-county"]:is(:hover,:focus-visible,:active)) .cmap-tip[data-slug="chiayi-county"],
.cmap:has([data-slug="pingtung"]:is(:hover,:focus-visible,:active)) .cmap-tip[data-slug="pingtung"],
.cmap:has([data-slug="yilan"]:is(:hover,:focus-visible,:active)) .cmap-tip[data-slug="yilan"],
.cmap:has([data-slug="hualien"]:is(:hover,:focus-visible,:active)) .cmap-tip[data-slug="hualien"],
.cmap:has([data-slug="taitung"]:is(:hover,:focus-visible,:active)) .cmap-tip[data-slug="taitung"],
.cmap:has([data-slug="penghu"]:is(:hover,:focus-visible,:active)) .cmap-tip[data-slug="penghu"],
.cmap:has([data-slug="kinmen"]:is(:hover,:focus-visible,:active)) .cmap-tip[data-slug="kinmen"],
.cmap:has([data-slug="matsu"]:is(:hover,:focus-visible,:active)) .cmap-tip[data-slug="matsu"]{opacity:1;transform:none}
.cmap-chip,.cmap-btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;padding:0 12px;border-radius:999px;border:1.5px solid var(--cm-cream);background:var(--cm-blue);color:var(--cm-cream);font-weight:700;font-size:14px;line-height:1.2;letter-spacing:.04em;text-decoration:none;white-space:nowrap;box-shadow:0 4px 10px rgba(22,62,111,.18);transition:background-color .2s ease,color .2s ease,border-color .2s ease}
.cmap-chip{position:absolute;z-index:1}
.cmap-chip.is-island{border-style:dashed}
.cmap-chip:hover,.cmap-chip:focus-visible,.cmap-chip:active,.cmap-btn:hover,.cmap-btn:focus-visible,.cmap-btn:active{background:var(--cm-cream);color:var(--cm-navy);border-color:var(--cm-navy);text-decoration:none}
.cmap-chip:focus-visible,.cmap-btn:focus-visible{outline:3px solid var(--cm-focus);outline-offset:2px}
.cmap-hint{margin:14px 0 10px;text-align:center;font-size:14px;color:#585b63}
.cmap-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:8px}
.cmap-list li{margin:0;min-width:0}
.cmap-btn{width:100%}
@media(prefers-reduced-motion:reduce){.cmap-county,.cmap-tip,.cmap-chip,.cmap-btn{transition:none}}
/* r2-home-i18n 10/30：英文縣市名較長（Changhua County、Lienchiang County (Matsu)），清單改兩欄、按鈕可折行，不再被切掉。 */
.cmap-list:lang(en){grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.cmap-btn:lang(en){white-space:normal;text-align:center;padding:4px 10px}
/* 整合 #61 10/30：右側標籤（基隆、台北，left 81%）的英文字在 WebKit 比 Chromium 寬，Keelung 右緣到 398px（CI iPhone 15 WebKit）。英文改靠右對齊，中文、日文位置不變。 */
.cmap-chip.is-right:lang(en){left:auto!important;right:0}
/* 11/05 總指揮 16:1x ②：320 寬中文、日文右側標籤（基隆）右緣到 322px，整頁橫捲 2px。360 以下右側標籤一律靠右對齊（英文原本就是）。 */
@media(max-width:359px){.cmap-chip.is-right{left:auto!important;right:0}}
