@mkbabb/glass-ui 4.1.0 → 5.0.0

package/dist/styles/theme/bridges.css

@@ -1,380 +1 @@
-/* theme/bridges.css — the `@theme inline` block: the tokens.css `var(--token)`
-   BRIDGES (color/shadow/blur/duration/ease/typography) (AZ.W-CARVE partial 2 of 4).
-
-   Inline substitutes the referenced value and mints no second var, so the
-   tokens.css token stays the single override point (plain would emit
-   `--color-primary` AND `--primary`). Guardrail: NEVER `@property`-register a
-   color token — registration snapshots the value and breaks light-dark().
-
-   Cascade: this partial MUST @import AFTER theme/radius.css (it references the
-   radius primitives) and BEFORE theme/literals.css. */
-
-@theme inline {
-    /* ═══════════════════════════════════════════════
-       Typography — size scale → text-* utilities
-       ═══════════════════════════════════════════════ */
-    --text-admin-label: var(--type-admin-label);
-    --text-micro:       var(--type-micro);
-    --text-caption:     var(--type-caption);
-    --text-small:       var(--type-small);
-    --text-body:        var(--type-body);
-    --text-prose:       var(--type-prose);
-    --text-subheading:  var(--type-subheading);
-    --text-heading:     var(--type-heading);
-    --text-title:       var(--type-title);
-    /* AX.W50 D17 — the picker-family type-scale → `text-dropdown` /
-       `text-dropdown-secondary` utilities, bridging the `--dropdown-text` token pair
-       (tokens.css §10, a specialization of W51's `--control-text` comfort register)
-       so a Tailwind `text-dropdown` utility resolves the family scale. Mirrors the
-       `--text-small: var(--type-small)` ladder-bridge idiom above. */
-    --text-dropdown:           var(--dropdown-text);
-    --text-dropdown-secondary: var(--dropdown-text-secondary);
-    --text-display:     var(--type-display-1);
-    --text-display-1:   var(--type-display-1);
-    --text-display-2:   var(--type-display-2);
-    --text-display-3:   var(--type-display-3);
-    --text-display-4:   var(--type-display-4);
-    --text-display-5:   var(--type-display-5);
-
-    /* Line heights → leading-* utilities */
-    --leading-micro:   var(--type-leading-micro);
-    --leading-caption: var(--type-leading-caption);
-    --leading-small:   var(--type-leading-small);
-    --leading-body:    var(--type-leading-body);
-    --leading-prose:   var(--type-leading-prose);
-    --leading-heading: var(--type-leading-heading);
-    --leading-display: var(--type-leading-display);
-
-    /* Letter spacing → tracking-* utilities */
-    --tracking-tight:  var(--type-tracking-tight);
-    /* BB.W-DISPLAY-TRACKING — the display-ONLY Apple −1.5% tracking rung bridged
-       to the `tracking-display` utility (the token-first consumer affordance). */
-    --tracking-display: var(--type-tracking-display);
-    --tracking-snug:   var(--type-tracking-snug);
-    --tracking-normal: var(--type-tracking-normal);
-    --tracking-wide:   var(--type-tracking-wide);
-    --tracking-wider:  var(--type-tracking-wider);
-    --tracking-caps:   var(--type-tracking-caps);
-
-    /* ═══════════════════════════════════════════════
-       Font families → font-* utilities
-
-       ONE brand register, bridged from tokens.css §0's --font-stack-* source.
-       --font-text is the body/heading/prose/display register (Plus Jakarta
-       Sans). --font-serif is a bridge alias for the demo configurator's "serif"
-       control slot — it resolves to the SAME text register (the library carries
-       no display-serif voice). A consumer rebrands the whole text register by
-       overriding --font-text once.
-       ═══════════════════════════════════════════════ */
-    --font-text:    var(--font-stack-text);
-    --font-display: var(--font-stack-display);
-    --font-serif:   var(--font-stack-text);
-    --font-sans:    var(--font-stack-sans);
-    --font-mono:    var(--font-stack-mono);
-
-    /* ═══════════════════════════════════════════════
-       Colors — core
-       ═══════════════════════════════════════════════ */
-    --color-border: var(--border);
-    /* AQ.W2 §3d — the whisper-alpha border hairline rung (border-border-soft /
-       bg-border-soft utilities). Auto-dark via --border. */
-    --color-border-soft: var(--border-soft);
-    --color-input: var(--input);
-    --color-ring: var(--ring);
-    --color-background: var(--background);
-    --color-foreground: var(--foreground);
-
-    --color-primary: var(--primary);
-    --color-primary-foreground: var(--primary-foreground);
-
-    --color-secondary: var(--secondary);
-    --color-secondary-foreground: var(--secondary-foreground);
-
-    --color-muted: var(--muted);
-    --color-muted-foreground: var(--muted-foreground);
-    /* AU.W8b.4 — the muted-foreground-strong bridge (text-muted-foreground-strong
-       utility). The base token already exists (tokens.css:362); only the
-       --color-muted-foreground bridge was present. CardDescription consumes
-       text-muted-foreground-strong through this. NOT @property-registered (a
-       design-token color; registration would break light-dark() re-resolution). */
-    --color-muted-foreground-strong: var(--muted-foreground-strong);
-
-    --color-accent: var(--accent);
-    --color-accent-foreground: var(--accent-foreground);
-
-    --color-destructive: var(--destructive);
-    --color-destructive-foreground: var(--destructive-foreground);
-
-    --color-popover: var(--popover);
-    --color-popover-foreground: var(--popover-foreground);
-
-    --color-card: var(--card);
-    --color-card-foreground: var(--card-foreground);
-
-    /* R0G-5 — bg-surface-public-data-panel utility. */
-    --color-surface-public-data-panel: var(--surface-public-data-panel);
-
-    --color-shadow: var(--shadow);
-
-    /* Semantic foregrounds — bg-{success,warning,info}-foreground +
-       text-{success,warning,info}-foreground. Companions to the existing
-       --color-{success,warning,info} bridges below. R5 vocab.γ gap row 4. */
-    --color-success-foreground: var(--success-foreground);
-    --color-warning-foreground: var(--warning-foreground);
-    --color-info-foreground:    var(--info-foreground);
-
-    /* Muted-tinted rungs — bg-muted-soft / bg-muted-medium. */
-    --color-muted-soft:   var(--muted-soft);
-    --color-muted-medium: var(--muted-medium);
-
-    /* AU.W8b.4 — glass-tier surface/border bridges (bg-glass-quiet /
-       border-glass-quiet). Companions to the existing --shadow-glass-quiet
-       bridge below; lets the Toggle `card` variant compose bg-glass-quiet /
-       border-glass-quiet / shadow-glass-quiet instead of bg-[var(--glass-…)]
-       arbitrary wraps. NOT @property-registered (design-token colors —
-       registration snapshots the resolved color + breaks light-dark()). */
-    --color-glass-quiet:        var(--glass-bg-quiet);
-    --color-glass-border-quiet: var(--glass-border-quiet);
-
-    /* Foreground-tint rungs — bg-surface-tint-{4,6,8,10,12,15,18,22,25}. */
-    --color-surface-tint-4:  var(--surface-tint-4);
-    --color-surface-tint-6:  var(--surface-tint-6);
-    --color-surface-tint-8:  var(--surface-tint-8);
-    --color-surface-tint-10: var(--surface-tint-10);
-    --color-surface-tint-12: var(--surface-tint-12);
-    --color-surface-tint-15: var(--surface-tint-15);
-    --color-surface-tint-18: var(--surface-tint-18);
-    --color-surface-tint-22: var(--surface-tint-22);
-    --color-surface-tint-25: var(--surface-tint-25);
-    --color-surface-tint-35: var(--surface-tint-35);
-    --color-surface-tint-40: var(--surface-tint-40);
-    --color-surface-tint-70: var(--surface-tint-70);
-
-    /* Surface-tint tier aliases (V.W3.T10) — semantic names mapped to
-       the canonical numeric scale. Lets consumers compose
-       `bg-surface-tint-quiet|floating|modal` without picking a numeric
-       rung; the alias resolves to the rung that matches the surface
-       tier's canonical opacity. Quiet ≈ 6% (light backdrop tint),
-       floating ≈ 12% (panel-tier tint), modal ≈ 18% (heavy modal tint). */
-    --color-surface-tint-quiet:    var(--surface-tint-6);
-    --color-surface-tint-floating: var(--surface-tint-12);
-    --color-surface-tint-modal:    var(--surface-tint-18);
-
-    /* Overlay scrims — bg-overlay-scrim{,-strong,-subtle}. */
-    --color-overlay-scrim:        var(--overlay-scrim);
-    --color-overlay-scrim-strong: var(--overlay-scrim-strong);
-    --color-overlay-scrim-subtle: var(--overlay-scrim-subtle);
-
-    /* ═══════════════════════════════════════════════
-       Colors — section palette (13-stop)
-       ═══════════════════════════════════════════════ */
-    --color-section-0:  var(--section-color-0);
-    --color-section-1:  var(--section-color-1);
-    --color-section-2:  var(--section-color-2);
-    --color-section-3:  var(--section-color-3);
-    --color-section-4:  var(--section-color-4);
-    --color-section-5:  var(--section-color-5);
-    --color-section-6:  var(--section-color-6);
-    --color-section-7:  var(--section-color-7);
-    --color-section-8:  var(--section-color-8);
-    --color-section-9:  var(--section-color-9);
-    --color-section-10: var(--section-color-10);
-    --color-section-11: var(--section-color-11);
-    --color-section-12: var(--section-color-12);
-
-    --color-section-heading: var(--section-heading);
-    --color-accent-pink: var(--accent-pink);
-    --color-accent-red:  var(--accent-red);
-
-    /* ═══════════════════════════════════════════════
-       Colors — viz basis
-       ═══════════════════════════════════════════════ */
-    --color-viz-fourier:   var(--viz-fourier);
-    --color-viz-chebyshev: var(--viz-chebyshev);
-    --color-viz-legendre:  var(--viz-legendre);
-    --color-viz-amber:     var(--viz-amber);
-    --color-viz-green:     var(--viz-green);
-
-    /* ═══════════════════════════════════════════════
-       Colors — semantic UI accents
-       ═══════════════════════════════════════════════ */
-    --color-tier-featured: var(--tier-featured);
-    --color-tier-saved:    var(--tier-saved);
-    --color-like:          var(--like);
-    --color-success:       var(--success);
-    --color-warning:       var(--warning);
-    --color-info:          var(--info);
-    --color-delete:        var(--delete);
-
-    /* ═══════════════════════════════════════════════
-       Colors — gold + rainbow accents (kept for consumers)
-       ═══════════════════════════════════════════════ */
-    --color-gold: var(--gold);
-    --color-gold-light: var(--gold-light);
-    --color-gold-dark: var(--gold-dark);
-    --color-gold-deep: var(--gold-deep);
-
-    /* BA.W-ATLAS-RECONCILE C-3 — the silver structure metal (gold's mirror; the
-       InstrumentChassis `variant="structure"` register). The @theme namespace var
-       a `text-silver`/`bg-silver` utility resolves through. */
-    --color-silver: var(--silver);
-    --color-silver-light: var(--silver-light);
-    --color-silver-dark: var(--silver-dark);
-    --color-silver-deep: var(--silver-deep);
-
-    /* BB.W-METAL-SHIMMER — the bronze brand metal (the third member of the
-       gold·silver·bronze triad; the @theme namespace bridge so a `text-bronze`/
-       `bg-bronze` utility resolves through, mirroring gold/silver). */
-    --color-bronze: var(--bronze);
-    --color-bronze-light: var(--bronze-light);
-    --color-bronze-dark: var(--bronze-dark);
-    --color-bronze-deep: var(--bronze-deep);
-
-    --color-rainbow-red:    var(--rainbow-red);
-    --color-rainbow-orange: var(--rainbow-orange);
-    --color-rainbow-yellow: var(--rainbow-yellow);
-    --color-rainbow-green:  var(--rainbow-green);
-    --color-rainbow-blue:   var(--rainbow-blue);
-    --color-rainbow-indigo: var(--rainbow-indigo);
-    --color-rainbow-violet: var(--rainbow-violet);
-
-    /* ═══════════════════════════════════════════════
-       Z-index → z-* utilities
-       ═══════════════════════════════════════════════ */
-    --z-index-behind: var(--z-behind);
-    --z-index-background: var(--z-background);
-    --z-index-content: var(--z-content);
-    --z-index-controls: var(--z-controls);
-    --z-index-bar: var(--z-bar);
-    --z-index-header: var(--z-header);
-    --z-index-dock: var(--z-dock);
-    --z-index-panel: var(--z-panel);
-    --z-index-overlay: var(--z-overlay);
-    --z-index-hovercard: var(--z-hovercard);
-    --z-index-tooltip: var(--z-tooltip);
-    --z-index-popover: var(--z-popover);
-    --z-index-modal: var(--z-modal);
-    --z-index-fullscreen: var(--z-fullscreen);
-    --z-index-toast: var(--z-toast);
-    --z-index-toggle: var(--z-toggle);
-    --z-index-max: var(--z-max);
-
-    /* The radius PRIMITIVES + the semantic radius aliases (→ rounded-*
-       utilities) live in the LEADING plain @theme block above — plain, not
-       inline, so value-identical aliases never collide during candidate
-       resolution. See the order/collision note there. */
-
-    /* ═══════════════════════════════════════════════
-       Sizing → h-*, min-w-*, and spacing utilities
-       ═══════════════════════════════════════════════ */
-    --height-chart-compact: var(--chart-height-compact);
-    --height-chart-default: var(--chart-height-default);
-    --height-chart-large:   var(--chart-height-large);
-    --min-width-input-sm:   var(--input-min-width-sm);
-    --spacing-chart-margin: var(--chart-margin);
-    /* AU.W8b.4 — w-popover utility (Combobox list width). Lifts `w-[200px]`. */
-    --width-popover:        var(--popover-width);
-
-    /* Golden-ratio spacing — p-phi-5 / m-phi-6 etc. via Tailwind's spacing
-       utilities. φ² and φ³ rungs for hero/chassis padding ladder. */
-    --spacing-phi-5: var(--space-phi-5);
-    --spacing-phi-6: var(--space-phi-6);
-
-    /* V.W2 T13 — Icon-size ladder bridge → `size-icon-*`/`h-icon-*`/`w-icon-*`
-       utilities. Consumers can compose via `class="size-icon-2xl"` etc.
-       directly without the `size-[var(--icon-2xl)]` arbitrary-property form. */
-    --spacing-icon-xs:  var(--icon-xs);
-    --spacing-icon-sm:  var(--icon-sm);
-    --spacing-icon-md:  var(--icon-md);
-    --spacing-icon-lg:  var(--icon-lg);
-    --spacing-icon-xl:  var(--icon-xl);
-    --spacing-icon-2xl: var(--icon-2xl);
-    --spacing-icon-3xl: var(--icon-3xl);
-    --spacing-icon-hero: var(--icon-hero);
-
-    /* ═══════════════════════════════════════════════
-       Shadows → shadow-* utilities
-       ═══════════════════════════════════════════════ */
-    --shadow-cartoon:       var(--cartoon-shadow);
-    --shadow-cartoon-hover: var(--cartoon-shadow-hover);
-    --shadow-soft:          var(--soft-shadow);
-    --shadow-elevated:      var(--elevated-shadow);
-    --shadow-modal:         var(--modal-shadow);
-
-    --shadow-card:           var(--card-shadow);
-    --shadow-dock:           var(--dock-shadow);
-    --shadow-dock-collapsed: var(--dock-shadow-collapsed);
-
-    --shadow-glass-wash:     var(--glass-shadow-wash);
-    --shadow-glass-quiet:    var(--glass-shadow-quiet);
-    --shadow-glass-resting:  var(--glass-shadow-resting);
-    --shadow-glass-floating: var(--glass-shadow-floating);
-    --shadow-glass-overlay:  var(--glass-shadow-overlay);
-
-    --shadow-cartoon-sm: var(--cartoon-shadow-sm);
-    --shadow-cartoon-md: var(--cartoon-shadow-md);
-    --shadow-cartoon-lg: var(--cartoon-shadow-lg);
-
-    /* BC.W-CONTROL-SMOOTH — the warm focus-ring box-shadow bridged to the
-       `shadow-focus-ring` utility (AW.W26 --focus-ring-shadow register). The
-       `.focus-ring` utility auto-arms on :focus-visible; this bridge lets a
-       surface compose the SAME warm ring on a NON-:focus-visible state (the
-       TagsInputItem reka roving-tabindex `data-[state=active]` selection) via the
-       @theme utility, not a `shadow-[var(--focus-ring-shadow)]` arbitrary wrap. */
-    --shadow-focus-ring: var(--focus-ring-shadow);
-
-    /* ═══════════════════════════════════════════════
-       Blur → blur-* and backdrop-blur-* utilities
-       ═══════════════════════════════════════════════ */
-    --blur-glass-wash:     var(--glass-blur-wash-radius);
-    --blur-glass-quiet:    var(--glass-blur-quiet-radius);
-    --blur-glass-resting:  var(--glass-blur-resting-radius);
-    --blur-glass-floating: var(--glass-blur-floating-radius);
-    --blur-glass-overlay:  var(--glass-blur-overlay-radius);
-    --blur-dock:           var(--glass-blur-dock-radius);
-
-    /* ═══════════════════════════════════════════════
-       Easing → ease-* utilities
-       ═══════════════════════════════════════════════ */
-    --ease-spring-smooth: var(--spring-smooth);
-    --ease-spring-snappy: var(--spring-snappy);
-    --ease-spring-bouncy: var(--spring-bouncy);
-    --ease-spring-gentle: var(--spring-gentle);
-    /* BC.W-SPRING-EASE — the minted iOS interactive press register's @theme alias
-       (the documented public register the consumers reach by name; the JS path
-       reads it via useSpringPress + --glass-btn-press-t). */
-    --ease-spring-press: var(--spring-press);
-    /* BC.W-DECK — the deck slide-transition spring's @theme alias (the documented
-       public register a consumer's slide `transition-timing-function` reaches by
-       name: `ease-spring-deck`). --spring-deck aliases --spring-smooth; the headless
-       library mints the register, the deck consumer reads it (presets-in-consumers). */
-    --ease-spring-deck: var(--spring-deck);
-
-    --ease-standard: var(--motion-ease-standard);
-    --ease-out: var(--motion-ease-out);
-    --ease-in: var(--motion-ease-in);
-    --ease-out-expo: var(--motion-ease-out-expo);
-    --ease-apple: var(--motion-ease-apple);
-    --ease-spring: var(--spring-snappy);
-    --ease-decelerate: var(--motion-ease-out);
-    --ease-accelerate: var(--motion-ease-in);
-
-    /* ═══════════════════════════════════════════════
-       Duration → duration-* utilities
-       ═══════════════════════════════════════════════ */
-    --transition-duration-instant: var(--duration-instant);
-    --transition-duration-fast: var(--duration-fast);
-    --transition-duration-normal: var(--duration-normal);
-    --transition-duration-slow: var(--duration-slow);
-    --transition-duration-panel: var(--duration-panel);
-    --transition-duration-xl: var(--duration-xl);
-    --transition-duration-xxl: var(--duration-xxl);
-    /* BC.W-CONTROL-SMOOTH — the named iOS control-press surface beat (0.12s, the
-       calm bg/color/box-shadow cross-fade clock the `.control-surface`/Toggle
-       family rides). Bridged to the `duration-control` utility so a control
-       composes the named clock, not a `duration-[var(--duration-control)]` wrap. */
-    --transition-duration-control: var(--duration-control);
-    /* BA.W-GLASS-CAL — `--transition-duration-sparkle` bridge DELETED with the
-       `--duration-sparkle` token (the disco retirement); no `duration-sparkle`
-       utility consumer. */
-}
+@theme inline { --text-admin-label: var(--type-admin-label); --text-micro: var(--type-micro); --text-caption: var(--type-caption); --text-small: var(--type-small); --text-body: var(--type-body); --text-prose: var(--type-prose); --text-subheading: var(--type-subheading); --text-heading: var(--type-heading); --text-title: var(--type-title); --text-dropdown: var(--dropdown-text); --text-dropdown-secondary: var(--dropdown-text-secondary); --text-display: var(--type-display-1); --text-display-1: var(--type-display-1); --text-display-2: var(--type-display-2); --text-display-3: var(--type-display-3); --text-display-4: var(--type-display-4); --text-display-5: var(--type-display-5); --leading-micro: var(--type-leading-micro); --leading-caption: var(--type-leading-caption); --leading-small: var(--type-leading-small); --leading-body: var(--type-leading-body); --leading-prose: var(--type-leading-prose); --leading-heading: var(--type-leading-heading); --leading-display: var(--type-leading-display); --tracking-tight: var(--type-tracking-tight); --tracking-display: var(--type-tracking-display); --tracking-snug: var(--type-tracking-snug); --tracking-normal: var(--type-tracking-normal); --tracking-wide: var(--type-tracking-wide); --tracking-wider: var(--type-tracking-wider); --tracking-caps: var(--type-tracking-caps); --font-text: var(--font-stack-text); --font-display: var(--font-stack-display); --font-serif: var(--font-stack-text); --font-sans: var(--font-stack-sans); --font-mono: var(--font-stack-mono); --color-border: var(--border); --color-border-soft: var(--border-soft); --color-input: var(--input); --color-background: var(--background); --color-foreground: var(--foreground); --color-primary: var(--primary); --color-primary-foreground: var(--primary-foreground); --color-secondary: var(--secondary); --color-secondary-foreground: var(--secondary-foreground); --color-muted: var(--muted); --color-muted-foreground: var(--muted-foreground); --color-muted-foreground-strong: var(--muted-foreground-strong); --color-accent: var(--accent); --color-accent-foreground: var(--accent-foreground); --color-destructive: var(--destructive); --color-destructive-foreground: var(--destructive-foreground); --color-popover: var(--popover); --color-popover-foreground: var(--popover-foreground); --color-card: var(--card); --color-card-foreground: var(--card-foreground); --color-surface-public-data-panel: var(--surface-public-data-panel); --color-shadow: var(--shadow); --color-success-foreground: var(--success-foreground); --color-warning-foreground: var(--warning-foreground); --color-info-foreground: var(--info-foreground); --color-muted-soft: var(--muted-soft); --color-muted-medium: var(--muted-medium); --color-glass-quiet: var(--glass-bg-quiet); --color-glass-border-quiet: var(--glass-border-quiet); --color-surface-tint-4: var(--surface-tint-4); --color-surface-tint-6: var(--surface-tint-6); --color-surface-tint-8: var(--surface-tint-8); --color-surface-tint-10: var(--surface-tint-10); --color-surface-tint-12: var(--surface-tint-12); --color-surface-tint-15: var(--surface-tint-15); --color-surface-tint-18: var(--surface-tint-18); --color-surface-tint-22: var(--surface-tint-22); --color-surface-tint-25: var(--surface-tint-25); --color-surface-tint-35: var(--surface-tint-35); --color-surface-tint-40: var(--surface-tint-40); --color-surface-tint-70: var(--surface-tint-70); --color-surface-tint-quiet: var(--surface-tint-6); --color-surface-tint-floating: var(--surface-tint-12); --color-surface-tint-modal: var(--surface-tint-18); --color-overlay-scrim: var(--overlay-scrim); --color-overlay-scrim-strong: var(--overlay-scrim-strong); --color-overlay-scrim-subtle: var(--overlay-scrim-subtle); --color-section-0: var(--section-color-0); --color-section-1: var(--section-color-1); --color-section-2: var(--section-color-2); --color-section-3: var(--section-color-3); --color-section-4: var(--section-color-4); --color-section-5: var(--section-color-5); --color-section-6: var(--section-color-6); --color-section-7: var(--section-color-7); --color-section-8: var(--section-color-8); --color-section-9: var(--section-color-9); --color-section-10: var(--section-color-10); --color-section-11: var(--section-color-11); --color-section-12: var(--section-color-12); --color-section-heading: var(--section-heading); --color-accent-pink: var(--accent-pink); --color-accent-red: var(--accent-red); --color-viz-fourier: var(--viz-fourier); --color-viz-chebyshev: var(--viz-chebyshev); --color-viz-legendre: var(--viz-legendre); --color-viz-amber: var(--viz-amber); --color-viz-green: var(--viz-green); --color-tier-featured: var(--tier-featured); --color-tier-saved: var(--tier-saved); --color-like: var(--like); --color-success: var(--success); --color-warning: var(--warning); --color-info: var(--info); --color-delete: var(--delete); --color-gold: var(--gold); --color-gold-light: var(--gold-light); --color-gold-dark: var(--gold-dark); --color-gold-deep: var(--gold-deep); --color-silver: var(--silver); --color-silver-light: var(--silver-light); --color-silver-dark: var(--silver-dark); --color-silver-deep: var(--silver-deep); --color-bronze: var(--bronze); --color-bronze-light: var(--bronze-light); --color-bronze-dark: var(--bronze-dark); --color-bronze-deep: var(--bronze-deep); --color-rainbow-red: var(--rainbow-red); --color-rainbow-orange: var(--rainbow-orange); --color-rainbow-yellow: var(--rainbow-yellow); --color-rainbow-green: var(--rainbow-green); --color-rainbow-blue: var(--rainbow-blue); --color-rainbow-indigo: var(--rainbow-indigo); --color-rainbow-violet: var(--rainbow-violet); --z-index-behind: var(--z-behind); --z-index-background: var(--z-background); --z-index-content: var(--z-content); --z-index-controls: var(--z-controls); --z-index-bar: var(--z-bar); --z-index-header: var(--z-header); --z-index-dock: var(--z-dock); --z-index-panel: var(--z-panel); --z-index-overlay: var(--z-overlay); --z-index-hovercard: var(--z-hovercard); --z-index-tooltip: var(--z-tooltip); --z-index-popover: var(--z-popover); --z-index-modal: var(--z-modal); --z-index-fullscreen: var(--z-fullscreen); --z-index-toast: var(--z-toast); --z-index-toggle: var(--z-toggle); --z-index-max: var(--z-max); --height-chart-compact: var(--chart-height-compact); --height-chart-default: var(--chart-height-default); --height-chart-large: var(--chart-height-large); --min-width-input-sm: var(--input-min-width-sm); --spacing-chart-margin: var(--chart-margin); --width-popover: var(--popover-width); --spacing-phi-5: var(--space-phi-5); --spacing-phi-6: var(--space-phi-6); --spacing-icon-xs: var(--icon-xs); --spacing-icon-sm: var(--icon-sm); --spacing-icon-md: var(--icon-md); --spacing-icon-lg: var(--icon-lg); --spacing-icon-xl: var(--icon-xl); --spacing-icon-2xl: var(--icon-2xl); --spacing-icon-3xl: var(--icon-3xl); --spacing-icon-hero: var(--icon-hero); --shadow-cartoon: var(--cartoon-shadow); --shadow-cartoon-hover: var(--cartoon-shadow-hover); --shadow-soft: var(--soft-shadow); --shadow-elevated: var(--elevated-shadow); --shadow-modal: var(--modal-shadow); --shadow-card: var(--card-shadow); --shadow-dock: var(--dock-shadow); --shadow-dock-collapsed: var(--dock-shadow-collapsed); --shadow-glass-wash: var(--glass-shadow-wash); --shadow-glass-quiet: var(--glass-shadow-quiet); --shadow-glass-resting: var(--glass-shadow-resting); --shadow-glass-floating: var(--glass-shadow-floating); --shadow-glass-overlay: var(--glass-shadow-overlay); --shadow-cartoon-sm: var(--cartoon-shadow-sm); --shadow-cartoon-md: var(--cartoon-shadow-md); --shadow-cartoon-lg: var(--cartoon-shadow-lg); --shadow-focus-ring: var(--focus-ring-shadow); --blur-glass-wash: var(--glass-blur-wash-radius); --blur-glass-quiet: var(--glass-blur-quiet-radius); --blur-glass-resting: var(--glass-blur-resting-radius); --blur-glass-floating: var(--glass-blur-floating-radius); --blur-glass-overlay: var(--glass-blur-overlay-radius); --ease-spring-smooth: var(--spring-smooth); --ease-spring-snappy: var(--spring-snappy); --ease-spring-bouncy: var(--spring-bouncy); --ease-spring-gentle: var(--spring-gentle); --ease-spring-press: var(--spring-press); --ease-spring-deck: var(--spring-deck); --ease-standard: var(--motion-ease-standard); --ease-out: var(--motion-ease-out); --ease-in: var(--motion-ease-in); --ease-out-expo: var(--motion-ease-out-expo); --ease-apple: var(--motion-ease-apple); --ease-spring: var(--spring-snappy); --ease-decelerate: var(--motion-ease-out); --ease-accelerate: var(--motion-ease-in); --transition-duration-instant: var(--duration-instant); --transition-duration-fast: var(--duration-fast); --transition-duration-normal: var(--duration-normal); --transition-duration-slow: var(--duration-slow); --transition-duration-panel: var(--duration-panel); --transition-duration-xl: var(--duration-xl); --transition-duration-xxl: var(--duration-xxl); --transition-duration-control: var(--duration-control); }

package/dist/styles/theme/dark.css

@@ -1,7 +1 @@
-/* theme/dark.css — the class-based dark-mode variant (AZ.W-CARVE partial 4 of 4).
-
-   Cascade: this partial MUST @import LAST (after radius/bridges/literals) — it
-   declares the `dark:` variant the rest of the cascade keys off. */
-
-/* Class-based dark mode */
-@variant dark (&:where(.dark, .dark *));
+@variant dark (&:where(.dark, .dark *));

package/dist/styles/theme/literals.css

@@ -1,103 +1 @@
-/* theme/literals.css — the trailing plain @theme: directly-authored LITERALS
-   (AZ.W-CARVE partial 3 of 4).
-
-   The override surface here is the namespaced var itself, not a tokens.css
-   bridge, so these mint their global variable. The --animate-* composites
-   (literal keyframe name + var() timing — no tokens.css twin to double), the
-   opacity rungs, and the text-shadow family.
-
-   Cascade: this partial MUST @import AFTER theme/bridges.css and BEFORE
-   theme/dark.css. */
-
-@theme {
-    /* ═══════════════════════════════════════════════
-       Animation → animate-* utilities
-       ═══════════════════════════════════════════════ */
-    --animate-floating-panel-in: floating-panel-in var(--duration-fast) var(--ease-out);
-    --animate-tooltip-in: tooltip-in var(--duration-fast) var(--ease-out);
-    --animate-fade-in: fade-in var(--duration-normal) var(--spring-smooth);
-    --animate-scale-in: scale-in var(--duration-normal) var(--spring-smooth);
-    --animate-slide-up: slide-up var(--duration-normal) var(--spring-smooth);
-    --animate-dock-in: dock-in var(--duration-panel) var(--spring-snappy) both;
-    /* ── Shimmer family: documented duration offset ──────────────────────────
-       The shimmer ladder is intentionally non-paired-by-name:
-       - `--animate-shimmer` reads `--duration-shimmer-fast` (3s) — fast loop
-         tempo for the band-pass shimmer pattern (skeleton, marketing).
-       - `--animate-shimmer-sweep` and `--animate-gold-shimmer` both read the
-         unsuffixed `--duration-shimmer` (5s) — slower one-pass sweep for
-         brand-polish moments (Complete! gold-shimmer headline, hero lifts).
-       The fast/canonical split exists because the two shimmer modes (looping
-       band-pass vs one-pass sweep) want different tempos. The pre-V audit
-       (C-c §5.3) flagged this as a "naming inversion"; it is intentional —
-       documented here so the offset is searchable. The orphan
-       `--duration-shimmer-slow` (8s) was excised in V.W2 T5.
-
-       BB.W-METAL-SHIMMER — `--animate-gold-shimmer` re-points onto the metal-
-       PARAMETERIZED `metal-shimmer-sweep` keyframe (the gold-only
-       `gold-shimmer-slide` RETIRED — clean break, no alias); the duration/tempo
-       are byte-preserved (the gold READ unchanged). `--animate-metal` is the
-       brand-metal family's own row on the slow `--duration-metal` (6s) clock — the
-       `.metal-{gold,silver,bronze}`/`.metal-*-border`/`.metal-rainbow-rim`
-       utilities read it (utilities/metal.css). */
-    --animate-shimmer: shimmer var(--duration-shimmer-fast) linear infinite;
-    --animate-shimmer-sweep: shimmer-sweep var(--duration-shimmer) ease-in-out infinite;
-    --animate-gold-shimmer: metal-shimmer-sweep var(--duration-shimmer) linear infinite;
-    --animate-metal: metal-shimmer-sweep var(--duration-metal) linear infinite;
-    --animate-shake: shake 0.5s ease-in-out;
-
-    /* ═══════════════════════════════════════════════
-       Opacity → opacity-* utilities
-
-       Bridges the canonical `--opacity-disabled` (0.5) and
-       `--opacity-icon-muted` (0.8) rungs from tokens.css §11. Tailwind
-       v4 generates `opacity-disabled` / `opacity-icon-muted` utilities
-       (and the `disabled:opacity-disabled` modifier form) from these
-       @theme declarations; the values match tokens.css line 550-551.
-
-       Consumers replace 18+ hardcoded `disabled:opacity-50` literals
-       across the primitive slice with `disabled:opacity-disabled`.
-       (Per audit U.W0.C-a §1.2 / §gap.4 — U12.)
-       ═══════════════════════════════════════════════ */
-    --opacity-disabled:   0.5;
-    --opacity-icon-muted: 0.8;
-
-    /* ═══════════════════════════════════════════════
-       text-shadow → text-shadow-* utilities (AW.W26)
-
-       text-shadow is the lone shadow family that shipped no `@theme` bridge
-       (Tailwind v4.1 minted the `text-shadow-{2xs,xs,sm,md,lg}` utilities). The
-       rungs are warm-`--shadow-color`-derived via `color-mix` per the box-shadow
-       ladder (tokens.css §7) + the cartoon-shadow precept's one-source chain, so
-       they re-tint under `.dark` BY CONSTRUCTION — `--shadow-color: var(--foreground)`
-       flips light→dark with no hardcoded `.dark` re-declaration. The hand-rolled
-       multi-stop `text-shadow:` literals in `.depth-text` (utilities.css) +
-       `.text-engraved` (typography.css) now compose these tokens. */
-    --text-shadow-2xs: 0 1px 0 color-mix(in srgb, var(--shadow-color) 12%, transparent);
-    --text-shadow-xs:  0 1px 1px color-mix(in srgb, var(--shadow-color) 16%, transparent);
-    --text-shadow-sm:  0 1px 0 color-mix(in srgb, var(--shadow-color) 14%, transparent),
-                       0 2px 3px color-mix(in srgb, var(--shadow-color) 18%, transparent);
-    --text-shadow-md:  0 1px 0 color-mix(in srgb, var(--shadow-color) 16%, transparent),
-                       0 2px 4px color-mix(in srgb, var(--shadow-color) 20%, transparent),
-                       0 4px 8px color-mix(in srgb, var(--shadow-color) 14%, transparent);
-    --text-shadow-lg:  0 1px 0 color-mix(in srgb, var(--shadow-color) 18%, transparent),
-                       0 2px 4px color-mix(in srgb, var(--shadow-color) 22%, transparent),
-                       0 6px 12px color-mix(in srgb, var(--shadow-color) 18%, transparent);
-
-    /* Two IDENTITY text-shadow tokens — the hard offset STAMP (`.depth-text`)
-       + the two-stop EMBOSS (`.text-engraved`). These hold the multi-stop
-       literals INSIDE the `@theme` defs so the utilities compose `var(--text-shadow-*)`
-       and no raw `text-shadow:` literal survives in `utilities.css`/`typography.css`
-       (AW.W26 gate 4). Both are `--shadow-color`/surface-tint-derived, so they
-       re-tint under `.dark` BY CONSTRUCTION. */
-    --text-shadow-depth: 1px 1px 0 var(--shadow),
-                         2px 2px 0 var(--shadow),
-                         3px 3px 0 var(--shadow),
-                         4px 4px 0 var(--shadow),
-                         5px 5px 0 var(--shadow),
-                         5px 5px 1px color-mix(in srgb, var(--shadow-color) 10%, transparent),
-                         2px 2px 2px color-mix(in srgb, var(--shadow-color) 20%, transparent),
-                         4px 4px 5px color-mix(in srgb, var(--shadow-color) 25%, transparent),
-                         6px 6px 10px color-mix(in srgb, var(--shadow-color) 15%, transparent);
-    --text-shadow-engraved: 0 1px 0 color-mix(in srgb, var(--background) 30%, transparent),
-                            0 -1px 0 var(--surface-tint-8);
-}
+@theme { --animate-tooltip-in: tooltip-in var(--duration-fast) var(--ease-out); --animate-fade-in: fade-in var(--duration-normal) var(--spring-smooth); --animate-scale-in: scale-in var(--duration-normal) var(--spring-smooth); --animate-slide-up: slide-up var(--duration-normal) var(--spring-smooth); --animate-dock-in: dock-in var(--duration-panel) var(--spring-snappy) both; --animate-shimmer: shimmer var(--duration-shimmer-fast) linear infinite; --animate-shimmer-sweep: shimmer-sweep var(--duration-shimmer) ease-in-out infinite; --animate-gold-shimmer: metal-shimmer-sweep var(--duration-shimmer) linear infinite; --animate-metal: metal-shimmer-sweep var(--duration-metal) linear infinite; --animate-shake: shake 0.5s ease-in-out; --opacity-disabled: 0.5; --opacity-icon-muted: 0.8; --text-shadow-2xs: 0 1px 0 color-mix(in srgb, var(--shadow-color) 12%, transparent); --text-shadow-xs: 0 1px 1px color-mix(in srgb, var(--shadow-color) 16%, transparent); --text-shadow-sm: 0 1px 0 color-mix(in srgb, var(--shadow-color) 14%, transparent), 0 2px 3px color-mix(in srgb, var(--shadow-color) 18%, transparent); --text-shadow-md: 0 1px 0 color-mix(in srgb, var(--shadow-color) 16%, transparent), 0 2px 4px color-mix(in srgb, var(--shadow-color) 20%, transparent), 0 4px 8px color-mix(in srgb, var(--shadow-color) 14%, transparent); --text-shadow-lg: 0 1px 0 color-mix(in srgb, var(--shadow-color) 18%, transparent), 0 2px 4px color-mix(in srgb, var(--shadow-color) 22%, transparent), 0 6px 12px color-mix(in srgb, var(--shadow-color) 18%, transparent); --text-shadow-depth: 1px 1px 0 var(--shadow), 2px 2px 0 var(--shadow), 3px 3px 0 var(--shadow), 4px 4px 0 var(--shadow), 5px 5px 0 var(--shadow), 5px 5px 1px color-mix(in srgb, var(--shadow-color) 10%, transparent), 2px 2px 2px color-mix(in srgb, var(--shadow-color) 20%, transparent), 4px 4px 5px color-mix(in srgb, var(--shadow-color) 25%, transparent), 6px 6px 10px color-mix(in srgb, var(--shadow-color) 15%, transparent); --text-shadow-engraved: 0 1px 0 color-mix(in srgb, var(--background) 30%, transparent), 0 -1px 0 var(--surface-tint-8); }

package/dist/styles/theme/radius.css

@@ -1,117 +1 @@
-/* theme/radius.css — the LEADING plain @theme: the radius primitives + the
-   radius semantic aliases + the corner-SHAPE axis (AZ.W-CARVE partial 1 of 4).
-
-   Plain (not inline) on purpose — the radius scale has no tokens.css twin, so
-   each `--radius-*` is the lone declaration + single override point. Inline is
-   WRONG here: it substitutes the VALUE, so two aliases resolving to one
-   primitive (`--radius-card`/`--radius-dialog` both → `--radius-2xl`) collapse
-   to an identical value and v4 drops one `rounded-*` utility when both are
-   scanned. Plain mints each alias's own var, so value-identical siblings never
-   collide. This partial MUST @import BEFORE theme/bridges.css (the inline
-   bridges reference these primitives). */
-
-/* Radius primitives — leading plain @theme (declared before the inline aliases
-   reference them; see the order note above). */
-@theme {
-    --radius: 0.625rem;
-    --radius-xs: 4px;
-    --radius-sm: 4px;
-    --radius-md: 6px;
-    --radius-xl: 12px;
-    --radius-2xl: 1rem;
-    /* AW.W3b — a finite radius rung above --radius-2xl (16px), below
-       --radius-pill (the stadium). The big-dock card shell's corner geometry. */
-    --radius-3xl: 1.5rem;
-    --radius-pill: 9999px;
-
-    /* Semantic radius aliases — plain @theme (not inline; see header note).
-       Value-identical siblings (e.g. --radius-card + --radius-dialog) would
-       collapse + drop a rounded-* utility under inline; plain mints each
-       alias's own var. */
-    --radius-lg:      var(--radius);
-    --radius-card:    var(--radius-2xl);
-    --radius-panel:   var(--radius-xl);
-    --radius-dialog:  var(--radius-2xl);
-    --radius-input:   var(--radius);
-    --radius-button:  var(--radius);
-    /* AW.W25 — form-radius unification. `--radius-field` is the non-pill field
-       rung the multi-line / stepper form atoms (Textarea, NumberFieldInput)
-       resolve so a multi-line box stops inheriting the `9999px` stadium pill;
-       single-line controls (Input, SelectTrigger) keep the pill. `--radius-control`
-       is the semantic control-corner rung that retires the raw `rounded-sm` (4px)
-       on Checkbox + base Tabs onto a softer, named radius. One geometry language
-       across the form family — token + class only, no new primitive. */
-    --radius-field:   var(--radius-2xl);
-    /* BC.W-CONTROL-SMOOTH — the small-inline-control corner rung is a STADIUM, not a
-       fixed small px. The prior `--radius-md` (6px) read SQUARE on a 16-24px control
-       (6px on a 16px box = 0.38-of-height — a rounded-rect, not a pill); the iOS-27
-       small-control silhouette is a near-stadium pill where the radius SCALES with the
-       control (clamped to half-height by `--radius-pill`'s 9999px geometry, so a 16px
-       control reads an 8px-radius pill — soft at every size). This retires the raw
-       `rounded-sm` (4px) on Checkbox + base Tabs AND the small-control square class in
-       ONE rung. The `card` toggle TILE keeps `--radius-card` (the large glass surface
-       keeps its 1rem squircle — only the small inline controls re-round). The corner-
-       SHAPE squircle axis reads at LARGE radius only (ROUND set = card+pill for small),
-       so the small pills stay ROUND (no regression). */
-    --radius-control: var(--radius-pill);
-    --radius-badge:   var(--radius-pill);
-    --radius-dock:    var(--radius-pill);
-    /* BC.W-TABS-IOS — the iOS-27 segmented-control stadium register. The pill is a
-       stadium by construction (--radius-pill clamps to half-height on a short box →
-       a true end-cap), so the tab strip stops being a squared rounded-rect. The
-       value.js DESIGN.md idiom: the role-bearing pill token, NOT a hand-rolled
-       `rounded-full`. A consumer retunes the tab geometry via `:root { --radius-tab }`. */
-    --radius-tab:     var(--radius-pill);
-    /* AW.W3b — the big-dock card shell's default (comfortable-density) radius.
-       The density-scaled --dock-card-radius (dock.css) resolves through this. */
-    --radius-dock-card: var(--radius-3xl);
-    --radius-tooltip: var(--radius-lg);
-
-    /* ── AX.W56 — the corner-SHAPE axis (parallel to the corner-RADIUS ladder above).
-       `corner-shape` only changes the CURVE within the `border-radius` box; the
-       region is still the `--radius-*` token. These are plain @theme (the radius
-       siblings' rationale applies — each alias is its own override point, and the
-       semantic shapes are value-identical keywords that must not collapse under
-       inline). Chrome 139+ only (~65% global May 2026); the un-gated `border-radius`
-       round stays the cross-engine CONTRACT and the `@supports (corner-shape:
-       superellipse(2))` gate (glass.css/dock.css) is the PE tier. NEVER make
-       corner-shape the contract — Safari/Firefox have no positive signal through 2026.
-
-       Superellipse exponent (MDN authoritative): `superellipse(K)` paints
-       |x|^(2K) + |y|^(2K) = 1, so the curve exponent n = 2K. The CSS `squircle`
-       keyword == `superellipse(2)` == n=4 — the iOS-idiomatic web squircle. The
-       k-PRIMITIVE band (a consumer dials 1.7–2.4 to taste; W42's dock-morph calc()s
-       its animated k against this ONE vocabulary — do not re-define a second k).
-       (BB.W-DEAD-SWEEP re-ground: --corner-k-soft / --corner-k-sharp have no
-       runtime var() consumer but ARE pinned by proof:squircle-language (the
-       TOKEN-AXIS-EXISTS clause asserts both rungs are minted) — so KEPT, not
-       swept; the clean-break delete is a coordination follow-up once the gate
-       re-anchors.) */
-    --corner-k-squircle: 2;   /* the squircle — superellipse(2), n=4               */
-    --corner-k-soft:     1.7; /* gentler, between round and squircle — n≈3.4       */
-    --corner-k-sharp:    2.4; /* crisper square-bias for large surfaces — n≈4.8    */
-
-    /* Semantic per-surface SHAPE aliases — the rounded-vs-squircle POLICY (a
-       RADIUS-THRESHOLD policy: the superellipse only READS at a LARGE radius
-       ~--radius-xl/12px and up). ROUND set = card, pill (small controls + data
-       cards + stadium pills — the superellipse is imperceptible, dropping it is
-       free). SQUIRCLE set = bigdock, dialog, sheet, panel, hero (the large-radius
-       glass overlays where the iOS-26 silhouette reads — the blur halo + cartoon
-       under-shadow follow the shape). ALL ride the ONE --corner-k-squircle vocab.
-       W56b (USER-DECISION R1) extended the family off big-dock-only onto the large
-       glass overlays; @supports-gated in glass/squircle.css over the `border-radius`
-       round CONTRACT. A consumer dials any surface back to round (or opts one in) by
-       re-pointing its `--corner-shape-<surface>` alias. */
-    --corner-shape-card:    round;
-    --corner-shape-pill:    round;
-    --corner-shape-bigdock: superellipse(var(--corner-k-squircle));
-    --corner-shape-dialog:  superellipse(var(--corner-k-squircle));
-    --corner-shape-sheet:   superellipse(var(--corner-k-squircle));
-    --corner-shape-panel:   superellipse(var(--corner-k-squircle));
-    --corner-shape-hero:    superellipse(var(--corner-k-squircle));
-    /* AX.W59 — the spectrum slider's track-height thumb reads as a SQUIRCLE
-       (the iOS color-picker idiom). It rides the same --corner-k-squircle
-       vocabulary; @supports-gated in Slider.vue over a --radius-* round
-       fallback. A consumer dials it to round (a circular knob) or to soft. */
-    --corner-shape-thumb:   superellipse(var(--corner-k-squircle));
-}
+@theme { --radius: 0.625rem; --radius-xs: 4px; --radius-sm: 4px; --radius-md: 6px; --radius-xl: 12px; --radius-2xl: 1rem; --radius-3xl: 1.5rem; --radius-pill: 9999px; --radius-lg: var(--radius); --radius-card: var(--radius-2xl); --radius-panel: var(--radius-xl); --radius-dialog: var(--radius-2xl); --radius-input: var(--radius); --radius-button: var(--radius); --radius-field: var(--radius-2xl); --radius-strip: 0.75rem; --radius-control: var(--radius-pill); --radius-badge: var(--radius-pill); --radius-dock: var(--radius-pill); --radius-tab: var(--radius-pill); --radius-dock-card: var(--radius-3xl); --radius-tooltip: var(--radius-lg); --radius-floor: var(--radius-xs); --radius-ctx: var(--radius-card); --radius-inset: 0px; --corner-k-squircle: 2; --corner-k-soft: 1.7; --corner-k-sharp: 2.4; --corner-shape-bigdock: superellipse(var(--corner-k-squircle)); --corner-shape-dialog: superellipse(var(--corner-k-squircle)); --corner-shape-sheet: superellipse(var(--corner-k-squircle)); --corner-shape-panel: superellipse(var(--corner-k-squircle)); --corner-shape-thumb: superellipse(var(--corner-k-squircle)); }