/* 易客繁花 · 风格套装（html[data-theme]） */

/* 默认：深蓝科技（恢复原配色） */
:root,
[data-theme="keji"] {
  --theme-name: "科技蓝白";
  --bg: #eef2f6;
  --bg-soft: #e3e9f0;
  --white: #ffffff;
  --text: #122033;
  --text-2: #5a6b7d;
  --text-3: #8a9aab;
  --line: #d5e0eb;
  --primary: #1677ff;
  --primary-hover: #3c8dff;
  --danger: #ff4d4f;
  --header-h: 64px;
  --ink: #07111f;
  --ink-2: #102033;
  --mist: #d6e7f8;
  --gold: #d6b56e;
  --accent: #13c2c2;
  --accent-soft: #69e0e0;
  --surface: #ffffff;
  --surface-2: #f5f8fb;
  --header-bg: rgba(7, 17, 31, 0.72);
  --header-border: rgba(90, 160, 255, 0.14);
  --header-text: rgba(240, 247, 255, 0.98);
  --header-muted: rgba(190, 214, 240, 0.78);
  --header-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
  --hero-bg:
    radial-gradient(1100px 560px at 18% 20%, #18385c 0%, transparent 56%),
    radial-gradient(820px 460px at 88% 28%, rgba(19, 194, 194, 0.18) 0%, transparent 52%),
    linear-gradient(135deg, #07111f 0%, #102033 48%, #0b1c30 100%);
  --hero-glow-a: rgba(22, 119, 255, 0.35);
  --hero-glow-b: rgba(19, 194, 194, 0.18);
  --hero-core-bg:
    radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.2), transparent 45%),
    linear-gradient(160deg, #1677ff, #0d243d);
  --hero-text: #ffffff;
  --hero-muted: rgba(220, 231, 242, 0.78);
  --hero-brand: linear-gradient(120deg, #fff 15%, #69e0e0 55%, #d6b56e 100%);
  --hero-btn: linear-gradient(120deg, #1677ff, #13c2c2);
  --hero-btn-text: #ffffff;
  --hero-btn-shadow: rgba(22, 119, 255, 0.32);
  --hero-ghost-border: rgba(255, 255, 255, 0.35);
  --hero-ghost-text: #ffffff;
  --footer-bg: #07111f;
  --footer-text: #a8bfd6;
  --footer-muted: #6f879e;
  --login-page-bg: #070d16;
  --login-bg:
    radial-gradient(800px 420px at 18% 20%, rgba(22, 119, 255, 0.28), transparent 60%),
    radial-gradient(700px 380px at 82% 78%, rgba(19, 194, 194, 0.16), transparent 55%),
    linear-gradient(160deg, #070d16 0%, #0d1826 50%, #08111c 100%);
  --login-grid: rgba(90, 160, 255, 0.12);
  --login-panel: rgba(10, 20, 34, 0.82);
  --login-border: rgba(90, 160, 255, 0.28);
  --login-text: #e8f2ff;
  --login-muted: #8aa4bd;
  --login-input-bg: rgba(5, 12, 22, 0.75);
  --login-btn: linear-gradient(90deg, #1677ff, #13c2c2);
  --login-btn-shadow: rgba(22, 119, 255, 0.32);
  --card-radius: 8px;
  --control-radius: 6px;
  --font-sans: "Manrope", "PingFang SC", "Microsoft YaHei", "Noto Sans SC", sans-serif;
  --font-display: "Noto Serif SC", "Songti SC", "SimSun", serif;
}

[data-theme="fanhua"] {
  --theme-name: "繁花夜宴";
  --bg: #f7f1ef;
  --bg-soft: #efe6e2;
  --white: #fffdfb;
  --text: #2a1c1d;
  --text-2: #6b5558;
  --text-3: #9a8084;
  --line: #eadfdb;
  --primary: #9e2f45;
  --primary-hover: #b53c55;
  --danger: #c0392b;
  --header-h: 68px;
  --ink: #2a1218;
  --ink-2: #4a1e28;
  --mist: #f0e4df;
  --gold: #c4a36e;
  --accent: #c4a36e;
  --accent-soft: #e2c9a0;
  --surface: #fffdfb;
  --surface-2: #f3ebe7;
  --header-bg: #2a1218;
  --header-border: rgba(255, 255, 255, 0.1);
  --header-text: rgba(255, 255, 255, 0.96);
  --header-muted: rgba(255, 255, 255, 0.7);
  --hero-bg:
    radial-gradient(1100px 560px at 16% 18%, #5a2434 0%, transparent 56%),
    radial-gradient(820px 460px at 88% 28%, rgba(196, 163, 110, 0.22) 0%, transparent 52%),
    linear-gradient(135deg, #2a1218 0%, #4a1e28 48%, #3a1620 100%);
  --hero-glow-a: rgba(158, 47, 69, 0.42);
  --hero-glow-b: rgba(196, 163, 110, 0.22);
  --hero-core-bg:
    radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.22), transparent 45%),
    linear-gradient(160deg, #9e2f45, #4a1e28);
  --footer-bg: #2a1218;
  --footer-text: #cbb4b7;
  --footer-muted: #8f7579;
  --login-page-bg: #1c0f12;
  --login-bg:
    radial-gradient(800px 420px at 18% 20%, rgba(158, 47, 69, 0.28), transparent 60%),
    radial-gradient(700px 380px at 82% 78%, rgba(196, 163, 110, 0.16), transparent 55%),
    linear-gradient(160deg, #1c0f12 0%, #2a1218 50%, #180d10 100%);
  --login-grid: rgba(226, 201, 160, 0.1);
  --login-panel: rgba(255, 253, 251, 0.07);
  --login-border: rgba(255, 255, 255, 0.14);
  --login-text: #f4e8e4;
  --login-muted: #cbb4b7;
  --login-input-bg: rgba(0, 0, 0, 0.28);
  --login-btn: linear-gradient(90deg, #9e2f45, #c4a36e);
  --login-btn-shadow: rgba(158, 47, 69, 0.32);
  --card-radius: 10px;
  --control-radius: 8px;
  --header-shadow: 0 10px 30px rgba(0, 0, 0, 0.22);
  --hero-text: #ffffff;
  --hero-muted: rgba(220, 231, 242, 0.78);
  --hero-brand: linear-gradient(120deg, #fff 20%, var(--accent-soft) 100%);
  --hero-btn: linear-gradient(120deg, #d6b56e, #b89245);
  --hero-btn-text: #1a140c;
  --hero-btn-shadow: rgba(184, 146, 69, 0.28);
  --hero-ghost-border: rgba(255, 255, 255, 0.35);
  --hero-ghost-text: #ffffff;
}

/* 荧幕叙事：影院感深色 + 青绿点缀 */
[data-theme="cinema"] {
  --theme-name: "荧幕叙事";
  --bg: #eceff2;
  --bg-soft: #e2e7ec;
  --white: #ffffff;
  --text: #172027;
  --text-2: #5a6772;
  --text-3: #88949e;
  --line: #d8dee5;
  --primary: #0f766e;
  --primary-hover: #0d9488;
  --danger: #dc2626;
  --ink: #0b1419;
  --ink-2: #15232c;
  --mist: #d7e8e5;
  --gold: #d4b483;
  --accent: #14b8a6;
  --accent-soft: #5eead4;
  --surface: #ffffff;
  --surface-2: #f3f6f8;
  --header-bg: #0b1419;
  --header-border: rgba(255, 255, 255, 0.08);
  --header-text: rgba(255, 255, 255, 0.96);
  --header-muted: rgba(255, 255, 255, 0.68);
  --hero-bg:
    radial-gradient(1100px 560px at 18% 20%, #16333a 0%, transparent 55%),
    radial-gradient(820px 460px at 86% 30%, rgba(20, 184, 166, 0.18) 0%, transparent 50%),
    linear-gradient(135deg, #0b1419 0%, #15232c 48%, #0f1c24 100%);
  --hero-glow-a: rgba(15, 118, 110, 0.4);
  --hero-glow-b: rgba(212, 180, 131, 0.18);
  --hero-core-bg:
    radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.18), transparent 45%),
    linear-gradient(160deg, #0f766e, #15232c);
  --footer-bg: #0b1419;
  --footer-text: #a8b6bf;
  --footer-muted: #73828c;
  --login-page-bg: #081015;
  --login-bg:
    radial-gradient(800px 420px at 18% 20%, rgba(15, 118, 110, 0.28), transparent 60%),
    radial-gradient(700px 380px at 82% 78%, rgba(20, 184, 166, 0.14), transparent 55%),
    linear-gradient(160deg, #081015 0%, #0b1419 50%, #071018 100%);
  --login-grid: rgba(94, 234, 212, 0.08);
  --login-panel: rgba(255, 255, 255, 0.05);
  --login-border: rgba(255, 255, 255, 0.12);
  --login-text: #e6eef2;
  --login-muted: #a8b6bf;
  --login-input-bg: rgba(0, 0, 0, 0.3);
  --login-btn: linear-gradient(90deg, #0f766e, #14b8a6);
  --login-btn-shadow: rgba(15, 118, 110, 0.3);
  --card-radius: 8px;
  --control-radius: 6px;
  --header-shadow: 0 10px 30px rgba(0, 0, 0, 0.22);
  --hero-text: #ffffff;
  --hero-muted: rgba(220, 231, 242, 0.78);
  --hero-brand: linear-gradient(120deg, #fff 20%, var(--accent-soft) 100%);
  --hero-btn: linear-gradient(120deg, #d6b56e, #b89245);
  --hero-btn-text: #1a140c;
  --hero-btn-shadow: rgba(184, 146, 69, 0.28);
  --hero-ghost-border: rgba(255, 255, 255, 0.35);
  --hero-ghost-text: #ffffff;

}

/* 青瓷简册：浅底青瓷色 */
[data-theme="qingci"] {
  --theme-name: "青瓷简册";
  --bg: #eef5f3;
  --bg-soft: #e3eeea;
  --white: #fbfffe;
  --text: #1d2d2a;
  --text-2: #55706a;
  --text-3: #849a94;
  --line: #d5e5e0;
  --primary: #2f6f64;
  --primary-hover: #3a8578;
  --danger: #b42318;
  --ink: #16352f;
  --ink-2: #214840;
  --mist: #d8ebe5;
  --gold: #b08d57;
  --accent: #b08d57;
  --accent-soft: #d7c090;
  --surface: #fbfffe;
  --surface-2: #eef7f4;
  --header-bg: #16352f;
  --header-border: rgba(255, 255, 255, 0.1);
  --header-text: rgba(255, 255, 255, 0.96);
  --header-muted: rgba(255, 255, 255, 0.7);
  --hero-bg:
    radial-gradient(1100px 560px at 16% 18%, #2a5a50 0%, transparent 56%),
    radial-gradient(820px 460px at 88% 28%, rgba(176, 141, 87, 0.2) 0%, transparent 52%),
    linear-gradient(135deg, #16352f 0%, #214840 48%, #1a3d36 100%);
  --hero-glow-a: rgba(47, 111, 100, 0.4);
  --hero-glow-b: rgba(176, 141, 87, 0.2);
  --hero-core-bg:
    radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.2), transparent 45%),
    linear-gradient(160deg, #2f6f64, #214840);
  --footer-bg: #16352f;
  --footer-text: #b7cfc8;
  --footer-muted: #7f9b94;
  --login-page-bg: #102822;
  --login-bg:
    radial-gradient(800px 420px at 18% 20%, rgba(47, 111, 100, 0.3), transparent 60%),
    radial-gradient(700px 380px at 82% 78%, rgba(176, 141, 87, 0.14), transparent 55%),
    linear-gradient(160deg, #102822 0%, #16352f 50%, #0e221d 100%);
  --login-grid: rgba(215, 192, 144, 0.1);
  --login-panel: rgba(251, 255, 254, 0.06);
  --login-border: rgba(255, 255, 255, 0.14);
  --login-text: #e8f4f0;
  --login-muted: #b7cfc8;
  --login-input-bg: rgba(0, 0, 0, 0.28);
  --login-btn: linear-gradient(90deg, #2f6f64, #b08d57);
  --login-btn-shadow: rgba(47, 111, 100, 0.28);
  --card-radius: 12px;
  --control-radius: 8px;
  --header-shadow: 0 10px 30px rgba(0, 0, 0, 0.22);
  --hero-text: #ffffff;
  --hero-muted: rgba(220, 231, 242, 0.78);
  --hero-brand: linear-gradient(120deg, #fff 20%, var(--accent-soft) 100%);
  --hero-btn: linear-gradient(120deg, #d6b56e, #b89245);
  --hero-btn-text: #1a140c;
  --hero-btn-shadow: rgba(184, 146, 69, 0.28);
  --hero-ghost-border: rgba(255, 255, 255, 0.35);
  --hero-ghost-text: #ffffff;

}

/* 林野晨光：墨绿 + 柔和浅底 */
[data-theme="linye"] {
  --theme-name: "林野晨光";
  --bg: #f3f5ef;
  --bg-soft: #e8ebe2;
  --white: #fcfdf9;
  --text: #1f2a1c;
  --text-2: #5b6756;
  --text-3: #8a9484;
  --line: #dde3d4;
  --primary: #3f6b3a;
  --primary-hover: #4f8248;
  --danger: #b42318;
  --ink: #1c2b18;
  --ink-2: #2b4025;
  --mist: #e1e9d8;
  --gold: #c2a15a;
  --accent: #c2a15a;
  --accent-soft: #e2c98a;
  --surface: #fcfdf9;
  --surface-2: #f1f4ea;
  --header-bg: #1c2b18;
  --header-border: rgba(255, 255, 255, 0.1);
  --header-text: rgba(255, 255, 255, 0.96);
  --header-muted: rgba(255, 255, 255, 0.7);
  --hero-bg:
    radial-gradient(1100px 560px at 16% 18%, #355530 0%, transparent 56%),
    radial-gradient(820px 460px at 88% 28%, rgba(194, 161, 90, 0.2) 0%, transparent 52%),
    linear-gradient(135deg, #1c2b18 0%, #2b4025 48%, #23341e 100%);
  --hero-glow-a: rgba(63, 107, 58, 0.4);
  --hero-glow-b: rgba(194, 161, 90, 0.2);
  --hero-core-bg:
    radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.2), transparent 45%),
    linear-gradient(160deg, #3f6b3a, #2b4025);
  --footer-bg: #1c2b18;
  --footer-text: #c2cdb8;
  --footer-muted: #87947d;
  --login-page-bg: #142014;
  --login-bg:
    radial-gradient(800px 420px at 18% 20%, rgba(63, 107, 58, 0.3), transparent 60%),
    radial-gradient(700px 380px at 82% 78%, rgba(194, 161, 90, 0.14), transparent 55%),
    linear-gradient(160deg, #142014 0%, #1c2b18 50%, #111a10 100%);
  --login-grid: rgba(226, 201, 138, 0.1);
  --login-panel: rgba(252, 253, 249, 0.06);
  --login-border: rgba(255, 255, 255, 0.14);
  --login-text: #eef3e8;
  --login-muted: #c2cdb8;
  --login-input-bg: rgba(0, 0, 0, 0.28);
  --login-btn: linear-gradient(90deg, #3f6b3a, #c2a15a);
  --login-btn-shadow: rgba(63, 107, 58, 0.28);
  --card-radius: 10px;
  --control-radius: 8px;
  --header-shadow: 0 10px 30px rgba(0, 0, 0, 0.22);
  --hero-text: #ffffff;
  --hero-muted: rgba(220, 231, 242, 0.78);
  --hero-brand: linear-gradient(120deg, #fff 20%, var(--accent-soft) 100%);
  --hero-btn: linear-gradient(120deg, #d6b56e, #b89245);
  --hero-btn-text: #1a140c;
  --hero-btn-shadow: rgba(184, 146, 69, 0.28);
  --hero-ghost-border: rgba(255, 255, 255, 0.35);
  --hero-ghost-text: #ffffff;

}

/* 海风白昼：浅色清爽 */
[data-theme="haifeng"] {
  --theme-name: "海风白昼";
  --bg: #f2f6f8;
  --bg-soft: #e7eef2;
  --white: #ffffff;
  --text: #1a2630;
  --text-2: #5b6b78;
  --text-3: #8a98a4;
  --line: #d8e2e9;
  --primary: #1f6f8b;
  --primary-hover: #2785a6;
  --danger: #c0392b;
  --ink: #143447;
  --ink-2: #1d4a63;
  --mist: #d9e9f1;
  --gold: #b08948;
  --accent: #b08948;
  --accent-soft: #d4b57a;
  --surface: #ffffff;
  --surface-2: #f0f5f8;
  --header-bg: #143447;
  --header-border: rgba(255, 255, 255, 0.1);
  --header-text: rgba(255, 255, 255, 0.96);
  --header-muted: rgba(255, 255, 255, 0.7);
  --hero-bg:
    radial-gradient(1100px 560px at 16% 18%, #25556e 0%, transparent 56%),
    radial-gradient(820px 460px at 88% 28%, rgba(176, 137, 72, 0.18) 0%, transparent 52%),
    linear-gradient(135deg, #143447 0%, #1d4a63 48%, #183d52 100%);
  --hero-glow-a: rgba(31, 111, 139, 0.4);
  --hero-glow-b: rgba(176, 137, 72, 0.18);
  --hero-core-bg:
    radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.2), transparent 45%),
    linear-gradient(160deg, #1f6f8b, #1d4a63);
  --footer-bg: #143447;
  --footer-text: #b4c8d4;
  --footer-muted: #7f96a5;
  --login-page-bg: #0f2836;
  --login-bg:
    radial-gradient(800px 420px at 18% 20%, rgba(31, 111, 139, 0.3), transparent 60%),
    radial-gradient(700px 380px at 82% 78%, rgba(176, 137, 72, 0.14), transparent 55%),
    linear-gradient(160deg, #0f2836 0%, #143447 50%, #0d2230 100%);
  --login-grid: rgba(212, 181, 122, 0.1);
  --login-panel: rgba(255, 255, 255, 0.06);
  --login-border: rgba(255, 255, 255, 0.14);
  --login-text: #e8f1f6;
  --login-muted: #b4c8d4;
  --login-input-bg: rgba(0, 0, 0, 0.28);
  --login-btn: linear-gradient(90deg, #1f6f8b, #b08948);
  --login-btn-shadow: rgba(31, 111, 139, 0.28);
  --card-radius: 10px;
  --control-radius: 8px;
  --header-shadow: 0 10px 30px rgba(0, 0, 0, 0.22);
  --hero-text: #ffffff;
  --hero-muted: rgba(220, 231, 242, 0.78);
  --hero-brand: linear-gradient(120deg, #fff 20%, var(--accent-soft) 100%);
  --hero-btn: linear-gradient(120deg, #d6b56e, #b89245);
  --hero-btn-text: #1a140c;
  --hero-btn-shadow: rgba(184, 146, 69, 0.28);
  --hero-ghost-border: rgba(255, 255, 255, 0.35);
  --hero-ghost-text: #ffffff;

}