/**
 * 后台全局主题：变量挂在 .webbank-shell[data-wb-admin-theme]
 * 与产品库、侧栏、顶栏共用；持久化键 localStorage「wb-pl-theme」
 * 可选：default | mint | lavender | ocean | peach | dark
 */
.webbank-shell {
	--pl-surface: #ffffff;
	--pl-border: #e5e5ea;
	--pl-text: #1c1c1e;
	--pl-muted: rgb(142, 142, 147);
	--pl-accent: #007aff;
	--pl-accent-hover: #0066d6;
	--pl-accent-soft: rgba(0, 122, 255, 0.18);
	--pl-success: #34c759;
	--pl-danger: #ff3b30;
	--pl-radius: 12px;
	--pl-radius-sm: 10px;
	--pl-shadow: 0 1px 3px rgba(0, 0, 0, 0.06), 0 4px 12px rgba(0, 0, 0, 0.04);
	--pl-bg: #f5f5f7;
	--pl-thead-bg: #fafafa;
	--pl-row-hover: #fafafa;
	--pl-row-muted-bg: #f9f9fb;
	--pl-row-muted-hover: #f2f2f7;
	--pl-td-border: #f2f2f7;
	--pl-section-bg: #ececf0;
	--pl-section-text: #48484a;
	--pl-empty-bg: #fafafa;
	--pl-pager-bg: #fafafa;
	--pl-ghost-hover: #f2f2f7;
	--pl-btn-muted-active-bg: #ececf0;
	--pl-btn-muted-active-border: #c7c7cc;
	--pl-link-underline: rgba(0, 122, 255, 0.35);
	--pl-badge-on-bg: #e8f5e9;
	--pl-badge-on-fg: #1b5e20;
	--pl-badge-off-bg: #f2f2f7;
	--pl-badge-off-fg: #636366;
	--pl-msg-ok-bg: #e8f5e9;
	--pl-msg-ok-fg: #1b5e20;
	--pl-msg-err-bg: #ffebee;
	--pl-msg-err-fg: #c62828;
	--pl-modal-backdrop: rgba(0, 0, 0, 0.45);
	--pl-modal-header-bg: linear-gradient(135deg, #f0fdf4 0%, #f8fafc 55%, #fff 100%);
	--pl-modal-header-border: #e8f5e9;
	--pl-modal-title: #0f172a;
	--pl-modal-sub-strong: #36b368;
	--pl-modal-input-focus: #36b368;
	--pl-modal-input-ring: rgba(54, 179, 104, 0.2);
	--pl-modal-primary-bg: linear-gradient(180deg, #3ecf7a 0%, #36b368 100%);
	--pl-modal-primary-shadow: rgba(54, 179, 104, 0.35);
	--pl-logo-btn-bg: linear-gradient(180deg, #42a5ff 0%, #007aff 100%);
	--pl-logo-btn-shadow: rgba(0, 122, 255, 0.32);
	/* 侧栏 / 顶栏 */
	--wb-aside-bg: #1c1c1e;
	/* 侧栏文字统一纯白（各主题仅改背景，不改字色） */
	--wb-aside-text: #ffffff;
	--wb-nav-item-color: #ffffff;
	--wb-brand-border: rgba(255, 255, 255, 0.12);
	--wb-nav-hover-bg: rgba(255, 255, 255, 0.08);
	/* 与主色一致，切换主题时当前项自动同步 */
	--wb-nav-active-bg: var(--pl-accent);
	--wb-nav-logout-color: #ffffff;
	--wb-nav-logout-hover-bg: rgba(255, 80, 80, 0.25);
	--wb-topbar-bg: var(--pl-surface);
	--wb-topbar-border: var(--pl-border);
	/* 顶栏工具区（对齐 Laravel-admin / Element 式浅色导航条） */
	--wb-topbar-height: 48px;
	--wb-topbar-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
	--wb-topbar-divider: #ebeef5;
	--wb-topbar-toolbar-muted: #909399;
	--wb-topbar-toolbar-hover-bg: #f5f7fa;
	--wb-user-chip-bg: #fafafa;
	--wb-user-chip-border: #ebeef5;
	--wb-user-caret-color: #c0c4cc;
	--wb-menu-btn-border: #dcdfe6;
	--wb-title-color: var(--pl-text);
	/* 面包屑 + 多页签（shell 二级栏） */
	--wb-subbar-bg: #f5f7fa;
	--wb-subbar-border: #e4e7ed;
	--wb-crumb-muted: #909399;
	--wb-crumb-root: #606266;
	--wb-tab-bg: #ffffff;
	--wb-tab-border: #dcdfe6;
	--wb-tab-active-bg: rgba(64, 158, 255, 0.12);
	--wb-ac-th-divider: #ececec;
	transition: background 0.35s ease;
}

/* 简约蓝：侧栏与主色同一色系（不再死灰） */
.webbank-shell[data-wb-admin-theme="default"] {
	--wb-aside-bg: linear-gradient(165deg, #162a4a 0%, #0f1f35 48%, #0c1829 100%);
	--wb-nav-hover-bg: rgba(0, 122, 255, 0.2);
	--wb-brand-border: rgba(96, 165, 250, 0.22);
	--wb-nav-logout-hover-bg: rgba(255, 80, 80, 0.22);
	--wb-topbar-divider: rgba(96, 165, 250, 0.18);
	--wb-user-chip-bg: rgba(240, 247, 255, 0.65);
	--wb-user-chip-border: rgba(96, 165, 250, 0.22);
}

@media (prefers-reduced-motion: reduce) {
	.webbank-shell {
		transition: none;
	}
}

.webbank-shell__body {
	color: var(--pl-text);
}

/* 顶栏主题：调色板图标 + 点击展开的菜单（无外露文字下拉框） */
.webbank-shell__theme {
	position: relative;
	flex-shrink: 0;
	margin: 0;
	z-index: 60;
}

.webbank-shell__theme-ico {
	display: block;
	flex-shrink: 0;
	color: inherit;
}

.webbank-shell__theme-panel {
	position: absolute;
	right: 0;
	top: calc(100% + 6px);
	min-width: 9.5rem;
	padding: 4px 0;
	margin: 0;
	background: var(--pl-surface, #fff);
	border: 1px solid var(--pl-border, #ebeef5);
	border-radius: 4px;
	box-shadow: var(--pl-shadow, 0 4px 16px rgba(0, 0, 0, 0.12));
	box-sizing: border-box;
	z-index: 220;
}

.webbank-shell__theme-panel[hidden] {
	display: none !important;
}

.webbank-shell__theme-option {
	display: flex;
	align-items: center;
	width: 100%;
	margin: 0;
	padding: 8px 14px;
	border: none;
	background: transparent;
	font-family: inherit;
	font-size: 13px;
	font-weight: 400;
	line-height: 1.35;
	color: var(--pl-text, #303133);
	text-align: left;
	cursor: pointer;
	-webkit-tap-highlight-color: transparent;
	transition: background 0.12s ease, color 0.12s ease;
	box-sizing: border-box;
}

.webbank-shell__theme-option:hover {
	background: var(--wb-topbar-toolbar-hover-bg, #f5f7fa);
	color: var(--pl-accent);
}

.webbank-shell__theme-option.is-active {
	font-weight: 600;
	color: var(--pl-accent);
	background: var(--pl-accent-soft, rgba(0, 122, 255, 0.08));
}

.webbank-shell__theme-option:focus-visible {
	outline: 2px solid var(--pl-accent);
	outline-offset: -2px;
}

@media (max-width: 899px) {
	.webbank-shell__theme-panel {
		right: auto;
		left: 50%;
		transform: translateX(-50%);
		min-width: 10rem;
	}
}

/* —— 薄荷青 —— */
.webbank-shell[data-wb-admin-theme="mint"] {
	--pl-bg: #ecfdf8;
	--pl-border: #ccfbf1;
	--pl-muted: #5eead4;
	--pl-accent: #0d9488;
	--pl-accent-hover: #0f766e;
	--pl-accent-soft: rgba(13, 148, 136, 0.22);
	--pl-success: #10b981;
	--pl-thead-bg: #f0fdfa;
	--pl-row-hover: #f0fdfa;
	--pl-row-muted-bg: #f8fffc;
	--pl-row-muted-hover: #ecfdf5;
	--pl-td-border: #e6fffa;
	--pl-section-bg: #ccfbf1;
	--pl-section-text: #115e59;
	--pl-empty-bg: #f0fdfa;
	--pl-pager-bg: #f0fdfa;
	--pl-ghost-hover: #ccfbf1;
	--pl-btn-muted-active-bg: #99f6e4;
	--pl-btn-muted-active-border: #5eead4;
	--pl-link-underline: rgba(13, 148, 136, 0.4);
	--pl-badge-on-bg: #d1fae5;
	--pl-badge-on-fg: #065f46;
	--pl-msg-ok-bg: #d1fae5;
	--pl-msg-ok-fg: #065f46;
	--pl-modal-header-bg: linear-gradient(135deg, #ecfdf5 0%, #f0fdfa 50%, #fff 100%);
	--pl-modal-header-border: #a7f3d0;
	--pl-modal-sub-strong: #0d9488;
	--pl-modal-input-focus: #0d9488;
	--pl-modal-input-ring: rgba(13, 148, 136, 0.25);
	--pl-modal-primary-bg: linear-gradient(180deg, #2dd4bf 0%, #0d9488 100%);
	--pl-modal-primary-shadow: rgba(13, 148, 136, 0.4);
	--pl-logo-btn-bg: linear-gradient(180deg, #2dd4bf 0%, #0d9488 100%);
	--pl-logo-btn-shadow: rgba(13, 148, 136, 0.35);
	--wb-aside-bg: #134e4a;
	--wb-nav-hover-bg: rgba(255, 255, 255, 0.12);
	--wb-brand-border: rgba(167, 243, 208, 0.2);
	--wb-topbar-divider: rgba(13, 148, 136, 0.14);
	--wb-user-chip-bg: #ecfdf8;
	--wb-user-chip-border: #ccfbf1;
}

/* —— 薰衣草 —— */
.webbank-shell[data-wb-admin-theme="lavender"] {
	--pl-bg: #f8f7ff;
	--pl-border: #e9e4ff;
	--pl-muted: #7c6f9e;
	--pl-accent: #7c3aed;
	--pl-accent-hover: #6d28d9;
	--pl-accent-soft: rgba(124, 58, 237, 0.2);
	--pl-success: #059669;
	--pl-thead-bg: #faf5ff;
	--pl-row-hover: #faf5ff;
	--pl-row-muted-bg: #f5f3ff;
	--pl-row-muted-hover: #ede9fe;
	--pl-td-border: #ede9fe;
	--pl-section-bg: #e9e4ff;
	--pl-section-text: #5b21b6;
	--pl-empty-bg: #faf5ff;
	--pl-pager-bg: #faf5ff;
	--pl-ghost-hover: #ede9fe;
	--pl-btn-muted-active-bg: #ddd6fe;
	--pl-btn-muted-active-border: #c4b5fd;
	--pl-link-underline: rgba(124, 58, 237, 0.4);
	--pl-badge-on-bg: #ede9fe;
	--pl-badge-on-fg: #5b21b6;
	--pl-msg-ok-bg: #ede9fe;
	--pl-msg-ok-fg: #5b21b6;
	--pl-modal-header-bg: linear-gradient(135deg, #faf5ff 0%, #f5f3ff 50%, #fff 100%);
	--pl-modal-header-border: #e9d5ff;
	--pl-modal-sub-strong: #7c3aed;
	--pl-modal-input-focus: #7c3aed;
	--pl-modal-input-ring: rgba(124, 58, 237, 0.22);
	--pl-modal-primary-bg: linear-gradient(180deg, #a78bfa 0%, #7c3aed 100%);
	--pl-modal-primary-shadow: rgba(124, 58, 237, 0.38);
	--pl-logo-btn-bg: linear-gradient(180deg, #c4b5fd 0%, #7c3aed 100%);
	--pl-logo-btn-shadow: rgba(124, 58, 237, 0.35);
	--wb-aside-bg: #4c1d95;
	--wb-nav-hover-bg: rgba(255, 255, 255, 0.12);
	--wb-brand-border: rgba(196, 181, 253, 0.28);
	--wb-topbar-divider: rgba(124, 58, 237, 0.12);
	--wb-user-chip-bg: #faf5ff;
	--wb-user-chip-border: #ede9fe;
}

/* —— 海洋蓝 —— */
.webbank-shell[data-wb-admin-theme="ocean"] {
	--pl-bg: #f0f9ff;
	--pl-border: #bae6fd;
	--pl-muted: #38bdf8;
	--pl-accent: #0284c7;
	--pl-accent-hover: #0369a1;
	--pl-accent-soft: rgba(2, 132, 199, 0.2);
	--pl-success: #0ea5e9;
	--pl-thead-bg: #e0f2fe;
	--pl-row-hover: #e0f2fe;
	--pl-row-muted-bg: #f0f9ff;
	--pl-row-muted-hover: #e0f2fe;
	--pl-td-border: #dbeafe;
	--pl-section-bg: #bae6fd;
	--pl-section-text: #075985;
	--pl-empty-bg: #f0f9ff;
	--pl-pager-bg: #e0f2fe;
	--pl-ghost-hover: #dbeafe;
	--pl-btn-muted-active-bg: #7dd3fc;
	--pl-btn-muted-active-border: #38bdf8;
	--pl-link-underline: rgba(2, 132, 199, 0.4);
	--pl-badge-on-bg: #dbeafe;
	--pl-badge-on-fg: #1e40af;
	--pl-msg-ok-bg: #dbeafe;
	--pl-msg-ok-fg: #1e3a8a;
	--pl-modal-header-bg: linear-gradient(135deg, #e0f2fe 0%, #f0f9ff 55%, #fff 100%);
	--pl-modal-header-border: #bae6fd;
	--pl-modal-sub-strong: #0284c7;
	--pl-modal-input-focus: #0284c7;
	--pl-modal-input-ring: rgba(2, 132, 199, 0.22);
	--pl-modal-primary-bg: linear-gradient(180deg, #38bdf8 0%, #0284c7 100%);
	--pl-modal-primary-shadow: rgba(2, 132, 199, 0.38);
	--pl-logo-btn-bg: linear-gradient(180deg, #7dd3fc 0%, #0284c7 100%);
	--pl-logo-btn-shadow: rgba(2, 132, 199, 0.35);
	--wb-aside-bg: #0c4a6e;
	--wb-nav-hover-bg: rgba(255, 255, 255, 0.12);
	--wb-brand-border: rgba(125, 211, 252, 0.25);
	--wb-topbar-divider: rgba(2, 132, 199, 0.14);
	--wb-user-chip-bg: #f0f9ff;
	--wb-user-chip-border: #dbeafe;
}

/* —— 蜜桃暖 —— */
.webbank-shell[data-wb-admin-theme="peach"] {
	--pl-bg: #fff8f5;
	--pl-border: #fed7aa;
	--pl-muted: #fb923c;
	--pl-accent: #ea580c;
	--pl-accent-hover: #c2410c;
	--pl-accent-soft: rgba(234, 88, 12, 0.18);
	--pl-success: #f97316;
	--pl-thead-bg: #fff7ed;
	--pl-row-hover: #fff7ed;
	--pl-row-muted-bg: #fffbeb;
	--pl-row-muted-hover: #ffedd5;
	--pl-td-border: #ffedd5;
	--pl-section-bg: #ffedd5;
	--pl-section-text: #9a3412;
	--pl-empty-bg: #fff7ed;
	--pl-pager-bg: #fff7ed;
	--pl-ghost-hover: #ffedd5;
	--pl-btn-muted-active-bg: #fdba74;
	--pl-btn-muted-active-border: #fb923c;
	--pl-link-underline: rgba(234, 88, 12, 0.42);
	--pl-badge-on-bg: #ffedd5;
	--pl-badge-on-fg: #9a3412;
	--pl-msg-ok-bg: #ffedd5;
	--pl-msg-ok-fg: #9a3412;
	--pl-modal-header-bg: linear-gradient(135deg, #fff7ed 0%, #fff1f2 50%, #fff 100%);
	--pl-modal-header-border: #fed7aa;
	--pl-modal-sub-strong: #ea580c;
	--pl-modal-input-focus: #ea580c;
	--pl-modal-input-ring: rgba(234, 88, 12, 0.22);
	--pl-modal-primary-bg: linear-gradient(180deg, #fb923c 0%, #ea580c 100%);
	--pl-modal-primary-shadow: rgba(234, 88, 12, 0.38);
	--pl-logo-btn-bg: linear-gradient(180deg, #fdba74 0%, #ea580c 100%);
	--pl-logo-btn-shadow: rgba(234, 88, 12, 0.35);
	--wb-aside-bg: #7c2d12;
	--wb-nav-hover-bg: rgba(255, 255, 255, 0.12);
	--wb-brand-border: rgba(253, 186, 116, 0.28);
	--wb-topbar-divider: rgba(234, 88, 12, 0.14);
	--wb-user-chip-bg: #fff7ed;
	--wb-user-chip-border: #ffedd5;
}

/* —— 暗黑 —— */
.webbank-shell[data-wb-admin-theme="dark"] {
	--pl-surface: #1c2128;
	--pl-border: #30363d;
	--pl-text: #e6edf3;
	--pl-muted: #8b949e;
	--pl-accent: #58a6ff;
	--pl-accent-hover: #79c0ff;
	--pl-accent-soft: rgba(88, 166, 255, 0.18);
	--pl-success: #3fb950;
	--pl-danger: #f85149;
	--pl-shadow: 0 1px 3px rgba(0, 0, 0, 0.35), 0 8px 24px rgba(0, 0, 0, 0.28);
	--pl-bg: #0d1117;
	--pl-thead-bg: #161b22;
	--pl-row-hover: #21262d;
	--pl-row-muted-bg: #161b22;
	--pl-row-muted-hover: #21262d;
	--pl-td-border: #30363d;
	--pl-section-bg: #21262d;
	--pl-section-text: #c9d1d9;
	--pl-empty-bg: #161b22;
	--pl-pager-bg: #161b22;
	--pl-ghost-hover: #21262d;
	--pl-btn-muted-active-bg: #30363d;
	--pl-btn-muted-active-border: #484f58;
	--pl-link-underline: rgba(88, 166, 255, 0.45);
	--pl-badge-on-bg: rgba(63, 185, 80, 0.18);
	--pl-badge-on-fg: #7ee787;
	--pl-badge-off-bg: #21262d;
	--pl-badge-off-fg: #8b949e;
	--pl-msg-ok-bg: rgba(63, 185, 80, 0.15);
	--pl-msg-ok-fg: #7ee787;
	--pl-msg-err-bg: rgba(248, 81, 73, 0.15);
	--pl-msg-err-fg: #ff7b72;
	--pl-modal-backdrop: rgba(1, 4, 9, 0.72);
	--pl-modal-header-bg: linear-gradient(135deg, #1a2e1f 0%, #161b22 55%, #1c2128 100%);
	--pl-modal-header-border: #30363d;
	--pl-modal-title: #e6edf3;
	--pl-modal-sub-strong: #3fb950;
	--pl-modal-input-focus: #3fb950;
	--pl-modal-input-ring: rgba(63, 185, 80, 0.28);
	--pl-modal-primary-bg: linear-gradient(180deg, #46c263 0%, #2ea043 100%);
	--pl-modal-primary-shadow: rgba(46, 160, 67, 0.35);
	--pl-logo-btn-bg: linear-gradient(180deg, #79c0ff 0%, #388bfd 100%);
	--pl-logo-btn-shadow: rgba(56, 139, 253, 0.35);
	--wb-aside-bg: linear-gradient(190deg, #161b22 0%, #0d1117 48%, #010409 100%);
	--wb-nav-hover-bg: rgba(88, 166, 255, 0.14);
	--wb-brand-border: rgba(255, 255, 255, 0.08);
	--wb-nav-logout-hover-bg: rgba(248, 81, 73, 0.22);
	--wb-topbar-bg: #161b22;
	--wb-topbar-border: #30363d;
	--wb-topbar-shadow: 0 1px 0 rgba(255, 255, 255, 0.04), 0 4px 12px rgba(0, 0, 0, 0.35);
	--wb-topbar-divider: #30363d;
	--wb-topbar-toolbar-muted: #8b949e;
	--wb-topbar-toolbar-hover-bg: #21262d;
	--wb-user-chip-bg: #21262d;
	--wb-user-chip-border: #30363d;
	--wb-user-caret-color: #6e7681;
	--wb-menu-btn-border: #484f58;
	--wb-title-color: #e6edf3;
	--wb-subbar-bg: #161b22;
	--wb-subbar-border: #30363d;
	--wb-crumb-muted: #8b949e;
	--wb-crumb-root: #c9d1d9;
	--wb-tab-bg: #21262d;
	--wb-tab-border: #30363d;
	--wb-tab-active-bg: rgba(88, 166, 255, 0.16);
	--wb-ac-th-divider: #30363d;
	color-scheme: dark;
}

.webbank-shell[data-wb-admin-theme="dark"] .webbank-shell__tab-chip.is-active {
	background: var(--wb-tab-active-bg);
	box-shadow: 0 1px 3px rgba(88, 166, 255, 0.28);
}

.webbank-shell[data-wb-admin-theme="dark"] .webbank-shell__tab-x:hover {
	background: rgba(255, 255, 255, 0.08);
}

/* 暗黑 · 产品资讯 Quill snow 工具栏/编辑区 */
.webbank-shell[data-wb-admin-theme="dark"] .wb-cms-la-panel .wb-cms-la-quill-wrap .ql-toolbar.ql-snow,
.webbank-shell[data-wb-admin-theme="dark"] .wb-cms-la-panel .wb-cms-la-quill-wrap .ql-container.ql-snow {
	border-color: var(--pl-border);
	background: var(--pl-surface);
	color: var(--pl-text);
}

.webbank-shell[data-wb-admin-theme="dark"] .wb-cms-la-panel .wb-cms-la-quill-wrap .ql-snow .ql-stroke {
	stroke: #8b949e;
}

.webbank-shell[data-wb-admin-theme="dark"] .wb-cms-la-panel .wb-cms-la-quill-wrap .ql-snow .ql-fill,
.webbank-shell[data-wb-admin-theme="dark"] .wb-cms-la-panel .wb-cms-la-quill-wrap .ql-snow .ql-stroke.ql-fill {
	fill: #8b949e;
}

.webbank-shell[data-wb-admin-theme="dark"] .wb-cms-la-panel .wb-cms-la-quill-wrap .ql-snow .ql-picker {
	color: #c9d1d9;
}

.webbank-shell[data-wb-admin-theme="dark"] .wb-cms-la-panel .wb-cms-la-quill-wrap .ql-snow .ql-picker-options {
	background: var(--pl-surface);
	border-color: var(--pl-border);
}

.webbank-shell[data-wb-admin-theme="dark"] .wb-cms-la-panel .wb-cms-la-quill-wrap .ql-editor {
	color: var(--pl-text);
}

.webbank-shell[data-wb-admin-theme="dark"] .wb-cms-la-panel .wb-cms-la-quill-wrap .ql-editor h1,
.webbank-shell[data-wb-admin-theme="dark"] .wb-cms-la-panel .wb-cms-la-quill-wrap .ql-editor h2,
.webbank-shell[data-wb-admin-theme="dark"] .wb-cms-la-panel .wb-cms-la-quill-wrap .ql-editor h3 {
	color: var(--pl-text);
}

.webbank-shell[data-wb-admin-theme="dark"] .wb-cms-media-alert {
	background: rgba(88, 166, 255, 0.12);
	border-bottom-color: var(--pl-border);
	color: var(--pl-text);
}

.webbank-shell[data-wb-admin-theme="dark"] .wb-cms-media-alert__text strong {
	color: var(--pl-text);
}

.webbank-shell[data-wb-admin-theme="dark"] .wb-cms-media-filter:hover {
	background: var(--pl-row-hover);
	border-color: var(--pl-accent);
}

.webbank-shell[data-wb-admin-theme="dark"] .wb-cms-media-table tbody tr.is-selected {
	background: var(--pl-accent-soft);
}

.webbank-shell[data-wb-admin-theme="dark"] .webbank-shell__aside {
	background: var(--wb-aside-bg);
	box-shadow:
		inset -1px 0 0 var(--wb-brand-border),
		4px 0 24px rgba(0, 0, 0, 0.45);
}

.webbank-shell[data-wb-admin-theme="dark"] .webbank-shell__theme-panel {
	box-shadow: 0 8px 28px rgba(0, 0, 0, 0.45);
}

/* ========== 前台登录页（demo.php?type=login）==========
 * 与后台共用 data-wb-admin-theme 与 localStorage「wb-pl-theme」
 * 包裹节点：#wb-login-root.wb-login-root
 */
.wb-login-root {
	--wb-login-page-bg: linear-gradient(165deg, #e8faf0 0%, #eef6f1 38%, #f4f6f5 100%);
	--wb-login-text: #303133;
	--wb-login-muted: #909399;
	--wb-login-card-bg: #ffffff;
	--wb-login-card-shadow: 0 4px 24px rgba(0, 0, 0, 0.06), 0 0 1px rgba(0, 0, 0, 0.04);
	--wb-login-nav-bg: rgba(255, 255, 255, 0.88);
	--wb-login-nav-border: rgba(0, 0, 0, 0.06);
	--wb-login-nav-title: #303133;
	--wb-login-nav-icon: #303133;
	--wb-login-input-bg: #f5f7fa;
	--wb-login-input-icon: #909399;
	--wb-login-placeholder: #c0c4cc;
	--wb-login-accent: #36b368;
	--wb-login-accent2: #2d9a5c;
	--wb-login-accent-soft: rgba(54, 179, 104, 0.15);
	--wb-login-accent-glow: rgba(54, 179, 104, 0.35);
	--wb-login-link: #36b368;
	--wb-login-hint: #c0c4cc;
	--wb-login-logo-shadow: 0 8px 24px rgba(54, 179, 104, 0.35);
	--wb-login-theme-surface: #ffffff;
	--wb-login-theme-border: #ebeef5;
	--wb-login-theme-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
	--wb-login-theme-hover: #f5f7fa;
	min-height: 100vh;
	background: var(--wb-login-page-bg);
	color: var(--wb-login-text);
	transition: background 0.35s ease, color 0.25s ease;
}

@media (prefers-reduced-motion: reduce) {
	.wb-login-root {
		transition: none;
	}
}

.wb-login-root[data-wb-admin-theme="default"] {
	--wb-login-page-bg: linear-gradient(165deg, #dbeafe 0%, #e0f2fe 42%, #f8fafc 100%);
	--wb-login-accent: #007aff;
	--wb-login-accent2: #0066d6;
	--wb-login-accent-soft: rgba(0, 122, 255, 0.15);
	--wb-login-accent-glow: rgba(0, 122, 255, 0.32);
	--wb-login-link: #007aff;
	--wb-login-logo-shadow: 0 8px 24px rgba(0, 122, 255, 0.28);
	--wb-login-input-icon: #64748b;
}

.wb-login-root[data-wb-admin-theme="mint"] {
	--wb-login-page-bg: linear-gradient(165deg, #ccfbf1 0%, #ecfdf5 45%, #f8fffc 100%);
	--wb-login-accent: #0d9488;
	--wb-login-accent2: #0f766e;
	--wb-login-accent-soft: rgba(13, 148, 136, 0.15);
	--wb-login-accent-glow: rgba(13, 148, 136, 0.32);
	--wb-login-link: #0d9488;
	--wb-login-logo-shadow: 0 8px 24px rgba(13, 148, 136, 0.3);
	--wb-login-muted: #115e59;
}

.wb-login-root[data-wb-admin-theme="lavender"] {
	--wb-login-page-bg: linear-gradient(165deg, #ede9fe 0%, #f5f3ff 40%, #fafafa 100%);
	--wb-login-accent: #7c3aed;
	--wb-login-accent2: #6d28d9;
	--wb-login-accent-soft: rgba(124, 58, 237, 0.15);
	--wb-login-accent-glow: rgba(124, 58, 237, 0.3);
	--wb-login-link: #7c3aed;
	--wb-login-logo-shadow: 0 8px 24px rgba(124, 58, 237, 0.28);
	--wb-login-muted: #6b21a8;
}

.wb-login-root[data-wb-admin-theme="ocean"] {
	--wb-login-page-bg: linear-gradient(165deg, #bae6fd 0%, #e0f2fe 42%, #f8fafc 100%);
	--wb-login-accent: #0284c7;
	--wb-login-accent2: #0369a1;
	--wb-login-accent-soft: rgba(2, 132, 199, 0.15);
	--wb-login-accent-glow: rgba(2, 132, 199, 0.3);
	--wb-login-link: #0284c7;
	--wb-login-logo-shadow: 0 8px 24px rgba(2, 132, 199, 0.28);
	--wb-login-muted: #075985;
}

.wb-login-root[data-wb-admin-theme="peach"] {
	--wb-login-page-bg: linear-gradient(165deg, #ffedd5 0%, #fff7ed 45%, #fffefb 100%);
	--wb-login-accent: #ea580c;
	--wb-login-accent2: #c2410c;
	--wb-login-accent-soft: rgba(234, 88, 12, 0.15);
	--wb-login-accent-glow: rgba(234, 88, 12, 0.28);
	--wb-login-link: #ea580c;
	--wb-login-logo-shadow: 0 8px 24px rgba(234, 88, 12, 0.26);
	--wb-login-muted: #9a3412;
}

.wb-login-root[data-wb-admin-theme="dark"] {
	--wb-login-page-bg: linear-gradient(165deg, #0d1117 0%, #161b22 42%, #010409 100%);
	--wb-login-text: #e6edf3;
	--wb-login-muted: #8b949e;
	--wb-login-card-bg: #1c2128;
	--wb-login-card-shadow: 0 8px 32px rgba(0, 0, 0, 0.45), 0 0 1px rgba(255, 255, 255, 0.06);
	--wb-login-nav-bg: rgba(22, 27, 34, 0.92);
	--wb-login-nav-border: rgba(255, 255, 255, 0.08);
	--wb-login-nav-title: #e6edf3;
	--wb-login-nav-icon: #c9d1d9;
	--wb-login-input-bg: #21262d;
	--wb-login-input-icon: #8b949e;
	--wb-login-placeholder: #6e7681;
	--wb-login-accent: #58a6ff;
	--wb-login-accent2: #388bfd;
	--wb-login-accent-soft: rgba(88, 166, 255, 0.18);
	--wb-login-accent-glow: rgba(88, 166, 255, 0.32);
	--wb-login-link: #58a6ff;
	--wb-login-hint: #6e7681;
	--wb-login-logo-shadow: 0 8px 24px rgba(56, 139, 253, 0.35);
	--wb-login-theme-surface: #1c2128;
	--wb-login-theme-border: #30363d;
	--wb-login-theme-shadow: 0 8px 28px rgba(0, 0, 0, 0.45);
	--wb-login-theme-hover: #21262d;
	color-scheme: dark;
}

/*
 * 前台登录 / 注册「ZR.Admin.Vue3」同款夜空：径向渐变 + 星野层（starBackground.vue 同源逻辑）
 * 仅当根节点带 .wb-login-root--starfield 时启用；主题变量仍控制按钮/强调色。
 */
.wb-login-root.wb-login-root--starfield {
	--wb-login-page-bg: radial-gradient(220% 105% at top center, #1b2947 10%, #4b76a7 40%, #81acae 65%, #f7f7b6);
	--wb-login-hint: rgba(255, 255, 255, 0.72);
	background-attachment: fixed;
	position: relative;
	overflow-x: hidden;
}

@keyframes wb-login-stars-rotate {
	0% {
		transform: perspective(600px) rotateZ(20deg) rotateX(-40deg) rotateY(0deg);
	}
	100% {
		transform: perspective(600px) rotateZ(20deg) rotateX(-40deg) rotateY(-360deg);
	}
}

.wb-login-starfield {
	pointer-events: none;
	position: fixed;
	left: 50%;
	bottom: -200px;
	z-index: 0;
	transform: perspective(500px);
	transform-style: preserve-3d;
	perspective-origin: 50% 100%;
	animation: wb-login-stars-rotate 90s infinite linear;
}

.wb-login-starfield .wb-login-star {
	width: 2px;
	height: 2px;
	background: #f7f7b8;
	position: absolute;
	top: 0;
	left: 0;
	backface-visibility: hidden;
}

@media (prefers-reduced-motion: reduce) {
	.wb-login-starfield {
		animation: none;
	}
}

body.wb-login-page,
body.wb-register-page {
	background: var(--wb-login-page-bg, #f5f7fa);
}

.wb-login-root--starfield .wb-uni-login,
.wb-login-root--starfield .wb-uni-reg {
	position: relative;
	z-index: 1;
}

.wb-login-root.wb-login-root--starfield .wb-uni-login__hero h1 {
	color: rgba(255, 255, 255, 0.96);
	text-shadow: 0 1px 18px rgba(17, 36, 71, 0.55);
}

.wb-login-root.wb-login-root--starfield .wb-uni-login__hero p {
	color: rgba(255, 255, 255, 0.82);
	text-shadow: 0 1px 12px rgba(17, 36, 71, 0.45);
}

.wb-login-root.wb-login-root--starfield .wb-uni-reg__hero h1 {
	color: rgba(255, 255, 255, 0.96);
	text-shadow: 0 1px 18px rgba(17, 36, 71, 0.55);
}

/* 登录页找回密码弹层：蒙层略薄，透出背后星空 */
.wb-login-root.wb-login-root--starfield #wb-forgot-modal .wb-forgot-sheet__backdrop {
	background: rgba(27, 41, 71, 0.38);
	backdrop-filter: saturate(140%) blur(10px);
	-webkit-backdrop-filter: saturate(140%) blur(10px);
}