/* 統一提示泡泡（cityTips.js，1005）：像素風小泡泡＋觸控「!」徽章。只管外觀，不改 id。 */
.tip-bubble { position:fixed; inset:auto; margin:0; z-index:2147483000; box-sizing:border-box; display:flex; align-items:flex-start; gap:7px;
  width:max-content; max-width:300px; padding:6px 10px 7px 7px; overflow:visible; pointer-events:none;
  font:700 14px/1.45 var(--title, "Microsoft JhengHei", sans-serif); color:var(--ink, #4a2e1f); text-align:left;
  background:#fffaf0; border:2px solid var(--ink, #4a2e1f); border-radius:6px; box-shadow:0 3px 0 var(--ink, #4a2e1f), 0 8px 18px #2a1a1055;
  animation:tipPop .12s steps(3, end) both; }
.tip-bubble[hidden] { display:none; }
.tip-bubble:not(:popover-open):not([hidden])[popover] { display:none; }
.tip-bubble::after { content:""; position:absolute; left:var(--ax, 50%); bottom:-9px; width:10px; height:10px; transform:translateX(-50%) rotate(45deg);
  background:#fffaf0; border-right:2px solid var(--ink, #4a2e1f); border-bottom:2px solid var(--ink, #4a2e1f); }
.tip-bubble.below::after { bottom:auto; top:-8px; border:0; border-left:2px solid var(--ink, #4a2e1f); border-top:2px solid var(--ink, #4a2e1f); }
.tip-bubble .tip-ic { flex:0 0 24px; width:24px; height:24px; image-rendering:pixelated; object-fit:contain; margin-top:1px; }
.tip-bubble .tip-text { display:flex; flex-direction:column; min-width:0; gap:1px; overflow-wrap:anywhere; }
.tip-bubble .tip-text b { font-size:15px; font-weight:900; }
.tip-bubble .tip-text span { font-weight:700; color:var(--ink-2, #6b4a33); }
.tip-bubble .tip-hint { margin-top:2px; font-size:12px; font-weight:700; color:var(--ink-soft, #8a6a4e); }
@keyframes tipPop { from { opacity:0; transform:translateY(3px); } to { opacity:1; transform:none; } }
@media (prefers-reduced-motion: reduce) { .tip-bubble { animation:none; } }

/* 觸控「!」徽章：透明 32×32 點擊區、可見 16px 像素方塊，貼在宿主右上角 */
.tip-host { position:relative; }
.tip-badge { position:absolute; top:-8px; right:-8px; z-index:4; width:32px; height:32px; cursor:help; -webkit-tap-highlight-color:transparent; touch-action:manipulation; }
.tip-badge::before { content:"!"; position:absolute; top:4px; right:4px; width:16px; height:16px; box-sizing:border-box; display:grid; place-items:center;
  font:900 12px/1 var(--num, "Arial Rounded MT Bold", sans-serif); color:var(--ink, #4a2e1f); background:var(--cream, #fbf2dc);
  border:2px solid var(--ink, #4a2e1f); border-radius:3px; box-shadow:0 2px 0 #4a2e1f66; }
.tip-open > .tip-badge::before { color:#fff; background:var(--ink, #4a2e1f); }
button:disabled > .tip-badge { opacity:1; }

/* 觸控：長按不跳系統選單／不選字；資訊元素看起來可點 */
html[data-tip-mode=touch] [data-tip] { -webkit-touch-callout:none; -webkit-user-select:none; user-select:none; }
html[data-tip-mode=touch] [data-tip]:not(button):not(a) { cursor:pointer; }
.score[data-tip] { cursor:pointer; }
[data-tip].tip-open:not(button) { outline:2px dashed var(--ink-soft, #8a6a4e); outline-offset:1px; }