[data-theme="mondstadt"] {
  --bg-primary: #d3f5ec;
  --bg-secondary: rgba(240, 255, 250, 0.9);
  --bg-header: linear-gradient(135deg, rgba(130, 215, 185, 0.95) 0%, rgba(90, 185, 160, 0.95) 100%);
  --bg-panel: rgba(255, 255, 255, 0.8);
  --text-primary: #114c42;
  --text-secondary: #2f6d60;
  --text-light: #ffffff;
  --accent-color: #48c9b0;
  --accent-dark: #1abc9c;
  --shadow: 0 8px 24px rgba(26, 188, 156, 0.2);
  --border: 1px solid rgba(0, 80, 60, 0.1);
}


[data-theme="dark-mondstadt"] {
  --bg-primary: #0d1f1b;
  --bg-secondary: rgba(13, 31, 27, 0.85);
  --bg-header: linear-gradient(135deg, rgba(20, 90, 75, 0.95) 0%, rgba(15, 70, 60, 0.95) 100%);
  --bg-panel: rgba(20, 40, 36, 0.75);
  --text-primary: #ccf5e9;
  --text-secondary: #9fe3d0;
  --text-light: #e6fff8;
  --accent-color: #1abc9c;
  --accent-dark: #148f77;
  --shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
  --border: 1px solid rgba(0, 255, 200, 0.05);
}


[data-theme="liyue"] {
  --bg-primary: #fffaf0;
  --bg-secondary: rgba(255, 255, 255, 0.85);
  --bg-header: linear-gradient(135deg, rgba(255, 171, 64, 0.9) 0%, rgba(255, 202, 40, 0.9) 100%);
  --bg-panel: rgba(255, 255, 255, 0.7);
  --text-primary: #6d4c41;
  --text-secondary: #8d6e63;
  --text-light: #fff8e1;
  --accent-color: #fbc02d;
  --accent-dark: #f57f17;
  --shadow: 0 8px 32px rgba(255, 193, 7, 0.15);
  --border: 1px solid rgba(255, 193, 7, 0.2);
}

[data-theme="dark-liyue"] {
  --bg-primary: #2e1c0f;
  --bg-secondary: rgba(51, 34, 17, 0.85);
  --bg-header: linear-gradient(135deg, rgba(255, 143, 0, 0.9) 0%, rgba(255, 193, 7, 0.9) 100%);
  --bg-panel: rgba(51, 34, 17, 0.7);
  --text-primary: #ffe0b2;
  --text-secondary: #ffcc80;
  --text-light: #fff3e0;
  --accent-color: #ffb300;
  --accent-dark: #ef6c00;
  --shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
  --border: 1px solid rgba(255, 152, 0, 0.1);
}

[data-theme="inazuma"] {
  --bg-primary: #f3f0fb;
  --bg-secondary: rgba(255, 255, 255, 0.85);
  --bg-header: linear-gradient(135deg, rgba(125, 90, 255, 0.9) 0%, rgba(153, 102, 255, 0.9) 100%);
  --bg-panel: rgba(255, 255, 255, 0.7);
  --text-primary: #3f206e;
  --text-secondary: #5a2ca0;
  --text-light: #f3f0fb;
  --accent-color: #9c4dcc;
  --accent-dark: #6b29a2;
  --shadow: 0 8px 32px rgba(88, 66, 155, 0.15);
  --border: 1px solid rgba(255, 255, 255, 0.2);
}

[data-theme="dark-inazuma"] {
  --bg-primary: #1a142d;
  --bg-secondary: rgba(36, 26, 66, 0.85);
  --bg-header: linear-gradient(135deg, rgba(103, 58, 183, 0.9) 0%, rgba(81, 45, 168, 0.9) 100%);
  --bg-panel: rgba(36, 26, 66, 0.7);
  --text-primary: #e0d4ff;
  --text-secondary: #b39ddb;
  --text-light: #f3e5f5;
  --accent-color: #9575cd;
  --accent-dark: #7e57c2;
  --shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
  --border: 1px solid rgba(255, 255, 255, 0.1);
}

[data-theme="sumeru"] {
  --bg-primary: #e8f5e9;
  --bg-secondary: rgba(255, 255, 255, 0.8);
  --bg-header: linear-gradient(135deg, rgba(46, 125, 50, 0.9) 0%, rgba(56, 142, 60, 0.9) 100%);
  --bg-panel: rgba(255, 255, 255, 0.75);
  --text-primary: #1b5e20;
  --text-secondary: #2e7d32;
  --text-light: #e8f5e9;
  --accent-color: #4caf50;
  --accent-dark: #2e7d32;
  --shadow: 0 8px 32px rgba(31, 38, 135, 0.1);
  --border: 1px solid rgba(255, 255, 255, 0.18);
}

[data-theme="dark-sumeru"] {
  --bg-primary: #1a2e1d;
  --bg-secondary: rgba(30, 45, 33, 0.8);
  --bg-header: linear-gradient(135deg, rgba(27, 94, 32, 0.9) 0%, rgba(46, 125, 50, 0.9) 100%);
  --bg-panel: rgba(30, 45, 33, 0.75);
  --text-primary: #e8f5e9;
  --text-secondary: #a5d6a7;
  --text-light: #e8f5e9;
  --accent-color: #81c784;
  --accent-dark: #4caf50;
  --shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
  --border: 1px solid rgba(255, 255, 255, 0.1);
}

[data-theme="fontaine"] {
  --bg-primary: #d6ecfa;
  --bg-secondary: rgba(240, 248, 255, 0.85);
  --bg-header: linear-gradient(135deg, rgba(70, 130, 180, 0.95) 0%, rgba(100, 149, 237, 0.95) 100%);
  --bg-panel: rgba(255, 255, 255, 0.75);
  --text-primary: #0b2e4a;
  --text-secondary: #235d89;
  --text-light: #eaf6ff;
  --accent-color: #3c8dd9;
  --accent-dark: #2b6ca3;
  --shadow: 0 8px 32px rgba(44, 77, 115, 0.15);
  --border: 1px solid rgba(180, 210, 240, 0.3);
}


[data-theme="dark-fontaine"] {
  --bg-primary: #0b1725;
  --bg-secondary: rgba(15, 30, 50, 0.85);
  --bg-header: linear-gradient(135deg, rgba(28, 70, 115, 0.95) 0%, rgba(48, 100, 160, 0.95) 100%);
  --bg-panel: rgba(20, 40, 60, 0.75);
  --text-primary: #cfe9fd;
  --text-secondary: #9bc6f3;
  --text-light: #e8f6ff;
  --accent-color: #3b91e0;
  --accent-dark: #2466a6;
  --shadow: 0 8px 32px rgba(10, 20, 30, 0.5);
  --border: 1px solid rgba(80, 140, 200, 0.2);
}


[data-theme="natlan"] {
  --bg-primary: #fff3e0;
  --bg-secondary: rgba(255, 244, 229, 0.85);
  --bg-header: linear-gradient(135deg, rgba(255, 87, 34, 0.9) 0%, rgba(255, 138, 101, 0.9) 100%);
  --bg-panel: rgba(255, 244, 229, 0.75);
  --text-primary: #bf360c;
  --text-secondary: #e65100;
  --text-light: #fff3e0;
  --accent-color: #ff5722;
  --accent-dark: #d84315;
  --shadow: 0 8px 32px rgba(255, 87, 34, 0.2);
  --border: 1px solid rgba(255, 138, 101, 0.25);
}

[data-theme="dark-natlan"] {
  --bg-primary: #2d1000;
  --bg-secondary: rgba(66, 20, 10, 0.85);
  --bg-header: linear-gradient(135deg, rgba(198, 40, 40, 0.9) 0%, rgba(255, 87, 34, 0.9) 100%);
  --bg-panel: rgba(66, 20, 10, 0.7);
  --text-primary: #ffccbc;
  --text-secondary: #ff8a65;
  --text-light: #ffe0b2;
  --accent-color: #ff7043;
  --accent-dark: #d84315;
  --shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
  --border: 1px solid rgba(255, 138, 101, 0.15);
}

[data-theme="snezhnaya"] {
  --bg-primary: #e3f7fd;
  --bg-secondary: rgba(245, 255, 255, 0.95);
  --bg-header: linear-gradient(135deg, rgba(180, 220, 245, 0.95) 0%, rgba(160, 210, 235, 0.95) 100%);
  --bg-panel: rgba(255, 255, 255, 0.85);
  --text-primary: #102631;
  --text-secondary: #2d4a5a;
  --text-light: #ffffff;
  --accent-color: #8cd9f7;
  --accent-dark: #4fbfe7;
  --shadow: 0 8px 24px rgba(50, 130, 180, 0.15);
  --border: 1px solid rgba(180, 220, 255, 0.25);
}

[data-theme="dark-snezhnaya"] {
  --bg-primary: #101c24;
  --bg-secondary: rgba(16, 28, 36, 0.9);
  --bg-header: linear-gradient(135deg, rgba(80, 120, 140, 0.95) 0%, rgba(100, 160, 180, 0.95) 100%);
  --bg-panel: rgba(20, 32, 40, 0.8);
  --text-primary: #e6f9ff;
  --text-secondary: #b6dce9;
  --text-light: #dff7ff;
  --accent-color: #76daff;
  --accent-dark: #4ab8e4;
  --shadow: 0 8px 32px rgba(0, 40, 60, 0.5);
  --border: 1px solid rgba(100, 200, 255, 0.1);
}