:root {
  color-scheme: light;
  --page: #f7f8fc;
  --surface: #ffffff;
  --surface-soft: #f0f3ff;
  --surface-strong: #171a2b;
  --text: #191c2d;
  --muted: #697087;
  --subtle: #9298aa;
  --primary: #5147df;
  --primary-dark: #4037c5;
  --primary-soft: #eeedff;
  --border: #e3e6ef;
  --border-strong: #d5d9e7;
  --success: #16835e;
  --success-soft: #eaf8f2;
  --danger: #ce3e4f;
  --danger-soft: #fff0f2;
  --warning: #a15c08;
  --warning-soft: #fff5df;
  --shadow-sm: 0 8px 30px rgba(31, 35, 65, 0.06);
  --shadow-lg: 0 24px 60px rgba(36, 39, 75, 0.11);
  --radius-sm: 12px;
  --radius-md: 18px;
  --radius-lg: 26px;
  --content-width: 1160px;
  --tool-width: 820px;
  --page-glow-primary: rgba(81, 71, 223, 0.09);
  --page-glow-secondary: rgba(83, 159, 238, 0.08);
  --header-background: rgba(247, 248, 252, 0.88);
  --card-background: rgba(255, 255, 255, 0.92);
  --surface-translucent: rgba(255, 255, 255, 0.72);
  --surface-input: #fbfcff;
  --surface-hover: #f8f9ff;
  --on-primary: #ffffff;
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --page: #11131c;
  --surface: #1a1d29;
  --surface-soft: #24283a;
  --surface-strong: #080a10;
  --text: #f1f3fa;
  --muted: #b2b8ca;
  --subtle: #858da3;
  --primary: #8e86ff;
  --primary-dark: #766deb;
  --primary-soft: #2d294f;
  --border: #303546;
  --border-strong: #42485d;
  --success: #58c99c;
  --success-soft: #17372d;
  --danger: #ff7d8c;
  --danger-soft: #431f29;
  --warning: #efb45d;
  --warning-soft: #3b2d18;
  --shadow-sm: 0 8px 30px rgba(0, 0, 0, 0.2);
  --shadow-lg: 0 24px 60px rgba(0, 0, 0, 0.34);
  --page-glow-primary: rgba(142, 134, 255, 0.13);
  --page-glow-secondary: rgba(75, 166, 255, 0.1);
  --header-background: rgba(17, 19, 28, 0.9);
  --card-background: rgba(26, 29, 41, 0.94);
  --surface-translucent: rgba(26, 29, 41, 0.78);
  --surface-input: #151823;
  --surface-hover: #25293a;
}

:root[data-theme="ocean"] {
  color-scheme: light;
  --page: #f1f8fb;
  --surface: #ffffff;
  --surface-soft: #e2f4f7;
  --surface-strong: #102d3a;
  --text: #14303d;
  --muted: #52707d;
  --subtle: #78909a;
  --primary: #087e96;
  --primary-dark: #05677c;
  --primary-soft: #dff4f7;
  --border: #d2e5e9;
  --border-strong: #b9d7dd;
  --page-glow-primary: rgba(8, 126, 150, 0.1);
  --page-glow-secondary: rgba(32, 155, 196, 0.1);
  --header-background: rgba(241, 248, 251, 0.9);
  --card-background: rgba(255, 255, 255, 0.94);
}

:root[data-theme="forest"] {
  color-scheme: light;
  --page: #f4f8f2;
  --surface: #ffffff;
  --surface-soft: #e8f2e4;
  --surface-strong: #203328;
  --text: #203128;
  --muted: #607166;
  --subtle: #89978d;
  --primary: #39734c;
  --primary-dark: #2c5d3c;
  --primary-soft: #e3f1e7;
  --border: #dbe6d9;
  --border-strong: #c5d7c3;
  --page-glow-primary: rgba(57, 115, 76, 0.1);
  --page-glow-secondary: rgba(116, 151, 79, 0.09);
  --header-background: rgba(244, 248, 242, 0.9);
  --card-background: rgba(255, 255, 255, 0.94);
}

:root[data-theme="pic-smaller"] {
  color-scheme: light;
  --page: #f5f5f5;
  --surface: #ffffff;
  --surface-soft: #f7f7f7;
  --surface-strong: #17352a;
  --text: #333333;
  --muted: #666666;
  --subtle: #858585;
  --primary: #078249;
  --primary-dark: #056b3c;
  --primary-soft: #e7f5ee;
  --border: #dfdfdf;
  --border-strong: #cccccc;
  --success: #078249;
  --success-soft: #e7f5ee;
  --page-glow-primary: rgba(7, 130, 73, 0.08);
  --page-glow-secondary: rgba(29, 165, 101, 0.06);
  --header-background: rgba(255, 255, 255, 0.92);
  --card-background: rgba(255, 255, 255, 0.96);
  --surface-translucent: rgba(255, 255, 255, 0.78);
  --surface-input: #fafafa;
  --surface-hover: #f3f8f5;
}

:root[data-theme="terrain-light"] {
  color-scheme: light;
  --page: #eef0e8;
  --surface: #ffffff;
  --surface-soft: #f6f7f1;
  --surface-strong: #26302f;
  --text: #202124;
  --muted: #62645f;
  --subtle: #8f948a;
  --primary: #2c6f6d;
  --primary-dark: #245b59;
  --primary-soft: #e4f0ef;
  --border: #d4d8ca;
  --border-strong: #bfc5b5;
  --success: #2c6f6d;
  --success-soft: #e4f0ef;
  --danger: #9b3d32;
  --danger-soft: #f7e9e6;
  --warning: #8a641c;
  --warning-soft: #f7f0df;
  --page-glow-primary: rgba(44, 111, 109, 0.08);
  --page-glow-secondary: rgba(143, 148, 138, 0.08);
  --header-background: rgba(238, 240, 232, 0.9);
  --card-background: rgba(255, 255, 255, 0.94);
  --surface-translucent: rgba(255, 255, 255, 0.76);
  --surface-input: #f8faf5;
  --surface-hover: #fbfcf8;
}

:root[data-theme="terrain-dark"] {
  color-scheme: dark;
  --page: #161b1b;
  --surface: #202727;
  --surface-soft: #1b2423;
  --surface-strong: #0f1514;
  --text: #edf2ec;
  --muted: #aeb8b3;
  --subtle: #7f8b86;
  --primary: #6ec6b8;
  --primary-dark: #56ad9f;
  --primary-soft: #263c3a;
  --border: #3a4543;
  --border-strong: #56605b;
  --success: #6ec6b8;
  --success-soft: #263c3a;
  --danger: #ff9b87;
  --danger-soft: #442b28;
  --warning: #e7bd72;
  --warning-soft: #3b3222;
  --shadow-sm: 0 8px 30px rgba(0, 0, 0, 0.24);
  --shadow-lg: 0 24px 60px rgba(0, 0, 0, 0.38);
  --page-glow-primary: rgba(110, 198, 184, 0.12);
  --page-glow-secondary: rgba(86, 96, 91, 0.12);
  --header-background: rgba(22, 27, 27, 0.9);
  --card-background: rgba(32, 39, 39, 0.94);
  --surface-translucent: rgba(32, 39, 39, 0.78);
  --surface-input: #131918;
  --surface-hover: #283130;
}