/* Render-blocking theme contract. Full component palettes load afterward. */
html[data-family-theme-choice="white"] {
  --bg: #f7f7f5;
  --surface: #ffffff;
  --surface-2: #ededeb;
  --label: #1b1d1f;
  --secondary: #666b70;
  --tertiary: #979ca1;
  --separator: rgba(24, 27, 30, .12);
  --blue: #202124;
  --green: #65716a;
  --orange: #9a7657;
  --red: #a85f61;
  --pink: #9d697b;
  --indigo: #716d82;
  --shadow: 0 18px 48px rgba(20, 22, 24, .08);
  --theme-accent-rgb: 32, 33, 36;
  --theme-hero-start: #17191b;
  --theme-hero-end: #3b3e42;
  --theme-wallpaper-text: #ffffff;
  --theme-wallpaper-scrim-start: rgba(8, 8, 8, .46);
  --theme-wallpaper-scrim-middle: rgba(8, 8, 8, .24);
  --theme-wallpaper-scrim-end: rgba(8, 8, 8, .05);
  --theme-wallpaper-text-shadow: rgba(0, 0, 0, .62);
  --theme-wallpaper-surface: rgba(10, 10, 10, .52);
  --theme-wallpaper-border: rgba(255, 255, 255, .23);
  --theme-wallpaper-button-border: rgba(255, 255, 255, .26);
  --theme-wallpaper-button: rgba(5, 5, 5, .54);
  --theme-wallpaper-muted: rgba(255, 255, 255, .76);
  --motion-neon-violet: #8d7bff;
  --motion-neon-cyan: #68dcff;
  --motion-neon-pink: #ff759b;
  --motion-neon-glow: rgba(104, 220, 255, .28);
  --motion-depth-shadow: rgba(30, 26, 78, .16);
  color-scheme: light;
}

html[data-family-theme-choice="white"],
html[data-family-theme-choice="white"] body {
  background-color: #f7f7f5;
  background-image:
    radial-gradient(circle at 8% 2%, rgba(0, 0, 0, .025), transparent 25rem),
    linear-gradient(180deg, #fafaf8 0%, #f4f4f2 100%);
}

html[data-family-theme-choice="black"] {
  --bg: #050505;
  --surface: #111111;
  --surface-2: #1a1a1a;
  --label: #f5f5f5;
  --secondary: #b8b8b8;
  --tertiary: #7f7f7f;
  --separator: rgba(255, 255, 255, .12);
  --blue: #d7d7d7;
  --green: #a8b0aa;
  --orange: #c0a083;
  --red: #d58e8e;
  --pink: #c89aaa;
  --indigo: #aaa5b8;
  --shadow: 0 20px 54px rgba(0, 0, 0, .48);
  --theme-accent-rgb: 215, 215, 215;
  --theme-hero-start: #111111;
  --theme-hero-end: #303030;
  --theme-wallpaper-text: #ffffff;
  --theme-wallpaper-scrim-start: rgba(4, 4, 4, .58);
  --theme-wallpaper-scrim-middle: rgba(4, 4, 4, .32);
  --theme-wallpaper-scrim-end: rgba(4, 4, 4, .08);
  --theme-wallpaper-text-shadow: rgba(0, 0, 0, .62);
  --theme-wallpaper-surface: rgba(10, 10, 10, .52);
  --theme-wallpaper-border: rgba(255, 255, 255, .23);
  --theme-wallpaper-button-border: rgba(255, 255, 255, .26);
  --theme-wallpaper-button: rgba(5, 5, 5, .54);
  --theme-wallpaper-muted: rgba(255, 255, 255, .76);
  --motion-neon-violet: #8d7bff;
  --motion-neon-cyan: #68dcff;
  --motion-neon-pink: #ff759b;
  --motion-neon-glow: rgba(141, 123, 255, .48);
  --motion-depth-shadow: rgba(0, 0, 0, .72);
  color-scheme: dark;
}

html[data-family-theme-choice="black"],
html[data-family-theme-choice="black"] body {
  color: #f5f5f5;
  background-color: #050505;
  background-image:
    radial-gradient(circle at 12% 4%, rgba(255, 255, 255, .045), transparent 26rem),
    linear-gradient(180deg, #050505 0%, #090909 48%, #030303 100%);
}

/* Nova: the canonical palette for the complete family UI. */
html[data-family-design="nova"][data-family-theme-choice="white"] {
  --nova-bg: #f6f5f9;
  --nova-card: #ffffff;
  --nova-soft: #efedf5;
  --nova-text: #262337;
  --nova-muted: #726d84;
  --nova-accent: #7053ca;
  --nova-accent-deep: #5337ab;
  --nova-on-accent: #ffffff;
  --nova-lilac: #e8defa;
  --nova-peach: #f8e5d7;
  --nova-mint: #dceee7;
  --nova-line: #e7e3ef;
  --nova-shadow: 0 8px 30px rgba(44, 29, 78, .045);
  --nova-danger: #aa3f56;
}
html[data-family-design="nova"][data-family-theme-choice="black"] {
  --nova-bg: #10111c;
  --nova-card: #1b1c2c;
  --nova-soft: #25263a;
  --nova-text: #f0edf9;
  --nova-muted: #aaa7bd;
  --nova-accent: #b9a3ff;
  --nova-accent-deep: #9674f1;
  --nova-on-accent: #1b1038;
  --nova-lilac: #39314f;
  --nova-peach: #493630;
  --nova-mint: #263f3b;
  --nova-line: #343449;
  --nova-shadow: 0 10px 35px rgba(0, 0, 0, .14);
  --nova-danger: #ff9caf;
}
html[data-family-design="nova"][data-family-theme-choice] {
  --bg: var(--nova-bg) !important;
  --surface: var(--nova-card) !important;
  --surface-2: var(--nova-soft) !important;
  --label: var(--nova-text) !important;
  --secondary: var(--nova-muted) !important;
  --tertiary: var(--nova-muted) !important;
  --separator: var(--nova-line) !important;
  --blue: var(--nova-accent) !important;
  --shadow: var(--nova-shadow) !important;
  --theme-canvas: var(--nova-bg) !important;
  --theme-surface: var(--nova-card) !important;
  --theme-surface-raised: var(--nova-soft) !important;
  --theme-surface-soft: var(--nova-soft) !important;
  --theme-control: var(--nova-soft) !important;
  --theme-control-active: var(--nova-accent) !important;
  --theme-border: var(--nova-line) !important;
  --theme-border-strong: var(--nova-line) !important;
  --theme-text: var(--nova-text) !important;
  --theme-text-muted: var(--nova-muted) !important;
  --theme-text-subtle: var(--nova-muted) !important;
  --theme-accent: var(--nova-accent) !important;
  --theme-accent-contrast: var(--nova-on-accent) !important;
  --theme-shadow: var(--nova-shadow) !important;
}
html[data-family-design="nova"][data-family-theme-choice],
html[data-family-design="nova"][data-family-theme-choice] body {
  color: var(--nova-text);
  background: var(--nova-bg);
}
/* Theme thumbnails represent both choices regardless of the active theme. */
html[data-family-design="nova"] [data-theme-option="white"] .theme-preview {
  --preview-bg: #f6f5f9 !important;
  --preview-surface: #ffffff !important;
  --preview-accent: #7053ca !important;
  --preview-highlight: #e8defa !important;
  --preview-text: #262337 !important;
}
html[data-family-design="nova"] [data-theme-option="black"] .theme-preview {
  --preview-bg: #10111c !important;
  --preview-surface: #1b1c2c !important;
  --preview-accent: #b9a3ff !important;
  --preview-highlight: #39314f !important;
  --preview-text: #f0edf9 !important;
}

/* Care clock palette: the same semantic categories on light and dark bands. */
:root {
  --theme-care-band-surface: var(--nova-card);
  --theme-care-band-ink: var(--nova-text);
  --theme-care-band-muted: var(--nova-muted);
  --theme-care-band-rule: var(--nova-line);
  --theme-care-band-formula: #a56a1f;
  --theme-care-band-pumped: #297c8c;
  --theme-care-band-breast: #b25077;
  --theme-care-band-sleep: #7964b6;
  --theme-care-band-diaper: #358262;
  --theme-care-band-solid: #658443;
  --theme-care-band-night: #8c74b6;
  --theme-care-band-transition: #a894ae;
  --theme-care-band-day: #d8b18a;
}
html[data-family-theme-choice="black"] {
  --theme-care-band-surface: #1a1c2c;
  --theme-care-band-ink: #f5f1fc;
  --theme-care-band-muted: #c6bfd8;
  --theme-care-band-rule: #3b3b50;
  --theme-care-band-formula: #e1b668;
  --theme-care-band-pumped: #94c6d0;
  --theme-care-band-breast: #ec9ab8;
  --theme-care-band-sleep: #b5a1ef;
  --theme-care-band-diaper: #86c7a5;
  --theme-care-band-solid: #b2cd8e;
}