/* Original rose uses the existing fallbacks, preserving its exact appearance.
   Each palette balances cool text, a separate icon hue, calendar marks,
   warm/cool receipt paper, and dusty voice accents, like the original rose. */
:root[data-theme="sprout"] {
  --theme-wall: url("theme-sprout.webp");
  --theme-title: #514b59;
  --theme-ink: #3f5360;
  --theme-muted: #697481;
  --theme-faint: #7a8088;
  --theme-accent: #6b8394;
  --theme-secondary: #7b6688;
  --theme-ink-rgb: 63, 83, 96;
  --theme-accent-rgb: 107, 131, 148;
  --theme-tint-rgb: 169, 194, 181;
  --theme-secondary-rgb: 185, 163, 209;
  --theme-paper-rgb: 248, 248, 244;
  --theme-paper: #efe4d7;
  --theme-bg: #edf3e6;
  --theme-chat-tint-rgb: 213, 233, 212;
  --theme-menu-accent: #9577a3;
  --theme-menu-muted: #807385;
  --theme-menu-tint-rgb: 198, 178, 211;
  --theme-glass-rgb: 246, 238, 248;
  --theme-calendar-title: #566b61;
  --theme-calendar-ink: #525d60;
  --theme-calendar-muted: #7a8087;
  --theme-calendar-accent: #73846a;
  --theme-calendar-mark-rgb: 189, 169, 210;
  --theme-receipt-paper: #efe4d7;
  --theme-receipt-ink: #625345;
  --theme-receipt-muted: #897664;
  --theme-receipt-stamp: #a07b5d;
  --theme-voice: #9b788b;
  --theme-voice-rgb: 155, 120, 139;
  --theme-send: #927d68;
  --theme-composer-icon: #a6b8c8;
  --theme-settings-accent: #806f92;
  --theme-settings-tint-rgb: 199, 189, 215;
}
:root[data-theme="amber"] {
  --theme-wall: url("theme-amber.webp");
  --theme-title: #4b5367;
  --theme-ink: #4b5963;
  --theme-muted: #7d7275;
  --theme-faint: #8b8086;
  --theme-accent: #72899a;
  --theme-secondary: #a17868;
  --theme-ink-rgb: 75, 89, 99;
  --theme-accent-rgb: 114, 137, 154;
  --theme-tint-rgb: 199, 181, 151;
  --theme-secondary-rgb: 194, 164, 192;
  --theme-paper-rgb: 250, 248, 244;
  --theme-paper: #e7ecec;
  --theme-bg: #f6efdf;
  --theme-chat-tint-rgb: 246, 225, 194;
  --theme-menu-accent: #7994ab;
  --theme-menu-muted: #847887;
  --theme-menu-tint-rgb: 174, 195, 214;
  --theme-glass-rgb: 238, 243, 250;
  --theme-calendar-title: #6c5b78;
  --theme-calendar-ink: #615965;
  --theme-calendar-muted: #8a7e87;
  --theme-calendar-accent: #8a7399;
  --theme-calendar-mark-rgb: 190, 169, 213;
  --theme-receipt-paper: #e7ecec;
  --theme-receipt-ink: #4e6470;
  --theme-receipt-muted: #778a90;
  --theme-receipt-stamp: #9d7968;
  --theme-voice: #9c7a72;
  --theme-voice-rgb: 156, 122, 114;
  --theme-send: #998765;
  --theme-composer-icon: #b4a6bc;
  --theme-settings-accent: #7c7493;
  --theme-settings-tint-rgb: 198, 190, 213;
}
:root[data-theme="lilac"] {
  --theme-wall: url("theme-lilac.webp");
  --theme-title: #514b63;
  --theme-ink: #405866;
  --theme-muted: #737984;
  --theme-faint: #85828d;
  --theme-accent: #6f8785;
  --theme-secondary: #aa806f;
  --theme-ink-rgb: 64, 88, 102;
  --theme-accent-rgb: 111, 135, 133;
  --theme-tint-rgb: 181, 203, 193;
  --theme-secondary-rgb: 221, 190, 165;
  --theme-paper-rgb: 250, 248, 243;
  --theme-paper: #f1e7d9;
  --theme-bg: #f2eaf8;
  --theme-chat-tint-rgb: 230, 214, 242;
  --theme-menu-accent: #78968f;
  --theme-menu-muted: #817885;
  --theme-menu-tint-rgb: 174, 201, 190;
  --theme-glass-rgb: 239, 248, 241;
  --theme-calendar-title: #63796f;
  --theme-calendar-ink: #536967;
  --theme-calendar-muted: #7d8986;
  --theme-calendar-accent: #718d82;
  --theme-calendar-mark-rgb: 177, 199, 184;
  --theme-receipt-paper: #f1e7d9;
  --theme-receipt-ink: #655545;
  --theme-receipt-muted: #8b7b69;
  --theme-receipt-stamp: #a0805f;
  --theme-voice: #a37e8c;
  --theme-voice-rgb: 163, 126, 140;
  --theme-send: #84938a;
  --theme-composer-icon: #a8bec3;
  --theme-settings-accent: #81748e;
  --theme-settings-tint-rgb: 203, 194, 215;
}
:root[data-theme="blue"] {
  --theme-wall: url("theme-blue.webp");
  --theme-title: #574a60;
  --theme-ink: #3e5369;
  --theme-muted: #7b7382;
  --theme-faint: #888393;
  --theme-accent: #728d9d;
  --theme-secondary: #9a7b68;
  --theme-ink-rgb: 62, 83, 105;
  --theme-accent-rgb: 114, 141, 157;
  --theme-tint-rgb: 173, 195, 215;
  --theme-secondary-rgb: 208, 176, 190;
  --theme-paper-rgb: 251, 248, 245;
  --theme-paper: #efe2df;
  --theme-bg: #eaf2f9;
  --theme-chat-tint-rgb: 208, 227, 246;
  --theme-menu-accent: #9d7fa0;
  --theme-menu-muted: #887887;
  --theme-menu-tint-rgb: 211, 186, 210;
  --theme-glass-rgb: 251, 239, 245;
  --theme-calendar-title: #5a746d;
  --theme-calendar-ink: #556968;
  --theme-calendar-muted: #7e8c88;
  --theme-calendar-accent: #77938a;
  --theme-calendar-mark-rgb: 176, 201, 187;
  --theme-receipt-paper: #efe2df;
  --theme-receipt-ink: #64535c;
  --theme-receipt-muted: #927c86;
  --theme-receipt-stamp: #a07882;
  --theme-voice: #9f7c86;
  --theme-voice-rgb: 159, 124, 134;
  --theme-send: #9a876f;
  --theme-composer-icon: #af9fc1;
  --theme-settings-accent: #89758f;
  --theme-settings-tint-rgb: 211, 194, 216;
}
:root[data-theme]:not([data-theme="light"]) {
  --wall-default: var(--theme-wall);
  --wall: var(--theme-wall);
  --bg: var(--theme-bg);
  --header-bg: var(--theme-bg);
  --header-fog-rgb: var(--theme-paper-rgb);
  --text: var(--theme-ink);
  --text-soft: var(--theme-muted);
  --text-faint: var(--theme-faint);
  --accent: var(--theme-accent);
  --accent-deep: var(--theme-title);
  --accent-fg: #fff;
  --send-bg: var(--theme-send);
  --tick: var(--theme-muted);
  --hairline: rgba(var(--theme-accent-rgb), .24);
  --bubble-ai-bg: rgba(255,255,255,.38);
  --bubble-ai-fg: var(--theme-ink);
  --bubble-human-bg: rgba(var(--theme-chat-tint-rgb),.44);
  --bubble-human-fg: var(--theme-ink);
  --think-flourish: rgba(var(--theme-accent-rgb), .52);
  --think-label: var(--theme-accent);
  --think-body: var(--theme-muted);
  --composer-bg: var(--theme-paper);
  --field-bg: rgba(var(--theme-paper-rgb), .92);
  --field-line: rgba(var(--theme-accent-rgb), .18);
  --shadow: 0 18px 46px rgba(var(--theme-ink-rgb), .10);
  --soft-shadow: 0 14px 34px rgba(var(--theme-ink-rgb), .08);
  --card-bg: rgba(var(--theme-paper-rgb), .46);
  --card-line: rgba(var(--theme-accent-rgb), .12);
  --card-shadow: 0 10px 28px rgba(var(--theme-ink-rgb), .05);
  --seg-track: rgba(var(--theme-settings-tint-rgb), .21);
  --seg-thumb-shadow: 0 2px 8px rgba(var(--theme-ink-rgb), .08);
  --seg-line: rgba(var(--theme-accent-rgb), .20);
  --panel-bg: rgba(var(--theme-paper-rgb), .90);
  --row-press: rgba(var(--theme-accent-rgb), .09);
  --slider-track: rgba(var(--theme-settings-tint-rgb), .45);
  --slider-thumb: var(--theme-settings-accent);
  --info-ring: rgba(var(--theme-accent-rgb), .38);
  --call-glass-glow: rgba(var(--theme-secondary-rgb), .20);
  --call-glass-shadow: 0 20px 50px rgba(var(--theme-ink-rgb), .16);
  --call-scrim: rgba(var(--theme-ink-rgb), .06);
  --sheet-bg: rgba(var(--theme-paper-rgb), .96);
  --sheet-scrim: rgba(var(--theme-ink-rgb), .44);
  --photo-shadow: 0 10px 24px rgba(var(--theme-ink-rgb), .18);
  --theme-terminal-bg: color-mix(in srgb, var(--theme-title) 24%, #050607);
  --theme-terminal-bar: color-mix(in srgb, var(--theme-title) 30%, #080a0b);
}
:root[data-theme]:not([data-theme="light"]) :is(.peerpill .name, .profile-name-row h3, .login h1, .life-month-title, .tj-title, .tj-library-head h2, .tc-title, .hero h1, .life-sheet-head h2) {
  color: var(--theme-title);
}
/* Give each surface its own related hue. Scope every new role to the four
   added themes, so the original rose keeps its exact existing color system. */
:root[data-theme]:not([data-theme="light"]) .menu-panel {
  --menu-lilac: var(--theme-menu-accent);
  --menu-muted: var(--theme-menu-muted);
  --menu-glass: linear-gradient(135deg, rgba(255,255,255,.79), rgba(var(--theme-glass-rgb),.52));
}
:root[data-theme]:not([data-theme="light"]) .menu-name { color: var(--theme-ink); }
:root[data-theme]:not([data-theme="light"]) .menu-group-title { color: var(--theme-secondary); }
:root[data-theme]:not([data-theme="light"]) :is(.menu-ic, .menu-empty-icon) {
  background: linear-gradient(145deg, rgba(var(--theme-menu-tint-rgb),.26), rgba(var(--theme-paper-rgb),.17));
}
:root[data-theme]:not([data-theme="light"]) .menu-nav-item[aria-current="page"] {
  color: var(--theme-menu-accent);
  background: rgba(var(--theme-menu-tint-rgb),.20);
}
:root[data-theme]:not([data-theme="light"]) :is(.settings-label, .action-icon, .profile-name-edit) {
  color: var(--theme-settings-accent);
}
:root[data-theme]:not([data-theme="light"]) :is(.home-calendar, .life-editor) {
  --theme-title: var(--theme-calendar-title);
  --theme-ink: var(--theme-calendar-ink);
  --theme-muted: var(--theme-calendar-muted);
  --theme-accent: var(--theme-calendar-accent);
  --theme-tint-rgb: var(--theme-calendar-mark-rgb);
  --theme-secondary-rgb: var(--theme-calendar-mark-rgb);
}
:root[data-theme]:not([data-theme="light"]) :is(.tc-sheet, .tc-home) {
  --theme-title: var(--theme-receipt-ink);
  --tc-paper: var(--theme-receipt-paper);
  --tc-ink: var(--theme-receipt-ink);
  --tc-faded: var(--theme-receipt-muted);
  --tc-veryfaded: color-mix(in srgb, var(--theme-receipt-muted) 75%, var(--theme-receipt-paper));
  --tc-rule: color-mix(in srgb, var(--theme-receipt-ink) 35%, transparent);
  --tc-rule-soft: color-mix(in srgb, var(--theme-receipt-ink) 19%, transparent);
  --tc-stamp: var(--theme-receipt-stamp);
  --tc-task-ink: var(--theme-receipt-ink);
  --tc-task-accent: color-mix(in srgb, var(--theme-receipt-stamp) 70%, var(--theme-receipt-ink));
}
:root[data-theme]:not([data-theme="light"]) .tc-home {
  background: color-mix(in srgb, var(--theme-receipt-paper) 64%, transparent);
}
:root[data-theme]:not([data-theme="light"]) :is(.tc-home-mark, .tc-home-arrow) { color: var(--theme-receipt-stamp); }
:root[data-theme]:not([data-theme="light"]) tidal-voice-player {
  --voice-ink: var(--theme-voice);
  --theme-tint-rgb: var(--theme-voice-rgb);
}
:root[data-theme]:not([data-theme="light"]) :is(tidal-journey-card, .tj-library, .tj-story) {
  --tj-accent: var(--theme-voice);
}
:root[data-theme]:not([data-theme="light"]) .tj-music-symbol { background: var(--theme-voice); }
:root[data-theme]:not([data-theme="light"]) :is(.sec-head h2, .footer h3) { color: var(--theme-title); }

/* Names only, with a persistent selection and a comfortable touch target. */
#themeSeg { grid-template-columns: repeat(5, minmax(0, 1fr)); }
#themeSeg button { min-width: 0; min-height: 44px; }
#themeSeg button:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
