/* MASKKING 设计变量 —— 默认深色霓虹极光风，[data-theme=light] 覆盖 */
:root {
  --color-bg: #0a0a0f;
  --color-surface: #14141c;
  --color-text: #f4f2ee;
  --color-muted: #9b9aa4;
  --color-border: rgba(255, 255, 255, 0.1);
  --color-border-strong: rgba(255, 255, 255, 0.22);
  --color-accent: #ff6b35;
  --color-accent-soft: rgba(255, 107, 53, 0.14);

  /* 霓虹色板（橙→品红→紫→青） */
  --neon-1: #ff7a18;
  --neon-2: #ff3d77;
  --neon-3: #a855f7;
  --neon-4: #38bdf8;

  /* 主渐变：品牌橙起手，过渡到品红/紫，青色收尾点缀 */
  --grad-accent: linear-gradient(
    112deg,
    #ff7a18 0%,
    #ff3d77 42%,
    #a855f7 76%,
    #38bdf8 118%
  );

  /* 彩色发光 */
  --glow-accent:
    0 0 0 1px rgba(255, 61, 119, 0.35),
    0 22px 60px -16px rgba(255, 61, 119, 0.5),
    0 10px 34px -12px rgba(168, 85, 247, 0.5);
  --glow-sm: 0 8px 28px -10px rgba(255, 61, 119, 0.55);

  /* 背景氛围极光光晕（固定铺底） */
  --aurora:
    radial-gradient(58% 52% at 8% -6%, rgba(255, 122, 24, 0.20), transparent 62%),
    radial-gradient(52% 48% at 94% 0%, rgba(168, 85, 247, 0.22), transparent 64%),
    radial-gradient(70% 52% at 50% 112%, rgba(56, 189, 248, 0.12), transparent 62%);

  --font-sans: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
    "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei",
    sans-serif;
  --font-mono: "SFMono-Regular", "JetBrains Mono", Consolas, Menlo, monospace;

  --maxw: 1120px;
  --gutter: clamp(20px, 5vw, 48px);
  --radius-sm: 6px;
  --radius: 10px;
  --radius-lg: 12px;
  --space-section: clamp(80px, 12vw, 200px);

  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --dur: 0.4s;
}

:root[data-theme="light"] {
  --color-bg: #f2f0ea;
  --color-surface: #e9e7e0;
  --color-text: #141318;
  --color-muted: #6c6a72;
  --color-border: rgba(0, 0, 0, 0.12);
  --color-border-strong: rgba(0, 0, 0, 0.24);
  --color-accent: #e8542c;
  --color-accent-soft: rgba(232, 84, 44, 0.12);

  /* 浅底用更深、更饱和的渐变以保证对比 */
  --grad-accent: linear-gradient(
    112deg,
    #ea580c 0%,
    #db1e63 44%,
    #7c3aed 80%,
    #0284c7 120%
  );
  --glow-accent:
    0 0 0 1px rgba(219, 30, 99, 0.28),
    0 20px 50px -18px rgba(219, 30, 99, 0.4),
    0 10px 30px -14px rgba(124, 58, 237, 0.38);
  --glow-sm: 0 8px 26px -12px rgba(219, 30, 99, 0.4);

  --aurora:
    radial-gradient(58% 52% at 8% -6%, rgba(255, 122, 24, 0.12), transparent 62%),
    radial-gradient(52% 48% at 94% 0%, rgba(124, 58, 237, 0.12), transparent 64%),
    radial-gradient(70% 52% at 50% 112%, rgba(2, 132, 199, 0.08), transparent 62%);
}