@sableui/react 0.0.0-stage → 0.1.1

package/dist/themes/ember/ember.css

@@ -0,0 +1,270 @@
+/* ==========================================================================
+   Ember — a Sable theme, developed from reference analysis.
+
+   Components must reference the SEMANTIC tokens (--background, --primary,
+   --tone-edition, …), never any palette ramp directly. See themes/_contract.ts.
+   ========================================================================== */
+
+/* Scoped only — never a bare `:root`. Base alone owns `:root` as the
+   package default; a second theme claiming it leaks its tokens into every other
+   theme, and `themes.test.ts` fails the build on it. */
+[data-sable-theme="ember"] {
+	/* Font stacks (theme-internal; host app provides the actual font files).
+
+	   The reference's observed face is Helvetica Neue — a Linotype commercial
+	   font, NOT available on Google Fonts. (The resolver claims otherwise:
+	   Google's API answers for it via the restricted `/l/font?kit=` endpoint,
+	   which is not an open licence.)
+
+	   Rather than substitute a neutral lookalike, this theme takes a DELIBERATE
+	   DIVERGENCE: Work Sans, chosen for a little warmth without commentary. It
+	   keeps the reference's grotesque bones and its wide, even rhythm at display
+	   size, while its slightly humanist details stop the page reading as
+	   anonymous the way a pure neutral does. It carries a genuine 300 weight,
+	   which the whole theme depends on.
+
+	   Space Grotesk was tried first and pulled back from: its technical, quirky
+	   letterforms competed with the registration chrome rather than supporting
+	   it — two things talking at once on a page that is already maximal in
+	   colour.
+
+	   Helvetica Neue is deliberately NOT first in the stack: leading with it
+	   would mean anyone who licenses it silently gets a different design than
+	   the one that was chosen. */
+	--font-sans: "Work Sans", sans-serif;
+	--font-mono: "DM Mono", ui-monospace, monospace;
+
+	/* Layout foundation — px, never rem. These MUST be declared here even where
+	   a value equals Sable's default: `styles.css` unconditionally imports
+	   the original default theme's CSS, which declared these on a bare `:root`, so a theme that
+	   omits them silently inherits that theme's caps regardless of which
+	   `data-sable-theme` is active. Values from the reference's own measured
+	   container widths — 1280px grid inside an 80px page inset at 1440.
+
+	   rem here would be a bug, not a style choice: the responsive root is 14px
+	   on desktop, so `80rem` renders 1120px, not the 1280px it reads as. */
+	--page-inset: clamp(20px, 5.5vw, 80px);
+	--region-form: 480px;
+	--region-feed: 640px;
+	--region-content: 960px;
+	--region-wide: 1280px;
+	--region-full: 1536px;
+	--region-ultrawide: 1800px;
+
+	/* Theme foundation vars consumed by styles.css. */
+	--theme-radius-none: 0px;
+	--theme-radius-xs: 6px;
+	--theme-radius-sm: 10px;
+	--theme-radius-md: 12px;
+	--theme-radius-lg: 20px;
+	--theme-radius-xl: 28px;
+	--theme-radius-full: 9999px;
+
+	/* Type-scale foundation vars consumed by styles.css's paired text-* utilities. */
+	--type-display-4xl-weight: 300;
+	--type-display-4xl-leading: 0.92;
+	--type-display-4xl-tracking: -0.02em;
+	--type-display-3xl-size: 5.4286rem;
+	--type-display-3xl-weight: 300;
+	--type-display-3xl-leading: 0.95;
+	--type-display-3xl-tracking: -0.015em;
+	--type-display-2xl-size: 4.8571rem;
+	--type-display-2xl-weight: 300;
+	--type-display-2xl-leading: 1;
+	--type-display-2xl-tracking: -0.01em;
+	--type-display-xl-size: 3.7143rem;
+	--type-display-xl-weight: 300;
+	--type-display-xl-leading: 1.2;
+	--type-display-xl-tracking: -0.01em;
+	--type-display-lg-size: 2.8571rem;
+	--type-display-lg-weight: 300;
+	--type-display-lg-leading: 1.1;
+	--type-display-lg-tracking: -0.005em;
+	--type-heading-weight: 300;
+	--type-heading-1-size: 2.2857rem;
+	--type-heading-1-leading: 1.1;
+	--type-heading-1-tracking: -0.005em;
+	--type-heading-2-size: 1.7143rem;
+	--type-heading-2-leading: 1.1;
+	--type-heading-2-tracking: 0em;
+	--type-heading-3-size: 1.4286rem;
+	--type-heading-3-leading: 1.4;
+	--type-heading-3-tracking: 0em;
+	--type-heading-4-size: 1.2857rem;
+	--type-heading-4-leading: 1.4;
+	--type-heading-4-tracking: 0em;
+	--type-title-weight: 500;
+	--type-title-leading: 1.25;
+	--type-title-tracking: 0em;
+	--type-title-sm-tracking: 0em;
+
+	/* Overline/eyebrow foundation vars consumed by styles.css's text-overline utility. */
+	--type-overline-size: 0.7143rem;
+	--type-overline-weight: 500;
+	--type-overline-leading: 1;
+	--type-overline-tracking: 0.1em;
+	--type-overline-transform: uppercase;
+
+	/* ----------------------------------------------------------------------
+	   Palette ramps. Theme-internal — never used directly by components.
+	   ---------------------------------------------------------------------- */
+	/* ember */
+	--ember-50: oklch(97% 0.02 32.9);
+	--ember-100: oklch(94% 0.045 32.9);
+	--ember-200: oklch(88% 0.08 32.9);
+	--ember-300: oklch(80% 0.13 32.9);
+	--ember-400: oklch(72% 0.19 32.9);
+	--ember-500: oklch(65.2% 0.235 32.9);
+	--ember-600: oklch(58% 0.245 32.9);
+	--ember-700: oklch(50% 0.21 32.9);
+	--ember-800: oklch(42% 0.17 32.9);
+	--ember-900: oklch(34% 0.13 32.9);
+	--ember-950: oklch(24% 0.09 32.9);
+
+	/* soot — one continuous warm neutral. Steps 50-500 were chroma 0 while
+	   600-950 were warm, so the ramp changed temperature halfway and light mode
+	   read as a different theme from dark mode. */
+	--soot-50: oklch(97% 0.005 80);
+	--soot-100: oklch(93.1% 0.007 78);
+	--soot-200: oklch(85.8% 0.008 76);
+	--soot-300: oklch(79.2% 0.010 74);
+	--soot-400: oklch(61% 0.010 72);
+	--soot-500: oklch(46.8% 0.010 70);
+	--soot-600: oklch(32.9% 0.010 61.1);
+	--soot-700: oklch(25.2% 0.012 67.2);
+	--soot-800: oklch(18.8% 0.013 55.5);
+	/* Warm, like every step around it. This was `oklch(15.9% 0 90)` — chroma 0,
+	   a neutral grey punched into an otherwise warm ramp — and because it feeds
+	   `--sidebar` and `--secondary` in dark mode, the docs rail read as a cold
+	   panel floating on a warm ground. The chroma/hue here are interpolated
+	   between its neighbours (950 at 0.018/70.5, 800 at 0.013/55.5); the
+	   lightness is untouched, so only the temperature changed. */
+	--soot-900: oklch(15.9% 0.016 65);
+	--soot-950: oklch(14.1% 0.018 70.5);
+
+	/* ----------------------------------------------------------------------
+	   Semantic tokens — light mode
+	   ---------------------------------------------------------------------- */
+	--background: oklch(96.5% 0.008 78);
+	--foreground: oklch(23.1% 0.014 70);
+	--card: oklch(99% 0.004 80);
+	--card-foreground: oklch(23.1% 0.014 70);
+	--popover: oklch(99% 0.004 80);
+	--popover-foreground: oklch(23.1% 0.014 70);
+	--muted: oklch(93% 0.007 76);
+	--muted-foreground: oklch(46.8% 0.010 70);
+	--border: oklch(88% 0.008 74);
+	--border-strong: oklch(82% 0.010 73);
+	--input: oklch(85% 0.009 74);
+	--ring: oklch(58% 0.245 32.9);
+	--primary: oklch(58% 0.245 32.9);
+	--primary-foreground: oklch(100% 0 0);
+	--secondary: oklch(91% 0.010 75);
+	--secondary-foreground: oklch(23.1% 0.014 70);
+	--accent: oklch(92% 0.011 74);
+	--accent-foreground: oklch(23.1% 0.014 70);
+	--destructive: oklch(50% 0.17 25);
+	--destructive-foreground: oklch(100% 0 0);
+	--success: oklch(43% 0.10 165);
+	--success-foreground: oklch(100% 0 0);
+	--tone-standard: oklch(40% 0.07 130);
+	--tone-collectible: oklch(46% 0.14 285);
+	--tone-edition: oklch(45% 0.15 309);
+	--tone-info: oklch(48% 0.13 250);
+	--tone-warning: oklch(50% 0.12 52);
+	--highlight: oklch(58% 0.245 32.9);
+	--tone-standard-foreground: oklch(100% 0 0);
+	--tone-collectible-foreground: oklch(100% 0 0);
+	--tone-edition-foreground: oklch(100% 0 0);
+	--tone-info-foreground: oklch(100% 0 0);
+	--tone-warning-foreground: oklch(100% 0 0);
+	--highlight-foreground: oklch(100% 0 0);
+	--overlay: oklch(14.1% 0.018 70.5);
+	--overlay-foreground: oklch(100% 0 0);
+	--sidebar: oklch(96.5% 0.008 78);
+	--sidebar-foreground: oklch(23.1% 0.014 70);
+	--sidebar-primary: oklch(58% 0.245 32.9);
+	--sidebar-primary-foreground: oklch(100% 0 0);
+	--sidebar-accent: oklch(93% 0.007 76);
+	--sidebar-accent-foreground: oklch(23.1% 0.014 70);
+	--sidebar-border: oklch(88% 0.008 74);
+	--sidebar-ring: oklch(58% 0.245 32.9);
+
+	/* ----------------------------------------------------------------------
+	   Motion tokens (mode-independent)
+	   ---------------------------------------------------------------------- */
+	--motion-scale: 1;
+	--motion-duration-instant: calc(100ms * var(--motion-scale));
+	--motion-duration-fast: calc(200ms * var(--motion-scale));
+	--motion-duration-base: calc(300ms * var(--motion-scale));
+	--motion-duration-slow: calc(400ms * var(--motion-scale));
+	--motion-duration-slower: calc(650ms * var(--motion-scale));
+	--motion-duration-enter: calc(400ms * var(--motion-scale));
+	--motion-duration-exit: calc(200ms * var(--motion-scale));
+	--motion-ease-standard: cubic-bezier(0.6, 0, 0.3, 1);
+	--motion-ease-decelerate: cubic-bezier(0.16, 1, 0.3, 1);
+	--motion-ease-emphasized: cubic-bezier(0.785, 0.135, 0.15, 0.86);
+	--motion-ease-spring: cubic-bezier(0.34, 1.35, 0.5, 1);
+	--motion-ease-bounce: cubic-bezier(0.34, 1.56, 0.64, 1);
+	--motion-ease-linear: linear;
+}
+
+/* ==========================================================================
+   Semantic tokens — dark mode
+   ========================================================================== */
+/* Scoped only — a bare `.dark` in this group leaks Ember's dark tokens into
+   every other theme's dark mode. That is a shipped bug the registry test now
+   pins, and the generator emitted it here again. */
+.dark[data-sable-theme="ember"],
+[data-sable-theme="ember"].dark,
+/* A dark island inside a light page: an inspector, a dark sidebar, a dark
+   hero. Without this arm, a nested .dark kept the light tokens. */
+[data-sable-theme="ember"] .dark,
+/* …and the reverse: a preset-scoped subtree inside a dark page follows the page
+   into dark mode. Add `.light` to the subtree to pin it light. */
+.dark [data-sable-theme="ember"]:not(.light) {
+	--background: oklch(14.1% 0.018 70.5);
+	--foreground: oklch(100% 0 0);
+	--card: oklch(21% 0.013 55.5);
+	--card-foreground: oklch(100% 0 0);
+	--popover: oklch(24.5% 0.013 57);
+	--popover-foreground: oklch(100% 0 0);
+	--muted: oklch(27% 0.010 60); /* above --popover: a hover row or chip inside a menu/dialog must still read */
+	--muted-foreground: oklch(66% 0.006 67.7);
+	--border: oklch(32% 0.012 67.2); /* lifted with the fills: a hairline must still show on muted */
+	--border-strong: oklch(37% 0.010 61.1);
+	--input: oklch(33% 0.012 65);
+	--ring: oklch(65.2% 0.235 32.9);
+	--primary: oklch(65.2% 0.235 32.9);
+	--primary-foreground: oklch(14.1% 0.018 70.5);
+	--secondary: oklch(26% 0.012 67.2); /* a step ABOVE the card, so a secondary Button reads on a card and on the page */
+	--secondary-foreground: oklch(100% 0 0);
+	--accent: oklch(29% 0.014 60);
+	--accent-foreground: oklch(100% 0 0);
+	--destructive: oklch(62% 0.16 25);
+	--destructive-foreground: oklch(14.1% 0.018 70.5);
+	--success: oklch(72% 0.12 165);
+	--success-foreground: oklch(14.1% 0.018 70.5);
+	--tone-standard: oklch(70% 0.09 130);
+	--tone-collectible: oklch(70% 0.12 285);
+	--tone-edition: oklch(68% 0.14 309);
+	--tone-info: oklch(72% 0.11 250);
+	--tone-warning: oklch(78% 0.13 60);
+	--highlight: oklch(65.2% 0.235 32.9);
+	--tone-standard-foreground: oklch(14.1% 0.018 70.5);
+	--tone-collectible-foreground: oklch(14.1% 0.018 70.5);
+	--tone-edition-foreground: oklch(14.1% 0.018 70.5);
+	--tone-info-foreground: oklch(14.1% 0.018 70.5);
+	--tone-warning-foreground: oklch(14.1% 0.018 70.5);
+	--highlight-foreground: oklch(14.1% 0.018 70.5);
+	--overlay: oklch(14.1% 0.018 70.5);
+	--overlay-foreground: oklch(100% 0 0);
+	--sidebar: oklch(15.9% 0.016 65);
+	--sidebar-foreground: oklch(100% 0 0);
+	--sidebar-primary: oklch(65.2% 0.235 32.9);
+	--sidebar-primary-foreground: oklch(14.1% 0.018 70.5);
+	--sidebar-accent: oklch(22% 0.010 60);
+	--sidebar-accent-foreground: oklch(100% 0 0);
+	--sidebar-border: oklch(25.2% 0.012 67.2);
+	--sidebar-ring: oklch(65.2% 0.235 32.9);
+}

package/dist/themes/ember/index.d.ts

@@ -0,0 +1,9 @@
+import { T as ThemeManifest } from '../../_contract-CYScOdf5.js';
+
+/**
+ * Ember — a Sable theme. Concrete token values live in
+ * `ember.css`; this manifest is the typed, machine-readable description.
+ */
+declare const emberTheme: ThemeManifest;
+
+export { emberTheme as default, emberTheme };

package/dist/themes/ember/index.js

@@ -0,0 +1 @@
+export { ember_default as default, emberTheme } from '../../chunk-L4IEIQQA.js';

package/dist/themes/index.d.ts

@@ -0,0 +1,10 @@
+export { A as AnyThemeId, D as DEFAULT_THEME_ID, S as SABLE_COLOR_STORAGE_KEY, a as SABLE_THEME_ATTRIBUTE, b as SABLE_THEME_STORAGE_KEY, c as SableColorMode, d as SableThemeContextValue, e as SableThemePreference, f as SableThemeProvider, g as SableThemeProviderProps, T as ThemeId, h as applySableColorMode, i as applySableTheme, j as buildThemeManifestById, k as defaultThemeId, l as featuredThemeManifests, m as getThemeManifest, n as isKnownThemeId, o as isThemeId, t as themeIds, p as themeManifestById, q as themeManifests, u as useSableTheme } from '../theme-provider-BWcizhAt.js';
+export { atelierTheme } from './atelier/index.js';
+export { baseTheme } from './base/index.js';
+export { default as emberTheme } from './ember/index.js';
+export { default as meridianTheme } from './meridian/index.js';
+export { default as poppyTheme } from './poppy/index.js';
+export { default as prismTheme } from './prism/index.js';
+export { default as verdantTheme } from './verdant/index.js';
+import 'react';
+import '../_contract-CYScOdf5.js';

package/dist/themes/index.js

@@ -0,0 +1,8 @@
+export { DEFAULT_THEME_ID, SABLE_COLOR_STORAGE_KEY, SABLE_THEME_ATTRIBUTE, SABLE_THEME_STORAGE_KEY, SableThemeProvider, applySableColorMode, applySableTheme, buildThemeManifestById, defaultThemeId, featuredThemeManifests, getThemeManifest, isKnownThemeId, isThemeId, themeIds, themeManifestById, themeManifests, useSableTheme } from '../chunk-L6Y46C62.js';
+export { verdantTheme } from '../chunk-KO3NAEBF.js';
+export { emberTheme } from '../chunk-L4IEIQQA.js';
+export { baseTheme } from '../chunk-EP55KSYA.js';
+export { poppyTheme } from '../chunk-ADLLDWLW.js';
+export { meridianTheme } from '../chunk-K7RUHUGC.js';
+export { atelierTheme } from '../chunk-YXBOYWBN.js';
+export { prismTheme } from '../chunk-7MG4SHYX.js';

package/dist/themes/meridian/index.d.ts

@@ -0,0 +1,9 @@
+import { T as ThemeManifest } from '../../_contract-CYScOdf5.js';
+
+/**
+ * Meridian — a Sable theme. Concrete token values live in
+ * `meridian.css`; this manifest is the typed, machine-readable description.
+ */
+declare const meridianTheme: ThemeManifest;
+
+export { meridianTheme as default, meridianTheme };

package/dist/themes/meridian/index.js

@@ -0,0 +1 @@
+export { meridian_default as default, meridianTheme } from '../../chunk-K7RUHUGC.js';

package/dist/themes/meridian/meridian.css

@@ -0,0 +1,255 @@
+/* ==========================================================================
+   Meridian — a Sable theme, developed from reference analysis.
+
+   Components must reference the SEMANTIC tokens (--background, --primary,
+   --tone-edition, …), never any palette ramp directly. See themes/_contract.ts.
+   ========================================================================== */
+
+/* Scoped to [data-sable-theme="meridian"]; no bare :root fallback (base owns the default). */
+[data-sable-theme="meridian"] {
+	/* Font stacks (theme-internal; host app provides the actual font files) */
+	--font-sans: "Instrument Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
+	--font-mono: "Geist Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Courier New", monospace;
+
+	/*
+	 * Region/page-inset foundation vars, explicitly declared per the Sable theme
+	 * plugin's theme contract (self-containment: never rely on another theme's bare
+	 * :root fallback in styles.css). Reference measured NO max-width cap anywhere
+	 * (full-bleed default, uniform 48px side padding at 1440w -> 48/1440 = 3.33vw,
+	 * fluid floor derived); region caps are Sable's standard ladder, labeled
+	 * derived — "no capped section observed in reference." Full-bleed sections in
+	 * builds use Region `bleed`, never max="full".
+	 */
+	--page-inset: clamp(20px, 3.4vw, 48px);
+	--region-form: 480px;
+	--region-feed: 640px;
+	--region-content: 896px;
+	--region-wide: 1280px;
+	--region-full: 1536px;
+	--region-ultrawide: 1800px;
+
+	/* Elevation does not exist in this language: zero box-shadows observed
+	   anywhere on the reference — separation is surface-mode swaps + 1px
+	   hairlines. Flatten the whole shadow ladder. */
+	--theme-shadow-2xs: 0 0 #0000;
+	--theme-shadow-xs: 0 0 #0000;
+	--theme-shadow-sm: 0 0 #0000;
+	--theme-shadow-md: 0 0 #0000;
+	--theme-shadow-lg: 0 0 #0000;
+	--theme-shadow-xl: 0 0 #0000;
+	--theme-shadow-2xl: 0 0 #0000;
+
+	/* Theme foundation vars consumed by styles.css. */
+	--theme-radius-none: 0px;
+	--theme-radius-xs: 0px;
+	--theme-radius-sm: 0px;
+	--theme-radius-md: 0px;
+	--theme-radius-lg: 0px;
+	--theme-radius-xl: 0px;
+	--theme-radius-full: 9999px;
+	/* Buttons follow the preset's square geometry in both density registers. */
+	--theme-button-radius: 0px;
+	--button-radius: var(--theme-button-radius);
+
+	/* Type-scale foundation vars consumed by styles.css's paired text-* utilities. */
+	--type-display-4xl-weight: 400;
+	--type-display-4xl-leading: 0.85;
+	--type-display-4xl-tracking: -0.033em;
+	--type-display-3xl-size: 5.7143rem /* 80px at the 14px desktop root */;
+	--type-display-3xl-weight: 400;
+	--type-display-3xl-leading: 1;
+	--type-display-3xl-tracking: -0.05em;
+	--type-display-2xl-size: 4.5714rem /* 64px at the 14px desktop root */;
+	--type-display-2xl-weight: 400;
+	--type-display-2xl-leading: 1;
+	--type-display-2xl-tracking: -0.045em;
+	--type-display-xl-size: 3.7143rem /* 52px at the 14px desktop root */;
+	--type-display-xl-weight: 400;
+	--type-display-xl-leading: 1.05;
+	--type-display-xl-tracking: -0.04em;
+	--type-display-lg-size: 2.8571rem /* 40px at the 14px desktop root */;
+	--type-display-lg-weight: 400;
+	--type-display-lg-leading: 1.1;
+	--type-display-lg-tracking: -0.02em;
+	--type-heading-weight: 400;
+	--type-heading-1-size: 2.2857rem /* 32px at the 14px desktop root */;
+	--type-heading-1-leading: 1.1;
+	--type-heading-1-tracking: -0.015em;
+	--type-heading-2-size: 1.7143rem /* 24px at the 14px desktop root */;
+	--type-heading-2-leading: 1.1;
+	--type-heading-2-tracking: -0.008em;
+	--type-heading-3-size: 1.4286rem /* 20px at the 14px desktop root */;
+	--type-heading-3-leading: 1.2;
+	--type-heading-3-tracking: -0.01em;
+	--type-heading-4-size: 1.2857rem /* 18px at the 14px desktop root */;
+	--type-heading-4-leading: 1.25;
+	--type-heading-4-tracking: -0.015em;
+	--type-title-weight: 400;
+	--type-title-leading: 1.2;
+	--type-title-tracking: -0.02em;
+	--type-title-sm-tracking: -0.033em;
+
+	/* Overline/eyebrow foundation vars consumed by styles.css's text-overline utility. */
+	--type-overline-size: 0.9286rem /* 13px at the 14px desktop root */;
+	--type-overline-weight: 400;
+	--type-overline-leading: 1.2;
+	--type-overline-tracking: 0.04em;
+	--type-overline-transform: uppercase;
+
+	/* ----------------------------------------------------------------------
+	   Palette ramps. Theme-internal — never used directly by components.
+	   ---------------------------------------------------------------------- */
+	/* meridian-ember */
+	--meridian-ember-50: oklch(97% 0.02 30);
+	--meridian-ember-100: oklch(93% 0.04 30);
+	--meridian-ember-200: oklch(87% 0.07 30);
+	--meridian-ember-300: oklch(79% 0.11 30);
+	--meridian-ember-400: oklch(70% 0.16 30);
+	--meridian-ember-500: oklch(63% 0.20 30);
+	--meridian-ember-600: oklch(56% 0.21 30);
+	--meridian-ember-700: oklch(48% 0.19 30);
+	--meridian-ember-800: oklch(40% 0.15 30);
+	--meridian-ember-900: oklch(30% 0.10 30);
+	--meridian-ember-950: oklch(22% 0.06 30);
+
+	/* ----------------------------------------------------------------------
+	   Semantic tokens — light mode
+	   ---------------------------------------------------------------------- */
+	--background: oklch(94.6% 0.0083 91.48);
+	--foreground: oklch(26.25% 0.0162 102.18);
+	--card: oklch(94.6% 0.0083 91.48);
+	--card-foreground: oklch(26.25% 0.0162 102.18);
+	--popover: oklch(94.6% 0.0083 91.48);
+	--popover-foreground: oklch(26.25% 0.0162 102.18);
+	--muted: oklch(91.24% 0.0138 92.99);
+	--muted-foreground: oklch(49.93% 0.0412 93.54);
+	--border: oklch(87.54% 0.0194 93.69);
+	--border-strong: oklch(81.94% 0.0252 94.12);
+	--input: oklch(87.54% 0.0194 93.69);
+	--ring: oklch(62% 0.2063 32.56);
+	--primary: oklch(26.25% 0.0162 102.18);
+	--primary-foreground: oklch(94.6% 0.0083 91.48);
+	--secondary: oklch(87.54% 0.0194 93.69);
+	--secondary-foreground: oklch(26.25% 0.0162 102.18);
+	/* One ember for selection and highlight, white ink, both modes. The observed
+	   orange (65% L) only passed WCAG 2 with DARK ink (4.84:1, but APCA Lc 40),
+	   and white on it failed WCAG 2 (3.43:1) while reading better (Lc 65) — the
+	   known WCAG 2 blind spot on saturated orange. A slightly deeper ember lets
+	   white pass both: ~4.6:1, Lc ~75. */
+	--accent: oklch(57.5% 0.2 31.5);
+	--accent-foreground: oklch(99% 0.004 91.5);
+	--destructive: oklch(48% 0.2 25);
+	--destructive-foreground: oklch(94.6% 0.0083 91.48);
+	--success: oklch(43% 0.1 165);
+	--success-foreground: oklch(94.6% 0.0083 91.48);
+	--tone-standard: oklch(40% 0.07 130);
+	--tone-collectible: oklch(46% 0.14 285);
+	--tone-edition: oklch(45% 0.15 309);
+	--tone-info: oklch(48% 0.13 250);
+	--tone-warning: oklch(50% 0.12 52);
+	--highlight: oklch(57.5% 0.2 31.5);
+	/* Ember as TEXT (eyebrow numbers, arrows). The fill ember carries white ink
+	   but is too light to be read as ink itself (4.1:1 on the sand); this is the
+	   same hue, deep enough for 5.2:1. A theme-local token: Meridian's art
+	   direction is the only one that sets its accent as type. */
+	--meridian-ember-ink: oklch(52% 0.19 31.5);
+	--tone-standard-foreground: oklch(94.6% 0.0083 91.48);
+	--tone-collectible-foreground: oklch(94.6% 0.0083 91.48);
+	--tone-edition-foreground: oklch(94.6% 0.0083 91.48);
+	--tone-info-foreground: oklch(94.6% 0.0083 91.48);
+	--tone-warning-foreground: oklch(94.6% 0.0083 91.48);
+	--highlight-foreground: oklch(99% 0.004 91.5);
+	--overlay: oklch(22.46% 0.0094 107.13);
+	--overlay-foreground: oklch(94.3% 0.0042 91.45);
+	--sidebar: oklch(22.46% 0.0094 107.13);
+	--sidebar-foreground: oklch(94.3% 0.0042 91.45);
+	--sidebar-primary: oklch(94.3% 0.0042 91.45);
+	--sidebar-primary-foreground: oklch(22.46% 0.0094 107.13);
+	--sidebar-accent: oklch(27.1% 0.0143 101.41);
+	--sidebar-accent-foreground: oklch(94.3% 0.0042 91.45);
+	--sidebar-border: oklch(27.1% 0.0143 101.41);
+	--sidebar-ring: oklch(65.11% 0.2063 32.56);
+
+	/* ----------------------------------------------------------------------
+	   Motion tokens (mode-independent)
+	   ---------------------------------------------------------------------- */
+	--motion-scale: 1;
+	--motion-duration-instant: calc(90ms * var(--motion-scale));
+	--motion-duration-fast: calc(160ms * var(--motion-scale));
+	--motion-duration-base: calc(240ms * var(--motion-scale));
+	--motion-duration-slow: calc(350ms * var(--motion-scale));
+	--motion-duration-slower: calc(600ms * var(--motion-scale));
+	--motion-duration-enter: var(--motion-duration-base);
+	--motion-duration-exit: var(--motion-duration-fast);
+	--motion-ease-standard: cubic-bezier(0.65, 0, 0.35, 1);
+	--motion-ease-decelerate: cubic-bezier(0, 0.5, 0.25, 1);
+	--motion-ease-emphasized: cubic-bezier(0.215, 0.61, 0.355, 1);
+	--motion-ease-spring: cubic-bezier(0, 0.5, 0.25, 1);
+	--motion-ease-bounce: cubic-bezier(0.34, 1.15, 0.64, 1);
+	--motion-ease-linear: linear;
+}
+
+/* ==========================================================================
+   Semantic tokens — dark mode
+   ========================================================================== */
+.dark[data-sable-theme="meridian"],
+[data-sable-theme="meridian"].dark,
+/* A dark island inside a light page: an inspector, a dark sidebar, a dark
+   hero. Without this arm, a nested .dark kept the light tokens. */
+[data-sable-theme="meridian"] .dark,
+/* …and the reverse: a preset-scoped subtree inside a dark page follows the page
+   into dark mode. Add `.light` to the subtree to pin it light. */
+.dark [data-sable-theme="meridian"]:not(.light) {
+	--background: oklch(22.46% 0.0094 107.13);
+	--foreground: oklch(94.3% 0.0042 91.45);
+	--card: oklch(27% 0.0109 107.15);
+	--card-foreground: oklch(94.3% 0.0042 91.45);
+	--popover: oklch(30% 0.0109 107.15);
+	--popover-foreground: oklch(94.3% 0.0042 91.45);
+	--muted: oklch(32% 0.0143 101.41);
+	--muted-foreground: oklch(70% 0 0);
+	/*
+	 * `border`/`input` were byte-identical to `--muted`, so a bordered control
+	 * sitting in a muted well had literally no border (1.00:1) and read at
+	 * 1.05:1 on `card` and `popover`. They now take the `border-strong` step —
+	 * the theme's own next value up, so the warm neutral band is unchanged and
+	 * only the edge separates. Caught by the non-text contrast gate.
+	 */
+	--border: oklch(34.69% 0.0186 98.75);
+	--border-strong: oklch(34.69% 0.0186 98.75);
+	--input: oklch(34.69% 0.0186 98.75);
+	--ring: oklch(65.11% 0.2063 32.56);
+	--primary: oklch(94.3% 0.0042 91.45);
+	--primary-foreground: oklch(22.46% 0.0094 107.13);
+	--secondary: oklch(31.54% 0.0139 101.29);
+	--secondary-foreground: oklch(94.3% 0.0042 91.45);
+	--accent: oklch(57.5% 0.2 31.5);
+	--accent-foreground: oklch(99% 0.004 91.5);
+	--destructive: oklch(66% 0.21 25);
+	--destructive-foreground: oklch(22.46% 0.0094 107.13);
+	--success: oklch(72% 0.12 165);
+	--success-foreground: oklch(22.46% 0.0094 107.13);
+	--tone-standard: oklch(70% 0.09 130);
+	--tone-collectible: oklch(70% 0.12 285);
+	--tone-edition: oklch(68% 0.14 309);
+	--tone-info: oklch(72% 0.11 250);
+	--tone-warning: oklch(78% 0.13 60);
+	--highlight: oklch(57.5% 0.2 31.5);
+	--meridian-ember-ink: oklch(72% 0.17 33); /* 6.4:1 on the dark ground */
+	--tone-standard-foreground: oklch(22.46% 0.0094 107.13);
+	--tone-collectible-foreground: oklch(22.46% 0.0094 107.13);
+	--tone-edition-foreground: oklch(22.46% 0.0094 107.13);
+	--tone-info-foreground: oklch(22.46% 0.0094 107.13);
+	--tone-warning-foreground: oklch(22.46% 0.0094 107.13);
+	--highlight-foreground: oklch(99% 0.004 91.5);
+	--overlay: oklch(22.46% 0.0094 107.13);
+	--overlay-foreground: oklch(94.3% 0.0042 91.45);
+	--sidebar: oklch(22.46% 0.0094 107.13);
+	--sidebar-foreground: oklch(94.3% 0.0042 91.45);
+	--sidebar-primary: oklch(94.3% 0.0042 91.45);
+	--sidebar-primary-foreground: oklch(22.46% 0.0094 107.13);
+	--sidebar-accent: oklch(27.1% 0.0143 101.41);
+	--sidebar-accent-foreground: oklch(94.3% 0.0042 91.45);
+	--sidebar-border: oklch(27.1% 0.0143 101.41);
+	--sidebar-ring: oklch(65.11% 0.2063 32.56);
+}

package/dist/themes/poppy/index.d.ts

@@ -0,0 +1,6 @@
+import { T as ThemeManifest } from '../../_contract-CYScOdf5.js';
+
+/** Original Sable preset; no third-party artwork or reference-site code. */
+declare const poppyTheme: ThemeManifest;
+
+export { poppyTheme as default, poppyTheme };

package/dist/themes/poppy/index.js

@@ -0,0 +1 @@
+export { poppy_default as default, poppyTheme } from '../../chunk-ADLLDWLW.js';