html[data-palette="scenariob_palette"],
html[data-palette="casino_palette"] {
    --page-glow: rgba(212, 74, 57, 0.06);
    --page-bg-start: #f5efe4;
    --page-bg-end: #efe7da;
    --shell-surface: rgba(247, 241, 232, 0.94);
    --shell-border: rgba(165, 151, 130, 0.34);
    --panel: #f8f1e6;
    --panel-soft: #f1e8db;
    --panel-strong: #ebe1d1;
    --text: #15110e;
    --muted: #6f655c;
    --line: #cdbfab;
    --primary: #15110e;
    --primary-soft: #2b231d;
    --accent: #d44a39;
    --accent-hover: #b63f31;
    --danger: #ba1a1a;
    --disabled: #ddd2c3;
    --overlay: rgba(21, 17, 14, 0.28);
    --spinner-track: #ddd2c3;
    --spinner-active: #d44a39;
    --surface: #f6efe4;
    --surface-low: #f1e8db;
    --surface-container: #ebe1d1;
    --surface-card: #f8f1e6;
    --surface-dim: #e0d4c4;
    --surface-container-lowest: #fbf7f0;
    --surface-container-low: #f3ebdf;
    --surface-container-high: #e6dccd;
    --surface-container-highest: #ded1c0;
    --surface-variant: #ded1c0;
    --background: #f6efe4;
    --bg-app: #efe7da;
    --text-primary: #15110e;
    --text-secondary: #5e534a;
    --text-muted: #766b60;
    --text-inverse: #fffaf4;
    --outline: #8b7d6d;
    --outline-variant: #cdbfab;
    --secondary: #e8ded0;
    --error: #ba1a1a;
    --error-bg: #ffdad6;
}

html[data-palette="cips_palette"] {
    --page-glow: rgba(242, 106, 37, 0.18);
    --page-bg-start: #f4f7fb;
    --page-bg-end: #e7eef9;
    --shell-surface: rgba(255, 255, 255, 0.92);
    --shell-border: rgba(19, 0, 104, 0.16);
    --panel: #ffffff;
    --panel-soft: #eef3fb;
    --panel-strong: #e3ebf8;
    --text: #130068;
    --muted: #4c5d81;
    --line: #cfdcf0;
    --primary: #130068;
    --primary-soft: #0d0048;
    --accent: #00ceff;
    --accent-hover: #00b8e3;
    --danger: #b3261e;
    --disabled: #cfdcf0;
    --overlay: rgba(19, 0, 104, 0.32);
    --spinner-track: #cfdcf0;
    --spinner-active: #00ceff;
    --surface: #f4f7fb;
    --surface-low: #eef3fb;
    --surface-container: #e3ebf8;
    --surface-card: #ffffff;
    --surface-dim: #d8e3f3;
    --surface-container-lowest: #ffffff;
    --surface-container-low: #eef3fb;
    --surface-container-high: #dce7f7;
    --surface-container-highest: #d2def2;
    --surface-variant: #d2def2;
    --background: #f4f7fb;
    --bg-app: #e7eef9;
    --text-primary: #130068;
    --text-secondary: #22314d;
    --text-muted: #4c5d81;
    --text-inverse: #ffffff;
    --outline: #5d6f97;
    --outline-variant: #cfdcf0;
    --secondary: #f26a25;
    --error: #b3261e;
    --error-bg: #f9dedc;
}

html[data-palette="supp_palette"] {
    --page-glow: rgba(15, 132, 96, 0.08);
    --page-bg-start: #f4f7f4;
    --page-bg-end: #eef3ef;
    --shell-surface: rgba(248, 251, 248, 0.94);
    --shell-border: rgba(195, 208, 199, 0.9);
    --panel: #f8fbf8;
    --panel-soft: #eef3ef;
    --panel-strong: #e5ece6;
    --text: #101923;
    --muted: #546170;
    --line: #c6d4c9;
    --primary: #101923;
    --primary-soft: #1d2a36;
    --accent: #0f8460;
    --accent-hover: #0b6b4d;
    --danger: #b3261e;
    --disabled: #d9e3db;
    --overlay: rgba(16, 25, 35, 0.3);
    --spinner-track: #d9e3db;
    --spinner-active: #0f8460;
    --surface: #f6faf6;
    --surface-low: #eef3ef;
    --surface-container: #e5ece6;
    --surface-card: #f8fbf8;
    --surface-dim: #dfe8e1;
    --surface-container-lowest: #fbfdfb;
    --surface-container-low: #f1f5f1;
    --surface-container-high: #dfe8e1;
    --surface-container-highest: #d5e0d8;
    --surface-variant: #d5e0d8;
    --background: #f6faf6;
    --bg-app: #eef3ef;
    --text-primary: #101923;
    --text-secondary: #3f4b59;
    --text-muted: #6a7684;
    --text-inverse: #ffffff;
    --outline: #8fa094;
    --outline-variant: #c6d4c9;
    --secondary: #7fe0c2;
    --error: #b3261e;
    --error-bg: #f9dedc;
}

html[data-palette] {
    --bg: var(--surface);
    --color-surface: var(--surface);
    --color-surface-low: var(--surface-low);
    --color-surface-container: var(--surface-container);
    --color-surface-card: var(--surface-card);
    --color-surface-dim: var(--surface-dim);
    --color-surface-container-lowest: var(--surface-container-lowest);
    --color-surface-container-low: var(--surface-container-low);
    --color-surface-container-high: var(--surface-container-high);
    --color-surface-container-highest: var(--surface-container-highest);
    --color-surface-variant: var(--surface-variant);
    --color-background: var(--background);
    --color-bg-app: var(--bg-app);
    --color-text-primary: var(--text-primary);
    --color-text-secondary: var(--text-secondary);
    --color-text-muted: var(--text-muted);
    --color-text-inverse: var(--text-inverse);
    --color-border: var(--line);
    --color-border-strong: var(--outline-variant);
    --color-outline: var(--outline);
    --color-outline-variant: var(--outline-variant);
    --color-primary: var(--primary);
    --color-primary-soft: var(--primary-soft);
    --color-primary-hover: var(--primary-soft);
    --color-secondary: var(--secondary);
    --color-accent: var(--accent);
    --color-accent-hover: var(--accent-hover);
    --color-disabled: var(--disabled);
    --color-overlay: var(--overlay);
    --color-spinner-track: var(--spinner-track);
    --color-spinner-active: var(--spinner-active);
    --color-error: var(--error);
    --color-error-bg: var(--error-bg);
}
