v1.1.1: second integration-feedback release

Readout legibility (the #1 ask):
- bold own-cell decimal point + colon in seven/fourteen-seg (not hairlines)
- weight prop thickens strokes; gap controls inter-cell kerning

Display colors:
- SegmentDisplay defaults to theme.ledGreen, AlphaDisplay to theme.ledAmber
- valueColor fn + value-space zones on SegmentDisplay (self-coloring readouts)
- charset: colon in both, $ and % in 14-seg; disabled + data-disabled

Knob captions: sublabel (second line) + labelSize (independent of dial size).

New components:
- ToggleSwitch (rocker/slider boolean, role=switch)
- Gauge (read-only radial arc meter, round sibling of Meter)
- TransportButton (play/stop/record/pause/panic, record blinks)
- LampRow (console-print lamp bank), LabeledField, Rack (panel chrome)

Responsiveness: fill on Meter + Fader (stretch to container).
Niceties: PushButton leadingIcon; theme ledGreen/ledAmber/panel tokens.

54 -> 63 exports. 38 unit tests. Browser-verified.

packages/dreamknob/src/layout/LabeledField.tsx

@@ -0,0 +1,91 @@
+import * as React from 'react';
+import { useKnobTheme } from '../core/theme';
+
+export interface LabeledFieldProps {
+  /** Field name printed beside the control. */
+  label: string;
+  /** The control (a knob, fader, ScrubField, ToggleSwitch, …). */
+  children: React.ReactNode;
+  /** Unit printed after the control, e.g. "px", "dB". */
+  unit?: string;
+  /**
+   * Label column width — set the same value on a stack of fields so their
+   * controls line up. Number = px. Default: auto.
+   */
+  labelWidth?: number | string;
+  /** 'row' (label · control · unit, default) or 'column' (label above). */
+  orientation?: 'row' | 'column';
+  /** Push the control to the right edge of the row. Default: false. */
+  spread?: boolean;
+  gap?: number;
+  labelColor?: string;
+  className?: string;
+  style?: React.CSSProperties;
+}
+
+/**
+ * One aligned inspector row: a label, a control and an optional unit. Give a
+ * stack of fields the same `labelWidth` and their controls line up — the
+ * boilerplate every properties panel rewrites, owned in one place.
+ */
+export const LabeledField: React.FC<LabeledFieldProps> = ({
+  label,
+  children,
+  unit,
+  labelWidth,
+  orientation = 'row',
+  spread = false,
+  gap = 10,
+  labelColor,
+  className,
+  style,
+}) => {
+  const theme = useKnobTheme();
+  const column = orientation === 'column';
+  const labelEl = (
+    <span
+      style={{
+        flex: 'none',
+        width: column ? undefined : labelWidth,
+        fontFamily: theme.fontUI,
+        fontSize: 11,
+        letterSpacing: '0.05em',
+        textTransform: 'uppercase',
+        color: labelColor ?? theme.label,
+        whiteSpace: 'nowrap',
+      }}
+    >
+      {label}
+    </span>
+  );
+
+  return (
+    <div
+      className={className}
+      style={{
+        display: 'flex',
+        flexDirection: column ? 'column' : 'row',
+        alignItems: column ? 'flex-start' : 'center',
+        gap: column ? 4 : gap,
+        ...style,
+      }}
+    >
+      {labelEl}
+      <div
+        style={{
+          display: 'inline-flex',
+          alignItems: 'center',
+          gap: 6,
+          marginLeft: spread && !column ? 'auto' : undefined,
+        }}
+      >
+        {children}
+        {unit && (
+          <span style={{ fontFamily: theme.fontMono, fontSize: 11, color: theme.label, whiteSpace: 'nowrap' }}>
+            {unit}
+          </span>
+        )}
+      </div>
+    </div>
+  );
+};