/* =====================================================================
 * DOG CAFE HANA：ボールを追いかける犬カーソル（js/dogcursor.js とセット）
 * 2026-10 シノシスデザイン
 * ===================================================================== */
.cursor.dc-ball,
.follower.dc-dog {
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
  background: none;
  border-radius: 0;
  transition: opacity .3s ease;
  opacity: 0;
  will-change: transform;
  z-index: 2147483647;
}
html.dc-on .cursor.dc-ball,
html.dc-on .follower.dc-dog { opacity: 1; }

.cursor.dc-ball { width: 16px; height: 16px; }
.follower.dc-dog { display: block; width: 72.6px; height: 50.6px; z-index: 2147483646; } /* 2026-10 長門さん指示で10%拡大（元 66×46） */

.dc-ball-svg,
.dc-dog-svg { display: block; width: 100%; height: 100%; overflow: visible; }
.dc-ball-svg { transition: transform .2s ease; }
.dc-ball.is-active .dc-ball-svg { transform: scale(1.35); }
.dc-dog-inner { width: 100%; height: 100%; transform-origin: 50% 60%; }

/* 色：オレンジは元のフォロワーの色味に合わせる。奥側の脚と耳は一段濃く */
.dc-fur,
.dc-leg-bn rect,
.dc-leg-fn rect { fill: #ff9a1f; }
.dc-ear,
.dc-leg-bf rect,
.dc-leg-ff rect { fill: #e07a00; }
.dc-dark { fill: #3b2a1a; }
.dc-tail { fill: none; stroke: #ff9a1f; stroke-width: 3.4; stroke-linecap: round; }
.dc-collar { fill: none; stroke: #3b2a1a; stroke-width: 2; stroke-linecap: round; }
.dc-tongue { fill: #f07a8c; transform-box: view-box; transform: scaleY(0); }

.dc-body,
.dc-leg,
.dc-tail { transform-box: view-box; }
.dc-body { transform-origin: 33px 25px; }

/* 走っている時：前脚と後脚を逆に振るギャロップ＋体の上下 */
.dc-dog.is-running .dc-leg-fn { animation: dc-front .34s linear infinite; }
.dc-dog.is-running .dc-leg-ff { animation: dc-front .34s linear infinite -.05s; }
.dc-dog.is-running .dc-leg-bn { animation: dc-back .34s linear infinite; }
.dc-dog.is-running .dc-leg-bf { animation: dc-back .34s linear infinite -.05s; }
.dc-dog.is-running .dc-body { animation: dc-bob .34s ease-in-out infinite; }
.dc-dog.is-running .dc-tail { transform: rotate(26deg); transition: transform .2s; }

@keyframes dc-front { 0%, 100% { transform: rotate(-42deg); } 50% { transform: rotate(38deg); } }
@keyframes dc-back  { 0%, 100% { transform: rotate(36deg); }  50% { transform: rotate(-40deg); } }
@keyframes dc-bob   { 0%, 100% { transform: translateY(0) rotate(-2deg); } 50% { transform: translateY(-2.5px) rotate(2.5deg); } }

/* 止まっている時：尻尾をふって、舌を出したり引っ込めたりして待つ */
.dc-dog:not(.is-running) .dc-tail { animation: dc-wag .5s ease-in-out infinite; }
.dc-dog:not(.is-running) .dc-tongue { animation: dc-pant .9s ease-in-out infinite; }
@keyframes dc-pant { 0%, 100% { transform: scaleY(.1); } 45%, 60% { transform: scaleY(1); } }
@keyframes dc-wag { 0%, 100% { transform: rotate(-14deg); } 50% { transform: rotate(16deg); } }

/* リンクの上：嬉しくて跳ねる（尻尾も速く） */
.dc-dog.is-active .dc-dog-svg { animation: dc-hop .42s ease-in-out infinite; }
.dc-dog.is-active .dc-tail { animation-duration: .22s; }
@keyframes dc-hop { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }

/* スマホ・タブレット（マウスが無い端末）では表示しない */
@media (hover: none), (pointer: coarse) {
  .cursor,
  .follower { display: none !important; }
}

/* 「視差効果を減らす」設定の方には、脚や跳ねる動きを止める（追いかける動きだけ残す） */
@media (prefers-reduced-motion: reduce) {
  .dc-dog .dc-leg,
  .dc-dog .dc-body,
  .dc-dog .dc-tail,
  .dc-dog .dc-tongue,
  .dc-dog .dc-dog-svg { animation: none !important; }
}