/* =========================================================
   JBK — 原生金色箭頭游標（用 CSS cursor: url 圖示）
   瀏覽器原生渲染，永遠顯示、精準、不會消失。
   ========================================================= */

/* 預設：金色箭頭（尖端 hotspot 在 3,3）。白色描邊 → 深淺背景都看得到 */
html,
body,
.has-3d-touch,
.has-3d-touch * {
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 28 28'%3E%3Cpath d='M4 3 L4 23 L9.5 17.7 L13 25 L16 23.6 L12.6 16.6 L20 16.6 Z' fill='%23C9A24A' stroke='%23ffffff' stroke-width='1.4' stroke-linejoin='round'/%3E%3C/svg%3E") 3 3, auto;
}

/* 可點元素：更亮更大的箭頭（32px）→ 清楚提示「可點」 */
.has-3d-touch a,
.has-3d-touch button,
.has-3d-touch .btn,
.has-3d-touch .cat-card,
.has-3d-touch .card,
.has-3d-touch .chip,
.has-3d-touch .filter-bar a,
.has-3d-touch .icon-btn,
.has-3d-touch [role="button"],
.has-3d-touch input[type="submit"],
.has-3d-touch input[type="button"],
.has-3d-touch input[type="checkbox"],
.has-3d-touch input[type="radio"],
.has-3d-touch label,
.has-3d-touch select,
.has-3d-touch summary {
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34' height='34' viewBox='0 0 28 28'%3E%3Cpath d='M4 3 L4 23 L9.5 17.7 L13 25 L16 23.6 L12.6 16.6 L20 16.6 Z' fill='%23E6C88C' stroke='%23ffffff' stroke-width='1.6' stroke-linejoin='round'/%3E%3C/svg%3E") 4 4, pointer;
}

/* 文字輸入框：維持原生文字游標（I-beam）方便打字 */
.has-3d-touch input[type="text"],
.has-3d-touch input[type="email"],
.has-3d-touch input[type="password"],
.has-3d-touch input[type="number"],
.has-3d-touch input[type="url"],
.has-3d-touch input[type="tel"],
.has-3d-touch input[type="search"],
.has-3d-touch input[type="date"],
.has-3d-touch input[type="datetime-local"],
.has-3d-touch textarea,
.has-3d-touch [contenteditable="true"] {
  cursor: text;
}

/* -------- 卡片 3D 傾斜（只旋轉不位移 → 不影響點擊）-------- */
.has-3d-touch .cat-card,
.has-3d-touch .card {
  transform-style: preserve-3d;
  transform: perspective(1000px) rotateX(0) rotateY(0);
  transition: transform 700ms cubic-bezier(.16,1,.3,1), box-shadow 700ms cubic-bezier(.16,1,.3,1);
}
.has-3d-touch .cat-card__content,
.has-3d-touch .card__body {
  transform: translateZ(30px);
}

/* -------- 無障礙：reduce motion 時關閉卡片傾斜 -------- */
@media (prefers-reduced-motion: reduce) {
  .has-3d-touch .cat-card,
  .has-3d-touch .card {
    transform: none !important;
    transition: none !important;
  }
}