:root{--accent:#b0784c;--ink:#4a4038}
html,body,#loading{background:#eef1ec}
.brand{background:rgba(252,250,246,.95);box-shadow:0 4px 14px rgba(90,70,40,.12)}
.brand .t1{font-family:"Noto Serif CJK TC","Noto Serif TC",serif;color:#2f6f8a;letter-spacing:3px}
/* 編號膠囊：功能色底＋白字，白框收邊；比 v1 小一號 */
.pill{background:var(--pc,#b0784c);color:#fff;border:2px solid #fffdf9;font-size:12px;padding:3px 9px 3px 3px;gap:4px;
  box-shadow:0 2px 6px rgba(60,45,30,.22)}
.pill:after{border-top-color:#fffdf9;bottom:-6px}
.pill .n{background:#fffdf9;color:var(--pc,#b0784c);font-size:10.5px;padding:0 5px}
.pill .sub{font-weight:700;color:#fff3d6;margin-left:3px}
.pill.active{outline:3px solid rgba(255,253,249,.95);box-shadow:0 0 0 5px var(--pc,#b0784c)}
.tag{background:rgba(252,250,246,.94);color:#6e5638;box-shadow:0 1px 4px rgba(90,70,40,.14);border-radius:999px;padding:1px 6px;font-size:10px}
#badge{background:rgba(74,64,56,.7)}
@media (min-width:900px){.pill{font-size:13px;padding:4px 10px 4px 4px}.pill .n{font-size:11px}}
.tag.muted{background:rgba(236,233,226,.82);color:#9a9184;font-weight:600;font-size:9.5px;box-shadow:none}
/* 手機總覽：膠囊再縮一號，避免遊憩區內互相遮擋；放大後恢復 */
#labels.compact .pill{font-size:10.5px;padding:2px 7px 2px 2px;gap:3px;border-width:1.5px}
#labels.compact .pill .n{font-size:9.5px;padding:0 4px}
#labels.compact .pill .sub{display:none}
/* v5：檢視切換（全區地圖／設施位置）— 手機底部、桌機左側 */
#views{position:absolute;left:10px;bottom:calc(14px + env(safe-area-inset-bottom));display:flex;gap:4px;padding:4px;background:rgba(252,250,246,.96);
  border-radius:999px;box-shadow:0 3px 12px rgba(60,45,30,.18);z-index:3}
#views button{border:0;background:transparent;min-height:44px;padding:0 16px;border-radius:999px;font:inherit;font-size:15px;font-weight:800;color:#5a5048;cursor:pointer}
#views button.on{background:#2f6f8a;color:#fff}
#tools button{min-height:44px}
.pill.zone{background:#2f6f8a;font-size:13px;padding:4px 11px 4px 4px}
.pill.zone .n{color:#2f6f8a;font-size:13px;padding:0 6px}
.pill.zone .sub{color:#dff1f7;font-weight:600}
@media (min-width:900px){
  #views{left:12px;top:110px;bottom:auto;flex-direction:column;border-radius:18px;padding:5px}
  #views button{border-radius:14px;text-align:left;padding:0 18px}
}
/* 切換時標籤交叉淡入淡出 */
.pill,.tag{transition:opacity .35s ease}
#views button{transition:background .3s ease,color .3s ease}
/* 餐飲購物：店名標籤放大成膠囊 */
.tag.shopTag{background:#9a5638;color:#fff;font-size:12px;font-weight:800;padding:3px 10px;border:2px solid #fffdf9;box-shadow:0 2px 6px rgba(60,45,30,.22)}
@media (min-width:900px){.tag.shopTag{font-size:13px}}
#views button{padding:0 13px;font-size:14.5px}
@media (max-width:420px){#views button{padding:0 11px;font-size:14px}}
/* 引導線（膠囊被錯開時連回建築） */
#leaders{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
#leaders g{transition:opacity .35s ease}
#leaders line{stroke:var(--pc,#9a5638);stroke-width:1.6;stroke-linecap:round;opacity:.9}
#leaders circle{fill:var(--pc,#9a5638);stroke:#fffdf9;stroke-width:1.2}
#leaders .hide{opacity:0}