/*
 * fr fr. palette system
 *
 * Components use semantic tokens only. A palette owns every visual color,
 * including state, plant, photography, borders, shadows, and browser chrome.
 * Add or tune a palette here without searching through component CSS.
 */
:root { --qr-ink: #111111; --qr-paper: #ffffff; --share-scrim: #0008; }
:root,
:root[data-palette='electric-garden'],
[data-profile-theme] {
  color-scheme: light;
  --theme-color: #fafcfb;
  --canvas-outer: #e9f4ed;
  --canvas: #fafcfb;
  --canvas-muted: #f0f5f2;
  --surface: #ffffff;
  --surface-raised: #ffffff;
  --surface-soft: #edf8ee;
  --surface-warm: #fff0e8;
  --surface-cool: #def5e9;
  --ink: #25202a;
  --ink-soft: #504956;
  --ink-muted: #626b66;
  --ink-faint: #6c756f;
  --ink-ghost: #cbc4cc;
  --border: #dce6df;
  --border-strong: #cbc1ca;
  --action: #087d49;
  --action-strong: #08683f;
  --action-bright: #45c978;
  --action-soft: #e5f6ea;
  --group: #7657ff;
  --group-soft: #eee9ff;
  --social: #ff6b63;
  --social-soft: #fff0ed;
  --waiting: #f4be35;
  --waiting-strong: #95680a;
  --waiting-soft: #fff5d8;
  --live: #32a9e0;
  --live-strong: #176a91;
  --live-soft: #e7f6fd;
  --danger: #c6504c;
  --danger-strong: #87312f;
  --danger-soft: #fff0ee;
  --inactive: #c9c3ca;
  --plant: #43ad6d;
  --plant-dark: #176b47;
  --soil: #d89652;
  --on-action: #ffffff;
  --on-group: #ffffff;
  --on-social: #35100d;
  --on-waiting: #3d2a00;
  --on-live: #082c3d;
  --on-danger: #ffffff;
  --on-dark: #fff9f2;
  --dark-panel: #25202a;
  --dark-muted: #c8bdc6;
  --photo-viewer: #17131a;
  --photo-mat: #e7eee8;
  --overlay: color-mix(in srgb, var(--ink) 46%, transparent);
  --glass: color-mix(in srgb, var(--surface) 78%, transparent);
  --shadow-ink: color-mix(in srgb, var(--ink) 12%, transparent);
  --shadow-soft: color-mix(in srgb, var(--ink) 3%, transparent);
  --shadow-action: color-mix(in srgb, var(--action) 20%, transparent);
  --focus-ring: color-mix(in srgb, var(--action-bright) 58%, transparent);

  /* Palette-picker swatches live here too, so visual color values have one owner. */
  --preview-electric-1: #087d49;
  --preview-electric-2: #7657ff;
  --preview-electric-3: #ff6b63;
  --preview-daylight-1: #3554e9;
  --preview-daylight-2: #a66cff;
  --preview-daylight-3: #ff6fae;
  --preview-citrus-1: #bb461a;
  --preview-citrus-2: #b7e84b;
  --preview-citrus-3: #17a7a0;
  --preview-night-1: #111018;
  --preview-night-2: #9a7bff;
  --preview-night-3: #65d992;
}

:root[data-palette='daylight-social'],
[data-profile-theme='daylight-social'] {
  color-scheme: light;
  --theme-color: #fafbff;
  --canvas-outer: #e8edff;
  --canvas: #fafbff;
  --canvas-muted: #f0f3fc;
  --surface: #ffffff;
  --surface-raised: #ffffff;
  --surface-soft: #eef3ff;
  --surface-warm: #fff0f6;
  --surface-cool: #e4ebff;
  --ink: #20243a;
  --ink-soft: #4a5067;
  --ink-muted: #606780;
  --ink-faint: #6a7189;
  --ink-ghost: #cbd0de;
  --border: #e1e5f0;
  --border-strong: #c4cadb;
  --action: #3554e9;
  --action-strong: #273f9d;
  --action-bright: #5b8cff;
  --action-soft: #e9efff;
  --group: #a66cff;
  --group-soft: #f1e8ff;
  --social: #ff6fae;
  --social-soft: #ffedf5;
  --waiting: #ffc83d;
  --waiting-strong: #8b6500;
  --waiting-soft: #fff5d3;
  --live: #36b978;
  --live-strong: #197047;
  --live-soft: #e7f8ef;
  --danger: #d95767;
  --danger-strong: #923443;
  --danger-soft: #fff0f2;
  --inactive: #c9cedb;
  --plant: #5b8cff;
  --plant-dark: #3857d6;
  --soil: #ff9b74;
  --on-action: #ffffff;
  --on-group: #211333;
  --on-social: #351529;
  --on-waiting: #342600;
  --on-live: #092f20;
  --on-danger: #2f0d13;
  --on-dark: #f8faff;
  --dark-panel: #20243a;
  --dark-muted: #c4c9dc;
  --photo-viewer: #151827;
  --photo-mat: #e9eef8;
  --overlay: color-mix(in srgb, var(--ink) 48%, transparent);
  --glass: color-mix(in srgb, var(--surface) 80%, transparent);
  --shadow-ink: color-mix(in srgb, var(--ink) 12%, transparent);
  --shadow-soft: color-mix(in srgb, var(--ink) 3%, transparent);
  --shadow-action: color-mix(in srgb, var(--action) 20%, transparent);
  --focus-ring: color-mix(in srgb, var(--action-bright) 58%, transparent);
}

:root[data-palette='citrus-club'],
[data-profile-theme='citrus-club'] {
  color-scheme: light;
  --theme-color: #fffcf8;
  --canvas-outer: #fff0dc;
  --canvas: #fffcf8;
  --canvas-muted: #faf2e8;
  --surface: #ffffff;
  --surface-raised: #ffffff;
  --surface-soft: #edf7d5;
  --surface-warm: #ffe8d8;
  --surface-cool: #dff5ee;
  --ink: #29231e;
  --ink-soft: #554b43;
  --ink-muted: #6e6258;
  --ink-faint: #796d61;
  --ink-ghost: #d0c6ba;
  --border: #e9e0d5;
  --border-strong: #cfbfaa;
  --action: #bb461a;
  --action-strong: #9f3021;
  --action-bright: #ff754c;
  --action-soft: #ffe8df;
  --group: #7257d9;
  --group-soft: #eee9ff;
  --social: #b7e84b;
  --social-soft: #f2fad9;
  --waiting: #f4b72d;
  --waiting-strong: #8d6200;
  --waiting-soft: #fff3ce;
  --live: #17a7a0;
  --live-strong: #0b6c68;
  --live-soft: #ddf6f3;
  --danger: #c3433c;
  --danger-strong: #842d28;
  --danger-soft: #ffebe6;
  --inactive: #cfc5b8;
  --plant: #90c935;
  --plant-dark: #4f8420;
  --soil: #e0953f;
  --on-action: #ffffff;
  --on-group: #ffffff;
  --on-social: #26320d;
  --on-waiting: #3b2800;
  --on-live: #062d2b;
  --on-danger: #ffffff;
  --on-dark: #fff7e8;
  --dark-panel: #29231e;
  --dark-muted: #cec1b5;
  --photo-viewer: #1b1713;
  --photo-mat: #f0e9dc;
  --overlay: color-mix(in srgb, var(--ink) 48%, transparent);
  --glass: color-mix(in srgb, var(--surface) 80%, transparent);
  --shadow-ink: color-mix(in srgb, var(--ink) 13%, transparent);
  --shadow-soft: color-mix(in srgb, var(--ink) 3%, transparent);
  --shadow-action: color-mix(in srgb, var(--action) 20%, transparent);
  --focus-ring: color-mix(in srgb, var(--action-bright) 58%, transparent);
}

:root[data-palette='night-bloom'],
[data-profile-theme='night-bloom'] {
  color-scheme: dark;
  --theme-color: #111018;
  --canvas-outer: #09080f;
  --canvas: #111018;
  --canvas-muted: #171520;
  --surface: #1b1924;
  --surface-raised: #242130;
  --surface-soft: #1c2c25;
  --surface-warm: #302022;
  --surface-cool: #182a33;
  --ink: #fff8f2;
  --ink-soft: #ddd5df;
  --ink-muted: #aaa4b4;
  --ink-faint: #777180;
  --ink-ghost: #514c5b;
  --border: #353140;
  --border-strong: #4c4658;
  --action: #65d992;
  --action-strong: #a1efbc;
  --action-bright: #65d992;
  --action-soft: #20392b;
  --group: #9a7bff;
  --group-soft: #2b2546;
  --social: #ff776f;
  --social-soft: #3a2426;
  --waiting: #ffd24d;
  --waiting-strong: #ffe58e;
  --waiting-soft: #3a321c;
  --live: #56c8ff;
  --live-strong: #9bdefe;
  --live-soft: #19313d;
  --danger: #ff776f;
  --danger-strong: #ffaaa5;
  --danger-soft: #3b2325;
  --inactive: #57515f;
  --plant: #65d992;
  --plant-dark: #2e9e63;
  --soil: #d9a15f;
  --on-action: #102719;
  --on-group: #171023;
  --on-social: #2e1210;
  --on-waiting: #251c00;
  --on-live: #071e29;
  --on-danger: #2e1210;
  --on-dark: #fff8f2;
  --dark-panel: #09080f;
  --dark-muted: #aaa4b4;
  --photo-viewer: #09080f;
  --photo-mat: #15131c;
  --overlay: color-mix(in srgb, #000000 62%, transparent);
  --glass: color-mix(in srgb, var(--surface-raised) 82%, transparent);
  --shadow-ink: color-mix(in srgb, #000000 42%, transparent);
  --shadow-soft: color-mix(in srgb, #000000 28%, transparent);
  --shadow-action: color-mix(in srgb, var(--action) 25%, transparent);
  --focus-ring: color-mix(in srgb, var(--action-bright) 64%, transparent);
}

@media (prefers-contrast: more) {
  :root, [data-profile-theme] {
    --border: var(--border-strong);
    --ink-faint: var(--ink-muted);
  }
}