:root,
html[data-theme="dark"] {
    --bg-body: #151e34;
    --bg-body-alt: #18213a;
    --bg-card: #202a41;
    --bg-card-soft: #28375b;
    --bg-accent: #2f4370;
    --bg-accent-soft: #899fff;
    --bg-white-card: #ffffff;
    --bg-light-gray: #e6e6e6;
    --bg-overlay: #000000;
    --bg-panel: #222f4d;
    --bg-panel-gradient-from: #4051a4;
    --bg-panel-gradient-to: #39589e;
    --bg-tag-muted: #3b4457;
    --bg-btn-muted: #3e4961;
    --bg-btn-muted-border: #5d677f;
    --bg-btn-orange: #ff6a00;
    --bg-shortcut: #7590f0;
    --bg-submit: #44b549;
    --bg-keypad-table: #e1e1e1;
    --bg-chip: #7987a7;
    --bg-input: #151e34;
    --bg-success: #26a07b;
    --bg-current-page: #ffa900;
    --bg-overlay-soft: rgba(0, 0, 0, 0.5);
    --bg-warn-block: #fffde3;
    --bg-modal-close: #dddddd;
    --bg-neutral-btn: #808080;
    --bg-ball: #ff696c;
    --bg-tz:#2b354f;
    --bg-stat: rgba(255,255,255,.04);
    --bg-modern-pc: linear-gradient(135deg, #f8c764, #eead3f);
    --bg-modern-marker: linear-gradient(180deg, #a7baff 0%, #6486ff 100%);
    --bg-agent-chat-btn: linear-gradient(135deg, #3b82f6, #2563eb);
    --bg-agent-chat-btn-hover: linear-gradient(135deg, #2563eb, #1d4ed8);
    --bg-badge: #ef4444;
    --shadow-dark: #000000;
    --shadow-inset: #999999;
    --shadow-modern-pc: rgba(238, 173, 63, .24);
    --shadow-agent-chat: rgba(59, 130, 246, 0.4);
    --shadow-badge: rgba(239, 68, 68, 0.5);
    --shadow-focus: rgba(255, 184, 77, 0.18);
    --text-main: #dedede;
    --text-sub: #9eaccd;
    --text-sub-2: #7987a7;
    --text-muted: #888888;
    --text-muted-2: #999999;
    --text-muted-3: #959595;
    --text-soft: #a1b1d4;
    --text-placeholder: #596684;
    --text-link: #ffffff;
    --text-primary: #89a3ff;
    --text-warn: #ffdda4;
    --text-dark-on-light: #202a41;
    --text-black: #000000;
    --text-gray-dark: #333333;
    --text-gray-1: #5d5d5d;
    --text-gray-2: #777777;
    --text-orange: #ff6600;
    --text-rank-sub: rgba(204, 231, 255, .98);
    --text-deep: #1a233d;
    --text-negative: #f00000;
    --text-positive: #a5ffa4;
    --text-info: #00c6ff;
    --border-color: #616367;
    --border-soft: #3d475d;
    --border-soft-2: #3e485c;
    --border-soft-3: #2d3a56;
    --border-input: #283249;
    --border-panel: #303b52;
    --border-modal: #333333;
    --border-light: #dddddd;
    --border-light-2: #ececec;
    --border-light-3: rgba(255, 255, 255, .1);
    --border-accent: #0060b0;
}

html[data-theme="light"] {
    /* 创意白天模式：阳光明媚、清新自然 */
    --bg-body: linear-gradient(135deg, #fefefe 0%, #f0f9ff 50%, #e0f2fe 100%);
    --bg-body-alt: #f8fafc;
    --bg-card: #ffffff;
    --bg-card-soft: #f1f5f9;
    --bg-accent: #e0f2fe;
    --bg-accent-soft: #0ea5e9;
    --bg-white-card: #ffffff;
    --bg-light-gray: #f8fafc;
    --bg-overlay: rgba(0, 0, 0, 0.1);
    --bg-panel: #ffffff;
    --bg-panel-gradient-from: #38bdf8;
    --bg-panel-gradient-to: #0ea5e9;
    --bg-tag-muted: #f1f5f9;
    --bg-btn-muted: #e2e8f0;
    --bg-btn-muted-border: #cbd5e1;
    --bg-btn-orange: #f59e0b;
    --bg-shortcut: #3b82f6;
    --bg-submit: #10b981;
    --bg-keypad-table: #f8fafc;
    --bg-chip: #dbeafe;
    --bg-input: #ffffff;
    --bg-success: #10b981;
    --bg-current-page: #fbbf24;
    --bg-overlay-soft: rgba(15, 23, 42, 0.05);
    --bg-warn-block: #fef3c7;
    --bg-modal-close: #f1f5f9;
    --bg-neutral-btn: #94a3b8;
    --bg-ball: #f87171;
    --bg-tz: #f1f5f9;
    --bg-stat: rgba(37, 99, 235, .05);
    --bg-modern-pc: linear-gradient(135deg, #3b82f6, #2563eb);
    --bg-modern-marker: linear-gradient(180deg, #60a5fa 0%, #2563eb 100%);
    --bg-agent-chat-btn: linear-gradient(135deg, #3b82f6, #2563eb);
    --bg-agent-chat-btn-hover: linear-gradient(135deg, #2563eb, #1d4ed8);
    --bg-badge: #ef4444;
    --shadow-dark: rgba(0, 0, 0, 0.1);
    --shadow-inset: rgba(0, 0, 0, 0.05);
    --shadow-modern-pc: rgba(59, 130, 246, .24);
    --shadow-agent-chat: rgba(59, 130, 246, 0.3);
    --shadow-badge: rgba(239, 68, 68, 0.4);
    --shadow-focus: rgba(59, 130, 246, 0.18);
    --text-main: #1e293b;
    --text-sub: #64748b;
    --text-sub-2: #94a3b8;
    --text-muted: #9ca3af;
    --text-muted-2: #d1d5db;
    --text-muted-3: #9ca3af;
    --text-soft: #6b7280;
    --text-placeholder: #9ca3af;
    --text-link: #3b82f6;
    --text-primary: #2563eb;
    --text-warn: #d97706;
    --text-dark-on-light: #1e293b;
    --text-black: #111827;
    --text-gray-dark: #374151;
    --text-gray-1: #4b5563;
    --text-gray-2: #6b7280;
    --text-orange: #ea580c;
    --text-rank-sub: rgba(59, 130, 246, 0.9);
    --text-deep: #0f172a;
    --text-negative: #dc2626;
    --text-positive: #059669;
    --text-info: #0891b2;
    --border-color: #e5e7eb;
    --border-soft: #f3f4f6;
    --border-soft-2: #f9fafb;
    --border-soft-3: #f3f4f6;
    --border-input: #d1d5db;
    --border-panel: #e5e7eb;
    --border-modal: #d1d5db;
    --border-light: #f3f4f6;
    --border-light-2: #f9fafb;
    --border-light-3: rgba(156, 163, 175, 0.2);
    --border-accent: #3b82f6;
}

html[data-theme="red"] {
    --bg-body: #2b1116;
    --bg-body-alt: #35151b;
    --bg-card: #4a1d24;
    --bg-card-soft: #5c2630;
    --bg-accent: #843646;
    --bg-accent-soft: #ff8da1;
    --text-main: #f6dfe4;
    --text-sub: #d6a8b2;
    --text-placeholder: #a97480;
    --text-link: #ffffff;
    --text-primary: #ff9fb0;
    --text-warn: #ffd38a;
    --border-color: #7a4853;
}

html[data-theme="blue"] {
    /* 支付宝风格：白色底 + 品牌蓝点缀，清爽专业 */
    --bg-body: #f5f6fa;
    --bg-body-alt: #edf0f7;
    --bg-card: #ffffff;
    --bg-card-soft: #f0f4ff;
    --bg-accent: #e8eeff;
    --bg-accent-soft: #1677ff;
    --bg-white-card: #ffffff;
    --bg-light-gray: #f5f6fa;
    --bg-overlay: rgba(0, 0, 0, 0.08);
    --bg-panel: #ffffff;
    --bg-panel-gradient-from: #1677ff;
    --bg-panel-gradient-to: #0958d9;
    --bg-tag-muted: #f0f4ff;
    --bg-btn-muted: #e8eeff;
    --bg-btn-muted-border: #b4ccff;
    --bg-btn-orange: #ff8c1a;
    --bg-shortcut: #1677ff;
    --bg-submit: #1677ff;
    --bg-keypad-table: #f5f6fa;
    --bg-chip: #d6e4ff;
    --bg-input: #ffffff;
    --bg-success: #00b578;
    --bg-current-page: #1677ff;
    --bg-overlay-soft: rgba(22, 119, 255, 0.06);
    --bg-warn-block: #fff7e6;
    --bg-modal-close: #f0f4ff;
    --bg-neutral-btn: #8c8c8c;
    --bg-ball: #ff4d4f;
    --bg-tz: #f0f4ff;
    --bg-stat: rgba(22, 119, 255, .06);
    --bg-modern-pc: linear-gradient(135deg, #1677ff, #0958d9);
    --bg-modern-marker: linear-gradient(180deg, #69b1ff 0%, #1677ff 100%);
    --bg-agent-chat-btn: linear-gradient(135deg, #1677ff, #0958d9);
    --bg-agent-chat-btn-hover: linear-gradient(135deg, #0958d9, #003eb3);
    --bg-badge: #ff4d4f;
    --shadow-dark: rgba(0, 0, 0, 0.06);
    --shadow-inset: rgba(0, 0, 0, 0.04);
    --shadow-modern-pc: rgba(22, 119, 255, .2);
    --shadow-agent-chat: rgba(22, 119, 255, 0.3);
    --shadow-badge: rgba(255, 77, 79, 0.4);
    --shadow-focus: rgba(22, 119, 255, 0.2);
    --text-main: #1d2129;
    --text-sub: #4e5969;
    --text-sub-2: #86909c;
    --text-muted: #a3a3a3;
    --text-muted-2: #c9cdd4;
    --text-muted-3: #a3a3a3;
    --text-soft: #6b7785;
    --text-placeholder: #c0c4cc;
    --text-link: #1677ff;
    --text-primary: #1677ff;
    --text-warn: #ff8c1a;
    --text-dark-on-light: #1d2129;
    --text-black: #1d2129;
    --text-gray-dark: #373c43;
    --text-gray-1: #4e5969;
    --text-gray-2: #6b7785;
    --text-orange: #e86427;
    --text-rank-sub: rgba(22, 119, 255, 0.85);
    --text-deep: #0d1a2d;
    --text-negative: #f53f3f;
    --text-positive: #00b578;
    --text-info: #1677ff;
    --border-color: #e5e6eb;
    --border-soft: #f0f1f5;
    --border-soft-2: #f7f8fa;
    --border-soft-3: #f0f1f5;
    --border-input: #d9d9d9;
    --border-panel: #e5e6eb;
    --border-modal: #d9d9d9;
    --border-light: #f0f1f5;
    --border-light-2: #f7f8fa;
    --border-light-3: rgba(22, 119, 255, .08);
    --border-accent: #1677ff;
}

html[data-theme="green"] {
    --bg-body: #10261f;
    --bg-body-alt: #143127;
    --bg-card: #1c4135;
    --bg-card-soft: #255444;
    --bg-accent: #2d7157;
    --bg-accent-soft: #73d8b0;
    --text-main: #ddf6eb;
    --text-sub: #9fcdb9;
    --text-placeholder: #6b9d88;
    --text-link: #ffffff;
    --text-primary: #7ce0b8;
    --text-warn: #ffe08d;
    --border-color: #467564;
}

html[data-theme="purple"] {
    --bg-body: #1d1633;
    --bg-body-alt: #251c43;
    --bg-card: #312558;
    --bg-card-soft: #3d2f6c;
    --bg-accent: #59429a;
    --bg-accent-soft: #b59aff;
    --text-main: #ece5ff;
    --text-sub: #b7addd;
    --text-placeholder: #8a7fb2;
    --text-link: #ffffff;
    --text-primary: #baa2ff;
    --text-warn: #ffd98d;
    --border-color: #63538e;
}

body {
    color: var(--text-main);
    background-color: var(--bg-body);
}

#wbody {
    background-color: var(--bg-body);
}

body a {
    color: var(--text-link);
}

/*背景颜色*/
.bc {
    background: var(--bg-card);
}

.inbc {
    background-color: var(--bg-card);
}

.bca {
    background-color: var(--bg-accent);
}

.bcc {
    background-color: var(--bg-accent-soft);
}
/*字体颜色*/
.colorb {
    color: var(--text-primary);
}
/*字体颜色*/
.colory {
    color: var(--text-warn);
}

.bb {
    border-bottom: 0.1em dotted var(--border-color);
}

#navMenu .bc {
    background-color: var(--bg-accent);
}

#navMenu li:hover {
    background-color: var(--bg-accent);
}

::-webkit-input-placeholder {
    color: var(--text-placeholder);
}

:-moz-placeholder {
    color: var(--text-placeholder);
}

::-moz-placeholder {
    color: var(--text-placeholder);
}

/* ============================================================
   蓝色主题（支付宝风格）额外覆写
   白色背景下的链接/按钮/卡片需要深色文本
   ============================================================ */
html[data-theme="blue"] body a {
    color: var(--text-primary);
}

html[data-theme="blue"] .topIcon {
    background: linear-gradient(135deg, #1677ff, #0958d9);
    color: #fff;
}

html[data-theme="blue"] .topIcon a,
html[data-theme="blue"] .topIcon .cenIcon {
    color: #fff;
}

html[data-theme="blue"] #footer {
    background: #ffffff;
    border-top: 1px solid #e5e6eb;
    box-shadow: 0 -2px 12px rgba(0, 0, 0, .04);
}

html[data-theme="blue"] #footer a {
    color: #86909c;
}

html[data-theme="blue"] #footer .active a,
html[data-theme="blue"] #footer a:hover {
    color: #1677ff;
}

html[data-theme="blue"] .hddiv {
    background: #ffffff;
    box-shadow: 0 2px 12px rgba(22, 119, 255, .06);
}

html[data-theme="blue"] .hddiv .icontxt {
    color: #4e5969;
}

html[data-theme="blue"] .hddiv .iconwp {
    background: linear-gradient(135deg, #e8eeff, #d6e4ff);
}

html[data-theme="blue"] .hddiv .fonticon {
    color: #1677ff;
}

html[data-theme="blue"] .indexnew {
    background: #ffffff;
    color: #4e5969;
    border: 1px solid #e5e6eb;
}

html[data-theme="blue"] .indexnew .kjxx a {
    color: #1d2129;
}

html[data-theme="blue"] .provider .title {
    color: #1d2129;
}

html[data-theme="blue"] .provider .cell {
    background: #ffffff;
    border: 1px solid #e5e6eb;
    box-shadow: 0 2px 12px rgba(22, 119, 255, .04);
}

html[data-theme="blue"] .provider .tips {
    color: #1677ff;
}

html[data-theme="blue"] .provider .tips1 span {
    background: #1677ff;
    color: #fff;
}

html[data-theme="blue"] .provider .notes {
    color: #4e5969;
}

html[data-theme="blue"] .provider .line {
    background: #e5e6eb;
}

html[data-theme="blue"] .phone-game-modern-section {
    background: #ffffff;
    box-shadow: 0 2px 12px rgba(22, 119, 255, .05);
    border: 1px solid #e5e6eb;
}

html[data-theme="blue"] .phone-game-modern-title {
    color: #1d2129;
}

html[data-theme="blue"] .phone-game-modern-card {
    background: #f0f4ff;
    color: #1d2129;
    border: 1px solid #d6e4ff;
    box-shadow: 0 1px 4px rgba(22, 119, 255, .08);
}

html[data-theme="blue"] .phone-game-modern-card:active {
    background: #d6e4ff;
    border-color: #91b4ff;
}

html[data-theme="blue"] .gclass {
    background: #ffffff;
}

html[data-theme="blue"] #navMenu li {
    background: #f0f4ff;
}

html[data-theme="blue"] #navMenu .bc,
html[data-theme="blue"] #navMenu li:hover {
    background: #1677ff;
}

html[data-theme="blue"] #navMenu li a {
    color: #4e5969;
}

html[data-theme="blue"] #navMenu .bc a {
    color: #ffffff;
}

html[data-theme="blue"] .gameskuan a {
    color: #1d2129;
}

html[data-theme="blue"] .gnclass {
    color: #1677ff;
}

/* 蓝色主题 - 输入框 */
html[data-theme="blue"] input,
html[data-theme="blue"] select,
html[data-theme="blue"] textarea {
    background: #ffffff;
    color: #1d2129;
    border-color: #d9d9d9;
}

html[data-theme="blue"] input:focus,
html[data-theme="blue"] select:focus,
html[data-theme="blue"] textarea:focus {
    border-color: #1677ff;
    box-shadow: 0 0 0 2px rgba(22, 119, 255, .1);
}

/* 蓝色主题 - 按钮系统 */
html[data-theme="blue"] .recharge-btn,
html[data-theme="blue"] .btn-primary,
html[data-theme="blue"] .agent-save-btn {
    background: linear-gradient(135deg, #1677ff, #0958d9);
    color: #ffffff;
    border: none;
    box-shadow: 0 4px 12px rgba(22, 119, 255, .24);
}

html[data-theme="blue"] .usdt-gray-btn,
html[data-theme="blue"] .usdt-add-btn {
    background: #f0f4ff;
    color: #1677ff;
    border: 1px solid #b4ccff;
}

/* 蓝色主题 - 弹窗 */
html[data-theme="blue"] .usdt-popup-box {
    background: #ffffff;
    border: 1px solid #e5e6eb;
    box-shadow: 0 12px 40px rgba(0, 0, 0, .12);
}

html[data-theme="blue"] .usdt-popup-header {
    color: #1d2129;
    border-bottom: 1px solid #e5e6eb;
}

/* 蓝色主题 - 卡片阴影效果 */
html[data-theme="blue"] .merchants-card,
html[data-theme="blue"] .merchants-hero {
    box-shadow: 0 4px 16px rgba(22, 119, 255, .06);
    border: 1px solid #e5e6eb;
}

html[data-theme="blue"] .merchants-hero {
    background: linear-gradient(135deg, #ffffff, #f0f4ff);
}

/* 蓝色主题 - 客服按钮 */
html[data-theme="blue"] .indexzxkf {
    filter: drop-shadow(0 4px 12px rgba(22, 119, 255, .2));
}

/* 蓝色主题 - 滑块/轮播 */
html[data-theme="blue"] .slider {
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 16px rgba(0, 0, 0, .06);
}

/* 蓝色主题 - 代理客服面板 */
html[data-theme="blue"] .agent-chat-top {
    background: linear-gradient(135deg, #1677ff, #0958d9);
    color: #ffffff;
    border-bottom: none;
}

html[data-theme="blue"] .agent-chat-close {
    color: rgba(255, 255, 255, .8);
}

html[data-theme="blue"] .agent-chat-close:hover {
    color: #ffffff;
    background: rgba(255, 255, 255, .15);
}

/* 蓝色主题 - 走势和统计 */
html[data-theme="blue"] .wtabe > tbody > tr:nth-of-type(even) {
    background-color: #f7f9fc;
}

html[data-theme="blue"] .menu .off {
    background: #e8eeff;
}

/* 蓝色主题 - 消息卡片 */
html[data-theme="blue"] .message {
    background: #ffffff;
    border: 1px solid #e5e6eb;
    box-shadow: 0 2px 8px rgba(22, 119, 255, .04);
}

html[data-theme="blue"] .message .tittle {
    color: #1d2129;
}

html[data-theme="blue"] .message .yd {
    background: #1677ff;
    color: #ffffff;
}

/* 蓝色主题 - 充值/用户页面 */
html[data-theme="blue"] .recharge-content .box {
    background: #ffffff;
    border: 1px solid #e5e6eb;
}

html[data-theme="blue"] .sssfa {
    background: #ffffff;
    border: 1px solid #e5e6eb;
    box-shadow: 0 2px 8px rgba(22, 119, 255, .04);
    color: #1d2129;
}

html[data-theme="blue"] .dival {
    background: #ffffff;
    color: #1d2129;
    box-shadow: 0 12px 40px rgba(0, 0, 0, .12);
}