/* =============================================================
   premium.css — Starstyle · 共享高级动效层 (v2)
   作者: Senior Developer · 用途: simi6 / simi6-deep 等多段页面统一调用
   原则: 零依赖 · DPR 感知 · 60fps 优先 · prefers-reduced-motion 安全
   ============================================================= */

/* ---- 扩展 token（不覆盖各页基础 token） ---- */
:root{
  --grain-op:.045;
  --glass-bg:rgba(244,242,236,.66);
  --glass-brd:rgba(216,212,200,.85);
  --glow-red:226,35,26;
  --glow-gold:212,181,133;
  --glow-soil:139,111,71;
  --ease-3:cubic-bezier(0.16,1,0.3,1);
  --ease-out:cubic-bezier(0.22,1,0.36,1);
}

/* ---- 胶片颗粒（质感核心：消除数字平直感） ---- */
.grain{position:fixed;inset:0;z-index:60;pointer-events:none;opacity:var(--grain-op);mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:140px 140px;}

/* ---- 柔光晕（premium 光斑） ---- */
.orb{position:absolute;border-radius:50%;filter:blur(70px);pointer-events:none;z-index:0;opacity:.55;will-change:transform}

/* ---- 玻璃拟态卡片 ---- */
.glass{
  background:var(--glass-bg);
  -webkit-backdrop-filter:blur(14px) saturate(140%);
  backdrop-filter:blur(14px) saturate(140%);
  border:1px solid var(--glass-brd);
  box-shadow:var(--shadow-2,0 18px 48px -22px rgba(20,18,12,.28)), inset 0 1px 0 rgba(255,255,255,.55);
}

/* ---- 滚动揭示（分层进场） ---- */
[data-reveal]{opacity:0;transform:translateY(30px);transition:opacity 1s var(--ease-3),transform 1s var(--ease-3);transition-delay:var(--d,0ms);will-change:opacity,transform}
[data-reveal].in{opacity:1;transform:none}

/* ---- 粒子场画布 ---- */
.field{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;display:block}

/* ---- 磁性元素（JS 控制 transform） ---- */
[data-magnetic]{will-change:transform;transition:transform .35s var(--ease-3)}

/* ---- 统一降级：用户偏好减少动效时关闭一切 ---- */
@media (prefers-reduced-motion:reduce){
  .grain{display:none}
  .orb{display:none}
  .field{display:none}
  [data-reveal]{opacity:1!important;transform:none!important;transition:none!important}
  *{animation-duration:.001ms!important;animation-iteration-count:1!important}
}
