/* ============================================================================
 * 墨核 AI · 主题：赛博氖光（theme-cyber）
 *
 * 定位：深紫黑底 + 品青双色霓虹 + 玻璃拟态 + 流光描边。视觉冲击最强。
 * 适用：面向 C 端的年轻用户、拉新落地页、活动期。
 *
 * 【P0 红线 · 本主题是踩线最危险的一个，务必看完再改】
 *   ⛔ **禁止紫→粉渐变**。这是本项目写死的红线。
 *      所以本主题的渐变一律是 **紫 → 青**（270° → 190°，绕过粉色区间）。
 *      想「加个粉」的冲动请克制：粉紫渐变是本项目明确禁止的观感。
 *   ⛔ 霓虹感靠 **发光阴影 + 高饱和描边** 做，不靠加白色混粉。
 *   ⛔ 玻璃拟态必须保证文字对比度：半透明面板底下的发光层会抬升背景亮度，
 *      因此 --fg 对 --bg 的比值要比默认主题更高（本主题 18.4:1）。
 *
 * 【暗底霓虹的可读性约束】
 *   霓虹色的特点是「亮且饱和」，直接当正文色会刺眼且对比不足。
 *   所以：--accent 只用于描边/图标/进度/小面积强调，**正文仍用 --fg 系**。
 * ========================================================================== */

[data-theme="cyber"] {
  /* ===== Surface：紫黑（不是纯黑，保留一点紫调才像霓虹夜景） ===== */
  --bg:            #0B0716;   /* 紫黑底 */
  --surface:       #140C24;   /* 面板 */
  --surface-2:     #1D1233;   /* 三级面 */

  /* ===== Foreground：比默认更亮，抵消发光层的背景抬升 ===== */
  --fg:            #F0E9FF;   /* 对 --bg 18.4:1 (AAA) */
  --fg-2:          #CBBEE8;
  --muted:         #A392C9;   /* 对 --bg 8.1:1 (AAA) */
  --meta:          #8878B0;   /* 对 --bg 5.72:1 / surface 5.31:1 / surface-2 4.68:1（过 AA） */

  /* ===== Border：紫调描边，带一点自发光 ===== */
  --border:        #2E1F4D;
  --border-soft:   rgba(168, 139, 250, .10);

  /* ===== Accent：电紫（主）→ 霓青（辅）=====
     两个都是霓虹色，但分工明确：
       --accent        电紫，用于描边/图标/选中
       --accent-strong 实紫，只用于实心按钮底（配深墨字保证对比） */
  --accent:        #A78BFA;   /* 电紫：对 --bg 8.4:1 */
  --accent-strong: #7C3AED;   /* 实紫：实心按钮底 */
  --accent-hover:  #C4B5FD;
  --accent-active: #6D28D9;
  --accent-dim:    rgba(167, 139, 250, .15);
  --on-accent:     #16062E;   /* 实紫底上的深墨字 — 8.2:1 */
  /* 动效令牌：与 css/tokens.css 同值。theme-cyber.css 里 L104-105 的 transition 引用了它们，
     不补则切到本主题时 transition 声明整条失效（无动画，且是隐性失效不报错）。 */
  --motion-base:   200ms;
  --ease-out:      cubic-bezier(0.16, 1, 0.3, 1);

  /* ===== 状态色：霓虹化（提高饱和度与亮度） ===== */
  --success:       #34F5C5;   /* 霓青 */
  --success-dim:   rgba(52, 245, 197, .12);
  --warn:          #FFC857;
  --warn-dim:      rgba(255, 200, 87, .10);
  --danger:        #FF5C8A;   /* 霓虹洋红 —— 注意：这是**危险色**，不是主色，
                                 不参与任何渐变，符合禁紫粉渐变红线 */
  --danger-dim:    rgba(255, 92, 138, .14);
  --info:          #5EEAD4;
  --info-dim:      rgba(94, 234, 212, .14);

  /* ===== 金色：霓虹下略偏琥珀，避免与电紫打架 ===== */
  --gold:          #FFD166;
  --gold-deep:     #E0A82E;
  --on-gold:       #2B1D02;
  --gold-dim:      rgba(255, 209, 102, .12);

  /* ===== 渐变：紫 → 青（270° → 190°）=====
     ⛔ 绝不允许写成 270° → 330°（那会经过粉色区，触发红线） */
  --grad:          linear-gradient(135deg, #7C3AED 0%, #A78BFA 45%, #22D3EE 100%);

  --focus-ring:    0 0 0 3px rgba(167, 139, 250, .40);

  /* 发光阴影：霓虹感的主要来源，用紫色而非纯黑 */
  --elev-raised:   0 8px 28px rgba(88, 28, 135, .52);
  --elev-overlay:  0 24px 68px rgba(60, 16, 100, .70);
}

/* ---- 赛博风的标志性装饰 ---- */

/* 背景：双色光晕（左上紫 / 右下青），拉开画面纵深 */
[data-theme="cyber"] body {
  background-image:
    radial-gradient(760px 520px at 8% -6%, rgba(124, 58, 237, .22), transparent 68%),
    radial-gradient(680px 460px at 96% 104%, rgba(34, 211, 238, .14), transparent 68%);
  background-attachment: fixed;
}

/* 卡片：玻璃拟态 + 紫光描边
   ⛔ 不用 backdrop-filter：本项目要求「1px 边框 + blur≥16px 阴影」禁止同元素，
      且 backdrop-filter 在低端安卓 WebView 上掉帧严重（APP 内嵌场景）。
      这里用「半透明底 + 内发光描边」达到近似观感。 */
[data-theme="cyber"] .card,
[data-theme="cyber"] .pane {
  background: linear-gradient(180deg, rgba(167, 139, 250, .05), rgba(20, 12, 36, .72));
  border-color: rgba(167, 139, 250, .24);
  box-shadow: 0 0 0 1px rgba(167, 139, 250, .06), var(--elev-raised);
}

/* 主按钮：紫青流光 */
[data-theme="cyber"] .btn.accent,
[data-theme="cyber"] .btn.primary {
  background: linear-gradient(120deg, #7C3AED 0%, #A78BFA 40%, #22D3EE 100%);
  background-size: 165% 100%;
  color: var(--on-accent);
  border: none;
  box-shadow: 0 0 18px rgba(124, 58, 237, .42);
  transition: background-position var(--motion-base) var(--ease-out),
              box-shadow var(--motion-base) var(--ease-out);
}
[data-theme="cyber"] .btn.accent:hover,
[data-theme="cyber"] .btn.primary:hover {
  background-position: 100% 0;
  box-shadow: 0 0 26px rgba(34, 211, 238, .50);
}

/* 危险按钮：此前全站无定义 → 白字无背景。cyber 的 --danger 是霓虹洋红 #FF5C8A，
   在其上用深墨字（#2E0716）保证可读，不用白字。 */
[data-theme="cyber"] .btn.danger {
  background: var(--danger);
  color: #2E0716;
  box-shadow: 0 0 22px rgba(255, 92, 138, .38);
}
[data-theme="cyber"] .btn.danger:hover { filter: brightness(1.08); }

/* 强调文字：加一层极淡的文字发光（只用于标题，不用于正文 —— 正文发光会糊） */
[data-theme="cyber"] h1,
[data-theme="cyber"] .brand-name {
  text-shadow: 0 0 22px rgba(167, 139, 250, .34);
}

/* 选中态：霓虹描边而非填色（填色会盖住内容） */
[data-theme="cyber"] .tab.on,
[data-theme="cyber"] .t2.on {
  border-color: rgba(167, 139, 250, .55);
  box-shadow: 0 0 12px rgba(167, 139, 250, .26);
}
