/* 快进指示器：长按页面 / 长按 Z 时显示纯转转环（不带文字，干干净净一个 spin ring）
   位置：pointer 触发时 JS 设 left/top 为按下点；Z 键触发时屏幕中央偏上 fallback
   主题覆盖：默认用「文字色做底 + 背景色做线」反相配色，保证任何主题下对比强且被美化色覆盖；
   主题想精调直接设 --ff-bg / --ff-fg / --ff-spin-color 三变量
   pointer-events: none 不挡操作；z-index 9998 在 modal 下方（modal 出现时快进引擎已 stop） */

.fast-forward-indicator {
  position: fixed;
  left: 50%;
  top: 22%;
  transform: translate(-50%, -50%) scale(0.85);
  z-index: 9998;
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(60px, 14vmin, 96px);
  height: clamp(60px, 14vmin, 96px);
  /* 默认：用文字色做底（深色主题→白底，浅色主题→深底），保证对比；主题可用 --ff-bg 覆盖 */
  background: var(--ff-bg, color-mix(in srgb, var(--text-primary, #252525) 78%, transparent));
  /* 文字 / 边线色用主背景色（与底色反相） */
  color: var(--ff-fg, var(--bg-secondary, #fff));
  border-radius: 50%;
  pointer-events: none;
  opacity: 0;
  /* transition 不含 left/top 避免拖动按下点时 spinner 滑过去；只让淡入/缩放有过渡 */
  transition: opacity 0.18s ease, transform 0.18s ease;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  box-shadow: 0 4px 18px color-mix(in srgb, var(--text-primary, #000) 30%, transparent);
}

.fast-forward-indicator--active {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

.fast-forward-ring {
  width: 62%;
  height: 62%;
  border: clamp(3px, 0.7vmin, 4.5px) solid color-mix(in srgb, currentColor 30%, transparent);
  /* 转动高亮：用 accent-color 强调，主题可独立覆盖 --ff-spin-color */
  border-top-color: var(--ff-spin-color, var(--accent-color, currentColor));
  border-radius: 50%;
  animation: fast-forward-spin 0.6s linear infinite;
}

@keyframes fast-forward-spin {
  to { transform: rotate(360deg); }
}

/* 快进中：禁用文本选择 + 移动端长按菜单 */
body.body--fast-forwarding,
body.body--fast-forwarding * {
  user-select: none !important;
  -webkit-user-select: none !important;
  -webkit-touch-callout: none !important;
}