/* ============================================================
 * Longlight - 长光雨滴小站 | 页面样式：home / 站点 logo 交互
 * pages/home/logo.css
 * 区块：logo 手势与旋转、像素网格层（数据爆点 / 数据轨迹）、信号故障滤镜容器、超频风暴层
 * 视觉：数字风 / 极客风 + 空气投影（纯光投影）——颜色一律引用 tokens.css 令牌
 * 说明：不在本文件重复定义 :root / [data-theme]；交互逻辑见 modules/home/logo.js
 *       引入顺序：base → orbit → ignite → ignite-burst → logo → responsive（responsive 必须最后）
 * ============================================================ */

/* ========== 站点 logo：可拖动 / 可长按 ==========
   交互由 logo.js 挂载（减少动态偏好时整体停用，届时不加 is-interactive，
   光标与触屏行为保持默认）；禁用文字选择与原生图片拖拽，
   touch-action:none 让触屏从 logo 起手即进入拖动而非滚动 */
.home-brand-logo.is-interactive {
  cursor: grab;
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
  -webkit-user-drag: none;
  transform-origin: 50% 50%;
  will-change: transform, filter;
  transition: filter var(--duration-hover) var(--ease-out),
              opacity 260ms var(--ease-out);
}

/* 按住：进入抓取态，外泛一层辉光 */
.home-brand-logo.is-holding {
  cursor: grabbing;
  filter: drop-shadow(0 0 10px color-mix(in srgb, var(--green-500) 70%, transparent));
}

/* 旋转中：辉光更强，作为「已进入长按（系统超频）」的可见反馈 */
.home-brand-logo.is-spinning {
  filter: drop-shadow(0 0 16px color-mix(in srgb, var(--green-500) 80%, transparent));
}

/* 拖动松开：logo 弹回原位（本类只为这次回位补上 transform 过渡，末端带一点回弹） */
.home-brand-logo.is-releasing {
  transition: transform 420ms cubic-bezier(.34, 1.32, .64, 1),
              filter var(--duration-hover) var(--ease-out),
              opacity 260ms var(--ease-out);
}

/* ========== 像素网格层：数据爆点 / 数据轨迹 ==========
   固定全屏、不接收指针事件；无特效时整层透明 */
.home-pixel {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 60;
  pointer-events: none;
}

/* ========== 信号故障：SVG 滤镜的零尺寸挂载容器 ==========
   滤镜本身由 modules/home/logo.js 注入 body（松开拖动时触发一记 RGB 分离故障） */
.home-glitch {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

/* ========== 超频风暴层：长按 logo 时长出的数字风暴 ==========
   小风暴在 logo 原处形成，半径与数据洪流的加深连续推进，约 10s 不透明地铺满屏幕；
   显隐交给元素透明度过渡（画布每帧整体重绘，不依赖画布自身透明） */
.home-overload {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 90;
  pointer-events: none;
  opacity: 0;
  transition: opacity 640ms var(--ease-out);
}

.home-overload.is-in { opacity: 1; }
.home-overload.is-out { opacity: 0; }

/* 风暴张开期间锁滚动，避免背景页随手指/滚轮移动 */
body.home-overload-open {
  overflow: hidden;
}
