editor-shell 0.23.0 → 0.24.0

package/dist/{chunk-EZKBKK3E.js → chunk-VEXTYAMU.js}

@@ -22,7 +22,7 @@ var shellTokens = {
   previewBg: "#f3f4f6",
   /** `--es-panel` — raised cards / panels. */
   panel: "#ffffff",
-  /** `--es-raised` — active seg / chip. */
+  /** `--es-raised` — a lifted surface. NOT the active chip since card 66302. */
   raised: "#ffffff",
   /** `--es-topbar-bg`. */
   topbarBg: "#ffffff",
@@ -205,5 +205,5 @@ var puckAzureRamp = {
 };
 
 export { puckAzureRamp, shellCssVars, shellTokens };
-//# sourceMappingURL=chunk-EZKBKK3E.js.map
-//# sourceMappingURL=chunk-EZKBKK3E.js.map
+//# sourceMappingURL=chunk-VEXTYAMU.js.map
+//# sourceMappingURL=chunk-VEXTYAMU.js.map

package/dist/chunk-VEXTYAMU.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/shell/tokens.ts"],"names":[],"mappings":"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","file":"chunk-VEXTYAMU.js","sourcesContent":["/**\n * Editor SHELL design tokens — the ONE source both editors' chrome converge on.\n *\n * Where `rail/tokens.ts` owns the slim icon-rail, this owns the rest of the\n * editor chrome theme: accent, surfaces, fields, text, lines, chips, named\n * chrome literals, danger/warning/success, radii, gap, shadows and font. Every\n * value bar one is taken verbatim from the storefront editor's `--sf-*` block\n * (`efficient-shop/components/storefront-editor.css`), the visual reference the\n * campaign designer (`--cd-*`) and the storefront's own TS mirror (`tk`) had\n * each re-copied. After card 66024 they all resolve to these values instead.\n * The one exception is `success`, which that block has no counterpart for; see\n * its own note below.\n *\n * Exposed BOTH ways, per the same value (mirrors the rail):\n *   - `shellTokens` — this JS object, for code that needs the numbers/colours\n *     (e.g. the storefront's `floating-editor/tokens.ts` inline-style mirror);\n *   - `shell.css` — the stylesheet, which declares the identical values as CSS\n *     custom properties on `.es-editor` (names listed in `shellCssVars`).\n *\n * Numeric fields are pixel magnitudes (unitless) so they compose in code; the\n * CSS applies the `px`. Both editing surfaces are LIGHT only (no dark mode), so\n * there is a single palette here — no dark counterpart.\n */\nexport const shellTokens = {\n  // ── Accent (react-os-shell blue) ──────────────────────────────────────────\n  /** `--es-accent` — blue-600. */\n  accent: '#2563eb',\n  /** `--es-accent-tint` — blue-50. */\n  accentTint: '#eff6ff',\n  /** `--es-accent-tint-strong` — blue-100. */\n  accentTintStrong: '#dbeafe',\n  /** `--es-accent-text` — blue-700. */\n  accentText: '#1d4ed8',\n  /** `--es-accent-ring` — focus ring wash. */\n  accentRing: 'rgba(37, 99, 235, 0.25)',\n  /** `--es-accent-shadow` — accent button shadow. */\n  accentShadow: 'rgba(37, 99, 235, 0.35)',\n  /** `--es-on-accent` — text/icon over the solid accent. */\n  onAccent: '#ffffff',\n\n  // ── Surfaces (cool gray ramp) ─────────────────────────────────────────────\n  /** `--es-app-bg` — gray-50, sunken canvas. */\n  appBg: '#f9fafb',\n  /** `--es-preview-bg` — gray-100, preview well. */\n  previewBg: '#f3f4f6',\n  /** `--es-panel` — raised cards / panels. */\n  panel: '#ffffff',\n  /** `--es-raised` — a lifted surface. NOT the active chip since card 66302. */\n  raised: '#ffffff',\n  /** `--es-topbar-bg`. */\n  topbarBg: '#ffffff',\n  /** `--es-frame-bg` — device \"paper\" behind the preview iframe. */\n  frameBg: '#ffffff',\n  /** `--es-hover` — gray-100 row / icon hover. */\n  hover: '#f3f4f6',\n  /** `--es-hatch` — 45° upload-slot texture. */\n  hatch: 'rgba(0, 0, 0, 0.018)',\n  /** `--es-addcard-veil` — add-section card hover wash. */\n  addcardVeil: 'rgba(248, 249, 250, 0.66)',\n\n  // ── Fields ────────────────────────────────────────────────────────────────\n  /** `--es-field-bg`. */\n  fieldBg: '#ffffff',\n  /** `--es-track-bg` — gray-100 segmented / search track. */\n  trackBg: '#f3f4f6',\n  /** `--es-input-border` — gray-300. */\n  inputBorder: '#d1d5db',\n  /** `--es-field-text` — gray-800. */\n  fieldText: '#1f2937',\n  /** `--es-field-placeholder` — gray-400. */\n  fieldPlaceholder: '#9ca3af',\n  /** `--es-knob` — toggle knob. */\n  knob: '#ffffff',\n\n  // ── Text ────────────────────────────────────────────────────────────────\n  /** `--es-text` — gray-900. */\n  text: '#111827',\n  /** `--es-text-strong` — gray-950 active labels. */\n  textStrong: '#030712',\n  /** `--es-text-secondary` — gray-700. */\n  textSecondary: '#374151',\n  /** `--es-muted` — gray-500. */\n  muted: '#6b7280',\n  /** `--es-icon` — gray-500 icon buttons. */\n  icon: '#6b7280',\n  /** `--es-disabled` — gray-400 disabled / faint glyphs. */\n  disabled: '#9ca3af',\n\n  // ── Lines / chips / buttons ──────────────────────────────────────────────\n  /** `--es-divider` — gray-200. */\n  divider: '#e5e7eb',\n  /** `--es-line` — gray-200 hairlines. */\n  line: '#e5e7eb',\n  /** `--es-btn-border` — gray-300. */\n  btnBorder: '#d1d5db',\n  /** `--es-btn-text` — gray-700. */\n  btnText: '#374151',\n  /** `--es-chip-bg` — gray-100. */\n  chipBg: '#f3f4f6',\n  /** `--es-chip-fg` — gray-500. */\n  chipFg: '#6b7280',\n\n  // ── Named chrome literals ─────────────────────────────────────────────────\n  /** `--es-brand-square` — gray-900 wordmark square. */\n  brandSquare: '#111827',\n  /** `--es-device-border` — gray-200 tablet/mobile frame. */\n  deviceBorder: '#e5e7eb',\n  /** `--es-toast-bg` — gray-900 dark chip / seam pill. */\n  toastBg: '#111827',\n  /** `--es-toggle-off` — gray-300 toggle track. */\n  toggleOff: '#d1d5db',\n  /** `--es-scrollbar` — gray-300. */\n  scrollbar: '#d1d5db',\n  /** `--es-scrollbar-hover` — gray-400. */\n  scrollbarHover: '#9ca3af',\n\n  // ── Danger / warning / success (shell red / amber / green) ────────────────\n  /** `--es-danger` — red-600. */\n  danger: '#dc2626',\n  /** `--es-danger-strong` — red-700. */\n  dangerStrong: '#b91c1c',\n  /** `--es-danger-tint` — red-50. */\n  dangerTint: '#fef2f2',\n  /** `--es-warning` — amber-700. */\n  warning: '#b45309',\n  /** `--es-preview-tint` — amber-100 \"Preview\" pill. */\n  previewTint: '#fef3c7',\n  /**\n   * `--es-success` — green-700. THE ONE VALUE HERE WITH NO `--sf-*` BEHIND IT:\n   * the storefront editor's block has a red and an amber and no green, and card\n   * 8802.g needs one for a green tick. So it is picked to sit with the block\n   * rather than invented next to it — the same Tailwind ramp every other colour\n   * in this file comes from, at the 700 step `--es-warning` already sits on.\n   * 700 and not 600 for the reason amber went there: it is the darkest step\n   * still plainly the hue, and it clears WCAG AA (5.0:1) on the shell's white\n   * panels, so a tick may carry a label without needing a second token.\n   */\n  success: '#15803d',\n\n  // ── Radii / shape / gap ───────────────────────────────────────────────────\n  /** `--es-panel-radius`. */\n  panelRadius: 12,\n  /** `--es-row-radius`. */\n  rowRadius: 8,\n  /** `--es-field-radius`. */\n  fieldRadius: 6,\n  /** `--es-panel-gap` — inter-pane gutter + outer frame padding, ONE token. */\n  panelGap: 10,\n\n  // ── Shadows ───────────────────────────────────────────────────────────────\n  /** `--es-panel-shadow`. */\n  panelShadow: '0 1px 2px rgba(0, 0, 0, 0.05), 0 10px 30px rgba(0, 0, 0, 0.06)',\n  /** `--es-topbar-shadow`. */\n  topbarShadow: '0 1px 3px rgba(0, 0, 0, 0.06)',\n  /**\n   * `--es-raised-shadow` — what a small surface sitting ON another one casts:\n   * the chip in the settings tab strip's track (card 66138). Tighter and darker\n   * than `panelShadow`, which is a whole panel floating over the app; this one\n   * has to read across 3px of track without looking like a second panel.\n   */\n  raisedShadow: '0 1px 2px rgba(16, 24, 40, 0.1)',\n\n  // ── Type ──────────────────────────────────────────────────────────────────\n  /** `--es-font` — system sans stack (also fed to `--puck-font-family`). */\n  font: '-apple-system, BlinkMacSystemFont, \"Segoe UI\", Helvetica, Arial, sans-serif',\n} as const;\n\nexport type ShellTokens = typeof shellTokens;\n\n/**\n * The CSS custom-property name behind each `shellTokens` key. `shell.css` sets\n * these on `.es-editor`; override any of them on (or above) the editor root to\n * re-theme without shipping new CSS. The `shell-tokens.test.ts` parity gate\n * proves this map, `shellTokens` and `shell.css` never drift apart.\n */\nexport const shellCssVars: Record<keyof ShellTokens, string> = {\n  accent: '--es-accent',\n  accentTint: '--es-accent-tint',\n  accentTintStrong: '--es-accent-tint-strong',\n  accentText: '--es-accent-text',\n  accentRing: '--es-accent-ring',\n  accentShadow: '--es-accent-shadow',\n  onAccent: '--es-on-accent',\n  appBg: '--es-app-bg',\n  previewBg: '--es-preview-bg',\n  panel: '--es-panel',\n  raised: '--es-raised',\n  topbarBg: '--es-topbar-bg',\n  frameBg: '--es-frame-bg',\n  hover: '--es-hover',\n  hatch: '--es-hatch',\n  addcardVeil: '--es-addcard-veil',\n  fieldBg: '--es-field-bg',\n  trackBg: '--es-track-bg',\n  inputBorder: '--es-input-border',\n  fieldText: '--es-field-text',\n  fieldPlaceholder: '--es-field-placeholder',\n  knob: '--es-knob',\n  text: '--es-text',\n  textStrong: '--es-text-strong',\n  textSecondary: '--es-text-secondary',\n  muted: '--es-muted',\n  icon: '--es-icon',\n  disabled: '--es-disabled',\n  divider: '--es-divider',\n  line: '--es-line',\n  btnBorder: '--es-btn-border',\n  btnText: '--es-btn-text',\n  chipBg: '--es-chip-bg',\n  chipFg: '--es-chip-fg',\n  brandSquare: '--es-brand-square',\n  deviceBorder: '--es-device-border',\n  toastBg: '--es-toast-bg',\n  toggleOff: '--es-toggle-off',\n  scrollbar: '--es-scrollbar',\n  scrollbarHover: '--es-scrollbar-hover',\n  danger: '--es-danger',\n  dangerStrong: '--es-danger-strong',\n  dangerTint: '--es-danger-tint',\n  warning: '--es-warning',\n  previewTint: '--es-preview-tint',\n  success: '--es-success',\n  panelRadius: '--es-panel-radius',\n  rowRadius: '--es-row-radius',\n  fieldRadius: '--es-field-radius',\n  panelGap: '--es-panel-gap',\n  panelShadow: '--es-panel-shadow',\n  topbarShadow: '--es-topbar-shadow',\n  raisedShadow: '--es-raised-shadow',\n  font: '--es-font',\n};\n\n/**\n * Puck's own accent ramp + font, re-tinted to the shell blue. Puck reads these\n * fixed variable names (`--puck-color-azure-NN`, `--puck-font-family`) directly,\n * so they are NOT part of the `--es-*` set — but they had been copied verbatim\n * into BOTH editors' CSS, so `shell.css` now declares them once on `.es-editor`.\n * Kept here as the JS record so the parity gate can prove `shell.css` matches.\n */\nexport const puckAzureRamp: Record<string, string> = {\n  '--puck-color-azure-01': '#172554',\n  '--puck-color-azure-02': '#1e3a8a',\n  '--puck-color-azure-03': '#1d4ed8',\n  '--puck-color-azure-04': '#2563eb',\n  '--puck-color-azure-05': '#3b82f6',\n  '--puck-color-azure-06': '#60a5fa',\n  '--puck-color-azure-07': '#93c5fd',\n  '--puck-color-azure-08': '#bfdbfe',\n  '--puck-color-azure-09': '#dbeafe',\n  '--puck-color-azure-10': '#eff6ff',\n  '--puck-color-azure-11': '#f5f9ff',\n  '--puck-color-azure-12': '#fafcff',\n};\n"]}

package/dist/index.js

@@ -1,5 +1,5 @@
 export { EditorRail, EditorRailButton, railCssVars, railTokens } from './chunk-HYOACICE.js';
 export { AddIcon, LayersIcon, MediaIcon, PageIcon as PagesIcon, SitemapIcon, StylesIcon } from './chunk-V7JPZX2L.js';
-export { puckAzureRamp, shellCssVars, shellTokens } from './chunk-EZKBKK3E.js';
+export { puckAzureRamp, shellCssVars, shellTokens } from './chunk-VEXTYAMU.js';
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/panel/index.d.ts

@@ -122,6 +122,71 @@ interface SettingsSegmentedFit {
  * not the words Normal / Uppercase / Lowercase that name them. Passing `title`
  * beside a WORDED label is allowed and overrides the word, which is what a
  * strip whose words are abbreviations wants.
+ *
+ * ── NO CONSUMER TODAY, AND CARRIED ON PURPOSE ────────────────────────────────
+ *
+ * Written down so the next reader does not find this unused and tidy it away.
+ * The rows above stopped needing it while this was being built: card 66246
+ * (`efficient-shop` 151afa212, merged 2026-08-31) moved the part panel's three
+ * tables onto `icon` + a real word — `{ id: "left", label: "Left", icon:
+ * <AlignLeftIcon/> }` — on the owner's ruling that an option says its name AND
+ * draws its glyph. Every `label` in the shop is now a string, and this arm has
+ * no caller anywhere. That is measured on merged main, not on a pending PR.
+ *
+ * It stays because it is the shape THE PACKAGE NEXT DOOR ALREADY USES.
+ * `react-os-shell` ships its own `Segmented`, and its `SegmentedOption` has
+ * carried `label: ReactNode` all along. Identical at the two copies installed on
+ * this desk — 4.63.0 under `editor-shell`, 4.67.0 under `efficient-shop`:
+ *
+ *     interface SegmentedOption<T extends string = string> {
+ *       value: T; label: ReactNode; icon?: ReactNode; disabled?: boolean;
+ *     }
+ *
+ * A shared control that refuses a shape its sibling accepts is a fork one level
+ * down, which is the fault this whole family of cards exists to stop. Matching
+ * it costs nothing while nothing calls it.
+ *
+ * ── WHERE THE TWO SHELLS CONVERGE, AND WHERE THEY DO NOT ─────────────────────
+ *
+ * Read this before repeating "the two shells are converged", because it is only
+ * true of three fields out of four, and the fourth is the one a caller touches
+ * most:
+ *
+ *                     react-os-shell          editor-shell
+ *     the label       label: ReactNode        label: ReactNode     converged
+ *     the glyph       icon?: ReactNode        icon?: ReactNode     converged
+ *     out of force    disabled?: boolean      disabled?: boolean   converged
+ *     ─────────────────────────────────────────────────────────────────────────
+ *     the VALUE       value: T                id: V                NOT converged
+ *                     T extends string        V unconstrained
+ *
+ * BOTH halves of that last row are deliberate.
+ *
+ * `id` and not `value`, because this field has been called `id` since the type
+ * existed and renaming it would move something for every caller already using
+ * it — which is the one thing card 66303 was not allowed to do.
+ *
+ * `V` UNCONSTRAINED and not `T extends string`, because the shop stores a
+ * choice as a boolean: `reverse` at `efficient-shop/lib/puck/config.tsx:6747` is
+ * `false` = image left and `true` = image right on every published page across
+ * every tenant. `T extends string` cannot hold it, and giving that row the house
+ * strip by storing "left"/"right" would be a migration of live customer data
+ * rather than a control change. So on the value type this package is the WIDER
+ * of the two, not the poorer — the opposite of the direction the rest of this
+ * note runs.
+ *
+ * ── AND WHERE WE DELIBERATELY GO FURTHER ─────────────────────────────────────
+ *
+ * That sibling declaration has NO name field beside its node label. A drawing
+ * that cannot name itself is exactly the defect the 2026-08-06 audit closed on
+ * the shop's strip, so the `title` here is REQUIRED — a guarantee, not a
+ * feature. The union makes a nameless drawing unconstructable rather than a
+ * documented risk; the sibling's shape permits one.
+ *
+ * One more thing that declaration settles, recorded because it was argued: its
+ * `disabled` is PER OPTION and it has no strip-level one at all. That is the
+ * independent support for the per-option field on
+ * `SettingsSegmentedOptionBase` — the sibling has shipped exactly that.
  */
 type SettingsSegmentedLabel = {
     label: string;

package/dist/panel/panel.css

@@ -254,28 +254,52 @@
   box-shadow: 0 0 0 3px var(--es-accent-ring);
 }
 
-/* THE CHOSEN TAB IS A RAISED CHIP — AND THIS REPLACES CARD 8811.
-
-   8811 gave the chosen tab a filled ground, `--es-accent-tint` rounded at the
-   top only, because colour alone stopped being enough once the strip could
-   reduce a tab to a 16px glyph. Lewis picked the softest of three weights he
-   was shown, and the rule carried a note asking the next reader not to tidy it
-   away for looking almost absent in the stylesheet. That note did its job — it
-   is why this replacement is written down instead of silent.
-
-   What changed is the QUESTION. 8811 marked the chosen tab; Lewis's complaint
-   here is about the other one, which a tint under the chosen tab cannot reach.
-   The segmented control answers it the other way round: the track makes every
-   segment look pressable, the chip says which one he is on. Both marks survive
-   at every width, which is the property 8811 was buying.
-
-   So the tint goes, the top-only corners go, and the 2px accent rule goes with
-   them. The chip is told apart by ELEVATION now — a lit rule under a raised
-   chip is a second answer to a question that already has one. */
+/* THE CHOSEN CHIP IS THE DARKEST THING IN THE ROW (card 66302).
+
+   IT WAS A RAISED WHITE CHIP, AND THAT WAS NOT A MISTAKE. Card 66138 put white
+   on the grey track with a soft lift, and Lewis picked that look himself from
+   six treatments. He picked it BY EYE, AT A WIDTH WHERE THE WORDS WERE STILL
+   THERE — which is the whole reason this is a revision and not a correction.
+
+   WHAT CHANGED IS THE CONDITION, TWICE.
+
+   First the words went. A four-tab strip is already wordless below 200px, and
+   the panel's drag band bottoms out at 181px, so that state is live in the
+   editor today; card 66246 then made the shop's Weight row show one word of
+   four at the DEFAULT panel and none at the narrow end. A chip that used to sit
+   beside a word became the only thing saying which option is set.
+
+   Then the second mark went, and nobody noticed. Card 66248 moved the strip
+   into this package and the quiet label darkened from the muted grey to
+   `--es-text-secondary`. That darkening is right on its own terms — it is card
+   66138's AA fix, 4.39:1 to 9.37:1 on the track — but it also cut the
+   chosen-vs-quiet GLYPH contrast from 3.67:1 to 1.72:1. The strip lost the one
+   state cue that was already above 3:1, and the change was described as
+   cosmetic when it merged.
+
+   So the raised white chip was left carrying the whole message alone, at
+   1.10:1 against its own track, where WCAG 1.4.11 asks 3:1 of anything
+   identifying a control's STATE.
+
+   WHY DARK AND NOT A RING. Four treatments were drawn and measured for Lewis;
+   two of the routes were closed by arithmetic before he saw them (darkening the
+   track drops the quiet label to 3.40:1 and fails AA; pushing the glyph delta
+   only reaches 3:1 by putting that label back where 66138 moved it FROM). Of
+   what was left, this is the one that survives the DISABLED state:
+   `.es-segs[data-disabled]` fades the strip to 0.5 over the panel, and a ring
+   at 4.39:1 composites down to 1.89:1 while this holds 3.24:1. A cue that only
+   works while the control is live is a cue with a hole in it.
+
+   ⚠️ THE LIFT STAYS, AND IT IS NO LONGER THE MESSAGE. `--es-raised-shadow`
+   still seats the chip on the track. What it must not go back to being is the
+   thing telling the two states apart — a shadow is not a colour, so no
+   contrast ratio can score it, and that is exactly how this got to 1.10:1
+   without any guard noticing. `tests/panel-chip-contrast.test.ts` pins the
+   RATIO and not this colour, so a better answer is free to replace it. */
 .es-tab.is-active,
 .es-seg.is-active {
-  background: var(--es-raised);
-  color: var(--es-text);
+  background: var(--es-text);
+  color: var(--es-on-accent);
   box-shadow: var(--es-raised-shadow);
   border-radius: 6px;
 }
@@ -552,8 +576,17 @@
 
 /* The chosen one stays the loudest thing on the track. It is still the
    merchant's answer — a pressed chip faded to the same grey as the ones beside
-   it stops saying which answer that was. */
-.es-seg:disabled.is-active { color: var(--es-text-secondary); }
+   it stops saying which answer that was.
+
+   ⚠️ THIS COLOUR BELONGS TO THE CHIP'S GROUND, NOT TO THE TRACK (card 66302).
+   It was `--es-text-secondary`, which was right while the chip was white:
+   10.31:1 on it. The moment the chip went dark that same rule drew
+   `--es-text-secondary` on `--es-text` — 1.72:1, an unreadable label on a
+   control that had just been made MORE visible. Nothing about the rule changed; what it sat on moved underneath
+   it. So it reads `--es-on-accent` for the same reason the enabled chip does,
+   and the strip says which option is out of force through the track's fade and
+   its quiet siblings rather than by dimming the one word still worth reading. */
+.es-seg:disabled.is-active { color: var(--es-on-accent); }
 
 /* And none of them answers the pointer any more: the hover rule above would
    otherwise keep lighting a segment that cannot be chosen. */

package/dist/shell/index.d.ts

@@ -42,7 +42,7 @@ declare const shellTokens: {
     readonly previewBg: "#f3f4f6";
     /** `--es-panel` — raised cards / panels. */
     readonly panel: "#ffffff";
-    /** `--es-raised` — active seg / chip. */
+    /** `--es-raised` — a lifted surface. NOT the active chip since card 66302. */
     readonly raised: "#ffffff";
     /** `--es-topbar-bg`. */
     readonly topbarBg: "#ffffff";

package/dist/shell/index.js

@@ -1,3 +1,3 @@
-export { puckAzureRamp, shellCssVars, shellTokens } from '../chunk-EZKBKK3E.js';
+export { puckAzureRamp, shellCssVars, shellTokens } from '../chunk-VEXTYAMU.js';
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "editor-shell",
-  "version": "0.23.0",
+  "version": "0.24.0",
   "description": "Shared editor-chrome primitives for the EFFICIENT editors: EditorRail (a Next-16-safe left icon-rail leaf), the shell token layer, and GoldTextInput — type in place and watch the markup formatting appear as you type.",
   "license": "MIT",
   "author": "Lewis Liu",

package/dist/chunk-EZKBKK3E.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/shell/tokens.ts"],"names":[],"mappings":"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","file":"chunk-EZKBKK3E.js","sourcesContent":["/**\n * Editor SHELL design tokens — the ONE source both editors' chrome converge on.\n *\n * Where `rail/tokens.ts` owns the slim icon-rail, this owns the rest of the\n * editor chrome theme: accent, surfaces, fields, text, lines, chips, named\n * chrome literals, danger/warning/success, radii, gap, shadows and font. Every\n * value bar one is taken verbatim from the storefront editor's `--sf-*` block\n * (`efficient-shop/components/storefront-editor.css`), the visual reference the\n * campaign designer (`--cd-*`) and the storefront's own TS mirror (`tk`) had\n * each re-copied. After card 66024 they all resolve to these values instead.\n * The one exception is `success`, which that block has no counterpart for; see\n * its own note below.\n *\n * Exposed BOTH ways, per the same value (mirrors the rail):\n *   - `shellTokens` — this JS object, for code that needs the numbers/colours\n *     (e.g. the storefront's `floating-editor/tokens.ts` inline-style mirror);\n *   - `shell.css` — the stylesheet, which declares the identical values as CSS\n *     custom properties on `.es-editor` (names listed in `shellCssVars`).\n *\n * Numeric fields are pixel magnitudes (unitless) so they compose in code; the\n * CSS applies the `px`. Both editing surfaces are LIGHT only (no dark mode), so\n * there is a single palette here — no dark counterpart.\n */\nexport const shellTokens = {\n  // ── Accent (react-os-shell blue) ──────────────────────────────────────────\n  /** `--es-accent` — blue-600. */\n  accent: '#2563eb',\n  /** `--es-accent-tint` — blue-50. */\n  accentTint: '#eff6ff',\n  /** `--es-accent-tint-strong` — blue-100. */\n  accentTintStrong: '#dbeafe',\n  /** `--es-accent-text` — blue-700. */\n  accentText: '#1d4ed8',\n  /** `--es-accent-ring` — focus ring wash. */\n  accentRing: 'rgba(37, 99, 235, 0.25)',\n  /** `--es-accent-shadow` — accent button shadow. */\n  accentShadow: 'rgba(37, 99, 235, 0.35)',\n  /** `--es-on-accent` — text/icon over the solid accent. */\n  onAccent: '#ffffff',\n\n  // ── Surfaces (cool gray ramp) ─────────────────────────────────────────────\n  /** `--es-app-bg` — gray-50, sunken canvas. */\n  appBg: '#f9fafb',\n  /** `--es-preview-bg` — gray-100, preview well. */\n  previewBg: '#f3f4f6',\n  /** `--es-panel` — raised cards / panels. */\n  panel: '#ffffff',\n  /** `--es-raised` — active seg / chip. */\n  raised: '#ffffff',\n  /** `--es-topbar-bg`. */\n  topbarBg: '#ffffff',\n  /** `--es-frame-bg` — device \"paper\" behind the preview iframe. */\n  frameBg: '#ffffff',\n  /** `--es-hover` — gray-100 row / icon hover. */\n  hover: '#f3f4f6',\n  /** `--es-hatch` — 45° upload-slot texture. */\n  hatch: 'rgba(0, 0, 0, 0.018)',\n  /** `--es-addcard-veil` — add-section card hover wash. */\n  addcardVeil: 'rgba(248, 249, 250, 0.66)',\n\n  // ── Fields ────────────────────────────────────────────────────────────────\n  /** `--es-field-bg`. */\n  fieldBg: '#ffffff',\n  /** `--es-track-bg` — gray-100 segmented / search track. */\n  trackBg: '#f3f4f6',\n  /** `--es-input-border` — gray-300. */\n  inputBorder: '#d1d5db',\n  /** `--es-field-text` — gray-800. */\n  fieldText: '#1f2937',\n  /** `--es-field-placeholder` — gray-400. */\n  fieldPlaceholder: '#9ca3af',\n  /** `--es-knob` — toggle knob. */\n  knob: '#ffffff',\n\n  // ── Text ────────────────────────────────────────────────────────────────\n  /** `--es-text` — gray-900. */\n  text: '#111827',\n  /** `--es-text-strong` — gray-950 active labels. */\n  textStrong: '#030712',\n  /** `--es-text-secondary` — gray-700. */\n  textSecondary: '#374151',\n  /** `--es-muted` — gray-500. */\n  muted: '#6b7280',\n  /** `--es-icon` — gray-500 icon buttons. */\n  icon: '#6b7280',\n  /** `--es-disabled` — gray-400 disabled / faint glyphs. */\n  disabled: '#9ca3af',\n\n  // ── Lines / chips / buttons ──────────────────────────────────────────────\n  /** `--es-divider` — gray-200. */\n  divider: '#e5e7eb',\n  /** `--es-line` — gray-200 hairlines. */\n  line: '#e5e7eb',\n  /** `--es-btn-border` — gray-300. */\n  btnBorder: '#d1d5db',\n  /** `--es-btn-text` — gray-700. */\n  btnText: '#374151',\n  /** `--es-chip-bg` — gray-100. */\n  chipBg: '#f3f4f6',\n  /** `--es-chip-fg` — gray-500. */\n  chipFg: '#6b7280',\n\n  // ── Named chrome literals ─────────────────────────────────────────────────\n  /** `--es-brand-square` — gray-900 wordmark square. */\n  brandSquare: '#111827',\n  /** `--es-device-border` — gray-200 tablet/mobile frame. */\n  deviceBorder: '#e5e7eb',\n  /** `--es-toast-bg` — gray-900 dark chip / seam pill. */\n  toastBg: '#111827',\n  /** `--es-toggle-off` — gray-300 toggle track. */\n  toggleOff: '#d1d5db',\n  /** `--es-scrollbar` — gray-300. */\n  scrollbar: '#d1d5db',\n  /** `--es-scrollbar-hover` — gray-400. */\n  scrollbarHover: '#9ca3af',\n\n  // ── Danger / warning / success (shell red / amber / green) ────────────────\n  /** `--es-danger` — red-600. */\n  danger: '#dc2626',\n  /** `--es-danger-strong` — red-700. */\n  dangerStrong: '#b91c1c',\n  /** `--es-danger-tint` — red-50. */\n  dangerTint: '#fef2f2',\n  /** `--es-warning` — amber-700. */\n  warning: '#b45309',\n  /** `--es-preview-tint` — amber-100 \"Preview\" pill. */\n  previewTint: '#fef3c7',\n  /**\n   * `--es-success` — green-700. THE ONE VALUE HERE WITH NO `--sf-*` BEHIND IT:\n   * the storefront editor's block has a red and an amber and no green, and card\n   * 8802.g needs one for a green tick. So it is picked to sit with the block\n   * rather than invented next to it — the same Tailwind ramp every other colour\n   * in this file comes from, at the 700 step `--es-warning` already sits on.\n   * 700 and not 600 for the reason amber went there: it is the darkest step\n   * still plainly the hue, and it clears WCAG AA (5.0:1) on the shell's white\n   * panels, so a tick may carry a label without needing a second token.\n   */\n  success: '#15803d',\n\n  // ── Radii / shape / gap ───────────────────────────────────────────────────\n  /** `--es-panel-radius`. */\n  panelRadius: 12,\n  /** `--es-row-radius`. */\n  rowRadius: 8,\n  /** `--es-field-radius`. */\n  fieldRadius: 6,\n  /** `--es-panel-gap` — inter-pane gutter + outer frame padding, ONE token. */\n  panelGap: 10,\n\n  // ── Shadows ───────────────────────────────────────────────────────────────\n  /** `--es-panel-shadow`. */\n  panelShadow: '0 1px 2px rgba(0, 0, 0, 0.05), 0 10px 30px rgba(0, 0, 0, 0.06)',\n  /** `--es-topbar-shadow`. */\n  topbarShadow: '0 1px 3px rgba(0, 0, 0, 0.06)',\n  /**\n   * `--es-raised-shadow` — what a small surface sitting ON another one casts:\n   * the chip in the settings tab strip's track (card 66138). Tighter and darker\n   * than `panelShadow`, which is a whole panel floating over the app; this one\n   * has to read across 3px of track without looking like a second panel.\n   */\n  raisedShadow: '0 1px 2px rgba(16, 24, 40, 0.1)',\n\n  // ── Type ──────────────────────────────────────────────────────────────────\n  /** `--es-font` — system sans stack (also fed to `--puck-font-family`). */\n  font: '-apple-system, BlinkMacSystemFont, \"Segoe UI\", Helvetica, Arial, sans-serif',\n} as const;\n\nexport type ShellTokens = typeof shellTokens;\n\n/**\n * The CSS custom-property name behind each `shellTokens` key. `shell.css` sets\n * these on `.es-editor`; override any of them on (or above) the editor root to\n * re-theme without shipping new CSS. The `shell-tokens.test.ts` parity gate\n * proves this map, `shellTokens` and `shell.css` never drift apart.\n */\nexport const shellCssVars: Record<keyof ShellTokens, string> = {\n  accent: '--es-accent',\n  accentTint: '--es-accent-tint',\n  accentTintStrong: '--es-accent-tint-strong',\n  accentText: '--es-accent-text',\n  accentRing: '--es-accent-ring',\n  accentShadow: '--es-accent-shadow',\n  onAccent: '--es-on-accent',\n  appBg: '--es-app-bg',\n  previewBg: '--es-preview-bg',\n  panel: '--es-panel',\n  raised: '--es-raised',\n  topbarBg: '--es-topbar-bg',\n  frameBg: '--es-frame-bg',\n  hover: '--es-hover',\n  hatch: '--es-hatch',\n  addcardVeil: '--es-addcard-veil',\n  fieldBg: '--es-field-bg',\n  trackBg: '--es-track-bg',\n  inputBorder: '--es-input-border',\n  fieldText: '--es-field-text',\n  fieldPlaceholder: '--es-field-placeholder',\n  knob: '--es-knob',\n  text: '--es-text',\n  textStrong: '--es-text-strong',\n  textSecondary: '--es-text-secondary',\n  muted: '--es-muted',\n  icon: '--es-icon',\n  disabled: '--es-disabled',\n  divider: '--es-divider',\n  line: '--es-line',\n  btnBorder: '--es-btn-border',\n  btnText: '--es-btn-text',\n  chipBg: '--es-chip-bg',\n  chipFg: '--es-chip-fg',\n  brandSquare: '--es-brand-square',\n  deviceBorder: '--es-device-border',\n  toastBg: '--es-toast-bg',\n  toggleOff: '--es-toggle-off',\n  scrollbar: '--es-scrollbar',\n  scrollbarHover: '--es-scrollbar-hover',\n  danger: '--es-danger',\n  dangerStrong: '--es-danger-strong',\n  dangerTint: '--es-danger-tint',\n  warning: '--es-warning',\n  previewTint: '--es-preview-tint',\n  success: '--es-success',\n  panelRadius: '--es-panel-radius',\n  rowRadius: '--es-row-radius',\n  fieldRadius: '--es-field-radius',\n  panelGap: '--es-panel-gap',\n  panelShadow: '--es-panel-shadow',\n  topbarShadow: '--es-topbar-shadow',\n  raisedShadow: '--es-raised-shadow',\n  font: '--es-font',\n};\n\n/**\n * Puck's own accent ramp + font, re-tinted to the shell blue. Puck reads these\n * fixed variable names (`--puck-color-azure-NN`, `--puck-font-family`) directly,\n * so they are NOT part of the `--es-*` set — but they had been copied verbatim\n * into BOTH editors' CSS, so `shell.css` now declares them once on `.es-editor`.\n * Kept here as the JS record so the parity gate can prove `shell.css` matches.\n */\nexport const puckAzureRamp: Record<string, string> = {\n  '--puck-color-azure-01': '#172554',\n  '--puck-color-azure-02': '#1e3a8a',\n  '--puck-color-azure-03': '#1d4ed8',\n  '--puck-color-azure-04': '#2563eb',\n  '--puck-color-azure-05': '#3b82f6',\n  '--puck-color-azure-06': '#60a5fa',\n  '--puck-color-azure-07': '#93c5fd',\n  '--puck-color-azure-08': '#bfdbfe',\n  '--puck-color-azure-09': '#dbeafe',\n  '--puck-color-azure-10': '#eff6ff',\n  '--puck-color-azure-11': '#f5f9ff',\n  '--puck-color-azure-12': '#fafcff',\n};\n"]}