@weasel-js/theme 1.6.1 → 1.7.1

package/dist/faces.css

@@ -1,4 +1,4 @@
-/* The kit's two faces, declared and nothing else. `fonts.css` pairs them with a
+/* The kit's faces, declared and nothing else. `fonts.css` pairs them with a
  * document font; `@weasel-js/labkit` carries them in its stylesheet.
  * Licenses: OFL-Oswald.txt and OFL-Inter.txt in @weasel-js/theme's fonts/. */
 
@@ -10,6 +10,14 @@
   src: url('../fonts/oswald-latin-variable.woff2') format('woff2');
 }
 
+@font-face {
+  font-family: 'Oswald Tabular';
+  font-style: normal;
+  font-weight: 200 700;
+  font-display: swap;
+  src: url('../fonts/oswald-tabular-digits.woff2') format('woff2');
+  unicode-range: U+0030-0039, U+2007;
+}
 @font-face {
   font-family: 'Inter';
   font-style: normal;

package/dist/index.d.ts

@@ -1,5 +1,5 @@
-import { n as TokenName, o as ResolvedTheme, a as Theme, S as Selection, p as TokenValue } from './definition-DLdTdFWs.js';
-export { q as AxisDef, A as AxisDefs, r as AxisValue, s as BAKED_THEMES, B as BakedTheme, t as ByAxis, u as ColorContext, v as ColorList, F as FlatTokens, G as GeneratedColors, w as GeneratedTheme, P as PinObject, e as PinValue, x as RampColors, R as RawToken, y as SerializableColorList, z as THEMES, D as THEME_SOURCES, T as ThemeDefinition, E as ThemeInput, V as Varying, H as colorAt, I as colorCount, J as colorCssAt, K as defineTheme, M as enumerateSelections, Q as fullSelection, U as isByAxis, W as rampSteps, X as resolveTheme, Y as selectionKey, Z as themeAxes, _ as themeTones, $ as weaselTheme } from './definition-DLdTdFWs.js';
+import { n as TokenName, o as ResolvedTheme, a as Theme, S as Selection, p as TokenValue } from './definition-ChUj0lSz.js';
+export { q as AxisDef, A as AxisDefs, r as AxisValue, s as BAKED_THEMES, B as BakedTheme, t as ByAxis, u as ColorContext, v as ColorList, F as FlatTokens, G as GeneratedColors, w as GeneratedTheme, P as PinObject, e as PinValue, x as RampColors, R as RawToken, y as SerializableColorList, z as THEMES, D as THEME_SOURCES, T as ThemeDefinition, E as ThemeInput, V as Varying, H as colorAt, I as colorCount, J as colorCssAt, K as defineTheme, M as enumerateSelections, Q as fullSelection, U as isByAxis, W as rampSteps, X as resolveTheme, Y as selectionKey, Z as themeAxes, _ as themeTones, $ as weaselTheme } from './definition-ChUj0lSz.js';
 export { C as ColorMode, a as ColorModePreference, i as isColorModePreference } from './colorMode-CoklZomJ.js';
 
 /** One row of `TOKEN_MANIFEST`: a token, its DTCG type, the name-prefix
@@ -87,6 +87,7 @@ declare function parseTokenValue(type: string, text: string): TokenValue;
  */
 /** What kind of content a surface holds — a class of content, never a position. */
 declare const STANCES: readonly ["scope", "aside", "advanced", "debug", "danger", "notice", "important", "preview"];
+/** One of {@link STANCES}. */
 type Stance = (typeof STANCES)[number];
 /** One styleable property of a stanced surface. */
 interface StanceSlot {
@@ -94,6 +95,7 @@ interface StanceSlot {
     /** What it drives, for tooling. */
     readonly drives: string;
 }
+/** Every slot a theme can set per stance, as `--wzl-stance-<stance>-<slot>`. */
 declare const STANCE_SLOTS: readonly StanceSlot[];
 /** Every stance-slot name, `--wzl-`-prefixed, nested variants included. */
 declare function stanceSlotNames(): string[];

package/dist/index.js

@@ -1,8 +1,8 @@
-import { weaselTheme } from './chunk-4EIPTWJA.js';
-export { BAKED_THEMES, THEMES, THEME_SOURCES, applyTheme, colorAt, colorCount, colorCssAt, defineTheme, isColorModePreference, rampSteps, themeTones, weaselTheme } from './chunk-4EIPTWJA.js';
-import { AXES_EXT, overrideKey, ALPHA_EXT } from './chunk-EINHFDWI.js';
-import { themeAxes, mergeAxes } from './chunk-C3S4A65R.js';
-export { enumerateSelections, fullSelection, isByAxis, parseTokenValue, resolveTheme, selectionKey, serializeTokenValue, themeAxes } from './chunk-C3S4A65R.js';
+import { weaselTheme } from './chunk-CKB2MZRY.js';
+export { BAKED_THEMES, THEMES, THEME_SOURCES, applyTheme, colorAt, colorCount, colorCssAt, defineTheme, isColorModePreference, rampSteps, themeTones, weaselTheme } from './chunk-CKB2MZRY.js';
+import { AXES_EXT, overrideKey, ALPHA_EXT } from './chunk-Z675UQ26.js';
+import { themeAxes, mergeAxes } from './chunk-AN5JVL2S.js';
+export { enumerateSelections, fullSelection, isByAxis, parseTokenValue, resolveTheme, selectionKey, serializeTokenValue, themeAxes } from './chunk-AN5JVL2S.js';
 
 // src/generated/manifest.ts
 var TOKEN_MANIFEST = [
@@ -16,9 +16,9 @@ var TOKEN_MANIFEST = [
   { name: "--wzl-gray-700", type: "color", group: "gray", defaultValue: "#25272c", description: "", hook: false },
   { name: "--wzl-gray-800", type: "color", group: "gray", defaultValue: "#181a1e", description: "", hook: false },
   { name: "--wzl-gray-900", type: "color", group: "gray", defaultValue: "#0e0f12", description: "", hook: false },
-  { name: "--wzl-accent-soft", type: "color", group: "accent", defaultValue: "#1d1454", description: "", hook: false },
-  { name: "--wzl-accent-base", type: "color", group: "accent", defaultValue: "#2e1f7a", description: "Midnight blue-violet. Deep and saturated; anchors primary actions on light and dark surfaces alike.", hook: false },
-  { name: "--wzl-accent-strong", type: "color", group: "accent", defaultValue: "#5841b8", description: "", hook: false },
+  { name: "--wzl-accent-soft", type: "color", group: "accent", defaultValue: "#262a66", description: "", hook: false },
+  { name: "--wzl-accent-base", type: "color", group: "accent", defaultValue: "#5b63c9", description: "Periwinkle. Anchors primary actions on dark surfaces.", hook: false },
+  { name: "--wzl-accent-strong", type: "color", group: "accent", defaultValue: "#8c94ee", description: "", hook: false },
   { name: "--wzl-secondary-soft", type: "color", group: "secondary", defaultValue: "#704e09", description: "", hook: false },
   { name: "--wzl-secondary-base", type: "color", group: "secondary", defaultValue: "#dc9d15", description: "", hook: false },
   { name: "--wzl-secondary-strong", type: "color", group: "secondary", defaultValue: "#f1cb8d", description: "", hook: false },
@@ -32,12 +32,12 @@ var TOKEN_MANIFEST = [
   { name: "--wzl-swatch-citron", type: "color", group: "swatch", defaultValue: "#d5d23a", description: "", hook: false },
   { name: "--wzl-swatch-rose", type: "color", group: "swatch", defaultValue: "#fa4590", description: "", hook: false },
   { name: "--wzl-swatch-violet", type: "color", group: "swatch", defaultValue: "#955cf9", description: "", hook: false },
-  { name: "--wzl-font-size-2xs", type: "dimension", group: "font", defaultValue: "9px", description: "Shortcut keys and index badges. The floor for chrome text.", hook: false },
-  { name: "--wzl-font-size-xs", type: "dimension", group: "font", defaultValue: "10px", description: "Tool-button labels under an icon.", hook: false },
-  { name: "--wzl-font-size-sm", type: "dimension", group: "font", defaultValue: "11px", description: "Chrome labels, status readouts, section headings.", hook: false },
-  { name: "--wzl-font-size-md", type: "dimension", group: "font", defaultValue: "13px", description: "Controls and body text.", hook: false },
-  { name: "--wzl-font-size-lg", type: "dimension", group: "font", defaultValue: "16px", description: "Panel and dialog titles.", hook: false },
-  { name: "--wzl-font-size-xl", type: "dimension", group: "font", defaultValue: "20px", description: "The largest chrome text \u2014 a lab or app title.", hook: false },
+  { name: "--wzl-font-size-2xs", type: "dimension", group: "font", defaultValue: "10px", description: "Shortcut keys and index badges. The floor for chrome text.", hook: false },
+  { name: "--wzl-font-size-xs", type: "dimension", group: "font", defaultValue: "12px", description: "Tool-button labels under an icon.", hook: false },
+  { name: "--wzl-font-size-sm", type: "dimension", group: "font", defaultValue: "13px", description: "Chrome labels, status readouts, section headings.", hook: false },
+  { name: "--wzl-font-size-md", type: "dimension", group: "font", defaultValue: "15px", description: "Controls and body text.", hook: false },
+  { name: "--wzl-font-size-lg", type: "dimension", group: "font", defaultValue: "18px", description: "Panel and dialog titles.", hook: false },
+  { name: "--wzl-font-size-xl", type: "dimension", group: "font", defaultValue: "23px", description: "The largest chrome text \u2014 a lab or app title.", hook: false },
   { name: "--wzl-space-1", type: "dimension", group: "space", defaultValue: "2px", description: "", hook: false },
   { name: "--wzl-space-2", type: "dimension", group: "space", defaultValue: "4px", description: "", hook: false },
   { name: "--wzl-space-3", type: "dimension", group: "space", defaultValue: "6px", description: "", hook: false },
@@ -54,7 +54,7 @@ var TOKEN_MANIFEST = [
   { name: "--wzl-fg-subtle", type: "color", group: "fg", defaultValue: "#6f737b", description: "", hook: false },
   { name: "--wzl-border", type: "color", group: "border", defaultValue: "#25272c", description: "", hook: false },
   { name: "--wzl-border-strong", type: "color", group: "border", defaultValue: "#6f737b", description: "The line that has to be seen: a control's edge, a raised surface's outline. Clears WCAG 1.4.11's 3:1 against every surface in both modes.", hook: false },
-  { name: "--wzl-accent-fg", type: "color", group: "accent", defaultValue: "#5841b8", description: "Accent for foreground use \u2014 text, icons, selected labels drawn on a surface. accent is a fill; the midnight base is too dim to read as text on dark surfaces.", hook: false },
+  { name: "--wzl-accent-fg", type: "color", group: "accent", defaultValue: "#8c94ee", description: "Accent for foreground use \u2014 text, icons, selected labels drawn on a surface. accent is a fill; the midnight base is too dim to read as text on dark surfaces.", hook: false },
   { name: "--wzl-secondary-fg", type: "color", group: "secondary", defaultValue: "#dc9d15", description: "Secondary accent for foreground use: a second voice beside the accent, such as a value the panel derived rather than one the user set. Picked from the ramp so it clears 4.5:1 on the surface in both modes.", hook: false },
   { name: "--wzl-fg-inverse", type: "color", group: "fg", defaultValue: "#0e0f12", description: "Text drawn on a filled foreground-colored element (e.g. a slider thumb). Flips with the mode, so it is a semantic, not an alias to a primitive.", hook: false },
   { name: "--wzl-shadow", type: "color", group: "shadow", defaultValue: "rgba(0, 0, 0, 0.6)", description: "Elevation. Always darker than any surface \u2014 never derived from fg, which is near-white on dark.", hook: false },
@@ -68,7 +68,7 @@ var TOKEN_MANIFEST = [
   { name: "--wzl-panel-tone-mix", type: "number", group: "panel", defaultValue: "14%", description: "How much of a panel\u2019s tone mixes into its surface.", hook: false },
   { name: "--wzl-panel-title-font", type: "fontFamily", group: "panel", defaultValue: "Oswald, 'Helvetica Neue Condensed', 'Arial Narrow', system-ui, sans-serif", description: "", hook: false },
   { name: "--wzl-panel-title-weight", type: "fontWeight", group: "panel", defaultValue: "200", description: "", hook: false },
-  { name: "--wzl-panel-title-size", type: "dimension", group: "panel", defaultValue: "16px", description: "", hook: false },
+  { name: "--wzl-panel-title-size", type: "dimension", group: "panel", defaultValue: "18px", description: "", hook: false },
   { name: "--wzl-panel-title-case", type: "string", group: "panel", defaultValue: "none", description: "", hook: false },
   { name: "--wzl-panel-title-tracking", type: "dimension", group: "panel", defaultValue: "0.01em", description: "", hook: false },
   { name: "--wzl-panel-title-color", type: "color", group: "panel", defaultValue: "#e6e7e9", description: "", hook: false },
@@ -89,12 +89,12 @@ var TOKEN_MANIFEST = [
   { name: "--wzl-stance-danger-tone", type: "color", group: "stance", defaultValue: "#d94a3f", description: "", hook: false },
   { name: "--wzl-stance-danger-border-color", type: "color", group: "stance", defaultValue: "#d94a3f", description: "", hook: false },
   { name: "--wzl-stance-danger-title-color", type: "color", group: "stance", defaultValue: "#d94a3f", description: "", hook: false },
-  { name: "--wzl-stance-notice-tone", type: "color", group: "stance", defaultValue: "#2e1f7a", description: "", hook: false },
+  { name: "--wzl-stance-notice-tone", type: "color", group: "stance", defaultValue: "#5b63c9", description: "", hook: false },
   { name: "--wzl-stance-notice-tone-mix", type: "number", group: "stance", defaultValue: "8%", description: "", hook: false },
-  { name: "--wzl-stance-important-border-color", type: "color", group: "stance", defaultValue: "#5841b8", description: "", hook: false },
-  { name: "--wzl-stance-important-title-color", type: "color", group: "stance", defaultValue: "#5841b8", description: "", hook: false },
+  { name: "--wzl-stance-important-border-color", type: "color", group: "stance", defaultValue: "#8c94ee", description: "", hook: false },
+  { name: "--wzl-stance-important-title-color", type: "color", group: "stance", defaultValue: "#8c94ee", description: "", hook: false },
   { name: "--wzl-stance-preview-pad", type: "dimension", group: "stance", defaultValue: "0", description: "", hook: false },
-  { name: "--wzl-stance-preview-title-size", type: "dimension", group: "stance", defaultValue: "10px", description: "", hook: false },
+  { name: "--wzl-stance-preview-title-size", type: "dimension", group: "stance", defaultValue: "12px", description: "", hook: false },
   { name: "--wzl-stance-preview-title-case", type: "string", group: "stance", defaultValue: "none", description: "", hook: false },
   { name: "--wzl-stance-preview-title-inset", type: "dimension", group: "stance", defaultValue: "6px 10px 0", description: "", hook: false },
   { name: "--wzl-danger-base", type: "color", group: "status", defaultValue: "#d94a3f", description: "", hook: false },
@@ -104,15 +104,15 @@ var TOKEN_MANIFEST = [
   { name: "--wzl-line-subtle", type: "color", group: "line", defaultValue: "rgba(230, 231, 233, 0.1)", description: "Barely-there separators (table rows).", hook: false },
   { name: "--wzl-line", type: "color", group: "line", defaultValue: "rgba(230, 231, 233, 0.2)", description: "Primary gridlines on sunken surfaces.", hook: false },
   { name: "--wzl-line-strong", type: "color", group: "line", defaultValue: "rgba(230, 231, 233, 0.4)", description: "Axes and emphasized dividers.", hook: false },
-  { name: "--wzl-curve-color", type: "color", group: "curve", defaultValue: "#5841b8", description: "Drawn data curves. Routes through the bright accent because accent-base is too dim on sunken surfaces.", hook: false },
-  { name: "--wzl-accent", type: "color", group: "accent", defaultValue: "#2e1f7a", description: "", hook: false },
-  { name: "--wzl-accent-hover", type: "color", group: "accent", defaultValue: "#5841b8", description: "", hook: false },
+  { name: "--wzl-curve-color", type: "color", group: "curve", defaultValue: "#8c94ee", description: "Drawn data curves. Routes through the bright accent because accent-base is too dim on sunken surfaces.", hook: false },
+  { name: "--wzl-accent", type: "color", group: "accent", defaultValue: "#5b63c9", description: "", hook: false },
+  { name: "--wzl-accent-hover", type: "color", group: "accent", defaultValue: "#8c94ee", description: "", hook: false },
   { name: "--wzl-secondary", type: "color", group: "secondary", defaultValue: "#dc9d15", description: "Honey amber in dark mode and teal in light, where a darkened amber reads as brown. A fill; use secondary-fg for text.", hook: false },
   { name: "--wzl-danger", type: "color", group: "status", defaultValue: "#d94a3f", description: "", hook: false },
   { name: "--wzl-warning", type: "color", group: "status", defaultValue: "#d99a3f", description: "", hook: false },
   { name: "--wzl-success", type: "color", group: "status", defaultValue: "#2ec27e", description: "", hook: false },
-  { name: "--wzl-focus-ring", type: "color", group: "focus", defaultValue: "#5841b8", description: "", hook: false },
-  { name: "--wzl-glass-tint", type: "color", group: "glass", defaultValue: "#2e1f7a", description: "Frosted-glass tint. Components compose it as color-mix(in srgb, var(--wzl-glass-tint) 78%, transparent) with backdrop-filter: blur(3px).", hook: false },
+  { name: "--wzl-focus-ring", type: "color", group: "focus", defaultValue: "#8c94ee", description: "", hook: false },
+  { name: "--wzl-glass-tint", type: "color", group: "glass", defaultValue: "#5b63c9", description: "Frosted-glass tint. Components compose it as color-mix(in srgb, var(--wzl-glass-tint) 78%, transparent) with backdrop-filter: blur(3px).", hook: false },
   { name: "--wzl-surface-hover", type: "color", group: "surface", defaultValue: "rgba(230, 231, 233, 0.1)", description: "Hover wash over a raised surface. Same formula as line-subtle, different job \u2014 do not collapse them.", hook: false },
   { name: "--wzl-surface-pressed", type: "color", group: "surface", defaultValue: "rgba(230, 231, 233, 0.18)", description: "Pressed wash over a raised surface.", hook: false },
   { name: "--wzl-radius-sm", type: "dimension", group: "radius", defaultValue: "3px", description: "", hook: false },
@@ -122,11 +122,11 @@ var TOKEN_MANIFEST = [
   { name: "--wzl-border-w", type: "dimension", group: "border", defaultValue: "1px", description: "", hook: false },
   { name: "--wzl-line-width", type: "dimension", group: "line", defaultValue: "2px", description: "Structural lines \u2014 gridlines, dividers, axes.", hook: false },
   { name: "--wzl-curve-width", type: "dimension", group: "curve", defaultValue: "3px", description: "Drawn data curves. Heavier than structural lines so data reads as primary content.", hook: false },
-  { name: "--wzl-tb-height", type: "dimension", group: "tb", defaultValue: "28px", description: "Height of a horizontal toolbar strip (ButtonBar, OptionsBar, ToolOptionsBar). Taller than control-h so the controls inside a strip are not flush with its edges.", hook: false },
-  { name: "--wzl-control-h-xs", type: "dimension", group: "control", defaultValue: "18px", description: "Height of the smallest interactive control -- a stepper, a keycap, a swatch button in a dense row. The rank below control-h-sm.", hook: false },
-  { name: "--wzl-control-h-sm", type: "dimension", group: "control", defaultValue: "20px", description: "Height of a control in a dense inspector -- a Properties field, a small Button. The rank below control-h, which sizes a standalone control.", hook: false },
-  { name: "--wzl-control-h", type: "dimension", group: "control", defaultValue: "24px", description: "Height of an interactive control \u2014 button, input, select, segmented control. Distinct from tb-height, which sizes the strip a row of them sits in.", hook: false },
-  { name: "--wzl-icon-button-size", type: "dimension", group: "icon", defaultValue: "22px", description: "Side of a square icon button -- a dialog close, a row remove, a field clear. Smaller than control-h because it carries a glyph rather than a label, and square, so it sizes both axes.", hook: false },
+  { name: "--wzl-tb-height", type: "dimension", group: "tb", defaultValue: "32px", description: "Height of a horizontal toolbar strip (ButtonBar, OptionsBar, ToolOptionsBar). Taller than control-h so the controls inside a strip are not flush with its edges.", hook: false },
+  { name: "--wzl-control-h-xs", type: "dimension", group: "control", defaultValue: "22px", description: "Height of the smallest interactive control -- a stepper, a keycap, a swatch button in a dense row. The rank below control-h-sm.", hook: false },
+  { name: "--wzl-control-h-sm", type: "dimension", group: "control", defaultValue: "24px", description: "Height of a control in a dense inspector -- a Properties field, a small Button. The rank below control-h, which sizes a standalone control.", hook: false },
+  { name: "--wzl-control-h", type: "dimension", group: "control", defaultValue: "28px", description: "Height of an interactive control \u2014 button, input, select, segmented control. Distinct from tb-height, which sizes the strip a row of them sits in.", hook: false },
+  { name: "--wzl-icon-button-size", type: "dimension", group: "icon", defaultValue: "26px", description: "Side of a square icon button -- a dialog close, a row remove, a field clear. Smaller than control-h because it carries a glyph rather than a label, and square, so it sizes both axes.", hook: false },
   { name: "--wzl-slider-track-h", type: "dimension", group: "slider", defaultValue: "4px", description: "Height of a linear range track. The kit's single-thumb ranges all wear this; Slider's default 24px canvas track does not.", hook: false },
   { name: "--wzl-slider-thumb-size", type: "dimension", group: "slider", defaultValue: "8px", description: "Diameter of a linear range thumb.", hook: false },
   { name: "--wzl-slider-track-mix", type: "dimension", group: "slider", defaultValue: "18%", description: "Accent proportion in a range track, as a color-mix percentage \u2014 not a color. Mixed into a real property, never into another custom property.", hook: false },
@@ -141,7 +141,7 @@ var TOKEN_MANIFEST = [
   { name: "--wzl-workspace-line", type: "color", group: "workspace", defaultValue: "rgba(230, 231, 233, 0.1)", description: "Marks drawn over workspace-surface, such as its diagonal stripes, so the page reads as the thing on top.", hook: false },
   { name: "--wzl-field-pad-x", type: "dimension", group: "field", defaultValue: "8px", description: "Horizontal padding inside a boxed field. Pairs with --wzl-field-h, which is a container override and has no :root default.", hook: false },
   { name: "--wzl-glass-blur", type: "dimension", group: "glass", defaultValue: "3px", description: "Backdrop blur radius for frosted surfaces. Pairs with glass-tint.", hook: false },
-  { name: "--wzl-font-size", type: "dimension", group: "font", defaultValue: "13px", description: "Controls and body text.", hook: false },
+  { name: "--wzl-font-size", type: "dimension", group: "font", defaultValue: "15px", description: "Controls and body text.", hook: false },
   { name: "--wzl-tracking-none", type: "dimension", group: "tracking", defaultValue: "0", description: "", hook: false },
   { name: "--wzl-tracking-wide", type: "dimension", group: "tracking", defaultValue: "0.06em", description: "Uppercase section headings.", hook: false },
   { name: "--wzl-tracking-wider", type: "dimension", group: "tracking", defaultValue: "0.08em", description: "Uppercase at 11px and below.", hook: false },
@@ -159,6 +159,7 @@ var TOKEN_MANIFEST = [
   { name: "--wzl-ease-in-out-cubic", type: "cubicBezier", group: "ease", defaultValue: "cubic-bezier(0.65, 0, 0.35, 1)", description: "", hook: false },
   { name: "--wzl-ease-out-back", type: "cubicBezier", group: "ease", defaultValue: "cubic-bezier(0.34, 1.56, 0.64, 1)", description: "", hook: false },
   { name: "--wzl-font-ui", type: "fontFamily", group: "font", defaultValue: "Oswald, 'Helvetica Neue Condensed', 'Arial Narrow', system-ui, sans-serif", description: "Condensed UI/display face. The heavier cuts get blocky at any size, so the weight tokens stay in the 200-400 range.", hook: false },
+  { name: "--wzl-font-numeric", type: "fontFamily", group: "font", defaultValue: "'Oswald Tabular', var(--wzl-font-ui)", description: "The UI face with equal-width digits, for numbers read down a column or updated in place. Oswald Tabular carries only 0-9 and the figure space (U+2007); every other character falls through to the UI face.", hook: false },
   { name: "--wzl-font-display", type: "fontFamily", group: "font", defaultValue: "Oswald, 'Helvetica Neue Condensed', 'Arial Narrow', system-ui, sans-serif", description: "", hook: false },
   { name: "--wzl-font-body", type: "fontFamily", group: "font", defaultValue: "Inter, system-ui, -apple-system, 'Segoe UI', sans-serif", description: "", hook: false },
   { name: "--wzl-font-mono", type: "fontFamily", group: "font", defaultValue: "ui-monospace, SFMono-Regular, Menlo, Consolas, monospace", description: "", hook: false },
@@ -170,10 +171,11 @@ var TOKEN_MANIFEST = [
   { name: "--wzl-space-sm", type: "dimension", group: "space", defaultValue: "8px", description: "Alias for space-4. The t-shirt names name every other rung of the ladder.", hook: false },
   { name: "--wzl-space-md", type: "dimension", group: "space", defaultValue: "12px", description: "Alias for space-6. The t-shirt names name every other rung of the ladder.", hook: false },
   { name: "--wzl-space-lg", type: "dimension", group: "space", defaultValue: "16px", description: "Alias for space-8. The t-shirt names name every other rung of the ladder.", hook: false },
+  { name: "--wzl-detail-figure-min-width", type: "dimension", group: "detail", defaultValue: "8ch", description: 'Least width of a value cell in a `values="figures"` DetailList.', hook: true },
   { name: "--wzl-disclosure-fill", type: "color", group: "disclosure", defaultValue: "var(--wzl-accent-fg)", description: "Fill of a Disclosure\u2019s fold mark.", hook: true },
   { name: "--wzl-disclosure-gap", type: "dimension", group: "disclosure", defaultValue: "4px", description: "Gap between a Disclosure\u2019s twisty and its label.", hook: true },
   { name: "--wzl-disclosure-target", type: "dimension", group: "disclosure", defaultValue: "20px", description: "Hit-target square of a Disclosure twisty, and the twisty column of a LayerList row.", hook: true },
-  { name: "--wzl-input-surface", type: "color", group: "input", defaultValue: "var(--wzl-surface-sunken)", description: "Surface a text Input\u2019s frame sits on. Set it on any container whose own background is the default \u2014 a sunken rail or panel \u2014 where an unset field is the same color as what is behind it.", hook: true },
+  { name: "--wzl-input-surface", type: "color", group: "input", defaultValue: "var(--wzl-surface-sunken)", description: "Surface a field\u2019s frame sits on \u2014 Input, NumberField, ComboBox, Select, MenuButton, ListEditor and the property rows. Set it on any container whose own background is the default \u2014 a sunken rail or panel \u2014 where an unset field is the same color as what is behind it.", hook: true },
   { name: "--wzl-number-field-width", type: "dimension", group: "number", defaultValue: "9ch", description: "Width of a NumberField\u2019s input.", hook: true },
   { name: "--wzl-params-label-align", type: "string", group: "params", defaultValue: "start", description: "Text alignment of row labels in PropertyPanel, Prefs and labkit\u2019s ControlPanel.", hook: true },
   { name: "--wzl-params-label-case", type: "string", group: "params", defaultValue: "uppercase", description: "text-transform of every label and title in PropertyPanel, Prefs and labkit\u2019s ControlPanel.", hook: true },