/* ============================================
   MIYABI DOBOKU — Premium Animation Layer
   カスタムカーソル / プログレスバー / Lenis連携
   ============================================ */

/* Lenis 慣性スクロール（native smoothを無効化） */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }
.lenis.lenis-stopped { overflow: hidden; }

/* ---------- スクロールプログレスバー ---------- */
.m-progress {
  position: fixed;
  top: 0; left: 0;
  width: 100%;
  height: 3px;
  background: var(--c-blue);
  transform: scaleX(0);
  transform-origin: left center;
  z-index: 300;
  pointer-events: none;
  will-change: transform;
}

/* ---------- カスタムカーソル ---------- */
body.has-custom-cursor { cursor: none; }
body.has-custom-cursor a,
body.has-custom-cursor button,
body.has-custom-cursor .pill,
body.has-custom-cursor input,
body.has-custom-cursor textarea,
body.has-custom-cursor label { cursor: none; }

/* スコップ（剣先シャベル）カーソル */
.m-cursor {
  position: fixed;
  top: 0; left: 0;
  width: 26px; height: 34px;
  /* 三角ブレードの頂点(左上)がマウス位置に来るよう調整 */
  margin: -2px 0 0 2px;
  pointer-events: none;
  z-index: 400;
  mix-blend-mode: difference;
  will-change: transform;
}
.m-cursor__shovel {
  width: 100%; height: 100%;
  transform-origin: center;
  transform: rotate(135deg); /* 三角の頂点を左上へ向ける */
  transition: transform 0.28s var(--ease);
}
.m-cursor__shovel svg { width: 100%; height: 100%; display: block; overflow: visible; }
.m-cursor__shovel svg * {
  fill: none;
  stroke: var(--c-blue);
  stroke-width: 2.6;
  transition: fill 0.25s var(--ease);
}

/* ホバー時：三角ブレードが塗り込まれる＋少し拡大（掘るロックオン） */
.m-cursor.is-hover .m-cursor__shovel {
  transform: rotate(135deg) scale(1.15);
}
.m-cursor.is-hover .m-cursor__shovel svg * {
  fill: var(--c-blue);
  stroke-width: 2;
}

/* ---------- 汎用アニメ用 初期状態（JS未実行時のFOUC防止） ---------- */
[data-anim="clip"] { will-change: clip-path; }
[data-anim="split"] { will-change: transform; }

/* ---------- セクションの縁取り演出（多田風の細部） ---------- */
.reveal-line {
  position: relative;
  overflow: hidden;
}
.reveal-line::after {
  content: "";
  position: absolute;
  left: 0; bottom: 0;
  width: 100%; height: 100%;
  background: var(--c-cream);
  transform: translateX(0);
}

/* Reduced-motion 対応 */
@media (prefers-reduced-motion: reduce) {
  .m-cursor, .m-cursor__dot, .m-progress { display: none; }
  body.has-custom-cursor { cursor: auto; }
}

/* モバイルはカスタムカーソル無効 */
@media (pointer: coarse) {
  .m-cursor, .m-cursor__dot { display: none; }
  body.has-custom-cursor { cursor: auto; }
}
