/* ==========================================================================
   LongPT · 共享配色方案 schemes.css
   --------------------------------------------------------------------------
   用途：承载「界面外观」面板里的 4 套配色方案（data-nx-scheme），由 stdhead()
         在「分层主题」（目录内存在 tokens.css）下统一加载，位置在 tokens.css 之后。

   为什么要独立成共享层：
     Nebula / Kawaii / Cyber 三个分层主题的明暗结构不同，但配色方案只关心
     「品牌色」，与主题无关。写在共享层后，新增主题无需重复定义即可用上。
     在此之前方案只定义在 Cyber/tokens.css §3b，切到 Nebula/Kawaii 时点击无效。

   为什么不能只覆盖 --nx-brand-*：
     Cyber 的明暗块用 var(--nx-brand-*) 派生主色，所以覆盖 brand 阶即可生效；
     但 Nebula / Kawaii 的【深色块把 --nx-primary 等写死成 hex】
     （见 Nebula:256 / Kawaii:249），覆盖 brand 阶对它们无效。
     → 因此本文件直接覆盖语义令牌 --nx-primary 一族，三主题通吃。

   选择器特异性：
     主题令牌定义在 (0,1,0)：:root / [data-nx-theme="dark"] / .nx-dark
     主题的 auto 媒体块是 (0,3,0)：:root:not(...):not(...):not(...)
     本文件用 :root[data-nx-scheme][data-nx-theme] = (0,3,0)，
     auto 场景再 +[data-nx-default] = (0,4,0)，搭配"源顺序在后"稳赢。

   明暗反转：深色档色阶 50 存最暗、900 存最亮（与浅色相反），
     这样 brand-50 在深底上依然能当柔底，语义位置与浅色一致。
     故两档必须各写一份 hex，不能互相 var() 映射。

   与主题「默认方案」的关系：
     deep-blue（深海蓝）是各主题的默认品牌色，本文件【不为它写覆盖】，
     直接沿用各主题 tokens.css 原生值（Cyber=#3b82f6 /2 #2563eb，
     Nebula=AntD #1677ff，Kawaii=#db2777/ #ec4899），保证主题默认观感不被改动。
     只对 jade / nebula / amber 三个非默认方案写覆盖。
   ========================================================================== */


/* ==========================================================================
   1. 翡翠青 jade —— 清透自然
   ========================================================================== */

/* 深色档：显式深色，或「深色默认主题 + 跟随系统」 */
:root[data-nx-scheme="jade"][data-nx-theme="dark"] {
    --nx-brand-50:  #062b23;
    --nx-brand-100: #08382c;
    --nx-brand-200: #0a4a39;
    --nx-brand-300: #0d5f49;
    --nx-brand-400: #059669;
    --nx-brand-500: #059669;
    --nx-brand-600: #10b981;
    --nx-brand-700: #34d399;
    --nx-brand-800: #6ee7b7;
    --nx-brand-900: #a7f3d0;

    --nx-primary:              var(--nx-brand-600);
    --nx-primary-hover:        var(--nx-brand-700);
    --nx-primary-active:       var(--nx-brand-500);
    --nx-primary-soft:         rgba(16, 185, 129, 0.14);
    --nx-primary-border:       rgba(16, 185, 129, 0.35);
    --nx-on-primary:           #04101f;
    --nx-primary-strong:       var(--nx-brand-800);
    --nx-primary-strong-hover: var(--nx-brand-900);
}

/* 浅色档：显式浅色 */
:root[data-nx-scheme="jade"][data-nx-theme="light"] {
    --nx-brand-50:  #ecfdf5;
    --nx-brand-100: #d1fae5;
    --nx-brand-200: #a7f3d0;
    --nx-brand-300: #6ee7b7;
    --nx-brand-400: #34d399;
    --nx-brand-500: #10b981;
    --nx-brand-600: #059669;
    --nx-brand-700: #047857;
    --nx-brand-800: #065f46;
    --nx-brand-900: #064e3b;

    --nx-primary:              var(--nx-brand-600);
    --nx-primary-hover:        var(--nx-brand-500);
    --nx-primary-active:       var(--nx-brand-700);
    --nx-primary-soft:         var(--nx-brand-50);
    --nx-primary-border:       var(--nx-brand-200);
    --nx-on-primary:           #ffffff;
    --nx-primary-strong:       var(--nx-brand-700);
    --nx-primary-strong-hover: var(--nx-brand-800);
}

/* 跟随系统（浅色默认主题 Nebula/Kawaii）：按系统偏好选档 */
@media (prefers-color-scheme: dark) {
    :root[data-nx-scheme="jade"][data-nx-theme="auto"] {
        --nx-brand-50:  #062b23;
        --nx-brand-100: #08382c;
        --nx-brand-200: #0a4a39;
        --nx-brand-300: #0d5f49;
        --nx-brand-400: #059669;
        --nx-brand-500: #059669;
        --nx-brand-600: #10b981;
        --nx-brand-700: #34d399;
        --nx-brand-800: #6ee7b7;
        --nx-brand-900: #a7f3d0;

        --nx-primary:              var(--nx-brand-600);
        --nx-primary-hover:        var(--nx-brand-700);
        --nx-primary-active:       var(--nx-brand-500);
        --nx-primary-soft:         rgba(16, 185, 129, 0.14);
        --nx-primary-border:       rgba(16, 185, 129, 0.35);
        --nx-on-primary:           #04101f;
        --nx-primary-strong:       var(--nx-brand-800);
        --nx-primary-strong-hover: var(--nx-brand-900);
    }
}
@media (prefers-color-scheme: light) {
    :root[data-nx-scheme="jade"][data-nx-theme="auto"] {
        --nx-brand-50:  #ecfdf5;
        --nx-brand-100: #d1fae5;
        --nx-brand-200: #a7f3d0;
        --nx-brand-300: #6ee7b7;
        --nx-brand-400: #34d399;
        --nx-brand-500: #10b981;
        --nx-brand-600: #059669;
        --nx-brand-700: #047857;
        --nx-brand-800: #065f46;
        --nx-brand-900: #064e3b;

        --nx-primary:              var(--nx-brand-600);
        --nx-primary-hover:        var(--nx-brand-500);
        --nx-primary-active:       var(--nx-brand-700);
        --nx-primary-soft:         var(--nx-brand-50);
        --nx-primary-border:       var(--nx-brand-200);
        --nx-on-primary:           #ffffff;
        --nx-primary-strong:       var(--nx-brand-700);
        --nx-primary-strong-hover: var(--nx-brand-800);
    }
}


/* ==========================================================================
   2. 星穹紫 nebula —— 科技质感
   ========================================================================== */

/* 深色档 */
:root[data-nx-scheme="nebula"][data-nx-theme="dark"] {
    --nx-brand-50:  #1b1240;
    --nx-brand-100: #241857;
    --nx-brand-200: #2f1f70;
    --nx-brand-300: #3f2891;
    --nx-brand-400: #7c3aed;
    --nx-brand-500: #7c3aed;
    --nx-brand-600: #8b5cf6;
    --nx-brand-700: #a78bfa;
    --nx-brand-800: #c4b5fd;
    --nx-brand-900: #ddd6fe;

    --nx-primary:              var(--nx-brand-600);
    --nx-primary-hover:        var(--nx-brand-700);
    --nx-primary-active:       var(--nx-brand-500);
    --nx-primary-soft:         rgba(139, 92, 246, 0.16);
    --nx-primary-border:       rgba(139, 92, 246, 0.36);
    --nx-on-primary:           #100619;
    --nx-primary-strong:       var(--nx-brand-800);
    --nx-primary-strong-hover: var(--nx-brand-900);
}

/* 浅色档 */
:root[data-nx-scheme="nebula"][data-nx-theme="light"] {
    --nx-brand-50:  #f5f3ff;
    --nx-brand-100: #ede9fe;
    --nx-brand-200: #ddd6fe;
    --nx-brand-300: #c4b5fd;
    --nx-brand-400: #a78bfa;
    --nx-brand-500: #8b5cf6;
    --nx-brand-600: #7c3aed;
    --nx-brand-700: #6d28d9;
    --nx-brand-800: #5b21b6;
    --nx-brand-900: #4c1d95;

    --nx-primary:              var(--nx-brand-600);
    --nx-primary-hover:        var(--nx-brand-500);
    --nx-primary-active:       var(--nx-brand-700);
    --nx-primary-soft:         var(--nx-brand-50);
    --nx-primary-border:       var(--nx-brand-200);
    --nx-on-primary:           #ffffff;
    --nx-primary-strong:       var(--nx-brand-700);
    --nx-primary-strong-hover: var(--nx-brand-800);
}

@media (prefers-color-scheme: dark) {
    :root[data-nx-scheme="nebula"][data-nx-theme="auto"] {
        --nx-brand-50:  #1b1240;
        --nx-brand-100: #241857;
        --nx-brand-200: #2f1f70;
        --nx-brand-300: #3f2891;
        --nx-brand-400: #7c3aed;
        --nx-brand-500: #7c3aed;
        --nx-brand-600: #8b5cf6;
        --nx-brand-700: #a78bfa;
        --nx-brand-800: #c4b5fd;
        --nx-brand-900: #ddd6fe;

        --nx-primary:              var(--nx-brand-600);
        --nx-primary-hover:        var(--nx-brand-700);
        --nx-primary-active:       var(--nx-brand-500);
        --nx-primary-soft:         rgba(139, 92, 246, 0.16);
        --nx-primary-border:       rgba(139, 92, 246, 0.36);
        --nx-on-primary:           #100619;
        --nx-primary-strong:       var(--nx-brand-800);
        --nx-primary-strong-hover: var(--nx-brand-900);
    }
}
@media (prefers-color-scheme: light) {
    :root[data-nx-scheme="nebula"][data-nx-theme="auto"] {
        --nx-brand-50:  #f5f3ff;
        --nx-brand-100: #ede9fe;
        --nx-brand-200: #ddd6fe;
        --nx-brand-300: #c4b5fd;
        --nx-brand-400: #a78bfa;
        --nx-brand-500: #8b5cf6;
        --nx-brand-600: #7c3aed;
        --nx-brand-700: #6d28d9;
        --nx-brand-800: #5b21b6;
        --nx-brand-900: #4c1d95;

        --nx-primary:              var(--nx-brand-600);
        --nx-primary-hover:        var(--nx-brand-500);
        --nx-primary-active:       var(--nx-brand-700);
        --nx-primary-soft:         var(--nx-brand-50);
        --nx-primary-border:       var(--nx-brand-200);
        --nx-on-primary:           #ffffff;
        --nx-primary-strong:       var(--nx-brand-700);
        --nx-primary-strong-hover: var(--nx-brand-800);
    }
}


/* ==========================================================================
   3. 琥珀金 amber —— 温暖醒目
   ========================================================================== */

/* 深色档 */
:root[data-nx-scheme="amber"][data-nx-theme="dark"] {
    --nx-brand-50:  #33220a;
    --nx-brand-100: #422c0c;
    --nx-brand-200: #54380e;
    --nx-brand-300: #6b4610;
    --nx-brand-400: #d97706;
    --nx-brand-500: #d97706;
    --nx-brand-600: #f59e0b;
    --nx-brand-700: #fbbf24;
    --nx-brand-800: #fcd34d;
    --nx-brand-900: #fde68a;

    --nx-primary:              var(--nx-brand-600);
    --nx-primary-hover:        var(--nx-brand-700);
    --nx-primary-active:       var(--nx-brand-500);
    --nx-primary-soft:         rgba(245, 158, 11, 0.16);
    --nx-primary-border:       rgba(245, 158, 11, 0.38);
    --nx-on-primary:           #1a1000;
    --nx-primary-strong:       var(--nx-brand-800);
    --nx-primary-strong-hover: var(--nx-brand-900);
}

/* 浅色档 */
:root[data-nx-scheme="amber"][data-nx-theme="light"] {
    --nx-brand-50:  #fffbeb;
    --nx-brand-100: #fef3c7;
    --nx-brand-200: #fde68a;
    --nx-brand-300: #fcd34d;
    --nx-brand-400: #fbbf24;
    --nx-brand-500: #f59e0b;
    --nx-brand-600: #d97706;
    --nx-brand-700: #b45309;
    --nx-brand-800: #92400e;
    --nx-brand-900: #78350f;

    --nx-primary:              var(--nx-brand-600);
    --nx-primary-hover:        var(--nx-brand-500);
    --nx-primary-active:       var(--nx-brand-700);
    --nx-primary-soft:         var(--nx-brand-50);
    --nx-primary-border:       var(--nx-brand-200);
    --nx-on-primary:           #ffffff;
    --nx-primary-strong:       var(--nx-brand-700);
    --nx-primary-strong-hover: var(--nx-brand-800);
}

@media (prefers-color-scheme: dark) {
    :root[data-nx-scheme="amber"][data-nx-theme="auto"] {
        --nx-brand-50:  #33220a;
        --nx-brand-100: #422c0c;
        --nx-brand-200: #54380e;
        --nx-brand-300: #6b4610;
        --nx-brand-400: #d97706;
        --nx-brand-500: #d97706;
        --nx-brand-600: #f59e0b;
        --nx-brand-700: #fbbf24;
        --nx-brand-800: #fcd34d;
        --nx-brand-900: #fde68a;

        --nx-primary:              var(--nx-brand-600);
        --nx-primary-hover:        var(--nx-brand-700);
        --nx-primary-active:       var(--nx-brand-500);
        --nx-primary-soft:         rgba(245, 158, 11, 0.16);
        --nx-primary-border:       rgba(245, 158, 11, 0.38);
        --nx-on-primary:           #1a1000;
        --nx-primary-strong:       var(--nx-brand-800);
        --nx-primary-strong-hover: var(--nx-brand-900);
    }
}
@media (prefers-color-scheme: light) {
    :root[data-nx-scheme="amber"][data-nx-theme="auto"] {
        --nx-brand-50:  #fffbeb;
        --nx-brand-100: #fef3c7;
        --nx-brand-200: #fde68a;
        --nx-brand-300: #fcd34d;
        --nx-brand-400: #fbbf24;
        --nx-brand-500: #f59e0b;
        --nx-brand-600: #d97706;
        --nx-brand-700: #b45309;
        --nx-brand-800: #92400e;
        --nx-brand-900: #78350f;

        --nx-primary:              var(--nx-brand-600);
        --nx-primary-hover:        var(--nx-brand-500);
        --nx-primary-active:       var(--nx-brand-700);
        --nx-primary-soft:         var(--nx-brand-50);
        --nx-primary-border:       var(--nx-brand-200);
        --nx-on-primary:           #ffffff;
        --nx-primary-strong:       var(--nx-brand-700);
        --nx-primary-strong-hover: var(--nx-brand-800);
    }
}


/* ==========================================================================
   4. 深海蓝 deep-blue（各主题默认）
   --------------------------------------------------------------------------
   不写覆盖，沿用各主题 tokens.css 原生品牌色。
   面板色块所需的 --nx-swatch-deep-blue 由主题 tokens.css 提供
   （Cyber 有定义；Nebula/Kawaii 靠 components.css 的 fallback）。
   ========================================================================== */


/* ==========================================================================
   5. 品牌渐变也跟随配色方案（2026-09-18）
   --------------------------------------------------------------------------
   问题：站点 logo 与主色渐变用的是 --nx-gradient-logo / --nx-gradient-brand，
        而这两个令牌在各主题 tokens.css 里是【写死的 hex】——
        上面 1~3 节只覆盖了 --nx-brand-*，渐变不变，
        于是出现「换了配色方案（如翡翠青），logo 还是蓝的」不匹配。
   解法：用 var(--nx-brand-*) 重建这两个渐变。因为方案块已经覆盖了 brand 阶，
        渐变便会自动跟着方案走 —— 一份规则覆盖所有方案，无需逐方案重复。
   色阶取法沿用各主题既有约定：
        深色档 brand-500 → brand-700（logo 用 白 → brand-800，避免糊在深底上）
        浅色档 brand-600 → brand-400
   ========================================================================== */

/* 深色档：显式深色，或「深色默认主题 + 跟随系统」 */
:root[data-nx-theme="dark"][data-nx-scheme] {
    --nx-gradient-brand: linear-gradient(135deg, var(--nx-brand-500) 0%, var(--nx-brand-700) 100%);
    --nx-gradient-logo:  linear-gradient(135deg, #ffffff 0%, var(--nx-brand-800) 100%);
}

/* 浅色档：显式浅色 */
:root[data-nx-theme="light"][data-nx-scheme] {
    --nx-gradient-brand: linear-gradient(135deg, var(--nx-brand-600) 0%, var(--nx-brand-400) 100%);
    --nx-gradient-logo:  var(--nx-gradient-brand);
}

/* 跟随系统（浅色默认主题）：按系统偏好选档 */
@media (prefers-color-scheme: dark) {
    :root[data-nx-theme="auto"][data-nx-scheme] {
        --nx-gradient-brand: linear-gradient(135deg, var(--nx-brand-500) 0%, var(--nx-brand-700) 100%);
        --nx-gradient-logo:  linear-gradient(135deg, #ffffff 0%, var(--nx-brand-800) 100%);
    }
}
@media (prefers-color-scheme: light) {
    :root[data-nx-theme="auto"][data-nx-scheme] {
        --nx-gradient-brand: linear-gradient(135deg, var(--nx-brand-600) 0%, var(--nx-brand-400) 100%);
        --nx-gradient-logo:  var(--nx-gradient-brand);
    }
}

/* ==========================================================================
   6. 输入框焦点态兜底：压过「内联写死 border」（2026-09-18）
   --------------------------------------------------------------------------
   问题：登录页的「两步验证」「验证码」两个输入框在 HTML 里内联写了
        style="border: 1px solid gray"。**内联 style 属性优先级高于任何 CSS 选择器**，
        所以主题里 #outer ... input:focus { border-color: var(--nx-primary) }
        完全被盖掉 —— 聚焦时边框仍是灰色，不跟主题/配色方案走。
        （相邻的用户名、密码框没写内联 border，所以它们的焦点环是正常的，对比就很扎眼）

   解法：这里用 !important 兜底。!important 是 CSS 中**唯一**能压过内联 style 的手段，
        专门对付这类「标记里硬编码了颜色」的历史遗留。
        放在共享层 → 三个主题、所有配色方案一次覆盖，不必逐页去改标记。

   范围限定：只处理文本类输入框的【焦点态边框色】与【焦点环】，
        不碰 padding / 尺寸 / 布局，避免影响既有排版。
   ========================================================================== */

#outer input:not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="hidden"]):focus,
#outer textarea:focus,
#outer select:focus {
    border-color: var(--nx-primary) !important;
    box-shadow: var(--nx-shadow-focus) !important;
    outline: none;
}

