/* 智慧基层 · 界面皮肤库 v1.0 —— 18 套主题用法：，由 web/app.js 的换肤面板切换并写入 localStorage 本文件由 _gen_themes.py 生成，改配色请改脚本后重跑，勿手改本文件 */ /* 切换瞬间给一次平滑过渡（避免常驻 transition 拖累渲染） */ html.zjc-theming, html.zjc-theming * { transition: background-color .28s ease, border-color .28s ease, color .28s ease, box-shadow .28s ease !important; } /* ===== 🎋 青竹翠 ===== */ :root, [data-theme="bamboo"] { color-scheme: light; --primary: #07c160; --primary-dark: #06ad56; --primary-deep: #0a7f43; --primary-bg: #e8f9f0; --primary-soft: rgba(7, 193, 96, 0.12); --blue: #1677ff; --bg: #f0f2f5; --card: #ffffff; --surface: #fafbfc; --hover-bg: #f5f7f8; --border: #e5e8eb; --text: #1f2329; --text-sub: #3f4a44; --muted: #8f959e; --danger: #fa5151; --warn: #ff9f1a; --danger-bg: #fdeeee; --danger-text: #a13a3a; --danger-border: #f5caca; --warn-bg: #fff7e8; --warn-text: #a3620a; --warn-border: #ffe4b3; --side-bg: #1d2a22; --side-bg2: #16211a; --side-text: #cfd8d2; --side-nav: #b8c4bc; --side-muted: #6f7f74; --side-hover: rgba(255, 255, 255, 0.07); --side-active: #07c160; --side-active-text: #ffffff; --side-foot-text: #5f6e64; --side-user-bg: rgba(255, 255, 255, 0.06); --side-user-sub: #8a998f; --login-bg1: #0d241a; --login-bg2: #143a26; --login-bg3: #0f2d1f; --login-hero: #eaf5ee; --login-hero-sub: #9fc7ad; --login-point: #cfe6d7; --login-point-line: rgba(159, 199, 173, 0.18); --login-accent: #ffe9a8; --login-link: #bfe8cf; --login-glass: rgba(255, 255, 255, 0.08); --login-glass-line: rgba(127, 219, 160, 0.5); --login-glass-line2: rgba(127, 219, 160, 0.35); --login-yixn: #dcefe3; --login-card: #ffffff; --login-tab-bg: #f2f5f3; --login-tab-text: #6b7a71; --login-label: #4d5c53; --login-input-bg: #fbfcfb; --login-input-border: #d9e0dc; --login-tip: #9aa8a0; --login-divider: #e8ece9; --input-bg: #ffffff; --radius: 10px; --shadow: 0 1px 3px rgba(0, 0, 0, 0.06); --side-grad: linear-gradient(170deg, #2b372f 0%, #1d2a22 58%, #19422c 100%); --side-art: url("data:image/svg+xml,"); --side-art-op: 0.19; --side-pattern: url("data:image/svg+xml,"); --side-pattern-op: 0.09; --side-glow: radial-gradient(ellipse 90% 46% at 50% 0%, rgba(131, 224, 176, 0.20), transparent 62%); --login-art: url("data:image/svg+xml,"); --login-art-op: 0.24; --login-mesh: radial-gradient(ellipse 62% 52% at 76% 16%, rgba(7, 193, 96, 0.26), transparent 60%), radial-gradient(ellipse 54% 44% at 14% 82%, rgba(255, 233, 168, 0.18), transparent 62%), radial-gradient(circle at 50% 112%, rgba(7, 193, 96, 0.16), transparent 56%); --login-art-pos: center bottom; --login-art-size: 100% 52%; --login-art-repeat: no-repeat; --top-grad: linear-gradient(180deg, #ffffff 0%, #eefbf4 100%); --main-grad: radial-gradient(circle at 10% -6%, rgba(7, 193, 96, 0.09), transparent 44%), radial-gradient(circle at 92% 4%, rgba(255, 233, 168, 0.08), transparent 40%); --drift: none; --drift-size: 150px; --drift-dir: 150px; --drift-dur: 30s; --drift-op: 0; --glow-dur: 16s; --tint-blue: #f0f5ff; --tint-blue-bd: #c0d4ff; --tint-blue-tx: #1d5fa8; --tint-purple: #f7f0ff; --tint-purple-bd: #ddc8f5; --tint-purple-tx: #6d3fb8; --tint-teal: #edfbf8; --tint-teal-bd: #b0ebe2; --tint-teal-tx: #0e7d6d; --tint-green: #edf7ed; --tint-green-bd: #bce8bb; --tint-green-tx: #1d7a3a; --tint-gray: #f5f6f8; --tint-gray-bd: #d8dde4; --tint-gray-tx: #4a5568; --tint-orange: #fff3e6; --tint-orange-bd: #ffd9b0; --tint-orange-tx: #a05a14; --tint-red: #ffecec; --tint-red-bd: #ffc9c9; --tint-red-tx: #b03030; --tint-yellow: #fff7e6; --tint-yellow-bd: #ffe1a6; --tint-yellow-tx: #8a6a14; } /* ===== 🖤 墨韵黑 ===== */ [data-theme="ink"] { color-scheme: dark; --primary: #d4a24a; --primary-dark: #b8863a; --primary-deep: #9d7837; --primary-bg: rgba(212,162,74,0.14); --primary-soft: rgba(212, 162, 74, 0.18); --blue: #6ba4ff; --bg: #14161a; --card: #292b2e; --surface: #222427; --hover-bg: #222428; --border: #444649; --text: #e8eaed; --text-sub: #ced1d5; --muted: #8b9099; --danger: #ff6b6b; --warn: #ffb340; --danger-bg: #433335; --danger-text: #ff9f9f; --danger-border: #855355; --warn-bg: #433b30; --warn-text: #ffca79; --warn-border: #8f7245; --side-bg: #0f1115; --side-bg2: #0d0f12; --side-text: #d9d9da; --side-nav: #bcbcbd; --side-muted: #828385; --side-hover: rgba(255, 255, 255, 0.07); --side-active: #d4a24a; --side-active-text: #101418; --side-foot-text: #747577; --side-user-bg: rgba(255, 255, 255, 0.06); --side-user-sub: #9a9b9d; --login-bg1: #0a0b0e; --login-bg2: #16181d; --login-bg3: #101216; --login-hero: #e8e8e8; --login-hero-sub: #909193; --login-point: #b6b6b7; --login-point-line: rgba(144, 145, 147, 0.18); --login-accent: #f0cf94; --login-link: #e2d4bc; --login-glass: rgba(255, 255, 255, 0.08); --login-glass-line: rgba(227, 195, 137, 0.5); --login-glass-line2: rgba(227, 195, 137, 0.35); --login-yixn: #c6c7c8; --login-card: #292b2e; --login-tab-bg: #1e2024; --login-tab-text: #a7abb2; --login-label: #ced1d5; --login-input-bg: #212326; --login-input-border: #444649; --login-tip: #8b9099; --login-divider: #444649; --input-bg: #292b2e; --radius: 10px; --shadow: 0 1px 3px rgba(0, 0, 0, 0.4); --side-grad: linear-gradient(170deg, #1d1f23 0%, #0f1115 58%, #2f281d 100%); --side-art: url("data:image/svg+xml,"); --side-art-op: 0.19; --side-pattern: url("data:image/svg+xml,"); --side-pattern-op: 0.09; --side-glow: radial-gradient(ellipse 90% 46% at 50% 0%, rgba(234, 208, 164, 0.20), transparent 62%); --login-art: url("data:image/svg+xml,"); --login-art-op: 0.24; --login-mesh: radial-gradient(ellipse 62% 52% at 76% 16%, rgba(212, 162, 74, 0.26), transparent 60%), radial-gradient(ellipse 54% 44% at 14% 82%, rgba(240, 207, 148, 0.18), transparent 62%), radial-gradient(circle at 50% 112%, rgba(212, 162, 74, 0.16), transparent 56%); --login-art-pos: center bottom; --login-art-size: cover; --login-art-repeat: no-repeat; --top-grad: linear-gradient(180deg, #292b2e 0%, #3a3731 100%); --main-grad: radial-gradient(circle at 10% -6%, rgba(212, 162, 74, 0.16), transparent 44%), radial-gradient(circle at 92% 4%, rgba(240, 207, 148, 0.13), transparent 40%); --drift: none; --drift-size: 150px; --drift-dir: 150px; --drift-dur: 30s; --drift-op: 0; --glow-dur: 16s; --tint-blue: #494b4f; --tint-blue-bd: #6c7383; --tint-blue-tx: #85a9d0; --tint-purple: #4a4b4f; --tint-purple-bd: #757080; --tint-purple-tx: #b097d9; --tint-teal: #484c4e; --tint-teal-bd: #677b7a; --tint-teal-tx: #7db9b0; --tint-green: #484c4d; --tint-green-bd: #6a7a6d; --tint-green-tx: #85b795; --tint-gray: #4a4b4e; --tint-gray-bd: #73767b; --tint-gray-tx: #9da3ad; --tint-orange: #4b4b4b; --tint-orange-bd: #80756a; --tint-orange-tx: #cca680; --tint-red: #4b4a4c; --tint-red-bd: #807072; --tint-red-tx: #d48f8f; --tint-yellow: #4b4c4b; --tint-yellow-bd: #807867; --tint-yellow-tx: #c0af80; } /* ===== 🌌 午夜蓝 ===== */ [data-theme="midnight"] { color-scheme: light; --primary: #2f6fed; --primary-dark: #2559c4; --primary-deep: #2962d1; --primary-bg: #eaf1ff; --primary-soft: rgba(47, 111, 237, 0.12); --blue: #1677ff; --bg: #f2f4f8; --card: #ffffff; --surface: #fafbfd; --hover-bg: #f3f4f8; --border: #e2e7f0; --text: #1b2230; --text-sub: #3a4251; --muted: #8a93a6; --danger: #e5484d; --warn: #f5a524; --danger-bg: #fdf2f3; --danger-text: #c33d41; --danger-border: #e3afb7; --warn-bg: #fef7eb; --warn-text: #c4841d; --warn-border: #eacd9e; --side-bg: #16203a; --side-bg2: #131c32; --side-text: #dadbdf; --side-nav: #bec1c8; --side-muted: #868b99; --side-hover: rgba(255, 255, 255, 0.07); --side-active: #2f6fed; --side-active-text: #ffffff; --side-foot-text: #787e8d; --side-user-bg: rgba(255, 255, 255, 0.06); --side-user-sub: #9da1ac; --login-bg1: #0d1526; --login-bg2: #1a2540; --login-bg3: #121b30; --login-hero: #e8e9ec; --login-hero-sub: #9197a4; --login-point: #b7bac3; --login-point-line: rgba(145, 151, 164, 0.18); --login-accent: #a9c6ff; --login-link: #b4c7ec; --login-glass: rgba(255, 255, 255, 0.08); --login-glass-line: rgba(120, 161, 243, 0.5); --login-glass-line2: rgba(120, 161, 243, 0.35); --login-yixn: #c7cad0; --login-card: #ffffff; --login-tab-bg: #f8fafc; --login-tab-text: #697183; --login-label: #3a4251; --login-input-bg: #fafbfc; --login-input-border: #e2e7f0; --login-tip: #8a93a6; --login-divider: #e2e7f0; --input-bg: #ffffff; --radius: 10px; --shadow: 0 1px 3px rgba(0, 0, 0, 0.06); --side-grad: linear-gradient(170deg, #242d46 0%, #16203a 58%, #1a2d57 100%); --side-art: url("data:image/svg+xml,"); --side-art-op: 0.19; --side-pattern: url("data:image/svg+xml,"); --side-pattern-op: 0.09; --side-glow: radial-gradient(ellipse 90% 46% at 50% 0%, rgba(151, 183, 246, 0.20), transparent 62%); --login-art: url("data:image/svg+xml,"); --login-art-op: 0.24; --login-mesh: radial-gradient(ellipse 62% 52% at 76% 16%, rgba(47, 111, 237, 0.26), transparent 60%), radial-gradient(ellipse 54% 44% at 14% 82%, rgba(169, 198, 255, 0.18), transparent 62%), radial-gradient(circle at 50% 112%, rgba(47, 111, 237, 0.16), transparent 56%); --login-art-pos: center; --login-art-size: cover; --login-art-repeat: no-repeat; --top-grad: linear-gradient(180deg, #ffffff 0%, #f0f5fe 100%); --main-grad: radial-gradient(circle at 10% -6%, rgba(47, 111, 237, 0.09), transparent 44%), radial-gradient(circle at 92% 4%, rgba(169, 198, 255, 0.08), transparent 40%); --drift: radial-gradient(circle at 72px 74px, rgba(168, 195, 247, 0.44) 0, rgba(168, 195, 247, 0.33) 1.4px, transparent 2.1px), radial-gradient(circle at 72px 74px, rgba(168, 195, 247, 0.13) 0, transparent 5.4px), radial-gradient(circle at 86px 91px, rgba(168, 195, 247, 0.39) 0, rgba(168, 195, 247, 0.29) 1.6px, transparent 2.3px), radial-gradient(circle at 86px 91px, rgba(168, 195, 247, 0.12) 0, transparent 6.0px), radial-gradient(circle at 52px 21px, rgba(168, 195, 247, 0.44) 0, rgba(168, 195, 247, 0.33) 1.1px, transparent 1.8px), radial-gradient(circle at 52px 21px, rgba(168, 195, 247, 0.13) 0, transparent 7.5px), radial-gradient(circle at 58px 82px, rgba(168, 195, 247, 0.60) 0, rgba(168, 195, 247, 0.45) 1.6px, transparent 2.3px), radial-gradient(circle at 58px 82px, rgba(168, 195, 247, 0.18) 0, transparent 4.9px), radial-gradient(circle at 37px 40px, rgba(168, 195, 247, 0.60) 0, rgba(168, 195, 247, 0.45) 0.9px, transparent 1.6px), radial-gradient(circle at 37px 40px, rgba(168, 195, 247, 0.18) 0, transparent 7.6px), radial-gradient(circle at 109px 60px, rgba(168, 195, 247, 0.55) 0, rgba(168, 195, 247, 0.41) 0.9px, transparent 1.6px), radial-gradient(circle at 109px 60px, rgba(168, 195, 247, 0.16) 0, transparent 7.5px), radial-gradient(circle at 82px 59px, rgba(168, 195, 247, 0.56) 0, rgba(168, 195, 247, 0.42) 1.6px, transparent 2.3px), radial-gradient(circle at 82px 59px, rgba(168, 195, 247, 0.17) 0, transparent 5.8px), radial-gradient(circle at 20px 16px, rgba(168, 195, 247, 0.46) 0, rgba(168, 195, 247, 0.35) 1.6px, transparent 2.3px), radial-gradient(circle at 20px 16px, rgba(168, 195, 247, 0.14) 0, transparent 5.0px), radial-gradient(circle at 68px 129px, rgba(168, 195, 247, 0.50) 0, rgba(168, 195, 247, 0.37) 1.5px, transparent 2.2px), radial-gradient(circle at 68px 129px, rgba(168, 195, 247, 0.15) 0, transparent 5.8px), radial-gradient(circle at 120px 71px, rgba(168, 195, 247, 0.52) 0, rgba(168, 195, 247, 0.39) 1.1px, transparent 1.8px), radial-gradient(circle at 120px 71px, rgba(168, 195, 247, 0.16) 0, transparent 4.7px), radial-gradient(circle at 13px 108px, rgba(168, 195, 247, 0.56) 0, rgba(168, 195, 247, 0.42) 1.6px, transparent 2.3px), radial-gradient(circle at 13px 108px, rgba(168, 195, 247, 0.17) 0, transparent 5.7px); --drift-size: 150px; --drift-dir: 150px; --drift-dur: 32s; --drift-op: 0.60; --glow-dur: 24s; --tint-blue: #f0f5ff; --tint-blue-bd: #c0d4ff; --tint-blue-tx: #1d5fa8; --tint-purple: #f7f0ff; --tint-purple-bd: #ddc8f5; --tint-purple-tx: #6d3fb8; --tint-teal: #edfbf8; --tint-teal-bd: #b0ebe2; --tint-teal-tx: #0e7d6d; --tint-green: #edf7ed; --tint-green-bd: #bce8bb; --tint-green-tx: #1d7a3a; --tint-gray: #f5f6f8; --tint-gray-bd: #d8dde4; --tint-gray-tx: #4a5568; --tint-orange: #fff3e6; --tint-orange-bd: #ffd9b0; --tint-orange-tx: #a05a14; --tint-red: #ffecec; --tint-red-bd: #ffc9c9; --tint-red-tx: #b03030; --tint-yellow: #fff7e6; --tint-yellow-bd: #ffe1a6; --tint-yellow-tx: #8a6a14; } /* ===== 🌅 晨曦橙 ===== */ [data-theme="dawn"] { color-scheme: light; --primary: #f0813c; --primary-dark: #d96a26; --primary-deep: #b25f2c; --primary-bg: #fff2e8; --primary-soft: rgba(240, 129, 60, 0.12); --blue: #1677ff; --bg: #faf7f4; --card: #ffffff; --surface: #fdfcfb; --hover-bg: #faf7f4; --border: #efe6dd; --text: #2b2320; --text-sub: #493f3a; --muted: #97887e; --danger: #e5484d; --warn: #f5a524; --danger-bg: #fdf2f3; --danger-text: #c33d41; --danger-border: #ecafab; --warn-bg: #fef7eb; --warn-text: #c4841d; --warn-border: #f1cc93; --side-bg: #33241a; --side-bg2: #2c1f16; --side-text: #dedcda; --side-nav: #c6c2bf; --side-muted: #958d88; --side-hover: rgba(255, 255, 255, 0.07); --side-active: #f0813c; --side-active-text: #ffffff; --side-foot-text: #89807a; --side-user-bg: rgba(255, 255, 255, 0.06); --side-user-sub: #a9a39f; --login-bg1: #2a1a10; --login-bg2: #42291a; --login-bg3: #33200f; --login-hero: #eceae8; --login-hero-sub: #a59991; --login-point: #c3bcb7; --login-point-line: rgba(165, 153, 145, 0.18); --login-accent: #ffd7a8; --login-link: #edcdb8; --login-glass: rgba(255, 255, 255, 0.08); --login-glass-line: rgba(245, 173, 128, 0.5); --login-glass-line2: rgba(245, 173, 128, 0.35); --login-yixn: #d1cbc7; --login-card: #ffffff; --login-tab-bg: #fcfbfa; --login-tab-text: #776a62; --login-label: #493f3a; --login-input-bg: #fdfcfb; --login-input-border: #efe6dd; --login-tip: #97887e; --login-divider: #efe6dd; --input-bg: #ffffff; --radius: 10px; --shadow: 0 1px 3px rgba(0, 0, 0, 0.06); --side-grad: linear-gradient(170deg, #3f3128 0%, #33241a 58%, #51331f 100%); --side-art: url("data:image/svg+xml,"); --side-art-op: 0.19; --side-pattern: url("data:image/svg+xml,"); --side-pattern-op: 0.09; --side-glow: radial-gradient(ellipse 90% 46% at 50% 0%, rgba(248, 192, 158, 0.20), transparent 62%); --login-art: url("data:image/svg+xml,"); --login-art-op: 0.24; --login-mesh: radial-gradient(ellipse 62% 52% at 76% 16%, rgba(240, 129, 60, 0.26), transparent 60%), radial-gradient(ellipse 54% 44% at 14% 82%, rgba(255, 215, 168, 0.18), transparent 62%), radial-gradient(circle at 50% 112%, rgba(240, 129, 60, 0.16), transparent 56%); --login-art-pos: 30% 26%; --login-art-size: cover; --login-art-repeat: no-repeat; --top-grad: linear-gradient(180deg, #ffffff 0%, #fef6f1 100%); --main-grad: radial-gradient(circle at 10% -6%, rgba(240, 129, 60, 0.09), transparent 44%), radial-gradient(circle at 92% 4%, rgba(255, 215, 168, 0.08), transparent 40%); --drift: none; --drift-size: 150px; --drift-dir: 150px; --drift-dur: 30s; --drift-op: 0; --glow-dur: 16s; --tint-blue: #f0f5ff; --tint-blue-bd: #c0d4ff; --tint-blue-tx: #1d5fa8; --tint-purple: #f7f0ff; --tint-purple-bd: #ddc8f5; --tint-purple-tx: #6d3fb8; --tint-teal: #edfbf8; --tint-teal-bd: #b0ebe2; --tint-teal-tx: #0e7d6d; --tint-green: #edf7ed; --tint-green-bd: #bce8bb; --tint-green-tx: #1d7a3a; --tint-gray: #f5f6f8; --tint-gray-bd: #d8dde4; --tint-gray-tx: #4a5568; --tint-orange: #fff3e6; --tint-orange-bd: #ffd9b0; --tint-orange-tx: #a05a14; --tint-red: #ffecec; --tint-red-bd: #ffc9c9; --tint-red-tx: #b03030; --tint-yellow: #fff7e6; --tint-yellow-bd: #ffe1a6; --tint-yellow-tx: #8a6a14; } /* ===== 🪷 藕荷紫 ===== */ [data-theme="lotus"] { color-scheme: light; --primary: #8b5cf6; --primary-dark: #7449e0; --primary-deep: #7a51d8; --primary-bg: #f3edff; --primary-soft: rgba(139, 92, 246, 0.12); --blue: #1677ff; --bg: #f7f5fb; --card: #ffffff; --surface: #fcfcfe; --hover-bg: #f7f5fb; --border: #e9e4f5; --text: #241f33; --text-sub: #423c52; --muted: #8f88a3; --danger: #e5484d; --warn: #f5a524; --danger-bg: #fdf2f3; --danger-text: #c33d41; --danger-border: #e8adba; --warn-bg: #fef7eb; --warn-text: #c4841d; --warn-border: #eecba1; --side-bg: #241a3d; --side-bg2: #1f1634; --side-text: #dcdae0; --side-nav: #c2bfc9; --side-muted: #8d889a; --side-hover: rgba(255, 255, 255, 0.07); --side-active: #8b5cf6; --side-active-text: #ffffff; --side-foot-text: #807a8e; --side-user-bg: rgba(255, 255, 255, 0.06); --side-user-sub: #a39fae; --login-bg1: #1a1130; --login-bg2: #2a1e4d; --login-bg3: #20163a; --login-hero: #eae8ed; --login-hero-sub: #9993aa; --login-point: #bcb8c7; --login-point-line: rgba(153, 147, 170, 0.18); --login-accent: #d9c4ff; --login-link: #cfc1f0; --login-glass: rgba(255, 255, 255, 0.08); --login-glass-line: rgba(180, 149, 249, 0.5); --login-glass-line2: rgba(180, 149, 249, 0.35); --login-yixn: #cbc8d3; --login-card: #ffffff; --login-tab-bg: #fbfafd; --login-tab-text: #6f6881; --login-label: #423c52; --login-input-bg: #fcfbfd; --login-input-border: #e9e4f5; --login-tip: #8f88a3; --login-divider: #e9e4f5; --input-bg: #ffffff; --radius: 10px; --shadow: 0 1px 3px rgba(0, 0, 0, 0.06); --side-grad: linear-gradient(170deg, #312849 0%, #241a3d 58%, #34255b 100%); --side-art: url("data:image/svg+xml,"); --side-art-op: 0.19; --side-pattern: url("data:image/svg+xml,"); --side-pattern-op: 0.09; --side-glow: radial-gradient(ellipse 90% 46% at 50% 0%, rgba(197, 174, 250, 0.20), transparent 62%); --login-art: url("data:image/svg+xml,"); --login-art-op: 0.24; --login-mesh: radial-gradient(ellipse 62% 52% at 76% 16%, rgba(139, 92, 246, 0.26), transparent 60%), radial-gradient(ellipse 54% 44% at 14% 82%, rgba(217, 196, 255, 0.18), transparent 62%), radial-gradient(circle at 50% 112%, rgba(139, 92, 246, 0.16), transparent 56%); --login-art-pos: center bottom; --login-art-size: cover; --login-art-repeat: no-repeat; --top-grad: linear-gradient(180deg, #ffffff 0%, #f7f4fe 100%); --main-grad: radial-gradient(circle at 10% -6%, rgba(139, 92, 246, 0.09), transparent 44%), radial-gradient(circle at 92% 4%, rgba(217, 196, 255, 0.08), transparent 40%); --drift: radial-gradient(circle at 64px 108px, rgba(206, 187, 251, 0.41) 0, rgba(206, 187, 251, 0.31) 1.2px, transparent 2.0px), radial-gradient(circle at 92px 76px, rgba(206, 187, 251, 0.42) 0, rgba(206, 187, 251, 0.32) 1.3px, transparent 2.1px), radial-gradient(circle at 16px 117px, rgba(206, 187, 251, 0.37) 0, rgba(206, 187, 251, 0.28) 0.8px, transparent 1.6px), radial-gradient(circle at 22px 84px, rgba(206, 187, 251, 0.36) 0, rgba(206, 187, 251, 0.27) 0.8px, transparent 1.6px), radial-gradient(circle at 92px 134px, rgba(206, 187, 251, 0.52) 0, rgba(206, 187, 251, 0.39) 0.9px, transparent 1.7px), radial-gradient(circle at 77px 107px, rgba(206, 187, 251, 0.29) 0, rgba(206, 187, 251, 0.22) 1.0px, transparent 1.8px), radial-gradient(circle at 147px 41px, rgba(206, 187, 251, 0.28) 0, rgba(206, 187, 251, 0.21) 0.9px, transparent 1.7px), radial-gradient(circle at 75px 105px, rgba(206, 187, 251, 0.40) 0, rgba(206, 187, 251, 0.30) 1.4px, transparent 2.2px), radial-gradient(circle at 111px 51px, rgba(206, 187, 251, 0.30) 0, rgba(206, 187, 251, 0.23) 1.3px, transparent 2.1px), radial-gradient(circle at 135px 19px, rgba(206, 187, 251, 0.31) 0, rgba(206, 187, 251, 0.23) 0.8px, transparent 1.6px), radial-gradient(circle at 61px 77px, rgba(206, 187, 251, 0.52) 0, rgba(206, 187, 251, 0.39) 1.5px, transparent 2.3px), radial-gradient(circle at 82px 63px, rgba(206, 187, 251, 0.49) 0, rgba(206, 187, 251, 0.37) 1.5px, transparent 2.3px), radial-gradient(circle at 4px 65px, rgba(206, 187, 251, 0.43) 0, rgba(206, 187, 251, 0.32) 0.6px, transparent 1.4px), radial-gradient(circle at 148px 67px, rgba(206, 187, 251, 0.32) 0, rgba(206, 187, 251, 0.24) 1.5px, transparent 2.3px), radial-gradient(circle at 62px 31px, rgba(206, 187, 251, 0.39) 0, rgba(206, 187, 251, 0.29) 0.7px, transparent 1.5px), radial-gradient(circle at 46px 123px, rgba(206, 187, 251, 0.41) 0, rgba(206, 187, 251, 0.31) 0.9px, transparent 1.7px), radial-gradient(circle at 120px 115px, rgba(206, 187, 251, 0.51) 0, rgba(206, 187, 251, 0.38) 0.8px, transparent 1.6px), radial-gradient(circle at 129px 129px, rgba(206, 187, 251, 0.50) 0, rgba(206, 187, 251, 0.37) 1.4px, transparent 2.2px), radial-gradient(circle at 17px 57px, rgba(206, 187, 251, 0.44) 0, rgba(206, 187, 251, 0.33) 1.3px, transparent 2.1px), radial-gradient(circle at 98px 73px, rgba(206, 187, 251, 0.44) 0, rgba(206, 187, 251, 0.33) 0.8px, transparent 1.6px), radial-gradient(circle at 92px 119px, rgba(206, 187, 251, 0.39) 0, rgba(206, 187, 251, 0.29) 1.2px, transparent 2.0px), radial-gradient(circle at 60px 73px, rgba(206, 187, 251, 0.32) 0, rgba(206, 187, 251, 0.24) 0.8px, transparent 1.6px); --drift-size: 150px; --drift-dir: 150px; --drift-dur: 33s; --drift-op: 0.60; --glow-dur: 25s; --tint-blue: #f0f5ff; --tint-blue-bd: #c0d4ff; --tint-blue-tx: #1d5fa8; --tint-purple: #f7f0ff; --tint-purple-bd: #ddc8f5; --tint-purple-tx: #6d3fb8; --tint-teal: #edfbf8; --tint-teal-bd: #b0ebe2; --tint-teal-tx: #0e7d6d; --tint-green: #edf7ed; --tint-green-bd: #bce8bb; --tint-green-tx: #1d7a3a; --tint-gray: #f5f6f8; --tint-gray-bd: #d8dde4; --tint-gray-tx: #4a5568; --tint-orange: #fff3e6; --tint-orange-bd: #ffd9b0; --tint-orange-tx: #a05a14; --tint-red: #ffecec; --tint-red-bd: #ffc9c9; --tint-red-tx: #b03030; --tint-yellow: #fff7e6; --tint-yellow-bd: #ffe1a6; --tint-yellow-tx: #8a6a14; } /* ===== 🏮 朱砂红 ===== */ [data-theme="cinnabar"] { color-scheme: light; --primary: #d93a3a; --primary-dark: #bf2c2c; --primary-deep: #bf3333; --primary-bg: #fdeceb; --primary-soft: rgba(217, 58, 58, 0.12); --blue: #1677ff; --bg: #faf6f5; --card: #ffffff; --surface: #fdfcfc; --hover-bg: #faf6f5; --border: #f0e2e0; --text: #2b1f1f; --text-sub: #4a3c3c; --muted: #9a8785; --danger: #e5484d; --warn: #f5a524; --danger-bg: #fdf2f3; --danger-text: #c33d41; --danger-border: #ecacad; --warn-bg: #fef7eb; --warn-text: #c4841d; --warn-border: #f2ca95; --side-bg: #33191a; --side-bg2: #2c1616; --side-text: #dedada; --side-nav: #c6bfbf; --side-muted: #958788; --side-hover: rgba(255, 255, 255, 0.07); --side-active: #d93a3a; --side-active-text: #ffffff; --side-foot-text: #897a7a; --side-user-bg: rgba(255, 255, 255, 0.06); --side-user-sub: #a99e9f; --login-bg1: #2a1012; --login-bg2: #421a1c; --login-bg3: #331315; --login-hero: #ece8e8; --login-hero-sub: #a59192; --login-point: #c3b7b7; --login-point-line: rgba(165, 145, 146, 0.18); --login-accent: #ffc9a8; --login-link: #e7b7b7; --login-glass: rgba(255, 255, 255, 0.08); --login-glass-line: rgba(230, 127, 127, 0.5); --login-glass-line2: rgba(230, 127, 127, 0.35); --login-yixn: #d1c7c7; --login-card: #ffffff; --login-tab-bg: #fcfafa; --login-tab-text: #796866; --login-label: #4a3c3c; --login-input-bg: #fdfbfb; --login-input-border: #f0e2e0; --login-tip: #9a8785; --login-divider: #f0e2e0; --input-bg: #ffffff; --radius: 10px; --shadow: 0 1px 3px rgba(0, 0, 0, 0.06); --side-grad: linear-gradient(170deg, #3f2728 0%, #33191a 58%, #4e1e1f 100%); --side-art: url("data:image/svg+xml,"); --side-art-op: 0.26; --side-pattern: url("data:image/svg+xml,"); --side-pattern-op: 0.09; --side-glow: radial-gradient(ellipse 90% 46% at 50% 0%, rgba(236, 156, 156, 0.20), transparent 62%); --login-art: url("data:image/svg+xml,"); --login-art-op: 0.32; --login-mesh: radial-gradient(ellipse 62% 52% at 76% 16%, rgba(217, 58, 58, 0.26), transparent 60%), radial-gradient(ellipse 54% 44% at 14% 82%, rgba(255, 201, 168, 0.18), transparent 62%), radial-gradient(circle at 50% 112%, rgba(217, 58, 58, 0.16), transparent 56%); --login-art-pos: center; --login-art-size: 560px 560px; --login-art-repeat: repeat; --top-grad: linear-gradient(180deg, #ffffff 0%, #fcf1f1 100%); --main-grad: radial-gradient(circle at 10% -6%, rgba(217, 58, 58, 0.09), transparent 44%), radial-gradient(circle at 92% 4%, rgba(255, 201, 168, 0.08), transparent 40%); --drift: none; --drift-size: 150px; --drift-dir: 150px; --drift-dur: 30s; --drift-op: 0; --glow-dur: 16s; --tint-blue: #f0f5ff; --tint-blue-bd: #c0d4ff; --tint-blue-tx: #1d5fa8; --tint-purple: #f7f0ff; --tint-purple-bd: #ddc8f5; --tint-purple-tx: #6d3fb8; --tint-teal: #edfbf8; --tint-teal-bd: #b0ebe2; --tint-teal-tx: #0e7d6d; --tint-green: #edf7ed; --tint-green-bd: #bce8bb; --tint-green-tx: #1d7a3a; --tint-gray: #f5f6f8; --tint-gray-bd: #d8dde4; --tint-gray-tx: #4a5568; --tint-orange: #fff3e6; --tint-orange-bd: #ffd9b0; --tint-orange-tx: #a05a14; --tint-red: #ffecec; --tint-red-bd: #ffc9c9; --tint-red-tx: #b03030; --tint-yellow: #fff7e6; --tint-yellow-bd: #ffe1a6; --tint-yellow-tx: #8a6a14; } /* ===== 🏺 青花瓷 ===== */ [data-theme="porcelain"] { color-scheme: light; --primary: #1f5fb0; --primary-dark: #17498c; --primary-deep: #1b549b; --primary-bg: #eef3ff; --primary-soft: rgba(31, 95, 176, 0.12); --blue: #1677ff; --bg: #f4f7fa; --card: #ffffff; --surface: #fbfcfd; --hover-bg: #f4f7fa; --border: #dfe7f0; --text: #1c2634; --text-sub: #3a4554; --muted: #8695a8; --danger: #e5484d; --warn: #f5a524; --danger-bg: #fdf2f3; --danger-text: #c33d41; --danger-border: #e1afb7; --warn-bg: #fef7eb; --warn-text: #c4841d; --warn-border: #e8cd9e; --side-bg: #17324f; --side-bg2: #142b44; --side-text: #dadee3; --side-nav: #bec6ce; --side-muted: #8694a3; --side-hover: rgba(255, 255, 255, 0.07); --side-active: #1f5fb0; --side-active-text: #ffffff; --side-foot-text: #788899; --side-user-bg: rgba(255, 255, 255, 0.06); --side-user-sub: #9ea9b5; --login-bg1: #0e2136; --login-bg2: #1a3550; --login-bg3: #122a42; --login-hero: #e8ebee; --login-hero-sub: #919fac; --login-point: #b7bfc8; --login-point-line: rgba(145, 159, 172, 0.18); --login-accent: #bcd9ff; --login-link: #b0c4dd; --login-glass: rgba(255, 255, 255, 0.08); --login-glass-line: rgba(109, 151, 204, 0.5); --login-glass-line2: rgba(109, 151, 204, 0.35); --login-yixn: #c7ced5; --login-card: #ffffff; --login-tab-bg: #fafbfc; --login-tab-text: #667485; --login-label: #3a4554; --login-input-bg: #fbfcfd; --login-input-border: #dfe7f0; --login-tip: #8695a8; --login-divider: #dfe7f0; --input-bg: #ffffff; --radius: 10px; --shadow: 0 1px 3px rgba(0, 0, 0, 0.06); --side-grad: linear-gradient(170deg, #253e5a 0%, #17324f 58%, #18395f 100%); --side-art: url("data:image/svg+xml,"); --side-art-op: 0.26; --side-pattern: url("data:image/svg+xml,"); --side-pattern-op: 0.09; --side-glow: radial-gradient(ellipse 90% 46% at 50% 0%, rgba(143, 175, 216, 0.20), transparent 62%); --login-art: url("data:image/svg+xml,"); --login-art-op: 0.32; --login-mesh: radial-gradient(ellipse 62% 52% at 76% 16%, rgba(31, 95, 176, 0.26), transparent 60%), radial-gradient(ellipse 54% 44% at 14% 82%, rgba(188, 217, 255, 0.18), transparent 62%), radial-gradient(circle at 50% 112%, rgba(31, 95, 176, 0.16), transparent 56%); --login-art-pos: center; --login-art-size: 620px 620px; --login-art-repeat: repeat; --top-grad: linear-gradient(180deg, #ffffff 0%, #eff4f9 100%); --main-grad: radial-gradient(circle at 10% -6%, rgba(31, 95, 176, 0.09), transparent 44%), radial-gradient(circle at 92% 4%, rgba(188, 217, 255, 0.08), transparent 40%); --drift: none; --drift-size: 150px; --drift-dir: 150px; --drift-dur: 30s; --drift-op: 0; --glow-dur: 16s; --tint-blue: #f0f5ff; --tint-blue-bd: #c0d4ff; --tint-blue-tx: #1d5fa8; --tint-purple: #f7f0ff; --tint-purple-bd: #ddc8f5; --tint-purple-tx: #6d3fb8; --tint-teal: #edfbf8; --tint-teal-bd: #b0ebe2; --tint-teal-tx: #0e7d6d; --tint-green: #edf7ed; --tint-green-bd: #bce8bb; --tint-green-tx: #1d7a3a; --tint-gray: #f5f6f8; --tint-gray-bd: #d8dde4; --tint-gray-tx: #4a5568; --tint-orange: #fff3e6; --tint-orange-bd: #ffd9b0; --tint-orange-tx: #a05a14; --tint-red: #ffecec; --tint-red-bd: #ffc9c9; --tint-red-tx: #b03030; --tint-yellow: #fff7e6; --tint-yellow-bd: #ffe1a6; --tint-yellow-tx: #8a6a14; } /* ===== 🍵 茶褐棕 ===== */ [data-theme="tea"] { color-scheme: light; --primary: #8a6a45; --primary-dark: #71563a; --primary-deep: #795d3d; --primary-bg: #f7f0e6; --primary-soft: rgba(138, 106, 69, 0.12); --blue: #1677ff; --bg: #f8f5ef; --card: #fffdfa; --surface: #fdfaf6; --hover-bg: #f8f5f0; --border: #e8dfd0; --text: #2e2620; --text-sub: #4b4139; --muted: #948779; --danger: #e5484d; --warn: #f5a524; --danger-bg: #fdf2f3; --danger-text: #c33d41; --danger-border: #e7aaa2; --warn-bg: #fef7eb; --warn-text: #c4841d; --warn-border: #edc88b; --side-bg: #2e241a; --side-bg2: #281f16; --side-text: #dedcda; --side-nav: #c4c2bf; --side-muted: #928d88; --side-hover: rgba(255, 255, 255, 0.07); --side-active: #8a6a45; --side-active-text: #ffffff; --side-foot-text: #86807a; --side-user-bg: rgba(255, 255, 255, 0.06); --side-user-sub: #a7a39f; --login-bg1: #241b12; --login-bg2: #3a2c1e; --login-bg3: #2c2116; --login-hero: #ebeae8; --login-hero-sub: #a19a93; --login-point: #c1bcb8; --login-point-line: rgba(161, 154, 147, 0.18); --login-accent: #e8cfa0; --login-link: #d0c6ba; --login-glass: rgba(255, 255, 255, 0.08); --login-glass-line: rgba(179, 158, 134, 0.5); --login-glass-line2: rgba(179, 158, 134, 0.35); --login-yixn: #cfccc8; --login-card: #ffffff; --login-tab-bg: #fcfaf7; --login-tab-text: #756a5e; --login-label: #4b4139; --login-input-bg: #fcfbf9; --login-input-border: #e8dfd0; --login-tip: #948779; --login-divider: #e8dfd0; --input-bg: #fffdfa; --radius: 10px; --shadow: 0 1px 3px rgba(0, 0, 0, 0.06); --side-grad: linear-gradient(170deg, #3b3128 0%, #2e241a 58%, #3d2f21 100%); --side-art: url("data:image/svg+xml,"); --side-art-op: 0.26; --side-pattern: url("data:image/svg+xml,"); --side-pattern-op: 0.09; --side-glow: radial-gradient(ellipse 90% 46% at 50% 0%, rgba(196, 180, 162, 0.20), transparent 62%); --login-art: url("data:image/svg+xml,"); --login-art-op: 0.32; --login-mesh: radial-gradient(ellipse 62% 52% at 76% 16%, rgba(138, 106, 69, 0.26), transparent 60%), radial-gradient(ellipse 54% 44% at 14% 82%, rgba(232, 207, 160, 0.18), transparent 62%), radial-gradient(circle at 50% 112%, rgba(138, 106, 69, 0.16), transparent 56%); --login-art-pos: center; --login-art-size: 460px 460px; --login-art-repeat: repeat; --top-grad: linear-gradient(180deg, #fffdfa 0%, #f7f3ed 100%); --main-grad: radial-gradient(circle at 10% -6%, rgba(138, 106, 69, 0.09), transparent 44%), radial-gradient(circle at 92% 4%, rgba(232, 207, 160, 0.08), transparent 40%); --drift: radial-gradient(circle at 64px 108px, rgba(206, 192, 177, 0.41) 0, rgba(206, 192, 177, 0.31) 1.2px, transparent 2.0px), radial-gradient(circle at 92px 76px, rgba(206, 192, 177, 0.42) 0, rgba(206, 192, 177, 0.32) 1.3px, transparent 2.1px), radial-gradient(circle at 16px 117px, rgba(206, 192, 177, 0.37) 0, rgba(206, 192, 177, 0.28) 0.8px, transparent 1.6px), radial-gradient(circle at 22px 84px, rgba(206, 192, 177, 0.36) 0, rgba(206, 192, 177, 0.27) 0.8px, transparent 1.6px), radial-gradient(circle at 92px 134px, rgba(206, 192, 177, 0.52) 0, rgba(206, 192, 177, 0.39) 0.9px, transparent 1.7px), radial-gradient(circle at 77px 107px, rgba(206, 192, 177, 0.29) 0, rgba(206, 192, 177, 0.22) 1.0px, transparent 1.8px), radial-gradient(circle at 147px 41px, rgba(206, 192, 177, 0.28) 0, rgba(206, 192, 177, 0.21) 0.9px, transparent 1.7px), radial-gradient(circle at 75px 105px, rgba(206, 192, 177, 0.40) 0, rgba(206, 192, 177, 0.30) 1.4px, transparent 2.2px), radial-gradient(circle at 111px 51px, rgba(206, 192, 177, 0.30) 0, rgba(206, 192, 177, 0.23) 1.3px, transparent 2.1px), radial-gradient(circle at 135px 19px, rgba(206, 192, 177, 0.31) 0, rgba(206, 192, 177, 0.23) 0.8px, transparent 1.6px), radial-gradient(circle at 61px 77px, rgba(206, 192, 177, 0.52) 0, rgba(206, 192, 177, 0.39) 1.5px, transparent 2.3px), radial-gradient(circle at 82px 63px, rgba(206, 192, 177, 0.49) 0, rgba(206, 192, 177, 0.37) 1.5px, transparent 2.3px), radial-gradient(circle at 4px 65px, rgba(206, 192, 177, 0.43) 0, rgba(206, 192, 177, 0.32) 0.6px, transparent 1.4px), radial-gradient(circle at 148px 67px, rgba(206, 192, 177, 0.32) 0, rgba(206, 192, 177, 0.24) 1.5px, transparent 2.3px), radial-gradient(circle at 62px 31px, rgba(206, 192, 177, 0.39) 0, rgba(206, 192, 177, 0.29) 0.7px, transparent 1.5px), radial-gradient(circle at 46px 123px, rgba(206, 192, 177, 0.41) 0, rgba(206, 192, 177, 0.31) 0.9px, transparent 1.7px), radial-gradient(circle at 120px 115px, rgba(206, 192, 177, 0.51) 0, rgba(206, 192, 177, 0.38) 0.8px, transparent 1.6px), radial-gradient(circle at 129px 129px, rgba(206, 192, 177, 0.50) 0, rgba(206, 192, 177, 0.37) 1.4px, transparent 2.2px), radial-gradient(circle at 17px 57px, rgba(206, 192, 177, 0.44) 0, rgba(206, 192, 177, 0.33) 1.3px, transparent 2.1px), radial-gradient(circle at 98px 73px, rgba(206, 192, 177, 0.44) 0, rgba(206, 192, 177, 0.33) 0.8px, transparent 1.6px), radial-gradient(circle at 92px 119px, rgba(206, 192, 177, 0.39) 0, rgba(206, 192, 177, 0.29) 1.2px, transparent 2.0px), radial-gradient(circle at 60px 73px, rgba(206, 192, 177, 0.32) 0, rgba(206, 192, 177, 0.24) 0.8px, transparent 1.6px); --drift-size: 150px; --drift-dir: 150px; --drift-dur: 36s; --drift-op: 0.60; --glow-dur: 28s; --tint-blue: #f0f5ff; --tint-blue-bd: #c0d4ff; --tint-blue-tx: #1d5fa8; --tint-purple: #f7f0ff; --tint-purple-bd: #ddc8f5; --tint-purple-tx: #6d3fb8; --tint-teal: #edfbf8; --tint-teal-bd: #b0ebe2; --tint-teal-tx: #0e7d6d; --tint-green: #edf7ed; --tint-green-bd: #bce8bb; --tint-green-tx: #1d7a3a; --tint-gray: #f5f6f8; --tint-gray-bd: #d8dde4; --tint-gray-tx: #4a5568; --tint-orange: #fff3e6; --tint-orange-bd: #ffd9b0; --tint-orange-tx: #a05a14; --tint-red: #ffecec; --tint-red-bd: #ffc9c9; --tint-red-tx: #b03030; --tint-yellow: #fff7e6; --tint-yellow-bd: #ffe1a6; --tint-yellow-tx: #8a6a14; } /* ===== 🧊 薄荷冰 ===== */ [data-theme="mint"] { color-scheme: light; --primary: #12b3a0; --primary-dark: #0e9686; --primary-deep: #109e8d; --primary-bg: #e6f8f5; --primary-soft: rgba(18, 179, 160, 0.12); --blue: #1677ff; --bg: #f2f7f6; --card: #ffffff; --surface: #fafcfc; --hover-bg: #f3f7f6; --border: #e0ecea; --text: #1a2b29; --text-sub: #374c49; --muted: #83a09c; --danger: #e5484d; --warn: #f5a524; --danger-bg: #fdf2f3; --danger-text: #c33d41; --danger-border: #e2b3b3; --warn-bg: #fef7eb; --warn-text: #c4841d; --warn-border: #e8d09b; --side-bg: #123330; --side-bg2: #0f2c29; --side-text: #d9dede; --side-nav: #bdc6c5; --side-muted: #849593; --side-hover: rgba(255, 255, 255, 0.07); --side-active: #12b3a0; --side-active-text: #ffffff; --side-foot-text: #768987; --side-user-bg: rgba(255, 255, 255, 0.06); --side-user-sub: #9ba9a8; --login-bg1: #0a2422; --login-bg2: #133a36; --login-bg3: #0e2c29; --login-hero: #e7ebeb; --login-hero-sub: #8ea19f; --login-point: #b4c1c0; --login-point-line: rgba(142, 161, 159, 0.18); --login-accent: #a8f0e4; --login-link: #abdbd6; --login-glass: rgba(255, 255, 255, 0.08); --login-glass-line: rgba(101, 206, 193, 0.5); --login-glass-line2: rgba(101, 206, 193, 0.35); --login-yixn: #c5cfce; --login-card: #ffffff; --login-tab-bg: #f8fbfa; --login-tab-text: #647d7a; --login-label: #374c49; --login-input-bg: #fafcfb; --login-input-border: #e0ecea; --login-tip: #83a09c; --login-divider: #e0ecea; --input-bg: #ffffff; --radius: 10px; --shadow: 0 1px 3px rgba(0, 0, 0, 0.06); --side-grad: linear-gradient(170deg, #203f3c 0%, #123330 58%, #124742 100%); --side-art: url("data:image/svg+xml,"); --side-art-op: 0.19; --side-pattern: url("data:image/svg+xml,"); --side-pattern-op: 0.09; --side-glow: radial-gradient(ellipse 90% 46% at 50% 0%, rgba(136, 217, 208, 0.20), transparent 62%); --login-art: url("data:image/svg+xml,"); --login-art-op: 0.24; --login-mesh: radial-gradient(ellipse 62% 52% at 76% 16%, rgba(18, 179, 160, 0.26), transparent 60%), radial-gradient(ellipse 54% 44% at 14% 82%, rgba(168, 240, 228, 0.18), transparent 62%), radial-gradient(circle at 50% 112%, rgba(18, 179, 160, 0.16), transparent 56%); --login-art-pos: center; --login-art-size: cover; --login-art-repeat: no-repeat; --top-grad: linear-gradient(180deg, #ffffff 0%, #eefaf8 100%); --main-grad: radial-gradient(circle at 10% -6%, rgba(18, 179, 160, 0.09), transparent 44%), radial-gradient(circle at 92% 4%, rgba(168, 240, 228, 0.08), transparent 40%); --drift: radial-gradient(circle at 53px 145px, transparent 1.7px, rgba(155, 223, 215, 0.48) 2.5px, transparent 3.1px), radial-gradient(circle at 51px 143px, rgba(155, 223, 215, 0.48) 0, rgba(155, 223, 215, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 52px 58px, transparent 3.4px, rgba(155, 223, 215, 0.55) 5.0px, transparent 6.2px), radial-gradient(circle at 51px 56px, rgba(155, 223, 215, 0.48) 0, rgba(155, 223, 215, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 61px 33px, transparent 2.4px, rgba(155, 223, 215, 0.55) 3.5px, transparent 4.3px), radial-gradient(circle at 60px 32px, rgba(155, 223, 215, 0.48) 0, rgba(155, 223, 215, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 138px 30px, transparent 3.3px, rgba(155, 223, 215, 0.39) 4.8px, transparent 6.0px), radial-gradient(circle at 136px 28px, rgba(155, 223, 215, 0.48) 0, rgba(155, 223, 215, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 129px 141px, transparent 1.9px, rgba(155, 223, 215, 0.58) 2.8px, transparent 3.5px), radial-gradient(circle at 128px 140px, rgba(155, 223, 215, 0.48) 0, rgba(155, 223, 215, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 14px 115px, transparent 2.6px, rgba(155, 223, 215, 0.40) 3.9px, transparent 4.8px), radial-gradient(circle at 13px 114px, rgba(155, 223, 215, 0.48) 0, rgba(155, 223, 215, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 30px 91px, transparent 2.8px, rgba(155, 223, 215, 0.52) 4.1px, transparent 5.1px), radial-gradient(circle at 28px 90px, rgba(155, 223, 215, 0.48) 0, rgba(155, 223, 215, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 88px 54px, transparent 1.7px, rgba(155, 223, 215, 0.44) 2.5px, transparent 3.1px), radial-gradient(circle at 87px 53px, rgba(155, 223, 215, 0.48) 0, rgba(155, 223, 215, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 37px 137px, transparent 2.1px, rgba(155, 223, 215, 0.48) 3.1px, transparent 3.9px), radial-gradient(circle at 35px 136px, rgba(155, 223, 215, 0.48) 0, rgba(155, 223, 215, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 41px 54px, transparent 3.0px, rgba(155, 223, 215, 0.59) 4.4px, transparent 5.5px), radial-gradient(circle at 40px 53px, rgba(155, 223, 215, 0.48) 0, rgba(155, 223, 215, 0.36) 0.9px, transparent 1.4px); --drift-size: 150px; --drift-dir: -150px; --drift-dur: 28s; --drift-op: 0.60; --glow-dur: 20s; --tint-blue: #f0f5ff; --tint-blue-bd: #c0d4ff; --tint-blue-tx: #1d5fa8; --tint-purple: #f7f0ff; --tint-purple-bd: #ddc8f5; --tint-purple-tx: #6d3fb8; --tint-teal: #edfbf8; --tint-teal-bd: #b0ebe2; --tint-teal-tx: #0e7d6d; --tint-green: #edf7ed; --tint-green-bd: #bce8bb; --tint-green-tx: #1d7a3a; --tint-gray: #f5f6f8; --tint-gray-bd: #d8dde4; --tint-gray-tx: #4a5568; --tint-orange: #fff3e6; --tint-orange-bd: #ffd9b0; --tint-orange-tx: #a05a14; --tint-red: #ffecec; --tint-red-bd: #ffc9c9; --tint-red-tx: #b03030; --tint-yellow: #fff7e6; --tint-yellow-bd: #ffe1a6; --tint-yellow-tx: #8a6a14; } /* ===== 🌹 玫瑰粉 ===== */ [data-theme="rose"] { color-scheme: light; --primary: #e0558a; --primary-dark: #c94376; --primary-deep: #c54b79; --primary-bg: #fdecf3; --primary-soft: rgba(224, 85, 138, 0.12); --blue: #1677ff; --bg: #faf6f8; --card: #ffffff; --surface: #fdfcfd; --hover-bg: #faf6f8; --border: #f2e3ea; --text: #2c2026; --text-sub: #4c3d45; --muted: #a08693; --danger: #e5484d; --warn: #f5a524; --danger-bg: #fdf2f3; --danger-text: #c33d41; --danger-border: #edadb3; --warn-bg: #fef7eb; --warn-text: #c4841d; --warn-border: #f3ca9b; --side-bg: #331a26; --side-bg2: #2c1621; --side-text: #dedadc; --side-nav: #c6bfc2; --side-muted: #95888e; --side-hover: rgba(255, 255, 255, 0.07); --side-active: #e0558a; --side-active-text: #ffffff; --side-foot-text: #897a81; --side-user-bg: rgba(255, 255, 255, 0.06); --side-user-sub: #a99fa4; --login-bg1: #2a101c; --login-bg2: #421a2d; --login-bg3: #331322; --login-hero: #ece8ea; --login-hero-sub: #a5919b; --login-point: #c3b7bd; --login-point-line: rgba(165, 145, 155, 0.18); --login-accent: #ffc4dc; --login-link: #e9bfcf; --login-glass: rgba(255, 255, 255, 0.08); --login-glass-line: rgba(235, 144, 179, 0.5); --login-glass-line2: rgba(235, 144, 179, 0.35); --login-yixn: #d1c7cc; --login-card: #ffffff; --login-tab-bg: #fcfafc; --login-tab-text: #7d6772; --login-label: #4c3d45; --login-input-bg: #fdfbfc; --login-input-border: #f2e3ea; --login-tip: #a08693; --login-divider: #f2e3ea; --input-bg: #ffffff; --radius: 10px; --shadow: 0 1px 3px rgba(0, 0, 0, 0.06); --side-grad: linear-gradient(170deg, #3f2833 0%, #331a26 58%, #4f2336 100%); --side-art: url("data:image/svg+xml,"); --side-art-op: 0.19; --side-pattern: url("data:image/svg+xml,"); --side-pattern-op: 0.09; --side-glow: radial-gradient(ellipse 90% 46% at 50% 0%, rgba(240, 170, 196, 0.20), transparent 62%); --login-art: url("data:image/svg+xml,"); --login-art-op: 0.24; --login-mesh: radial-gradient(ellipse 62% 52% at 76% 16%, rgba(224, 85, 138, 0.26), transparent 60%), radial-gradient(ellipse 54% 44% at 14% 82%, rgba(255, 196, 220, 0.18), transparent 62%), radial-gradient(circle at 50% 112%, rgba(224, 85, 138, 0.16), transparent 56%); --login-art-pos: center; --login-art-size: cover; --login-art-repeat: no-repeat; --top-grad: linear-gradient(180deg, #ffffff 0%, #fdf3f7 100%); --main-grad: radial-gradient(circle at 10% -6%, rgba(224, 85, 138, 0.09), transparent 44%), radial-gradient(circle at 92% 4%, rgba(255, 196, 220, 0.08), transparent 40%); --drift: none; --drift-size: 150px; --drift-dir: 150px; --drift-dur: 30s; --drift-op: 0; --glow-dur: 16s; --tint-blue: #f0f5ff; --tint-blue-bd: #c0d4ff; --tint-blue-tx: #1d5fa8; --tint-purple: #f7f0ff; --tint-purple-bd: #ddc8f5; --tint-purple-tx: #6d3fb8; --tint-teal: #edfbf8; --tint-teal-bd: #b0ebe2; --tint-teal-tx: #0e7d6d; --tint-green: #edf7ed; --tint-green-bd: #bce8bb; --tint-green-tx: #1d7a3a; --tint-gray: #f5f6f8; --tint-gray-bd: #d8dde4; --tint-gray-tx: #4a5568; --tint-orange: #fff3e6; --tint-orange-bd: #ffd9b0; --tint-orange-tx: #a05a14; --tint-red: #ffecec; --tint-red-bd: #ffc9c9; --tint-red-tx: #b03030; --tint-yellow: #fff7e6; --tint-yellow-bd: #ffe1a6; --tint-yellow-tx: #8a6a14; } /* ===== 🌲 松柏墨绿 ===== */ [data-theme="pine"] { color-scheme: dark; --primary: #4caf7d; --primary-dark: #3d9067; --primary-deep: #439a6e; --primary-bg: rgba(76,175,125,0.14); --primary-soft: rgba(76, 175, 125, 0.18); --blue: #6ba4ff; --bg: #121815; --card: #272c2a; --surface: #202523; --hover-bg: #202623; --border: #434745; --text: #e4ece7; --text-sub: #cad5ce; --muted: #87998f; --danger: #ff6b6b; --warn: #ffb340; --danger-bg: #413432; --danger-text: #ff9f9f; --danger-border: #855452; --warn-bg: #413c2d; --warn-text: #ffca79; --warn-border: #8e7243; --side-bg: #0d130f; --side-bg2: #0b100d; --side-text: #d8d9d9; --side-nav: #bbbdbc; --side-muted: #818482; --side-hover: rgba(255, 255, 255, 0.07); --side-active: #4caf7d; --side-active-text: #ffffff; --side-foot-text: #737674; --side-user-bg: rgba(255, 255, 255, 0.06); --side-user-sub: #999c9a; --login-bg1: #08120c; --login-bg2: #0f1d15; --login-bg3: #0b1610; --login-hero: #e7e8e8; --login-hero-sub: #8c938f; --login-point: #b3b7b5; --login-point-line: rgba(140, 147, 143, 0.18); --login-accent: #bfe8cf; --login-link: #bcd8ca; --login-glass: rgba(255, 255, 255, 0.08); --login-glass-line: rgba(139, 203, 170, 0.5); --login-glass-line2: rgba(139, 203, 170, 0.35); --login-yixn: #c4c8c6; --login-card: #272c2a; --login-tab-bg: #1c2220; --login-tab-text: #a3b2a9; --login-label: #cad5ce; --login-input-bg: #1f2422; --login-input-border: #434745; --login-tip: #87998f; --login-divider: #434745; --input-bg: #272c2a; --radius: 10px; --shadow: 0 1px 3px rgba(0, 0, 0, 0.4); --side-grad: linear-gradient(170deg, #1c211d 0%, #0d130f 58%, #172c21 100%); --side-art: url("data:image/svg+xml,"); --side-art-op: 0.19; --side-pattern: url("data:image/svg+xml,"); --side-pattern-op: 0.09; --side-glow: radial-gradient(ellipse 90% 46% at 50% 0%, rgba(166, 215, 190, 0.20), transparent 62%); --login-art: url("data:image/svg+xml,"); --login-art-op: 0.24; --login-mesh: radial-gradient(ellipse 62% 52% at 76% 16%, rgba(76, 175, 125, 0.26), transparent 60%), radial-gradient(ellipse 54% 44% at 14% 82%, rgba(191, 232, 207, 0.18), transparent 62%), radial-gradient(circle at 50% 112%, rgba(76, 175, 125, 0.16), transparent 56%); --login-art-pos: right bottom; --login-art-size: cover; --login-art-repeat: no-repeat; --top-grad: linear-gradient(180deg, #272c2a 0%, #2b3932 100%); --main-grad: radial-gradient(circle at 10% -6%, rgba(76, 175, 125, 0.16), transparent 44%), radial-gradient(circle at 92% 4%, rgba(191, 232, 207, 0.13), transparent 40%); --drift: radial-gradient(circle at 64px 108px, rgba(180, 221, 200, 0.41) 0, rgba(180, 221, 200, 0.31) 1.2px, transparent 2.0px), radial-gradient(circle at 92px 76px, rgba(180, 221, 200, 0.42) 0, rgba(180, 221, 200, 0.32) 1.3px, transparent 2.1px), radial-gradient(circle at 16px 117px, rgba(180, 221, 200, 0.37) 0, rgba(180, 221, 200, 0.28) 0.8px, transparent 1.6px), radial-gradient(circle at 22px 84px, rgba(180, 221, 200, 0.36) 0, rgba(180, 221, 200, 0.27) 0.8px, transparent 1.6px), radial-gradient(circle at 92px 134px, rgba(180, 221, 200, 0.52) 0, rgba(180, 221, 200, 0.39) 0.9px, transparent 1.7px), radial-gradient(circle at 77px 107px, rgba(180, 221, 200, 0.29) 0, rgba(180, 221, 200, 0.22) 1.0px, transparent 1.8px), radial-gradient(circle at 147px 41px, rgba(180, 221, 200, 0.28) 0, rgba(180, 221, 200, 0.21) 0.9px, transparent 1.7px), radial-gradient(circle at 75px 105px, rgba(180, 221, 200, 0.40) 0, rgba(180, 221, 200, 0.30) 1.4px, transparent 2.2px), radial-gradient(circle at 111px 51px, rgba(180, 221, 200, 0.30) 0, rgba(180, 221, 200, 0.23) 1.3px, transparent 2.1px), radial-gradient(circle at 135px 19px, rgba(180, 221, 200, 0.31) 0, rgba(180, 221, 200, 0.23) 0.8px, transparent 1.6px), radial-gradient(circle at 61px 77px, rgba(180, 221, 200, 0.52) 0, rgba(180, 221, 200, 0.39) 1.5px, transparent 2.3px), radial-gradient(circle at 82px 63px, rgba(180, 221, 200, 0.49) 0, rgba(180, 221, 200, 0.37) 1.5px, transparent 2.3px), radial-gradient(circle at 4px 65px, rgba(180, 221, 200, 0.43) 0, rgba(180, 221, 200, 0.32) 0.6px, transparent 1.4px), radial-gradient(circle at 148px 67px, rgba(180, 221, 200, 0.32) 0, rgba(180, 221, 200, 0.24) 1.5px, transparent 2.3px), radial-gradient(circle at 62px 31px, rgba(180, 221, 200, 0.39) 0, rgba(180, 221, 200, 0.29) 0.7px, transparent 1.5px), radial-gradient(circle at 46px 123px, rgba(180, 221, 200, 0.41) 0, rgba(180, 221, 200, 0.31) 0.9px, transparent 1.7px), radial-gradient(circle at 120px 115px, rgba(180, 221, 200, 0.51) 0, rgba(180, 221, 200, 0.38) 0.8px, transparent 1.6px), radial-gradient(circle at 129px 129px, rgba(180, 221, 200, 0.50) 0, rgba(180, 221, 200, 0.37) 1.4px, transparent 2.2px), radial-gradient(circle at 17px 57px, rgba(180, 221, 200, 0.44) 0, rgba(180, 221, 200, 0.33) 1.3px, transparent 2.1px), radial-gradient(circle at 98px 73px, rgba(180, 221, 200, 0.44) 0, rgba(180, 221, 200, 0.33) 0.8px, transparent 1.6px), radial-gradient(circle at 92px 119px, rgba(180, 221, 200, 0.39) 0, rgba(180, 221, 200, 0.29) 1.2px, transparent 2.0px), radial-gradient(circle at 60px 73px, rgba(180, 221, 200, 0.32) 0, rgba(180, 221, 200, 0.24) 0.8px, transparent 1.6px); --drift-size: 150px; --drift-dir: 150px; --drift-dur: 34s; --drift-op: 0.60; --glow-dur: 26s; --tint-blue: #474c4c; --tint-blue-bd: #6b7481; --tint-blue-tx: #85a9d0; --tint-purple: #484b4c; --tint-purple-bd: #74707d; --tint-purple-tx: #b097d9; --tint-teal: #474d4b; --tint-teal-bd: #667b77; --tint-teal-tx: #7db9b0; --tint-green: #474c49; --tint-green-bd: #6a7b6b; --tint-green-tx: #85b795; --tint-gray: #484c4b; --tint-gray-bd: #737778; --tint-gray-tx: #9da3ad; --tint-orange: #4a4c48; --tint-orange-bd: #7f7667; --tint-orange-tx: #cca680; --tint-red: #4a4b49; --tint-red-bd: #7f716f; --tint-red-tx: #d48f8f; --tint-yellow: #4a4c48; --tint-yellow-bd: #7f7864; --tint-yellow-tx: #c0af80; } /* ===== 🟡 琥珀金 ===== */ [data-theme="amber"] { color-scheme: light; --primary: #c98a12; --primary-dark: #a9720d; --primary-deep: #95660d; --primary-bg: #fdf5e3; --primary-soft: rgba(201, 138, 18, 0.12); --blue: #1677ff; --bg: #fbf8f1; --card: #fffefb; --surface: #fefcf8; --hover-bg: #fbf8f2; --border: #eee4cd; --text: #2b2519; --text-sub: #494131; --muted: #968a6f; --danger: #e5484d; --warn: #f5a524; --danger-bg: #fdf2f3; --danger-text: #c33d41; --danger-border: #ebada0; --warn-bg: #fef7eb; --warn-text: #c4841d; --warn-border: #f1cb89; --side-bg: #332913; --side-bg2: #2c2310; --side-text: #deddd9; --side-nav: #c6c3bd; --side-muted: #959084; --side-hover: rgba(255, 255, 255, 0.07); --side-active: #c98a12; --side-active-text: #ffffff; --side-foot-text: #898376; --side-user-bg: rgba(255, 255, 255, 0.06); --side-user-sub: #a9a59c; --login-bg1: #261d0a; --login-bg2: #3d3014; --login-bg3: #2f240e; --login-hero: #eceae8; --login-hero-sub: #a29c8f; --login-point: #c2bdb5; --login-point-line: rgba(162, 156, 143, 0.18); --login-accent: #ffe6a3; --login-link: #e2cfac; --login-glass: rgba(255, 255, 255, 0.08); --login-glass-line: rgba(220, 179, 101, 0.5); --login-glass-line2: rgba(220, 179, 101, 0.35); --login-yixn: #d0ccc6; --login-card: #ffffff; --login-tab-bg: #fdfcf8; --login-tab-text: #766c55; --login-label: #494131; --login-input-bg: #fdfcf9; --login-input-border: #eee4cd; --login-tip: #968a6f; --login-divider: #eee4cd; --input-bg: #fffefb; --radius: 10px; --shadow: 0 1px 3px rgba(0, 0, 0, 0.06); --side-grad: linear-gradient(170deg, #3f3621 0%, #332913 58%, #4b3913 100%); --side-art: url("data:image/svg+xml,"); --side-art-op: 0.19; --side-pattern: url("data:image/svg+xml,"); --side-pattern-op: 0.09; --side-glow: radial-gradient(ellipse 90% 46% at 50% 0%, rgba(228, 196, 136, 0.20), transparent 62%); --login-art: url("data:image/svg+xml,"); --login-art-op: 0.24; --login-mesh: radial-gradient(ellipse 62% 52% at 76% 16%, rgba(201, 138, 18, 0.26), transparent 60%), radial-gradient(ellipse 54% 44% at 14% 82%, rgba(255, 230, 163, 0.18), transparent 62%), radial-gradient(circle at 50% 112%, rgba(201, 138, 18, 0.16), transparent 56%); --login-art-pos: center; --login-art-size: cover; --login-art-repeat: no-repeat; --top-grad: linear-gradient(180deg, #fffefb 0%, #fbf6eb 100%); --main-grad: radial-gradient(circle at 10% -6%, rgba(201, 138, 18, 0.09), transparent 44%), radial-gradient(circle at 92% 4%, rgba(255, 230, 163, 0.08), transparent 40%); --drift: none; --drift-size: 150px; --drift-dir: 150px; --drift-dur: 30s; --drift-op: 0; --glow-dur: 16s; --tint-blue: #f0f5ff; --tint-blue-bd: #c0d4ff; --tint-blue-tx: #1d5fa8; --tint-purple: #f7f0ff; --tint-purple-bd: #ddc8f5; --tint-purple-tx: #6d3fb8; --tint-teal: #edfbf8; --tint-teal-bd: #b0ebe2; --tint-teal-tx: #0e7d6d; --tint-green: #edf7ed; --tint-green-bd: #bce8bb; --tint-green-tx: #1d7a3a; --tint-gray: #f5f6f8; --tint-gray-bd: #d8dde4; --tint-gray-tx: #4a5568; --tint-orange: #fff3e6; --tint-orange-bd: #ffd9b0; --tint-orange-tx: #a05a14; --tint-red: #ffecec; --tint-red-bd: #ffc9c9; --tint-red-tx: #b03030; --tint-yellow: #fff7e6; --tint-yellow-bd: #ffe1a6; --tint-yellow-tx: #8a6a14; } /* ===== 🔵 靛青 ===== */ [data-theme="indigo"] { color-scheme: dark; --primary: #5b7cfa; --primary-dark: #4364e0; --primary-deep: #506ddc; --primary-bg: rgba(91,124,250,0.15); --primary-soft: rgba(91, 124, 250, 0.18); --blue: #6ba4ff; --bg: #131620; --card: #282b34; --surface: #21242d; --hover-bg: #21242d; --border: #43464e; --text: #e6e9f2; --text-sub: #ccd0dc; --muted: #8a90a3; --danger: #ff6b6b; --warn: #ffb340; --danger-bg: #42333b; --danger-text: #ff9f9f; --danger-border: #855358; --warn-bg: #423b35; --warn-text: #ffca79; --warn-border: #8e7248; --side-bg: #0e1018; --side-bg2: #0c0e15; --side-text: #d8d9da; --side-nav: #bcbcbe; --side-muted: #828387; --side-hover: rgba(255, 255, 255, 0.07); --side-active: #5b7cfa; --side-active-text: #ffffff; --side-foot-text: #737479; --side-user-bg: rgba(255, 255, 255, 0.06); --side-user-sub: #9a9b9e; --login-bg1: #090b12; --login-bg2: #141827; --login-bg3: #0f121d; --login-hero: #e8e8e9; --login-hero-sub: #8f9198; --login-point: #b5b6ba; --login-point-line: rgba(143, 145, 152, 0.18); --login-accent: #b9c6ff; --login-link: #c1caee; --login-glass: rgba(255, 255, 255, 0.08); --login-glass-line: rgba(148, 170, 252, 0.5); --login-glass-line2: rgba(148, 170, 252, 0.35); --login-yixn: #c6c7ca; --login-card: #282b34; --login-tab-bg: #1e202a; --login-tab-text: #a6abbb; --login-label: #ccd0dc; --login-input-bg: #20232c; --login-input-border: #43464e; --login-tip: #8a90a3; --login-divider: #43464e; --input-bg: #282b34; --radius: 10px; --shadow: 0 1px 3px rgba(0, 0, 0, 0.4); --side-grad: linear-gradient(170deg, #1c1e26 0%, #0e1018 58%, #1a213c 100%); --side-art: url("data:image/svg+xml,"); --side-art-op: 0.26; --side-pattern: url("data:image/svg+xml,"); --side-pattern-op: 0.09; --side-glow: radial-gradient(ellipse 90% 46% at 50% 0%, rgba(173, 190, 252, 0.20), transparent 62%); --login-art: url("data:image/svg+xml,"); --login-art-op: 0.32; --login-mesh: radial-gradient(ellipse 62% 52% at 76% 16%, rgba(91, 124, 250, 0.26), transparent 60%), radial-gradient(ellipse 54% 44% at 14% 82%, rgba(185, 198, 255, 0.18), transparent 62%), radial-gradient(circle at 50% 112%, rgba(91, 124, 250, 0.16), transparent 56%); --login-art-pos: center; --login-art-size: 760px 760px; --login-art-repeat: repeat; --top-grad: linear-gradient(180deg, #282b34 0%, #2d3348 100%); --main-grad: radial-gradient(circle at 10% -6%, rgba(91, 124, 250, 0.16), transparent 44%), radial-gradient(circle at 92% 4%, rgba(185, 198, 255, 0.13), transparent 40%); --drift: radial-gradient(circle at 72px 74px, rgba(186, 200, 253, 0.44) 0, rgba(186, 200, 253, 0.33) 1.4px, transparent 2.1px), radial-gradient(circle at 72px 74px, rgba(186, 200, 253, 0.13) 0, transparent 5.4px), radial-gradient(circle at 86px 91px, rgba(186, 200, 253, 0.39) 0, rgba(186, 200, 253, 0.29) 1.6px, transparent 2.3px), radial-gradient(circle at 86px 91px, rgba(186, 200, 253, 0.12) 0, transparent 6.0px), radial-gradient(circle at 52px 21px, rgba(186, 200, 253, 0.44) 0, rgba(186, 200, 253, 0.33) 1.1px, transparent 1.8px), radial-gradient(circle at 52px 21px, rgba(186, 200, 253, 0.13) 0, transparent 7.5px), radial-gradient(circle at 58px 82px, rgba(186, 200, 253, 0.60) 0, rgba(186, 200, 253, 0.45) 1.6px, transparent 2.3px), radial-gradient(circle at 58px 82px, rgba(186, 200, 253, 0.18) 0, transparent 4.9px), radial-gradient(circle at 37px 40px, rgba(186, 200, 253, 0.60) 0, rgba(186, 200, 253, 0.45) 0.9px, transparent 1.6px), radial-gradient(circle at 37px 40px, rgba(186, 200, 253, 0.18) 0, transparent 7.6px), radial-gradient(circle at 109px 60px, rgba(186, 200, 253, 0.55) 0, rgba(186, 200, 253, 0.41) 0.9px, transparent 1.6px), radial-gradient(circle at 109px 60px, rgba(186, 200, 253, 0.16) 0, transparent 7.5px), radial-gradient(circle at 82px 59px, rgba(186, 200, 253, 0.56) 0, rgba(186, 200, 253, 0.42) 1.6px, transparent 2.3px), radial-gradient(circle at 82px 59px, rgba(186, 200, 253, 0.17) 0, transparent 5.8px), radial-gradient(circle at 20px 16px, rgba(186, 200, 253, 0.46) 0, rgba(186, 200, 253, 0.35) 1.6px, transparent 2.3px), radial-gradient(circle at 20px 16px, rgba(186, 200, 253, 0.14) 0, transparent 5.0px), radial-gradient(circle at 68px 129px, rgba(186, 200, 253, 0.50) 0, rgba(186, 200, 253, 0.37) 1.5px, transparent 2.2px), radial-gradient(circle at 68px 129px, rgba(186, 200, 253, 0.15) 0, transparent 5.8px), radial-gradient(circle at 120px 71px, rgba(186, 200, 253, 0.52) 0, rgba(186, 200, 253, 0.39) 1.1px, transparent 1.8px), radial-gradient(circle at 120px 71px, rgba(186, 200, 253, 0.16) 0, transparent 4.7px), radial-gradient(circle at 13px 108px, rgba(186, 200, 253, 0.56) 0, rgba(186, 200, 253, 0.42) 1.6px, transparent 2.3px), radial-gradient(circle at 13px 108px, rgba(186, 200, 253, 0.17) 0, transparent 5.7px); --drift-size: 150px; --drift-dir: 150px; --drift-dur: 34s; --drift-op: 0.60; --glow-dur: 26s; --tint-blue: #484b54; --tint-blue-bd: #6b7387; --tint-blue-tx: #85a9d0; --tint-purple: #494b54; --tint-purple-bd: #747083; --tint-purple-tx: #b097d9; --tint-teal: #484c53; --tint-teal-bd: #667b7d; --tint-teal-tx: #7db9b0; --tint-green: #484c52; --tint-green-bd: #6a7a71; --tint-green-tx: #85b795; --tint-gray: #494b53; --tint-gray-bd: #73767e; --tint-gray-tx: #9da3ad; --tint-orange: #4a4b50; --tint-orange-bd: #7f756d; --tint-orange-tx: #cca680; --tint-red: #4a4a51; --tint-red-bd: #7f7075; --tint-red-tx: #d48f8f; --tint-yellow: #4a4c50; --tint-yellow-bd: #7f786a; --tint-yellow-tx: #c0af80; } /* ===== 🌸 樱雪 ===== */ [data-theme="sakura"] { color-scheme: light; --primary: #6b7f8f; --primary-dark: #566a78; --primary-deep: #5e707e; --primary-bg: #eff3f6; --primary-soft: rgba(107, 127, 143, 0.12); --blue: #1677ff; --bg: #f7f8f9; --card: #ffffff; --surface: #fcfdfd; --hover-bg: #f7f8f9; --border: #e6e9ec; --text: #22272e; --text-sub: #40464d; --muted: #8d949c; --danger: #e5484d; --warn: #f5a524; --danger-bg: #fdf2f3; --danger-text: #c33d41; --danger-border: #e6b1b4; --warn-bg: #fef7eb; --warn-text: #c4841d; --warn-border: #ecce9c; --side-bg: #2b3138; --side-bg2: #252a30; --side-text: #dddedf; --side-nav: #c4c5c7; --side-muted: #919498; --side-hover: rgba(255, 255, 255, 0.07); --side-active: #6b7f8f; --side-active-text: #ffffff; --side-foot-text: #84888c; --side-user-bg: rgba(255, 255, 255, 0.06); --side-user-sub: #a6a8ab; --login-bg1: #1c2227; --login-bg2: #2c343b; --login-bg3: #232a30; --login-hero: #eaebeb; --login-hero-sub: #9a9ea1; --login-point: #bcbfc1; --login-point-line: rgba(154, 158, 161, 0.18); --login-accent: #dbe4ea; --login-link: #c6cdd1; --login-glass: rgba(255, 255, 255, 0.08); --login-glass-line: rgba(159, 172, 182, 0.5); --login-glass-line2: rgba(159, 172, 182, 0.35); --login-yixn: #cccecf; --login-card: #ffffff; --login-tab-bg: #fbfcfc; --login-tab-text: #6d737b; --login-label: #40464d; --login-input-bg: #fcfcfd; --login-input-border: #e6e9ec; --login-tip: #8d949c; --login-divider: #e6e9ec; --input-bg: #ffffff; --radius: 10px; --shadow: 0 1px 3px rgba(0, 0, 0, 0.06); --side-grad: linear-gradient(170deg, #383d44 0%, #2b3138 58%, #353d46 100%); --side-art: url("data:image/svg+xml,"); --side-art-op: 0.19; --side-pattern: url("data:image/svg+xml,"); --side-pattern-op: 0.09; --side-glow: radial-gradient(ellipse 90% 46% at 50% 0%, rgba(181, 191, 199, 0.20), transparent 62%); --login-art: url("data:image/svg+xml,"); --login-art-op: 0.24; --login-mesh: radial-gradient(ellipse 62% 52% at 76% 16%, rgba(107, 127, 143, 0.26), transparent 60%), radial-gradient(ellipse 54% 44% at 14% 82%, rgba(219, 228, 234, 0.18), transparent 62%), radial-gradient(circle at 50% 112%, rgba(107, 127, 143, 0.16), transparent 56%); --login-art-pos: center; --login-art-size: cover; --login-art-repeat: no-repeat; --top-grad: linear-gradient(180deg, #ffffff 0%, #f5f6f7 100%); --main-grad: radial-gradient(circle at 10% -6%, rgba(107, 127, 143, 0.09), transparent 44%), radial-gradient(circle at 92% 4%, rgba(219, 228, 234, 0.08), transparent 40%); --drift: url("data:image/svg+xml,"); --drift-size: 150px; --drift-dir: 150px; --drift-dur: 26s; --drift-op: 0.60; --glow-dur: 18s; --tint-blue: #f0f5ff; --tint-blue-bd: #c0d4ff; --tint-blue-tx: #1d5fa8; --tint-purple: #f7f0ff; --tint-purple-bd: #ddc8f5; --tint-purple-tx: #6d3fb8; --tint-teal: #edfbf8; --tint-teal-bd: #b0ebe2; --tint-teal-tx: #0e7d6d; --tint-green: #edf7ed; --tint-green-bd: #bce8bb; --tint-green-tx: #1d7a3a; --tint-gray: #f5f6f8; --tint-gray-bd: #d8dde4; --tint-gray-tx: #4a5568; --tint-orange: #fff3e6; --tint-orange-bd: #ffd9b0; --tint-orange-tx: #a05a14; --tint-red: #ffecec; --tint-red-bd: #ffc9c9; --tint-red-tx: #b03030; --tint-yellow: #fff7e6; --tint-yellow-bd: #ffe1a6; --tint-yellow-tx: #8a6a14; } /* ===== 🔮 星夜紫 ===== */ [data-theme="nebula"] { color-scheme: dark; --primary: #a97bf5; --primary-dark: #8f5fe0; --primary-deep: #7d5bb5; --primary-bg: rgba(169,123,245,0.15); --primary-soft: rgba(169, 123, 245, 0.18); --blue: #6ba4ff; --bg: #15121d; --card: #2a2731; --surface: #23202a; --hover-bg: #23202b; --border: #45434b; --text: #eae6f2; --text-sub: #d2cddd; --muted: #948ba6; --danger: #ff6b6b; --warn: #ffb340; --danger-bg: #442f38; --danger-text: #ff9f9f; --danger-border: #865156; --warn-bg: #443833; --warn-text: #ffca79; --warn-border: #8f7047; --side-bg: #100d17; --side-bg2: #0e0b14; --side-text: #d9d8da; --side-nav: #bcbbbe; --side-muted: #838186; --side-hover: rgba(255, 255, 255, 0.07); --side-active: #a97bf5; --side-active-text: #ffffff; --side-foot-text: #747378; --side-user-bg: rgba(255, 255, 255, 0.06); --side-user-sub: #9b999e; --login-bg1: #0b0912; --login-bg2: #171322; --login-bg3: #110e1a; --login-hero: #e8e7e9; --login-hero-sub: #908e95; --login-point: #b6b4b9; --login-point-line: rgba(144, 142, 149, 0.18); --login-accent: #d9c2ff; --login-link: #d6c9ec; --login-glass: rgba(255, 255, 255, 0.08); --login-glass-line: rgba(199, 169, 248, 0.5); --login-glass-line2: rgba(199, 169, 248, 0.35); --login-yixn: #c7c5c9; --login-card: #2a2731; --login-tab-bg: #201c27; --login-tab-text: #aea6bd; --login-label: #d2cddd; --login-input-bg: #221f29; --login-input-border: #45434b; --login-tip: #948ba6; --login-divider: #45434b; --input-bg: #2a2731; --radius: 10px; --shadow: 0 1px 3px rgba(0, 0, 0, 0.4); --side-grad: linear-gradient(170deg, #1e1c25 0%, #100d17 58%, #281f3b 100%); --side-art: url("data:image/svg+xml,"); --side-art-op: 0.19; --side-pattern: url("data:image/svg+xml,"); --side-pattern-op: 0.09; --side-glow: radial-gradient(ellipse 90% 46% at 50% 0%, rgba(212, 189, 250, 0.20), transparent 62%); --login-art: url("data:image/svg+xml,"); --login-art-op: 0.24; --login-mesh: radial-gradient(ellipse 62% 52% at 76% 16%, rgba(169, 123, 245, 0.26), transparent 60%), radial-gradient(ellipse 54% 44% at 14% 82%, rgba(217, 194, 255, 0.18), transparent 62%), radial-gradient(circle at 50% 112%, rgba(169, 123, 245, 0.16), transparent 56%); --login-art-pos: center; --login-art-size: cover; --login-art-repeat: no-repeat; --top-grad: linear-gradient(180deg, #2a2731 0%, #372f45 100%); --main-grad: radial-gradient(circle at 10% -6%, rgba(169, 123, 245, 0.16), transparent 44%), radial-gradient(circle at 92% 4%, rgba(217, 194, 255, 0.13), transparent 40%); --drift: radial-gradient(circle at 72px 74px, rgba(219, 200, 251, 0.44) 0, rgba(219, 200, 251, 0.33) 1.4px, transparent 2.1px), radial-gradient(circle at 72px 74px, rgba(219, 200, 251, 0.13) 0, transparent 5.4px), radial-gradient(circle at 86px 91px, rgba(219, 200, 251, 0.39) 0, rgba(219, 200, 251, 0.29) 1.6px, transparent 2.3px), radial-gradient(circle at 86px 91px, rgba(219, 200, 251, 0.12) 0, transparent 6.0px), radial-gradient(circle at 52px 21px, rgba(219, 200, 251, 0.44) 0, rgba(219, 200, 251, 0.33) 1.1px, transparent 1.8px), radial-gradient(circle at 52px 21px, rgba(219, 200, 251, 0.13) 0, transparent 7.5px), radial-gradient(circle at 58px 82px, rgba(219, 200, 251, 0.60) 0, rgba(219, 200, 251, 0.45) 1.6px, transparent 2.3px), radial-gradient(circle at 58px 82px, rgba(219, 200, 251, 0.18) 0, transparent 4.9px), radial-gradient(circle at 37px 40px, rgba(219, 200, 251, 0.60) 0, rgba(219, 200, 251, 0.45) 0.9px, transparent 1.6px), radial-gradient(circle at 37px 40px, rgba(219, 200, 251, 0.18) 0, transparent 7.6px), radial-gradient(circle at 109px 60px, rgba(219, 200, 251, 0.55) 0, rgba(219, 200, 251, 0.41) 0.9px, transparent 1.6px), radial-gradient(circle at 109px 60px, rgba(219, 200, 251, 0.16) 0, transparent 7.5px), radial-gradient(circle at 82px 59px, rgba(219, 200, 251, 0.56) 0, rgba(219, 200, 251, 0.42) 1.6px, transparent 2.3px), radial-gradient(circle at 82px 59px, rgba(219, 200, 251, 0.17) 0, transparent 5.8px), radial-gradient(circle at 20px 16px, rgba(219, 200, 251, 0.46) 0, rgba(219, 200, 251, 0.35) 1.6px, transparent 2.3px), radial-gradient(circle at 20px 16px, rgba(219, 200, 251, 0.14) 0, transparent 5.0px), radial-gradient(circle at 68px 129px, rgba(219, 200, 251, 0.50) 0, rgba(219, 200, 251, 0.37) 1.5px, transparent 2.2px), radial-gradient(circle at 68px 129px, rgba(219, 200, 251, 0.15) 0, transparent 5.8px), radial-gradient(circle at 120px 71px, rgba(219, 200, 251, 0.52) 0, rgba(219, 200, 251, 0.39) 1.1px, transparent 1.8px), radial-gradient(circle at 120px 71px, rgba(219, 200, 251, 0.16) 0, transparent 4.7px), radial-gradient(circle at 13px 108px, rgba(219, 200, 251, 0.56) 0, rgba(219, 200, 251, 0.42) 1.6px, transparent 2.3px), radial-gradient(circle at 13px 108px, rgba(219, 200, 251, 0.17) 0, transparent 5.7px); --drift-size: 150px; --drift-dir: 150px; --drift-dur: 30s; --drift-op: 0.60; --glow-dur: 22s; --tint-blue: #4a4852; --tint-blue-bd: #6c7185; --tint-blue-tx: #85a9d0; --tint-purple: #4b4752; --tint-purple-bd: #766e81; --tint-purple-tx: #b097d9; --tint-teal: #494951; --tint-teal-bd: #67797b; --tint-teal-tx: #7db9b0; --tint-green: #49484f; --tint-green-bd: #6b786f; --tint-green-tx: #85b795; --tint-gray: #4a4851; --tint-gray-bd: #74747c; --tint-gray-tx: #9da3ad; --tint-orange: #4c484e; --tint-orange-bd: #81736b; --tint-orange-tx: #cca680; --tint-red: #4c474f; --tint-red-bd: #816e73; --tint-red-tx: #d48f8f; --tint-yellow: #4c484e; --tint-yellow-bd: #817668; --tint-yellow-tx: #c0af80; } /* ===== 💧 湖光青 ===== */ [data-theme="lake"] { color-scheme: light; --primary: #1a9ecb; --primary-dark: #1485ac; --primary-deep: #178bb3; --primary-bg: #e7f5fa; --primary-soft: rgba(26, 158, 203, 0.12); --blue: #1677ff; --bg: #f3f7f9; --card: #ffffff; --surface: #fbfcfd; --hover-bg: #f3f7f9; --border: #e0eaf0; --text: #1a262c; --text-sub: #37464d; --muted: #8397a1; --danger: #e5484d; --warn: #f5a524; --danger-bg: #fdf2f3; --danger-text: #c33d41; --danger-border: #e2b1b7; --warn-bg: #fef7eb; --warn-text: #c4841d; --warn-border: #e8ce9e; --side-bg: #123341; --side-bg2: #0f2c38; --side-text: #d9dee1; --side-nav: #bdc6ca; --side-muted: #84959c; --side-hover: rgba(255, 255, 255, 0.07); --side-active: #1a9ecb; --side-active-text: #ffffff; --side-foot-text: #768991; --side-user-bg: rgba(255, 255, 255, 0.06); --side-user-sub: #9ba9af; --login-bg1: #0a2230; --login-bg2: #123546; --login-bg3: #0d2a38; --login-hero: #e7ebec; --login-hero-sub: #8e9fa6; --login-point: #b4bfc4; --login-point-line: rgba(142, 159, 166, 0.18); --login-accent: #a8e0f5; --login-link: #aed5e3; --login-glass: rgba(255, 255, 255, 0.08); --login-glass-line: rgba(106, 192, 221, 0.5); --login-glass-line2: rgba(106, 192, 221, 0.35); --login-yixn: #c5ced1; --login-card: #ffffff; --login-tab-bg: #f9fbfc; --login-tab-text: #64757e; --login-label: #37464d; --login-input-bg: #fafcfd; --login-input-border: #e0eaf0; --login-tip: #8397a1; --login-divider: #e0eaf0; --input-bg: #ffffff; --radius: 10px; --shadow: 0 1px 3px rgba(0, 0, 0, 0.06); --side-grad: linear-gradient(170deg, #203f4c 0%, #123341 58%, #134457 100%); --side-art: url("data:image/svg+xml,"); --side-art-op: 0.19; --side-pattern: url("data:image/svg+xml,"); --side-pattern-op: 0.09; --side-glow: radial-gradient(ellipse 90% 46% at 50% 0%, rgba(140, 206, 229, 0.20), transparent 62%); --login-art: url("data:image/svg+xml,"); --login-art-op: 0.24; --login-mesh: radial-gradient(ellipse 62% 52% at 76% 16%, rgba(26, 158, 203, 0.26), transparent 60%), radial-gradient(ellipse 54% 44% at 14% 82%, rgba(168, 224, 245, 0.18), transparent 62%), radial-gradient(circle at 50% 112%, rgba(26, 158, 203, 0.16), transparent 56%); --login-art-pos: center bottom; --login-art-size: cover; --login-art-repeat: no-repeat; --top-grad: linear-gradient(180deg, #ffffff 0%, #eff8fb 100%); --main-grad: radial-gradient(circle at 10% -6%, rgba(26, 158, 203, 0.09), transparent 44%), radial-gradient(circle at 92% 4%, rgba(168, 224, 245, 0.08), transparent 40%); --drift: radial-gradient(circle at 53px 145px, transparent 1.7px, rgba(159, 214, 233, 0.48) 2.5px, transparent 3.1px), radial-gradient(circle at 51px 143px, rgba(159, 214, 233, 0.48) 0, rgba(159, 214, 233, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 52px 58px, transparent 3.4px, rgba(159, 214, 233, 0.55) 5.0px, transparent 6.2px), radial-gradient(circle at 51px 56px, rgba(159, 214, 233, 0.48) 0, rgba(159, 214, 233, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 61px 33px, transparent 2.4px, rgba(159, 214, 233, 0.55) 3.5px, transparent 4.3px), radial-gradient(circle at 60px 32px, rgba(159, 214, 233, 0.48) 0, rgba(159, 214, 233, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 138px 30px, transparent 3.3px, rgba(159, 214, 233, 0.39) 4.8px, transparent 6.0px), radial-gradient(circle at 136px 28px, rgba(159, 214, 233, 0.48) 0, rgba(159, 214, 233, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 129px 141px, transparent 1.9px, rgba(159, 214, 233, 0.58) 2.8px, transparent 3.5px), radial-gradient(circle at 128px 140px, rgba(159, 214, 233, 0.48) 0, rgba(159, 214, 233, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 14px 115px, transparent 2.6px, rgba(159, 214, 233, 0.40) 3.9px, transparent 4.8px), radial-gradient(circle at 13px 114px, rgba(159, 214, 233, 0.48) 0, rgba(159, 214, 233, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 30px 91px, transparent 2.8px, rgba(159, 214, 233, 0.52) 4.1px, transparent 5.1px), radial-gradient(circle at 28px 90px, rgba(159, 214, 233, 0.48) 0, rgba(159, 214, 233, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 88px 54px, transparent 1.7px, rgba(159, 214, 233, 0.44) 2.5px, transparent 3.1px), radial-gradient(circle at 87px 53px, rgba(159, 214, 233, 0.48) 0, rgba(159, 214, 233, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 37px 137px, transparent 2.1px, rgba(159, 214, 233, 0.48) 3.1px, transparent 3.9px), radial-gradient(circle at 35px 136px, rgba(159, 214, 233, 0.48) 0, rgba(159, 214, 233, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 41px 54px, transparent 3.0px, rgba(159, 214, 233, 0.59) 4.4px, transparent 5.5px), radial-gradient(circle at 40px 53px, rgba(159, 214, 233, 0.48) 0, rgba(159, 214, 233, 0.36) 0.9px, transparent 1.4px); --drift-size: 150px; --drift-dir: -150px; --drift-dur: 26s; --drift-op: 0.60; --glow-dur: 18s; --tint-blue: #f0f5ff; --tint-blue-bd: #c0d4ff; --tint-blue-tx: #1d5fa8; --tint-purple: #f7f0ff; --tint-purple-bd: #ddc8f5; --tint-purple-tx: #6d3fb8; --tint-teal: #edfbf8; --tint-teal-bd: #b0ebe2; --tint-teal-tx: #0e7d6d; --tint-green: #edf7ed; --tint-green-bd: #bce8bb; --tint-green-tx: #1d7a3a; --tint-gray: #f5f6f8; --tint-gray-bd: #d8dde4; --tint-gray-tx: #4a5568; --tint-orange: #fff3e6; --tint-orange-bd: #ffd9b0; --tint-orange-tx: #a05a14; --tint-red: #ffecec; --tint-red-bd: #ffc9c9; --tint-red-tx: #b03030; --tint-yellow: #fff7e6; --tint-yellow-bd: #ffe1a6; --tint-yellow-tx: #8a6a14; } /* ===== 🌾 燕麦米 ===== */ [data-theme="oat"] { color-scheme: light; --primary: #9a8b6f; --primary-dark: #82735a; --primary-deep: #726752; --primary-bg: #f8f5ee; --primary-soft: rgba(154, 139, 111, 0.12); --blue: #1677ff; --bg: #faf8f4; --card: #fffefc; --surface: #fdfcf9; --hover-bg: #faf8f4; --border: #ece7dc; --text: #2c2823; --text-sub: #49443d; --muted: #948d80; --danger: #e5484d; --warn: #f5a524; --danger-bg: #fdf2f3; --danger-text: #c33d41; --danger-border: #eaafaa; --warn-bg: #fef7eb; --warn-text: #c4841d; --warn-border: #f0cd92; --side-bg: #322c22; --side-bg2: #2b261d; --side-text: #dedddc; --side-nav: #c6c4c1; --side-muted: #94918c; --side-hover: rgba(255, 255, 255, 0.07); --side-active: #9a8b6f; --side-active-text: #ffffff; --side-foot-text: #88857f; --side-user-bg: rgba(255, 255, 255, 0.06); --side-user-sub: #a9a6a2; --login-bg1: #262017; --login-bg2: #3c3427; --login-bg3: #2e281d; --login-hero: #ecebe9; --login-hero-sub: #a29e98; --login-point: #c2bfba; --login-point-line: rgba(162, 158, 152, 0.18); --login-accent: #e6dcc4; --login-link: #d5d0c7; --login-glass: rgba(255, 255, 255, 0.08); --login-glass-line: rgba(189, 180, 161, 0.5); --login-glass-line2: rgba(189, 180, 161, 0.35); --login-yixn: #d0ceca; --login-card: #ffffff; --login-tab-bg: #fcfcfa; --login-tab-text: #756f64; --login-label: #49443d; --login-input-bg: #fdfcfb; --login-input-border: #ece7dc; --login-tip: #948d80; --login-divider: #ece7dc; --input-bg: #fffefc; --radius: 10px; --shadow: 0 1px 3px rgba(0, 0, 0, 0.06); --side-grad: linear-gradient(170deg, #3e392f 0%, #322c22 58%, #433b2e 100%); --side-art: url("data:image/svg+xml,"); --side-art-op: 0.26; --side-pattern: url("data:image/svg+xml,"); --side-pattern-op: 0.09; --side-glow: radial-gradient(ellipse 90% 46% at 50% 0%, rgba(204, 197, 183, 0.20), transparent 62%); --login-art: url("data:image/svg+xml,"); --login-art-op: 0.32; --login-mesh: radial-gradient(ellipse 62% 52% at 76% 16%, rgba(154, 139, 111, 0.26), transparent 60%), radial-gradient(ellipse 54% 44% at 14% 82%, rgba(230, 220, 196, 0.18), transparent 62%), radial-gradient(circle at 50% 112%, rgba(154, 139, 111, 0.16), transparent 56%); --login-art-pos: center; --login-art-size: 420px 420px; --login-art-repeat: repeat; --top-grad: linear-gradient(180deg, #fffefc 0%, #f8f6f2 100%); --main-grad: radial-gradient(circle at 10% -6%, rgba(154, 139, 111, 0.09), transparent 44%), radial-gradient(circle at 92% 4%, rgba(230, 220, 196, 0.08), transparent 40%); --drift: radial-gradient(circle at 64px 108px, rgba(213, 206, 195, 0.41) 0, rgba(213, 206, 195, 0.31) 1.2px, transparent 2.0px), radial-gradient(circle at 92px 76px, rgba(213, 206, 195, 0.42) 0, rgba(213, 206, 195, 0.32) 1.3px, transparent 2.1px), radial-gradient(circle at 16px 117px, rgba(213, 206, 195, 0.37) 0, rgba(213, 206, 195, 0.28) 0.8px, transparent 1.6px), radial-gradient(circle at 22px 84px, rgba(213, 206, 195, 0.36) 0, rgba(213, 206, 195, 0.27) 0.8px, transparent 1.6px), radial-gradient(circle at 92px 134px, rgba(213, 206, 195, 0.52) 0, rgba(213, 206, 195, 0.39) 0.9px, transparent 1.7px), radial-gradient(circle at 77px 107px, rgba(213, 206, 195, 0.29) 0, rgba(213, 206, 195, 0.22) 1.0px, transparent 1.8px), radial-gradient(circle at 147px 41px, rgba(213, 206, 195, 0.28) 0, rgba(213, 206, 195, 0.21) 0.9px, transparent 1.7px), radial-gradient(circle at 75px 105px, rgba(213, 206, 195, 0.40) 0, rgba(213, 206, 195, 0.30) 1.4px, transparent 2.2px), radial-gradient(circle at 111px 51px, rgba(213, 206, 195, 0.30) 0, rgba(213, 206, 195, 0.23) 1.3px, transparent 2.1px), radial-gradient(circle at 135px 19px, rgba(213, 206, 195, 0.31) 0, rgba(213, 206, 195, 0.23) 0.8px, transparent 1.6px), radial-gradient(circle at 61px 77px, rgba(213, 206, 195, 0.52) 0, rgba(213, 206, 195, 0.39) 1.5px, transparent 2.3px), radial-gradient(circle at 82px 63px, rgba(213, 206, 195, 0.49) 0, rgba(213, 206, 195, 0.37) 1.5px, transparent 2.3px), radial-gradient(circle at 4px 65px, rgba(213, 206, 195, 0.43) 0, rgba(213, 206, 195, 0.32) 0.6px, transparent 1.4px), radial-gradient(circle at 148px 67px, rgba(213, 206, 195, 0.32) 0, rgba(213, 206, 195, 0.24) 1.5px, transparent 2.3px), radial-gradient(circle at 62px 31px, rgba(213, 206, 195, 0.39) 0, rgba(213, 206, 195, 0.29) 0.7px, transparent 1.5px), radial-gradient(circle at 46px 123px, rgba(213, 206, 195, 0.41) 0, rgba(213, 206, 195, 0.31) 0.9px, transparent 1.7px), radial-gradient(circle at 120px 115px, rgba(213, 206, 195, 0.51) 0, rgba(213, 206, 195, 0.38) 0.8px, transparent 1.6px), radial-gradient(circle at 129px 129px, rgba(213, 206, 195, 0.50) 0, rgba(213, 206, 195, 0.37) 1.4px, transparent 2.2px), radial-gradient(circle at 17px 57px, rgba(213, 206, 195, 0.44) 0, rgba(213, 206, 195, 0.33) 1.3px, transparent 2.1px), radial-gradient(circle at 98px 73px, rgba(213, 206, 195, 0.44) 0, rgba(213, 206, 195, 0.33) 0.8px, transparent 1.6px), radial-gradient(circle at 92px 119px, rgba(213, 206, 195, 0.39) 0, rgba(213, 206, 195, 0.29) 1.2px, transparent 2.0px), radial-gradient(circle at 60px 73px, rgba(213, 206, 195, 0.32) 0, rgba(213, 206, 195, 0.24) 0.8px, transparent 1.6px); --drift-size: 150px; --drift-dir: 150px; --drift-dur: 35s; --drift-op: 0.60; --glow-dur: 27s; --tint-blue: #f0f5ff; --tint-blue-bd: #c0d4ff; --tint-blue-tx: #1d5fa8; --tint-purple: #f7f0ff; --tint-purple-bd: #ddc8f5; --tint-purple-tx: #6d3fb8; --tint-teal: #edfbf8; --tint-teal-bd: #b0ebe2; --tint-teal-tx: #0e7d6d; --tint-green: #edf7ed; --tint-green-bd: #bce8bb; --tint-green-tx: #1d7a3a; --tint-gray: #f5f6f8; --tint-gray-bd: #d8dde4; --tint-gray-tx: #4a5568; --tint-orange: #fff3e6; --tint-orange-bd: #ffd9b0; --tint-orange-tx: #a05a14; --tint-red: #ffecec; --tint-red-bd: #ffc9c9; --tint-red-tx: #b03030; --tint-yellow: #fff7e6; --tint-yellow-bd: #ffe1a6; --tint-yellow-tx: #8a6a14; } /* ===== ⬛ 石墨 ===== */ [data-theme="graphite"] { color-scheme: light; --primary: #3d4450; --primary-dark: #2e333c; --primary-deep: #363c46; --primary-bg: #eef0f2; --primary-soft: rgba(61, 68, 80, 0.12); --blue: #1677ff; --bg: #f5f6f7; --card: #ffffff; --surface: #fcfcfc; --hover-bg: #f5f6f7; --border: #e2e5e8; --text: #1a1d21; --text-sub: #383c41; --muted: #868c93; --danger: #e5484d; --warn: #f5a524; --danger-bg: #fdf2f3; --danger-text: #c33d41; --danger-border: #e3aeb2; --warn-bg: #fef7eb; --warn-text: #c4841d; --warn-border: #eacb9a; --side-bg: #191c20; --side-bg2: #16181c; --side-text: #dadbdb; --side-nav: #bfbfc1; --side-muted: #87898b; --side-hover: rgba(255, 255, 255, 0.07); --side-active: #3d4450; --side-active-text: #ffffff; --side-foot-text: #7a7b7e; --side-user-bg: rgba(255, 255, 255, 0.06); --side-user-sub: #9ea0a1; --login-bg1: #0f1114; --login-bg2: #1d2126; --login-bg3: #15181c; --login-hero: #e8e9e9; --login-hero-sub: #939597; --login-point: #b7b9ba; --login-point-line: rgba(147, 149, 151, 0.18); --login-accent: #cfd6dd; --login-link: #b8bbbe; --login-glass: rgba(255, 255, 255, 0.08); --login-glass-line: rgba(129, 133, 141, 0.5); --login-glass-line2: rgba(129, 133, 141, 0.35); --login-yixn: #c8c9ca; --login-card: #ffffff; --login-tab-bg: #fafafb; --login-tab-text: #666b71; --login-label: #383c41; --login-input-bg: #fbfbfc; --login-input-border: #e2e5e8; --login-tip: #868c93; --login-divider: #e2e5e8; --input-bg: #ffffff; --radius: 10px; --shadow: 0 1px 3px rgba(0, 0, 0, 0.06); --side-grad: linear-gradient(170deg, #272a2d 0%, #191c20 58%, #1f2228 100%); --side-art: url("data:image/svg+xml,"); --side-art-op: 0.26; --side-pattern: url("data:image/svg+xml,"); --side-pattern-op: 0.09; --side-glow: radial-gradient(ellipse 90% 46% at 50% 0%, rgba(158, 162, 168, 0.20), transparent 62%); --login-art: url("data:image/svg+xml,"); --login-art-op: 0.32; --login-mesh: radial-gradient(ellipse 62% 52% at 76% 16%, rgba(61, 68, 80, 0.26), transparent 60%), radial-gradient(ellipse 54% 44% at 14% 82%, rgba(207, 214, 221, 0.18), transparent 62%), radial-gradient(circle at 50% 112%, rgba(61, 68, 80, 0.16), transparent 56%); --login-art-pos: center; --login-art-size: 560px 560px; --login-art-repeat: repeat; --top-grad: linear-gradient(180deg, #ffffff 0%, #f1f2f3 100%); --main-grad: radial-gradient(circle at 10% -6%, rgba(61, 68, 80, 0.09), transparent 44%), radial-gradient(circle at 92% 4%, rgba(207, 214, 221, 0.08), transparent 40%); --drift: none; --drift-size: 150px; --drift-dir: 150px; --drift-dur: 30s; --drift-op: 0; --glow-dur: 16s; --tint-blue: #f0f5ff; --tint-blue-bd: #c0d4ff; --tint-blue-tx: #1d5fa8; --tint-purple: #f7f0ff; --tint-purple-bd: #ddc8f5; --tint-purple-tx: #6d3fb8; --tint-teal: #edfbf8; --tint-teal-bd: #b0ebe2; --tint-teal-tx: #0e7d6d; --tint-green: #edf7ed; --tint-green-bd: #bce8bb; --tint-green-tx: #1d7a3a; --tint-gray: #f5f6f8; --tint-gray-bd: #d8dde4; --tint-gray-tx: #4a5568; --tint-orange: #fff3e6; --tint-orange-bd: #ffd9b0; --tint-orange-tx: #a05a14; --tint-red: #ffecec; --tint-red-bd: #ffc9c9; --tint-red-tx: #b03030; --tint-yellow: #fff7e6; --tint-yellow-bd: #ffe1a6; --tint-yellow-tx: #8a6a14; } /* ===== 🌫️ 雾霭青 ===== */ [data-theme="mist"] { color-scheme: light; --primary: #6ba39c; --primary-dark: #578a84; --primary-deep: #4f7973; --primary-bg: #eaf4f3; --primary-soft: rgba(107, 163, 156, 0.12); --blue: #1677ff; --bg: #f4f7f7; --card: #ffffff; --surface: #fbfcfc; --hover-bg: #f4f7f7; --border: #e2eaed; --text: #1f2a2b; --text-sub: #3d494b; --muted: #8b9a9c; --danger: #e5484d; --warn: #f5a524; --danger-bg: #fdf2f3; --danger-text: #c33d41; --danger-border: #e3b1b5; --warn-bg: #fef7eb; --warn-text: #c4841d; --warn-border: #eace9d; --side-bg: #22383a; --side-bg2: #1d3032; --side-text: #dcdfdf; --side-nav: #c1c7c8; --side-muted: #8c9899; --side-hover: rgba(255, 255, 255, 0.07); --side-active: #6ba39c; --side-active-text: #ffffff; --side-foot-text: #7f8c8d; --side-user-bg: rgba(255, 255, 255, 0.06); --side-user-sub: #a2abac; --login-bg1: #14262a; --login-bg2: #1f3a3d; --login-bg3: #193033; --login-hero: #e9ebec; --login-hero-sub: #94a1a2; --login-point: #b9c1c2; --login-point-line: rgba(148, 161, 162, 0.18); --login-accent: #cfe9e4; --login-link: #c6d7d6; --login-glass: rgba(255, 255, 255, 0.08); --login-glass-line: rgba(159, 195, 191, 0.5); --login-glass-line2: rgba(159, 195, 191, 0.35); --login-yixn: #c9cfd0; --login-card: #ffffff; --login-tab-bg: #fafbfb; --login-tab-text: #6b787a; --login-label: #3d494b; --login-input-bg: #fbfcfc; --login-input-border: #e2eaed; --login-tip: #8b9a9c; --login-divider: #e2eaed; --input-bg: #ffffff; --radius: 10px; --shadow: 0 1px 3px rgba(0, 0, 0, 0.06); --side-grad: linear-gradient(170deg, #2f4446 0%, #22383a 58%, #2e494a 100%); --side-art: url("data:image/svg+xml,"); --side-art-op: 0.19; --side-pattern: url("data:image/svg+xml,"); --side-pattern-op: 0.09; --side-glow: radial-gradient(ellipse 90% 46% at 50% 0%, rgba(181, 209, 206, 0.20), transparent 62%); --login-art: url("data:image/svg+xml,"); --login-art-op: 0.24; --login-mesh: radial-gradient(ellipse 62% 52% at 76% 16%, rgba(107, 163, 156, 0.26), transparent 60%), radial-gradient(ellipse 54% 44% at 14% 82%, rgba(207, 233, 228, 0.18), transparent 62%), radial-gradient(circle at 50% 112%, rgba(107, 163, 156, 0.16), transparent 56%); --login-art-pos: center bottom; --login-art-size: cover; --login-art-repeat: no-repeat; --top-grad: linear-gradient(180deg, #ffffff 0%, #f5f9f8 100%); --main-grad: radial-gradient(circle at 10% -6%, rgba(107, 163, 156, 0.09), transparent 44%), radial-gradient(circle at 92% 4%, rgba(207, 233, 228, 0.08), transparent 40%); --drift: radial-gradient(circle at 64px 108px, rgba(193, 216, 213, 0.41) 0, rgba(193, 216, 213, 0.31) 1.2px, transparent 2.0px), radial-gradient(circle at 92px 76px, rgba(193, 216, 213, 0.42) 0, rgba(193, 216, 213, 0.32) 1.3px, transparent 2.1px), radial-gradient(circle at 16px 117px, rgba(193, 216, 213, 0.37) 0, rgba(193, 216, 213, 0.28) 0.8px, transparent 1.6px), radial-gradient(circle at 22px 84px, rgba(193, 216, 213, 0.36) 0, rgba(193, 216, 213, 0.27) 0.8px, transparent 1.6px), radial-gradient(circle at 92px 134px, rgba(193, 216, 213, 0.52) 0, rgba(193, 216, 213, 0.39) 0.9px, transparent 1.7px), radial-gradient(circle at 77px 107px, rgba(193, 216, 213, 0.29) 0, rgba(193, 216, 213, 0.22) 1.0px, transparent 1.8px), radial-gradient(circle at 147px 41px, rgba(193, 216, 213, 0.28) 0, rgba(193, 216, 213, 0.21) 0.9px, transparent 1.7px), radial-gradient(circle at 75px 105px, rgba(193, 216, 213, 0.40) 0, rgba(193, 216, 213, 0.30) 1.4px, transparent 2.2px), radial-gradient(circle at 111px 51px, rgba(193, 216, 213, 0.30) 0, rgba(193, 216, 213, 0.23) 1.3px, transparent 2.1px), radial-gradient(circle at 135px 19px, rgba(193, 216, 213, 0.31) 0, rgba(193, 216, 213, 0.23) 0.8px, transparent 1.6px), radial-gradient(circle at 61px 77px, rgba(193, 216, 213, 0.52) 0, rgba(193, 216, 213, 0.39) 1.5px, transparent 2.3px), radial-gradient(circle at 82px 63px, rgba(193, 216, 213, 0.49) 0, rgba(193, 216, 213, 0.37) 1.5px, transparent 2.3px), radial-gradient(circle at 4px 65px, rgba(193, 216, 213, 0.43) 0, rgba(193, 216, 213, 0.32) 0.6px, transparent 1.4px), radial-gradient(circle at 148px 67px, rgba(193, 216, 213, 0.32) 0, rgba(193, 216, 213, 0.24) 1.5px, transparent 2.3px), radial-gradient(circle at 62px 31px, rgba(193, 216, 213, 0.39) 0, rgba(193, 216, 213, 0.29) 0.7px, transparent 1.5px), radial-gradient(circle at 46px 123px, rgba(193, 216, 213, 0.41) 0, rgba(193, 216, 213, 0.31) 0.9px, transparent 1.7px), radial-gradient(circle at 120px 115px, rgba(193, 216, 213, 0.51) 0, rgba(193, 216, 213, 0.38) 0.8px, transparent 1.6px), radial-gradient(circle at 129px 129px, rgba(193, 216, 213, 0.50) 0, rgba(193, 216, 213, 0.37) 1.4px, transparent 2.2px), radial-gradient(circle at 17px 57px, rgba(193, 216, 213, 0.44) 0, rgba(193, 216, 213, 0.33) 1.3px, transparent 2.1px), radial-gradient(circle at 98px 73px, rgba(193, 216, 213, 0.44) 0, rgba(193, 216, 213, 0.33) 0.8px, transparent 1.6px), radial-gradient(circle at 92px 119px, rgba(193, 216, 213, 0.39) 0, rgba(193, 216, 213, 0.29) 1.2px, transparent 2.0px), radial-gradient(circle at 60px 73px, rgba(193, 216, 213, 0.32) 0, rgba(193, 216, 213, 0.24) 0.8px, transparent 1.6px); --drift-size: 150px; --drift-dir: 150px; --drift-dur: 34s; --drift-op: 0.60; --glow-dur: 26s; --tint-blue: #f0f5ff; --tint-blue-bd: #c0d4ff; --tint-blue-tx: #1d5fa8; --tint-purple: #f7f0ff; --tint-purple-bd: #ddc8f5; --tint-purple-tx: #6d3fb8; --tint-teal: #edfbf8; --tint-teal-bd: #b0ebe2; --tint-teal-tx: #0e7d6d; --tint-green: #edf7ed; --tint-green-bd: #bce8bb; --tint-green-tx: #1d7a3a; --tint-gray: #f5f6f8; --tint-gray-bd: #d8dde4; --tint-gray-tx: #4a5568; --tint-orange: #fff3e6; --tint-orange-bd: #ffd9b0; --tint-orange-tx: #a05a14; --tint-red: #ffecec; --tint-red-bd: #ffc9c9; --tint-red-tx: #b03030; --tint-yellow: #fff7e6; --tint-yellow-bd: #ffe1a6; --tint-yellow-tx: #8a6a14; } /* ===== 🎆 极光 ===== */ [data-theme="aurora"] { color-scheme: dark; --primary: #4fd1b0; --primary-dark: #38b096; --primary-deep: #3a9b82; --primary-bg: rgba(79,209,176,0.15); --primary-soft: rgba(79, 209, 176, 0.18); --blue: #6ba4ff; --bg: #0e1a1c; --card: #232e30; --surface: #1c2729; --hover-bg: #1c282a; --border: #233c42; --text: #e2f2f0; --text-sub: #c8dcdb; --muted: #85a5a4; --danger: #ff6b6b; --warn: #ffb340; --danger-bg: #3d3537; --danger-text: #ff9f9f; --danger-border: #704c50; --warn-bg: #3d3e32; --warn-text: #ffca79; --warn-border: #7b6c41; --side-bg: #0a1416; --side-bg2: #091113; --side-text: #d8d9da; --side-nav: #babdbe; --side-muted: #808586; --side-hover: rgba(255, 255, 255, 0.07); --side-active: #4fd1b0; --side-active-text: #101418; --side-foot-text: #717778; --side-user-bg: rgba(255, 255, 255, 0.06); --side-user-sub: #989c9d; --login-bg1: #071012; --login-bg2: #12262a; --login-bg3: #0d1c20; --login-hero: #e7e9ea; --login-hero-sub: #8e9799; --login-point: #b4babc; --login-point-line: rgba(142, 151, 153, 0.18); --login-accent: #a8f0dc; --login-link: #bce2da; --login-glass: rgba(255, 255, 255, 0.08); --login-glass-line: rgba(141, 225, 204, 0.5); --login-glass-line2: rgba(141, 225, 204, 0.35); --login-yixn: #c5cacb; --login-card: #232e30; --login-tab-bg: #182426; --login-tab-text: #a1bcbb; --login-label: #c8dcdb; --login-input-bg: #1b2628; --login-input-border: #233c42; --login-tip: #85a5a4; --login-divider: #233c42; --input-bg: #232e30; --radius: 10px; --shadow: 0 1px 3px rgba(0, 0, 0, 0.4); --side-grad: linear-gradient(170deg, #192224 0%, #0a1416 58%, #15322f 100%); --side-art: url("data:image/svg+xml,"); --side-art-op: 0.19; --side-pattern: url("data:image/svg+xml,"); --side-pattern-op: 0.09; --side-glow: radial-gradient(ellipse 90% 46% at 50% 0%, rgba(167, 232, 216, 0.20), transparent 62%); --login-art: url("data:image/svg+xml,"); --login-art-op: 0.24; --login-mesh: radial-gradient(ellipse 62% 52% at 76% 16%, rgba(79, 209, 176, 0.26), transparent 60%), radial-gradient(ellipse 54% 44% at 14% 82%, rgba(168, 240, 220, 0.18), transparent 62%), radial-gradient(circle at 50% 112%, rgba(79, 209, 176, 0.16), transparent 56%); --login-art-pos: center; --login-art-size: cover; --login-art-repeat: no-repeat; --top-grad: linear-gradient(180deg, #232e30 0%, #273e3d 100%); --main-grad: radial-gradient(circle at 10% -6%, rgba(79, 209, 176, 0.16), transparent 44%), radial-gradient(circle at 92% 4%, rgba(168, 240, 220, 0.13), transparent 40%); --drift: radial-gradient(circle at 72px 74px, rgba(181, 236, 222, 0.44) 0, rgba(181, 236, 222, 0.33) 1.4px, transparent 2.1px), radial-gradient(circle at 72px 74px, rgba(181, 236, 222, 0.13) 0, transparent 5.4px), radial-gradient(circle at 86px 91px, rgba(181, 236, 222, 0.39) 0, rgba(181, 236, 222, 0.29) 1.6px, transparent 2.3px), radial-gradient(circle at 86px 91px, rgba(181, 236, 222, 0.12) 0, transparent 6.0px), radial-gradient(circle at 52px 21px, rgba(181, 236, 222, 0.44) 0, rgba(181, 236, 222, 0.33) 1.1px, transparent 1.8px), radial-gradient(circle at 52px 21px, rgba(181, 236, 222, 0.13) 0, transparent 7.5px), radial-gradient(circle at 58px 82px, rgba(181, 236, 222, 0.60) 0, rgba(181, 236, 222, 0.45) 1.6px, transparent 2.3px), radial-gradient(circle at 58px 82px, rgba(181, 236, 222, 0.18) 0, transparent 4.9px), radial-gradient(circle at 37px 40px, rgba(181, 236, 222, 0.60) 0, rgba(181, 236, 222, 0.45) 0.9px, transparent 1.6px), radial-gradient(circle at 37px 40px, rgba(181, 236, 222, 0.18) 0, transparent 7.6px), radial-gradient(circle at 109px 60px, rgba(181, 236, 222, 0.55) 0, rgba(181, 236, 222, 0.41) 0.9px, transparent 1.6px), radial-gradient(circle at 109px 60px, rgba(181, 236, 222, 0.16) 0, transparent 7.5px), radial-gradient(circle at 82px 59px, rgba(181, 236, 222, 0.56) 0, rgba(181, 236, 222, 0.42) 1.6px, transparent 2.3px), radial-gradient(circle at 82px 59px, rgba(181, 236, 222, 0.17) 0, transparent 5.8px), radial-gradient(circle at 20px 16px, rgba(181, 236, 222, 0.46) 0, rgba(181, 236, 222, 0.35) 1.6px, transparent 2.3px), radial-gradient(circle at 20px 16px, rgba(181, 236, 222, 0.14) 0, transparent 5.0px), radial-gradient(circle at 68px 129px, rgba(181, 236, 222, 0.50) 0, rgba(181, 236, 222, 0.37) 1.5px, transparent 2.2px), radial-gradient(circle at 68px 129px, rgba(181, 236, 222, 0.15) 0, transparent 5.8px), radial-gradient(circle at 120px 71px, rgba(181, 236, 222, 0.52) 0, rgba(181, 236, 222, 0.39) 1.1px, transparent 1.8px), radial-gradient(circle at 120px 71px, rgba(181, 236, 222, 0.16) 0, transparent 4.7px), radial-gradient(circle at 13px 108px, rgba(181, 236, 222, 0.56) 0, rgba(181, 236, 222, 0.42) 1.6px, transparent 2.3px), radial-gradient(circle at 13px 108px, rgba(181, 236, 222, 0.17) 0, transparent 5.7px); --drift-size: 150px; --drift-dir: 150px; --drift-dur: 30s; --drift-op: 0.60; --glow-dur: 22s; --tint-blue: #444e51; --tint-blue-bd: #556d7e; --tint-blue-tx: #85a9d0; --tint-purple: #454d51; --tint-purple-bd: #5f697b; --tint-purple-tx: #b097d9; --tint-teal: #434f50; --tint-teal-bd: #507475; --tint-teal-tx: #7db9b0; --tint-green: #434e4e; --tint-green-bd: #547369; --tint-green-tx: #85b795; --tint-gray: #454e50; --tint-gray-bd: #5d7076; --tint-gray-tx: #9da3ad; --tint-orange: #464e4d; --tint-orange-bd: #696e65; --tint-orange-tx: #cca680; --tint-red: #464c4e; --tint-red-bd: #69696d; --tint-red-tx: #d48f8f; --tint-yellow: #464e4d; --tint-yellow-bd: #697162; --tint-yellow-tx: #c0af80; } /* ===== 💜 薰衣草 ===== */ [data-theme="lavender"] { color-scheme: light; --primary: #9b86d8; --primary-dark: #836ec2; --primary-deep: #7363a0; --primary-bg: #f4f0ff; --primary-soft: rgba(155, 134, 216, 0.12); --blue: #1677ff; --bg: #f8f6fb; --card: #ffffff; --surface: #fdfcfe; --hover-bg: #f8f6fb; --border: #e8e2f4; --text: #262135; --text-sub: #433e55; --muted: #8f88a6; --danger: #e5484d; --warn: #f5a524; --danger-bg: #fdf2f3; --danger-text: #c33d41; --danger-border: #e7acba; --warn-bg: #fef7eb; --warn-text: #c4841d; --warn-border: #edcaa1; --side-bg: #332a4d; --side-bg2: #2c2442; --side-text: #dedde3; --side-nav: #c6c3cd; --side-muted: #9590a2; --side-hover: rgba(255, 255, 255, 0.07); --side-active: #9b86d8; --side-active-text: #ffffff; --side-foot-text: #898398; --side-user-bg: rgba(255, 255, 255, 0.06); --side-user-sub: #a9a6b4; --login-bg1: #221a38; --login-bg2: #352a56; --login-bg3: #2a2144; --login-hero: #ebeaee; --login-hero-sub: #9f99ae; --login-point: #bfbcca; --login-point-line: rgba(159, 153, 174, 0.18); --login-accent: #e0d4ff; --login-link: #d5cee8; --login-glass: rgba(255, 255, 255, 0.08); --login-glass-line: rgba(190, 176, 230, 0.5); --login-glass-line2: rgba(190, 176, 230, 0.35); --login-yixn: #cecbd6; --login-card: #ffffff; --login-tab-bg: #fcfafd; --login-tab-text: #706984; --login-label: #433e55; --login-input-bg: #fcfbfd; --login-input-border: #e8e2f4; --login-tip: #8f88a6; --login-divider: #e8e2f4; --input-bg: #ffffff; --radius: 10px; --shadow: 0 1px 3px rgba(0, 0, 0, 0.06); --side-grad: linear-gradient(170deg, #3f3758 0%, #332a4d 58%, #443963 100%); --side-art: url("data:image/svg+xml,"); --side-art-op: 0.19; --side-pattern: url("data:image/svg+xml,"); --side-pattern-op: 0.09; --side-glow: radial-gradient(ellipse 90% 46% at 50% 0%, rgba(205, 194, 236, 0.20), transparent 62%); --login-art: url("data:image/svg+xml,"); --login-art-op: 0.24; --login-mesh: radial-gradient(ellipse 62% 52% at 76% 16%, rgba(155, 134, 216, 0.26), transparent 60%), radial-gradient(ellipse 54% 44% at 14% 82%, rgba(224, 212, 255, 0.18), transparent 62%), radial-gradient(circle at 50% 112%, rgba(155, 134, 216, 0.16), transparent 56%); --login-art-pos: center bottom; --login-art-size: cover; --login-art-repeat: no-repeat; --top-grad: linear-gradient(180deg, #ffffff 0%, #f8f7fc 100%); --main-grad: radial-gradient(circle at 10% -6%, rgba(155, 134, 216, 0.09), transparent 44%), radial-gradient(circle at 92% 4%, rgba(224, 212, 255, 0.08), transparent 40%); --drift: url("data:image/svg+xml,"); --drift-size: 150px; --drift-dir: 150px; --drift-dur: 28s; --drift-op: 0.60; --glow-dur: 20s; --tint-blue: #f0f5ff; --tint-blue-bd: #c0d4ff; --tint-blue-tx: #1d5fa8; --tint-purple: #f7f0ff; --tint-purple-bd: #ddc8f5; --tint-purple-tx: #6d3fb8; --tint-teal: #edfbf8; --tint-teal-bd: #b0ebe2; --tint-teal-tx: #0e7d6d; --tint-green: #edf7ed; --tint-green-bd: #bce8bb; --tint-green-tx: #1d7a3a; --tint-gray: #f5f6f8; --tint-gray-bd: #d8dde4; --tint-gray-tx: #4a5568; --tint-orange: #fff3e6; --tint-orange-bd: #ffd9b0; --tint-orange-tx: #a05a14; --tint-red: #ffecec; --tint-red-bd: #ffc9c9; --tint-red-tx: #b03030; --tint-yellow: #fff7e6; --tint-yellow-bd: #ffe1a6; --tint-yellow-tx: #8a6a14; } /* ===== 🍵 抹茶 ===== */ [data-theme="matcha"] { color-scheme: light; --primary: #8a9a4f; --primary-dark: #74823f; --primary-deep: #66723a; --primary-bg: #f4f7e8; --primary-soft: rgba(138, 154, 79, 0.12); --blue: #1677ff; --bg: #f8f9f2; --card: #fffefb; --surface: #fdfcf8; --hover-bg: #f8f9f3; --border: #e8ebd8; --text: #2a2d20; --text-sub: #464939; --muted: #8d927a; --danger: #e5484d; --warn: #f5a524; --danger-bg: #fdf2f3; --danger-text: #c33d41; --danger-border: #e7b2a7; --warn-bg: #fef7eb; --warn-text: #c4841d; --warn-border: #edcf90; --side-bg: #2f3a1e; --side-bg2: #28321a; --side-text: #dedfdb; --side-nav: #c5c8c0; --side-muted: #93998a; --side-hover: rgba(255, 255, 255, 0.07); --side-active: #8a9a4f; --side-active-text: #ffffff; --side-foot-text: #868d7c; --side-user-bg: rgba(255, 255, 255, 0.06); --side-user-sub: #a8aca0; --login-bg1: #20280f; --login-bg2: #33401a; --login-bg3: #283314; --login-hero: #ebece8; --login-hero-sub: #9ea491; --login-point: #bfc3b7; --login-point-line: rgba(158, 164, 145, 0.18); --login-accent: #e2ebbc; --login-link: #d0d5bd; --login-glass: rgba(255, 255, 255, 0.08); --login-glass-line: rgba(179, 189, 141, 0.5); --login-glass-line2: rgba(179, 189, 141, 0.35); --login-yixn: #ced0c7; --login-card: #ffffff; --login-tab-bg: #fcfcf8; --login-tab-text: #6f745f; --login-label: #464939; --login-input-bg: #fcfdfa; --login-input-border: #e8ebd8; --login-tip: #8d927a; --login-divider: #e8ebd8; --input-bg: #fffefb; --radius: 10px; --shadow: 0 1px 3px rgba(0, 0, 0, 0.06); --side-grad: linear-gradient(170deg, #3b462c 0%, #2f3a1e 58%, #3e4926 100%); --side-art: url("data:image/svg+xml,"); --side-art-op: 0.19; --side-pattern: url("data:image/svg+xml,"); --side-pattern-op: 0.09; --side-glow: radial-gradient(ellipse 90% 46% at 50% 0%, rgba(196, 204, 167, 0.20), transparent 62%); --login-art: url("data:image/svg+xml,"); --login-art-op: 0.24; --login-mesh: radial-gradient(ellipse 62% 52% at 76% 16%, rgba(138, 154, 79, 0.26), transparent 60%), radial-gradient(ellipse 54% 44% at 14% 82%, rgba(226, 235, 188, 0.18), transparent 62%), radial-gradient(circle at 50% 112%, rgba(138, 154, 79, 0.16), transparent 56%); --login-art-pos: center; --login-art-size: cover; --login-art-repeat: no-repeat; --top-grad: linear-gradient(180deg, #fffefb 0%, #f7f7ef 100%); --main-grad: radial-gradient(circle at 10% -6%, rgba(138, 154, 79, 0.09), transparent 44%), radial-gradient(circle at 92% 4%, rgba(226, 235, 188, 0.08), transparent 40%); --drift: radial-gradient(circle at 53px 145px, transparent 1.7px, rgba(206, 213, 181, 0.48) 2.5px, transparent 3.1px), radial-gradient(circle at 51px 143px, rgba(206, 213, 181, 0.48) 0, rgba(206, 213, 181, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 52px 58px, transparent 3.4px, rgba(206, 213, 181, 0.55) 5.0px, transparent 6.2px), radial-gradient(circle at 51px 56px, rgba(206, 213, 181, 0.48) 0, rgba(206, 213, 181, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 61px 33px, transparent 2.4px, rgba(206, 213, 181, 0.55) 3.5px, transparent 4.3px), radial-gradient(circle at 60px 32px, rgba(206, 213, 181, 0.48) 0, rgba(206, 213, 181, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 138px 30px, transparent 3.3px, rgba(206, 213, 181, 0.39) 4.8px, transparent 6.0px), radial-gradient(circle at 136px 28px, rgba(206, 213, 181, 0.48) 0, rgba(206, 213, 181, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 129px 141px, transparent 1.9px, rgba(206, 213, 181, 0.58) 2.8px, transparent 3.5px), radial-gradient(circle at 128px 140px, rgba(206, 213, 181, 0.48) 0, rgba(206, 213, 181, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 14px 115px, transparent 2.6px, rgba(206, 213, 181, 0.40) 3.9px, transparent 4.8px), radial-gradient(circle at 13px 114px, rgba(206, 213, 181, 0.48) 0, rgba(206, 213, 181, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 30px 91px, transparent 2.8px, rgba(206, 213, 181, 0.52) 4.1px, transparent 5.1px), radial-gradient(circle at 28px 90px, rgba(206, 213, 181, 0.48) 0, rgba(206, 213, 181, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 88px 54px, transparent 1.7px, rgba(206, 213, 181, 0.44) 2.5px, transparent 3.1px), radial-gradient(circle at 87px 53px, rgba(206, 213, 181, 0.48) 0, rgba(206, 213, 181, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 37px 137px, transparent 2.1px, rgba(206, 213, 181, 0.48) 3.1px, transparent 3.9px), radial-gradient(circle at 35px 136px, rgba(206, 213, 181, 0.48) 0, rgba(206, 213, 181, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 41px 54px, transparent 3.0px, rgba(206, 213, 181, 0.59) 4.4px, transparent 5.5px), radial-gradient(circle at 40px 53px, rgba(206, 213, 181, 0.48) 0, rgba(206, 213, 181, 0.36) 0.9px, transparent 1.4px); --drift-size: 150px; --drift-dir: -150px; --drift-dur: 30s; --drift-op: 0.60; --glow-dur: 22s; --tint-blue: #f0f5ff; --tint-blue-bd: #c0d4ff; --tint-blue-tx: #1d5fa8; --tint-purple: #f7f0ff; --tint-purple-bd: #ddc8f5; --tint-purple-tx: #6d3fb8; --tint-teal: #edfbf8; --tint-teal-bd: #b0ebe2; --tint-teal-tx: #0e7d6d; --tint-green: #edf7ed; --tint-green-bd: #bce8bb; --tint-green-tx: #1d7a3a; --tint-gray: #f5f6f8; --tint-gray-bd: #d8dde4; --tint-gray-tx: #4a5568; --tint-orange: #fff3e6; --tint-orange-bd: #ffd9b0; --tint-orange-tx: #a05a14; --tint-red: #ffecec; --tint-red-bd: #ffc9c9; --tint-red-tx: #b03030; --tint-yellow: #fff7e6; --tint-yellow-bd: #ffe1a6; --tint-yellow-tx: #8a6a14; } /* ===== 🏖️ 海风 ===== */ [data-theme="seabreeze"] { color-scheme: light; --primary: #3f9fc4; --primary-dark: #2f86a8; --primary-deep: #378cac; --primary-bg: #e8f5fa; --primary-soft: rgba(63, 159, 196, 0.12); --blue: #1677ff; --bg: #f4f8fa; --card: #ffffff; --surface: #fbfdfd; --hover-bg: #f4f8fa; --border: #dfebf2; --text: #1b272e; --text-sub: #39474f; --muted: #8698a4; --danger: #e5484d; --warn: #f5a524; --danger-bg: #fdf2f3; --danger-text: #c33d41; --danger-border: #e1b2b8; --warn-bg: #fef7eb; --warn-text: #c4841d; --warn-border: #e8cfa0; --side-bg: #14323f; --side-bg2: #112b36; --side-text: #d9dee0; --side-nav: #bdc6c9; --side-muted: #85949b; --side-hover: rgba(255, 255, 255, 0.07); --side-active: #3f9fc4; --side-active-text: #ffffff; --side-foot-text: #778890; --side-user-bg: rgba(255, 255, 255, 0.06); --side-user-sub: #9ca9ae; --login-bg1: #0a2029; --login-bg2: #123442; --login-bg3: #0d2833; --login-hero: #e7ebec; --login-hero-sub: #8e9ea5; --login-point: #b4bfc3; --login-point-line: rgba(142, 158, 165, 0.18); --login-accent: #b6e4f5; --login-link: #b8d6e1; --login-glass: rgba(255, 255, 255, 0.08); --login-glass-line: rgba(130, 193, 217, 0.5); --login-glass-line2: rgba(130, 193, 217, 0.35); --login-yixn: #c5ced1; --login-card: #ffffff; --login-tab-bg: #fafcfc; --login-tab-text: #667681; --login-label: #39474f; --login-input-bg: #fbfcfd; --login-input-border: #dfebf2; --login-tip: #8698a4; --login-divider: #dfebf2; --input-bg: #ffffff; --radius: 10px; --shadow: 0 1px 3px rgba(0, 0, 0, 0.06); --side-grad: linear-gradient(170deg, #223e4b 0%, #14323f 58%, #1b4354 100%); --side-art: url("data:image/svg+xml,"); --side-art-op: 0.19; --side-pattern: url("data:image/svg+xml,"); --side-pattern-op: 0.09; --side-glow: radial-gradient(ellipse 90% 46% at 50% 0%, rgba(159, 207, 226, 0.20), transparent 62%); --login-art: url("data:image/svg+xml,"); --login-art-op: 0.24; --login-mesh: radial-gradient(ellipse 62% 52% at 76% 16%, rgba(63, 159, 196, 0.26), transparent 60%), radial-gradient(ellipse 54% 44% at 14% 82%, rgba(182, 228, 245, 0.18), transparent 62%), radial-gradient(circle at 50% 112%, rgba(63, 159, 196, 0.16), transparent 56%); --login-art-pos: center bottom; --login-art-size: cover; --login-art-repeat: no-repeat; --top-grad: linear-gradient(180deg, #ffffff 0%, #f2f8fb 100%); --main-grad: radial-gradient(circle at 10% -6%, rgba(63, 159, 196, 0.09), transparent 44%), radial-gradient(circle at 92% 4%, rgba(182, 228, 245, 0.08), transparent 40%); --drift: radial-gradient(circle at 53px 145px, transparent 1.7px, rgba(174, 215, 230, 0.48) 2.5px, transparent 3.1px), radial-gradient(circle at 51px 143px, rgba(174, 215, 230, 0.48) 0, rgba(174, 215, 230, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 52px 58px, transparent 3.4px, rgba(174, 215, 230, 0.55) 5.0px, transparent 6.2px), radial-gradient(circle at 51px 56px, rgba(174, 215, 230, 0.48) 0, rgba(174, 215, 230, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 61px 33px, transparent 2.4px, rgba(174, 215, 230, 0.55) 3.5px, transparent 4.3px), radial-gradient(circle at 60px 32px, rgba(174, 215, 230, 0.48) 0, rgba(174, 215, 230, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 138px 30px, transparent 3.3px, rgba(174, 215, 230, 0.39) 4.8px, transparent 6.0px), radial-gradient(circle at 136px 28px, rgba(174, 215, 230, 0.48) 0, rgba(174, 215, 230, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 129px 141px, transparent 1.9px, rgba(174, 215, 230, 0.58) 2.8px, transparent 3.5px), radial-gradient(circle at 128px 140px, rgba(174, 215, 230, 0.48) 0, rgba(174, 215, 230, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 14px 115px, transparent 2.6px, rgba(174, 215, 230, 0.40) 3.9px, transparent 4.8px), radial-gradient(circle at 13px 114px, rgba(174, 215, 230, 0.48) 0, rgba(174, 215, 230, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 30px 91px, transparent 2.8px, rgba(174, 215, 230, 0.52) 4.1px, transparent 5.1px), radial-gradient(circle at 28px 90px, rgba(174, 215, 230, 0.48) 0, rgba(174, 215, 230, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 88px 54px, transparent 1.7px, rgba(174, 215, 230, 0.44) 2.5px, transparent 3.1px), radial-gradient(circle at 87px 53px, rgba(174, 215, 230, 0.48) 0, rgba(174, 215, 230, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 37px 137px, transparent 2.1px, rgba(174, 215, 230, 0.48) 3.1px, transparent 3.9px), radial-gradient(circle at 35px 136px, rgba(174, 215, 230, 0.48) 0, rgba(174, 215, 230, 0.36) 0.9px, transparent 1.4px), radial-gradient(circle at 41px 54px, transparent 3.0px, rgba(174, 215, 230, 0.59) 4.4px, transparent 5.5px), radial-gradient(circle at 40px 53px, rgba(174, 215, 230, 0.48) 0, rgba(174, 215, 230, 0.36) 0.9px, transparent 1.4px); --drift-size: 150px; --drift-dir: -150px; --drift-dur: 26s; --drift-op: 0.60; --glow-dur: 18s; --tint-blue: #f0f5ff; --tint-blue-bd: #c0d4ff; --tint-blue-tx: #1d5fa8; --tint-purple: #f7f0ff; --tint-purple-bd: #ddc8f5; --tint-purple-tx: #6d3fb8; --tint-teal: #edfbf8; --tint-teal-bd: #b0ebe2; --tint-teal-tx: #0e7d6d; --tint-green: #edf7ed; --tint-green-bd: #bce8bb; --tint-green-tx: #1d7a3a; --tint-gray: #f5f6f8; --tint-gray-bd: #d8dde4; --tint-gray-tx: #4a5568; --tint-orange: #fff3e6; --tint-orange-bd: #ffd9b0; --tint-orange-tx: #a05a14; --tint-red: #ffecec; --tint-red-bd: #ffc9c9; --tint-red-tx: #b03030; --tint-yellow: #fff7e6; --tint-yellow-bd: #ffe1a6; --tint-yellow-tx: #8a6a14; } /* ===== 🌙 月下荷 ===== */ [data-theme="moonlit"] { color-scheme: dark; --primary: #8ab4d8; --primary-dark: #6f9cbe; --primary-deep: #6685a0; --primary-bg: rgba(138,180,216,0.15); --primary-soft: rgba(138, 180, 216, 0.18); --blue: #6ba4ff; --bg: #111820; --card: #262c34; --surface: #1f252d; --hover-bg: #1f262d; --border: #42474e; --text: #e4edf4; --text-sub: #cad5de; --muted: #8798a6; --danger: #ff6b6b; --warn: #ffb340; --danger-bg: #40343b; --danger-text: #ff9f9f; --danger-border: #845458; --warn-bg: #403c35; --warn-text: #ffca79; --warn-border: #8e7248; --side-bg: #0b1119; --side-bg2: #090f16; --side-text: #d8d9da; --side-nav: #bbbcbf; --side-muted: #808387; --side-hover: rgba(255, 255, 255, 0.07); --side-active: #8ab4d8; --side-active-text: #101418; --side-foot-text: #71757a; --side-user-bg: rgba(255, 255, 255, 0.06); --side-user-sub: #999b9e; --login-bg1: #070c12; --login-bg2: #131d28; --login-bg3: #0e1620; --login-hero: #e7e8ea; --login-hero-sub: #8e9399; --login-point: #b4b7bb; --login-point-line: rgba(142, 147, 153, 0.18); --login-accent: #cfe4f5; --login-link: #cdd9e5; --login-glass: rgba(255, 255, 255, 0.08); --login-glass-line: rgba(179, 206, 230, 0.5); --login-glass-line2: rgba(179, 206, 230, 0.35); --login-yixn: #c5c8cb; --login-card: #262c34; --login-tab-bg: #1c222a; --login-tab-text: #a3b2bd; --login-label: #cad5de; --login-input-bg: #1e242c; --login-input-border: #42474e; --login-tip: #8798a6; --login-divider: #42474e; --input-bg: #262c34; --radius: 10px; --shadow: 0 1px 3px rgba(0, 0, 0, 0.4); --side-grad: linear-gradient(170deg, #1a1f27 0%, #0b1119 58%, #1f2b38 100%); --side-art: url("data:image/svg+xml,"); --side-art-op: 0.19; --side-pattern: url("data:image/svg+xml,"); --side-pattern-op: 0.09; --side-glow: radial-gradient(ellipse 90% 46% at 50% 0%, rgba(196, 218, 236, 0.20), transparent 62%); --login-art: url("data:image/svg+xml,"); --login-art-op: 0.24; --login-mesh: radial-gradient(ellipse 62% 52% at 76% 16%, rgba(138, 180, 216, 0.26), transparent 60%), radial-gradient(ellipse 54% 44% at 14% 82%, rgba(207, 228, 245, 0.18), transparent 62%), radial-gradient(circle at 50% 112%, rgba(138, 180, 216, 0.16), transparent 56%); --login-art-pos: center bottom; --login-art-size: cover; --login-art-repeat: no-repeat; --top-grad: linear-gradient(180deg, #262c34 0%, #303a44 100%); --main-grad: radial-gradient(circle at 10% -6%, rgba(138, 180, 216, 0.16), transparent 44%), radial-gradient(circle at 92% 4%, rgba(207, 228, 245, 0.13), transparent 40%); --drift: radial-gradient(circle at 64px 108px, rgba(206, 224, 239, 0.41) 0, rgba(206, 224, 239, 0.31) 1.2px, transparent 2.0px), radial-gradient(circle at 92px 76px, rgba(206, 224, 239, 0.42) 0, rgba(206, 224, 239, 0.32) 1.3px, transparent 2.1px), radial-gradient(circle at 16px 117px, rgba(206, 224, 239, 0.37) 0, rgba(206, 224, 239, 0.28) 0.8px, transparent 1.6px), radial-gradient(circle at 22px 84px, rgba(206, 224, 239, 0.36) 0, rgba(206, 224, 239, 0.27) 0.8px, transparent 1.6px), radial-gradient(circle at 92px 134px, rgba(206, 224, 239, 0.52) 0, rgba(206, 224, 239, 0.39) 0.9px, transparent 1.7px), radial-gradient(circle at 77px 107px, rgba(206, 224, 239, 0.29) 0, rgba(206, 224, 239, 0.22) 1.0px, transparent 1.8px), radial-gradient(circle at 147px 41px, rgba(206, 224, 239, 0.28) 0, rgba(206, 224, 239, 0.21) 0.9px, transparent 1.7px), radial-gradient(circle at 75px 105px, rgba(206, 224, 239, 0.40) 0, rgba(206, 224, 239, 0.30) 1.4px, transparent 2.2px), radial-gradient(circle at 111px 51px, rgba(206, 224, 239, 0.30) 0, rgba(206, 224, 239, 0.23) 1.3px, transparent 2.1px), radial-gradient(circle at 135px 19px, rgba(206, 224, 239, 0.31) 0, rgba(206, 224, 239, 0.23) 0.8px, transparent 1.6px), radial-gradient(circle at 61px 77px, rgba(206, 224, 239, 0.52) 0, rgba(206, 224, 239, 0.39) 1.5px, transparent 2.3px), radial-gradient(circle at 82px 63px, rgba(206, 224, 239, 0.49) 0, rgba(206, 224, 239, 0.37) 1.5px, transparent 2.3px), radial-gradient(circle at 4px 65px, rgba(206, 224, 239, 0.43) 0, rgba(206, 224, 239, 0.32) 0.6px, transparent 1.4px), radial-gradient(circle at 148px 67px, rgba(206, 224, 239, 0.32) 0, rgba(206, 224, 239, 0.24) 1.5px, transparent 2.3px), radial-gradient(circle at 62px 31px, rgba(206, 224, 239, 0.39) 0, rgba(206, 224, 239, 0.29) 0.7px, transparent 1.5px), radial-gradient(circle at 46px 123px, rgba(206, 224, 239, 0.41) 0, rgba(206, 224, 239, 0.31) 0.9px, transparent 1.7px), radial-gradient(circle at 120px 115px, rgba(206, 224, 239, 0.51) 0, rgba(206, 224, 239, 0.38) 0.8px, transparent 1.6px), radial-gradient(circle at 129px 129px, rgba(206, 224, 239, 0.50) 0, rgba(206, 224, 239, 0.37) 1.4px, transparent 2.2px), radial-gradient(circle at 17px 57px, rgba(206, 224, 239, 0.44) 0, rgba(206, 224, 239, 0.33) 1.3px, transparent 2.1px), radial-gradient(circle at 98px 73px, rgba(206, 224, 239, 0.44) 0, rgba(206, 224, 239, 0.33) 0.8px, transparent 1.6px), radial-gradient(circle at 92px 119px, rgba(206, 224, 239, 0.39) 0, rgba(206, 224, 239, 0.29) 1.2px, transparent 2.0px), radial-gradient(circle at 60px 73px, rgba(206, 224, 239, 0.32) 0, rgba(206, 224, 239, 0.24) 0.8px, transparent 1.6px); --drift-size: 150px; --drift-dir: 150px; --drift-dur: 36s; --drift-op: 0.60; --glow-dur: 28s; --tint-blue: #464c54; --tint-blue-bd: #6a7487; --tint-blue-tx: #85a9d0; --tint-purple: #474b54; --tint-purple-bd: #747083; --tint-purple-tx: #b097d9; --tint-teal: #464d53; --tint-teal-bd: #657b7d; --tint-teal-tx: #7db9b0; --tint-green: #464c52; --tint-green-bd: #697b71; --tint-green-tx: #85b795; --tint-gray: #474c53; --tint-gray-bd: #72777e; --tint-gray-tx: #9da3ad; --tint-orange: #494c50; --tint-orange-bd: #7e766d; --tint-orange-tx: #cca680; --tint-red: #494b51; --tint-red-bd: #7e7175; --tint-red-tx: #d48f8f; --tint-yellow: #494c50; --tint-yellow-bd: #7e786a; --tint-yellow-tx: #c0af80; } /* ===== ☁️ 云海 ===== */ [data-theme="cloudsea"] { color-scheme: light; --primary: #7a95b4; --primary-dark: #657e9a; --primary-deep: #5a6e85; --primary-bg: #eff4f9; --primary-soft: rgba(122, 149, 180, 0.12); --blue: #1677ff; --bg: #f6f8fa; --card: #ffffff; --surface: #fcfdfd; --hover-bg: #f6f8fa; --border: #e3e9ef; --text: #1e262e; --text-sub: #3c454e; --muted: #8a949f; --danger: #e5484d; --warn: #f5a524; --danger-bg: #fdf2f3; --danger-text: #c33d41; --danger-border: #e4b1b6; --warn-bg: #fef7eb; --warn-text: #c4841d; --warn-border: #eace9e; --side-bg: #28374a; --side-bg2: #222f40; --side-text: #dddfe2; --side-nav: #c3c7cc; --side-muted: #8f97a1; --side-hover: rgba(255, 255, 255, 0.07); --side-active: #7a95b4; --side-active-text: #ffffff; --side-foot-text: #828b96; --side-user-bg: rgba(255, 255, 255, 0.06); --side-user-sub: #a5abb3; --login-bg1: #1a2532; --login-bg2: #2a3950; --login-bg3: #212e3e; --login-hero: #eaebee; --login-hero-sub: #99a0ac; --login-point: #bcc0c8; --login-point-line: rgba(153, 160, 172, 0.18); --login-accent: #dbe6f2; --login-link: #cbd3de; --login-glass: rgba(255, 255, 255, 0.08); --login-glass-line: rgba(169, 186, 206, 0.5); --login-glass-line2: rgba(169, 186, 206, 0.35); --login-yixn: #cbcfd5; --login-card: #ffffff; --login-tab-bg: #fafcfc; --login-tab-text: #6a737d; --login-label: #3c454e; --login-input-bg: #fbfcfd; --login-input-border: #e3e9ef; --login-tip: #8a949f; --login-divider: #e3e9ef; --input-bg: #ffffff; --radius: 10px; --shadow: 0 1px 3px rgba(0, 0, 0, 0.06); --side-grad: linear-gradient(170deg, #354355 0%, #28374a 58%, #35465b 100%); --side-art: url("data:image/svg+xml,"); --side-art-op: 0.26; --side-pattern: url("data:image/svg+xml,"); --side-pattern-op: 0.09; --side-glow: radial-gradient(ellipse 90% 46% at 50% 0%, rgba(188, 202, 218, 0.20), transparent 62%); --login-art: url("data:image/svg+xml,"); --login-art-op: 0.32; --login-mesh: radial-gradient(ellipse 62% 52% at 76% 16%, rgba(122, 149, 180, 0.26), transparent 60%), radial-gradient(ellipse 54% 44% at 14% 82%, rgba(219, 230, 242, 0.18), transparent 62%), radial-gradient(circle at 50% 112%, rgba(122, 149, 180, 0.16), transparent 56%); --login-art-pos: center; --login-art-size: 520px 520px; --login-art-repeat: repeat; --top-grad: linear-gradient(180deg, #ffffff 0%, #f6f8fa 100%); --main-grad: radial-gradient(circle at 10% -6%, rgba(122, 149, 180, 0.09), transparent 44%), radial-gradient(circle at 92% 4%, rgba(219, 230, 242, 0.08), transparent 40%); --drift: radial-gradient(circle at 64px 108px, rgba(199, 210, 224, 0.41) 0, rgba(199, 210, 224, 0.31) 1.2px, transparent 2.0px), radial-gradient(circle at 92px 76px, rgba(199, 210, 224, 0.42) 0, rgba(199, 210, 224, 0.32) 1.3px, transparent 2.1px), radial-gradient(circle at 16px 117px, rgba(199, 210, 224, 0.37) 0, rgba(199, 210, 224, 0.28) 0.8px, transparent 1.6px), radial-gradient(circle at 22px 84px, rgba(199, 210, 224, 0.36) 0, rgba(199, 210, 224, 0.27) 0.8px, transparent 1.6px), radial-gradient(circle at 92px 134px, rgba(199, 210, 224, 0.52) 0, rgba(199, 210, 224, 0.39) 0.9px, transparent 1.7px), radial-gradient(circle at 77px 107px, rgba(199, 210, 224, 0.29) 0, rgba(199, 210, 224, 0.22) 1.0px, transparent 1.8px), radial-gradient(circle at 147px 41px, rgba(199, 210, 224, 0.28) 0, rgba(199, 210, 224, 0.21) 0.9px, transparent 1.7px), radial-gradient(circle at 75px 105px, rgba(199, 210, 224, 0.40) 0, rgba(199, 210, 224, 0.30) 1.4px, transparent 2.2px), radial-gradient(circle at 111px 51px, rgba(199, 210, 224, 0.30) 0, rgba(199, 210, 224, 0.23) 1.3px, transparent 2.1px), radial-gradient(circle at 135px 19px, rgba(199, 210, 224, 0.31) 0, rgba(199, 210, 224, 0.23) 0.8px, transparent 1.6px), radial-gradient(circle at 61px 77px, rgba(199, 210, 224, 0.52) 0, rgba(199, 210, 224, 0.39) 1.5px, transparent 2.3px), radial-gradient(circle at 82px 63px, rgba(199, 210, 224, 0.49) 0, rgba(199, 210, 224, 0.37) 1.5px, transparent 2.3px), radial-gradient(circle at 4px 65px, rgba(199, 210, 224, 0.43) 0, rgba(199, 210, 224, 0.32) 0.6px, transparent 1.4px), radial-gradient(circle at 148px 67px, rgba(199, 210, 224, 0.32) 0, rgba(199, 210, 224, 0.24) 1.5px, transparent 2.3px), radial-gradient(circle at 62px 31px, rgba(199, 210, 224, 0.39) 0, rgba(199, 210, 224, 0.29) 0.7px, transparent 1.5px), radial-gradient(circle at 46px 123px, rgba(199, 210, 224, 0.41) 0, rgba(199, 210, 224, 0.31) 0.9px, transparent 1.7px), radial-gradient(circle at 120px 115px, rgba(199, 210, 224, 0.51) 0, rgba(199, 210, 224, 0.38) 0.8px, transparent 1.6px), radial-gradient(circle at 129px 129px, rgba(199, 210, 224, 0.50) 0, rgba(199, 210, 224, 0.37) 1.4px, transparent 2.2px), radial-gradient(circle at 17px 57px, rgba(199, 210, 224, 0.44) 0, rgba(199, 210, 224, 0.33) 1.3px, transparent 2.1px), radial-gradient(circle at 98px 73px, rgba(199, 210, 224, 0.44) 0, rgba(199, 210, 224, 0.33) 0.8px, transparent 1.6px), radial-gradient(circle at 92px 119px, rgba(199, 210, 224, 0.39) 0, rgba(199, 210, 224, 0.29) 1.2px, transparent 2.0px), radial-gradient(circle at 60px 73px, rgba(199, 210, 224, 0.32) 0, rgba(199, 210, 224, 0.24) 0.8px, transparent 1.6px); --drift-size: 150px; --drift-dir: 150px; --drift-dur: 40s; --drift-op: 0.60; --glow-dur: 32s; --tint-blue: #f0f5ff; --tint-blue-bd: #c0d4ff; --tint-blue-tx: #1d5fa8; --tint-purple: #f7f0ff; --tint-purple-bd: #ddc8f5; --tint-purple-tx: #6d3fb8; --tint-teal: #edfbf8; --tint-teal-bd: #b0ebe2; --tint-teal-tx: #0e7d6d; --tint-green: #edf7ed; --tint-green-bd: #bce8bb; --tint-green-tx: #1d7a3a; --tint-gray: #f5f6f8; --tint-gray-bd: #d8dde4; --tint-gray-tx: #4a5568; --tint-orange: #fff3e6; --tint-orange-bd: #ffd9b0; --tint-orange-tx: #a05a14; --tint-red: #ffecec; --tint-red-bd: #ffc9c9; --tint-red-tx: #b03030; --tint-yellow: #fff7e6; --tint-yellow-bd: #ffe1a6; --tint-yellow-tx: #8a6a14; } /* ===== 🏜️ 暖沙 ===== */ [data-theme="dune"] { color-scheme: light; --primary: #c9a06a; --primary-dark: #ac8552; --primary-deep: #95764e; --primary-bg: #fbf3e6; --primary-soft: rgba(201, 160, 106, 0.12); --blue: #1677ff; --bg: #faf7f2; --card: #fffdf9; --surface: #fdfbf7; --hover-bg: #faf7f3; --border: #ece2d2; --text: #2e271d; --text-sub: #4b4336; --muted: #968a78; --danger: #e5484d; --warn: #f5a524; --danger-bg: #fdf2f3; --danger-text: #c33d41; --danger-border: #eaaca3; --warn-bg: #fef7eb; --warn-text: #c4841d; --warn-border: #f0ca8c; --side-bg: #3a2f1e; --side-bg2: #32281a; --side-text: #dfdedb; --side-nav: #c8c5c0; --side-muted: #99938a; --side-hover: rgba(255, 255, 255, 0.07); --side-active: #c9a06a; --side-active-text: #101418; --side-foot-text: #8d867c; --side-user-bg: rgba(255, 255, 255, 0.06); --side-user-sub: #aca8a0; --login-bg1: #28200f; --login-bg2: #40331b; --login-bg3: #332913; --login-hero: #ecebe8; --login-hero-sub: #a49e92; --login-point: #c3bfb7; --login-point-line: rgba(164, 158, 146, 0.18); --login-accent: #f2ddb9; --login-link: #e2d6c5; --login-glass: rgba(255, 255, 255, 0.08); --login-glass-line: rgba(220, 193, 158, 0.5); --login-glass-line2: rgba(220, 193, 158, 0.35); --login-yixn: #d0cec7; --login-card: #ffffff; --login-tab-bg: #fcfbf8; --login-tab-text: #776c5d; --login-label: #4b4336; --login-input-bg: #fdfcfa; --login-input-border: #ece2d2; --login-tip: #968a78; --login-divider: #ece2d2; --input-bg: #fffdf9; --radius: 10px; --shadow: 0 1px 3px rgba(0, 0, 0, 0.06); --side-grad: linear-gradient(170deg, #463b2c 0%, #3a2f1e 58%, #51412a 100%); --side-art: url("data:image/svg+xml,"); --side-art-op: 0.19; --side-pattern: url("data:image/svg+xml,"); --side-pattern-op: 0.09; --side-glow: radial-gradient(ellipse 90% 46% at 50% 0%, rgba(228, 208, 180, 0.20), transparent 62%); --login-art: url("data:image/svg+xml,"); --login-art-op: 0.24; --login-mesh: radial-gradient(ellipse 62% 52% at 76% 16%, rgba(201, 160, 106, 0.26), transparent 60%), radial-gradient(ellipse 54% 44% at 14% 82%, rgba(242, 221, 185, 0.18), transparent 62%), radial-gradient(circle at 50% 112%, rgba(201, 160, 106, 0.16), transparent 56%); --login-art-pos: center bottom; --login-art-size: cover; --login-art-repeat: no-repeat; --top-grad: linear-gradient(180deg, #fffdf9 0%, #fbf6ef 100%); --main-grad: radial-gradient(circle at 10% -6%, rgba(201, 160, 106, 0.09), transparent 44%), radial-gradient(circle at 92% 4%, rgba(242, 221, 185, 0.08), transparent 40%); --drift: radial-gradient(circle at 64px 108px, rgba(232, 215, 192, 0.41) 0, rgba(232, 215, 192, 0.31) 1.2px, transparent 2.0px), radial-gradient(circle at 92px 76px, rgba(232, 215, 192, 0.42) 0, rgba(232, 215, 192, 0.32) 1.3px, transparent 2.1px), radial-gradient(circle at 16px 117px, rgba(232, 215, 192, 0.37) 0, rgba(232, 215, 192, 0.28) 0.8px, transparent 1.6px), radial-gradient(circle at 22px 84px, rgba(232, 215, 192, 0.36) 0, rgba(232, 215, 192, 0.27) 0.8px, transparent 1.6px), radial-gradient(circle at 92px 134px, rgba(232, 215, 192, 0.52) 0, rgba(232, 215, 192, 0.39) 0.9px, transparent 1.7px), radial-gradient(circle at 77px 107px, rgba(232, 215, 192, 0.29) 0, rgba(232, 215, 192, 0.22) 1.0px, transparent 1.8px), radial-gradient(circle at 147px 41px, rgba(232, 215, 192, 0.28) 0, rgba(232, 215, 192, 0.21) 0.9px, transparent 1.7px), radial-gradient(circle at 75px 105px, rgba(232, 215, 192, 0.40) 0, rgba(232, 215, 192, 0.30) 1.4px, transparent 2.2px), radial-gradient(circle at 111px 51px, rgba(232, 215, 192, 0.30) 0, rgba(232, 215, 192, 0.23) 1.3px, transparent 2.1px), radial-gradient(circle at 135px 19px, rgba(232, 215, 192, 0.31) 0, rgba(232, 215, 192, 0.23) 0.8px, transparent 1.6px), radial-gradient(circle at 61px 77px, rgba(232, 215, 192, 0.52) 0, rgba(232, 215, 192, 0.39) 1.5px, transparent 2.3px), radial-gradient(circle at 82px 63px, rgba(232, 215, 192, 0.49) 0, rgba(232, 215, 192, 0.37) 1.5px, transparent 2.3px), radial-gradient(circle at 4px 65px, rgba(232, 215, 192, 0.43) 0, rgba(232, 215, 192, 0.32) 0.6px, transparent 1.4px), radial-gradient(circle at 148px 67px, rgba(232, 215, 192, 0.32) 0, rgba(232, 215, 192, 0.24) 1.5px, transparent 2.3px), radial-gradient(circle at 62px 31px, rgba(232, 215, 192, 0.39) 0, rgba(232, 215, 192, 0.29) 0.7px, transparent 1.5px), radial-gradient(circle at 46px 123px, rgba(232, 215, 192, 0.41) 0, rgba(232, 215, 192, 0.31) 0.9px, transparent 1.7px), radial-gradient(circle at 120px 115px, rgba(232, 215, 192, 0.51) 0, rgba(232, 215, 192, 0.38) 0.8px, transparent 1.6px), radial-gradient(circle at 129px 129px, rgba(232, 215, 192, 0.50) 0, rgba(232, 215, 192, 0.37) 1.4px, transparent 2.2px), radial-gradient(circle at 17px 57px, rgba(232, 215, 192, 0.44) 0, rgba(232, 215, 192, 0.33) 1.3px, transparent 2.1px), radial-gradient(circle at 98px 73px, rgba(232, 215, 192, 0.44) 0, rgba(232, 215, 192, 0.33) 0.8px, transparent 1.6px), radial-gradient(circle at 92px 119px, rgba(232, 215, 192, 0.39) 0, rgba(232, 215, 192, 0.29) 1.2px, transparent 2.0px), radial-gradient(circle at 60px 73px, rgba(232, 215, 192, 0.32) 0, rgba(232, 215, 192, 0.24) 0.8px, transparent 1.6px); --drift-size: 150px; --drift-dir: 150px; --drift-dur: 32s; --drift-op: 0.60; --glow-dur: 24s; --tint-blue: #f0f5ff; --tint-blue-bd: #c0d4ff; --tint-blue-tx: #1d5fa8; --tint-purple: #f7f0ff; --tint-purple-bd: #ddc8f5; --tint-purple-tx: #6d3fb8; --tint-teal: #edfbf8; --tint-teal-bd: #b0ebe2; --tint-teal-tx: #0e7d6d; --tint-green: #edf7ed; --tint-green-bd: #bce8bb; --tint-green-tx: #1d7a3a; --tint-gray: #f5f6f8; --tint-gray-bd: #d8dde4; --tint-gray-tx: #4a5568; --tint-orange: #fff3e6; --tint-orange-bd: #ffd9b0; --tint-orange-tx: #a05a14; --tint-red: #ffecec; --tint-red-bd: #ffc9c9; --tint-red-tx: #b03030; --tint-yellow: #fff7e6; --tint-yellow-bd: #ffe1a6; --tint-yellow-tx: #8a6a14; } /* ===== 🌿 雨林 ===== */ [data-theme="rainforest"] { color-scheme: dark; --primary: #4fa87a; --primary-dark: #3d8c63; --primary-deep: #46946b; --primary-bg: rgba(79,168,122,0.15); --primary-soft: rgba(79, 168, 122, 0.18); --blue: #6ba4ff; --bg: #101914; --card: #252d29; --surface: #1e2622; --hover-bg: #1e2722; --border: #414844; --text: #e2efe7; --text-sub: #c8d9d0; --muted: #86a094; --danger: #ff6b6b; --warn: #ffb340; --danger-bg: #3f3431; --danger-text: #ff9f9f; --danger-border: #845452; --warn-bg: #3f3d2c; --warn-text: #ffca79; --warn-border: #8d7342; --side-bg: #0b130f; --side-bg2: #09100d; --side-text: #d8d9d9; --side-nav: #bbbdbc; --side-muted: #808482; --side-hover: rgba(255, 255, 255, 0.07); --side-active: #4fa87a; --side-active-text: #ffffff; --side-foot-text: #717674; --side-user-bg: rgba(255, 255, 255, 0.06); --side-user-sub: #999c9a; --login-bg1: #07110c; --login-bg2: #111d16; --login-bg3: #0b1711; --login-hero: #e7e8e8; --login-hero-sub: #8d9390; --login-point: #b4b7b6; --login-point-line: rgba(141, 147, 144, 0.18); --login-accent: #b6e8cc; --login-link: #bcd6c9; --login-glass: rgba(255, 255, 255, 0.08); --login-glass-line: rgba(141, 198, 169, 0.5); --login-glass-line2: rgba(141, 198, 169, 0.35); --login-yixn: #c5c8c6; --login-card: #252d29; --login-tab-bg: #1a231e; --login-tab-text: #a2b8ad; --login-label: #c8d9d0; --login-input-bg: #1d2521; --login-input-border: #414844; --login-tip: #86a094; --login-divider: #414844; --input-bg: #252d29; --radius: 10px; --shadow: 0 1px 3px rgba(0, 0, 0, 0.4); --side-grad: linear-gradient(170deg, #1a211d 0%, #0b130f 58%, #162b20 100%); --side-art: url("data:image/svg+xml,"); --side-art-op: 0.19; --side-pattern: url("data:image/svg+xml,"); --side-pattern-op: 0.09; --side-glow: radial-gradient(ellipse 90% 46% at 50% 0%, rgba(167, 212, 188, 0.20), transparent 62%); --login-art: url("data:image/svg+xml,"); --login-art-op: 0.24; --login-mesh: radial-gradient(ellipse 62% 52% at 76% 16%, rgba(79, 168, 122, 0.26), transparent 60%), radial-gradient(ellipse 54% 44% at 14% 82%, rgba(182, 232, 204, 0.18), transparent 62%), radial-gradient(circle at 50% 112%, rgba(79, 168, 122, 0.16), transparent 56%); --login-art-pos: center; --login-art-size: cover; --login-art-repeat: no-repeat; --top-grad: linear-gradient(180deg, #252d29 0%, #293931 100%); --main-grad: radial-gradient(circle at 10% -6%, rgba(79, 168, 122, 0.16), transparent 44%), radial-gradient(circle at 92% 4%, rgba(182, 232, 204, 0.13), transparent 40%); --drift: url("data:image/svg+xml,"); --drift-size: 150px; --drift-dir: 150px; --drift-dur: 30s; --drift-op: 0.60; --glow-dur: 22s; --tint-blue: #454d4b; --tint-blue-bd: #6a7580; --tint-blue-tx: #85a9d0; --tint-purple: #474c4b; --tint-purple-bd: #73717d; --tint-purple-tx: #b097d9; --tint-teal: #454e4a; --tint-teal-bd: #657c77; --tint-teal-tx: #7db9b0; --tint-green: #454d48; --tint-green-bd: #687b6a; --tint-green-tx: #85b795; --tint-gray: #464d4a; --tint-gray-bd: #717877; --tint-gray-tx: #9da3ad; --tint-orange: #484d47; --tint-orange-bd: #7e7667; --tint-orange-tx: #cca680; --tint-red: #484c48; --tint-red-bd: #7e716f; --tint-red-tx: #d48f8f; --tint-yellow: #484d47; --tint-yellow-bd: #7e7963; --tint-yellow-tx: #c0af80; } /* ===== 🏔️ 雪山 ===== */ [data-theme="snowpeak"] { color-scheme: light; --primary: #7ba7cc; --primary-dark: #638fb4; --primary-deep: #5b7c97; --primary-bg: #eef4fa; --primary-soft: rgba(123, 167, 204, 0.12); --blue: #1677ff; --bg: #f7f9fb; --card: #ffffff; --surface: #fcfdfe; --hover-bg: #f7f9fb; --border: #e2e9f0; --text: #1e2730; --text-sub: #3d4650; --muted: #8b96a1; --danger: #e5484d; --warn: #f5a524; --danger-bg: #fdf2f3; --danger-text: #c33d41; --danger-border: #e3b1b7; --warn-bg: #fef7eb; --warn-text: #c4841d; --warn-border: #eace9e; --side-bg: #26333f; --side-bg2: #212c36; --side-text: #dcdee0; --side-nav: #c2c6c9; --side-muted: #8e959b; --side-hover: rgba(255, 255, 255, 0.07); --side-active: #7ba7cc; --side-active-text: #ffffff; --side-foot-text: #818990; --side-user-bg: rgba(255, 255, 255, 0.06); --side-user-sub: #a4a9ae; --login-bg1: #161f28; --login-bg2: #263340; --login-bg3: #1d2833; --login-hero: #e9ebec; --login-hero-sub: #979ea4; --login-point: #babfc3; --login-point-line: rgba(151, 158, 164, 0.18); --login-accent: #d9e8f5; --login-link: #cad8e3; --login-glass: rgba(255, 255, 255, 0.08); --login-glass-line: rgba(169, 198, 222, 0.5); --login-glass-line2: rgba(169, 198, 222, 0.35); --login-yixn: #caced0; --login-card: #ffffff; --login-tab-bg: #fbfcfd; --login-tab-text: #6a757f; --login-label: #3d4650; --login-input-bg: #fcfdfd; --login-input-border: #e2e9f0; --login-tip: #8b96a1; --login-divider: #e2e9f0; --input-bg: #ffffff; --radius: 10px; --shadow: 0 1px 3px rgba(0, 0, 0, 0.06); --side-grad: linear-gradient(170deg, #333f4b 0%, #26333f 58%, #344656 100%); --side-art: url("data:image/svg+xml,"); --side-art-op: 0.19; --side-pattern: url("data:image/svg+xml,"); --side-pattern-op: 0.09; --side-glow: radial-gradient(ellipse 90% 46% at 50% 0%, rgba(189, 211, 230, 0.20), transparent 62%); --login-art: url("data:image/svg+xml,"); --login-art-op: 0.24; --login-mesh: radial-gradient(ellipse 62% 52% at 76% 16%, rgba(123, 167, 204, 0.26), transparent 60%), radial-gradient(ellipse 54% 44% at 14% 82%, rgba(217, 232, 245, 0.18), transparent 62%), radial-gradient(circle at 50% 112%, rgba(123, 167, 204, 0.16), transparent 56%); --login-art-pos: center bottom; --login-art-size: cover; --login-art-repeat: no-repeat; --top-grad: linear-gradient(180deg, #ffffff 0%, #f6f9fb 100%); --main-grad: radial-gradient(circle at 10% -6%, rgba(123, 167, 204, 0.09), transparent 44%), radial-gradient(circle at 92% 4%, rgba(217, 232, 245, 0.08), transparent 40%); --drift: radial-gradient(circle at 72px 118px, rgba(200, 218, 234, 0.56) 0, rgba(200, 218, 234, 0.42) 1.2px, transparent 2.2px), radial-gradient(circle at 148px 51px, rgba(200, 218, 234, 0.39) 0, rgba(200, 218, 234, 0.29) 1.9px, transparent 2.9px), radial-gradient(circle at 35px 95px, rgba(200, 218, 234, 0.44) 0, rgba(200, 218, 234, 0.33) 1.1px, transparent 2.1px), radial-gradient(circle at 38px 18px, rgba(200, 218, 234, 0.59) 0, rgba(200, 218, 234, 0.44) 1.5px, transparent 2.5px), radial-gradient(circle at 136px 45px, rgba(200, 218, 234, 0.54) 0, rgba(200, 218, 234, 0.40) 2.1px, transparent 3.1px), radial-gradient(circle at 134px 5px, rgba(200, 218, 234, 0.39) 0, rgba(200, 218, 234, 0.29) 2.3px, transparent 3.3px), radial-gradient(circle at 23px 102px, rgba(200, 218, 234, 0.60) 0, rgba(200, 218, 234, 0.45) 2.0px, transparent 3.0px), radial-gradient(circle at 33px 101px, rgba(200, 218, 234, 0.45) 0, rgba(200, 218, 234, 0.34) 1.9px, transparent 2.9px), radial-gradient(circle at 12px 33px, rgba(200, 218, 234, 0.58) 0, rgba(200, 218, 234, 0.44) 1.1px, transparent 2.1px), radial-gradient(circle at 115px 104px, rgba(200, 218, 234, 0.50) 0, rgba(200, 218, 234, 0.37) 1.4px, transparent 2.4px), radial-gradient(circle at 66px 17px, rgba(200, 218, 234, 0.48) 0, rgba(200, 218, 234, 0.36) 1.5px, transparent 2.5px), radial-gradient(circle at 20px 95px, rgba(200, 218, 234, 0.39) 0, rgba(200, 218, 234, 0.29) 1.6px, transparent 2.6px), radial-gradient(circle at 40px 23px, rgba(200, 218, 234, 0.37) 0, rgba(200, 218, 234, 0.28) 1.9px, transparent 2.9px), radial-gradient(circle at 134px 119px, rgba(200, 218, 234, 0.51) 0, rgba(200, 218, 234, 0.38) 1.3px, transparent 2.3px), radial-gradient(circle at 27px 73px, rgba(200, 218, 234, 0.43) 0, rgba(200, 218, 234, 0.32) 1.9px, transparent 2.9px), radial-gradient(circle at 45px 18px, rgba(200, 218, 234, 0.34) 0, rgba(200, 218, 234, 0.26) 2.3px, transparent 3.3px), radial-gradient(circle at 69px 88px, rgba(200, 218, 234, 0.43) 0, rgba(200, 218, 234, 0.32) 1.8px, transparent 2.8px), radial-gradient(circle at 43px 143px, rgba(200, 218, 234, 0.48) 0, rgba(200, 218, 234, 0.36) 2.0px, transparent 3.0px); --drift-size: 150px; --drift-dir: 150px; --drift-dur: 24s; --drift-op: 0.60; --glow-dur: 16s; --tint-blue: #f0f5ff; --tint-blue-bd: #c0d4ff; --tint-blue-tx: #1d5fa8; --tint-purple: #f7f0ff; --tint-purple-bd: #ddc8f5; --tint-purple-tx: #6d3fb8; --tint-teal: #edfbf8; --tint-teal-bd: #b0ebe2; --tint-teal-tx: #0e7d6d; --tint-green: #edf7ed; --tint-green-bd: #bce8bb; --tint-green-tx: #1d7a3a; --tint-gray: #f5f6f8; --tint-gray-bd: #d8dde4; --tint-gray-tx: #4a5568; --tint-orange: #fff3e6; --tint-orange-bd: #ffd9b0; --tint-orange-tx: #a05a14; --tint-red: #ffecec; --tint-red-bd: #ffc9c9; --tint-red-tx: #b03030; --tint-yellow: #fff7e6; --tint-yellow-bd: #ffe1a6; --tint-yellow-tx: #8a6a14; } /* ===== 🍑 蜜桃 ===== */ [data-theme="peach"] { color-scheme: light; --primary: #e88ba0; --primary-dark: #d06f85; --primary-deep: #ac6776; --primary-bg: #fdf0f3; --primary-soft: rgba(232, 139, 160, 0.12); --blue: #1677ff; --bg: #fbf7f8; --card: #fffdfd; --surface: #fefbfb; --hover-bg: #fbf7f8; --border: #f2e3e8; --text: #2d2126; --text-sub: #4e3f45; --muted: #a48b93; --danger: #e5484d; --warn: #f5a524; --danger-bg: #fdf2f3; --danger-text: #c33d41; --danger-border: #edadb2; --warn-bg: #fef7eb; --warn-text: #c4841d; --warn-border: #f3ca9a; --side-bg: #3a2029; --side-bg2: #321c23; --side-text: #dfdbdd; --side-nav: #c8c1c3; --side-muted: #998b90; --side-hover: rgba(255, 255, 255, 0.07); --side-active: #e88ba0; --side-active-text: #101418; --side-foot-text: #8d7e83; --side-user-bg: rgba(255, 255, 255, 0.06); --side-user-sub: #aca1a5; --login-bg1: #28131b; --login-bg2: #401f2b; --login-bg3: #331822; --login-hero: #ece9ea; --login-hero-sub: #a4949a; --login-point: #c3b9bc; --login-point-line: rgba(164, 148, 154, 0.18); --login-accent: #ffd0dc; --login-link: #ebcfd5; --login-glass: rgba(255, 255, 255, 0.08); --login-glass-line: rgba(240, 180, 193, 0.5); --login-glass-line2: rgba(240, 180, 193, 0.35); --login-yixn: #d0c9cb; --login-card: #ffffff; --login-tab-bg: #fdfbfc; --login-tab-text: #806b72; --login-label: #4e3f45; --login-input-bg: #fdfcfc; --login-input-border: #f2e3e8; --login-tip: #a48b93; --login-divider: #f2e3e8; --input-bg: #fffdfd; --radius: 10px; --shadow: 0 1px 3px rgba(0, 0, 0, 0.06); --side-grad: linear-gradient(170deg, #462d36 0%, #3a2029 58%, #56313c 100%); --side-art: url("data:image/svg+xml,"); --side-art-op: 0.19; --side-pattern: url("data:image/svg+xml,"); --side-pattern-op: 0.09; --side-glow: radial-gradient(ellipse 90% 46% at 50% 0%, rgba(244, 197, 208, 0.20), transparent 62%); --login-art: url("data:image/svg+xml,"); --login-art-op: 0.24; --login-mesh: radial-gradient(ellipse 62% 52% at 76% 16%, rgba(232, 139, 160, 0.26), transparent 60%), radial-gradient(ellipse 54% 44% at 14% 82%, rgba(255, 208, 220, 0.18), transparent 62%), radial-gradient(circle at 50% 112%, rgba(232, 139, 160, 0.16), transparent 56%); --login-art-pos: center; --login-art-size: cover; --login-art-repeat: no-repeat; --top-grad: linear-gradient(180deg, #fffdfd 0%, #fdf5f6 100%); --main-grad: radial-gradient(circle at 10% -6%, rgba(232, 139, 160, 0.09), transparent 44%), radial-gradient(circle at 92% 4%, rgba(255, 208, 220, 0.08), transparent 40%); --drift: url("data:image/svg+xml,"); --drift-size: 150px; --drift-dir: 150px; --drift-dur: 26s; --drift-op: 0.60; --glow-dur: 18s; --tint-blue: #f0f5ff; --tint-blue-bd: #c0d4ff; --tint-blue-tx: #1d5fa8; --tint-purple: #f7f0ff; --tint-purple-bd: #ddc8f5; --tint-purple-tx: #6d3fb8; --tint-teal: #edfbf8; --tint-teal-bd: #b0ebe2; --tint-teal-tx: #0e7d6d; --tint-green: #edf7ed; --tint-green-bd: #bce8bb; --tint-green-tx: #1d7a3a; --tint-gray: #f5f6f8; --tint-gray-bd: #d8dde4; --tint-gray-tx: #4a5568; --tint-orange: #fff3e6; --tint-orange-bd: #ffd9b0; --tint-orange-tx: #a05a14; --tint-red: #ffecec; --tint-red-bd: #ffc9c9; --tint-red-tx: #b03030; --tint-yellow: #fff7e6; --tint-yellow-bd: #ffe1a6; --tint-yellow-tx: #8a6a14; } /* ===== ✨ 流萤 ===== */ [data-theme="firefly"] { color-scheme: dark; --primary: #b8c94a; --primary-dark: #9aab3a; --primary-deep: #889537; --primary-bg: rgba(184,201,74,0.15); --primary-soft: rgba(184, 201, 74, 0.18); --blue: #6ba4ff; --bg: #141710; --card: #292b25; --surface: #22241e; --hover-bg: #22251e; --border: #444741; --text: #e9eddf; --text-sub: #d1d5c4; --muted: #94997f; --danger: #ff6b6b; --warn: #ffb340; --danger-bg: #43332d; --danger-text: #ff9f9f; --danger-border: #855450; --warn-bg: #433b28; --warn-text: #ffca79; --warn-border: #8f7241; --side-bg: #0e100a; --side-bg2: #0c0e09; --side-text: #d8d9d8; --side-nav: #bcbcba; --side-muted: #828380; --side-hover: rgba(255, 255, 255, 0.07); --side-active: #b8c94a; --side-active-text: #101418; --side-foot-text: #737471; --side-user-bg: rgba(255, 255, 255, 0.06); --side-user-sub: #9a9b98; --login-bg1: #0a0c06; --login-bg2: #161a0e; --login-bg3: #0f120a; --login-hero: #e8e8e7; --login-hero-sub: #90918c; --login-point: #b6b7b3; --login-point-line: rgba(144, 145, 140, 0.18); --login-accent: #e4ef9c; --login-link: #dbdfbb; --login-glass: rgba(255, 255, 255, 0.08); --login-glass-line: rgba(209, 220, 137, 0.5); --login-glass-line2: rgba(209, 220, 137, 0.35); --login-yixn: #c6c7c4; --login-card: #292b25; --login-tab-bg: #1e211a; --login-tab-text: #aeb29c; --login-label: #d1d5c4; --login-input-bg: #21231d; --login-input-border: #444741; --login-tip: #94997f; --login-divider: #444741; --input-bg: #292b25; --radius: 10px; --shadow: 0 1px 3px rgba(0, 0, 0, 0.4); --side-grad: linear-gradient(170deg, #1c1e19 0%, #0e100a 58%, #292e14 100%); --side-art: url("data:image/svg+xml,"); --side-art-op: 0.19; --side-pattern: url("data:image/svg+xml,"); --side-pattern-op: 0.09; --side-glow: radial-gradient(ellipse 90% 46% at 50% 0%, rgba(220, 228, 164, 0.20), transparent 62%); --login-art: url("data:image/svg+xml,"); --login-art-op: 0.24; --login-mesh: radial-gradient(ellipse 62% 52% at 76% 16%, rgba(184, 201, 74, 0.26), transparent 60%), radial-gradient(ellipse 54% 44% at 14% 82%, rgba(228, 239, 156, 0.18), transparent 62%), radial-gradient(circle at 50% 112%, rgba(184, 201, 74, 0.16), transparent 56%); --login-art-pos: center; --login-art-size: cover; --login-art-repeat: no-repeat; --top-grad: linear-gradient(180deg, #292b25 0%, #373b29 100%); --main-grad: radial-gradient(circle at 10% -6%, rgba(184, 201, 74, 0.16), transparent 44%), radial-gradient(circle at 92% 4%, rgba(228, 239, 156, 0.13), transparent 40%); --drift: radial-gradient(circle at 15px 53px, rgba(204, 216, 125, 0.25) 0, transparent 9.7px), radial-gradient(circle at 15px 53px, rgba(204, 216, 125, 0.60) 0, rgba(204, 216, 125, 0.45) 1.2px, transparent 1.8px), radial-gradient(circle at 106px 39px, rgba(204, 216, 125, 0.25) 0, transparent 6.7px), radial-gradient(circle at 106px 39px, rgba(204, 216, 125, 0.60) 0, rgba(204, 216, 125, 0.45) 1.2px, transparent 1.8px), radial-gradient(circle at 50px 113px, rgba(204, 216, 125, 0.25) 0, transparent 9.8px), radial-gradient(circle at 50px 113px, rgba(204, 216, 125, 0.60) 0, rgba(204, 216, 125, 0.45) 1.6px, transparent 2.2px), radial-gradient(circle at 129px 25px, rgba(204, 216, 125, 0.25) 0, transparent 10.8px), radial-gradient(circle at 129px 25px, rgba(204, 216, 125, 0.60) 0, rgba(204, 216, 125, 0.45) 1.6px, transparent 2.2px), radial-gradient(circle at 140px 91px, rgba(204, 216, 125, 0.25) 0, transparent 9.4px), radial-gradient(circle at 140px 91px, rgba(204, 216, 125, 0.60) 0, rgba(204, 216, 125, 0.45) 1.3px, transparent 1.9px), radial-gradient(circle at 76px 20px, rgba(204, 216, 125, 0.25) 0, transparent 9.8px), radial-gradient(circle at 76px 20px, rgba(204, 216, 125, 0.60) 0, rgba(204, 216, 125, 0.45) 1.4px, transparent 2.0px), radial-gradient(circle at 16px 42px, rgba(204, 216, 125, 0.25) 0, transparent 7.7px), radial-gradient(circle at 16px 42px, rgba(204, 216, 125, 0.60) 0, rgba(204, 216, 125, 0.45) 1.2px, transparent 1.8px), radial-gradient(circle at 49px 92px, rgba(204, 216, 125, 0.25) 0, transparent 8.4px), radial-gradient(circle at 49px 92px, rgba(204, 216, 125, 0.60) 0, rgba(204, 216, 125, 0.45) 1.5px, transparent 2.1px), radial-gradient(circle at 133px 37px, rgba(204, 216, 125, 0.25) 0, transparent 6.4px), radial-gradient(circle at 133px 37px, rgba(204, 216, 125, 0.60) 0, rgba(204, 216, 125, 0.45) 1.1px, transparent 1.7px); --drift-size: 150px; --drift-dir: -150px; --drift-dur: 28s; --drift-op: 0.60; --glow-dur: 20s; --tint-blue: #494b48; --tint-blue-bd: #6c747e; --tint-blue-tx: #85a9d0; --tint-purple: #4a4b48; --tint-purple-bd: #75707b; --tint-purple-tx: #b097d9; --tint-teal: #484c47; --tint-teal-bd: #677b75; --tint-teal-tx: #7db9b0; --tint-green: #484c45; --tint-green-bd: #6a7b68; --tint-green-tx: #85b795; --tint-gray: #4a4b47; --tint-gray-bd: #737775; --tint-gray-tx: #9da3ad; --tint-orange: #4b4b44; --tint-orange-bd: #807665; --tint-orange-tx: #cca680; --tint-red: #4b4a45; --tint-red-bd: #80716d; --tint-red-tx: #d48f8f; --tint-yellow: #4b4c44; --tint-yellow-bd: #807861; --tint-yellow-tx: #c0af80; } /* ===== 🌼 蒲公英 ===== */ [data-theme="dandelion"] { color-scheme: light; --primary: #8fa86a; --primary-dark: #77904f; --primary-deep: #6a7c4e; --primary-bg: #f3f7ea; --primary-soft: rgba(143, 168, 106, 0.12); --blue: #1677ff; --bg: #f8f9f4; --card: #fffefa; --surface: #fdfcf8; --hover-bg: #f8f9f4; --border: #e7ebdb; --text: #282c20; --text-sub: #44493b; --muted: #8c9280; --danger: #e5484d; --warn: #f5a524; --danger-bg: #fdf2f3; --danger-text: #c33d41; --danger-border: #e6b2a9; --warn-bg: #fef7eb; --warn-text: #c4841d; --warn-border: #edcf92; --side-bg: #2e3722; --side-bg2: #282f1d; --side-text: #dedfdc; --side-nav: #c4c7c1; --side-muted: #92978c; --side-hover: rgba(255, 255, 255, 0.07); --side-active: #8fa86a; --side-active-text: #ffffff; --side-foot-text: #868b7f; --side-user-bg: rgba(255, 255, 255, 0.06); --side-user-sub: #a7aba2; --login-bg1: #1e2413; --login-bg2: #313a1e; --login-bg3: #272e18; --login-hero: #eaebe8; --login-hero-sub: #9ca193; --login-point: #bec1b8; --login-point-line: rgba(156, 161, 147, 0.18); --login-accent: #e0eac6; --login-link: #d1d8c5; --login-glass: rgba(255, 255, 255, 0.08); --login-glass-line: rgba(182, 198, 158, 0.5); --login-glass-line2: rgba(182, 198, 158, 0.35); --login-yixn: #cccfc8; --login-card: #ffffff; --login-tab-bg: #fcfcfa; --login-tab-text: #6e7363; --login-label: #44493b; --login-input-bg: #fcfdfb; --login-input-border: #e7ebdb; --login-tip: #8c9280; --login-divider: #e7ebdb; --input-bg: #fffefa; --radius: 10px; --shadow: 0 1px 3px rgba(0, 0, 0, 0.06); --side-grad: linear-gradient(170deg, #3b432f 0%, #2e3722 58%, #3e492e 100%); --side-art: url("data:image/svg+xml,"); --side-art-op: 0.26; --side-pattern: url("data:image/svg+xml,"); --side-pattern-op: 0.09; --side-glow: radial-gradient(ellipse 90% 46% at 50% 0%, rgba(199, 212, 180, 0.20), transparent 62%); --login-art: url("data:image/svg+xml,"); --login-art-op: 0.32; --login-mesh: radial-gradient(ellipse 62% 52% at 76% 16%, rgba(143, 168, 106, 0.26), transparent 60%), radial-gradient(ellipse 54% 44% at 14% 82%, rgba(224, 234, 198, 0.18), transparent 62%), radial-gradient(circle at 50% 112%, rgba(143, 168, 106, 0.16), transparent 56%); --login-art-pos: center; --login-art-size: 540px 540px; --login-art-repeat: repeat; --top-grad: linear-gradient(180deg, #fffefa 0%, #f7f8f0 100%); --main-grad: radial-gradient(circle at 10% -6%, rgba(143, 168, 106, 0.09), transparent 44%), radial-gradient(circle at 92% 4%, rgba(224, 234, 198, 0.08), transparent 40%); --drift: url("data:image/svg+xml,"); --drift-size: 150px; --drift-dir: 150px; --drift-dur: 34s; --drift-op: 0.60; --glow-dur: 26s; --tint-blue: #f0f5ff; --tint-blue-bd: #c0d4ff; --tint-blue-tx: #1d5fa8; --tint-purple: #f7f0ff; --tint-purple-bd: #ddc8f5; --tint-purple-tx: #6d3fb8; --tint-teal: #edfbf8; --tint-teal-bd: #b0ebe2; --tint-teal-tx: #0e7d6d; --tint-green: #edf7ed; --tint-green-bd: #bce8bb; --tint-green-tx: #1d7a3a; --tint-gray: #f5f6f8; --tint-gray-bd: #d8dde4; --tint-gray-tx: #4a5568; --tint-orange: #fff3e6; --tint-orange-bd: #ffd9b0; --tint-orange-tx: #a05a14; --tint-red: #ffecec; --tint-red-bd: #ffc9c9; --tint-red-tx: #b03030; --tint-yellow: #fff7e6; --tint-yellow-bd: #ffe1a6; --tint-yellow-tx: #8a6a14; } /* ===== 🎋 芦苇 ===== */ [data-theme="reed"] { color-scheme: light; --primary: #a89168; --primary-dark: #8e7952; --primary-deep: #7c6b4d; --primary-bg: #f8f4ec; --primary-soft: rgba(168, 145, 104, 0.12); --blue: #1677ff; --bg: #faf8f4; --card: #fffefb; --surface: #fdfcf9; --hover-bg: #faf8f4; --border: #ebe5d8; --text: #2c2822; --text-sub: #49443c; --muted: #948d7e; --danger: #e5484d; --warn: #f5a524; --danger-bg: #fdf2f3; --danger-text: #c33d41; --danger-border: #e9aea7; --warn-bg: #fef7eb; --warn-text: #c4841d; --warn-border: #efcb90; --side-bg: #36301f; --side-bg2: #2e291b; --side-text: #dfdedb; --side-nav: #c7c5c0; --side-muted: #96938b; --side-hover: rgba(255, 255, 255, 0.07); --side-active: #a89168; --side-active-text: #ffffff; --side-foot-text: #8a877d; --side-user-bg: rgba(255, 255, 255, 0.06); --side-user-sub: #aba8a1; --login-bg1: #241f12; --login-bg2: #3a321c; --login-bg3: #2e2716; --login-hero: #ebeae8; --login-hero-sub: #a19d92; --login-point: #c1beb7; --login-point-line: rgba(161, 157, 146, 0.18); --login-accent: #e8dcc0; --login-link: #d8d1c4; --login-glass: rgba(255, 255, 255, 0.08); --login-glass-line: rgba(198, 184, 157, 0.5); --login-glass-line2: rgba(198, 184, 157, 0.35); --login-yixn: #cfcdc7; --login-card: #ffffff; --login-tab-bg: #fcfcfa; --login-tab-text: #756f62; --login-label: #49443c; --login-input-bg: #fdfcfb; --login-input-border: #ebe5d8; --login-tip: #948d7e; --login-divider: #ebe5d8; --input-bg: #fffefb; --radius: 10px; --shadow: 0 1px 3px rgba(0, 0, 0, 0.06); --side-grad: linear-gradient(170deg, #423c2c 0%, #36301f 58%, #48402b 100%); --side-art: url("data:image/svg+xml,"); --side-art-op: 0.19; --side-pattern: url("data:image/svg+xml,"); --side-pattern-op: 0.09; --side-glow: radial-gradient(ellipse 90% 46% at 50% 0%, rgba(212, 200, 180, 0.20), transparent 62%); --login-art: url("data:image/svg+xml,"); --login-art-op: 0.24; --login-mesh: radial-gradient(ellipse 62% 52% at 76% 16%, rgba(168, 145, 104, 0.26), transparent 60%), radial-gradient(ellipse 54% 44% at 14% 82%, rgba(232, 220, 192, 0.18), transparent 62%), radial-gradient(circle at 50% 112%, rgba(168, 145, 104, 0.16), transparent 56%); --login-art-pos: center bottom; --login-art-size: cover; --login-art-repeat: no-repeat; --top-grad: linear-gradient(180deg, #fffefb 0%, #f9f6f1 100%); --main-grad: radial-gradient(circle at 10% -6%, rgba(168, 145, 104, 0.09), transparent 44%), radial-gradient(circle at 92% 4%, rgba(232, 220, 192, 0.08), transparent 40%); --drift: radial-gradient(circle at 64px 108px, rgba(218, 209, 192, 0.41) 0, rgba(218, 209, 192, 0.31) 1.2px, transparent 2.0px), radial-gradient(circle at 92px 76px, rgba(218, 209, 192, 0.42) 0, rgba(218, 209, 192, 0.32) 1.3px, transparent 2.1px), radial-gradient(circle at 16px 117px, rgba(218, 209, 192, 0.37) 0, rgba(218, 209, 192, 0.28) 0.8px, transparent 1.6px), radial-gradient(circle at 22px 84px, rgba(218, 209, 192, 0.36) 0, rgba(218, 209, 192, 0.27) 0.8px, transparent 1.6px), radial-gradient(circle at 92px 134px, rgba(218, 209, 192, 0.52) 0, rgba(218, 209, 192, 0.39) 0.9px, transparent 1.7px), radial-gradient(circle at 77px 107px, rgba(218, 209, 192, 0.29) 0, rgba(218, 209, 192, 0.22) 1.0px, transparent 1.8px), radial-gradient(circle at 147px 41px, rgba(218, 209, 192, 0.28) 0, rgba(218, 209, 192, 0.21) 0.9px, transparent 1.7px), radial-gradient(circle at 75px 105px, rgba(218, 209, 192, 0.40) 0, rgba(218, 209, 192, 0.30) 1.4px, transparent 2.2px), radial-gradient(circle at 111px 51px, rgba(218, 209, 192, 0.30) 0, rgba(218, 209, 192, 0.23) 1.3px, transparent 2.1px), radial-gradient(circle at 135px 19px, rgba(218, 209, 192, 0.31) 0, rgba(218, 209, 192, 0.23) 0.8px, transparent 1.6px), radial-gradient(circle at 61px 77px, rgba(218, 209, 192, 0.52) 0, rgba(218, 209, 192, 0.39) 1.5px, transparent 2.3px), radial-gradient(circle at 82px 63px, rgba(218, 209, 192, 0.49) 0, rgba(218, 209, 192, 0.37) 1.5px, transparent 2.3px), radial-gradient(circle at 4px 65px, rgba(218, 209, 192, 0.43) 0, rgba(218, 209, 192, 0.32) 0.6px, transparent 1.4px), radial-gradient(circle at 148px 67px, rgba(218, 209, 192, 0.32) 0, rgba(218, 209, 192, 0.24) 1.5px, transparent 2.3px), radial-gradient(circle at 62px 31px, rgba(218, 209, 192, 0.39) 0, rgba(218, 209, 192, 0.29) 0.7px, transparent 1.5px), radial-gradient(circle at 46px 123px, rgba(218, 209, 192, 0.41) 0, rgba(218, 209, 192, 0.31) 0.9px, transparent 1.7px), radial-gradient(circle at 120px 115px, rgba(218, 209, 192, 0.51) 0, rgba(218, 209, 192, 0.38) 0.8px, transparent 1.6px), radial-gradient(circle at 129px 129px, rgba(218, 209, 192, 0.50) 0, rgba(218, 209, 192, 0.37) 1.4px, transparent 2.2px), radial-gradient(circle at 17px 57px, rgba(218, 209, 192, 0.44) 0, rgba(218, 209, 192, 0.33) 1.3px, transparent 2.1px), radial-gradient(circle at 98px 73px, rgba(218, 209, 192, 0.44) 0, rgba(218, 209, 192, 0.33) 0.8px, transparent 1.6px), radial-gradient(circle at 92px 119px, rgba(218, 209, 192, 0.39) 0, rgba(218, 209, 192, 0.29) 1.2px, transparent 2.0px), radial-gradient(circle at 60px 73px, rgba(218, 209, 192, 0.32) 0, rgba(218, 209, 192, 0.24) 0.8px, transparent 1.6px); --drift-size: 150px; --drift-dir: 150px; --drift-dur: 33s; --drift-op: 0.60; --glow-dur: 25s; --tint-blue: #f0f5ff; --tint-blue-bd: #c0d4ff; --tint-blue-tx: #1d5fa8; --tint-purple: #f7f0ff; --tint-purple-bd: #ddc8f5; --tint-purple-tx: #6d3fb8; --tint-teal: #edfbf8; --tint-teal-bd: #b0ebe2; --tint-teal-tx: #0e7d6d; --tint-green: #edf7ed; --tint-green-bd: #bce8bb; --tint-green-tx: #1d7a3a; --tint-gray: #f5f6f8; --tint-gray-bd: #d8dde4; --tint-gray-tx: #4a5568; --tint-orange: #fff3e6; --tint-orange-bd: #ffd9b0; --tint-orange-tx: #a05a14; --tint-red: #ffecec; --tint-red-bd: #ffc9c9; --tint-red-tx: #b03030; --tint-yellow: #fff7e6; --tint-yellow-bd: #ffe1a6; --tint-yellow-tx: #8a6a14; } /* ===== 🌛 竹月 ===== */ [data-theme="bamboomoon"] { color-scheme: dark; --primary: #7fb89a; --primary-dark: #649c80; --primary-deep: #5e8872; --primary-bg: rgba(127,184,154,0.15); --primary-soft: rgba(127, 184, 154, 0.18); --blue: #6ba4ff; --bg: #101714; --card: #252b29; --surface: #1e2422; --hover-bg: #1e2522; --border: #414744; --text: #e2efe9; --text-sub: #c9dad2; --muted: #87a396; --danger: #ff6b6b; --warn: #ffb340; --danger-bg: #3f3331; --danger-text: #ff9f9f; --danger-border: #845452; --warn-bg: #3f3b2c; --warn-text: #ffca79; --warn-border: #8d7242; --side-bg: #0a100e; --side-bg2: #090e0c; --side-text: #d8d9d8; --side-nav: #babcbc; --side-muted: #808382; --side-hover: rgba(255, 255, 255, 0.07); --side-active: #7fb89a; --side-active-text: #101418; --side-foot-text: #717473; --side-user-bg: rgba(255, 255, 255, 0.06); --side-user-sub: #989b9a; --login-bg1: #060c0a; --login-bg2: #111a16; --login-bg3: #0b1310; --login-hero: #e7e8e8; --login-hero-sub: #8d9190; --login-point: #b4b7b6; --login-point-line: rgba(141, 145, 144, 0.18); --login-accent: #c8e8d8; --login-link: #cadbd2; --login-glass: rgba(255, 255, 255, 0.08); --login-glass-line: rgba(172, 209, 189, 0.5); --login-glass-line2: rgba(172, 209, 189, 0.35); --login-yixn: #c5c7c6; --login-card: #252b29; --login-tab-bg: #1a211e; --login-tab-text: #a2baaf; --login-label: #c9dad2; --login-input-bg: #1d2321; --login-input-border: #414744; --login-tip: #87a396; --login-divider: #414744; --input-bg: #252b29; --radius: 10px; --shadow: 0 1px 3px rgba(0, 0, 0, 0.4); --side-grad: linear-gradient(170deg, #191e1c 0%, #0a100e 58%, #1d2b24 100%); --side-art: url("data:image/svg+xml,"); --side-art-op: 0.19; --side-pattern: url("data:image/svg+xml,"); --side-pattern-op: 0.09; --side-glow: radial-gradient(ellipse 90% 46% at 50% 0%, rgba(191, 220, 204, 0.20), transparent 62%); --login-art: url("data:image/svg+xml,"); --login-art-op: 0.24; --login-mesh: radial-gradient(ellipse 62% 52% at 76% 16%, rgba(127, 184, 154, 0.26), transparent 60%), radial-gradient(ellipse 54% 44% at 14% 82%, rgba(200, 232, 216, 0.18), transparent 62%), radial-gradient(circle at 50% 112%, rgba(127, 184, 154, 0.16), transparent 56%); --login-art-pos: center bottom; --login-art-size: cover; --login-art-repeat: no-repeat; --top-grad: linear-gradient(180deg, #252b29 0%, #2e3934 100%); --main-grad: radial-gradient(circle at 10% -6%, rgba(127, 184, 154, 0.16), transparent 44%), radial-gradient(circle at 92% 4%, rgba(200, 232, 216, 0.13), transparent 40%); --drift: radial-gradient(circle at 64px 108px, rgba(201, 225, 213, 0.41) 0, rgba(201, 225, 213, 0.31) 1.2px, transparent 2.0px), radial-gradient(circle at 92px 76px, rgba(201, 225, 213, 0.42) 0, rgba(201, 225, 213, 0.32) 1.3px, transparent 2.1px), radial-gradient(circle at 16px 117px, rgba(201, 225, 213, 0.37) 0, rgba(201, 225, 213, 0.28) 0.8px, transparent 1.6px), radial-gradient(circle at 22px 84px, rgba(201, 225, 213, 0.36) 0, rgba(201, 225, 213, 0.27) 0.8px, transparent 1.6px), radial-gradient(circle at 92px 134px, rgba(201, 225, 213, 0.52) 0, rgba(201, 225, 213, 0.39) 0.9px, transparent 1.7px), radial-gradient(circle at 77px 107px, rgba(201, 225, 213, 0.29) 0, rgba(201, 225, 213, 0.22) 1.0px, transparent 1.8px), radial-gradient(circle at 147px 41px, rgba(201, 225, 213, 0.28) 0, rgba(201, 225, 213, 0.21) 0.9px, transparent 1.7px), radial-gradient(circle at 75px 105px, rgba(201, 225, 213, 0.40) 0, rgba(201, 225, 213, 0.30) 1.4px, transparent 2.2px), radial-gradient(circle at 111px 51px, rgba(201, 225, 213, 0.30) 0, rgba(201, 225, 213, 0.23) 1.3px, transparent 2.1px), radial-gradient(circle at 135px 19px, rgba(201, 225, 213, 0.31) 0, rgba(201, 225, 213, 0.23) 0.8px, transparent 1.6px), radial-gradient(circle at 61px 77px, rgba(201, 225, 213, 0.52) 0, rgba(201, 225, 213, 0.39) 1.5px, transparent 2.3px), radial-gradient(circle at 82px 63px, rgba(201, 225, 213, 0.49) 0, rgba(201, 225, 213, 0.37) 1.5px, transparent 2.3px), radial-gradient(circle at 4px 65px, rgba(201, 225, 213, 0.43) 0, rgba(201, 225, 213, 0.32) 0.6px, transparent 1.4px), radial-gradient(circle at 148px 67px, rgba(201, 225, 213, 0.32) 0, rgba(201, 225, 213, 0.24) 1.5px, transparent 2.3px), radial-gradient(circle at 62px 31px, rgba(201, 225, 213, 0.39) 0, rgba(201, 225, 213, 0.29) 0.7px, transparent 1.5px), radial-gradient(circle at 46px 123px, rgba(201, 225, 213, 0.41) 0, rgba(201, 225, 213, 0.31) 0.9px, transparent 1.7px), radial-gradient(circle at 120px 115px, rgba(201, 225, 213, 0.51) 0, rgba(201, 225, 213, 0.38) 0.8px, transparent 1.6px), radial-gradient(circle at 129px 129px, rgba(201, 225, 213, 0.50) 0, rgba(201, 225, 213, 0.37) 1.4px, transparent 2.2px), radial-gradient(circle at 17px 57px, rgba(201, 225, 213, 0.44) 0, rgba(201, 225, 213, 0.33) 1.3px, transparent 2.1px), radial-gradient(circle at 98px 73px, rgba(201, 225, 213, 0.44) 0, rgba(201, 225, 213, 0.33) 0.8px, transparent 1.6px), radial-gradient(circle at 92px 119px, rgba(201, 225, 213, 0.39) 0, rgba(201, 225, 213, 0.29) 1.2px, transparent 2.0px), radial-gradient(circle at 60px 73px, rgba(201, 225, 213, 0.32) 0, rgba(201, 225, 213, 0.24) 0.8px, transparent 1.6px); --drift-size: 150px; --drift-dir: 150px; --drift-dur: 35s; --drift-op: 0.60; --glow-dur: 27s; --tint-blue: #454b4b; --tint-blue-bd: #6a7480; --tint-blue-tx: #85a9d0; --tint-purple: #474b4b; --tint-purple-bd: #73707d; --tint-purple-tx: #b097d9; --tint-teal: #454c4a; --tint-teal-bd: #657b77; --tint-teal-tx: #7db9b0; --tint-green: #454c48; --tint-green-bd: #687b6a; --tint-green-tx: #85b795; --tint-gray: #464b4a; --tint-gray-bd: #717777; --tint-gray-tx: #9da3ad; --tint-orange: #484b47; --tint-orange-bd: #7e7667; --tint-orange-tx: #cca680; --tint-red: #484a48; --tint-red-bd: #7e716f; --tint-red-tx: #d48f8f; --tint-yellow: #484c47; --tint-yellow-bd: #7e7863; --tint-yellow-tx: #c0af80; } /* ================= 换肤面板 ================= */ .zjc-skin-mask { position: fixed; inset: 0; z-index: 10001; background: rgba(0, 0, 0, 0.5); display: flex; align-items: center; justify-content: center; padding: 20px; overflow: auto; } .zjc-skin-modal { width: 100%; max-width: 840px; background: var(--card); border-radius: 18px; box-shadow: 0 24px 70px rgba(0, 0, 0, 0.4); overflow: hidden; display: flex; flex-direction: column; max-height: calc(100vh - 40px); } .zjc-skin-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 18px 22px 14px; border-bottom: 1px solid var(--border); } .zjc-skin-title { font-size: 17px; font-weight: 700; color: var(--text); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; } .zjc-skin-ico { font-size: 22px; } .zjc-skin-sub { font-size: 13px; font-weight: 400; color: var(--muted); margin-top: 4px; width: 100%; } .zjc-skin-x { background: none; border: none; font-size: 20px; color: var(--muted); cursor: pointer; padding: 2px 8px; border-radius: 6px; line-height: 1; flex: none; } .zjc-skin-x:hover { background: var(--hover-bg); color: var(--text); } .zjc-skin-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; padding: 18px 22px; overflow-y: auto; flex: 1; } @media (max-width: 760px) { .zjc-skin-grid { grid-template-columns: repeat(2, 1fr); } } @media (max-width: 480px) { .zjc-skin-grid { grid-template-columns: 1fr; } } .zjc-skin-card { border: 2px solid var(--border); border-radius: 12px; padding: 10px; cursor: pointer; background: var(--card); text-align: left; transition: transform .15s, border-color .15s, box-shadow .15s; } .zjc-skin-card:hover { transform: translateY(-3px); border-color: var(--primary); box-shadow: 0 8px 20px rgba(0, 0, 0, 0.14); } .zjc-skin-card.on { border-color: var(--primary); box-shadow: 0 0 0 3px var(--primary-soft); } /* 迷你界面缩略预览（含主题图案，所见即所得） */ .zjc-skin-prev { height: 84px; border-radius: 8px; overflow: hidden; display: flex; border: 1px solid var(--border); margin-bottom: 9px; } .zjc-skin-prev .sp-side { width: 34%; padding: 8px 6px; display: flex; flex-direction: column; gap: 4px; position: relative; overflow: hidden; } .zjc-skin-prev .sp-side i { display: block; height: 4px; border-radius: 2px; position: relative; z-index: 2; } .zjc-skin-prev .sp-side i:first-child { height: 7px; } /* 图案层：细纹铺底 + 主题装饰画压底 */ .zjc-skin-prev .sp-art { position: absolute; inset: 0; z-index: 1; opacity: .5; pointer-events: none; background-repeat: repeat; } .zjc-skin-prev .sp-art-big { background-repeat: no-repeat; background-position: bottom center; background-size: 100% 80%; opacity: .85; } .zjc-skin-prev .sp-main { flex: 1; padding: 7px; display: flex; flex-direction: column; gap: 5px; } .zjc-skin-prev .sp-top { height: 9px; border-radius: 3px; } .zjc-skin-prev .sp-row { display: flex; gap: 5px; flex: 1; } .zjc-skin-prev .sp-card { flex: 1; border-radius: 4px; } .zjc-skin-prev .sp-btn { width: 28px; border-radius: 4px; } /* 预览卡里的飘落层（真跑动画，选皮肤时就能看见动效） */ .zjc-skin-prev .sp-drift { position: absolute; z-index: 2; pointer-events: none; left: 0; right: 0; top: -18px; height: calc(100% + 36px); background-repeat: repeat; animation: zjcDriftMini 30s linear infinite; } @keyframes zjcDriftMini { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(0, 18px, 0); } } html.zjc-no-motion .zjc-skin-prev .sp-drift { animation: none !important; } @media (prefers-reduced-motion: reduce) { .zjc-skin-prev .sp-drift { animation: none !important; } } .zjc-skin-name { font-size: 14px; font-weight: 600; color: var(--text); display: flex; align-items: center; gap: 6px; } .zjc-skin-tags { display: flex; align-items: center; gap: 5px; flex-wrap: wrap; margin-top: 3px; } .zjc-skin-tag { font-size: 11px; font-weight: 400; color: var(--muted); background: var(--surface); border: 1px solid var(--border); border-radius: 20px; padding: 1px 7px; } .zjc-tag-calm { color: #2e9e6b; border-color: rgba(46, 158, 107, .35); background: rgba(46, 158, 107, .09); } html[data-theme="ink"] .zjc-tag-calm, html[data-theme="pine"] .zjc-tag-calm, html[data-theme="nebula"] .zjc-tag-calm { color: #6fd39c; border-color: rgba(111, 211, 156, .35); } .zjc-tag-mv { color: #2f7fd1; border-color: rgba(47, 127, 209, .32); background: rgba(47, 127, 209, .09); } html[data-theme="ink"] .zjc-tag-mv, html[data-theme="pine"] .zjc-tag-mv, html[data-theme="nebula"] .zjc-tag-mv { color: #7ab8f0; border-color: rgba(122, 184, 240, .34); } .zjc-tag-st { opacity: .72; } .zjc-skin-check { margin-left: auto; color: var(--primary); font-weight: 700; } /* 动效开关 */ .zjc-motion-btn { display: inline-block; margin-left: 8px; margin-top: 6px; font-size: 12px; font-weight: 500; color: var(--primary); background: var(--primary-bg); border: 1px solid var(--border); border-radius: 20px; padding: 3px 12px; cursor: pointer; } .zjc-motion-btn:hover { filter: brightness(1.05); } .zjc-motion-btn.off { color: var(--muted); background: var(--surface); } .zjc-skin-foot { display: flex; justify-content: space-between; gap: 10px; padding: 14px 22px 18px; border-top: 1px solid var(--border); } /* 侧栏换肤按钮 */ .side-skin-btn { display: block; width: 100%; margin-bottom: 10px; background: var(--side-user-bg); border: 1px solid rgba(128, 128, 128, 0.28); color: var(--side-text); border-radius: 9px; padding: 8px 10px; font-size: 13px; cursor: pointer; text-align: left; transition: background .15s, color .15s, border-color .15s; } .side-skin-btn:hover { background: var(--primary); border-color: var(--primary); color: #fff; } /* 登录页换肤入口 */ .login-skin-row { margin-top: 10px; text-align: center; font-size: 13px; } .login-skin-row a { color: var(--primary-dark); text-decoration: none; opacity: .92; } .login-skin-row a:hover { text-decoration: underline; opacity: 1; }