/* ─ サイト全体：テキストのドラッグ選択・コピー禁止 ─
   画像ドラッグもまとめて抑制。
   入力要素 (input / textarea / contenteditable) はユーザー操作のため除外。
*/
html, body {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
}
img { -webkit-user-drag: none; user-drag: none; }
input, textarea, select, [contenteditable], [contenteditable] * {
  -webkit-user-select: text;
  -moz-user-select: text;
  -ms-user-select: text;
  user-select: text;
}

/* Custom round cursor — 丸型カスタムカーソル
   - PC（hover: hover and pointer: fine）環境のみ有効
   - タッチデバイス（スマホ/タブレット）には影響しない
*/
@media (hover: hover) and (pointer: fine) {
  html, body { cursor: none; }
  a, button, input, select, textarea, label,
  [role="button"], [onclick], .btn, .clickable { cursor: none; }

  .satosan-cursor {
    position: fixed;
    top: 0; left: 0;
    width: 14px; height: 14px;
    border-radius: 50%;
    background: rgba(212, 168, 83, 0.28);
    border: 1px solid rgba(255, 216, 120, 0.7);
    pointer-events: none;
    z-index: 99999;
    transform: translate(-9999px, -9999px);
    transition:
      width 0.25s cubic-bezier(.2,.9,.3,1),
      height 0.25s cubic-bezier(.2,.9,.3,1),
      background 0.25s ease,
      border-color 0.25s ease,
      opacity 0.3s ease;
    will-change: transform;
    mix-blend-mode: screen;
    box-shadow:
      0 0 12px rgba(212, 168, 83, 0.35),
      0 0 4px rgba(255, 216, 120, 0.4);
  }
  .satosan-cursor-ring {
    position: fixed;
    top: 0; left: 0;
    width: 36px; height: 36px;
    border-radius: 50%;
    border: 1px solid rgba(212, 168, 83, 0.35);
    pointer-events: none;
    z-index: 99998;
    transform: translate(-9999px, -9999px);
    transition:
      width 0.35s cubic-bezier(.2,.9,.3,1),
      height 0.35s cubic-bezier(.2,.9,.3,1),
      border-radius 0.35s cubic-bezier(.2,.9,.3,1),
      border-color 0.25s ease,
      background 0.25s ease,
      opacity 0.3s ease;
    will-change: transform;
    mix-blend-mode: screen;
  }
  /* Interactive 要素上 (通常) */
  .satosan-cursor.is-hover {
    width: 10px; height: 10px;
    background: rgba(255, 216, 120, 0.9);
    border-color: rgba(255, 235, 180, 1);
  }
  .satosan-cursor-ring.is-hover {
    width: 54px; height: 54px;
    border-color: rgba(255, 216, 120, 0.85);
  }
  /* 囲みボタン上（吸着モード） — dot は非表示、リングが枠そのものになる */
  .satosan-cursor.is-magnetic {
    opacity: 0;
  }
  .satosan-cursor-ring.is-magnetic {
    border-color: rgba(255, 216, 120, 0.95);
    border-width: 1.5px;
    background: rgba(255, 216, 120, 0.06);
    box-shadow:
      0 0 20px rgba(255, 216, 120, 0.3),
      inset 0 0 12px rgba(255, 216, 120, 0.12);
  }
  /* お知らせリンク hover 時: カーソル dot / ring を完全に非表示にする。
     ピンク発光は .notice-link 側の CSS で文字に直接掛ける。 */
  .satosan-cursor.is-over-notice,
  .satosan-cursor-ring.is-over-notice {
    opacity: 0;
  }
  /* マウスダウン */
  .satosan-cursor.is-down {
    width: 8px; height: 8px;
  }
  .satosan-cursor-ring.is-down {
    transform-origin: center;
  }
  /* ウィンドウ外 */
  .satosan-cursor.is-hidden,
  .satosan-cursor-ring.is-hidden {
    opacity: 0;
  }

  /* カーソル軌跡パーティクル (色・サイズ統一) */
  .satosan-cursor-spark {
    position: fixed;
    top: 0; left: 0;
    width: 4px; height: 4px;
    border-radius: 50%;
    background: rgba(255, 216, 120, 0.95);
    pointer-events: none;
    z-index: 99997;
    will-change: transform, opacity;
    mix-blend-mode: screen;
    box-shadow:
      0 0 7px rgba(255, 216, 120, 0.85),
      0 0 3px rgba(255, 245, 210, 1);
  }
}
/* ────────────────────────────────────
   朝モード（明るい背景）用: カーソルをダスティラベンダーに差し替え
   sato-lab 朝モードパレット（ベージュ / ラベンダー / 淡藍 / 橙）と
   トーンを揃えた くすみ紫（#9b8aba 系）。ビビッドな紫は彩度過多で
   画面から浮いてしまうため、くすみ系で優しく馴染ませる。
   ──────────────────────────────────── */
@media (hover: hover) and (pointer: fine) {
  html[data-mode="morning"] .satosan-cursor {
    background: rgba(155, 138, 186, 0.45);    /* dusty lavender #9b8aba */
    border-color: rgba(106, 89, 131, 0.75);   /* deeper #6a5983 */
    mix-blend-mode: normal;
    box-shadow:
      0 0 12px rgba(155, 138, 186, 0.3),
      0 0 4px rgba(106, 89, 131, 0.35);
  }
  html[data-mode="morning"] .satosan-cursor-ring {
    border-color: rgba(155, 138, 186, 0.45);
    mix-blend-mode: normal;
  }
  html[data-mode="morning"] .satosan-cursor.is-hover {
    background: rgba(155, 138, 186, 0.85);
    border-color: rgba(85, 70, 115, 0.95);
  }
  html[data-mode="morning"] .satosan-cursor-ring.is-hover {
    border-color: rgba(155, 138, 186, 0.8);
  }
  /* 吸着リング: ダスティラベンダーのドットとの補色関係で
     暖かいオレンジ (--accent 系) を使う。"クリック可能" の合図を
     温かくはっきり示しつつ、くすみ紫とも馴染む。 */
  html[data-mode="morning"] .satosan-cursor-ring.is-magnetic {
    border-color: rgba(212, 113, 26, 0.8);
    border-width: 1.5px;
    background: rgba(212, 113, 26, 0.07);
    box-shadow:
      0 0 20px rgba(212, 113, 26, 0.28),
      inset 0 0 12px rgba(212, 113, 26, 0.12);
  }
  html[data-mode="morning"] .satosan-cursor-spark {
    background: rgba(155, 138, 186, 0.9);
    mix-blend-mode: normal;
    box-shadow:
      0 0 7px rgba(155, 138, 186, 0.75),
      0 0 3px rgba(200, 185, 225, 0.95);     /* 薄紫ハイライト */
  }
}

/* 縮小モーション環境 */
@media (prefers-reduced-motion: reduce) {
  .satosan-cursor, .satosan-cursor-ring, .satosan-cursor-spark {
    transition: none !important;
  }
}