/* @remarkablenet/foundation themes (opt-in). GENERATED by scripts/gen-tokens.mjs from src/styles/tokens.mjs. Do not edit: change tokens.mjs and run `node scripts/gen-tokens.mjs`.

   Put data-rc-theme="<name>" on any element (or on <html>): everything inside it takes that theme, the rc-*
   elements and @remarkablenet/ui components alike, through the same names (--background, --primary... and the
   --rc-* extensions). Themes nest; "default" resets to D.
   Themes: default, rcm. Each has a dark variant for .dark (on <html>, on an
   ancestor or on the same element); a theme without dark colours of its own keeps its fonts and shape and takes the
   default dark colours. */

/* default: the signed-off Pinpoint design (D), the same values as foundation.css */
[data-rc-theme='default'] {
  /* surfaces */
  --background: #f1f1f1;
  --card: #ffffff;
  --card-foreground: var(--foreground);
  --popover: var(--card);
  --popover-foreground: var(--foreground);
  --muted: #f7f7f7;
  --secondary: #f1f1f1;
  --secondary-foreground: var(--foreground);
  --accent: #f7f7f7;
  --accent-foreground: var(--foreground);
  --rc-pressed: #ebebeb;
  --border: #e3e3e3;
  --rc-border-strong: #cccccc;
  --rc-divider: #ebebeb;
  /* ink */
  --foreground: #303030;
  --muted-foreground: #616161;
  --rc-ink-3: #6a6a6a;
  --rc-ink-4: #b5b5b5;
  --rc-control-outline: #8a8a8a;
  --input: #8a8a8a;
  --primary-foreground: #ffffff;
  --rc-link: #005bd3;
  --ring: var(--rc-link);
  /* data */
  --chart-1: #1a8bd8;
  --rc-chart-1-prev: #8fc6ec;
  /* categorical series palette 1-8 (+ the dashed comparison colour); hue-matched to the chip tints */
  --chart-2: #14a38b; --rc-chart-2-prev: #8fd6c9;
  --chart-3: #5aa831; --rc-chart-3-prev: #b0d99a;
  --chart-4: #e0a100; --rc-chart-4-prev: #f1d078;
  --chart-5: #e8702a; --rc-chart-5-prev: #f4b78f;
  --rc-chart-6: #d63e80; --rc-chart-6-prev: #eca0bf;
  --rc-chart-7: #7b4fd6; --rc-chart-7-prev: #bba3ea;
  --rc-chart-8: #6b7a90; --rc-chart-8-prev: #b4bcc9;
  --rc-bar: #4aa6e3;
  --rc-bar-track: #eef5fb;
  /* chart furniture: gridlines, the baseline (lowest gridline) and the hover crosshair */
  --rc-chart-grid: var(--rc-divider);
  --rc-chart-baseline: #d4d4d4;
  --rc-chart-cross: var(--rc-ink-4);
  /* status tones: bg, ink (AA on bg), icon */
  --rc-good-bg: #cdfee1; --rc-good-ink: #0c5132; --rc-good-icon: #29845a;
  --rc-bad-bg: #fee9e8; --rc-bad-ink: #8e1f0b; --rc-bad-icon: #e51c00;
  --rc-warn-bg: #fff1e3; --rc-warn-ink: #5e4200; --rc-warn-icon: #b28400;
  --rc-info-bg: #eaf4ff; --rc-info-ink: #00527c; --rc-info-icon: #0094d5;
  --rc-magic-bg: #f8f1ff; --rc-magic-ink: #5700d1; --rc-magic-icon: #8051ff;
  --rc-neutral-bg: var(--secondary); --rc-neutral-ink: var(--muted-foreground);
  --rc-score-low: #d67a00;
  /* categorical chip tints 1-8 (background, text); products pick the number */
  --rc-tint-1-bg: #e3f1fb; --rc-tint-1-ink: #0b4a75;
  --rc-tint-2-bg: #d9f5f0; --rc-tint-2-ink: #0a5a4c;
  --rc-tint-3-bg: #e2f6d8; --rc-tint-3-ink: #2c5a10;
  --rc-tint-4-bg: #fdf0cf; --rc-tint-4-ink: #6b4a00;
  --rc-tint-5-bg: #ffe6d6; --rc-tint-5-ink: #7a3200;
  --rc-tint-6-bg: #fde4ee; --rc-tint-6-ink: #7d1a46;
  --rc-tint-7-bg: #efe6fd; --rc-tint-7-ink: #4b1d96;
  --rc-tint-8-bg: #e6e9ee; --rc-tint-8-ink: #3a4452;
  /* actions and overlays (elements fall back to these values when a token is absent) */
  --primary: var(--foreground);
  --rc-btn-primary-hover: #1a1a1a;
  --rc-btn-primary-edge: 0 -1px 0 0 #000 inset, 0 0 0 1px #000 inset;
  --rc-btn-primary-shadow: var(--rc-btn-primary-edge), 0 1px 0 0 rgba(255, 255, 255, 0.25) inset;
  --rc-btn-primary-pressed: 0 2px 1px 0 #000 inset;
  --destructive: #e51c00;
  --rc-critical-hover: #c70a00;
  --destructive-foreground: #ffffff;
  --rc-btn-critical-edge: 0 0 0 1px rgba(0, 0, 0, 0.2) inset;
  --rc-btn-critical-shadow: 0 -1px 0 0 rgba(0, 0, 0, 0.3) inset, var(--rc-btn-critical-edge), 0 1px 0 0 rgba(255, 255, 255, 0.25) inset;
  --rc-btn-critical-pressed: 0 2px 1px 0 rgba(0, 0, 0, 0.4) inset;
  --rc-pressed-shadow: 0 0 0 1px color-mix(in srgb, var(--rc-mix-ink) 14%, transparent) inset, 0 1px 1px 0 color-mix(in srgb, var(--rc-shadow) 12%, transparent) inset;
  --rc-switch-track: var(--input);
  --rc-knob: #ffffff; --rc-knob-on: var(--primary-foreground); --rc-knob-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
  --rc-bar-below: #c4c4c4;
  --rc-backdrop: color-mix(in srgb, var(--rc-shadow) 32%, transparent);
  --rc-skeleton-shine: rgba(255, 255, 255, 0.7);
  --rc-image-edge: rgba(0, 0, 0, 0.08);
  --rc-on-dark-ink: #ffffff; --rc-on-dark-control: color-mix(in srgb, var(--rc-topbar-ink) 16%, transparent); --rc-on-dark-edge: rgba(255, 255, 255, 0.24);
  --rc-link-hover: #004299;
  --rc-popover-width: 280px;
  --rc-popover-radius: var(--rc-radius-card);
  --rc-tooltip-width: 280px;
  --rc-clickable-hover: var(--accent);
  --rc-clickable-radius: calc(var(--radius) * 0.8);
  --rc-tabs-active: var(--card);
  /* component looks: the Lens / Pinpoint look of a part whose role variable comes from the reference (each element reads var(--rc-x, <reference variable>); a theme can set these back to the reference variable) */
  --rc-badge-default-bg: var(--rc-neutral-bg); --rc-badge-default-ink: var(--rc-neutral-ink);
  --rc-table-head-ink: var(--muted-foreground); --rc-table-row-hover: var(--accent);
  --rc-calendar-selected: var(--rc-link); --rc-calendar-selected-hover: var(--rc-link-hover);
  --rc-calendar-band: color-mix(in srgb, var(--rc-link) 9%, transparent);
  --rc-calendar-today-bg: transparent; --rc-calendar-today-ring: var(--rc-border-strong);
  --rc-date-preset-bg: var(--rc-calendar-band); --rc-date-preset-ink: var(--rc-link);
  --rc-field-focus-edge: var(--rc-control-outline);
  --rc-button-link: var(--rc-link); --rc-button-link-hover: var(--rc-link-hover);
  --rc-button-icon: var(--muted-foreground);
  --rc-avatar-bg: var(--secondary); --rc-skeleton-base: var(--secondary);
  --rc-empty-media-bg: var(--secondary); --rc-empty-media-ink: var(--muted-foreground); --rc-empty-media-radius: 50%;
  --rc-select-checked-bg: var(--secondary);
  /* app shell (the top bar is a dark band in both modes) */
  --rc-topbar: #1a1a1a;
  --sidebar: #ebebeb; --sidebar-foreground: var(--foreground);
  --sidebar-primary: var(--primary); --sidebar-primary-foreground: var(--primary-foreground);
  --sidebar-accent: var(--card); --sidebar-accent-foreground: var(--foreground);
  --sidebar-border: var(--border); --sidebar-ring: var(--ring);
  --rc-sidebar-hover: #e3e3e3; --rc-sidebar-hover-ink: #1a1a1a;
  --rc-sidebar-ink-2: var(--muted-foreground); --rc-sidebar-ink-3: var(--rc-ink-3); --rc-sidebar-icon: #4a4a4a;
  --rc-topbar-text: #ffffff; --rc-topbar-ink: #e3e3e3; --rc-topbar-ink-2: #b5b5b5; --rc-topbar-ink-3: #8a8a8a;
  --rc-topbar-control: #2a2a2a; --rc-topbar-control-hover: #333333; --rc-topbar-border: #3a3a3a;
  --rc-topbar-focus: #7aa7ff; --rc-topbar-accent: #9ec5ff; --rc-topbar-accent-hover: #c8ddff;
  /* code (rc-code, rc-json-tree syntax colours) */
  --rc-code-string: #1f7a4f; --rc-code-number: #a15500; --rc-code-keyword: #8536c9; --rc-code-variable: #b4235f;
  /* elevation */
  --rc-card-edge: var(--border);
  --rc-card-shadow: 0 0 0 1px var(--rc-card-edge), 0 1px 0 0 color-mix(in srgb, var(--rc-shadow) 7%, transparent), 0 1px 3px 0 color-mix(in srgb, var(--rc-shadow) 6%, transparent);
  --rc-pop-shadow: 0 0 0 1px var(--border), 0 4px 8px -2px color-mix(in srgb, var(--rc-shadow) 12%, transparent), 0 12px 24px -6px color-mix(in srgb, var(--rc-shadow) 16%, transparent);
  --rc-btn-shadow: 0 0 0 1px var(--border) inset, 0 -1px 0 0 color-mix(in srgb, var(--rc-shadow) 10%, transparent) inset;
  --rc-modal-shadow: 0 0 0 1px var(--border), 0 20px 48px -12px color-mix(in srgb, var(--rc-shadow) 32%, transparent);
  --rc-focus: 0 0 0 2px var(--card), 0 0 0 4px var(--ring);
  --rc-shadow: #1a1a1a; --rc-mix-ink: #1a1a1a;
  /* shape, type, motion */
  --rc-radius-card: calc(var(--radius) * 1.2);
  --radius: 10px;
  --rc-font: 'Figtree', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --rc-font-mono: ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace;
  --rc-font-size: 13px;
  --rc-line-height: 20px;
  --rc-font-weight: 450;
  --rc-ease: cubic-bezier(0.25, 1, 0.5, 1);
  --rc-motion-enter: 280ms; --rc-motion-exit: 200ms; --rc-motion-enter-sm: 150ms; --rc-motion-exit-sm: 100ms;
  --rc-ease-out: cubic-bezier(0.25, 1, 0.5, 1); --rc-ease-in: cubic-bezier(0.32, 0, 0.67, 0);
  /* spacing scale, 100 = 4px (px, no rem: Bootstrap 3 hosts set html{font-size:10px}) */
  --rc-space-025: 1px; --rc-space-050: 2px; --rc-space-100: 4px; --rc-space-150: 6px; --rc-space-200: 8px;
  --rc-space-250: 10px; --rc-space-300: 12px; --rc-space-350: 14px; --rc-space-400: 16px; --rc-space-500: 20px;
  --rc-space-600: 24px; --rc-space-800: 32px; --rc-space-1000: 40px; --rc-space-1200: 48px;

  /* scheme capture (scripts/gen-tokens.mjs): what overlays reset to inside a local colour region */
  --rc-scheme-background: var(--background); --rc-scheme-card: var(--card); --rc-scheme-card-foreground: var(--card-foreground); --rc-scheme-popover: var(--popover);
  --rc-scheme-popover-foreground: var(--popover-foreground); --rc-scheme-muted: var(--muted); --rc-scheme-secondary: var(--secondary); --rc-scheme-secondary-foreground: var(--secondary-foreground);
  --rc-scheme-accent: var(--accent); --rc-scheme-accent-foreground: var(--accent-foreground); --rc-scheme-pressed: var(--rc-pressed); --rc-scheme-border: var(--border);
  --rc-scheme-border-strong: var(--rc-border-strong); --rc-scheme-divider: var(--rc-divider); --rc-scheme-foreground: var(--foreground); --rc-scheme-muted-foreground: var(--muted-foreground);
  --rc-scheme-ink-3: var(--rc-ink-3); --rc-scheme-ink-4: var(--rc-ink-4); --rc-scheme-control-outline: var(--rc-control-outline); --rc-scheme-input: var(--input);
  --rc-scheme-primary-foreground: var(--primary-foreground); --rc-scheme-link: var(--rc-link); --rc-scheme-ring: var(--ring); --rc-scheme-chart-1: var(--chart-1);
  --rc-scheme-chart-1-prev: var(--rc-chart-1-prev); --rc-scheme-chart-2: var(--chart-2); --rc-scheme-chart-2-prev: var(--rc-chart-2-prev); --rc-scheme-chart-3: var(--chart-3);
  --rc-scheme-chart-3-prev: var(--rc-chart-3-prev); --rc-scheme-chart-4: var(--chart-4); --rc-scheme-chart-4-prev: var(--rc-chart-4-prev); --rc-scheme-chart-5: var(--chart-5);
  --rc-scheme-chart-5-prev: var(--rc-chart-5-prev); --rc-scheme-chart-6: var(--rc-chart-6); --rc-scheme-chart-6-prev: var(--rc-chart-6-prev); --rc-scheme-chart-7: var(--rc-chart-7);
  --rc-scheme-chart-7-prev: var(--rc-chart-7-prev); --rc-scheme-chart-8: var(--rc-chart-8); --rc-scheme-chart-8-prev: var(--rc-chart-8-prev); --rc-scheme-bar: var(--rc-bar);
  --rc-scheme-bar-track: var(--rc-bar-track); --rc-scheme-chart-grid: var(--rc-chart-grid); --rc-scheme-chart-baseline: var(--rc-chart-baseline); --rc-scheme-chart-cross: var(--rc-chart-cross);
  --rc-scheme-good-bg: var(--rc-good-bg); --rc-scheme-good-ink: var(--rc-good-ink); --rc-scheme-good-icon: var(--rc-good-icon); --rc-scheme-bad-bg: var(--rc-bad-bg);
  --rc-scheme-bad-ink: var(--rc-bad-ink); --rc-scheme-bad-icon: var(--rc-bad-icon); --rc-scheme-warn-bg: var(--rc-warn-bg); --rc-scheme-warn-ink: var(--rc-warn-ink);
  --rc-scheme-warn-icon: var(--rc-warn-icon); --rc-scheme-info-bg: var(--rc-info-bg); --rc-scheme-info-ink: var(--rc-info-ink); --rc-scheme-info-icon: var(--rc-info-icon);
  --rc-scheme-magic-bg: var(--rc-magic-bg); --rc-scheme-magic-ink: var(--rc-magic-ink); --rc-scheme-magic-icon: var(--rc-magic-icon); --rc-scheme-neutral-bg: var(--rc-neutral-bg);
  --rc-scheme-neutral-ink: var(--rc-neutral-ink); --rc-scheme-score-low: var(--rc-score-low); --rc-scheme-tint-1-bg: var(--rc-tint-1-bg); --rc-scheme-tint-1-ink: var(--rc-tint-1-ink);
  --rc-scheme-tint-2-bg: var(--rc-tint-2-bg); --rc-scheme-tint-2-ink: var(--rc-tint-2-ink); --rc-scheme-tint-3-bg: var(--rc-tint-3-bg); --rc-scheme-tint-3-ink: var(--rc-tint-3-ink);
  --rc-scheme-tint-4-bg: var(--rc-tint-4-bg); --rc-scheme-tint-4-ink: var(--rc-tint-4-ink); --rc-scheme-tint-5-bg: var(--rc-tint-5-bg); --rc-scheme-tint-5-ink: var(--rc-tint-5-ink);
  --rc-scheme-tint-6-bg: var(--rc-tint-6-bg); --rc-scheme-tint-6-ink: var(--rc-tint-6-ink); --rc-scheme-tint-7-bg: var(--rc-tint-7-bg); --rc-scheme-tint-7-ink: var(--rc-tint-7-ink);
  --rc-scheme-tint-8-bg: var(--rc-tint-8-bg); --rc-scheme-tint-8-ink: var(--rc-tint-8-ink); --rc-scheme-primary: var(--primary); --rc-scheme-btn-primary-hover: var(--rc-btn-primary-hover);
  --rc-scheme-btn-primary-edge: var(--rc-btn-primary-edge); --rc-scheme-btn-primary-shadow: var(--rc-btn-primary-shadow); --rc-scheme-btn-primary-pressed: var(--rc-btn-primary-pressed); --rc-scheme-destructive: var(--destructive);
  --rc-scheme-critical-hover: var(--rc-critical-hover); --rc-scheme-destructive-foreground: var(--destructive-foreground); --rc-scheme-btn-critical-edge: var(--rc-btn-critical-edge); --rc-scheme-btn-critical-shadow: var(--rc-btn-critical-shadow);
  --rc-scheme-btn-critical-pressed: var(--rc-btn-critical-pressed); --rc-scheme-pressed-shadow: var(--rc-pressed-shadow); --rc-scheme-switch-track: var(--rc-switch-track); --rc-scheme-knob: var(--rc-knob);
  --rc-scheme-knob-on: var(--rc-knob-on); --rc-scheme-knob-shadow: var(--rc-knob-shadow); --rc-scheme-bar-below: var(--rc-bar-below); --rc-scheme-backdrop: var(--rc-backdrop);
  --rc-scheme-skeleton-shine: var(--rc-skeleton-shine); --rc-scheme-image-edge: var(--rc-image-edge); --rc-scheme-on-dark-ink: var(--rc-on-dark-ink); --rc-scheme-on-dark-control: var(--rc-on-dark-control);
  --rc-scheme-on-dark-edge: var(--rc-on-dark-edge); --rc-scheme-link-hover: var(--rc-link-hover); --rc-scheme-clickable-hover: var(--rc-clickable-hover); --rc-scheme-tabs-active: var(--rc-tabs-active);
  --rc-scheme-badge-default-bg: var(--rc-badge-default-bg); --rc-scheme-badge-default-ink: var(--rc-badge-default-ink); --rc-scheme-table-head-ink: var(--rc-table-head-ink); --rc-scheme-table-row-hover: var(--rc-table-row-hover);
  --rc-scheme-calendar-selected: var(--rc-calendar-selected); --rc-scheme-calendar-selected-hover: var(--rc-calendar-selected-hover); --rc-scheme-calendar-band: var(--rc-calendar-band); --rc-scheme-calendar-today-ring: var(--rc-calendar-today-ring);
  --rc-scheme-date-preset-bg: var(--rc-date-preset-bg); --rc-scheme-date-preset-ink: var(--rc-date-preset-ink); --rc-scheme-field-focus-edge: var(--rc-field-focus-edge); --rc-scheme-button-link: var(--rc-button-link);
  --rc-scheme-button-link-hover: var(--rc-button-link-hover); --rc-scheme-button-icon: var(--rc-button-icon); --rc-scheme-avatar-bg: var(--rc-avatar-bg); --rc-scheme-skeleton-base: var(--rc-skeleton-base);
  --rc-scheme-empty-media-bg: var(--rc-empty-media-bg); --rc-scheme-empty-media-ink: var(--rc-empty-media-ink); --rc-scheme-select-checked-bg: var(--rc-select-checked-bg); --rc-scheme-topbar: var(--rc-topbar);
  --rc-scheme-sidebar: var(--sidebar); --rc-scheme-sidebar-foreground: var(--sidebar-foreground); --rc-scheme-sidebar-primary: var(--sidebar-primary); --rc-scheme-sidebar-primary-foreground: var(--sidebar-primary-foreground);
  --rc-scheme-sidebar-accent: var(--sidebar-accent); --rc-scheme-sidebar-accent-foreground: var(--sidebar-accent-foreground); --rc-scheme-sidebar-border: var(--sidebar-border); --rc-scheme-sidebar-ring: var(--sidebar-ring);
  --rc-scheme-sidebar-hover: var(--rc-sidebar-hover); --rc-scheme-sidebar-hover-ink: var(--rc-sidebar-hover-ink); --rc-scheme-sidebar-ink-2: var(--rc-sidebar-ink-2); --rc-scheme-sidebar-ink-3: var(--rc-sidebar-ink-3);
  --rc-scheme-sidebar-icon: var(--rc-sidebar-icon); --rc-scheme-topbar-text: var(--rc-topbar-text); --rc-scheme-topbar-ink: var(--rc-topbar-ink); --rc-scheme-topbar-ink-2: var(--rc-topbar-ink-2);
  --rc-scheme-topbar-ink-3: var(--rc-topbar-ink-3); --rc-scheme-topbar-control: var(--rc-topbar-control); --rc-scheme-topbar-control-hover: var(--rc-topbar-control-hover); --rc-scheme-topbar-border: var(--rc-topbar-border);
  --rc-scheme-topbar-focus: var(--rc-topbar-focus); --rc-scheme-topbar-accent: var(--rc-topbar-accent); --rc-scheme-topbar-accent-hover: var(--rc-topbar-accent-hover); --rc-scheme-code-string: var(--rc-code-string);
  --rc-scheme-code-number: var(--rc-code-number); --rc-scheme-code-keyword: var(--rc-code-keyword); --rc-scheme-code-variable: var(--rc-code-variable); --rc-scheme-card-edge: var(--rc-card-edge);
  --rc-scheme-card-shadow: var(--rc-card-shadow); --rc-scheme-pop-shadow: var(--rc-pop-shadow); --rc-scheme-btn-shadow: var(--rc-btn-shadow); --rc-scheme-modal-shadow: var(--rc-modal-shadow);
  --rc-scheme-focus: var(--rc-focus); --rc-scheme-shadow: var(--rc-shadow); --rc-scheme-mix-ink: var(--rc-mix-ink);
}

/* default, dark (the default dark colours) */
.dark [data-rc-theme='default'],
[data-rc-theme='default'].dark,
[data-rc-theme='default'] .dark {
  color-scheme: dark;

  /* surfaces */
  --background: #121212;
  --card: #1c1c1c;
  --card-foreground: var(--foreground);
  --popover: var(--card);
  --popover-foreground: var(--foreground);
  --muted: #232323;
  --secondary: #2a2a2a;
  --secondary-foreground: var(--foreground);
  --accent: #262626;
  --accent-foreground: var(--foreground);
  --rc-pressed: #303030;
  --border: #363636;
  --rc-border-strong: #4a4a4a;
  --rc-divider: #2c2c2c;
  /* ink */
  --foreground: #ececec;
  --muted-foreground: #b8b8b8;
  --rc-ink-3: #9a9a9a;
  --rc-ink-4: #6e6e6e;
  --rc-control-outline: #9a9a9a;
  --input: #7a7a7a;
  --primary-foreground: #1c1c1c;
  --rc-link: #5b9dff;
  --ring: var(--rc-link);
  /* data */
  --chart-1: #3d9be6;
  --rc-chart-1-prev: #2b5a7e;
  /* categorical series palette 1-8 (+ the dashed comparison colour); hue-matched to the chip tints */
  --chart-2: #22b89e; --rc-chart-2-prev: #1d6157;
  --chart-3: #6cbd3f; --rc-chart-3-prev: #3e6427;
  --chart-4: #e8ac12; --rc-chart-4-prev: #755a14;
  --chart-5: #f07f3a; --rc-chart-5-prev: #7b4627;
  --rc-chart-6: #e5559a; --rc-chart-6-prev: #77304f;
  --rc-chart-7: #9a76ee; --rc-chart-7-prev: #4f3f7a;
  --rc-chart-8: #8d9bb0; --rc-chart-8-prev: #4a5260;
  --rc-bar: #3d9be6;
  --rc-bar-track: #1e2a34;
  /* chart furniture: gridlines, the baseline (lowest gridline) and the hover crosshair */
  --rc-chart-grid: var(--rc-divider);
  --rc-chart-baseline: #4a4a4a;
  --rc-chart-cross: var(--rc-ink-4);
  /* status tones: bg, ink (AA on bg), icon */
  --rc-good-bg: #0f3a26; --rc-good-ink: #8ee6b4; --rc-good-icon: #3cbf7c;
  --rc-bad-bg: #47150f; --rc-bad-ink: #ffb3a6; --rc-bad-icon: #ff6b52;
  --rc-warn-bg: #3b2c06; --rc-warn-ink: #f3d27c; --rc-warn-icon: #e0a800;
  --rc-info-bg: #0a2c42; --rc-info-ink: #9cd2ff; --rc-info-icon: #3db1f2;
  --rc-magic-bg: #2c1a4f; --rc-magic-ink: #d3b9ff; --rc-magic-icon: #a585ff;
  --rc-neutral-bg: var(--secondary); --rc-neutral-ink: var(--muted-foreground);
  --rc-score-low: #f09a2a;
  /* categorical chip tints 1-8 (background, text); products pick the number */
  --rc-tint-1-bg: #0f2e44; --rc-tint-1-ink: #9fd0f5;
  --rc-tint-2-bg: #0b3832; --rc-tint-2-ink: #8fe0d0;
  --rc-tint-3-bg: #1d3812; --rc-tint-3-ink: #b4e39a;
  --rc-tint-4-bg: #3b2d06; --rc-tint-4-ink: #f2d27a;
  --rc-tint-5-bg: #43220d; --rc-tint-5-ink: #f7b88f;
  --rc-tint-6-bg: #43142c; --rc-tint-6-ink: #f5a3c6;
  --rc-tint-7-bg: #2c1c52; --rc-tint-7-ink: #c9b2f5;
  --rc-tint-8-bg: #283039; --rc-tint-8-ink: #c3cbd6;
  /* actions and overlays (elements fall back to these values when a token is absent) */
  --primary: var(--foreground);
  --rc-btn-primary-hover: #ffffff;
  --rc-btn-primary-edge: 0 -1px 0 0 rgba(0, 0, 0, 0.3) inset, 0 0 0 1px rgba(0, 0, 0, 0.5) inset;
  --rc-btn-primary-shadow: var(--rc-btn-primary-edge), 0 1px 0 0 rgba(255, 255, 255, 0.6) inset;
  --rc-btn-primary-pressed: 0 2px 1px 0 rgba(0, 0, 0, 0.35) inset;
  --destructive: #d92b12;
  --rc-critical-hover: #c22410;
  --destructive-foreground: #ffffff;
  --rc-btn-critical-edge: 0 0 0 1px rgba(0, 0, 0, 0.4) inset;
  --rc-btn-critical-shadow: 0 -1px 0 0 rgba(0, 0, 0, 0.4) inset, var(--rc-btn-critical-edge), 0 1px 0 0 rgba(255, 255, 255, 0.2) inset;
  --rc-btn-critical-pressed: 0 2px 1px 0 rgba(0, 0, 0, 0.5) inset;
  --rc-pressed-shadow: 0 0 0 1px color-mix(in srgb, var(--rc-mix-ink) 14%, transparent) inset, 0 1px 1px 0 color-mix(in srgb, var(--rc-shadow) 50%, transparent) inset;
  --rc-switch-track: var(--input);
  --rc-knob: #e8e8e8; --rc-knob-on: var(--primary-foreground); --rc-knob-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
  --rc-bar-below: #5c5c5c;
  --rc-backdrop: color-mix(in srgb, var(--rc-shadow) 60%, transparent);
  --rc-skeleton-shine: rgba(255, 255, 255, 0.06);
  --rc-image-edge: rgba(255, 255, 255, 0.1);
  --rc-on-dark-ink: #ffffff; --rc-on-dark-control: color-mix(in srgb, var(--rc-topbar-ink) 16%, transparent); --rc-on-dark-edge: rgba(255, 255, 255, 0.24);
  --rc-link-hover: #8ab9ff;
  --rc-popover-width: 280px;
  --rc-popover-radius: var(--rc-radius-card);
  --rc-tooltip-width: 280px;
  --rc-clickable-hover: var(--accent);
  --rc-clickable-radius: calc(var(--radius) * 0.8);
  --rc-tabs-active: color-mix(in srgb, var(--input) 30%, var(--muted));
  /* component looks: the Lens / Pinpoint look of a part whose role variable comes from the reference (each element reads var(--rc-x, <reference variable>); a theme can set these back to the reference variable) */
  --rc-badge-default-bg: var(--rc-neutral-bg); --rc-badge-default-ink: var(--rc-neutral-ink);
  --rc-table-head-ink: var(--muted-foreground); --rc-table-row-hover: var(--accent);
  --rc-calendar-selected: var(--rc-link); --rc-calendar-selected-hover: var(--rc-link-hover);
  --rc-calendar-band: color-mix(in srgb, var(--rc-link) 9%, transparent);
  --rc-calendar-today-bg: transparent; --rc-calendar-today-ring: var(--rc-border-strong);
  --rc-date-preset-bg: var(--rc-calendar-band); --rc-date-preset-ink: var(--rc-link);
  --rc-field-focus-edge: var(--rc-control-outline);
  --rc-button-link: var(--rc-link); --rc-button-link-hover: var(--rc-link-hover);
  --rc-button-icon: var(--muted-foreground);
  --rc-avatar-bg: var(--secondary); --rc-skeleton-base: var(--secondary);
  --rc-empty-media-bg: var(--secondary); --rc-empty-media-ink: var(--muted-foreground); --rc-empty-media-radius: 50%;
  --rc-select-checked-bg: var(--secondary);
  /* app shell (the top bar is a dark band in both modes) */
  --rc-topbar: #0a0a0a;
  --sidebar: #171717; --sidebar-foreground: var(--foreground);
  --sidebar-primary: var(--primary); --sidebar-primary-foreground: var(--primary-foreground);
  --sidebar-accent: var(--card); --sidebar-accent-foreground: var(--foreground);
  --sidebar-border: var(--border); --sidebar-ring: var(--ring);
  --rc-sidebar-hover: #2a2a2a; --rc-sidebar-hover-ink: #ffffff;
  --rc-sidebar-ink-2: var(--muted-foreground); --rc-sidebar-ink-3: var(--rc-ink-3); --rc-sidebar-icon: #b0b0b0;
  --rc-topbar-text: #ffffff; --rc-topbar-ink: #e3e3e3; --rc-topbar-ink-2: #b5b5b5; --rc-topbar-ink-3: #9a9a9a;
  --rc-topbar-control: #1f1f1f; --rc-topbar-control-hover: #2a2a2a; --rc-topbar-border: #363636;
  --rc-topbar-focus: #7aa7ff; --rc-topbar-accent: #9ec5ff; --rc-topbar-accent-hover: #c8ddff;
  /* code (rc-code, rc-json-tree syntax colours) */
  --rc-code-string: #6fd3a0; --rc-code-number: #f0a860; --rc-code-keyword: #c79bff; --rc-code-variable: #ff8fbf;
  /* elevation */
  --rc-card-edge: var(--border);
  --rc-card-shadow: 0 0 0 1px var(--rc-card-edge), 0 1px 0 0 color-mix(in srgb, var(--rc-shadow) 40%, transparent), 0 1px 3px 0 color-mix(in srgb, var(--rc-shadow) 50%, transparent);
  --rc-pop-shadow: 0 0 0 1px var(--border), 0 4px 8px -2px color-mix(in srgb, var(--rc-shadow) 50%, transparent), 0 12px 24px -6px color-mix(in srgb, var(--rc-shadow) 60%, transparent);
  --rc-btn-shadow: 0 0 0 1px var(--border) inset, 0 -1px 0 0 color-mix(in srgb, var(--rc-shadow) 35%, transparent) inset;
  --rc-modal-shadow: 0 0 0 1px var(--border), 0 20px 48px -12px color-mix(in srgb, var(--rc-shadow) 70%, transparent);
  --rc-focus: 0 0 0 2px var(--card), 0 0 0 4px var(--ring);
  --rc-shadow: #000000; --rc-mix-ink: #ffffff;
  /* shape, type, motion */
  --rc-radius-card: calc(var(--radius) * 1.2);
  --radius: 10px;
  --rc-font: 'Figtree', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --rc-font-mono: ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace;
  --rc-font-size: 13px;
  --rc-line-height: 20px;
  --rc-font-weight: 450;
  --rc-ease: cubic-bezier(0.25, 1, 0.5, 1);
  --rc-motion-enter: 280ms; --rc-motion-exit: 200ms; --rc-motion-enter-sm: 150ms; --rc-motion-exit-sm: 100ms;
  --rc-ease-out: cubic-bezier(0.25, 1, 0.5, 1); --rc-ease-in: cubic-bezier(0.32, 0, 0.67, 0);
  /* spacing scale, 100 = 4px (px, no rem: Bootstrap 3 hosts set html{font-size:10px}) */
  --rc-space-025: 1px; --rc-space-050: 2px; --rc-space-100: 4px; --rc-space-150: 6px; --rc-space-200: 8px;
  --rc-space-250: 10px; --rc-space-300: 12px; --rc-space-350: 14px; --rc-space-400: 16px; --rc-space-500: 20px;
  --rc-space-600: 24px; --rc-space-800: 32px; --rc-space-1000: 40px; --rc-space-1200: 48px;

  /* scheme capture (scripts/gen-tokens.mjs): what overlays reset to inside a local colour region */
  --rc-scheme-background: var(--background); --rc-scheme-card: var(--card); --rc-scheme-card-foreground: var(--card-foreground); --rc-scheme-popover: var(--popover);
  --rc-scheme-popover-foreground: var(--popover-foreground); --rc-scheme-muted: var(--muted); --rc-scheme-secondary: var(--secondary); --rc-scheme-secondary-foreground: var(--secondary-foreground);
  --rc-scheme-accent: var(--accent); --rc-scheme-accent-foreground: var(--accent-foreground); --rc-scheme-pressed: var(--rc-pressed); --rc-scheme-border: var(--border);
  --rc-scheme-border-strong: var(--rc-border-strong); --rc-scheme-divider: var(--rc-divider); --rc-scheme-foreground: var(--foreground); --rc-scheme-muted-foreground: var(--muted-foreground);
  --rc-scheme-ink-3: var(--rc-ink-3); --rc-scheme-ink-4: var(--rc-ink-4); --rc-scheme-control-outline: var(--rc-control-outline); --rc-scheme-input: var(--input);
  --rc-scheme-primary-foreground: var(--primary-foreground); --rc-scheme-link: var(--rc-link); --rc-scheme-ring: var(--ring); --rc-scheme-chart-1: var(--chart-1);
  --rc-scheme-chart-1-prev: var(--rc-chart-1-prev); --rc-scheme-chart-2: var(--chart-2); --rc-scheme-chart-2-prev: var(--rc-chart-2-prev); --rc-scheme-chart-3: var(--chart-3);
  --rc-scheme-chart-3-prev: var(--rc-chart-3-prev); --rc-scheme-chart-4: var(--chart-4); --rc-scheme-chart-4-prev: var(--rc-chart-4-prev); --rc-scheme-chart-5: var(--chart-5);
  --rc-scheme-chart-5-prev: var(--rc-chart-5-prev); --rc-scheme-chart-6: var(--rc-chart-6); --rc-scheme-chart-6-prev: var(--rc-chart-6-prev); --rc-scheme-chart-7: var(--rc-chart-7);
  --rc-scheme-chart-7-prev: var(--rc-chart-7-prev); --rc-scheme-chart-8: var(--rc-chart-8); --rc-scheme-chart-8-prev: var(--rc-chart-8-prev); --rc-scheme-bar: var(--rc-bar);
  --rc-scheme-bar-track: var(--rc-bar-track); --rc-scheme-chart-grid: var(--rc-chart-grid); --rc-scheme-chart-baseline: var(--rc-chart-baseline); --rc-scheme-chart-cross: var(--rc-chart-cross);
  --rc-scheme-good-bg: var(--rc-good-bg); --rc-scheme-good-ink: var(--rc-good-ink); --rc-scheme-good-icon: var(--rc-good-icon); --rc-scheme-bad-bg: var(--rc-bad-bg);
  --rc-scheme-bad-ink: var(--rc-bad-ink); --rc-scheme-bad-icon: var(--rc-bad-icon); --rc-scheme-warn-bg: var(--rc-warn-bg); --rc-scheme-warn-ink: var(--rc-warn-ink);
  --rc-scheme-warn-icon: var(--rc-warn-icon); --rc-scheme-info-bg: var(--rc-info-bg); --rc-scheme-info-ink: var(--rc-info-ink); --rc-scheme-info-icon: var(--rc-info-icon);
  --rc-scheme-magic-bg: var(--rc-magic-bg); --rc-scheme-magic-ink: var(--rc-magic-ink); --rc-scheme-magic-icon: var(--rc-magic-icon); --rc-scheme-neutral-bg: var(--rc-neutral-bg);
  --rc-scheme-neutral-ink: var(--rc-neutral-ink); --rc-scheme-score-low: var(--rc-score-low); --rc-scheme-tint-1-bg: var(--rc-tint-1-bg); --rc-scheme-tint-1-ink: var(--rc-tint-1-ink);
  --rc-scheme-tint-2-bg: var(--rc-tint-2-bg); --rc-scheme-tint-2-ink: var(--rc-tint-2-ink); --rc-scheme-tint-3-bg: var(--rc-tint-3-bg); --rc-scheme-tint-3-ink: var(--rc-tint-3-ink);
  --rc-scheme-tint-4-bg: var(--rc-tint-4-bg); --rc-scheme-tint-4-ink: var(--rc-tint-4-ink); --rc-scheme-tint-5-bg: var(--rc-tint-5-bg); --rc-scheme-tint-5-ink: var(--rc-tint-5-ink);
  --rc-scheme-tint-6-bg: var(--rc-tint-6-bg); --rc-scheme-tint-6-ink: var(--rc-tint-6-ink); --rc-scheme-tint-7-bg: var(--rc-tint-7-bg); --rc-scheme-tint-7-ink: var(--rc-tint-7-ink);
  --rc-scheme-tint-8-bg: var(--rc-tint-8-bg); --rc-scheme-tint-8-ink: var(--rc-tint-8-ink); --rc-scheme-primary: var(--primary); --rc-scheme-btn-primary-hover: var(--rc-btn-primary-hover);
  --rc-scheme-btn-primary-edge: var(--rc-btn-primary-edge); --rc-scheme-btn-primary-shadow: var(--rc-btn-primary-shadow); --rc-scheme-btn-primary-pressed: var(--rc-btn-primary-pressed); --rc-scheme-destructive: var(--destructive);
  --rc-scheme-critical-hover: var(--rc-critical-hover); --rc-scheme-destructive-foreground: var(--destructive-foreground); --rc-scheme-btn-critical-edge: var(--rc-btn-critical-edge); --rc-scheme-btn-critical-shadow: var(--rc-btn-critical-shadow);
  --rc-scheme-btn-critical-pressed: var(--rc-btn-critical-pressed); --rc-scheme-pressed-shadow: var(--rc-pressed-shadow); --rc-scheme-switch-track: var(--rc-switch-track); --rc-scheme-knob: var(--rc-knob);
  --rc-scheme-knob-on: var(--rc-knob-on); --rc-scheme-knob-shadow: var(--rc-knob-shadow); --rc-scheme-bar-below: var(--rc-bar-below); --rc-scheme-backdrop: var(--rc-backdrop);
  --rc-scheme-skeleton-shine: var(--rc-skeleton-shine); --rc-scheme-image-edge: var(--rc-image-edge); --rc-scheme-on-dark-ink: var(--rc-on-dark-ink); --rc-scheme-on-dark-control: var(--rc-on-dark-control);
  --rc-scheme-on-dark-edge: var(--rc-on-dark-edge); --rc-scheme-link-hover: var(--rc-link-hover); --rc-scheme-clickable-hover: var(--rc-clickable-hover); --rc-scheme-tabs-active: var(--rc-tabs-active);
  --rc-scheme-badge-default-bg: var(--rc-badge-default-bg); --rc-scheme-badge-default-ink: var(--rc-badge-default-ink); --rc-scheme-table-head-ink: var(--rc-table-head-ink); --rc-scheme-table-row-hover: var(--rc-table-row-hover);
  --rc-scheme-calendar-selected: var(--rc-calendar-selected); --rc-scheme-calendar-selected-hover: var(--rc-calendar-selected-hover); --rc-scheme-calendar-band: var(--rc-calendar-band); --rc-scheme-calendar-today-ring: var(--rc-calendar-today-ring);
  --rc-scheme-date-preset-bg: var(--rc-date-preset-bg); --rc-scheme-date-preset-ink: var(--rc-date-preset-ink); --rc-scheme-field-focus-edge: var(--rc-field-focus-edge); --rc-scheme-button-link: var(--rc-button-link);
  --rc-scheme-button-link-hover: var(--rc-button-link-hover); --rc-scheme-button-icon: var(--rc-button-icon); --rc-scheme-avatar-bg: var(--rc-avatar-bg); --rc-scheme-skeleton-base: var(--rc-skeleton-base);
  --rc-scheme-empty-media-bg: var(--rc-empty-media-bg); --rc-scheme-empty-media-ink: var(--rc-empty-media-ink); --rc-scheme-select-checked-bg: var(--rc-select-checked-bg); --rc-scheme-topbar: var(--rc-topbar);
  --rc-scheme-sidebar: var(--sidebar); --rc-scheme-sidebar-foreground: var(--sidebar-foreground); --rc-scheme-sidebar-primary: var(--sidebar-primary); --rc-scheme-sidebar-primary-foreground: var(--sidebar-primary-foreground);
  --rc-scheme-sidebar-accent: var(--sidebar-accent); --rc-scheme-sidebar-accent-foreground: var(--sidebar-accent-foreground); --rc-scheme-sidebar-border: var(--sidebar-border); --rc-scheme-sidebar-ring: var(--sidebar-ring);
  --rc-scheme-sidebar-hover: var(--rc-sidebar-hover); --rc-scheme-sidebar-hover-ink: var(--rc-sidebar-hover-ink); --rc-scheme-sidebar-ink-2: var(--rc-sidebar-ink-2); --rc-scheme-sidebar-ink-3: var(--rc-sidebar-ink-3);
  --rc-scheme-sidebar-icon: var(--rc-sidebar-icon); --rc-scheme-topbar-text: var(--rc-topbar-text); --rc-scheme-topbar-ink: var(--rc-topbar-ink); --rc-scheme-topbar-ink-2: var(--rc-topbar-ink-2);
  --rc-scheme-topbar-ink-3: var(--rc-topbar-ink-3); --rc-scheme-topbar-control: var(--rc-topbar-control); --rc-scheme-topbar-control-hover: var(--rc-topbar-control-hover); --rc-scheme-topbar-border: var(--rc-topbar-border);
  --rc-scheme-topbar-focus: var(--rc-topbar-focus); --rc-scheme-topbar-accent: var(--rc-topbar-accent); --rc-scheme-topbar-accent-hover: var(--rc-topbar-accent-hover); --rc-scheme-code-string: var(--rc-code-string);
  --rc-scheme-code-number: var(--rc-code-number); --rc-scheme-code-keyword: var(--rc-code-keyword); --rc-scheme-code-variable: var(--rc-code-variable); --rc-scheme-card-edge: var(--rc-card-edge);
  --rc-scheme-card-shadow: var(--rc-card-shadow); --rc-scheme-pop-shadow: var(--rc-pop-shadow); --rc-scheme-btn-shadow: var(--rc-btn-shadow); --rc-scheme-modal-shadow: var(--rc-modal-shadow);
  --rc-scheme-focus: var(--rc-focus); --rc-scheme-shadow: var(--rc-shadow); --rc-scheme-mix-ink: var(--rc-mix-ink);
}

/* rcm: Remarkable Commerce admin (the live RCM admin: computed styles of the orders screens and its theme stylesheets (core, components, colours); RCM is light mode only) */
[data-rc-theme='rcm'] {
  /* surfaces */
  --background: #f5f5f5;
  --card: #ffffff;
  --card-foreground: var(--foreground);
  --popover: var(--card);
  --popover-foreground: var(--foreground);
  --muted: #fcfcfc;
  --secondary: #f5f5f5;
  --secondary-foreground: var(--foreground);
  --accent: #f7f7f7;
  --accent-foreground: var(--foreground);
  --rc-pressed: #ebebeb;
  --border: #dddddd;
  --rc-border-strong: #bbbbbb;
  --rc-divider: #dddddd;
  /* ink */
  --foreground: #333333;
  --muted-foreground: #616161;
  --rc-ink-3: #6a6a6a;
  --rc-ink-4: #999999;
  --rc-control-outline: #607d8b;
  --input: #dddddd;
  --primary-foreground: #ffffff;
  --rc-link: #1e88e5;
  --ring: var(--rc-link);
  /* data */
  --chart-1: #1a8bd8;
  --rc-chart-1-prev: #8fc6ec;
  /* categorical series palette 1-8 (+ the dashed comparison colour); hue-matched to the chip tints */
  --chart-2: #14a38b; --rc-chart-2-prev: #8fd6c9;
  --chart-3: #5aa831; --rc-chart-3-prev: #b0d99a;
  --chart-4: #e0a100; --rc-chart-4-prev: #f1d078;
  --chart-5: #e8702a; --rc-chart-5-prev: #f4b78f;
  --rc-chart-6: #d63e80; --rc-chart-6-prev: #eca0bf;
  --rc-chart-7: #7b4fd6; --rc-chart-7-prev: #bba3ea;
  --rc-chart-8: #6b7a90; --rc-chart-8-prev: #b4bcc9;
  --rc-bar: #4aa6e3;
  --rc-bar-track: #eef5fb;
  /* chart furniture: gridlines, the baseline (lowest gridline) and the hover crosshair */
  --rc-chart-grid: var(--rc-divider);
  --rc-chart-baseline: #d4d4d4;
  --rc-chart-cross: var(--rc-ink-4);
  /* status tones: bg, ink (AA on bg), icon */
  --rc-good-bg: #e8f5e9; --rc-good-ink: #43a047; --rc-good-icon: #4caf50;
  --rc-bad-bg: #fbe9e7; --rc-bad-ink: #d84315; --rc-bad-icon: #f44336;
  --rc-warn-bg: #fff3e0; --rc-warn-ink: #ef6c00; --rc-warn-icon: #ff5722;
  --rc-info-bg: #e0f7fa; --rc-info-ink: #00838f; --rc-info-icon: #00bcd4;
  --rc-magic-bg: #f8f1ff; --rc-magic-ink: #5700d1; --rc-magic-icon: #8051ff;
  --rc-neutral-bg: var(--secondary); --rc-neutral-ink: var(--muted-foreground);
  --rc-score-low: #d67a00;
  /* categorical chip tints 1-8 (background, text); products pick the number */
  --rc-tint-1-bg: #e3f1fb; --rc-tint-1-ink: #0b4a75;
  --rc-tint-2-bg: #d9f5f0; --rc-tint-2-ink: #0a5a4c;
  --rc-tint-3-bg: #e2f6d8; --rc-tint-3-ink: #2c5a10;
  --rc-tint-4-bg: #fdf0cf; --rc-tint-4-ink: #6b4a00;
  --rc-tint-5-bg: #ffe6d6; --rc-tint-5-ink: #7a3200;
  --rc-tint-6-bg: #fde4ee; --rc-tint-6-ink: #7d1a46;
  --rc-tint-7-bg: #efe6fd; --rc-tint-7-ink: #4b1d96;
  --rc-tint-8-bg: #e6e9ee; --rc-tint-8-ink: #3a4452;
  /* actions and overlays (elements fall back to these values when a token is absent) */
  --primary: #2196f3;
  --rc-btn-primary-hover: #0c7cd5;
  --rc-btn-primary-edge: 0 0 0 1px transparent inset;
  --rc-btn-primary-shadow: none;
  --rc-btn-primary-pressed: 0 3px 5px rgba(0, 0, 0, 0.125) inset;
  --destructive: #f44336;
  --rc-critical-hover: #ea1c0d;
  --destructive-foreground: #ffffff;
  --rc-btn-critical-edge: 0 0 0 1px transparent inset;
  --rc-btn-critical-shadow: none;
  --rc-btn-critical-pressed: 0 3px 5px rgba(0, 0, 0, 0.125) inset;
  --rc-pressed-shadow: 0 0 0 1px color-mix(in srgb, var(--rc-mix-ink) 14%, transparent) inset, 0 1px 1px 0 color-mix(in srgb, var(--rc-shadow) 12%, transparent) inset;
  --rc-switch-track: #8a8a8a;
  --rc-knob: #ffffff; --rc-knob-on: var(--primary-foreground); --rc-knob-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
  --rc-bar-below: #c4c4c4;
  --rc-backdrop: color-mix(in srgb, var(--rc-shadow) 32%, transparent);
  --rc-skeleton-shine: rgba(255, 255, 255, 0.7);
  --rc-image-edge: rgba(0, 0, 0, 0.08);
  --rc-on-dark-ink: #ffffff; --rc-on-dark-control: color-mix(in srgb, var(--rc-topbar-ink) 16%, transparent); --rc-on-dark-edge: rgba(255, 255, 255, 0.24);
  --rc-link-hover: #1565c0;
  --rc-popover-width: 280px;
  --rc-popover-radius: var(--rc-radius-card);
  --rc-tooltip-width: 280px;
  --rc-clickable-hover: var(--accent);
  --rc-clickable-radius: calc(var(--radius) * 0.8);
  --rc-tabs-active: var(--card);
  /* component looks: the Lens / Pinpoint look of a part whose role variable comes from the reference (each element reads var(--rc-x, <reference variable>); a theme can set these back to the reference variable) */
  --rc-badge-default-bg: var(--rc-neutral-bg); --rc-badge-default-ink: var(--rc-neutral-ink);
  --rc-table-head-ink: var(--muted-foreground); --rc-table-row-hover: var(--accent);
  --rc-calendar-selected: var(--rc-link); --rc-calendar-selected-hover: var(--rc-link-hover);
  --rc-calendar-band: color-mix(in srgb, var(--rc-link) 9%, transparent);
  --rc-calendar-today-bg: transparent; --rc-calendar-today-ring: var(--rc-border-strong);
  --rc-date-preset-bg: var(--rc-calendar-band); --rc-date-preset-ink: var(--rc-link);
  --rc-field-focus-edge: var(--rc-control-outline);
  --rc-button-link: var(--rc-link); --rc-button-link-hover: var(--rc-link-hover);
  --rc-button-icon: var(--muted-foreground);
  --rc-avatar-bg: var(--secondary); --rc-skeleton-base: var(--secondary);
  --rc-empty-media-bg: var(--secondary); --rc-empty-media-ink: var(--muted-foreground); --rc-empty-media-radius: 50%;
  --rc-select-checked-bg: var(--secondary);
  /* app shell (the top bar is a dark band in both modes) */
  --rc-topbar: #37474f;
  --sidebar: #263238; --sidebar-foreground: #c9ccce;
  --sidebar-primary: var(--primary); --sidebar-primary-foreground: var(--primary-foreground);
  --sidebar-accent: #1e282d; --sidebar-accent-foreground: #ffffff;
  --sidebar-border: rgba(255, 255, 255, 0.1); --sidebar-ring: #90caf9;
  --rc-sidebar-hover: #222d32; --rc-sidebar-hover-ink: #ffffff;
  --rc-sidebar-ink-2: #c9ccce; --rc-sidebar-ink-3: #93999c; --rc-sidebar-icon: #c9ccce;
  --rc-topbar-text: #ffffff; --rc-topbar-ink: #ffffff; --rc-topbar-ink-2: rgba(255, 255, 255, 0.75); --rc-topbar-ink-3: rgba(255, 255, 255, 0.75);
  --rc-topbar-control: #263238; --rc-topbar-control-hover: rgba(0, 0, 0, 0.2); --rc-topbar-border: rgba(255, 255, 255, 0.1);
  --rc-topbar-focus: #7aa7ff; --rc-topbar-accent: #9ec5ff; --rc-topbar-accent-hover: #c8ddff;
  /* code (rc-code, rc-json-tree syntax colours) */
  --rc-code-string: #1f7a4f; --rc-code-number: #a15500; --rc-code-keyword: #8536c9; --rc-code-variable: #b4235f;
  /* elevation */
  --rc-card-edge: var(--border);
  --rc-card-shadow: 0 0 0 1px var(--rc-card-edge), 0 1px 1px 0 rgba(0, 0, 0, 0.05);
  --rc-pop-shadow: 0 0 0 1px var(--border), 0 1px 3px rgba(0, 0, 0, 0.1);
  --rc-btn-shadow: 0 0 0 1px var(--border) inset;
  --rc-modal-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
  --rc-focus: 0 0 0 2px var(--card), 0 0 0 4px var(--ring);
  --rc-shadow: #1a1a1a; --rc-mix-ink: #1a1a1a;
  /* shape, type, motion */
  --rc-radius-card: 3px;
  --radius: 3.75px;
  --rc-font: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --rc-font-mono: ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace;
  --rc-font-size: 13px;
  --rc-line-height: 20px;
  --rc-font-weight: 400;
  --rc-ease: cubic-bezier(0.25, 1, 0.5, 1);
  --rc-motion-enter: 280ms; --rc-motion-exit: 200ms; --rc-motion-enter-sm: 150ms; --rc-motion-exit-sm: 100ms;
  --rc-ease-out: cubic-bezier(0.25, 1, 0.5, 1); --rc-ease-in: cubic-bezier(0.32, 0, 0.67, 0);
  /* spacing scale, 100 = 4px (px, no rem: Bootstrap 3 hosts set html{font-size:10px}) */
  --rc-space-025: 1px; --rc-space-050: 2px; --rc-space-100: 4px; --rc-space-150: 6px; --rc-space-200: 8px;
  --rc-space-250: 10px; --rc-space-300: 12px; --rc-space-350: 14px; --rc-space-400: 16px; --rc-space-500: 20px;
  --rc-space-600: 24px; --rc-space-800: 32px; --rc-space-1000: 40px; --rc-space-1200: 48px;

  /* scheme capture (scripts/gen-tokens.mjs): what overlays reset to inside a local colour region */
  --rc-scheme-background: var(--background); --rc-scheme-card: var(--card); --rc-scheme-card-foreground: var(--card-foreground); --rc-scheme-popover: var(--popover);
  --rc-scheme-popover-foreground: var(--popover-foreground); --rc-scheme-muted: var(--muted); --rc-scheme-secondary: var(--secondary); --rc-scheme-secondary-foreground: var(--secondary-foreground);
  --rc-scheme-accent: var(--accent); --rc-scheme-accent-foreground: var(--accent-foreground); --rc-scheme-pressed: var(--rc-pressed); --rc-scheme-border: var(--border);
  --rc-scheme-border-strong: var(--rc-border-strong); --rc-scheme-divider: var(--rc-divider); --rc-scheme-foreground: var(--foreground); --rc-scheme-muted-foreground: var(--muted-foreground);
  --rc-scheme-ink-3: var(--rc-ink-3); --rc-scheme-ink-4: var(--rc-ink-4); --rc-scheme-control-outline: var(--rc-control-outline); --rc-scheme-input: var(--input);
  --rc-scheme-primary-foreground: var(--primary-foreground); --rc-scheme-link: var(--rc-link); --rc-scheme-ring: var(--ring); --rc-scheme-chart-1: var(--chart-1);
  --rc-scheme-chart-1-prev: var(--rc-chart-1-prev); --rc-scheme-chart-2: var(--chart-2); --rc-scheme-chart-2-prev: var(--rc-chart-2-prev); --rc-scheme-chart-3: var(--chart-3);
  --rc-scheme-chart-3-prev: var(--rc-chart-3-prev); --rc-scheme-chart-4: var(--chart-4); --rc-scheme-chart-4-prev: var(--rc-chart-4-prev); --rc-scheme-chart-5: var(--chart-5);
  --rc-scheme-chart-5-prev: var(--rc-chart-5-prev); --rc-scheme-chart-6: var(--rc-chart-6); --rc-scheme-chart-6-prev: var(--rc-chart-6-prev); --rc-scheme-chart-7: var(--rc-chart-7);
  --rc-scheme-chart-7-prev: var(--rc-chart-7-prev); --rc-scheme-chart-8: var(--rc-chart-8); --rc-scheme-chart-8-prev: var(--rc-chart-8-prev); --rc-scheme-bar: var(--rc-bar);
  --rc-scheme-bar-track: var(--rc-bar-track); --rc-scheme-chart-grid: var(--rc-chart-grid); --rc-scheme-chart-baseline: var(--rc-chart-baseline); --rc-scheme-chart-cross: var(--rc-chart-cross);
  --rc-scheme-good-bg: var(--rc-good-bg); --rc-scheme-good-ink: var(--rc-good-ink); --rc-scheme-good-icon: var(--rc-good-icon); --rc-scheme-bad-bg: var(--rc-bad-bg);
  --rc-scheme-bad-ink: var(--rc-bad-ink); --rc-scheme-bad-icon: var(--rc-bad-icon); --rc-scheme-warn-bg: var(--rc-warn-bg); --rc-scheme-warn-ink: var(--rc-warn-ink);
  --rc-scheme-warn-icon: var(--rc-warn-icon); --rc-scheme-info-bg: var(--rc-info-bg); --rc-scheme-info-ink: var(--rc-info-ink); --rc-scheme-info-icon: var(--rc-info-icon);
  --rc-scheme-magic-bg: var(--rc-magic-bg); --rc-scheme-magic-ink: var(--rc-magic-ink); --rc-scheme-magic-icon: var(--rc-magic-icon); --rc-scheme-neutral-bg: var(--rc-neutral-bg);
  --rc-scheme-neutral-ink: var(--rc-neutral-ink); --rc-scheme-score-low: var(--rc-score-low); --rc-scheme-tint-1-bg: var(--rc-tint-1-bg); --rc-scheme-tint-1-ink: var(--rc-tint-1-ink);
  --rc-scheme-tint-2-bg: var(--rc-tint-2-bg); --rc-scheme-tint-2-ink: var(--rc-tint-2-ink); --rc-scheme-tint-3-bg: var(--rc-tint-3-bg); --rc-scheme-tint-3-ink: var(--rc-tint-3-ink);
  --rc-scheme-tint-4-bg: var(--rc-tint-4-bg); --rc-scheme-tint-4-ink: var(--rc-tint-4-ink); --rc-scheme-tint-5-bg: var(--rc-tint-5-bg); --rc-scheme-tint-5-ink: var(--rc-tint-5-ink);
  --rc-scheme-tint-6-bg: var(--rc-tint-6-bg); --rc-scheme-tint-6-ink: var(--rc-tint-6-ink); --rc-scheme-tint-7-bg: var(--rc-tint-7-bg); --rc-scheme-tint-7-ink: var(--rc-tint-7-ink);
  --rc-scheme-tint-8-bg: var(--rc-tint-8-bg); --rc-scheme-tint-8-ink: var(--rc-tint-8-ink); --rc-scheme-primary: var(--primary); --rc-scheme-btn-primary-hover: var(--rc-btn-primary-hover);
  --rc-scheme-btn-primary-edge: var(--rc-btn-primary-edge); --rc-scheme-btn-primary-shadow: var(--rc-btn-primary-shadow); --rc-scheme-btn-primary-pressed: var(--rc-btn-primary-pressed); --rc-scheme-destructive: var(--destructive);
  --rc-scheme-critical-hover: var(--rc-critical-hover); --rc-scheme-destructive-foreground: var(--destructive-foreground); --rc-scheme-btn-critical-edge: var(--rc-btn-critical-edge); --rc-scheme-btn-critical-shadow: var(--rc-btn-critical-shadow);
  --rc-scheme-btn-critical-pressed: var(--rc-btn-critical-pressed); --rc-scheme-pressed-shadow: var(--rc-pressed-shadow); --rc-scheme-switch-track: var(--rc-switch-track); --rc-scheme-knob: var(--rc-knob);
  --rc-scheme-knob-on: var(--rc-knob-on); --rc-scheme-knob-shadow: var(--rc-knob-shadow); --rc-scheme-bar-below: var(--rc-bar-below); --rc-scheme-backdrop: var(--rc-backdrop);
  --rc-scheme-skeleton-shine: var(--rc-skeleton-shine); --rc-scheme-image-edge: var(--rc-image-edge); --rc-scheme-on-dark-ink: var(--rc-on-dark-ink); --rc-scheme-on-dark-control: var(--rc-on-dark-control);
  --rc-scheme-on-dark-edge: var(--rc-on-dark-edge); --rc-scheme-link-hover: var(--rc-link-hover); --rc-scheme-clickable-hover: var(--rc-clickable-hover); --rc-scheme-tabs-active: var(--rc-tabs-active);
  --rc-scheme-badge-default-bg: var(--rc-badge-default-bg); --rc-scheme-badge-default-ink: var(--rc-badge-default-ink); --rc-scheme-table-head-ink: var(--rc-table-head-ink); --rc-scheme-table-row-hover: var(--rc-table-row-hover);
  --rc-scheme-calendar-selected: var(--rc-calendar-selected); --rc-scheme-calendar-selected-hover: var(--rc-calendar-selected-hover); --rc-scheme-calendar-band: var(--rc-calendar-band); --rc-scheme-calendar-today-ring: var(--rc-calendar-today-ring);
  --rc-scheme-date-preset-bg: var(--rc-date-preset-bg); --rc-scheme-date-preset-ink: var(--rc-date-preset-ink); --rc-scheme-field-focus-edge: var(--rc-field-focus-edge); --rc-scheme-button-link: var(--rc-button-link);
  --rc-scheme-button-link-hover: var(--rc-button-link-hover); --rc-scheme-button-icon: var(--rc-button-icon); --rc-scheme-avatar-bg: var(--rc-avatar-bg); --rc-scheme-skeleton-base: var(--rc-skeleton-base);
  --rc-scheme-empty-media-bg: var(--rc-empty-media-bg); --rc-scheme-empty-media-ink: var(--rc-empty-media-ink); --rc-scheme-select-checked-bg: var(--rc-select-checked-bg); --rc-scheme-topbar: var(--rc-topbar);
  --rc-scheme-sidebar: var(--sidebar); --rc-scheme-sidebar-foreground: var(--sidebar-foreground); --rc-scheme-sidebar-primary: var(--sidebar-primary); --rc-scheme-sidebar-primary-foreground: var(--sidebar-primary-foreground);
  --rc-scheme-sidebar-accent: var(--sidebar-accent); --rc-scheme-sidebar-accent-foreground: var(--sidebar-accent-foreground); --rc-scheme-sidebar-border: var(--sidebar-border); --rc-scheme-sidebar-ring: var(--sidebar-ring);
  --rc-scheme-sidebar-hover: var(--rc-sidebar-hover); --rc-scheme-sidebar-hover-ink: var(--rc-sidebar-hover-ink); --rc-scheme-sidebar-ink-2: var(--rc-sidebar-ink-2); --rc-scheme-sidebar-ink-3: var(--rc-sidebar-ink-3);
  --rc-scheme-sidebar-icon: var(--rc-sidebar-icon); --rc-scheme-topbar-text: var(--rc-topbar-text); --rc-scheme-topbar-ink: var(--rc-topbar-ink); --rc-scheme-topbar-ink-2: var(--rc-topbar-ink-2);
  --rc-scheme-topbar-ink-3: var(--rc-topbar-ink-3); --rc-scheme-topbar-control: var(--rc-topbar-control); --rc-scheme-topbar-control-hover: var(--rc-topbar-control-hover); --rc-scheme-topbar-border: var(--rc-topbar-border);
  --rc-scheme-topbar-focus: var(--rc-topbar-focus); --rc-scheme-topbar-accent: var(--rc-topbar-accent); --rc-scheme-topbar-accent-hover: var(--rc-topbar-accent-hover); --rc-scheme-code-string: var(--rc-code-string);
  --rc-scheme-code-number: var(--rc-code-number); --rc-scheme-code-keyword: var(--rc-code-keyword); --rc-scheme-code-variable: var(--rc-code-variable); --rc-scheme-card-edge: var(--rc-card-edge);
  --rc-scheme-card-shadow: var(--rc-card-shadow); --rc-scheme-pop-shadow: var(--rc-pop-shadow); --rc-scheme-btn-shadow: var(--rc-btn-shadow); --rc-scheme-modal-shadow: var(--rc-modal-shadow);
  --rc-scheme-focus: var(--rc-focus); --rc-scheme-shadow: var(--rc-shadow); --rc-scheme-mix-ink: var(--rc-mix-ink);
}

/* rcm, dark */
.dark [data-rc-theme='rcm'],
[data-rc-theme='rcm'].dark,
[data-rc-theme='rcm'] .dark {
  color-scheme: dark;

  /* surfaces */
  --background: #151c20;
  --card: #1d272c;
  --card-foreground: var(--foreground);
  --popover: var(--card);
  --popover-foreground: var(--foreground);
  --muted: #222d33;
  --secondary: #27343a;
  --secondary-foreground: var(--foreground);
  --accent: #253136;
  --accent-foreground: var(--foreground);
  --rc-pressed: #2c3a41;
  --border: #37474f;
  --rc-border-strong: #455a64;
  --rc-divider: #2a373d;
  /* ink */
  --foreground: #eceff1;
  --muted-foreground: #b0bec5;
  --rc-ink-3: #9eb0b9;
  --rc-ink-4: #90a4ae;
  --rc-control-outline: #90a4ae;
  --input: #78909c;
  --primary-foreground: #0e1a20;
  --rc-link: #64b5f6;
  --ring: var(--rc-link);
  /* data */
  --chart-1: #3d9be6;
  --rc-chart-1-prev: #2b5a7e;
  /* categorical series palette 1-8 (+ the dashed comparison colour); hue-matched to the chip tints */
  --chart-2: #22b89e; --rc-chart-2-prev: #1d6157;
  --chart-3: #6cbd3f; --rc-chart-3-prev: #3e6427;
  --chart-4: #e8ac12; --rc-chart-4-prev: #755a14;
  --chart-5: #f07f3a; --rc-chart-5-prev: #7b4627;
  --rc-chart-6: #e5559a; --rc-chart-6-prev: #77304f;
  --rc-chart-7: #9a76ee; --rc-chart-7-prev: #4f3f7a;
  --rc-chart-8: #8d9bb0; --rc-chart-8-prev: #4a5260;
  --rc-bar: #3d9be6;
  --rc-bar-track: #1e2d36;
  /* chart furniture: gridlines, the baseline (lowest gridline) and the hover crosshair */
  --rc-chart-grid: var(--rc-divider);
  --rc-chart-baseline: #455a64;
  --rc-chart-cross: #607d8b;
  /* status tones: bg, ink (AA on bg), icon */
  --rc-good-bg: #173326; --rc-good-ink: #a5d6a7; --rc-good-icon: #66bb6a;
  --rc-bad-bg: #3e1f1a; --rc-bad-ink: #ffab91; --rc-bad-icon: #ef5350;
  --rc-warn-bg: #3d2c14; --rc-warn-ink: #ffcc80; --rc-warn-icon: #ff8a65;
  --rc-info-bg: #10333a; --rc-info-ink: #80deea; --rc-info-icon: #26c6da;
  --rc-magic-bg: #2c1a4f; --rc-magic-ink: #d3b9ff; --rc-magic-icon: #a585ff;
  --rc-neutral-bg: var(--secondary); --rc-neutral-ink: var(--muted-foreground);
  --rc-score-low: #f09a2a;
  /* categorical chip tints 1-8 (background, text); products pick the number */
  --rc-tint-1-bg: #0f2e44; --rc-tint-1-ink: #9fd0f5;
  --rc-tint-2-bg: #0b3832; --rc-tint-2-ink: #8fe0d0;
  --rc-tint-3-bg: #1d3812; --rc-tint-3-ink: #b4e39a;
  --rc-tint-4-bg: #3b2d06; --rc-tint-4-ink: #f2d27a;
  --rc-tint-5-bg: #43220d; --rc-tint-5-ink: #f7b88f;
  --rc-tint-6-bg: #43142c; --rc-tint-6-ink: #f5a3c6;
  --rc-tint-7-bg: #2c1c52; --rc-tint-7-ink: #c9b2f5;
  --rc-tint-8-bg: #283039; --rc-tint-8-ink: #c3cbd6;
  /* actions and overlays (elements fall back to these values when a token is absent) */
  --primary: #64b5f6;
  --rc-btn-primary-hover: #90caf9;
  --rc-btn-primary-edge: 0 0 0 1px transparent inset;
  --rc-btn-primary-shadow: none;
  --rc-btn-primary-pressed: 0 3px 5px rgba(0, 0, 0, 0.3) inset;
  --destructive: #d32f2f;
  --rc-critical-hover: #c62828;
  --destructive-foreground: #ffffff;
  --rc-btn-critical-edge: 0 0 0 1px transparent inset;
  --rc-btn-critical-shadow: none;
  --rc-btn-critical-pressed: 0 3px 5px rgba(0, 0, 0, 0.3) inset;
  --rc-pressed-shadow: 0 0 0 1px color-mix(in srgb, var(--rc-mix-ink) 14%, transparent) inset, 0 1px 1px 0 color-mix(in srgb, var(--rc-shadow) 50%, transparent) inset;
  --rc-switch-track: var(--input);
  --rc-knob: #ffffff; --rc-knob-on: var(--primary-foreground); --rc-knob-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
  --rc-bar-below: #5c5c5c;
  --rc-backdrop: color-mix(in srgb, var(--rc-shadow) 60%, transparent);
  --rc-skeleton-shine: rgba(255, 255, 255, 0.06);
  --rc-image-edge: rgba(255, 255, 255, 0.1);
  --rc-on-dark-ink: #ffffff; --rc-on-dark-control: color-mix(in srgb, var(--rc-topbar-ink) 16%, transparent); --rc-on-dark-edge: rgba(255, 255, 255, 0.24);
  --rc-link-hover: #90caf9;
  --rc-popover-width: 280px;
  --rc-popover-radius: var(--rc-radius-card);
  --rc-tooltip-width: 280px;
  --rc-clickable-hover: var(--accent);
  --rc-clickable-radius: calc(var(--radius) * 0.8);
  --rc-tabs-active: color-mix(in srgb, var(--input) 30%, var(--muted));
  /* component looks: the Lens / Pinpoint look of a part whose role variable comes from the reference (each element reads var(--rc-x, <reference variable>); a theme can set these back to the reference variable) */
  --rc-badge-default-bg: var(--rc-neutral-bg); --rc-badge-default-ink: var(--rc-neutral-ink);
  --rc-table-head-ink: var(--muted-foreground); --rc-table-row-hover: var(--accent);
  --rc-calendar-selected: var(--rc-link); --rc-calendar-selected-hover: var(--rc-link-hover);
  --rc-calendar-band: color-mix(in srgb, var(--rc-link) 9%, transparent);
  --rc-calendar-today-bg: transparent; --rc-calendar-today-ring: var(--rc-border-strong);
  --rc-date-preset-bg: var(--rc-calendar-band); --rc-date-preset-ink: var(--rc-link);
  --rc-field-focus-edge: var(--rc-control-outline);
  --rc-button-link: var(--rc-link); --rc-button-link-hover: var(--rc-link-hover);
  --rc-button-icon: var(--muted-foreground);
  --rc-avatar-bg: var(--secondary); --rc-skeleton-base: var(--secondary);
  --rc-empty-media-bg: var(--secondary); --rc-empty-media-ink: var(--muted-foreground); --rc-empty-media-radius: 50%;
  --rc-select-checked-bg: var(--secondary);
  /* app shell (the top bar is a dark band in both modes) */
  --rc-topbar: #263238;
  --sidebar: #1b2428; --sidebar-foreground: #c5ced3;
  --sidebar-primary: var(--primary); --sidebar-primary-foreground: var(--primary-foreground);
  --sidebar-accent: #2c3a41; --sidebar-accent-foreground: #ffffff;
  --sidebar-border: rgba(255, 255, 255, 0.08); --sidebar-ring: #90caf9;
  --rc-sidebar-hover: #243035; --rc-sidebar-hover-ink: #ffffff;
  --rc-sidebar-ink-2: #c5ced3; --rc-sidebar-ink-3: #90a4ae; --rc-sidebar-icon: #c5ced3;
  --rc-topbar-text: #ffffff; --rc-topbar-ink: #ffffff; --rc-topbar-ink-2: rgba(255, 255, 255, 0.75); --rc-topbar-ink-3: rgba(255, 255, 255, 0.75);
  --rc-topbar-control: #1b2428; --rc-topbar-control-hover: #2c3a41; --rc-topbar-border: rgba(255, 255, 255, 0.1);
  --rc-topbar-focus: #7aa7ff; --rc-topbar-accent: #9ec5ff; --rc-topbar-accent-hover: #c8ddff;
  /* code (rc-code, rc-json-tree syntax colours) */
  --rc-code-string: #6fd3a0; --rc-code-number: #f0a860; --rc-code-keyword: #c79bff; --rc-code-variable: #ff8fbf;
  /* elevation */
  --rc-card-edge: var(--border);
  --rc-card-shadow: 0 0 0 1px var(--rc-card-edge), 0 1px 0 0 color-mix(in srgb, var(--rc-shadow) 40%, transparent), 0 1px 3px 0 color-mix(in srgb, var(--rc-shadow) 50%, transparent);
  --rc-pop-shadow: 0 0 0 1px var(--border), 0 4px 8px -2px color-mix(in srgb, var(--rc-shadow) 50%, transparent), 0 12px 24px -6px color-mix(in srgb, var(--rc-shadow) 60%, transparent);
  --rc-btn-shadow: 0 0 0 1px var(--border) inset;
  --rc-modal-shadow: 0 0 0 1px var(--border), 0 20px 48px -12px color-mix(in srgb, var(--rc-shadow) 70%, transparent);
  --rc-focus: 0 0 0 2px var(--card), 0 0 0 4px var(--ring);
  --rc-shadow: #000000; --rc-mix-ink: #ffffff;
  /* shape, type, motion */
  --rc-radius-card: 3px;
  --radius: 3.75px;
  --rc-font: 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --rc-font-mono: ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace;
  --rc-font-size: 13px;
  --rc-line-height: 20px;
  --rc-font-weight: 400;
  --rc-ease: cubic-bezier(0.25, 1, 0.5, 1);
  --rc-motion-enter: 280ms; --rc-motion-exit: 200ms; --rc-motion-enter-sm: 150ms; --rc-motion-exit-sm: 100ms;
  --rc-ease-out: cubic-bezier(0.25, 1, 0.5, 1); --rc-ease-in: cubic-bezier(0.32, 0, 0.67, 0);
  /* spacing scale, 100 = 4px (px, no rem: Bootstrap 3 hosts set html{font-size:10px}) */
  --rc-space-025: 1px; --rc-space-050: 2px; --rc-space-100: 4px; --rc-space-150: 6px; --rc-space-200: 8px;
  --rc-space-250: 10px; --rc-space-300: 12px; --rc-space-350: 14px; --rc-space-400: 16px; --rc-space-500: 20px;
  --rc-space-600: 24px; --rc-space-800: 32px; --rc-space-1000: 40px; --rc-space-1200: 48px;

  /* scheme capture (scripts/gen-tokens.mjs): what overlays reset to inside a local colour region */
  --rc-scheme-background: var(--background); --rc-scheme-card: var(--card); --rc-scheme-card-foreground: var(--card-foreground); --rc-scheme-popover: var(--popover);
  --rc-scheme-popover-foreground: var(--popover-foreground); --rc-scheme-muted: var(--muted); --rc-scheme-secondary: var(--secondary); --rc-scheme-secondary-foreground: var(--secondary-foreground);
  --rc-scheme-accent: var(--accent); --rc-scheme-accent-foreground: var(--accent-foreground); --rc-scheme-pressed: var(--rc-pressed); --rc-scheme-border: var(--border);
  --rc-scheme-border-strong: var(--rc-border-strong); --rc-scheme-divider: var(--rc-divider); --rc-scheme-foreground: var(--foreground); --rc-scheme-muted-foreground: var(--muted-foreground);
  --rc-scheme-ink-3: var(--rc-ink-3); --rc-scheme-ink-4: var(--rc-ink-4); --rc-scheme-control-outline: var(--rc-control-outline); --rc-scheme-input: var(--input);
  --rc-scheme-primary-foreground: var(--primary-foreground); --rc-scheme-link: var(--rc-link); --rc-scheme-ring: var(--ring); --rc-scheme-chart-1: var(--chart-1);
  --rc-scheme-chart-1-prev: var(--rc-chart-1-prev); --rc-scheme-chart-2: var(--chart-2); --rc-scheme-chart-2-prev: var(--rc-chart-2-prev); --rc-scheme-chart-3: var(--chart-3);
  --rc-scheme-chart-3-prev: var(--rc-chart-3-prev); --rc-scheme-chart-4: var(--chart-4); --rc-scheme-chart-4-prev: var(--rc-chart-4-prev); --rc-scheme-chart-5: var(--chart-5);
  --rc-scheme-chart-5-prev: var(--rc-chart-5-prev); --rc-scheme-chart-6: var(--rc-chart-6); --rc-scheme-chart-6-prev: var(--rc-chart-6-prev); --rc-scheme-chart-7: var(--rc-chart-7);
  --rc-scheme-chart-7-prev: var(--rc-chart-7-prev); --rc-scheme-chart-8: var(--rc-chart-8); --rc-scheme-chart-8-prev: var(--rc-chart-8-prev); --rc-scheme-bar: var(--rc-bar);
  --rc-scheme-bar-track: var(--rc-bar-track); --rc-scheme-chart-grid: var(--rc-chart-grid); --rc-scheme-chart-baseline: var(--rc-chart-baseline); --rc-scheme-chart-cross: var(--rc-chart-cross);
  --rc-scheme-good-bg: var(--rc-good-bg); --rc-scheme-good-ink: var(--rc-good-ink); --rc-scheme-good-icon: var(--rc-good-icon); --rc-scheme-bad-bg: var(--rc-bad-bg);
  --rc-scheme-bad-ink: var(--rc-bad-ink); --rc-scheme-bad-icon: var(--rc-bad-icon); --rc-scheme-warn-bg: var(--rc-warn-bg); --rc-scheme-warn-ink: var(--rc-warn-ink);
  --rc-scheme-warn-icon: var(--rc-warn-icon); --rc-scheme-info-bg: var(--rc-info-bg); --rc-scheme-info-ink: var(--rc-info-ink); --rc-scheme-info-icon: var(--rc-info-icon);
  --rc-scheme-magic-bg: var(--rc-magic-bg); --rc-scheme-magic-ink: var(--rc-magic-ink); --rc-scheme-magic-icon: var(--rc-magic-icon); --rc-scheme-neutral-bg: var(--rc-neutral-bg);
  --rc-scheme-neutral-ink: var(--rc-neutral-ink); --rc-scheme-score-low: var(--rc-score-low); --rc-scheme-tint-1-bg: var(--rc-tint-1-bg); --rc-scheme-tint-1-ink: var(--rc-tint-1-ink);
  --rc-scheme-tint-2-bg: var(--rc-tint-2-bg); --rc-scheme-tint-2-ink: var(--rc-tint-2-ink); --rc-scheme-tint-3-bg: var(--rc-tint-3-bg); --rc-scheme-tint-3-ink: var(--rc-tint-3-ink);
  --rc-scheme-tint-4-bg: var(--rc-tint-4-bg); --rc-scheme-tint-4-ink: var(--rc-tint-4-ink); --rc-scheme-tint-5-bg: var(--rc-tint-5-bg); --rc-scheme-tint-5-ink: var(--rc-tint-5-ink);
  --rc-scheme-tint-6-bg: var(--rc-tint-6-bg); --rc-scheme-tint-6-ink: var(--rc-tint-6-ink); --rc-scheme-tint-7-bg: var(--rc-tint-7-bg); --rc-scheme-tint-7-ink: var(--rc-tint-7-ink);
  --rc-scheme-tint-8-bg: var(--rc-tint-8-bg); --rc-scheme-tint-8-ink: var(--rc-tint-8-ink); --rc-scheme-primary: var(--primary); --rc-scheme-btn-primary-hover: var(--rc-btn-primary-hover);
  --rc-scheme-btn-primary-edge: var(--rc-btn-primary-edge); --rc-scheme-btn-primary-shadow: var(--rc-btn-primary-shadow); --rc-scheme-btn-primary-pressed: var(--rc-btn-primary-pressed); --rc-scheme-destructive: var(--destructive);
  --rc-scheme-critical-hover: var(--rc-critical-hover); --rc-scheme-destructive-foreground: var(--destructive-foreground); --rc-scheme-btn-critical-edge: var(--rc-btn-critical-edge); --rc-scheme-btn-critical-shadow: var(--rc-btn-critical-shadow);
  --rc-scheme-btn-critical-pressed: var(--rc-btn-critical-pressed); --rc-scheme-pressed-shadow: var(--rc-pressed-shadow); --rc-scheme-switch-track: var(--rc-switch-track); --rc-scheme-knob: var(--rc-knob);
  --rc-scheme-knob-on: var(--rc-knob-on); --rc-scheme-knob-shadow: var(--rc-knob-shadow); --rc-scheme-bar-below: var(--rc-bar-below); --rc-scheme-backdrop: var(--rc-backdrop);
  --rc-scheme-skeleton-shine: var(--rc-skeleton-shine); --rc-scheme-image-edge: var(--rc-image-edge); --rc-scheme-on-dark-ink: var(--rc-on-dark-ink); --rc-scheme-on-dark-control: var(--rc-on-dark-control);
  --rc-scheme-on-dark-edge: var(--rc-on-dark-edge); --rc-scheme-link-hover: var(--rc-link-hover); --rc-scheme-clickable-hover: var(--rc-clickable-hover); --rc-scheme-tabs-active: var(--rc-tabs-active);
  --rc-scheme-badge-default-bg: var(--rc-badge-default-bg); --rc-scheme-badge-default-ink: var(--rc-badge-default-ink); --rc-scheme-table-head-ink: var(--rc-table-head-ink); --rc-scheme-table-row-hover: var(--rc-table-row-hover);
  --rc-scheme-calendar-selected: var(--rc-calendar-selected); --rc-scheme-calendar-selected-hover: var(--rc-calendar-selected-hover); --rc-scheme-calendar-band: var(--rc-calendar-band); --rc-scheme-calendar-today-ring: var(--rc-calendar-today-ring);
  --rc-scheme-date-preset-bg: var(--rc-date-preset-bg); --rc-scheme-date-preset-ink: var(--rc-date-preset-ink); --rc-scheme-field-focus-edge: var(--rc-field-focus-edge); --rc-scheme-button-link: var(--rc-button-link);
  --rc-scheme-button-link-hover: var(--rc-button-link-hover); --rc-scheme-button-icon: var(--rc-button-icon); --rc-scheme-avatar-bg: var(--rc-avatar-bg); --rc-scheme-skeleton-base: var(--rc-skeleton-base);
  --rc-scheme-empty-media-bg: var(--rc-empty-media-bg); --rc-scheme-empty-media-ink: var(--rc-empty-media-ink); --rc-scheme-select-checked-bg: var(--rc-select-checked-bg); --rc-scheme-topbar: var(--rc-topbar);
  --rc-scheme-sidebar: var(--sidebar); --rc-scheme-sidebar-foreground: var(--sidebar-foreground); --rc-scheme-sidebar-primary: var(--sidebar-primary); --rc-scheme-sidebar-primary-foreground: var(--sidebar-primary-foreground);
  --rc-scheme-sidebar-accent: var(--sidebar-accent); --rc-scheme-sidebar-accent-foreground: var(--sidebar-accent-foreground); --rc-scheme-sidebar-border: var(--sidebar-border); --rc-scheme-sidebar-ring: var(--sidebar-ring);
  --rc-scheme-sidebar-hover: var(--rc-sidebar-hover); --rc-scheme-sidebar-hover-ink: var(--rc-sidebar-hover-ink); --rc-scheme-sidebar-ink-2: var(--rc-sidebar-ink-2); --rc-scheme-sidebar-ink-3: var(--rc-sidebar-ink-3);
  --rc-scheme-sidebar-icon: var(--rc-sidebar-icon); --rc-scheme-topbar-text: var(--rc-topbar-text); --rc-scheme-topbar-ink: var(--rc-topbar-ink); --rc-scheme-topbar-ink-2: var(--rc-topbar-ink-2);
  --rc-scheme-topbar-ink-3: var(--rc-topbar-ink-3); --rc-scheme-topbar-control: var(--rc-topbar-control); --rc-scheme-topbar-control-hover: var(--rc-topbar-control-hover); --rc-scheme-topbar-border: var(--rc-topbar-border);
  --rc-scheme-topbar-focus: var(--rc-topbar-focus); --rc-scheme-topbar-accent: var(--rc-topbar-accent); --rc-scheme-topbar-accent-hover: var(--rc-topbar-accent-hover); --rc-scheme-code-string: var(--rc-code-string);
  --rc-scheme-code-number: var(--rc-code-number); --rc-scheme-code-keyword: var(--rc-code-keyword); --rc-scheme-code-variable: var(--rc-code-variable); --rc-scheme-card-edge: var(--rc-card-edge);
  --rc-scheme-card-shadow: var(--rc-card-shadow); --rc-scheme-pop-shadow: var(--rc-pop-shadow); --rc-scheme-btn-shadow: var(--rc-btn-shadow); --rc-scheme-modal-shadow: var(--rc-modal-shadow);
  --rc-scheme-focus: var(--rc-focus); --rc-scheme-shadow: var(--rc-shadow); --rc-scheme-mix-ink: var(--rc-mix-ink);
}

/* rcm: the theme's own CSS, from src/styles/themes/rcm.css */
@scope ([data-rc-theme='rcm']) to ([data-rc-theme]:not([data-rc-theme='rcm'])) {
  /* The rcm theme's own CSS: the RCM admin's sizes, padding, weights and radii, set from outside the elements through
     their documented parts (::part) and custom properties, and through the hosts of the parts that are the box
     themselves (table cells, sidebar groups). scripts/gen-tokens.mjs puts it inside
       @scope ([data-rc-theme='rcm']) to ([data-rc-theme]:not([data-rc-theme='rcm'])) { ... }
     in foundation-themes.css, so it applies inside the rcm theme only (and not inside another theme nested in it), in
     light and dark alike. Colours come from the theme's tokens, so dark mode takes rcm's own dark colours.
     Measured on the admin's orders, products and settings screens (Nov 2026). */

  /* ---- small corners (labels, checkboxes): 2px; :scope is the [data-rc-theme='rcm'] element, so it inherits to
     everything in the theme ---- */
  :scope {
    --rc-radius-sm: 2px;
  }

  /* ---- buttons: Bootstrap 3 sizes (36px; sm 34, xs 32, lg 40), 13px / 400 text, 3px corners (sm, xs 2px) ---- */
  rc-button::part(control) {
    height: 36px;
    padding: 0 12px;
    font-size: 13px;
    line-height: 20px;
    font-weight: 400;
  }
  rc-button[size='sm']::part(control) {
    height: 34px;
    padding: 0 11px;
    font-size: 12px;
    border-radius: var(--rc-radius-sm);
  }
  rc-button[size='xs']::part(control) {
    height: 32px;
    padding: 0 10px;
    font-size: 12px;
    border-radius: var(--rc-radius-sm);
  }
  rc-button[size='lg']::part(control) {
    height: 40px;
    padding: 0 15px;
    font-size: 14px;
  }
  /* icon-only buttons stay square at the same heights */
  rc-button[size='icon']::part(control),
  rc-button:not([size])[icon]:empty::part(control),
  rc-button[size='default'][icon]:empty::part(control) {
    width: 36px;
    padding: 0;
  }
  rc-button[size='icon-sm']::part(control),
  rc-button[size='sm'][icon]:empty::part(control) {
    width: 34px;
    height: 34px;
    padding: 0;
  }
  rc-button[size='icon-xs']::part(control),
  rc-button[size='xs'][icon]:empty::part(control) {
    width: 32px;
    height: 32px;
    padding: 0;
  }
  rc-button[size='icon-lg']::part(control),
  rc-button[size='lg'][icon]:empty::part(control) {
    width: 40px;
    height: 40px;
    padding: 0;
  }
  /* the admin's default button: a light fill with a hairline (.btn-default) */
  /* icons in a filled button take the label colour, as the admin's do */
  rc-button:is(:not([variant]), [variant='default'], [variant='destructive'])::part(icon) {
    color: inherit;
  }

  /* ---- fields: 36px, 12px inside, 13px text ---- */
  :is(rc-input, rc-native-select, rc-select, rc-textarea)::part(box),
  :is(rc-combobox-input, rc-combobox-chips)::part(field),
  rc-input-group::part(group) {
    min-height: 36px;
    padding-inline-start: 12px;
  }
  rc-input::part(box) {
    padding-inline-end: 12px;
  }
  :is(rc-input, rc-native-select, rc-select)[size='sm']::part(box) {
    min-height: 34px;
  }
  :is(rc-input, rc-native-select, rc-select)[size='lg']::part(box) {
    min-height: 40px;
  }
  :is(rc-field-label, rc-label)::part(label) {
    font-weight: 400;
  }
  /* in the dark top bar a field's outline is the bar's own border (rc-app-bar re-maps --border, not --input) */
  rc-app-bar :is(rc-input, rc-native-select, rc-select, rc-textarea)::part(box),
  rc-app-bar :is(rc-combobox-input, rc-combobox-chips)::part(field) {
    box-shadow: 0 0 0 1px var(--border) inset;
  }
  rc-app-bar :is(rc-input, rc-native-select, rc-select, rc-textarea)::part(box):hover,
  rc-app-bar :is(rc-combobox-input, rc-combobox-chips)::part(field):hover {
    box-shadow: 0 0 0 1px var(--rc-ink-3) inset;
  }
  rc-app-bar :is(rc-input, rc-native-select, rc-select, rc-textarea)::part(box):focus-within,
  rc-app-bar :is(rc-combobox-input, rc-combobox-chips)::part(field):focus-within {
    box-shadow: 0 0 0 1px var(--rc-control-outline) inset, var(--rc-focus);
  }
  /* dark: a field sits a step darker than whatever is behind it (a card, the canvas, the top bar): black at 20% over
     it, from the shadow token (black in dark), so it needs no colour of its own and follows any container. Light keeps
     the admin's white fields. (.dark on an ancestor of the theme, on the theme element, or on a region inside it; a
     rule inside @scope is relative to the theme element unless it names :scope.) */
  :is(.dark :scope, :scope.dark, :scope .dark) :is(rc-input, rc-native-select, rc-select, rc-textarea)::part(box),
  :is(.dark :scope, :scope.dark, :scope .dark) :is(rc-combobox-input, rc-combobox-chips)::part(field),
  :is(.dark :scope, :scope.dark, :scope .dark) rc-input-group::part(group),
  :is(.dark :scope, :scope.dark, :scope .dark) rc-input-otp-slot::part(slot),
  :is(.dark :scope, :scope.dark, :scope .dark) :is(rc-date-picker, rc-date-range-picker)::part(trigger) {
    background: color-mix(in srgb, var(--rc-shadow) 20%, transparent);
  }

  /* ---- page title: the admin's page header heading (customers: 17px / 500, span.text-semibold in an h5; the orders
     screen's is 19px / 400). Roboto is loaded at 400 and 500 only, so the element's 700 drew a synthetic bold ---- */
  rc-page-title::part(title) {
    font-size: 17px;
    line-height: 24px;
    font-weight: 500;
    letter-spacing: normal;
  }

  /* ---- regular weight where the admin has no medium text: chips (the admin's plain table text) and segmented
     toggles (its buttons are 400) ---- */
  rc-chip::part(chip),
  rc-toggle-group-item::part(button) {
    font-weight: 400;
  }

  /* ---- panels: 20px inside, a 15px / 400 title ---- */
  rc-card:not([nested], [variant]) {
    --rc-card-padding-block: 20px;
    --rc-card-padding-inline: 20px;
  }
  rc-card-title::part(title) {
    font-size: 15px;
    line-height: 23px;
    font-weight: 400;
  }

  /* ---- dialogs: square corners, a 17px / 400 title ---- */
  :is(rc-dialog-content, rc-alert-dialog-content)::part(dialog) {
    border-radius: 0;
  }
  rc-dialog-title::part(title) {
    font-size: 17px;
    line-height: 26px;
    font-weight: 400;
  }

  /* ---- tables: the admin's 44px rows (12px above and below; the sides keep the elements' own padding, which narrows
     with a narrow column, so labels fit wherever they do in the default theme), a 13px / 500 head in the ink on no fill
     over a stronger rule. A sortable or menu head pads its button, not itself, so the vertical padding goes there. ---- */
  rc-table {
    --rc-table-head-bg: transparent;
  }
  rc-table-head {
    font-size: 13px;
    line-height: 20px;
    font-weight: 500;
    color: var(--foreground);
    border-bottom-color: var(--rc-border-strong);
  }
  /* the grid layout only: in the narrow list layout the cells lay themselves out (the table's own container query) */
  @container rc-table (min-width: 560px) {
    rc-table-head:not([sortable], :state(menu)) {
      padding-block: 12px;
    }
    rc-table-head::part(button) {
      padding-block: 12px;
    }
    rc-table-cell {
      padding-block: 12px;
    }
  }

  /* ---- badges: the admin's labels, a solid fill with white 10px / 500 uppercase text ---- */
  rc-badge::part(badge) {
    height: auto;
    padding: 2px 5px 1px;
    border: 1px solid transparent;
    border-radius: var(--rc-radius-sm);
    font-size: 10px;
    line-height: 15px;
    font-weight: 500;
    text-transform: uppercase;
  }
  /* the default badge is the admin's primary label (.label-primary, the primary blue); neutral its grey .label-default */
  rc-badge:is(:not([tone]), [tone='default']) {
    --rc-badge-bg: var(--primary);
    --rc-badge-ink: var(--primary-foreground);
  }
  rc-badge[tone='neutral'] {
    --rc-badge-bg: var(--rc-ink-4); /* the admin's #999 label (light), a light blue-grey (dark) */
    --rc-badge-ink: var(--primary-foreground);
  }
  rc-badge[tone='success'] {
    --rc-badge-bg: var(--rc-good-icon);
    --rc-badge-ink: var(--primary-foreground);
  }
  rc-badge[tone='critical'] {
    --rc-badge-bg: var(--rc-bad-icon);
    --rc-badge-ink: var(--primary-foreground);
  }
  rc-badge[tone='warning'] {
    --rc-badge-bg: var(--rc-warn-icon);
    --rc-badge-ink: var(--primary-foreground);
  }
  rc-badge[tone='info'] {
    --rc-badge-bg: var(--rc-info-icon);
    --rc-badge-ink: var(--primary-foreground);
  }

  /* ---- tabs: the admin's Bootstrap line tabs (.nav-tabs): a 1px rule under the strip; tabs 9px 15px in grey text with
     no fill; the selected tab white with a hairline on three sides, open at the bottom onto the content. Every tab
     strip, whatever its variant. ---- */
  rc-tabs-list::part(bar) {
    border-bottom: 0;
  }
  rc-tabs-list::part(list) {
    gap: 0;
    padding: 0;
    min-width: 100%;
    background: none;
    border-radius: 0;
    box-shadow: inset 0 -1px 0 var(--border);
  }
  rc-tabs-trigger {
    height: auto;
    padding: 9px 15px;
    border: 1px solid transparent;
    border-radius: 0;
    background: none;
    box-shadow: none;
    color: var(--rc-ink-3);
    font-weight: 400;
  }
  rc-tabs-trigger:hover {
    background: none;
    color: var(--foreground);
  }
  rc-tabs-trigger:state(selected) {
    background: var(--card);
    border-color: var(--border) var(--border) transparent;
    box-shadow: none;
    color: var(--foreground);
  }
  rc-tabs-trigger:focus-visible {
    box-shadow: var(--rc-focus);
  }

  /* ---- calendars: the range band one step darker than the surface (the default's --accent is too close to rcm's white
     card and #f5f5f5 canvas to read; the admin's own band is #f5f5f5) ---- */
  rc-calendar,
  rc-date-picker,
  rc-date-range-picker {
    --rc-calendar-band: var(--rc-pressed);
  }

  /* ---- links: regular weight ---- */
  rc-link {
    --rc-link-weight: 400;
  }

  /* ---- the sidebar: full-bleed square rows, 44px (sub-items 40px, indented), 13px / 500 (sub-items 400) ---- */
  :is(rc-sidebar-header, rc-sidebar-footer, rc-sidebar-group) {
    padding-inline: 0;
  }
  rc-sidebar-menu {
    gap: 0;
  }
  rc-sidebar-group-label {
    padding-inline: 20px;
    text-transform: uppercase;
    font-weight: 400; /* .navigation-header */
  }
  /* the badge and action at the end of a menu row, centred on the 44px row (the elements place them for 32px) */
  rc-sidebar-menu-badge,
  rc-sidebar-menu-action {
    top: 12px;
  }
  rc-sidebar-menu-button::part(button) {
    height: 44px;
    padding-inline: 20px;
    border-radius: 0;
    font-weight: 500;
  }
  rc-sidebar-menu-button[is-active]::part(button) {
    box-shadow: none;
  }
  rc-sidebar-menu-button::part(button):focus-visible {
    box-shadow: var(--rc-focus);
  }
  rc-sidebar-menu-sub {
    gap: 0;
    margin-inline: 0;
    padding: 0;
    border-inline-start: 0;
    background: color-mix(in srgb, var(--rc-shadow) 15%, transparent);
  }
  rc-sidebar-menu-sub-button::part(button) {
    height: 40px;
    padding-inline: 51px 20px;
    border-radius: 0;
    font-size: 13px;
    font-weight: 400;
  }
}