/* 远银 UI 五套主题 · CSS 变量真源 */
html[data-yy-theme="aurora"],
html:not([data-yy-theme]) {
  --yy-page-bg: #f4f5f8;
  --yy-page-glow: none;
  --yy-surface: rgba(255,255,255,.72);
  --yy-surface-solid: #ffffff;
  --yy-border: rgba(255,255,255,.85);
  --yy-border-input: #e2e8f0;
  --yy-text: #0f172a;
  --yy-text-muted: #64748b;
  --yy-accent: #6366f1;
  --yy-accent-2: #06b6d4;
  --yy-accent-grad: linear-gradient(135deg, #6366f1, #06b6d4);
  --yy-sidebar: rgba(255,255,255,.58);
  --yy-sidebar-text: #475569;
  --yy-sidebar-active: linear-gradient(90deg, rgba(99,102,241,.12), rgba(6,182,212,.08));
  --yy-header: rgba(255,255,255,.75);
  --yy-shadow: 0 8px 32px rgba(99,102,241,.1);
  --yy-input-bg: #ffffff;
  --yy-btn-text: #ffffff;
  --yy-code-bg: rgba(99,102,241,.1);
  --yy-code-text: #6366f1;
  --yy-desktop-form: #f0f4ff;
  --yy-desktop-panel: #ffffff;
  --yy-desktop-bar: #ffffff;
  --yy-log-bg: #f8fafc;
  --yy-log-fg: #334155;
  --yy-radius-card: 14px;
  --yy-radius-btn: 10px;
  --yy-logo-bg: linear-gradient(135deg, rgba(99,102,241,.22), rgba(6,182,212,.14));
  --yy-logo-text: #4338ca;
  --yy-shine-color: color-mix(in srgb, #fde68a 68%, #06b6d4 32%);
}

html[data-yy-theme="frost"] {
  --yy-page-bg: #f4f5f8;
  --yy-page-glow: none;
  --yy-surface: rgba(255,255,255,.88);
  --yy-surface-solid: #ffffff;
  --yy-border: rgba(226,232,240,.95);
  --yy-border-input: #cbd5e1;
  --yy-text: #1e293b;
  --yy-text-muted: #64748b;
  --yy-accent: #0ea5e9;
  --yy-accent-2: #0284c7;
  --yy-accent-grad: linear-gradient(135deg, #0ea5e9, #38bdf8);
  --yy-sidebar: #ffffff;
  --yy-sidebar-text: #64748b;
  --yy-sidebar-active: #f0f9ff;
  --yy-header: #ffffff;
  --yy-shadow: 0 4px 20px rgba(15,23,42,.06);
  --yy-input-bg: #f8fafc;
  --yy-btn-text: #ffffff;
  --yy-code-bg: rgba(14,165,233,.1);
  --yy-code-text: #0284c7;
  --yy-desktop-form: #f8fafc;
  --yy-desktop-panel: #ffffff;
  --yy-desktop-bar: #ffffff;
  --yy-log-bg: #f1f5f9;
  --yy-log-fg: #334155;
  --yy-shine-color: color-mix(in srgb, #fde68a 65%, #38bdf8 35%);
}

html[data-yy-theme="mint"] {
  --yy-page-bg: #f4f5f8;
  --yy-page-glow: none;
  --yy-surface: rgba(255,255,255,.9);
  --yy-surface-solid: #ffffff;
  --yy-border: rgba(204,251,241,.85);
  --yy-border-input: #99f6e4;
  --yy-text: #0f172a;
  --yy-text-muted: #64748b;
  --yy-accent: #0d9488;
  --yy-accent-2: #14b8a6;
  --yy-accent-grad: linear-gradient(135deg, #0d9488, #2dd4bf);
  --yy-sidebar: rgba(255,255,255,.92);
  --yy-sidebar-text: #64748b;
  --yy-sidebar-active: linear-gradient(90deg, rgba(13,148,136,.1), rgba(45,212,191,.06));
  --yy-header: rgba(255,255,255,.95);
  --yy-shadow: 0 8px 28px rgba(13,148,136,.08);
  --yy-input-bg: #f0fdfa;
  --yy-btn-text: #ffffff;
  --yy-code-bg: rgba(13,148,136,.1);
  --yy-code-text: #0d9488;
  --yy-desktop-form: #f0fdfa;
  --yy-desktop-panel: #ffffff;
  --yy-desktop-bar: #ffffff;
  --yy-log-bg: #ecfdf5;
  --yy-log-fg: #134e4a;
  --yy-shine-color: color-mix(in srgb, #fde68a 65%, #2dd4bf 35%);
}

html[data-yy-theme="sand"] {
  --yy-page-bg: #f4f5f8;
  --yy-page-glow: none;
  --yy-surface: rgba(255,255,255,.88);
  --yy-surface-solid: #ffffff;
  --yy-border: rgba(254,243,199,.95);
  --yy-border-input: #fde68a;
  --yy-text: #292524;
  --yy-text-muted: #78716c;
  --yy-accent: #d97706;
  --yy-accent-2: #f59e0b;
  --yy-accent-grad: linear-gradient(135deg, #d97706, #fbbf24);
  --yy-sidebar: rgba(255,255,255,.92);
  --yy-sidebar-text: #78716c;
  --yy-sidebar-active: linear-gradient(90deg, rgba(217,119,6,.08), rgba(251,191,36,.06));
  --yy-header: rgba(255,255,255,.92);
  --yy-shadow: 0 8px 28px rgba(217,119,6,.08);
  --yy-input-bg: #fffbeb;
  --yy-btn-text: #ffffff;
  --yy-code-bg: rgba(217,119,6,.1);
  --yy-code-text: #d97706;
  --yy-desktop-form: #fffbeb;
  --yy-desktop-panel: #ffffff;
  --yy-desktop-bar: #ffffff;
  --yy-log-bg: #fef3c7;
  --yy-log-fg: #44403c;
  --yy-radius-card: 14px;
  --yy-radius-btn: 10px;
  --yy-shine-color: rgba(253, 230, 138, 0.88);
}

/* E · B2 紫韵卡片（参考 B2/techape 风：紫韵渐变 + 大圆角卡片 + 轻玻璃） */
html[data-yy-theme="b2"] {
  --yy-page-bg: #f4f5f8;
  --yy-page-glow: none;
  --yy-surface: rgba(255,255,255,.48);
  --yy-surface-solid: rgba(255,255,255,.94);
  --yy-border: rgba(255,255,255,.62);
  --yy-border-input: rgba(221,214,254,.9);
  --yy-text: #1e1b4b;
  --yy-text-muted: #6b7280;
  --yy-accent: #7c3aed;
  --yy-accent-2: #a78bfa;
  --yy-accent-grad: linear-gradient(135deg, #7c3aed 0%, #a78bfa 50%, #c4b5fd 100%);
  --yy-sidebar: rgba(255,255,255,.55);
  --yy-sidebar-text: #6b7280;
  --yy-sidebar-active: linear-gradient(90deg, rgba(124,58,237,.18), rgba(167,139,250,.1));
  --yy-header: rgba(255,255,255,.58);
  --yy-shadow: 0 16px 48px rgba(124,58,237,.12);
  --yy-input-bg: rgba(255,255,255,.72);
  --yy-btn-text: #ffffff;
  --yy-code-bg: rgba(124,58,237,.12);
  --yy-code-text: #7c3aed;
  --yy-desktop-form: #f5f3ff;
  --yy-desktop-panel: rgba(255,255,255,.88);
  --yy-desktop-bar: rgba(255,255,255,.75);
  --yy-log-bg: rgba(245,243,255,.85);
  --yy-log-fg: #3730a3;
  --yy-radius-card: 18px;
  --yy-radius-btn: 12px;
  --yy-shine-color: color-mix(in srgb, #fde68a 58%, #c4b5fd 42%);
}

/* 主题切换器 */
.yy-theme-picker {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid var(--yy-border-input);
}
.yy-theme-picker-label {
  font-size: 12px;
  color: var(--yy-text-muted);
  width: 100%;
  margin-bottom: 2px;
}
.yy-theme-btn {
  flex: 1;
  min-width: 72px;
  padding: 7px 8px;
  border: 2px solid transparent;
  border-radius: 10px;
  background: var(--yy-input-bg);
  color: var(--yy-text-muted);
  font-size: 11px;
  font-weight: 600;
  cursor: pointer;
  transition: all .2s;
  font-family: inherit;
}
.yy-theme-btn:hover { transform: translateY(-1px); box-shadow: var(--yy-shadow); }
.yy-theme-btn.active {
  border-color: var(--yy-accent);
  color: var(--yy-text);
  background: var(--yy-surface-solid);
}
.yy-theme-btn[data-theme="aurora"].active { border-color: #6366f1; }
.yy-theme-btn[data-theme="frost"].active { border-color: #0ea5e9; }
.yy-theme-btn[data-theme="mint"].active { border-color: #0d9488; }
.yy-theme-btn[data-theme="sand"].active { border-color: #d97706; }
.yy-theme-btn[data-theme="b2"].active { border-color: #7c3aed; }

.yy-theme-nav .layui-nav-child { min-width: 140px; }
.yy-theme-nav .layui-nav-child dd a { font-size: 13px; }
.yy-theme-nav .layui-nav-child dd a.yy-theme-active { color: var(--yy-accent) !important; font-weight: 600; }