diff --git a/.gitignore b/.gitignore index fd3a6482..f696a5a2 100644 --- a/.gitignore +++ b/.gitignore @@ -50,6 +50,8 @@ tsconfig.tsbuildinfo # Agents .claude +# local-markdown issue tracker (docs/agents/issue-tracker.md) — machine-local +.scratch/ .roadmap .playwright-mcp # Per-machine MCP server wiring: the entries carry absolute paths to this @@ -77,6 +79,9 @@ e2e/packed-app/.staging/ # made the deliverable un-commitable; children-glob + negation instead) docs/* !docs/standalone-extraction.md +# agent-skills repo config (issue tracker, triage labels, domain docs) SHIPS — +# referenced from AGENTS.md § Agent skills +!docs/agents/ .codex # contract-change campaign ratchet artifacts — enforcement hooks were never diff --git a/AGENTS.md b/AGENTS.md index 02355001..511156d0 100644 --- a/AGENTS.md +++ b/AGENTS.md @@ -186,6 +186,20 @@ End-of-work mutating cleanup at `scripts/hygiene/`. Never CI-invoked. See [`scri - Escalate to OpenSpec only for a durable public contract, architectural or dependency decision, migration, or genuinely cross-cutting behavior change. +## Agent skills + +### Issue tracker + +Issues live as local markdown under `.scratch//` in this repo. See `docs/agents/issue-tracker.md`. + +### Triage labels + +Five canonical triage roles, mapped to this repo's label strings in `docs/agents/triage-labels.md`. + +### Domain docs + +Multi-context: root `CONTEXT-MAP.md` + per-package `CONTEXT.md` and `docs/adr/`. See `docs/agents/domain.md`. + ### Output Distillation diff --git a/README.md b/README.md index 927e8dd9..c7a55386 100644 --- a/README.md +++ b/README.md @@ -8,35 +8,6 @@ A design system builder where the TypeScript types ARE the product. Define compo No Emotion. No styled-components. No runtime style injection. The builder chain compiles to static CSS via `@layer`, extracted by a Rust pipeline. -```tsx -import { ds } from './ds'; - -const Card = ds - .styles({ - padding: '{space.md}', - borderRadius: 8, - backgroundColor: '{colors.surface}', - }) - .variant({ - elevation: { - prop: 'elevation', - variants: { - flat: { boxShadow: 'none' }, - raised: { boxShadow: '{shadows.sm}' }, - floating: { boxShadow: '{shadows.lg}' }, - }, - }, - }) - .states({ - disabled: { opacity: 0.5, pointerEvents: 'none' }, - }) - .system({ surface: true, space: true }) - .asElement('div'); - -// Fully typed — elevation, disabled, + all surface and space props -; -``` - ## Install ```bash @@ -58,112 +29,19 @@ Not on Vite or Next? The transform host (`@animus-ui/unplugin`) and the resolution, the artifact set, exit codes, and a copy-pasteable rollup quickstart. -## Setup - -Two files define your design system: - -**`theme.ts`** — define your theme: - -```tsx -import { createTheme } from '@animus-ui/system'; - -export const theme = createTheme() - .addBreakpoints({ sm: 480, md: 768, lg: 1024 }) - .addColors({ - gray: { 50: '#fafafa', 500: '#555', 900: '#080808' }, - blue: { 400: '#3d94ff', 700: '#003d99' }, - }) - .addColorModes('dark', { - dark: { - primary: 'blue.400', - bg: 'gray.900', - text: 'gray.50', - }, - light: { - primary: 'blue.700', - bg: 'gray.50', - text: 'gray.900', - }, - }) - .addScale({ - name: 'space', - values: { sm: '0.5rem', md: '1rem', lg: '1.5rem' }, - }) - .build(); - -// Type augmentation — token names autocomplete everywhere -type AppTheme = typeof theme; - -declare module '@animus-ui/system' { - interface Theme extends AppTheme {} -} -``` - -**`ds.ts`** — configure your system: - -```tsx -import { createSystem } from '@animus-ui/system'; -import { - space, - color, - typography, - layout, - flex, - border, - shadows, - background, -} from '@animus-ui/system/groups'; - -// Pre-built groups compose into your own semantic groups -export const { system: ds, createGlobalStyles } = createSystem() - .addGroup('surface', { ...color, ...border, ...shadows, ...background }) - .addGroup('space', space) - .addGroup('text', typography) - .addGroup('arrange', { ...flex, ...layout }) - .build(); -``` - -Consuming a published design-system kit? `.extend()` (available on both -builders, first in the chain) merges the kit's registries and tokens into -yours — its props type-check, extract, and resolve through your single merged -config, and your local definitions win on conflict: - -```tsx -import { system as kitSystem, theme as kitTheme } from '@acme/kit'; +## Documentation -export const theme = createTheme().extend(kitTheme).build(); -export const { system: ds } = createSystem().extend(kitSystem).build(); -``` +Deliberately withheld. The system-definition API is still settling +(vocabulary registration: `build()` → register → `seal()`), and written +guides repeatedly drifted into teaching shapes the current pipeline +rejects. Rather than keep wrong docs, they are removed until the API +freezes. Until then, the sources of truth are: -**`vite.config.ts`**: - -```tsx -import react from '@vitejs/plugin-react'; -import { animusExtract } from '@animus-ui/vite-plugin'; -import { defineConfig } from 'vite'; - -export default defineConfig({ - plugins: [react(), animusExtract({ system: './src/ds.ts' })], -}); -``` - -Using Svelte 5? See the [Svelte guide](packages/showcase/src/content/advanced/svelte.mdx) -for the native `.attrs()` and element-spread authoring pattern, and -[e2e/svelte-app](e2e/svelte-app/src/App.svelte) for the working consumer. - -## The Builder Chain - -Each method maps to a CSS `@layer`. The type system enforces the ordering. - -``` -ds.styles() → @layer base always-on styles - .variant() → @layer variants prop-driven variations - .compound() → @layer compounds variant combinations - .states() → @layer states boolean interaction states - .system() → @layer system opt into prop groups (space, color, etc.) - .props() → @layer custom component-scoped dynamic props - .asElement() → seal as typed React component -``` +- the packages' TypeScript definitions — the types are the contract; +- the in-repo consumers, which are compiled, extracted, and asserted on + every verify run and therefore cannot silently drift: + `packages/test-ds/src/system.ts` (a kit), the `e2e/*/src/ds.ts` apps, + and `packages/showcase/src/ds.ts` with its live Examples pages. ## Packages @@ -177,14 +55,6 @@ ds.styles() → @layer base always-on styles | [`@animus-ui/extract`](packages/extract) | Rust/NAPI extraction engine + the shared extraction session every driver (plugins, host, CLI) drives | | [`@animus-ui/properties`](packages/properties) | CSS property data (transitive dep of system) | -## Key Ideas - -- **Compiler completeness**: If the types accept it, the pipeline extracts it. No silent failures for well-typed code. -- **Token refs**: `'{colors.primary}'` resolves to `var(--color-primary)` at build time. Color modes shift the value automatically. -- **Pre-built groups**: Import `space`, `color`, `typography`, etc. from `@animus-ui/system/groups` and compose them into your own semantic groups. -- **Slot composition**: `compose()` wires components into families with shared variant propagation via React context. -- **Terminals**: `.asElement('div')` for HTML elements, `.asComponent(Existing)` for wrapping React components. Both produce typed, extractable output. - ## Legacy `@animus-ui/core` and `@animus-ui/theming` are the original Emotion-based packages. They are pinned at their last published versions and no longer actively developed. diff --git a/docs/agents/domain.md b/docs/agents/domain.md new file mode 100644 index 00000000..3d0cce40 --- /dev/null +++ b/docs/agents/domain.md @@ -0,0 +1,44 @@ +# Domain Docs + +How the engineering skills should consume this repo's domain documentation when exploring the codebase. + +## Before exploring, read these + +- **`CONTEXT-MAP.md`** at the repo root — it points at one `CONTEXT.md` per context. Read each one relevant to the topic. +- **`docs/adr/`** — read ADRs that touch the area you're about to work in. Also check `packages//docs/adr/` for context-scoped decisions. + +If any of these files don't exist, **proceed silently**. Don't flag their absence; don't suggest creating them upfront. The `/domain-modeling` skill (reached via `/grill-with-docs` and `/improve-codebase-architecture`) creates them lazily when terms or decisions actually get resolved. + +## File structure + +This is a multi-context repo. Contexts are packages under `packages/`, not `src/` subdirectories: + +``` +/ +├── CONTEXT-MAP.md +├── docs/adr/ ← system-wide decisions +├── packages/ +│ ├── extract/ +│ │ ├── CONTEXT.md +│ │ └── docs/adr/ ← context-specific decisions +│ └── system/ +│ ├── CONTEXT.md +│ └── docs/adr/ +└── e2e/ ← consumer fixtures; no contexts of their own +``` + +## Relationship to OpenSpec + +`openspec/specs/` (local, gitignored) is the authoritative requirement surface for behavior contracts in this repo. ADRs record architectural rationale and trade-offs, not requirements — when a decision is already owned by an openspec spec, link to it rather than duplicating it. Flag conflicts with a spec the same way as ADR conflicts (below). + +## Use the glossary's vocabulary + +When your output names a domain concept (in an issue title, a refactor proposal, a hypothesis, a test name), use the term as defined in `CONTEXT.md`. Don't drift to synonyms the glossary explicitly avoids. + +If the concept you need isn't in the glossary yet, that's a signal — either you're inventing language the project doesn't use (reconsider) or there's a real gap (note it for `/domain-modeling`). + +## Flag ADR conflicts + +If your output contradicts an existing ADR, surface it explicitly rather than silently overriding: + +> _Contradicts ADR-0007 (event-sourced orders) — but worth reopening because…_ diff --git a/docs/agents/issue-tracker.md b/docs/agents/issue-tracker.md new file mode 100644 index 00000000..fbda5e04 --- /dev/null +++ b/docs/agents/issue-tracker.md @@ -0,0 +1,30 @@ +# Issue tracker: Local Markdown + +Issues and specs for this repo live as markdown files in `.scratch/`. + +## Conventions + +- One feature per directory: `.scratch//` +- The spec is `.scratch//spec.md` +- Implementation issues are one file per ticket at `.scratch//issues/-.md`, numbered from `01` — never a single combined tickets file +- Triage state is recorded as a `Status:` line near the top of each issue file (see `triage-labels.md` for the role strings) +- Comments and conversation history append to the bottom of the file under a `## Comments` heading + +## When a skill says "publish to the issue tracker" + +Create a new file under `.scratch//` (creating the directory if needed). + +## When a skill says "fetch the relevant ticket" + +Read the file at the referenced path. The user will normally pass the path or the issue number directly. + +## Wayfinding operations + +Used by `/wayfinder`. The **map** is a file with one **child** file per ticket. + +- **Map**: `.scratch//map.md` — the Notes / Decisions-so-far / Fog body. +- **Child ticket**: `.scratch//issues/NN-.md`, numbered from `01`, with the question in the body. A `Type:` line records the ticket type (`research`/`prototype`/`grilling`/`task`); a `Status:` line records `claimed`/`resolved`. +- **Blocking**: a `Blocked by: NN, NN` line near the top. A ticket is unblocked when every file it lists is `resolved`. +- **Frontier**: scan `.scratch//issues/` for files that are open, unblocked, and unclaimed; first by number wins. +- **Claim**: set `Status: claimed` and save before any work. +- **Resolve**: append the answer under an `## Answer` heading, set `Status: resolved`, then append a context pointer (gist + link) to the map's Decisions-so-far in `map.md`. diff --git a/docs/agents/triage-labels.md b/docs/agents/triage-labels.md new file mode 100644 index 00000000..b716855d --- /dev/null +++ b/docs/agents/triage-labels.md @@ -0,0 +1,15 @@ +# Triage Labels + +The skills speak in terms of five canonical triage roles. This file maps those roles to the actual label strings used in this repo's issue tracker. + +| Label in mattpocock/skills | Label in our tracker | Meaning | +| -------------------------- | -------------------- | ---------------------------------------- | +| `needs-triage` | `needs-triage` | Maintainer needs to evaluate this issue | +| `needs-info` | `needs-info` | Waiting on reporter for more information | +| `ready-for-agent` | `ready-for-agent` | Fully specified, ready for an AFK agent | +| `ready-for-human` | `ready-for-human` | Requires human implementation | +| `wontfix` | `wontfix` | Will not be actioned | + +When a skill mentions a role (e.g. "apply the AFK-ready triage label"), use the corresponding label string from this table. + +Edit the right-hand column to match whatever vocabulary you actually use. diff --git a/e2e/next-app/src/ds.ts b/e2e/next-app/src/ds.ts index 4dd4864d..fe337049 100644 --- a/e2e/next-app/src/ds.ts +++ b/e2e/next-app/src/ds.ts @@ -202,11 +202,7 @@ declare module '@animus-ui/system' { // (showcase remains on `includes:` pending its deferred migration — // registry row 13; see its ds.ts). Do not migrate this lane until removal // is specced. -export const { - system: ds, - createGlobalStyles, - createKeyframes, -} = createSystem({ +const bundle = createSystem({ includes: [testDs], }) .addGroup('space', space) @@ -216,6 +212,8 @@ export const { .addGroup('positioning', positioning) .build(); +export const { createGlobalStyles, createKeyframes } = bundle; + // ─── Keyframes ────────────────────────────────────────────── export const animations = createKeyframes({ @@ -244,3 +242,13 @@ export const globalStyles = createGlobalStyles({ a: { color: 'primary', textDecoration: 'none' }, 'code, kbd': { fontFamily: 'ui-monospace, monospace', fontSize: 14 }, }); + +// Sealed system (vocabulary-registration): `animations` registers under its +// export name. The `includes:` alias above deliberately CANNOT carry the +// kit's registered `kitMotion` — this lane is the legacy-verb witness: the +// sealed record carries the coded `animus.vocabulary.legacy-verb` entry the +// hosts surface as a warning. +export const ds = bundle + .registerKeyframes({ animations }) + .registerGlobalStyles({ globalStyles }) + .seal(); diff --git a/e2e/next16-app/src/ds.ts b/e2e/next16-app/src/ds.ts index 21499b4e..503d7ea8 100644 --- a/e2e/next16-app/src/ds.ts +++ b/e2e/next16-app/src/ds.ts @@ -163,20 +163,18 @@ declare module '@animus-ui/system' { // ─── System ───────────────────────────────────────────────── -export const { - system: ds, - createGlobalStyles, - createKeyframes, - // extend()-form lane (openspec: first-class-extension, D1): test-ds's - // registries MERGE into this system — the kit alone provides the space/ - // layout/text/surface/positioning groups the components use. The only - // LOCAL registration is the additive, transform-free `shadows` prop set - // (boxShadow/shadow/textShadow — the kit does not register them, and the - // Card/Button styles resolve their `shadows`-scale values through the - // registry). Re-spreading kit groups would coalesce under D12 transform - // equality (name + captured source); this lane stays pure-extend + additive - // as the recommended consumption shape. -} = createSystem().extend(testDs).addProps(shadows).build(); +// extend()-form lane (openspec: first-class-extension, D1): test-ds's +// registries MERGE into this system — the kit alone provides the space/ +// layout/text/surface/positioning groups the components use. The only +// LOCAL registration is the additive, transform-free `shadows` prop set +// (boxShadow/shadow/textShadow — the kit does not register them, and the +// Card/Button styles resolve their `shadows`-scale values through the +// registry). Re-spreading kit groups would coalesce under D12 transform +// equality (name + captured source); this lane stays pure-extend + additive +// as the recommended consumption shape. +const bundle = createSystem().extend(testDs).addProps(shadows).build(); + +export const { createGlobalStyles, createKeyframes } = bundle; // ─── Keyframes ────────────────────────────────────────────── @@ -206,3 +204,11 @@ export const globalStyles = createGlobalStyles({ a: { color: 'primary', textDecoration: 'none' }, 'code, kbd': { fontFamily: 'ui-monospace, monospace', fontSize: 14 }, }); + +// Sealed system (vocabulary-registration): `animations` registers under its +// export name; the kit's `kitMotion` arrives through the sealed test-ds +// record via `.extend()`. +export const ds = bundle + .registerKeyframes({ animations }) + .registerGlobalStyles({ globalStyles }) + .seal(); diff --git a/e2e/packed-app/src/ds.ts b/e2e/packed-app/src/ds.ts index 07670159..6b3f549f 100644 --- a/e2e/packed-app/src/ds.ts +++ b/e2e/packed-app/src/ds.ts @@ -66,11 +66,7 @@ declare module '@animus-ui/system' { interface Theme extends PackedAppTheme {} } -export const { - system: ds, - createGlobalStyles, - createKeyframes, -} = createSystem() +const bundle = createSystem() .addGroup('space', space) .addGroup('layout', { ...layout, ...flex }) .addGroup('text', typography) @@ -78,6 +74,8 @@ export const { .addGroup('positioning', positioning) .build(); +export const { createGlobalStyles, createKeyframes } = bundle; + export const globalStyles = createGlobalStyles({ '*, *::before, *::after': { boxSizing: 'border-box' }, body: { @@ -98,3 +96,10 @@ export const animations = createKeyframes({ '50%': { transform: 'scale(1.05)' }, }, }); + +// Sealed system (vocabulary-registration): `animations` registers under +// its export name; registration closes at seal(). +export const ds = bundle + .registerKeyframes({ animations }) + .registerGlobalStyles({ globalStyles }) + .seal(); diff --git a/e2e/react-router-app/src/ds.ts b/e2e/react-router-app/src/ds.ts index 476639ed..9d6e9a77 100644 --- a/e2e/react-router-app/src/ds.ts +++ b/e2e/react-router-app/src/ds.ts @@ -79,7 +79,7 @@ declare module '@animus-ui/system' { // vite-app/next16-app/vinext-app use `.extend()` (showcase remains on // `includes:` pending its deferred migration — registry row 13; see its // ds.ts). Do not migrate this lane until removal is specced. -export const { system: ds, createGlobalStyles } = createSystem() +const bundle = createSystem() .from(testDs) .addGroup('space', space) .addGroup('layout', { ...layout, ...flex }) @@ -87,6 +87,8 @@ export const { system: ds, createGlobalStyles } = createSystem() .addGroup('surface', { ...color, ...border }) .build(); +export const { createGlobalStyles } = bundle; + export const globalStyles = createGlobalStyles({ '*, *::before, *::after': { boxSizing: 'border-box' }, body: { @@ -96,3 +98,9 @@ export const globalStyles = createGlobalStyles({ fontFamily: 'system-ui, sans-serif', }, }); + +// Sealed system (vocabulary-registration): the `from()` verb above cannot +// carry the kit's registered `kitMotion` — this lane is the from()-side +// legacy-verb witness (`animus.vocabulary.legacy-verb` on the sealed +// record, surfaced by the host as a warning). +export const ds = bundle.registerGlobalStyles({ globalStyles }).seal(); diff --git a/e2e/rollup-app/fixtures/ds-standalone.ts b/e2e/rollup-app/fixtures/ds-standalone.ts index 869b1afd..ab8942a7 100644 --- a/e2e/rollup-app/fixtures/ds-standalone.ts +++ b/e2e/rollup-app/fixtures/ds-standalone.ts @@ -6,8 +6,9 @@ export const theme = createTheme() .addColors({ gray: { 100: '#f5f5f5' } }) .build(); -export const { system: ds } = createSystem() +export const ds = createSystem() .addGroup('color', { color: { property: 'color', scale: 'colors' }, }) - .build(theme); + .build(theme) + .seal(); diff --git a/e2e/rollup-app/fixtures/error-root/ds.ts b/e2e/rollup-app/fixtures/error-root/ds.ts index abb88829..b36b04b9 100644 --- a/e2e/rollup-app/fixtures/error-root/ds.ts +++ b/e2e/rollup-app/fixtures/error-root/ds.ts @@ -15,11 +15,12 @@ const badGlow = createTransform('badGlow', (value) => ({ boxShadow: String(value), })); -export const { system: ds } = createSystem() +export const ds = createSystem() .addGroup('fx', { glow: { property: 'boxShadow', transform: badGlow, }, }) - .build(theme); + .build(theme) + .seal(); diff --git a/e2e/rollup-app/fixtures/watch-root/src/ds.ts b/e2e/rollup-app/fixtures/watch-root/src/ds.ts index c685b8ed..d4f8190b 100644 --- a/e2e/rollup-app/fixtures/watch-root/src/ds.ts +++ b/e2e/rollup-app/fixtures/watch-root/src/ds.ts @@ -16,11 +16,12 @@ const badGlow = createTransform('badGlow', (value) => ({ boxShadow: String(value), })); -export const { system: ds } = createSystem() +export const ds = createSystem() .addGroup('fx', { glow: { property: 'boxShadow', transform: badGlow, }, }) - .build(theme); + .build(theme) + .seal(); diff --git a/e2e/rollup-app/src/ds.ts b/e2e/rollup-app/src/ds.ts index 7eedd8f2..aa1df8ef 100644 --- a/e2e/rollup-app/src/ds.ts +++ b/e2e/rollup-app/src/ds.ts @@ -80,28 +80,24 @@ declare module '@animus-ui/system' { interface Theme extends RollupAppTheme {} } -export const { - system: ds, - createGlobalStyles, - createKeyframes, - // extend()-form witness (openspec: first-class-extension, D1/NS-1): this - // lane consumes test-ds through the single extension verb — a REAL registry - // merge. EVERY group here (space, layout, text, surface, positioning) and - // the kit's condition aliases arrive through `.extend(testDs)` alone; the - // app deliberately re-registers nothing, so the merged config IS the kit's - // registry surface plus the local `_motionReduce` re-assertion below. - // (Re-spreading kit groups locally would coalesce under D12 transform - // equality — name + captured source — but pure extension is the - // recommended consumption shape: the merge already provides them.) - // - // Box.tsx opts into the kit's `positioning` group and App.tsx uses - // `top`/`zIndex`, making the emitted CSS the end-to-end witness that a - // kit-registered prop flows through the MERGED config into extraction - // output (rust-system-loader › "Merged configuration is the extraction - // authority"). The legacy lanes stay deliberate elsewhere: next-app keeps - // the deprecated `includes:` alias, react-router-app keeps the deprecated - // `from()` chain (G6). -} = createSystem() +// extend()-form witness (openspec: first-class-extension, D1/NS-1): this +// lane consumes test-ds through the single extension verb — a REAL registry +// merge. EVERY group here (space, layout, text, surface, positioning) and +// the kit's condition aliases arrive through `.extend(testDs)` alone; the +// app deliberately re-registers nothing, so the merged config IS the kit's +// registry surface plus the local `_motionReduce` re-assertion below. +// (Re-spreading kit groups locally would coalesce under D12 transform +// equality — name + captured source — but pure extension is the +// recommended consumption shape: the merge already provides them.) +// +// Box.tsx opts into the kit's `positioning` group and App.tsx uses +// `top`/`zIndex`, making the emitted CSS the end-to-end witness that a +// kit-registered prop flows through the MERGED config into extraction +// output (rust-system-loader › "Merged configuration is the extraction +// authority"). The legacy lanes stay deliberate elsewhere: next-app keeps +// the deprecated `includes:` alias, react-router-app keeps the deprecated +// `from()` chain (G6). +const bundle = createSystem() .extend(testDs) // Condition alias registry (modern-css-surface inc 03). The kit already // carries `_motionReduce`; this local registration re-asserts it with an @@ -112,6 +108,8 @@ export const { }) .build(); +export const { createGlobalStyles, createKeyframes } = bundle; + export const globalStyles = createGlobalStyles( { '*, *::before, *::after': { boxSizing: 'border-box' }, @@ -151,3 +149,11 @@ export const animations = createKeyframes({ '50%': { transform: 'scale(1.05)' }, }, }); + +// Sealed system (vocabulary-registration): `animations` registers under its +// export name; the kit's `kitMotion` arrives through the sealed test-ds +// record via `.extend()`. +export const ds = bundle + .registerKeyframes({ animations }) + .registerGlobalStyles({ globalStyles }) + .seal(); diff --git a/e2e/svelte-app/src/ds.ts b/e2e/svelte-app/src/ds.ts index ab25f96e..06e2ef26 100644 --- a/e2e/svelte-app/src/ds.ts +++ b/e2e/svelte-app/src/ds.ts @@ -7,4 +7,6 @@ export const theme = /* @__PURE__ */ (() => }) .build())(); -export const { system: ds } = /* @__PURE__ */ (() => createSystem().build())(); +// Sealed system (vocabulary-registration): a vocabulary-free system seals +// too — `.seal()` is the loader's contract for every consumer. +export const ds = /* @__PURE__ */ (() => createSystem().build().seal())(); diff --git a/e2e/vinext-app/src/ds.ts b/e2e/vinext-app/src/ds.ts index cce1519d..a3a2f684 100644 --- a/e2e/vinext-app/src/ds.ts +++ b/e2e/vinext-app/src/ds.ts @@ -64,9 +64,9 @@ declare module '@animus-ui/system' { // `.extend(testDs)` alone. Nothing is re-registered locally — re-spreading // kit groups would coalesce under D12 transform equality (name + captured // source), but pure extension is the recommended consumption shape. -export const { system: ds, createGlobalStyles } = createSystem() - .extend(testDs) - .build(); +const bundle = createSystem().extend(testDs).build(); + +export const { createGlobalStyles } = bundle; export const globalStyles = createGlobalStyles({ '*, *::before, *::after': { boxSizing: 'border-box' }, @@ -77,3 +77,7 @@ export const globalStyles = createGlobalStyles({ fontFamily: 'system-ui, sans-serif', }, }); + +// Sealed system (vocabulary-registration): no local collections; the kit's +// `kitMotion` arrives through the sealed test-ds record via `.extend()`. +export const ds = bundle.registerGlobalStyles({ globalStyles }).seal(); diff --git a/e2e/vite-app/scripts/assert-build.ts b/e2e/vite-app/scripts/assert-build.ts index 8bbabf4e..c56ba537 100644 --- a/e2e/vite-app/scripts/assert-build.ts +++ b/e2e/vite-app/scripts/assert-build.ts @@ -290,8 +290,8 @@ async function main(): Promise { }); // Exactly one @keyframes block per unique frame body: the kit collection - // must emit ONCE — not once via the external-entry scan and again via the - // consumer reference — and no app body may collide. + // must emit ONCE — the sealed record delivers it a single time regardless + // of how many consumers reference it — and no app body may collide. assertKeyframesUniqueBodies(css); // Binding-backed vs inline parity (semantic-const-resolution): KitSized diff --git a/e2e/vite-app/src/components/KitPulse.tsx b/e2e/vite-app/src/components/KitPulse.tsx index 39e7fb17..d8f0ebd4 100644 --- a/e2e/vite-app/src/components/KitPulse.tsx +++ b/e2e/vite-app/src/components/KitPulse.tsx @@ -2,13 +2,14 @@ import { kitMotion } from '@animus-ui/test-ds'; import { ds } from '../ds'; -// External keyframe-collection consumer (rust-extraction-pipeline › "External -// package collection discovered from its entry"): `kitMotion` is created and -// exported by the test-ds package ENTRY module, and this component references -// it through a plain named import — the app's ds.ts does NOT re-export it. The -// extractor's keyframes scan must discover the collection from the external -// entry, resolve `kitMotion.pulse` to its `animus-kf-` name, and emit the -// matching @keyframes block exactly once. Pulse.tsx (app-local +// Sealed-kit keyframe consumer (rust-extraction-pipeline › "Sealed kit +// collection resolves in the consumer"): `kitMotion` is defined and +// registered inside test-ds's definition graph, re-exported from the package +// root, and this component references it through a plain named import — the +// app's ds.ts does NOT re-export it. The collection reaches the app through +// the sealed kit's registration record via `.extend()`; the extractor +// resolves `kitMotion.pulse` by the export name at the defining module and +// emits the matching @keyframes block exactly once. Pulse.tsx (app-local // `animations.pulse` from ds.ts) is the inline sibling in the same sheet; // assertKeyframesUniqueBodies pins that no frame body is ever emitted twice. export const KitPulse = ds diff --git a/e2e/vite-app/src/ds.ts b/e2e/vite-app/src/ds.ts index 85fb789a..48fb3357 100644 --- a/e2e/vite-app/src/ds.ts +++ b/e2e/vite-app/src/ds.ts @@ -81,8 +81,18 @@ declare module '@animus-ui/system' { interface Theme extends ViteAppTheme {} } +const bundle = createSystem() + .extend(testDs) + // Condition alias registry (modern-css-surface inc 03). The kit already + // carries `_motionReduce`; this local registration re-asserts it with an + // identical value (post-extend app calls override silently, NS-4) so the + // manifest `conditionAliases` plugin glue keeps a local witness here. + .addConditions({ + _motionReduce: '@media (prefers-reduced-motion: reduce)', + }) + .build(); + export const { - system: ds, createGlobalStyles, createKeyframes, // extend()-form witness (openspec: first-class-extension, D1/NS-1): this @@ -102,16 +112,7 @@ export const { // authority"). The legacy lanes stay deliberate elsewhere: next-app keeps // the deprecated `includes:` alias, react-router-app keeps the deprecated // `from()` chain (G6). -} = createSystem() - .extend(testDs) - // Condition alias registry (modern-css-surface inc 03). The kit already - // carries `_motionReduce`; this local registration re-asserts it with an - // identical value (post-extend app calls override silently, NS-4) so the - // manifest `conditionAliases` plugin glue keeps a local witness here. - .addConditions({ - _motionReduce: '@media (prefers-reduced-motion: reduce)', - }) - .build(); +} = bundle; export const globalStyles = createGlobalStyles( { @@ -152,3 +153,11 @@ export const animations = createKeyframes({ '50%': { transform: 'scale(1.05)' }, }, }); + +// Sealed system (vocabulary-registration): `animations` registers under its +// export name; the kit's `kitMotion` arrives through the sealed test-ds +// record via `.extend()` — no local step, and no export scan anywhere. +export const ds = bundle + .registerKeyframes({ animations }) + .registerGlobalStyles({ globalStyles }) + .seal(); diff --git a/packages/extract/crates/extract-v2/index.d.ts b/packages/extract/crates/extract-v2/index.d.ts index 789d897f..db242e22 100644 --- a/packages/extract/crates/extract-v2/index.d.ts +++ b/packages/extract/crates/extract-v2/index.d.ts @@ -140,6 +140,17 @@ export interface NapiSystemConfig { transformSources?: string globalStyleBlocks?: string keyframesBlocks?: string + /** + * Vocabulary witnesses from the sealed system's registration record: + * one JSON array of coded entries — collisions + * (`animus.vocabulary.collision`) and legacy-verb witnesses + * (`animus.vocabulary.legacy-verb`: registered vocabulary consumed + * through `from()`/`includes:`, which cannot carry it). The record is + * the witness channel (the evaluation host shims console); hosts + * surface each entry as a diagnostic keyed by its `code`. Absent when + * the record carries no witnesses. + */ + vocabularyWitnesses?: string /** * Canonical absolute paths of every module evaluated for the system * (sorted; entry included, runtime stubs excluded). The plugins use this @@ -154,14 +165,3 @@ export interface NapiSystemConfig { */ sourceThemeManifests?: string } - -/** - * Scan one module entry for named `Keyframes` collection exports — the - * keyframes-only carve-out for external package entries. The - * entry evaluates through the same loader pipeline as a system module, but - * nothing except `__brand === 'Keyframes'` exports is read from it; the - * consumer's configured system remains the singular config authority. - * Returns the `{ exportName: { keyName: { name, frames } } }` JSON, or None - * when the entry exports no collections. - */ -export declare function scanKeyframesExports(entryPath: string, rootDir: string): string | null diff --git a/packages/extract/crates/extract-v2/index.js b/packages/extract/crates/extract-v2/index.js index 1d9c4d98..ca96089a 100644 --- a/packages/extract/crates/extract-v2/index.js +++ b/packages/extract/crates/extract-v2/index.js @@ -592,4 +592,3 @@ module.exports.discoverChains = nativeBinding.discoverChains module.exports.engineVersion = nativeBinding.engineVersion module.exports.extractFacts = nativeBinding.extractFacts module.exports.loadSystemModule = nativeBinding.loadSystemModule -module.exports.scanKeyframesExports = nativeBinding.scanKeyframesExports diff --git a/packages/extract/crates/extract-v2/src/analyze_css.rs b/packages/extract/crates/extract-v2/src/analyze_css.rs index 49edc578..a4709eb8 100644 --- a/packages/extract/crates/extract-v2/src/analyze_css.rs +++ b/packages/extract/crates/extract-v2/src/analyze_css.rs @@ -4737,6 +4737,16 @@ mod tests { assert!(!out.css.contains('&'), "{}", out.css); } + #[test] + fn unregistered_keyframe_reference_severity_is_warn() { + // Deliberate warn (the spec's "skipped without aborting analysis"); + // escalation belongs to the strict-mode contract, a separate change. + assert_eq!( + diagnostic_severity_for_code(crate::eval::KEYFRAMES_UNREGISTERED_REFERENCE), + "warn" + ); + } + #[test] fn extension_child_inherits_parent_base_across_files() { let out = analyze( diff --git a/packages/extract/crates/extract-v2/src/engine.rs b/packages/extract/crates/extract-v2/src/engine.rs index 99cd6be9..d3762366 100644 --- a/packages/extract/crates/extract-v2/src/engine.rs +++ b/packages/extract/crates/extract-v2/src/engine.rs @@ -1301,11 +1301,12 @@ export const App = () => ; #[test] fn external_package_keyframes_collection_resolves_via_named_import() { - // A `Keyframes` collection discovered from an external - // package entry (delivered through keyframesJson by the loader scan) - // resolves through a regular named import — the animation-name ref - // and exactly one @keyframes block emit, identical to a consumer-entry - // collection. + // A collection registered inside an external kit's definition graph + // (carried to the consumer through the sealed kit and delivered as a + // keyframesJson record entry) resolves through a regular named + // import — the animation-name ref and exactly one @keyframes block + // emit, identical to a collection registered in the consumer's own + // definition graph. let mut engine = ExtractEngine::new(Some(EngineOptions { keyframes_json: Some( r#"{"kitMotion":{"pulse":{"name":"animus-kf-abc123","frames":{"from":{"opacity":0.4},"to":{"opacity":1}}}}}"# @@ -1467,25 +1468,152 @@ export const App = () => ; assert_eq!(manifest["usageResidue"][0]["kind"], "conditional"); } + /// Messages of every diagnostic carrying the unregistered-keyframe-reference + /// code — the witness channel for a reference the registration record + /// cannot answer. + fn unregistered_keyframe_diagnostics(manifest: &serde_json::Value) -> Vec { + manifest["diagnostics"] + .as_array() + .map(|ds| { + ds.iter() + .filter(|d| d["code"] == crate::eval::KEYFRAMES_UNREGISTERED_REFERENCE) + .map(|d| d["message"].as_str().unwrap_or_default().to_string()) + .collect() + }) + .unwrap_or_default() + } + #[test] - fn keyframes_registry_resolves_member_lookup() { - // v1 Phase 2a/2b: keyframes collections resolve `motion.ember` - // through the statics plumbing. + fn registration_key_equal_to_the_export_name_resolves_member_lookup() { + // Key identity: the record's outer key IS the module-scope export + // name the collection leaves its defining module under, so + // `animations.pulse` substitutes the content-hashed name into the + // consuming component's CSS and nothing is witnessed as missing. let mut engine = ExtractEngine::new(Some(EngineOptions { keyframes_json: Some( - r#"{"motion": {"ember": {"name": "anm-ember", "frames": "0%{}"}}}"#.to_string(), + r#"{"animations":{"pulse":{"name":"animus-kf-abc123","frames":{"from":{"opacity":0.4},"to":{"opacity":1}}}}}"# + .to_string(), ), ..Default::default() })) .unwrap(); - let out = engine - .analyze( - r#"[{"path":"system.ts","source":"export const motion = { ember: 'placeholder' };\n"}, - {"path":"a.tsx","source":"import { motion } from './system';\nexport const C = ds.styles({ animationName: motion.ember }).asElement('div');\nexport const App = () => ;\n"}]"# + let manifest: serde_json::Value = serde_json::from_str( + &engine + .analyze( + serde_json::json!([ + { "path": "system.ts", "source": "export const animations = createKeyframes({ pulse: { from: { opacity: 0.4 }, to: { opacity: 1 } } });\n" }, + { "path": "a.tsx", "source": "import { animations } from './system';\nexport const Pulse = ds.styles({ animationName: animations.pulse }).asElement('span');\nexport const App = () => ;\n" } + ]) .to_string(), - ) - .unwrap(); - assert!(out.contains("anm-ember"), "{out}"); + ) + .unwrap(), + ) + .unwrap(); + + let css = manifest["css"].as_str().unwrap_or(""); + assert!( + css.contains("animation-name:animus-kf-abc123") + || css.contains("animation-name: animus-kf-abc123"), + "{css}" + ); + let global = manifest["sheets"]["global"].as_str().unwrap_or(""); + assert_eq!( + global.matches("@keyframes animus-kf-abc123").count(), + 1, + "{global}" + ); + // Negative control: a resolving reference is not witnessed as missing. + assert!( + unregistered_keyframe_diagnostics(&manifest).is_empty(), + "{manifest}" + ); + } + + #[test] + fn registration_key_mismatched_with_the_export_name_skips_and_is_witnessed() { + // Registered under `motion`, exported as `animations`. The engine + // resolves by EXPORT name, so the reference finds no record entry: + // the property drops AND the coded diagnostic names the binding — + // the mismatch is not a silent miss. + let mut engine = ExtractEngine::new(Some(EngineOptions { + keyframes_json: Some( + r#"{"motion":{"pulse":{"name":"animus-kf-abc123","frames":{"from":{"opacity":0.4},"to":{"opacity":1}}}}}"# + .to_string(), + ), + ..Default::default() + })) + .unwrap(); + let manifest: serde_json::Value = serde_json::from_str( + &engine + .analyze( + serde_json::json!([ + { "path": "system.ts", "source": "export const animations = createKeyframes({ pulse: { from: { opacity: 0.4 }, to: { opacity: 1 } } });\n" }, + { "path": "a.tsx", "source": "import { animations } from './system';\nexport const Pulse = ds.styles({ animationName: animations.pulse }).asElement('span');\nexport const App = () => ;\n" } + ]) + .to_string(), + ) + .unwrap(), + ) + .unwrap(); + + let css = manifest["css"].as_str().unwrap_or(""); + assert!(!css.contains("animation-name"), "{css}"); + let coded = unregistered_keyframe_diagnostics(&manifest); + assert_eq!(coded.len(), 1, "{coded:?}"); + assert!(coded[0].contains("animationName"), "{}", coded[0]); + assert!(coded[0].contains("animations.pulse"), "{}", coded[0]); + // Analysis continues: the component still extracts. + assert!(!manifest["components"].as_object().unwrap().is_empty()); + // Pinned (inc-04 review objection 3, pre-existing behavior): the + // record entry still emits its `@keyframes` block into the global + // sheet even though nothing can reference it — a dead block, not a + // missing one. If this pin starts failing because orphan emission + // was removed, that is an improvement; retire the pin deliberately. + let global_sheet = manifest["sheets"]["global"].as_str().unwrap_or(""); + assert!( + global_sheet.contains("@keyframes animus-kf-abc123"), + "registered-but-unreferenced collections currently emit dead CSS: {global_sheet}" + ); + } + + #[test] + fn record_entry_wins_over_a_same_named_static_export() { + // Precedence witness (inc-04 review objection 8): the registration + // record's entry OVERWRITES a statically-foldable export of the + // same name in the statics map (`static_exports_by_file` inserts + // first, the record second — last write wins). A plain-object + // export `motion` must not shadow the registered collection. + let mut engine = ExtractEngine::new(Some(EngineOptions { + keyframes_json: Some( + r#"{"motion":{"ember":{"name":"animus-kf-abc123","frames":{"from":{"opacity":0.4},"to":{"opacity":1}}}}}"# + .to_string(), + ), + ..Default::default() + })) + .unwrap(); + let manifest: serde_json::Value = serde_json::from_str( + &engine + .analyze( + serde_json::json!([ + { "path": "system.ts", "source": "export const motion = { ember: 'placeholder' };\n" }, + { "path": "a.tsx", "source": "import { motion } from './system';\nexport const Ember = ds.styles({ animationName: motion.ember }).asElement('span');\nexport const App = () => ;\n" } + ]) + .to_string(), + ) + .unwrap(), + ) + .unwrap(); + + let css = manifest["css"].as_str().unwrap_or(""); + assert!( + css.contains("animation-name:animus-kf-abc123") + || css.contains("animation-name: animus-kf-abc123"), + "the record entry must win: {css}" + ); + assert!( + !css.contains("placeholder"), + "the static export must be shadowed by the record: {css}" + ); } #[test] diff --git a/packages/extract/crates/extract-v2/src/eval.rs b/packages/extract/crates/extract-v2/src/eval.rs index 4949281e..bd8bcebf 100644 --- a/packages/extract/crates/extract-v2/src/eval.rs +++ b/packages/extract/crates/extract-v2/src/eval.rs @@ -44,6 +44,19 @@ pub struct SkippedProperty { /// attribute value (nothing to anchor the class to). pub const SELECTOR_UNSUPPORTED_SUBJECT: &str = "animus.selector.unsupported-subject"; +/// Stable diagnostic code for an `object.property` reference whose base +/// binding carries no entry in the system's keyframe registration record. +/// Registration is the only channel that puts a collection in front of the +/// extractor, so a reference the record cannot answer is an authoring +/// mistake with a specific repair — distinct in kind from the generic +/// dynamic-value per-property skip, which has none. +/// +/// Severity: WARN, deliberately (the spec's "skipped without aborting +/// analysis") — `diagnostic_severity_for_code`'s default arm applies; +/// escalation belongs to the strict-mode contract, which is a separate +/// change. Severity-pinned in the analyze_css test module. +pub const KEYFRAMES_UNREGISTERED_REFERENCE: &str = "animus.keyframes.unregistered-reference"; + /// True when a style key looks selector-shaped (`&` present) but carries no /// substitutable subject — every `&` is inside quotes. pub(crate) fn unsupported_selector_key(key: &str) -> bool { @@ -87,6 +100,29 @@ pub fn eval_object_expr( pub fn eval_object_expr_with_statics( obj: &ObjectExpression<'_>, static_values: Option<&FxHashMap>, +) -> Result<(Value, Vec, Vec), BailError> { + eval_object_expr_scoped(obj, static_values, false) +} + +/// The recursive core, carrying keyframe ELIGIBILITY: whether the value +/// position being evaluated sits under an animation-name property +/// (`animationName`/`animation`), directly or through any nested block — +/// responsive maps (`animationName: { _: ref, sm: ref }`), selector and +/// at-rule blocks all inherit the owning property's eligibility. Only +/// eligible positions may carry the `KEYFRAMES_UNREGISTERED_REFERENCE` +/// code (a keyframes-coded diagnostic on `color: palette.brand` would +/// re-create the false-alarm class registration eliminates); the decision +/// is made where the reason is MINTED, never by post-hoc string surgery. +/// Property-name authority note: the type surface widens `KeyframeRef` +/// onto `animationName` only (`PassThroughProp<'animationName'>` in +/// packages/system/src/types/config.ts); `animation` is admitted here +/// because the shorthand can embed a keyframe name, and the kebab twins +/// (`animation-name`) are deliberately absent — quoted-kebab authoring is +/// outside the typed surface and gets the neutral reason. +fn eval_object_expr_scoped( + obj: &ObjectExpression<'_>, + static_values: Option<&FxHashMap>, + keyframes_eligible: bool, ) -> Result<(Value, Vec, Vec), BailError> { let mut map = Map::new(); let mut skipped = Vec::new(); @@ -104,6 +140,8 @@ pub fn eval_object_expr_with_statics( } let key = eval_property_key(&prop.key)?; + let eligible = keyframes_eligible + || matches!(key.as_str(), "animationName" | "animation"); // Selector-shaped keys whose every `&` is quoted have no // substitutable subject: record a coded skip instead of @@ -140,7 +178,7 @@ pub fn eval_object_expr_with_statics( // Handle nested objects directly to propagate inner captures if let Expression::ObjectExpression(inner_obj) = &prop.value { - match eval_object_expr_with_statics(inner_obj, static_values) { + match eval_object_expr_scoped(inner_obj, static_values, eligible) { Ok((value, inner_skips, inner_captured)) => { skipped.extend(inner_skips); // Prefix inner captures with the outer key @@ -162,7 +200,12 @@ pub fn eval_object_expr_with_statics( } // Try to evaluate the value. On failure, skip this property. - match eval_expression_with_statics(&prop.value, &mut skipped, static_values) { + match eval_expression_scoped( + &prop.value, + &mut skipped, + static_values, + eligible, + ) { Ok(value) => { map.insert(key, value); } @@ -209,6 +252,17 @@ pub(crate) fn eval_expression_with_statics( expr: &Expression<'_>, skips: &mut Vec, static_values: Option<&FxHashMap>, +) -> Result { + eval_expression_scoped(expr, skips, static_values, false) +} + +/// The recursive expression core, carrying keyframe eligibility (see +/// `eval_object_expr_scoped`). +fn eval_expression_scoped( + expr: &Expression<'_>, + skips: &mut Vec, + static_values: Option<&FxHashMap>, + keyframes_eligible: bool, ) -> Result { // `as`/`satisfies`/non-null/parens are erased type-level syntax: a wrapped // expression evaluates exactly like its operand (semantic-const-resolution, @@ -260,7 +314,7 @@ pub(crate) fn eval_expression_with_statics( // Note: captures from nested objects are discarded here — this path is // only reached for non-object properties in eval_object_expr (objects are // handled directly). This path remains for eval_array_element contexts. - match eval_object_expr_with_statics(obj, static_values) { + match eval_object_expr_scoped(obj, static_values, keyframes_eligible) { Ok((value, inner_skips, _captures)) => { skips.extend(inner_skips); Ok(value) @@ -326,6 +380,7 @@ pub(crate) fn eval_expression_with_statics( &member.object, member.property.name.as_str(), static_values, + keyframes_eligible, ))) } Expression::ComputedMemberExpression(_) => { @@ -340,16 +395,24 @@ pub(crate) fn eval_expression_with_statics( /// /// A bare "member expression (non-static)" names neither the binding nor the /// contract it failed, so an author reading the skip cannot tell a typo from a -/// keyframes collection the engine never discovered. Everything needed is -/// already at this seam: `static_values` is the same map the engine seeds with -/// the keyframes registry (`engine.rs` injects collections under their -/// imported/exported local binding), so its membership IS the discovery -/// answer. Every reason keeps the `(non-static)` marker so existing skip -/// surfacing is unchanged in kind. +/// keyframe collection that was never registered. Everything needed is already +/// at this seam: `static_values` is the same map the engine seeds from the +/// keyframe registration record (`engine.rs` injects each registered +/// collection under the local binding its export name resolves to), so its +/// membership IS the registration answer. Every reason keeps the +/// `(non-static)` marker so existing skip surfacing is unchanged in kind; the +/// unregistered case additionally carries the stable +/// `KEYFRAMES_UNREGISTERED_REFERENCE` code, which the manifest lifts out of +/// the message into `CssDiagnostic::code` — but ONLY when the value position +/// is keyframe-ELIGIBLE (under an animation-name property, directly or +/// through nested blocks; see `eval_object_expr_scoped`). Ineligible +/// positions get the neutral non-static reason: the code is minted here or +/// not at all, never stripped after the fact. fn member_expression_skip_reason( object: &Expression<'_>, property: &str, static_values: Option<&FxHashMap>, + keyframes_eligible: bool, ) -> String { let Expression::Identifier(ident) = object else { // Nested/computed object — no single binding to name. @@ -358,20 +421,23 @@ fn member_expression_skip_reason( let base = ident.name.as_str(); // Every named reason opens the same way and differs only in what follows. let named = format!("member expression '{base}.{property}' (non-static)"); - // No statics at all (the variant stage and a compound's second argument - // evaluate this way): discovery was never consulted, so keyframes advice - // would be unactionable noise. Report the missing context instead. + // No statics at all: this arm's production callers are array-element + // evaluation and the module-statics collection pass, whose skips never + // surface as manifest diagnostics (the variant stage and the compound + // second argument DO evaluate with statics). Keyframe advice here would + // be unactionable; report the missing context instead. let Some(sv) = static_values else { return format!("{named} — evaluated without extraction-time statics"); }; match sv.get(base) { Some(Value::Object(_)) => format!( - "{named} — '{base}' is a discovered collection with no '{property}' member" + "{named} — '{base}' is a registered collection with no '{property}' member" ), Some(_) => format!("{named} — '{base}' is not an object binding"), - None => format!( - "{named} — '{base}' is not a discovered keyframes collection or extraction-time static binding (collections must be reachable from the system entry)" + None if keyframes_eligible => format!( + "{named} — '{base}' is neither a registered keyframe collection nor an extraction-time static binding; if it is a keyframe collection, register it on the system between build() and seal() under the key '{base}' — the registration key must equal the export name ({KEYFRAMES_UNREGISTERED_REFERENCE})" ), + None => format!("{named} — '{base}' is not an extraction-time static binding"), } } @@ -1265,7 +1331,7 @@ const Component = { gap: GAP };"#; // ── the member-expression skip names its binding ───────────────────────── #[test] - fn member_expression_skip_names_undiscovered_collection_and_contract() { + fn member_expression_skip_codes_an_unregistered_collection_and_names_the_repair() { let sv = FxHashMap::default(); let (_, skips, _) = parse_obj_with_statics("{ animationName: motion.pulse }", Some(&sv)); assert_eq!(skips.len(), 1, "{:?}", skips); @@ -1276,17 +1342,98 @@ const Component = { gap: GAP };"#; ); assert!(reason.contains("non-static"), "{reason}"); assert!( - reason.contains("not a discovered keyframes collection"), + reason.contains("is neither a registered keyframe collection"), "{reason}" ); + // The repair, not the mechanism: register between the terminals under + // the export name. assert!( - reason.contains("reachable from the system entry"), + reason.contains("register it on the system between build() and seal()"), + "{reason}" + ); + assert!( + reason.contains("the registration key must equal the export name"), + "{reason}" + ); + // Trailing marker in the manifest's extractable position, so the + // diagnostic carries a stable code rather than only prose. + assert!( + reason.ends_with(&format!("({KEYFRAMES_UNREGISTERED_REFERENCE})")), + "{reason}" + ); + assert_eq!( + crate::analyze_css::diagnostic_code_from_message(reason).as_deref(), + Some(KEYFRAMES_UNREGISTERED_REFERENCE), "{reason}" ); } #[test] - fn member_expression_skip_names_a_missing_member_of_a_known_collection() { + fn keyframes_code_is_scoped_to_animation_name_properties() { + // vocabulary-registration user story 10: a build using no keyframes + // emits ZERO `animus.keyframes.*` diagnostics — an unknown member + // base under an unrelated property must not carry the keyframes + // code or advice, only the neutral non-static reason. + let sv = FxHashMap::default(); + let (_, skips, _) = parse_obj_with_statics("{ color: palette.brand }", Some(&sv)); + assert_eq!(skips.len(), 1, "{:?}", skips); + let reason = &skips[0].reason; + assert!( + reason.contains("member expression 'palette.brand'"), + "{reason}" + ); + assert!( + reason.contains("'palette' is not an extraction-time static binding"), + "{reason}" + ); + assert!( + !reason.contains("keyframe") && !reason.contains("build() and seal()"), + "keyframes advice must not leak onto unrelated properties: {reason}" + ); + assert_eq!( + crate::analyze_css::diagnostic_code_from_message(reason), + None, + "{reason}" + ); + } + + #[test] + fn keyframes_code_fires_through_the_responsive_form() { + // The type surface licenses `animationName: { _: ref, sm: ref }` + // (ResponsiveProp); eligibility must survive the + // nested-block recursion, not read only the immediate key. + let sv = FxHashMap::default(); + let (_, skips, _) = + parse_obj_with_statics("{ animationName: { _: motion.pulse } }", Some(&sv)); + assert_eq!(skips.len(), 1, "{:?}", skips); + let reason = &skips[0].reason; + assert_eq!( + crate::analyze_css::diagnostic_code_from_message(reason).as_deref(), + Some(KEYFRAMES_UNREGISTERED_REFERENCE), + "{reason}" + ); + } + + #[test] + fn responsive_form_of_an_unrelated_property_stays_uncoded() { + let sv = FxHashMap::default(); + let (_, skips, _) = + parse_obj_with_statics("{ color: { _: palette.brand } }", Some(&sv)); + assert_eq!(skips.len(), 1, "{:?}", skips); + let reason = &skips[0].reason; + assert!( + reason.contains("'palette' is not an extraction-time static binding"), + "{reason}" + ); + assert_eq!( + crate::analyze_css::diagnostic_code_from_message(reason), + None, + "{reason}" + ); + } + + #[test] + fn member_expression_skip_names_a_missing_member_of_a_registered_collection() { let mut sv = FxHashMap::default(); let mut motion = Map::new(); motion.insert("ember".to_string(), Value::String("animus-kf-abc".to_string())); @@ -1300,16 +1447,26 @@ const Component = { gap: GAP };"#; "{reason}" ); assert!( - reason.contains("discovered collection with no 'pulse' member"), + reason.contains("registered collection with no 'pulse' member"), + "{reason}" + ); + // A present-but-incomplete collection is NOT the unregistered case. + assert_eq!( + crate::analyze_css::diagnostic_code_from_message(reason), + None, "{reason}" ); } #[test] fn member_expression_skip_without_statics_reports_missing_context() { - // The variant/second-compound-arg path evaluates with NO statics, so - // discovery was never consulted — keyframes advice there would be - // unactionable. Name the binding and the missing context instead. + // No-statics callers (array-element evaluation and the + // module-statics collection pass — the variant stage and the compound + // second argument DO evaluate with statics) never consulted the + // registration record, and their skips never surface as manifest + // diagnostics — keyframe advice there would be unactionable. Name + // the binding and the missing context instead, and do NOT code it as + // an unregistered reference. let (_, skips) = parse_obj_full("{ animationName: motion.pulse }"); assert_eq!(skips.len(), 1, "{:?}", skips); let reason = &skips[0].reason; @@ -1321,8 +1478,9 @@ const Component = { gap: GAP };"#; reason.contains("evaluated without extraction-time statics"), "{reason}" ); - assert!( - !reason.contains("not a discovered keyframes collection"), + assert_eq!( + crate::analyze_css::diagnostic_code_from_message(reason), + None, "{reason}" ); } diff --git a/packages/extract/crates/extract-v2/src/lib.rs b/packages/extract/crates/extract-v2/src/lib.rs index b77528aa..5555c191 100644 --- a/packages/extract/crates/extract-v2/src/lib.rs +++ b/packages/extract/crates/extract-v2/src/lib.rs @@ -75,6 +75,15 @@ pub struct NapiSystemConfig { pub transform_sources: Option, pub global_style_blocks: Option, pub keyframes_blocks: Option, + /// Vocabulary witnesses from the sealed system's registration record: + /// one JSON array of coded entries — collisions + /// (`animus.vocabulary.collision`) and legacy-verb witnesses + /// (`animus.vocabulary.legacy-verb`: registered vocabulary consumed + /// through `from()`/`includes:`, which cannot carry it). The record is + /// the witness channel (the evaluation host shims console); hosts + /// surface each entry as a diagnostic keyed by its `code`. Absent when + /// the record carries no witnesses. + pub vocabulary_witnesses: Option, /// Canonical absolute paths of every module evaluated for the system /// (sorted; entry included, runtime stubs excluded). The plugins use this /// as the geological-reset membership set. @@ -112,27 +121,12 @@ pub fn load_system_module( transform_sources: config.transform_sources, global_style_blocks: config.global_style_blocks, keyframes_blocks: config.keyframes_blocks, + vocabulary_witnesses: config.vocabulary_witnesses, dependencies: config.dependencies, source_theme_manifests: config.source_theme_manifests, }) } -/// Scan one module entry for named `Keyframes` collection exports — the -/// keyframes-only carve-out for external package entries. The -/// entry evaluates through the same loader pipeline as a system module, but -/// nothing except `__brand === 'Keyframes'` exports is read from it; the -/// consumer's configured system remains the singular config authority. -/// Returns the `{ exportName: { keyName: { name, frames } } }` JSON, or None -/// when the entry exports no collections. -#[napi] -pub fn scan_keyframes_exports( - entry_path: String, - root_dir: String, -) -> napi::Result> { - animus_system_loader::scan_keyframes_exports(&entry_path, &root_dir) - .map_err(napi::Error::from_reason) -} - #[derive(Deserialize)] struct InputEntry { path: String, diff --git a/packages/extract/crates/system-loader/src/lib.rs b/packages/extract/crates/system-loader/src/lib.rs index 7422d61e..41fe1b56 100644 --- a/packages/extract/crates/system-loader/src/lib.rs +++ b/packages/extract/crates/system-loader/src/lib.rs @@ -47,8 +47,8 @@ pub struct SystemConfig { /// value. `None` against a system built by an older @animus-ui/system. pub transform_sources: Option, pub global_style_blocks: Option, - /// Keyframes exports — collections produced by the top-level `keyframes()` - /// factory (objects with `__brand === 'Keyframes'`). JSON shape: + /// Keyframe collections from the sealed system's registration record + /// (vocabulary-registration; nothing is export-scanned). JSON shape: /// `{ exportName: { keyName: { name, frames } } }`. `name` is the runtime- /// generated stable hash (`animus-kf-`); `frames` is the percent-stop /// style map ready for theme resolution via the existing `@keyframes` @@ -56,6 +56,17 @@ pub struct SystemConfig { /// collection identity so the extractor can substitute /// `motion.ember`-style member-expression references against it. pub keyframes_blocks: Option, + /// Vocabulary witnesses from the sealed system's registration record + /// (vocabulary-registration): one JSON array carrying every coded entry + /// — collision entries (`animus.vocabulary.collision`: `{ code, name, + /// winner, loser }`) and legacy-verb entries + /// (`animus.vocabulary.legacy-verb`: `{ code, verb, names }`, a sealed + /// kit with registered vocabulary consumed through `from()`/`includes:` + /// which cannot carry it). The record — not the evaluation host's + /// console (shimmed to a no-op) — is the witness channel; hosts surface + /// each entry as a diagnostic keyed by its `code`. `None` when the + /// record carries no witnesses. + pub vocabulary_witnesses: Option, /// Canonical absolute paths of every module evaluated for this system — /// the entry plus its transitive graph, excluding runtime stubs (which /// have no path). Sorted. Plugins use this as the geological-reset @@ -217,6 +228,11 @@ fn find_package_json(pkg_name: &str, start_dir: &str) -> Result /// Resolve an entry from the exports map. /// Handles both string values and nested condition objects. /// For condition objects, follows the `import` condition, then `default`. +/// +/// Subpath keys are matched Node's way: an exact key first, then the +/// `"./*"` wildcard patterns, whose matched segment is substituted into the +/// resolved target. A subpath that matches nothing returns `None`, so +/// `resolve_bare_specifier` keeps falling through to `module`/`main`. fn resolve_exports_entry(exports: &serde_json::Value, key: &str) -> Option { // Normalize key: `./groups` or `/groups` → look up with `./` prefix let lookup_key = if key == "." { @@ -229,8 +245,56 @@ fn resolve_exports_entry(exports: &serde_json::Value, key: &str) -> Option, + lookup_key: &str, +) -> Option { + let mut best: Option<(&str, &str, &serde_json::Value)> = None; + + for (pattern, value) in exports { + // Exactly one `*`, in a subpath key: anything else is not a pattern. + let Some((prefix, suffix)) = pattern.split_once('*') else { + continue; + }; + if !prefix.starts_with("./") || suffix.contains('*') { + continue; + } + if !lookup_key.starts_with(prefix) || !lookup_key.ends_with(suffix) { + continue; + } + if lookup_key.len() < prefix.len() + suffix.len() { + continue; + } + let more_specific = match best { + None => true, + Some((best_prefix, best_suffix, _)) => { + prefix.len() > best_prefix.len() + || (prefix.len() == best_prefix.len() && suffix.len() > best_suffix.len()) + } + }; + if more_specific { + best = Some((prefix, suffix, value)); + } + } + + let (prefix, suffix, value) = best?; + let matched = &lookup_key[prefix.len()..lookup_key.len() - suffix.len()]; + Some(resolve_condition_value(value)?.replace('*', matched)) } /// Resolve a condition value — could be a string or a nested condition object. @@ -1323,19 +1387,55 @@ fn extract_system_config<'js>( namespace: &Object<'js>, export_name: Option<&str>, ) -> Result { - // Find SystemInstance (export with .toConfig()) + // Find SystemInstance (export with .toConfig()). Without an explicit + // export name, MORE THAN ONE distinct system-like export is a load + // error naming every candidate (vocabulary-registration ambiguity + // guard; precedent: the dual-built-theme identity check below) — never + // an enumeration-order first-pick, which would silently load a system + // with no registrations during a migration. let system_obj = if let Some(name) = export_name { namespace .get::<_, Object>(name) .map_err(|e| format!("export '{}' not found or not an object: {}", name, e))? } else { - find_export_with_method(namespace, "toConfig")?.ok_or_else(|| { - let keys = list_export_keys(namespace); - format!( - "no SystemInstance found (no export with .toConfig()). Exports: [{}]", - keys.join(", ") - ) - })? + let candidates = find_exports_with_method(namespace, "toConfig"); + match candidates.len() { + 0 => { + let keys = list_export_keys(namespace); + return Err(format!( + "no SystemInstance found (no export with .toConfig()). Exports: [{}]", + keys.join(", ") + )); + } + 1 => candidates.into_iter().next().map(|(_, obj)| obj).unwrap(), + _ => { + let is_same: Function = ctx + .eval(b"(a, b) => a === b" as &[u8]) + .map_err(|e| format!("system export identity check failed: {}", e))?; + let first = candidates[0].1.clone(); + let mut distinct = false; + for (_, obj) in candidates.iter().skip(1) { + let same: bool = is_same + .call((first.clone(), obj.clone())) + .map_err(|e| format!("system export identity check failed: {}", e))?; + if !same { + distinct = true; + break; + } + } + if distinct { + let keys: Vec<&str> = + candidates.iter().map(|(key, _)| key.as_str()).collect(); + return Err(format!( + "ambiguous system exports: [{}] each carry .toConfig() but are not \ + the same object; the loader selects exactly one system — export a \ + single (sealed) instance or pass an explicit export name", + keys.join(", ") + )); + } + first + } + } }; // Call .toConfig() @@ -1456,11 +1556,26 @@ fn extract_system_config<'js>( .get("contextualVarsJson") .map_err(|e| format!("contextualVarsJson not found: {}", e))?; - // Find GlobalStyleBlock exports - let global_style_blocks = extract_global_style_blocks(namespace); - - // Find Keyframes exports - let keyframes_blocks = extract_keyframes_blocks(namespace); + // Vocabulary (vocabulary-registration): a sealed system's registration + // record is the ONLY source for keyframe collections AND global-style + // blocks — an exported-but-unregistered value does not carry, and a + // system WITHOUT the record accessor fails the load loud (unsealed, or + // built by an older @animus-ui/system) rather than loading with + // silently empty vocabulary. + if system_obj + .get::<_, Function>("getVocabularyRecord") + .is_err() + { + return Err( + "system carries no vocabulary registration record — it is unsealed or was \ + built by an older @animus-ui/system. Register collections between build() \ + and seal() and export the sealed instance; loading with silently empty \ + collections is refused" + .to_string(), + ); + } + let (keyframes_blocks, global_style_blocks, vocabulary_witnesses) = + extract_vocabulary_record(ctx, &system_obj)?; Ok(SystemConfig { prop_config, @@ -1475,6 +1590,7 @@ fn extract_system_config<'js>( transform_sources, global_style_blocks, keyframes_blocks, + vocabulary_witnesses, // Populated by load_system_module from the resolved module graph; // execute_bundle only sees the assembled bundle text. dependencies: Vec::new(), @@ -1484,151 +1600,120 @@ fn extract_system_config<'js>( }) } -/// Find an export that has a given method name. -fn find_export_with_method<'js>( +/// Find every export that has a given method name, with its export key. +fn find_exports_with_method<'js>( namespace: &Object<'js>, method_name: &str, -) -> Result>, String> { - let keys = list_export_keys(namespace); - for key in &keys { +) -> Vec<(String, Object<'js>)> { + let mut found = Vec::new(); + for key in list_export_keys(namespace) { if let Ok(obj) = namespace.get::<_, Object>(key.as_str()) { if obj.get::<_, Function>(method_name).is_ok() { - return Ok(Some(obj)); + found.push((key, obj)); } } } - Ok(None) + found } -/// List all export keys from a module namespace. -fn list_export_keys(namespace: &Object<'_>) -> Vec { - let mut keys = Vec::new(); - for key in namespace.keys::().flatten() { - keys.push(key); +/// The three wires the vocabulary record yields: keyframes blocks, +/// global-style blocks, and the coded witness array (each `None` when +/// empty). +type VocabularyWires = (Option, Option, Option); + +/// Read the sealed system's vocabulary record (vocabulary-registration). +/// Returns `(keyframes_blocks, global_style_blocks, vocabulary_witnesses)`: +/// the record's declaration-ordered `keyframes` array becomes the unchanged +/// `{ exportName: { keyName: { name, frames } } }` wire, the `globalStyles` +/// array the unchanged `{ exportName: { styles, fontFaces } }` wire +/// (insertion order preserved end to end — `Object.fromEntries` + +/// `JSON.stringify` in the evaluation context, `preserve_order` on the +/// Rust side), and its `collisions` + `legacyVerbs` entries carry verbatim +/// as one coded host-facing witness array. An incompatible version marker +/// fails the load loud. +fn extract_vocabulary_record<'js>( + ctx: &rquickjs::Ctx<'js>, + system_obj: &Object<'js>, +) -> Result { + let script = r#"(() => { + const record = globalThis.__sys_ref.getVocabularyRecord(); + if (!record || typeof record !== 'object') { + return JSON.stringify({ invalid: 'getVocabularyRecord() did not return an object' }); + } + if (record.version !== 1) { + return JSON.stringify({ skew: String(record.version) }); + } + const keyframes = Array.isArray(record.keyframes) ? record.keyframes : []; + const globalStyles = Array.isArray(record.globalStyles) ? record.globalStyles : []; + const collisions = Array.isArray(record.collisions) ? record.collisions : []; + const legacyVerbs = Array.isArray(record.legacyVerbs) ? record.legacyVerbs : []; + return JSON.stringify({ + keyframeCount: keyframes.length, + keyframes: Object.fromEntries(keyframes.map((entry) => [entry.name, entry.frames])), + globalStyleCount: globalStyles.length, + globalStyles: Object.fromEntries(globalStyles.map((entry) => [entry.name, { styles: entry.styles, fontFaces: entry.fontFaces || [] }])), + witnesses: collisions.concat(legacyVerbs), + }); +})()"#; + let _ = ctx.globals().set("__sys_ref", system_obj.clone()); + let result = ctx.eval::(script.as_bytes()); + let _ = ctx.globals().remove("__sys_ref"); + let json = + result.map_err(|e| format!("getVocabularyRecord() evaluation failed: {}", e))?; + let parsed: serde_json::Value = serde_json::from_str(&json) + .map_err(|e| format!("vocabulary record serialization failed: {}", e))?; + + if let Some(skew) = parsed.get("skew").and_then(|v| v.as_str()) { + return Err(format!( + "system vocabulary record version {} is not supported by this loader \ + (expected 1) — the system was built by a mismatched @animus-ui/system; \ + rebuild against a matching version instead of loading with empty \ + collections", + skew + )); } - keys -} - -/// Extract GlobalStyleBlock exports (objects with __brand === 'GlobalStyleBlock'). -/// Uses JSON.stringify inside the rquickjs context to serialize the styles object. -fn extract_global_style_blocks(namespace: &Object<'_>) -> Option { - let keys = list_export_keys(namespace); - let mut blocks: HashMap = HashMap::new(); - let ctx = namespace.ctx().clone(); - - for key in &keys { - if let Ok(obj) = namespace.get::<_, Object>(key.as_str()) { - if let Ok(brand) = obj.get::<_, String>("__brand") { - if brand == "GlobalStyleBlock" { - // Wrapped form: selector map plus the block's typed - // font-face descriptors (global-styles-system). The - // extractor renders fontFaces ahead of selector rules. - let script = format!( - "JSON.stringify({{styles: globalThis.__ns_ref[\"{key}\"].styles, fontFaces: globalThis.__ns_ref[\"{key}\"].fontFaces || []}})" - ); - // Temporarily assign namespace to globalThis for access - let _ = ctx.globals().set("__ns_ref", namespace.clone()); - if let Ok(json_str) = ctx.eval::(script.as_bytes()) { - let _ = ctx.globals().remove("__ns_ref"); - if let Ok(parsed) = serde_json::from_str(&json_str) { - blocks.insert(key.clone(), parsed); - } - } else { - let _ = ctx.globals().remove("__ns_ref"); - } - } - } - } + if let Some(invalid) = parsed.get("invalid").and_then(|v| v.as_str()) { + return Err(format!("system vocabulary record invalid: {}", invalid)); } - if blocks.is_empty() { + let count = parsed + .get("keyframeCount") + .and_then(|v| v.as_u64()) + .unwrap_or(0); + let keyframes_blocks = if count == 0 { None } else { - Some(serde_json::to_string(&blocks).unwrap_or_default()) - } -} - -/// Extract Keyframes collection exports (objects with `__brand === 'Keyframes'`). -/// -/// Each collection carries `__frames: { keyName: { name, frames } }` — the raw -/// payload the extractor needs to both emit `@keyframes ` blocks and -/// resolve `motion.ember`-style member-expression references in component -/// styles. The returned JSON preserves this nested shape: `{ exportName: -/// { keyName: { name, frames } } }`, keyed by the collection's export name. -fn extract_keyframes_blocks(namespace: &Object<'_>) -> Option { - let keys = list_export_keys(namespace); - let mut blocks: HashMap = HashMap::new(); - let ctx = namespace.ctx().clone(); - - for key in &keys { - if let Ok(obj) = namespace.get::<_, Object>(key.as_str()) { - if let Ok(brand) = obj.get::<_, String>("__brand") { - if brand == "Keyframes" { - // Serialize the full `__frames` record via JSON.stringify. - // Yields `{ keyName: { name, frames } }` per collection. - let script = - format!("JSON.stringify(globalThis.__ns_ref[\"{}\"].__frames)", key); - let _ = ctx.globals().set("__ns_ref", namespace.clone()); - if let Ok(json_str) = ctx.eval::(script.as_bytes()) { - let _ = ctx.globals().remove("__ns_ref"); - if let Ok(parsed) = serde_json::from_str::(&json_str) { - blocks.insert(key.clone(), parsed); - } - } else { - let _ = ctx.globals().remove("__ns_ref"); - } - } - } - } - } - - if blocks.is_empty() { + parsed + .get("keyframes") + .map(|v| serde_json::to_string(v).unwrap_or_default()) + }; + let global_style_count = parsed + .get("globalStyleCount") + .and_then(|v| v.as_u64()) + .unwrap_or(0); + let global_style_blocks = if global_style_count == 0 { None } else { - Some(serde_json::to_string(&blocks).unwrap_or_default()) - } + parsed + .get("globalStyles") + .map(|v| serde_json::to_string(v).unwrap_or_default()) + }; + let vocabulary_witnesses = match parsed.get("witnesses").and_then(|v| v.as_array()) { + Some(list) if !list.is_empty() => { + Some(serde_json::to_string(list).unwrap_or_default()) + } + _ => None, + }; + Ok((keyframes_blocks, global_style_blocks, vocabulary_witnesses)) } -// --------------------------------------------------------------------------- -// 6. Public entry point -// --------------------------------------------------------------------------- - -/// Scan a module entry for named `Keyframes` collection exports WITHOUT -/// extracting any system configuration. External package entries contribute -/// keyframes only — the consumer's configured system stays the singular -/// authority for themes, scales, selectors, conditions, and props -/// (openspec: external-package-file-discovery carve-out). Same -/// read → strip → resolve → bundle → eval pipeline as a system load; the -/// namespace walk reads nothing but `__brand === 'Keyframes'` exports. -/// Returns the `{ exportName: { keyName: { name, frames } } }` JSON shape. -pub fn scan_keyframes_exports( - entry_path: &str, - root_dir: &str, -) -> Result, String> { - let (specifier_map, source_map, stub_exports) = resolve_all_deps(entry_path, root_dir)?; - - let entry_canon = fs::canonicalize(entry_path) - .map_err(|e| format!("failed to canonicalize '{}': {}", entry_path, e))? - .to_string_lossy() - .to_string(); - - let (bundle, layout) = build_bundle(&specifier_map, &source_map, &stub_exports, &entry_canon)?; - - let runtime = Runtime::new().map_err(|e| format!("rquickjs Runtime::new failed: {}", e))?; - let context = - Context::full(&runtime).map_err(|e| format!("rquickjs Context::full failed: {}", e))?; - - context.with(|ctx| { - ctx.eval::<(), _>(bundle.as_bytes()) - .map_err(|e| describe_eval_failure(&ctx, &layout, &e))?; - - let access_script = format!("__modules['{}']", js_quoted(&entry_canon)); - let namespace: Object = ctx - .eval(access_script.as_bytes()) - .map_err(|e| format!("failed to access entry module exports: {}", e))?; - - Ok(extract_keyframes_blocks(&namespace)) - }) +/// List all export keys from a module namespace. +fn list_export_keys(namespace: &Object<'_>) -> Vec { + let mut keys = Vec::new(); + for key in namespace.keys::().flatten() { + keys.push(key); + } + keys } /// Load a system module and return its serialized configuration. @@ -2087,59 +2172,323 @@ export const ds = tokens; fs::write(path, contents).expect("write fixture"); } + // ── vocabulary-registration: seam-1 record consumption ────────────────── + + const FIXTURE_THEME: &str = "export const theme = { serialize: () => ({\n\ + scalesJson: '{}', variableMapJson: '{}', variableCss: '',\n\ + contextualVarsJson: '{}' }) };\n"; + + fn sealed_system_fixture(record_literal: &str) -> String { + format!( + "export const ds = {{\n\ + toConfig: () => ({{ propConfig: '{{}}', groupRegistry: '{{}}' }}),\n\ + getVocabularyRecord: () => ({record_literal}),\n\ + }};\n\ + {FIXTURE_THEME}" + ) + } + + const TWO_COLLECTION_RECORD: &str = "{\n\ + version: 1,\n\ + keyframes: [\n\ + { name: 'first', frames: { pulse: { name: 'animus-kf-aaa', frames: { from: { opacity: 0 } } } } },\n\ + { name: 'second', frames: { fade: { name: 'animus-kf-bbb', frames: { to: { opacity: 1 } } } } },\n\ + ],\n\ + globalStyles: [],\n\ + collisions: [],\n\ + }"; + + #[test] + fn sealed_record_carries_collections_declaration_ordered() { + // rust-system-loader §"Collections come from the sealed registration + // record": registration order reaches the serialized wire. + let dir = scratch_dir("vocab-record-order"); + let entry = dir.join("entry.ts"); + write_fixture(&entry, &sealed_system_fixture(TWO_COLLECTION_RECORD)); + + let result = load_system_module(&entry.to_string_lossy(), &dir.to_string_lossy(), None); + let _ = fs::remove_dir_all(&dir); + + let config = result.expect("sealed system must load"); + let blocks = config + .keyframes_blocks + .expect("registered collections must carry"); + let first_at = blocks.find("\"first\"").expect("first present"); + let second_at = blocks.find("\"second\"").expect("second present"); + assert!( + first_at < second_at, + "registration order must reach the wire: {blocks}" + ); + let parsed: serde_json::Value = serde_json::from_str(&blocks).expect("valid JSON"); + assert_eq!( + parsed["first"]["pulse"]["name"], "animus-kf-aaa", + "wire keeps the {{ exportName: {{ keyName: {{ name, frames }} }} }} shape" + ); + } + + #[test] + fn exported_but_unregistered_collection_does_not_carry() { + // The hard-cut negative: a branded export absent from the record is + // invisible to the loader. + let dir = scratch_dir("vocab-unregistered"); + let entry = dir.join("entry.ts"); + let mut source = sealed_system_fixture(TWO_COLLECTION_RECORD); + source.push_str( + "export const motion = { __brand: 'Keyframes', __frames: { spin: { name: 'animus-kf-ccc', frames: {} } } };\n", + ); + write_fixture(&entry, &source); + + let result = load_system_module(&entry.to_string_lossy(), &dir.to_string_lossy(), None); + let _ = fs::remove_dir_all(&dir); + + let config = result.expect("sealed system must load"); + let blocks = config.keyframes_blocks.expect("registered ones carry"); + assert!( + !blocks.contains("motion") && !blocks.contains("animus-kf-ccc"), + "unregistered export must not carry: {blocks}" + ); + } + + #[test] + fn wrong_record_version_fails_the_load() { + // rust-system-loader §"Registration-record version skew fails the + // load" — the half that has no fallback: a PRESENT record with an + // incompatible marker. (Record ABSENCE falls back to the export scan + // until the migration increment deletes the scan.) + let dir = scratch_dir("vocab-version-skew"); + let entry = dir.join("entry.ts"); + write_fixture( + &entry, + &sealed_system_fixture( + "{ version: 99, keyframes: [], globalStyles: [], collisions: [] }", + ), + ); + + let result = load_system_module(&entry.to_string_lossy(), &dir.to_string_lossy(), None); + let _ = fs::remove_dir_all(&dir); + + let error = result.expect_err("incompatible record version must fail loud"); + assert!( + error.contains("version") && error.contains("99"), + "error must name the version mismatch: {error}" + ); + } + + #[test] + fn ambiguous_system_like_exports_fail_the_load() { + // rust-system-loader §"Ambiguous system-like exports fail the load": + // two DISTINCT toConfig-bearing exports and no explicit exportName. + let dir = scratch_dir("vocab-ambiguous"); + let entry = dir.join("entry.ts"); + write_fixture( + &entry, + &format!( + "export const ds = {{ toConfig: () => ({{ propConfig: '{{}}', groupRegistry: '{{}}' }}), getVocabularyRecord: () => ({{ version: 1, keyframes: [], globalStyles: [], collisions: [], legacyVerbs: [] }}) }};\n\ + export const dsTwo = {{ toConfig: () => ({{ propConfig: '{{}}', groupRegistry: '{{}}' }}), getVocabularyRecord: () => ({{ version: 1, keyframes: [], globalStyles: [], collisions: [], legacyVerbs: [] }}) }};\n\ + {FIXTURE_THEME}" + ), + ); + + let result = load_system_module(&entry.to_string_lossy(), &dir.to_string_lossy(), None); + let _ = fs::remove_dir_all(&dir); + + let error = result.expect_err("two distinct system-like exports must fail loud"); + assert!( + error.contains("ds") && error.contains("dsTwo"), + "error must name both exports: {error}" + ); + } + #[test] - fn scan_keyframes_exports_reads_only_branded_collections() { - let dir = scratch_dir("kf-scan"); - let entry = dir.join("index.ts"); + fn aliased_reexport_of_one_system_is_not_ambiguous() { + let dir = scratch_dir("vocab-alias"); + let entry = dir.join("entry.ts"); write_fixture( &entry, - "export const motion = { __brand: 'Keyframes', __frames: { pulse: { name: 'animus-kf-testhash', frames: { from: { opacity: 0.4 }, to: { opacity: 1 } } } } };\n\ - export const notKeyframes = { __brand: 'Other', __frames: {} };\n\ - export const plain = 42;\n", + &format!( + "export const ds = {{ toConfig: () => ({{ propConfig: '{{}}', groupRegistry: '{{}}' }}), getVocabularyRecord: () => ({{ version: 1, keyframes: [], globalStyles: [], collisions: [], legacyVerbs: [] }}) }};\n\ + export const dsAlias = ds;\n\ + {FIXTURE_THEME}" + ), ); - let result = scan_keyframes_exports(&entry.to_string_lossy(), &dir.to_string_lossy()); + let result = load_system_module(&entry.to_string_lossy(), &dir.to_string_lossy(), None); + let _ = fs::remove_dir_all(&dir); + + result.expect("aliases of ONE instance stay unambiguous"); + } + + #[test] + fn record_wire_is_byte_identical_across_fresh_loads() { + // rust-system-loader §"Collections come from the sealed registration + // record" (determinism scenario): two full loads, two runtimes, + // identical bytes. + let dir = scratch_dir("vocab-determinism"); + let entry = dir.join("entry.ts"); + write_fixture(&entry, &sealed_system_fixture(TWO_COLLECTION_RECORD)); + + let first = load_system_module(&entry.to_string_lossy(), &dir.to_string_lossy(), None) + .expect("first load"); + let second = load_system_module(&entry.to_string_lossy(), &dir.to_string_lossy(), None) + .expect("second load"); let _ = fs::remove_dir_all(&dir); - let json = result - .expect("scan must succeed") - .expect("a Keyframes export must be discovered"); - let parsed: serde_json::Value = serde_json::from_str(&json).expect("valid JSON"); - let obj = parsed.as_object().unwrap(); - assert_eq!(obj.len(), 1, "{json}"); assert_eq!( - parsed["motion"]["pulse"]["name"], - serde_json::Value::String("animus-kf-testhash".into()) + first.keyframes_blocks, second.keyframes_blocks, + "fresh-process loads must serialize identical collection bytes" ); - assert!(parsed["motion"]["pulse"]["frames"]["from"].is_object()); + assert!(first.keyframes_blocks.is_some()); } #[test] - fn scan_keyframes_exports_degrades_to_error_not_panic() { - let dir = scratch_dir("kf-scan-broken"); - let entry = dir.join("index.ts"); - write_fixture(&entry, "throw new Error('entry refuses to evaluate');\n"); + fn record_witnesses_carry_to_the_config() { + // The record, not console, is the witness channel (the evaluation + // host shims console to a no-op): collision AND legacy-verb entries + // arrive as one coded array. + let dir = scratch_dir("vocab-witnesses"); + let entry = dir.join("entry.ts"); + write_fixture( + &entry, + &sealed_system_fixture( + "{ version: 1, keyframes: [], globalStyles: [], collisions: [\n\ + { code: 'animus.vocabulary.collision', name: 'motion',\n\ + winner: 'local registration #1', loser: 'extended source #1' },\n\ + ], legacyVerbs: [\n\ + { code: 'animus.vocabulary.legacy-verb', verb: 'includes',\n\ + names: ['kitMotion'] },\n\ + ] }", + ), + ); - let result = scan_keyframes_exports(&entry.to_string_lossy(), &dir.to_string_lossy()); + let result = load_system_module(&entry.to_string_lossy(), &dir.to_string_lossy(), None); let _ = fs::remove_dir_all(&dir); - let error = result.expect_err("a throwing entry must surface as Err"); + let config = result.expect("sealed system must load"); + let witnesses = config + .vocabulary_witnesses + .expect("witness entries must carry"); assert!( - error.contains("refuses to evaluate") || error.contains("eval"), - "error must describe the evaluation failure: {error}" + witnesses.contains("animus.vocabulary.collision") + && witnesses.contains("motion") + && witnesses.contains("extended source #1") + && witnesses.contains("animus.vocabulary.legacy-verb") + && witnesses.contains("kitMotion"), + "witness entries must survive verbatim: {witnesses}" ); } #[test] - fn scan_keyframes_exports_none_when_no_collections() { - let dir = scratch_dir("kf-scan-empty"); - let entry = dir.join("index.ts"); - write_fixture(&entry, "export const plain = { value: 1 };\n"); + fn undeclared_root_barrel_is_never_evaluated() { + // Host-seam deletion witness (vocabulary-registration hard cut): the + // consumer's declared definition graph is the ONLY thing evaluated. + // A kit's root barrel that THROWS at module top level (standing in + // for a framework graph) must never run when the consumer imports + // only the definition subpath — discovery-by-scan is gone and + // nothing else walks package entries. + let dir = scratch_dir("vocab-throwing-barrel"); + let kit = dir.join("node_modules").join("@x").join("kit"); + write_fixture( + &kit.join("package.json"), + r#"{"name":"@x/kit","exports":{".":"./index.js","./definition":"./definition.js"}}"#, + ); + write_fixture( + &kit.join("index.js"), + "throw new Error('root barrel must not be evaluated');\n", + ); + write_fixture( + &kit.join("definition.js"), + "export const kitTokens = { fromKit: true };\n", + ); + let entry = dir.join("entry.ts"); + write_fixture( + &entry, + &format!( + "import {{ kitTokens }} from '@x/kit/definition';\n\ + export const marker = kitTokens;\n\ + {}", + sealed_system_fixture( + "{ version: 1, keyframes: [], globalStyles: [], collisions: [], legacyVerbs: [] }", + ) + ), + ); + + let result = load_system_module(&entry.to_string_lossy(), &dir.to_string_lossy(), None); + let _ = fs::remove_dir_all(&dir); + + result.expect("the load must succeed without touching the root barrel"); + } + + #[test] + fn registered_global_styles_carry_in_record_order() { + // global-styles-system §"Global style registration and cascade + // order": record order reaches the wire; an exported-but- + // unregistered branded block does NOT carry. + let dir = scratch_dir("vocab-globals-order"); + let entry = dir.join("entry.ts"); + let mut source = sealed_system_fixture( + "{ version: 1, keyframes: [], globalStyles: [\n\ + { name: 'reset', styles: { body: { margin: 0 } } },\n\ + { name: 'typo', styles: { h1: { fontWeight: 700 } } },\n\ + ], collisions: [], legacyVerbs: [] }", + ); + source.push_str( + "export const rogue = { __brand: 'GlobalStyleBlock', styles: { p: { margin: 0 } } };\n", + ); + write_fixture(&entry, &source); - let result = scan_keyframes_exports(&entry.to_string_lossy(), &dir.to_string_lossy()); + let first = load_system_module(&entry.to_string_lossy(), &dir.to_string_lossy(), None) + .expect("sealed system must load"); + let second = load_system_module(&entry.to_string_lossy(), &dir.to_string_lossy(), None) + .expect("second load"); let _ = fs::remove_dir_all(&dir); - assert_eq!(result.expect("scan must succeed"), None); + let blocks = first + .global_style_blocks + .clone() + .expect("registered blocks must carry"); + let reset_at = blocks.find("\"reset\"").expect("reset present"); + let typo_at = blocks.find("\"typo\"").expect("typo present"); + assert!(reset_at < typo_at, "record order must reach the wire: {blocks}"); + assert!( + !blocks.contains("rogue"), + "unregistered branded export must not carry: {blocks}" + ); + // Wire shape parity with the retired export scan: wrapped + // {{ styles, fontFaces }} per name. + let parsed: serde_json::Value = serde_json::from_str(&blocks).expect("valid JSON"); + assert!(parsed["reset"]["styles"]["body"].is_object()); + assert!(parsed["reset"]["fontFaces"].is_array()); + assert_eq!( + first.global_style_blocks, second.global_style_blocks, + "fresh-process loads must serialize identical block bytes" + ); + } + + #[test] + fn recordless_system_fails_the_load() { + // rust-system-loader §"Registration-record version skew fails the + // load", the absence half (the DEF-11-class hard cut): a system + // without the record accessor is unsealed or built by an older + // @animus-ui/system — refuse to load with silently empty + // collections. + let dir = scratch_dir("vocab-recordless"); + let entry = dir.join("entry.ts"); + write_fixture( + &entry, + &format!( + "export const ds = {{ toConfig: () => ({{ propConfig: '{{}}', groupRegistry: '{{}}' }}) }};\n\ + {FIXTURE_THEME}" + ), + ); + + let result = load_system_module(&entry.to_string_lossy(), &dir.to_string_lossy(), None); + let _ = fs::remove_dir_all(&dir); + + let error = result.expect_err("a recordless system must fail the load"); + assert!( + error.contains("unsealed") && error.contains("seal()"), + "error must name the sealing requirement: {error}" + ); } #[test] @@ -2178,7 +2527,7 @@ export const ds = tokens; &entry, "import { makeTheme } from './theme';\n\ export const theme = makeTheme();\n\ - export const system = { toConfig: () => ({ propConfig: '{}', groupRegistry: '{}' }) };\n", + export const system = { toConfig: () => ({ propConfig: '{}', groupRegistry: '{}' }), getVocabularyRecord: () => ({ version: 1, keyframes: [], globalStyles: [], collisions: [], legacyVerbs: [] }) };\n", ); write_fixture( &dir.join("theme.ts"), @@ -2236,7 +2585,7 @@ export const ds = tokens; contextualVarsJson: '{}',\n\ }),\n\ };\n\ - export const system = { toConfig: () => ({ propConfig: '{}', groupRegistry: '{}' }) };\n", + export const system = { toConfig: () => ({ propConfig: '{}', groupRegistry: '{}' }), getVocabularyRecord: () => ({ version: 1, keyframes: [], globalStyles: [], collisions: [], legacyVerbs: [] }) };\n", ); write_fixture( &dir.join("kit/index.ts"), @@ -2292,12 +2641,12 @@ export const ds = tokens; contextualVarsJson: '{}',\n\ }),\n\ };\n\ - export const system = { toConfig: () => ({ propConfig: '{}', groupRegistry: '{}' }) };\n", + export const system = { toConfig: () => ({ propConfig: '{}', groupRegistry: '{}' }), getVocabularyRecord: () => ({ version: 1, keyframes: [], globalStyles: [], collisions: [], legacyVerbs: [] }) };\n", ); write_fixture( &dir.join("kit/index.ts"), "export const kit = {\n\ - system: { toConfig: () => ({ propConfig: '{}', groupRegistry: '{}' }) },\n\ + system: { toConfig: () => ({ propConfig: '{}', groupRegistry: '{}' }), getVocabularyRecord: () => ({ version: 1, keyframes: [], globalStyles: [], collisions: [], legacyVerbs: [] }) },\n\ tokens: {\n\ colors: { externalAccent: '#f0f' },\n\ manifest: { variableMap: { 'colors.externalAccent': '--color-external-accent' } },\n\ @@ -2347,12 +2696,12 @@ export const ds = tokens; contextualVarsJson: '{}',\n\ }),\n\ };\n\ - export const system = { toConfig: () => ({ propConfig: '{}', groupRegistry: '{}' }) };\n", + export const system = { toConfig: () => ({ propConfig: '{}', groupRegistry: '{}' }), getVocabularyRecord: () => ({ version: 1, keyframes: [], globalStyles: [], collisions: [], legacyVerbs: [] }) };\n", ); write_fixture( &dir.join("kit/index.ts"), "export const kit = {\n\ - system: { toConfig: () => ({ propConfig: '{}', groupRegistry: '{}' }) },\n\ + system: { toConfig: () => ({ propConfig: '{}', groupRegistry: '{}' }), getVocabularyRecord: () => ({ version: 1, keyframes: [], globalStyles: [], collisions: [], legacyVerbs: [] }) },\n\ theme: {\n\ colors: { externalAccent: '#f0f' },\n\ manifest: { variableMap: { 'colors.externalAccent': '--color-external-accent' } },\n\ @@ -2385,10 +2734,10 @@ export const ds = tokens; #[test] fn asset_placeholder_survives_the_loader_round_trip() { // standardize-inheritance-and-assets (rust-system-loader delta): an - // `asset()` placeholder inside a global style block's fontFaces - // serializes through evaluation with its specifier bytes intact and - // WITHOUT any resolution attempt — the scratch dir contains no such - // file, and the load must not care. + // `asset()` placeholder inside a REGISTERED global style block's + // fontFaces serializes through the record with its specifier bytes + // intact and WITHOUT any resolution attempt — the scratch dir + // contains no such file, and the load must not care. let dir = scratch_dir("asset-placeholder"); let entry = dir.join("entry.ts"); write_fixture( @@ -2410,7 +2759,7 @@ export const ds = tokens; contextualVarsJson: '{}',\n\ }),\n\ };\n\ - export const system = { toConfig: () => ({ propConfig: '{}', groupRegistry: '{}' }) };\n", + export const system = { toConfig: () => ({ propConfig: '{}', groupRegistry: '{}' }), getVocabularyRecord: () => ({ version: 1, keyframes: [], globalStyles: [{ name: 'globals', styles: globals.styles, fontFaces: globals.fontFaces }], collisions: [], legacyVerbs: [] }) };\n", ); let result = load_system_module(&entry.to_string_lossy(), &dir.to_string_lossy(), None); @@ -2440,7 +2789,7 @@ export const ds = tokens; contextualVarsJson: '{}',\n\ }),\n\ };\n\ - export const system = { toConfig: () => ({ propConfig: '{}', groupRegistry: '{}' }) };\n", + export const system = { toConfig: () => ({ propConfig: '{}', groupRegistry: '{}' }), getVocabularyRecord: () => ({ version: 1, keyframes: [], globalStyles: [], collisions: [], legacyVerbs: [] }) };\n", ); let result = load_system_module(&entry.to_string_lossy(), &dir.to_string_lossy(), None); @@ -2471,7 +2820,7 @@ export const ds = tokens; }),\n\ };\n\ export const tokens = { color: 'red' };\n\ - export const system = { toConfig: () => ({ propConfig: '{}', groupRegistry: '{}' }) };\n", + export const system = { toConfig: () => ({ propConfig: '{}', groupRegistry: '{}' }), getVocabularyRecord: () => ({ version: 1, keyframes: [], globalStyles: [], collisions: [], legacyVerbs: [] }) };\n", ); let result = load_system_module(&entry.to_string_lossy(), &dir.to_string_lossy(), None); @@ -2501,7 +2850,7 @@ export const ds = tokens; contextualVarsJson: '{}',\n\ }),\n\ };\n\ - export const system = { toConfig: () => ({ propConfig: '{}', groupRegistry: '{}' }) };\n", + export const system = { toConfig: () => ({ propConfig: '{}', groupRegistry: '{}' }), getVocabularyRecord: () => ({ version: 1, keyframes: [], globalStyles: [], collisions: [], legacyVerbs: [] }) };\n", ); let result = load_system_module(&entry.to_string_lossy(), &dir.to_string_lossy(), None); @@ -2530,7 +2879,7 @@ export const ds = tokens; contextualVarsJson: '{}',\n\ }),\n\ };\n\ - export const system = { toConfig: () => ({ propConfig: '{}', groupRegistry: '{}' }) };\n", + export const system = { toConfig: () => ({ propConfig: '{}', groupRegistry: '{}' }), getVocabularyRecord: () => ({ version: 1, keyframes: [], globalStyles: [], collisions: [], legacyVerbs: [] }) };\n", ); let result = load_system_module(&entry.to_string_lossy(), &dir.to_string_lossy(), None); @@ -2558,7 +2907,7 @@ export const ds = tokens; addScale: () => ({}),\n\ addColors: () => ({}),\n\ };\n\ - export const system = { toConfig: () => ({ propConfig: '{}', groupRegistry: '{}' }) };\n", + export const system = { toConfig: () => ({ propConfig: '{}', groupRegistry: '{}' }), getVocabularyRecord: () => ({ version: 1, keyframes: [], globalStyles: [], collisions: [], legacyVerbs: [] }) };\n", ); let result = load_system_module(&entry.to_string_lossy(), &dir.to_string_lossy(), None); @@ -2593,7 +2942,7 @@ export const ds = tokens; contextualVarsJson: '{}',\n\ }),\n\ };\n\ - export const system = { toConfig: () => ({ propConfig: '{}', groupRegistry: '{}' }) };\n", + export const system = { toConfig: () => ({ propConfig: '{}', groupRegistry: '{}' }), getVocabularyRecord: () => ({ version: 1, keyframes: [], globalStyles: [], collisions: [], legacyVerbs: [] }) };\n", ); let result = load_system_module(&entry.to_string_lossy(), &dir.to_string_lossy(), None); @@ -2618,7 +2967,7 @@ export const ds = tokens; build: () => ({}),\n\ addScale: () => ({}),\n\ };\n\ - export const system = { toConfig: () => ({ propConfig: '{}', groupRegistry: '{}' }) };\n", + export const system = { toConfig: () => ({ propConfig: '{}', groupRegistry: '{}' }), getVocabularyRecord: () => ({ version: 1, keyframes: [], globalStyles: [], collisions: [], legacyVerbs: [] }) };\n", ); let result = load_system_module(&entry.to_string_lossy(), &dir.to_string_lossy(), None); @@ -2641,7 +2990,7 @@ export const ds = tokens; write_fixture( &entry, "export const theme = { color: 'red' };\n\ - export const system = { toConfig: () => ({ propConfig: '{}', groupRegistry: '{}' }) };\n", + export const system = { toConfig: () => ({ propConfig: '{}', groupRegistry: '{}' }), getVocabularyRecord: () => ({ version: 1, keyframes: [], globalStyles: [], collisions: [], legacyVerbs: [] }) };\n", ); let result = load_system_module(&entry.to_string_lossy(), &dir.to_string_lossy(), None); @@ -2673,7 +3022,7 @@ export const ds = tokens; }),\n\ };\n\ export const tokens = theme;\n\ - export const system = { toConfig: () => ({ propConfig: '{}', groupRegistry: '{}' }) };\n", + export const system = { toConfig: () => ({ propConfig: '{}', groupRegistry: '{}' }), getVocabularyRecord: () => ({ version: 1, keyframes: [], globalStyles: [], collisions: [], legacyVerbs: [] }) };\n", ); let result = load_system_module(&entry.to_string_lossy(), &dir.to_string_lossy(), None); @@ -2707,7 +3056,7 @@ export const ds = tokens; contextualVarsJson: '{}',\n\ }),\n\ };\n\ - export const system = { toConfig: () => ({ propConfig: '{}', groupRegistry: '{}' }) };\n", + export const system = { toConfig: () => ({ propConfig: '{}', groupRegistry: '{}' }), getVocabularyRecord: () => ({ version: 1, keyframes: [], globalStyles: [], collisions: [], legacyVerbs: [] }) };\n", ); let result = load_system_module(&entry.to_string_lossy(), &dir.to_string_lossy(), None); @@ -2973,6 +3322,117 @@ export const ds = tokens; ); } + #[test] + fn resolve_exports_entry_wildcard_subpath_pattern() { + // Node's `exports` wildcard form, verbatim from `@ark-ui/react` 5.36.2: + // every component subpath is served by one `"./*"` pattern. Without + // pattern support the whole package is unresolvable to this loader + // while Node and Vite resolve it fine. + let exports: serde_json::Value = serde_json::json!({ + ".": { + "import": { "types": "./dist/index.d.ts", "default": "./dist/index.js" } + }, + "./factory": { + "import": { "types": "./dist/components/factory.d.ts", "default": "./dist/components/factory.js" } + }, + "./*": { + "import": { "types": "./dist/components/*/index.d.ts", "default": "./dist/components/*/index.js" } + }, + "./package.json": "./package.json" + }); + + assert_eq!( + resolve_exports_entry(&exports, "/field"), + Some("./dist/components/field/index.js".to_string()), + "a `./*` pattern must substitute the matched subpath" + ); + // An exact key still wins over the pattern that would also match it. + assert_eq!( + resolve_exports_entry(&exports, "/factory"), + Some("./dist/components/factory.js".to_string()) + ); + assert_eq!( + resolve_exports_entry(&exports, "."), + Some("./dist/index.js".to_string()) + ); + } + + #[test] + fn resolve_exports_entry_wildcard_longest_prefix_wins() { + // Node's PATTERN_KEY_COMPARE: the pattern with the longest literal + // prefix wins, then the longest suffix. + let exports: serde_json::Value = serde_json::json!({ + "./*": "./dist/*.js", + "./lib/*": "./dist/lib/*.js", + "./lib/*.css": "./dist/lib/*.css" + }); + + assert_eq!( + resolve_exports_entry(&exports, "/thing"), + Some("./dist/thing.js".to_string()) + ); + assert_eq!( + resolve_exports_entry(&exports, "/lib/thing"), + Some("./dist/lib/thing.js".to_string()) + ); + assert_eq!( + resolve_exports_entry(&exports, "/lib/thing.css"), + Some("./dist/lib/thing.css".to_string()) + ); + } + + #[test] + fn resolve_exports_entry_without_pattern_still_falls_through() { + // No matching key and no pattern → `None`, so `resolve_bare_specifier` + // keeps falling through to `module`/`main` exactly as before. + let exports: serde_json::Value = serde_json::json!({ + ".": "./dist/index.js", + "./groups": "./dist/groups/index.js" + }); + assert_eq!(resolve_exports_entry(&exports, "/missing"), None); + } + + #[test] + fn resolve_bare_specifier_through_wildcard_exports() { + // The end-to-end resolver over a fixture package.json carrying a + // `"./*"` exports map: the subpath file on disk must be found. + let dir = scratch_dir("wildcard-exports"); + let pkg = dir.join("node_modules/@fixture/wildcard-kit"); + write_fixture( + &pkg.join("package.json"), + "{\n \"name\": \"@fixture/wildcard-kit\",\n \"type\": \"module\",\n \"main\": \"dist/index.cjs\",\n \"module\": \"dist/index.js\",\n \"exports\": {\n \".\": { \"import\": { \"types\": \"./dist/index.d.ts\", \"default\": \"./dist/index.js\" } },\n \"./*\": { \"import\": { \"types\": \"./dist/components/*/index.d.ts\", \"default\": \"./dist/components/*/index.js\" } }\n }\n}\n", + ); + write_fixture(&pkg.join("dist/index.js"), "export const kit = 1;\n"); + write_fixture( + &pkg.join("dist/components/field/index.js"), + "export const Field = 1;\n", + ); + let from_dir = dir.join("src"); + fs::create_dir_all(&from_dir).expect("create importing dir"); + + let resolved = + resolve_bare_specifier("@fixture/wildcard-kit/field", &from_dir.to_string_lossy()); + let root = resolve_bare_specifier("@fixture/wildcard-kit", &from_dir.to_string_lossy()); + let missing = + resolve_bare_specifier("@fixture/wildcard-kit/absent", &from_dir.to_string_lossy()); + let _ = fs::remove_dir_all(&dir); + + let resolved = resolved.expect("a `./*` exports pattern must resolve its subpath"); + assert!( + resolved.ends_with("dist/components/field/index.js"), + "unexpected resolution: {resolved}" + ); + let root = root.expect("the `.` entry must still resolve"); + assert!(root.ends_with("dist/index.js"), "unexpected root: {root}"); + // A pattern that matches but whose substituted target is absent from + // disk stays unresolvable — the resolver never invents a path. + let error = missing.expect_err("an absent pattern target must not resolve"); + assert!( + error.contains("@fixture/wildcard-kit/absent"), + "error must name the specifier: {error}" + ); + } + // Integration tests that require the workspace to be built // are gated behind the file existence check. diff --git a/packages/extract/pipeline/discover-packages.ts b/packages/extract/pipeline/discover-packages.ts index 4a6a3516..fbd672aa 100644 --- a/packages/extract/pipeline/discover-packages.ts +++ b/packages/extract/pipeline/discover-packages.ts @@ -180,12 +180,6 @@ export interface CollectedExternalPackages { packageMap: Record; /** specifier → absolute src/index.ts path, only for packages with one. */ sourceEntries: Map; - /** specifier → absolute entry to scan for branded `Keyframes` collections — - * one per admitted specifier, whatever the package's shape: the redirected - * source entry when src/ serves it, the resolved (dist) entry otherwise. - * Keyed separately from `sourceEntries` because that map doubles as the - * hosts' module-resolution redirect and stays src-only by contract. */ - keyframesScanEntries: Map; /** Absolute directories for bundler loader allowlisting (src/ or dist entry dir). */ packageDirs: string[]; /** Absolute package dir → EVERY declared specifier that claimed it, in @@ -271,7 +265,6 @@ export async function collectExternalPackageSources(opts: { const pushed = new Set(); const packageMap: Record = {}; const sourceEntries = new Map(); - const keyframesScanEntries = new Map(); const packageDirs: string[] = []; const dirOwnerSets: Record = {}; const dirExtensions: Record = {}; @@ -330,7 +323,6 @@ export async function collectExternalPackageSources(opts: { } else { packageMap[specifier] = relative(rootDir, absEntry); } - keyframesScanEntries.set(specifier, srcEntry ?? absEntry); // A kit declared at a subpath is routinely imported at its package // ROOT by app code (`import { Card } from '@scope/kit'`), and a root @@ -351,10 +343,6 @@ export async function collectExternalPackageSources(opts: { if (rootEntry) { packageMap[packageName] = relative(rootDir, rootEntry); sourceEntries.set(packageName, rootEntry); - // The root module routinely carries the package's `Keyframes` - // exports (a definition subpath usually doesn't re-export them) - // — the alias scans alongside the declared entry. - keyframesScanEntries.set(packageName, rootEntry); } } } @@ -399,7 +387,6 @@ export async function collectExternalPackageSources(opts: { onPackageResolved?.(specifier, outputDir); const relPath = relative(rootDir, absEntry); packageMap[specifier] = relPath; - keyframesScanEntries.set(specifier, absEntry); const outputExtensions = new Set(extensionsSet); outputExtensions.add(extname(absEntry)); @@ -453,7 +440,6 @@ export async function collectExternalPackageSources(opts: { entries, packageMap, sourceEntries, - keyframesScanEntries, packageDirs, dirOwnerSets, dirExtensions, @@ -516,11 +502,6 @@ export function excludeCollectedPackages( if (targetRejected(specifier, absEntry)) continue; sourceEntries.set(specifier, absEntry); } - const keyframesScanEntries = new Map(); - for (const [specifier, absEntry] of collected.keyframesScanEntries) { - if (targetRejected(specifier, absEntry)) continue; - keyframesScanEntries.set(specifier, absEntry); - } const dirOwnerSets: Record = {}; for (const [dir, specs] of Object.entries(collected.dirOwnerSets)) { const kept = specs.filter((s) => !rejectedSpecifiers.has(s)); @@ -544,7 +525,6 @@ export function excludeCollectedPackages( ), packageMap, sourceEntries, - keyframesScanEntries, packageDirs: collected.packageDirs.filter( (dir) => !rejectedDirs.includes(dir) ), diff --git a/packages/extract/pipeline/engine-adapter.ts b/packages/extract/pipeline/engine-adapter.ts index f47628ee..2054e03a 100644 --- a/packages/extract/pipeline/engine-adapter.ts +++ b/packages/extract/pipeline/engine-adapter.ts @@ -48,8 +48,6 @@ export interface EngineApi { // it returns, so the surface stays loose here. // eslint-disable-next-line @typescript-eslint/no-explicit-any loadSystemModule: (...args: unknown[]) => any; - /** Keyframes-only scan of an external package entry. */ - scanKeyframesExports: (entryPath: string, rootDir: string) => string | null; /** Parse-only native fact extraction used to prepare adapted sources. */ extractFacts?: (filesJson: string) => string; analyzeProject: ( @@ -162,7 +160,7 @@ export function createV2EngineApi(deps: V2EngineAdapterDeps): () => EngineApi { if (!isV2()) { // SAFETY: the v1 leg IS the native module — `EngineApi` was derived from // the surface `animus-extract-v2`'s NAPI entry points already export - // (loadSystemModule / scanKeyframesExports / analyzeProject / + // (loadSystemModule / analyzeProject / // transformFile / clearAnalysisCache), which is why the v2 adapter below // can mimic it. The module's own generated `index.d.ts` is authoritative // and `loadNativeEngine` is declared `any`, so this names the surface the @@ -173,10 +171,6 @@ export function createV2EngineApi(deps: V2EngineAdapterDeps): () => EngineApi { return { loadSystemModule: (...args: unknown[]) => native.loadSystemModule(...args), - // Keyframes-only scan of an external package entry; returns the - // collections JSON or null, throws on evaluation failure. - scanKeyframesExports: (entryPath: string, rootDir: string) => - native.scanKeyframesExports(entryPath, rootDir) ?? null, extractFacts: (filesJson) => native.extractFacts(filesJson), analyzeProject: ( filesJsonRaw, diff --git a/packages/extract/pipeline/external-keyframes.ts b/packages/extract/pipeline/external-keyframes.ts deleted file mode 100644 index 1bab3686..00000000 --- a/packages/extract/pipeline/external-keyframes.ts +++ /dev/null @@ -1,144 +0,0 @@ -import { parseInternalWire } from './internal-wire'; - -import type { ManifestDiagnostic } from './manifest-diagnostics'; - -/** Stable codes for external keyframes discovery. */ -export const KEYFRAMES_EXTERNAL_ENTRY_FAILED = - 'animus.keyframes.external-entry-failed'; -export const KEYFRAMES_EXPORT_COLLISION = 'animus.keyframes.export-collision'; - -/** - * The scanned-keyframes wire: export name → that export's collection. The - * system loader's `extract_keyframes_blocks` produces this shape on BOTH sides - * of the merge below — for the consumer system (`SystemConfig.keyframesJson`) - * and for every external entry (`scanKeyframesExports`) — so one declaration - * covers both, and a collection that survives the merge is re-serialized - * unchanged. - */ -interface KeyframesCollections { - [exportName: string]: KeyframesCollection; -} - -/** One branded `Keyframes` export, flattened to its `__frames` record. */ -interface KeyframesCollection { - [keyframeName: string]: KeyframeBlock; -} - -/** One keyframe: the emitted `@keyframes` identity plus its authored steps. */ -interface KeyframeBlock { - /** Content-hashed `@keyframes` name the emitter declares and references. */ - name: string; - frames: KeyframeSteps; -} - -/** Step selector (`from`, `to`, `NN%`) → that step's CSS declarations. */ -interface KeyframeSteps { - [step: string]: KeyframeDeclarations; -} - -/** CSS property → value as authored: raw CSS, a number, or a `{scale.key}` - * token reference the engine resolves at emission. */ -interface KeyframeDeclarations { - [property: string]: string | number; -} - -export interface ExternalKeyframesMerge { - /** Consumer collections merged with every discovered external collection - * (consumer wins on name collisions); `null` when nothing exists. */ - keyframesJson: string | null; - /** Warn-severity diagnostics for failed entries and name collisions — - * surfaced through the shared manifest-diagnostics policy point. */ - diagnostics: ManifestDiagnostic[]; -} - -/** - * Merge `Keyframes` collections discovered from external package entries into - * the consumer system's collections. Keyframes are the sole carve-out from - * the consumer-config singular-authority rule: nothing but branded - * collections is read from an entry, an entry that fails to evaluate - * degrades to a coded diagnostic naming it, and a collection whose export - * name collides keeps the earlier (consumer-first) collection with a coded - * diagnostic instead of silently reordering names. - */ -export function mergeExternalKeyframes( - scan: (entryPath: string, rootDir: string) => string | null, - consumerKeyframesJson: string | null | undefined, - externalEntries: Iterable, - rootDir: string -): ExternalKeyframesMerge { - const merged: KeyframesCollections = {}; - if (consumerKeyframesJson) { - try { - Object.assign(merged, JSON.parse(consumerKeyframesJson)); - } catch { - // Delegation, not a swallow: the consumer payload's owner is the system - // loader that produced it (`SystemConfig.keyframesJson`), and the caller - // hands the same field straight to the engine. Returning the ORIGINAL - // string leaves the malformed bytes to fail at that owner instead of - // substituting a value this merge invented. - return { keyframesJson: consumerKeyframesJson, diagnostics: [] }; - } - } - const diagnostics: ManifestDiagnostic[] = []; - const seenEntries = new Set(); - - for (const entryPath of externalEntries) { - if (seenEntries.has(entryPath)) continue; - seenEntries.add(entryPath); - - let scanned: string | null; - try { - scanned = scan(entryPath, rootDir); - } catch (error) { - diagnostics.push({ - file: entryPath, - component: 'keyframes', - kind: 'warn', - message: - `external package entry failed the keyframes scan — its collections are invisible to extraction: ${String(error)}. ` + - `Keyframe collections must be reachable from the package's definition entry without evaluating framework re-exports: ` + - `export them (directly or as a named re-export) from the definition entry, and avoid \`export *\` of framework packages there ` + - `(${KEYFRAMES_EXTERNAL_ENTRY_FAILED})`, - code: KEYFRAMES_EXTERNAL_ENTRY_FAILED, - severity: 'warn', - }); - continue; - } - if (!scanned) continue; - - // The scan RESULT is animus's own wire — `scanKeyframesExports` is a NAPI - // entry point and the engine serializes it. An entry that fails to - // EVALUATE is an external-package failure and degrades to the coded - // diagnostic above; an entry that evaluates and then yields unparseable - // engine output is an engine bug, and `continue` would drop its - // collections indistinguishably from "this package ships no keyframes". - const collections = parseInternalWire( - scanned, - `keyframes collections scanned from '${entryPath}' ` + - "(the engine's scanKeyframesExports)" - ); - for (const [exportName, collection] of Object.entries(collections)) { - const existing = merged[exportName]; - if (existing !== undefined) { - if (JSON.stringify(existing) !== JSON.stringify(collection)) { - diagnostics.push({ - file: entryPath, - component: exportName, - kind: 'warn', - message: `keyframes collection export '${exportName}' collides with an earlier collection of the same name — the earlier one wins (${KEYFRAMES_EXPORT_COLLISION})`, - code: KEYFRAMES_EXPORT_COLLISION, - severity: 'warn', - }); - } - continue; - } - merged[exportName] = collection; - } - } - - return { - keyframesJson: - Object.keys(merged).length > 0 ? JSON.stringify(merged) : null, - diagnostics, - }; -} diff --git a/packages/extract/pipeline/index.ts b/packages/extract/pipeline/index.ts index 78f8a597..69524896 100644 --- a/packages/extract/pipeline/index.ts +++ b/packages/extract/pipeline/index.ts @@ -26,12 +26,6 @@ export { RETIRED_ENGINE_MESSAGE, } from './engine-retirement'; export { contentHash } from './content-hash'; -export { - KEYFRAMES_EXPORT_COLLISION, - KEYFRAMES_EXTERNAL_ENTRY_FAILED, - mergeExternalKeyframes, -} from './external-keyframes'; -export type { ExternalKeyframesMerge } from './external-keyframes'; export type { AnimusCoreOptions, AnimusMode, @@ -164,6 +158,9 @@ export { isUnresolvedParentDrop, surfaceManifestDiagnostics, unresolvedParentName, + VOCABULARY_COLLISION, + VOCABULARY_LEGACY_VERB, + vocabularyWitnessDiagnostics, } from './manifest-diagnostics'; export type { DefaultExtension, PreprocessMdxResult } from './mdx-preprocessor'; export { diff --git a/packages/extract/pipeline/manifest-diagnostics.ts b/packages/extract/pipeline/manifest-diagnostics.ts index d8eec919..cf214a0d 100644 --- a/packages/extract/pipeline/manifest-diagnostics.ts +++ b/packages/extract/pipeline/manifest-diagnostics.ts @@ -122,6 +122,76 @@ export function collectSelectorAliasDiagnostics( return diagnostics; } +/** Stable code for a vocabulary-record collision witness (mirrors the + * entry code minted by @animus-ui/system's merge). */ +export const VOCABULARY_COLLISION = 'animus.vocabulary.collision'; + +/** Stable code for a legacy-verb carriage refusal (a sealed kit with + * registered vocabulary consumed through `from()`/`includes:`). */ +export const VOCABULARY_LEGACY_VERB = 'animus.vocabulary.legacy-verb'; + +/** + * Map the sealed system's vocabulary witness entries + * (vocabulary-registration: collision + legacy-verb records, carried on the + * registration record because the loader's evaluation host shims `console` + * to a no-op) into coded diagnostics for the shared surfacing policy point. + * ONE mapper for every host — the witness text must not fork per plugin. + */ +export function vocabularyWitnessDiagnostics( + vocabularyWitnessesJson: string | null | undefined +): ManifestDiagnostic[] { + if (!vocabularyWitnessesJson) return []; + const entries = parseInternalWire< + Array<{ + code?: string; + name?: string; + winner?: string; + loser?: string; + verb?: string; + source?: string; + names?: string[]; + }> + >( + vocabularyWitnessesJson, + "vocabularyWitnessesJson (the sealed system's vocabulary witness record)" + ); + const diagnostics: ManifestDiagnostic[] = []; + for (const entry of entries) { + if (entry.code === VOCABULARY_COLLISION) { + diagnostics.push({ + file: 'system', + component: entry.name ?? 'keyframes', + kind: 'warn', + message: `keyframes vocabulary "${entry.name}" is registered by both ${entry.loser} and ${entry.winner} — ${entry.winner} wins; rename one collection (${entry.code})`, + code: entry.code, + severity: 'warn', + }); + } else if (entry.code === VOCABULARY_LEGACY_VERB) { + diagnostics.push({ + file: 'system', + component: 'keyframes', + kind: 'warn', + message: `a sealed system (${entry.source ?? `'${entry.verb}' source`}) with registered vocabulary [${(entry.names ?? []).join(', ')}] was consumed through the deprecated '${entry.verb}' verb, which cannot carry it — those collections do NOT reach this consumer; use createSystem().extend(source) (${entry.code})`, + code: entry.code, + severity: 'warn', + }); + } else { + // Fail closed (arch-fail-closed-diagnostics): a witness entry this + // host does not recognize still surfaces, carrying its own code — a + // newer @animus-ui/system's witness kind must never vanish silently. + diagnostics.push({ + file: 'system', + component: 'vocabulary', + kind: 'warn', + message: `unrecognized vocabulary witness entry ${JSON.stringify(entry)} — a newer @animus-ui/system may have recorded a witness kind this host predates${entry.code ? ` (${entry.code})` : ''}`, + code: entry.code, + severity: 'warn', + }); + } + } + return diagnostics; +} + /** * Surface extraction-manifest diagnostics through a plugin's warn channel. * diff --git a/packages/extract/pipeline/system-config.ts b/packages/extract/pipeline/system-config.ts index 9d36490f..1f8d02be 100644 --- a/packages/extract/pipeline/system-config.ts +++ b/packages/extract/pipeline/system-config.ts @@ -30,6 +30,13 @@ export interface SystemConfig { transformSourcesJson?: string | null; globalStyleBlocksJson: string | null; keyframesJson: string | null; + /** Vocabulary witness entries from the sealed system's registration + * record — one JSON array of coded entries (collisions and legacy-verb + * carriage refusals). The record — not the evaluation host's console, + * which is shimmed to a no-op — is the witness channel; hosts surface + * each entry via `vocabularyWitnessDiagnostics`. Optional so pre-load + * `emptySystemConfig()` defaults need not restate it. */ + vocabularyWitnessesJson?: string | null; /** Canonical absolute paths of every module the loader evaluated for this * system (sorted; entry included, runtime stubs excluded). Plugins use it * as the geological-reset membership set. Optional so pre-load @@ -93,6 +100,7 @@ export function loadSystemConfig( transformSourcesJson: config.transformSources || null, globalStyleBlocksJson: config.globalStyleBlocks || null, keyframesJson: config.keyframesBlocks || null, + vocabularyWitnessesJson: config.vocabularyWitnesses || null, dependencies: config.dependencies ?? [], sourceThemeManifestsJson: config.sourceThemeManifests || null, }; diff --git a/packages/extract/session/extraction-session.ts b/packages/extract/session/extraction-session.ts index c49affe7..3383781c 100644 --- a/packages/extract/session/extraction-session.ts +++ b/packages/extract/session/extraction-session.ts @@ -34,8 +34,8 @@ import { isExcludedPackageRelativePath, isPathWithinRoot, loadSystemConfig, - mergeExternalKeyframes, postProcessCss, + vocabularyWitnessDiagnostics, projectExternalFileOwners, resolveAssetFile, resolveLightningTargets, @@ -323,8 +323,9 @@ export class ExtractionSession { private readonly options: SessionOptions; private readonly staticCssJson: string | null; private system: SystemConfig | null = null; - /** Discovery-time keyframes diagnostics awaiting the shared surfacing pass. */ - private externalKeyframesDiagnostics: ManifestDiagnostic[] = []; + /** Vocabulary witness diagnostics from the sealed system's registration + * record (vocabulary-registration), awaiting the shared surfacing pass. */ + private systemVocabularyDiagnostics: ManifestDiagnostic[] = []; /** Full package-resolution map from the last full pipeline — replayed by * incremental passes (sourceEntries alone omits dist-resolved packages). */ private lastPackageMap: Record = {}; @@ -1026,6 +1027,12 @@ export class ExtractionSession { rootDir, prefix: this.options.prefix, }); + // The sealed record is the witness channel (the loader's evaluation + // host shims console): map its coded entries for the shared surfacing + // policy point. + this.systemVocabularyDiagnostics = vocabularyWitnessDiagnostics( + this.system.vocabularyWitnessesJson + ); // Asset specifiers resolve against the system just loaded — drop the // per-specifier copy memo so a changed reference re-reads and re-hashes. this.assetCopyCache.clear(); @@ -1244,32 +1251,6 @@ export class ExtractionSession { this.externalPackageDirs = admitted.packageDirs; - // Keyframes-only carve-out: external package entries - // contribute their `Keyframes` collections; consumer system authority - // is untouched (vite-plugin parity — see PluginContext.applyExternalKeyframes). - // Scan entries cover EVERY admitted package (src entry or dist entry) — - // deriving from sourceEntries would silently skip dist-only packages. - if (this.system && admitted.keyframesScanEntries.size > 0) { - const api = engineApi(); - const merge = mergeExternalKeyframes( - (entry, root) => api.scanKeyframesExports(entry, root), - this.system.keyframesJson, - admitted.keyframesScanEntries.values(), - this.rootDir! - ); - this.system.keyframesJson = merge.keyframesJson; - // Surfacing stays with the single shared policy point inside - // runProjectAnalysis (this file performs no local surfacing) — - // stash for analyzeAndEmit to carry. - this.externalKeyframesDiagnostics = merge.diagnostics; - } else { - // No admitted scan entries: the freshly-loaded system already carries - // exactly its consumer collections, and diagnostics recorded for - // packages no longer declared must not ride every later analysis - // (vite-plugin parity — applyExternalKeyframes' reset arm). - this.externalKeyframesDiagnostics = []; - } - bt.packageResolve = this.elapsed(t); // Step 5+: hand off to the shared analysis + emit core. Production pass @@ -1351,7 +1332,7 @@ export class ExtractionSession { externalFileOwners: this.externalFileOwners, externalSourceEntries: this.externalSourceEntries, externalPackageDirs: this.externalPackageDirs, - externalKeyframesDiagnostics: this.externalKeyframesDiagnostics, + systemVocabularyDiagnostics: this.systemVocabularyDiagnostics, }; } @@ -1700,7 +1681,7 @@ export class ExtractionSession { ...analysisOptions, warn: (message) => this.warn(message), strict: this.options.strict, - extraDiagnostics: this.externalKeyframesDiagnostics, + extraDiagnostics: this.systemVocabularyDiagnostics, }); // Error-diagnostic escalation (extraction-diagnostics §Error diagnostics diff --git a/packages/extract/tests/collect-external-packages.test.ts b/packages/extract/tests/collect-external-packages.test.ts index 0d3e16ba..a60f6d91 100644 --- a/packages/extract/tests/collect-external-packages.test.ts +++ b/packages/extract/tests/collect-external-packages.test.ts @@ -203,47 +203,13 @@ describe('collectExternalPackageSources', () => { expect(result.packageDirs).toEqual([join(pkg, 'dist')]); }); - test('tracks a keyframes scan entry for every admitted package (src or dist)', async () => { - const root = makeRoot(); - const srcPkg = makePackage(join(root, 'packages', 'ds'), { - 'src/index.ts': 'export const ds = 1;', - }); - const distPkg = makePackage( - join(root, 'node_modules', '@x', 'compiled-ds'), - { 'dist/definition.mjs': 'export const system = 1;' } - ); - const subpathPkg = makePackage(join(root, 'packages', 'subpath'), { - 'src/definition.ts': 'export const system = 1;', - 'main.ts': 'export {};', - }); - - const result = await collect(root, { - '@x/ds': join(srcPkg, 'dist', 'index.mjs'), - '@x/compiled-ds/definition': join(distPkg, 'dist', 'definition.mjs'), - '@x/subpath': join(subpathPkg, 'main.ts'), - }); - - // A src package scans its redirected source entry; a dist-only package - // scans the resolved dist entry — imported `Keyframes` collections are - // reachable either way, never only for src-shipping packages. - expect(result.keyframesScanEntries.get('@x/ds')).toBe( - join(srcPkg, 'src', 'index.ts') - ); - expect(result.keyframesScanEntries.get('@x/compiled-ds/definition')).toBe( - join(distPkg, 'dist', 'definition.mjs') - ); - // src/ exists but cannot serve the entry: the resolved entry itself scans. - expect(result.keyframesScanEntries.get('@x/subpath')).toBe( - join(subpathPkg, 'main.ts') - ); - expect(result.keyframesScanEntries.size).toBe(3); - }); - - test('a derived root alias scans its root entry for keyframes too', async () => { - // A kit declared at a subpath (`@x/kit/definition`) routinely exports - // its `Keyframes` collections from the package ROOT module only; the - // derived root alias must scan alongside the declared entry or those - // collections silently vanish from the merge. + test('a derived root alias keeps its module-resolution redirect', async () => { + // A kit declared at a subpath (`@x/kit/definition`) is routinely + // imported at its package ROOT by app code; the derived root alias + // redirects that import to src so the app never bundles untransformed + // dist chains. The redirect is resolution-only — nothing evaluates the + // root entry (vocabulary-registration ended discovery-by-scan; a kit's + // collections reach consumers through its sealed system's record). const root = makeRoot(); const pkg = makePackage(join(root, 'packages', 'kit'), { 'src/index.ts': 'export const kitMotion = 1;', @@ -254,10 +220,10 @@ describe('collectExternalPackageSources', () => { '@x/kit/definition': join(pkg, 'src', 'definition.ts'), }); - expect(result.keyframesScanEntries.get('@x/kit/definition')).toBe( - join(pkg, 'src', 'definition.ts') + expect(result.packageMap['@x/kit']).toBe( + relative(root, join(pkg, 'src', 'index.ts')) ); - expect(result.keyframesScanEntries.get('@x/kit')).toBe( + expect(result.sourceEntries.get('@x/kit')).toBe( join(pkg, 'src', 'index.ts') ); }); @@ -603,7 +569,6 @@ describe('collectExternalPackageSources', () => { '@x/a': 'packages/a/src/index.ts', }); expect([...admitted.sourceEntries.keys()]).toEqual(['@x/a']); - expect([...admitted.keyframesScanEntries.keys()]).toEqual(['@x/a']); expect(admitted.packageDirs).toEqual([join(kitA, 'src')]); expect(firstOwners(admitted.dirOwnerSets)).toEqual({ [join(kitA, 'src')]: '@x/a', diff --git a/packages/extract/tests/external-keyframes.test.ts b/packages/extract/tests/external-keyframes.test.ts deleted file mode 100644 index 8539e30f..00000000 --- a/packages/extract/tests/external-keyframes.test.ts +++ /dev/null @@ -1,121 +0,0 @@ -import { describe, expect, it } from 'vitest'; - -import { - KEYFRAMES_EXPORT_COLLISION, - KEYFRAMES_EXTERNAL_ENTRY_FAILED, - mergeExternalKeyframes, -} from '../pipeline/external-keyframes'; - -const kitCollection = { - kitMotion: { - pulse: { name: 'animus-kf-kit', frames: { from: { opacity: 0.4 } } }, - }, -}; - -describe('mergeExternalKeyframes', () => { - it('merges external collections into consumer collections', () => { - const consumer = JSON.stringify({ - animations: { spin: { name: 'animus-kf-consumer', frames: {} } }, - }); - const result = mergeExternalKeyframes( - () => JSON.stringify(kitCollection), - consumer, - ['/pkg/kit/src/index.ts'], - '/root' - ); - expect(result.diagnostics).toEqual([]); - const merged = JSON.parse(result.keyframesJson!); - expect(Object.keys(merged).sort()).toEqual(['animations', 'kitMotion']); - }); - - it('consumer wins name collisions with a coded diagnostic', () => { - const consumer = JSON.stringify({ - kitMotion: { pulse: { name: 'animus-kf-consumer', frames: {} } }, - }); - const result = mergeExternalKeyframes( - () => JSON.stringify(kitCollection), - consumer, - ['/pkg/kit/src/index.ts'], - '/root' - ); - expect(result.diagnostics).toHaveLength(1); - expect(result.diagnostics[0].code).toBe(KEYFRAMES_EXPORT_COLLISION); - expect(result.diagnostics[0].severity).toBe('warn'); - const merged = JSON.parse(result.keyframesJson!); - expect(merged.kitMotion.pulse.name).toBe('animus-kf-consumer'); - }); - - it('identical re-exports collide silently (no diagnostic)', () => { - const consumer = JSON.stringify(kitCollection); - const result = mergeExternalKeyframes( - () => JSON.stringify(kitCollection), - consumer, - ['/pkg/kit/src/index.ts'], - '/root' - ); - expect(result.diagnostics).toEqual([]); - }); - - it('a throwing entry degrades to a coded diagnostic and other entries proceed', () => { - const result = mergeExternalKeyframes( - (entry) => { - if (entry.includes('broken')) throw new Error('QuickJS eval failed'); - return JSON.stringify(kitCollection); - }, - null, - ['/pkg/broken/src/index.ts', '/pkg/kit/src/index.ts'], - '/root' - ); - expect(result.diagnostics).toHaveLength(1); - expect(result.diagnostics[0].code).toBe(KEYFRAMES_EXTERNAL_ENTRY_FAILED); - expect(result.diagnostics[0].file).toBe('/pkg/broken/src/index.ts'); - // The teaching half: the message names the remedy, not just the failure. - expect(result.diagnostics[0].message).toContain('definition entry'); - expect(result.diagnostics[0].message).toContain('named re-export'); - expect(result.diagnostics[0].message).toContain('export *'); - expect(JSON.parse(result.keyframesJson!).kitMotion).toBeDefined(); - }); - - /** - * The scan result is animus's own wire: `scanKeyframesExports` is a NAPI - * entry point and its JSON is serialized by the engine, never authored by a - * package. A `catch { continue }` here dropped the entry's collections - * silently — indistinguishable from "this package ships no keyframes", the - * same success-looking default the ENTRY_FAILED diagnostic exists to avoid. - * An entry that fails to EVALUATE still degrades to that diagnostic (the - * external-package boundary); only unparseable engine output throws. - */ - it('throws when the engine returns unparseable scan JSON', () => { - expect(() => - mergeExternalKeyframes( - () => 'not json', - null, - ['/pkg/kit/src/index.ts'], - '/root' - ) - ).toThrow(/keyframes/); - expect(() => - mergeExternalKeyframes( - () => 'not json', - null, - ['/pkg/kit/src/index.ts'], - '/root' - ) - ).toThrow(/SyntaxError/); - }); - - it('returns null when nothing exists and dedupes repeated entries', () => { - let scans = 0; - const empty = mergeExternalKeyframes( - () => { - scans++; - return null; - }, - null, - ['/pkg/kit/src/index.ts', '/pkg/kit/src/index.ts'], - '/root' - ); - expect(empty.keyframesJson).toBeNull(); - expect(scans).toBe(1); - }); -}); diff --git a/packages/extract/tests/test-system.ts b/packages/extract/tests/test-system.ts index f8ead4a3..2d2fad0b 100644 --- a/packages/extract/tests/test-system.ts +++ b/packages/extract/tests/test-system.ts @@ -127,7 +127,9 @@ declare module '@animus-ui/system' { // ─── System ──────────────────────────────────────────────── -export const { system: ds } = createSystem() +// Sealed (vocabulary-registration): the loader consumes sealed instances +// only; a vocabulary-free fixture seals with an empty record. +export const ds = createSystem() .addGroup('flex', flex) .addGroup('grid', grid) .addGroup('mode', mode) @@ -140,4 +142,5 @@ export const { system: ds } = createSystem() .addGroup('typography', typography) .addGroup('positioning', positioning) .addGroup('transitions', transitions) - .build(); + .build() + .seal(); diff --git a/packages/extract/tests/vocabulary-witness-diagnostics.test.ts b/packages/extract/tests/vocabulary-witness-diagnostics.test.ts new file mode 100644 index 00000000..82177529 --- /dev/null +++ b/packages/extract/tests/vocabulary-witness-diagnostics.test.ts @@ -0,0 +1,71 @@ +import { describe, expect, it } from 'vitest'; + +import { + VOCABULARY_COLLISION, + VOCABULARY_LEGACY_VERB, + vocabularyWitnessDiagnostics, +} from '../pipeline'; + +describe('vocabularyWitnessDiagnostics — the one host mapper for the sealed record witness channel', () => { + it('maps a collision entry to a coded warn naming both sources', () => { + const diagnostics = vocabularyWitnessDiagnostics( + JSON.stringify([ + { + code: VOCABULARY_COLLISION, + name: 'motion', + winner: 'local registration #1', + loser: 'extended source #1', + }, + ]) + ); + expect(diagnostics).toHaveLength(1); + expect(diagnostics[0]).toMatchObject({ + code: VOCABULARY_COLLISION, + severity: 'warn', + component: 'motion', + }); + expect(diagnostics[0]?.message).toContain('extended source #1'); + expect(diagnostics[0]?.message).toContain('local registration #1'); + expect(diagnostics[0]?.message).toContain(VOCABULARY_COLLISION); + }); + + it('maps a legacy-verb entry to a coded warn naming the verb, the source, and the refused names', () => { + const diagnostics = vocabularyWitnessDiagnostics( + JSON.stringify([ + { + code: VOCABULARY_LEGACY_VERB, + verb: 'includes', + source: 'includes source #1', + names: ['kitMotion'], + }, + ]) + ); + expect(diagnostics).toHaveLength(1); + expect(diagnostics[0]).toMatchObject({ + code: VOCABULARY_LEGACY_VERB, + severity: 'warn', + }); + expect(diagnostics[0]?.message).toContain("'includes'"); + expect(diagnostics[0]?.message).toContain('includes source #1'); + expect(diagnostics[0]?.message).toContain('kitMotion'); + }); + + it('fails closed on an unrecognized witness code — the entry surfaces instead of vanishing', () => { + const diagnostics = vocabularyWitnessDiagnostics( + JSON.stringify([{ code: 'animus.vocabulary.future-kind', detail: 1 }]) + ); + expect(diagnostics).toHaveLength(1); + expect(diagnostics[0]).toMatchObject({ + code: 'animus.vocabulary.future-kind', + severity: 'warn', + }); + expect(diagnostics[0]?.message).toContain( + 'unrecognized vocabulary witness' + ); + }); + + it('an absent or empty channel maps to zero diagnostics', () => { + expect(vocabularyWitnessDiagnostics(null)).toEqual([]); + expect(vocabularyWitnessDiagnostics(undefined)).toEqual([]); + }); +}); diff --git a/packages/next-plugin/tests/svelte-source-lifecycle.test.ts b/packages/next-plugin/tests/svelte-source-lifecycle.test.ts index 54218d67..ff5966af 100644 --- a/packages/next-plugin/tests/svelte-source-lifecycle.test.ts +++ b/packages/next-plugin/tests/svelte-source-lifecycle.test.ts @@ -19,7 +19,6 @@ const mocks = vi.hoisted(() => ({ analyzeProject: vi.fn<(...args: AnalyzeProjectArgs) => string>(), transformFile: vi.fn(), clearAnalysisCache: vi.fn(), - scanKeyframesExports: vi.fn(), })); import { ExtractionSession } from '../../extract/session/extraction-session'; @@ -47,7 +46,6 @@ setEngineApiOverride(() => { analyzeProject: mocks.analyzeProject, transformFile: mocks.transformFile, clearAnalysisCache: mocks.clearAnalysisCache, - scanKeyframesExports: mocks.scanKeyframesExports, }; return mocks.extractFactsEnabled ? { ...api, extractFacts: mocks.extractFacts } @@ -233,7 +231,6 @@ beforeEach(() => { mocks.clearAnalysisCache.mockReset().mockImplementation(() => { activeTransformSources.clear(); }); - mocks.scanKeyframesExports.mockReset().mockReturnValue(null); }); afterEach(() => { diff --git a/packages/next-plugin/tests/watch-external-ingestion.test.ts b/packages/next-plugin/tests/watch-external-ingestion.test.ts index 1338ac43..f3306854 100644 --- a/packages/next-plugin/tests/watch-external-ingestion.test.ts +++ b/packages/next-plugin/tests/watch-external-ingestion.test.ts @@ -43,7 +43,6 @@ const mocks = vi.hoisted(() => ({ loadSystemModule: vi.fn(), analyzeProject: vi.fn(), clearAnalysisCache: vi.fn(), - scanKeyframesExports: vi.fn(), })); import { setEngineApiOverride } from '../../extract/session/singleton'; @@ -56,7 +55,6 @@ setEngineApiOverride(() => ({ loadSystemModule: mocks.loadSystemModule, analyzeProject: mocks.analyzeProject, clearAnalysisCache: mocks.clearAnalysisCache, - scanKeyframesExports: mocks.scanKeyframesExports, })); let restoreGlobals: () => void; @@ -134,7 +132,6 @@ beforeEach(() => { mocks.loadSystemModule.mockReset().mockReturnValue({ ...SYSTEM_CONFIG }); mocks.analyzeProject.mockReset().mockReturnValue(MANIFEST); mocks.clearAnalysisCache.mockReset(); - mocks.scanKeyframesExports.mockReset().mockReturnValue(null); }); afterEach(() => { @@ -532,36 +529,6 @@ describe('cross-volume external roots (design D5)', () => { }); describe('external keyframes discovery', () => { - test('a dist-only kit contributes its keyframes collections', async () => { - // Published packages routinely ship dist without src/ — their imported - // `Keyframes` collections must merge into the analysis inputs exactly - // like a src-shipping kit's (vite-plugin parity). - const systemSource = `import { createSystem } from '@animus-ui/system'; -import kit from '../../kits/compiled/dist/index.mjs'; -export const system = createSystem({}).extend(kit); -`; - const ws = createWorkspace(systemSource); - const distKit = join(ws.parent, 'kits', 'compiled'); - mkdirSync(join(distKit, 'dist'), { recursive: true }); - writeFileSync(join(distKit, 'package.json'), '{"name":"@kits/compiled"}'); - writeFileSync(join(distKit, 'dist', 'index.mjs'), 'export default {};\n'); - mocks.scanKeyframesExports - .mockReset() - .mockReturnValue('{"kitKeyframes":{"pulse":{"to":{"opacity":1}}}}'); - - const session = makeSession(ws.app); - await session.runFullPipeline(); - - expect(mocks.scanKeyframesExports).toHaveBeenCalledWith( - join(distKit, 'dist', 'index.mjs'), - ws.app - ); - // keyframesJson is analyzeProject positional arg 13 - // (buildAnalyzeProjectArgs). - const analyzeArgs = mocks.analyzeProject.mock.calls.at(-1)!; - expect(analyzeArgs[13]).toContain('kitKeyframes'); - }); - test('a directory event on a dist-only root keeps its widened-extension files', async () => { // A dist-only kit is collected with a WIDENED extension set (the entry's // own `.mjs`). A directory-granularity event marks its root dirty; the @@ -605,32 +572,4 @@ export const system = createSystem({}).extend(kit); }); expect(lastAnalyzedSource(kitButtonKey)).toBe(BUTTON_V2); }); - - test('undeclaring a package clears its recorded keyframes diagnostics', async () => { - // A scan warning recorded for a declared package must not outlive the - // declaration: once the include is removed and the pipeline reruns with - // an empty scan set, stale diagnostics may not ride later analyses - // (vite-plugin parity — applyExternalKeyframes' reset arm). - const ws = createWorkspace(); - mocks.scanKeyframesExports.mockReset().mockImplementation(() => { - throw new Error('unreadable entry'); - }); - - const session = makeSession(ws.app); - await session.runFullPipeline(); - const recorded = session['externalKeyframesDiagnostics']; - expect(recorded.length).toBeGreaterThan(0); - - // Remove the kit import — the geological rewrite of the system file — - // and run the full pipeline again with nothing to scan. - writeFileSync( - join(ws.app, 'src', 'system.ts'), - `import { createSystem } from '@animus-ui/system'; -export const system = createSystem({}); -` - ); - await session.runFullPipeline(); - - expect(session['externalKeyframesDiagnostics']).toEqual([]); - }); }); diff --git a/packages/next-plugin/tests/webpack-gauntlet/external-ingestion.test.ts b/packages/next-plugin/tests/webpack-gauntlet/external-ingestion.test.ts index c08c57a1..6fc57b7a 100644 --- a/packages/next-plugin/tests/webpack-gauntlet/external-ingestion.test.ts +++ b/packages/next-plugin/tests/webpack-gauntlet/external-ingestion.test.ts @@ -29,7 +29,6 @@ const mocks = vi.hoisted(() => ({ analyzeProject: vi.fn(), clearAnalysisCache: vi.fn(), transformFile: vi.fn(), - scanKeyframesExports: vi.fn(), })); import { setEngineApiOverride } from '../../../extract/session/singleton'; @@ -43,7 +42,6 @@ setEngineApiOverride(() => ({ analyzeProject: mocks.analyzeProject, clearAnalysisCache: mocks.clearAnalysisCache, transformFile: mocks.transformFile, - scanKeyframesExports: mocks.scanKeyframesExports, })); import animusLoader from '../../src/loader'; @@ -77,12 +75,9 @@ afterEach(() => { vi.restoreAllMocks(); }); -/** Suite arming: the shared canned engine plus this suite's - * scanKeyframesExports mock. */ +/** Suite arming: the shared canned engine. */ function armSuiteEngine(): void { - armCannedEngine(mocks, () => { - mocks.scanKeyframesExports.mockReset().mockReturnValue(null); - }); + armCannedEngine(mocks, () => {}); } /** Everything one external-workspace scenario drives its watch session with. */ diff --git a/packages/next-plugin/tests/webpack-gauntlet/harness.ts b/packages/next-plugin/tests/webpack-gauntlet/harness.ts index bca7db81..d02a0c4d 100644 --- a/packages/next-plugin/tests/webpack-gauntlet/harness.ts +++ b/packages/next-plugin/tests/webpack-gauntlet/harness.ts @@ -345,8 +345,7 @@ function parseCannedManifestComponents(serialized: string): ReplacementPlan[] { /** * Arm the canned NAPI engine: system config + canned analyze/transform. - * `extra` runs after the standard arming for suite-specific mocks (e.g. - * scanKeyframesExports). + * `extra` runs after the standard arming for suite-specific mocks. */ export function armCannedEngine( mocks: CannedEngineMocks, diff --git a/packages/next-plugin/tests/webpack-gauntlet/real-engine.test.ts b/packages/next-plugin/tests/webpack-gauntlet/real-engine.test.ts index e89bcae5..36471959 100644 --- a/packages/next-plugin/tests/webpack-gauntlet/real-engine.test.ts +++ b/packages/next-plugin/tests/webpack-gauntlet/real-engine.test.ts @@ -66,9 +66,10 @@ import { color } from '@animus-ui/system/groups'; export { tokens } from './theme'; -export const { system: ds } = createSystem() +export const ds = createSystem() .addGroup('surface', color) - .build(); + .build() + .seal(); `; function buttonSource(withVariant: boolean): string { diff --git a/packages/oracle/__tests__/e2e-demo.test.ts b/packages/oracle/__tests__/e2e-demo.test.ts index 7477ce35..66353c81 100644 --- a/packages/oracle/__tests__/e2e-demo.test.ts +++ b/packages/oracle/__tests__/e2e-demo.test.ts @@ -502,7 +502,7 @@ describe('the invariants that hold across the whole path', () => { it('scopes every answer to the same program revision', () => { expect(host.program.kind).toBe('analysis-artifacts'); expect(host.program.label).toBe( - 'animus-commit:410fa0bb91141167e1cad2d6cd6dd150' + 'animus-commit:b06d23b64b8afc57701072492fe0ec10' ); for (const result of EVERY_RESULT) { expect(result.probeStateId).toMatch(/^[0-9a-f]{16}$/); diff --git a/packages/oracle/__tests__/fixtures/rollup-app/commit.json b/packages/oracle/__tests__/fixtures/rollup-app/commit.json index c6cf9233..0bca8182 100644 --- a/packages/oracle/__tests__/fixtures/rollup-app/commit.json +++ b/packages/oracle/__tests__/fixtures/rollup-app/commit.json @@ -2,13 +2,13 @@ "schema": 1, "payloads": { "styles.css": { - "hash": "bb8d158ecab1494b3899930897e722ad" + "hash": "939c144af6e9f8273e411bcb8b6f5d39" }, "system-props.js": { "hash": "46a029fa4ba91ea026c83821dcd7681b" }, "manifest.json": { - "hash": "410fa0bb91141167e1cad2d6cd6dd150" + "hash": "b06d23b64b8afc57701072492fe0ec10" }, "assets/test-font.f2a09939.woff2": { "hash": "f2a09939afd02913e3adbbb98ae9efe8" diff --git a/packages/oracle/__tests__/fixtures/rollup-app/manifest.json b/packages/oracle/__tests__/fixtures/rollup-app/manifest.json index d4a84ff1..cd4056fb 100644 --- a/packages/oracle/__tests__/fixtures/rollup-app/manifest.json +++ b/packages/oracle/__tests__/fixtures/rollup-app/manifest.json @@ -1 +1 @@ -{"fileFacts":{"../../packages/test-ds/src/components/Alert.tsx":{"path":"../../packages/test-ds/src/components/Alert.tsx","chains":[{"className":"animus-Alert-a385f997","descriptor":{"binding":"Alert","terminal":"asElement","tag":"div","stages":[{"method":"styles","argSpan":[67,200],"secondArgSpan":null},{"method":"variant","argSpan":[213,381],"secondArgSpan":null},{"method":"variant","argSpan":[394,541],"secondArgSpan":null},{"method":"compound","argSpan":[560,598],"secondArgSpan":[604,648]},{"method":"compound","argSpan":[670,710],"secondArgSpan":[716,758]},{"method":"compound","argSpan":[780,821],"secondArgSpan":[827,875]}],"extractable":true,"bailReason":null,"span":[54,899],"extendsFrom":null},"stages":[{"method":"styles","value":{"display":"flex","alignItems":"flex-start","p":12,"borderRadius":"4px","fontSize":14,"lineHeight":"1.5"},"secondValue":null,"skipped":[],"captured":[],"evalError":null},{"method":"variant","value":{"prop":"variant","defaultVariant":null,"base":null,"variants":{"filled":{"color":"background"},"outline":{"bg":"transparent","borderWidth":"1px","borderStyle":"solid"}}},"secondValue":null,"skipped":[],"captured":[],"evalError":null},{"method":"variant","value":{"prop":"intent","defaultVariant":null,"base":null,"variants":{"info":{"bg":"primary"},"danger":{"bg":"danger"},"success":{"bg":"secondary"}}},"secondValue":null,"skipped":[],"captured":[],"evalError":null},{"method":"compound","value":{"variant":"outline","intent":"info"},"secondValue":{"borderColor":"primary","color":"primary"},"skipped":[],"captured":[],"evalError":null},{"method":"compound","value":{"variant":"outline","intent":"danger"},"secondValue":{"borderColor":"danger","color":"danger"},"skipped":[],"captured":[],"evalError":null},{"method":"compound","value":{"variant":"outline","intent":"success"},"secondValue":{"borderColor":"secondary","color":"secondary"},"skipped":[],"captured":[],"evalError":null}],"fatalError":null}],"statics":{},"usage":[],"compose":[],"imports":[{"local":"ds","imported":"ds","source":"../system"}],"exports":[{"exported":"Alert","local":"Alert","source":null,"original":null}],"transforms":[],"parseDiagnostics":[]},"../../packages/test-ds/src/components/Badge.tsx":{"path":"../../packages/test-ds/src/components/Badge.tsx","chains":[{"className":"animus-Badge-99781d29","descriptor":{"binding":"Badge","terminal":"asElement","tag":"span","stages":[{"method":"styles","argSpan":[67,238],"secondArgSpan":null},{"method":"variant","argSpan":[251,400],"secondArgSpan":null},{"method":"states","argSpan":[412,537],"secondArgSpan":null}],"extractable":true,"bailReason":null,"span":[54,559],"extendsFrom":null},"stages":[{"method":"styles","value":{"display":"inline-flex","alignItems":"center","px":8,"py":4,"borderRadius":"9999px","fontSize":12,"fontWeight":"500","lineHeight":"1"},"secondValue":null,"skipped":[],"captured":[],"evalError":null},{"method":"variant","value":{"prop":"color","defaultVariant":null,"base":null,"variants":{"neutral":{"bg":"surface","color":"text"},"danger":{"bg":"danger","color":"background"}}},"secondValue":null,"skipped":[],"captured":[],"evalError":null},{"method":"states","value":{"disabled":{"opacity":"0.5","cursor":"not-allowed"},"active":{"outline":"2px solid","outlineColor":"primary"}},"secondValue":null,"skipped":[],"captured":[],"evalError":null}],"fatalError":null}],"statics":{},"usage":[],"compose":[],"imports":[{"local":"ds","imported":"ds","source":"../system"}],"exports":[{"exported":"Badge","local":"Badge","source":null,"original":null}],"transforms":[],"parseDiagnostics":[]},"../../packages/test-ds/src/components/Button.tsx":{"path":"../../packages/test-ds/src/components/Button.tsx","chains":[{"className":"animus-Button-c63b6dcd","descriptor":{"binding":"Button","terminal":"asElement","tag":"button","stages":[{"method":"styles","argSpan":[68,269],"secondArgSpan":null},{"method":"variant","argSpan":[282,496],"secondArgSpan":null},{"method":"system","argSpan":[508,546],"secondArgSpan":null}],"extractable":true,"bailReason":null,"span":[55,570],"extendsFrom":null},"stages":[{"method":"styles","value":{"display":"inline-flex","alignItems":"center","justifyContent":"center","borderRadius":"4px","fontWeight":"600","cursor":"pointer","border":"none","lineHeight":"1"},"secondValue":null,"skipped":[],"captured":[],"evalError":null},{"method":"variant","value":{"prop":"variant","defaultVariant":null,"base":null,"variants":{"primary":{"bg":"primary","color":"background"},"secondary":{"bg":"secondary","color":"background"},"ghost":{"bg":"transparent","color":"text"}}},"secondValue":null,"skipped":[],"captured":[],"evalError":null},{"method":"system","value":{"px":true,"py":true,"fontSize":true},"secondValue":null,"skipped":[],"captured":[],"evalError":null}],"fatalError":null}],"statics":{},"usage":[],"compose":[],"imports":[{"local":"ds","imported":"ds","source":"../system"}],"exports":[{"exported":"Button","local":"Button","source":null,"original":null}],"transforms":[],"parseDiagnostics":[]},"../../packages/test-ds/src/components/Card.tsx":{"path":"../../packages/test-ds/src/components/Card.tsx","chains":[{"className":"animus-Card-9aa7af5d","descriptor":{"binding":"Card","terminal":"asElement","tag":"div","stages":[{"method":"styles","argSpan":[573,2126],"secondArgSpan":null},{"method":"system","argSpan":[2138,2169],"secondArgSpan":null}],"extractable":true,"bailReason":null,"span":[560,2190],"extendsFrom":null},"stages":[{"method":"styles","value":{"bg":"surface","p":16,"borderRadius":"8px","color":"text","containerType":"inline-size","containerName":"card","@container card (min-width: 400px)":{"p":24,"width":"50cqw"},"@media (prefers-reduced-motion: reduce)":{"transition":"none"},"@supports (display: grid)":{"display":"grid","&:focus-visible":{"outline":"2px solid"},"@container card (min-width: 600px)":{"gap":"2cqi"},"fontSize":{"_":14,"sm":16}}},"secondValue":null,"skipped":[],"captured":[],"evalError":null},{"method":"system","value":{"m":true,"mx":true,"my":true},"secondValue":null,"skipped":[],"captured":[],"evalError":null}],"fatalError":null}],"statics":{},"usage":[],"compose":[],"imports":[{"local":"ds","imported":"ds","source":"../system"}],"exports":[{"exported":"Card","local":"Card","source":null,"original":null}],"transforms":[],"parseDiagnostics":[]},"../../packages/test-ds/src/components/ContainerCard.tsx":{"path":"../../packages/test-ds/src/components/ContainerCard.tsx","chains":[{"className":"animus-ContainerCardRoot-01c5b011","descriptor":{"binding":"ContainerCardRoot","terminal":"asElement","tag":"article","stages":[{"method":"styles","argSpan":[1089,1435],"secondArgSpan":null},{"method":"variant","argSpan":[1448,1555],"secondArgSpan":null}],"extractable":true,"bailReason":null,"span":[1076,1580],"extendsFrom":null},"stages":[{"method":"styles","value":{"display":"flex","flexDirection":"column","gap":8,"p":16,"borderRadius":"8px","bg":"surface","color":"text","containerType":"inline-size","containerName":"card"},"secondValue":null,"skipped":[],"captured":[],"evalError":null},{"method":"variant","value":{"prop":"size","defaultVariant":"md","base":null,"variants":{"md":{},"lg":{"p":24}}},"secondValue":null,"skipped":[],"captured":[],"evalError":null}],"fatalError":null},{"className":"animus-ContainerCardMedia-51db5d07","descriptor":{"binding":"ContainerCardMedia","terminal":"asElement","tag":"div","stages":[{"method":"styles","argSpan":[1623,2194],"secondArgSpan":null},{"method":"variant","argSpan":[2207,2307],"secondArgSpan":null}],"extractable":true,"bailReason":null,"span":[1610,2328],"extendsFrom":null},"stages":[{"method":"styles","value":{"display":"block","width":"100%","minHeight":"64px","borderRadius":"4px","background":"var(--current-bg)","@container card (min-width: 400px)":{"minHeight":"120px","width":"50cqw"}},"secondValue":null,"skipped":[],"captured":[],"evalError":null},{"method":"variant","value":{"prop":"size","defaultVariant":"md","base":null,"variants":{"md":{},"lg":{}}},"secondValue":null,"skipped":[],"captured":[],"evalError":null}],"fatalError":null},{"className":"animus-ContainerCardBody-133c6ad9","descriptor":{"binding":"ContainerCardBody","terminal":"asElement","tag":"div","stages":[{"method":"styles","argSpan":[2370,2636],"secondArgSpan":null}],"extractable":true,"bailReason":null,"span":[2357,2657],"extendsFrom":null},"stages":[{"method":"styles","value":{"fontSize":14,"lineHeight":"1.5","color":"text","@container card (min-width: 400px)":{"fontSize":16}},"secondValue":null,"skipped":[],"captured":[],"evalError":null}],"fatalError":null}],"statics":{},"usage":[],"compose":[{"family_binding":"ContainerCard","root_binding":"ContainerCardRoot","slots":[["Root","ContainerCardRoot"],["Media","ContainerCardMedia"],["Body","ContainerCardBody"]],"shared_keys":["size"],"context":false,"span":[2689,2849],"name":"ContainerCard"}],"imports":[{"local":"compose","imported":"compose","source":"@animus-ui/system"},{"local":"ds","imported":"ds","source":"../system"}],"exports":[{"exported":"ContainerCard","local":"ContainerCard","source":null,"original":null}],"transforms":[],"parseDiagnostics":[]},"../../packages/test-ds/src/components/GroupItem.tsx":{"path":"../../packages/test-ds/src/components/GroupItem.tsx","chains":[{"className":"animus-GroupItem-32b2d32f","descriptor":{"binding":"GroupItem","terminal":"asElement","tag":"span","stages":[{"method":"styles","argSpan":[844,1148],"secondArgSpan":null}],"extractable":true,"bailReason":null,"span":[831,1170],"extendsFrom":null},"stages":[{"method":"styles","value":{"display":"inline-flex","alignItems":"center","px":8,"py":4,"borderRadius":"4px","bg":"surface","color":"text","[data-active=\"true\"] &":{"bg":"primary","color":"background"},"_groupHover":{"opacity":"0.9"},"_dark":{"color":"text.muted"}},"secondValue":null,"skipped":[],"captured":[],"evalError":null}],"fatalError":null}],"statics":{},"usage":[],"compose":[],"imports":[{"local":"ds","imported":"ds","source":"../system"}],"exports":[{"exported":"GroupItem","local":"GroupItem","source":null,"original":null}],"transforms":[],"parseDiagnostics":[]},"../../packages/test-ds/src/definition.ts":{"path":"../../packages/test-ds/src/definition.ts","chains":[],"statics":{},"usage":[],"compose":[],"imports":[],"exports":[{"exported":"system","local":null,"source":"./system","original":"ds"},{"exported":"theme","local":null,"source":"./theme","original":"referenceTokens"}],"transforms":[],"parseDiagnostics":[]},"../../packages/test-ds/src/dev-types.ts":{"path":"../../packages/test-ds/src/dev-types.ts","chains":[],"statics":{},"usage":[],"compose":[],"imports":[{"local":"referenceTokens","imported":"referenceTokens","source":"./theme"}],"exports":[],"transforms":[],"parseDiagnostics":[]},"../../packages/test-ds/src/index.ts":{"path":"../../packages/test-ds/src/index.ts","chains":[],"statics":{"kitMotion":{"pulse":"animus-kf-muo7kp"},"kitSizes":{"sm":{"fontSize":14,"px":8,"py":4},"md":{"fontSize":16,"px":16,"py":8},"lg":{"fontSize":20,"px":24,"py":12}}},"usage":[],"compose":[],"imports":[{"local":"createKeyframes","imported":"createKeyframes","source":"./system"}],"exports":[{"exported":"Alert","local":null,"source":"./components/Alert","original":"Alert"},{"exported":"Badge","local":null,"source":"./components/Badge","original":"Badge"},{"exported":"Button","local":null,"source":"./components/Button","original":"Button"},{"exported":"Card","local":null,"source":"./components/Card","original":"Card"},{"exported":"ContainerCard","local":null,"source":"./components/ContainerCard","original":"ContainerCard"},{"exported":"GroupItem","local":null,"source":"./components/GroupItem","original":"GroupItem"},{"exported":"ds","local":null,"source":"./system","original":"ds"},{"exported":"referenceTokens","local":null,"source":"./theme","original":"referenceTokens"},{"exported":"kitSizes","local":"kitSizes","source":null,"original":null},{"exported":"kitMotion","local":"kitMotion","source":null,"original":null}],"transforms":[],"parseDiagnostics":[]},"../../packages/test-ds/src/system.ts":{"path":"../../packages/test-ds/src/system.ts","chains":[],"statics":{},"usage":[],"compose":[],"imports":[{"local":"createSystem","imported":"createSystem","source":"@animus-ui/system"},{"local":"border","imported":"border","source":"@animus-ui/system/groups"},{"local":"color","imported":"color","source":"@animus-ui/system/groups"},{"local":"flex","imported":"flex","source":"@animus-ui/system/groups"},{"local":"layout","imported":"layout","source":"@animus-ui/system/groups"},{"local":"positioning","imported":"positioning","source":"@animus-ui/system/groups"},{"local":"space","imported":"space","source":"@animus-ui/system/groups"},{"local":"typography","imported":"typography","source":"@animus-ui/system/groups"}],"exports":[],"transforms":[],"parseDiagnostics":[]},"../../packages/test-ds/src/theme.ts":{"path":"../../packages/test-ds/src/theme.ts","chains":[],"statics":{},"usage":[],"compose":[],"imports":[{"local":"createTheme","imported":"createTheme","source":"@animus-ui/system"}],"exports":[{"exported":"referenceTokens","local":"referenceTokens","source":null,"original":null}],"transforms":[],"parseDiagnostics":[]},"src/Box.tsx":{"path":"src/Box.tsx","chains":[{"className":"animus-Box-399302cf","descriptor":{"binding":"Box","terminal":"asElement","tag":"div","stages":[{"method":"styles","argSpan":[60,112],"secondArgSpan":null},{"method":"system","argSpan":[124,172],"secondArgSpan":null}],"extractable":true,"bailReason":null,"span":[47,193],"extendsFrom":null},"stages":[{"method":"styles","value":{"display":"flex","position":"relative"},"secondValue":null,"skipped":[],"captured":[],"evalError":null},{"method":"system","value":{"space":true,"layout":true,"positioning":true},"secondValue":null,"skipped":[],"captured":[],"evalError":null}],"fatalError":null}],"statics":{},"usage":[],"compose":[],"imports":[{"local":"ds","imported":"ds","source":"./ds"}],"exports":[{"exported":"Box","local":"Box","source":null,"original":null}],"transforms":[],"parseDiagnostics":[]},"src/Button.tsx":{"path":"src/Button.tsx","chains":[{"className":"animus-Button-b3718a43","descriptor":{"binding":"Button","terminal":"asElement","tag":"button","stages":[{"method":"styles","argSpan":[63,146],"secondArgSpan":null},{"method":"variant","argSpan":[159,313],"secondArgSpan":null}],"extractable":true,"bailReason":null,"span":[50,337],"extendsFrom":null},"stages":[{"method":"styles","value":{"padding":"8px","borderRadius":"4px","backgroundColor":"blue.500"},"secondValue":null,"skipped":[],"captured":[],"evalError":null},{"method":"variant","value":{"prop":"tone","defaultVariant":null,"base":null,"variants":{"quiet":{"backgroundColor":"gray.700"},"loud":{"backgroundColor":"blue.700","fontWeight":700}}},"secondValue":null,"skipped":[],"captured":[],"evalError":null}],"fatalError":null}],"statics":{},"usage":[{"element":{"tag":{"ident":"Button"},"attrs":[{"name":"tone","staticValue":"loud","dynamic":false,"dynamicKind":null,"dynamicSpan":null,"skip":false,"variantClass":"loud"}]}}],"compose":[],"imports":[{"local":"ds","imported":"ds","source":"./ds"}],"exports":[{"exported":"Button","local":"Button","source":null,"original":null},{"exported":"App","local":"App","source":null,"original":null}],"transforms":[],"parseDiagnostics":[]},"src/Frame.tsx":{"path":"src/Frame.tsx","chains":[],"statics":{},"usage":[{"element":{"tag":{"ident":"section"},"attrs":[{"name":"className","staticValue":"frame","dynamic":false,"dynamicKind":null,"dynamicSpan":null,"skip":false,"variantClass":"frame"}]}}],"compose":[],"imports":[{"local":"ReactNode","imported":"ReactNode","source":"react"}],"exports":[{"exported":"Frame","local":"Frame","source":null,"original":null}],"transforms":[],"parseDiagnostics":[]},"src/Group.tsx":{"path":"src/Group.tsx","chains":[],"statics":{},"usage":[{"element":{"tag":{"ident":"div"},"attrs":[]}},{"element":{"tag":{"ident":"div"},"attrs":[{"name":"className","staticValue":"group","dynamic":false,"dynamicKind":null,"dynamicSpan":null,"skip":false,"variantClass":"group"},{"name":"data-active","staticValue":"true","dynamic":false,"dynamicKind":null,"dynamicSpan":null,"skip":false,"variantClass":"true"}]}},{"element":{"tag":{"ident":"GroupItem"},"attrs":[]}},{"element":{"tag":{"ident":"div"},"attrs":[{"name":"data-active","staticValue":"false","dynamic":false,"dynamicKind":null,"dynamicSpan":null,"skip":false,"variantClass":"false"}]}},{"element":{"tag":{"ident":"GroupItem"},"attrs":[]}},{"element":{"tag":{"ident":"Frame"},"attrs":[]}},{"element":{"tag":{"ident":"GroupItem"},"attrs":[]}},{"element":{"tag":{"ident":"div"},"attrs":[{"name":"data-active","staticValue":null,"dynamic":true,"dynamicKind":"conditional","dynamicSpan":{"start":1616,"end":1641},"skip":false,"variantClass":"__dynamic__"}]}},{"element":{"tag":{"ident":"GroupItem"},"attrs":[]}}],"compose":[],"imports":[{"local":"GroupItem","imported":"GroupItem","source":"@animus-ui/test-ds"},{"local":"Frame","imported":"Frame","source":"./Frame"}],"exports":[{"exported":"GroupDemo","local":"GroupDemo","source":null,"original":null}],"transforms":[],"parseDiagnostics":[]},"src/ds.ts":{"path":"src/ds.ts","chains":[],"statics":{"animations":{"fadeIn":"animus-kf-1x7guim","pulse":"animus-kf-1yqv0zl"}},"usage":[],"compose":[],"imports":[{"local":"asset","imported":"asset","source":"@animus-ui/system"},{"local":"createSystem","imported":"createSystem","source":"@animus-ui/system"},{"local":"createTheme","imported":"createTheme","source":"@animus-ui/system"},{"local":"testDs","imported":"system","source":"@animus-ui/test-ds/definition"}],"exports":[{"exported":"theme","local":"theme","source":null,"original":null},{"exported":"globalStyles","local":"globalStyles","source":null,"original":null},{"exported":"animations","local":"animations","source":null,"original":null}],"transforms":[],"parseDiagnostics":[]},"src/entry.tsx":{"path":"src/entry.tsx","chains":[],"statics":{},"usage":[{"element":{"tag":{"ident":"div"},"attrs":[]}},{"element":{"tag":{"ident":"ButtonApp"},"attrs":[]}},{"element":{"tag":{"ident":"Badge"},"attrs":[{"name":"color","staticValue":"danger","dynamic":false,"dynamicKind":null,"dynamicSpan":null,"skip":false,"variantClass":"danger"}]}}],"compose":[],"imports":[{"local":"Badge","imported":"Badge","source":"@animus-ui/test-ds"},{"local":"ButtonApp","imported":"App","source":"./Button"},{"local":"Button","imported":"Button","source":"./Button"}],"exports":[{"exported":"Badge","local":"Badge","source":null,"original":null},{"exported":"Button","local":"Button","source":null,"original":null},{"exported":"App","local":"App","source":null,"original":null}],"transforms":[],"parseDiagnostics":[]}},"crossFile":{"componentNames":["Alert","Badge","Box","Button","Card","ContainerCardBody","ContainerCardMedia","ContainerCardRoot","GroupItem"],"classResolvers":[],"memberBindings":{"ContainerCard.Body":"ContainerCardBody","ContainerCard.Media":"ContainerCardMedia","ContainerCard.Root":"ContainerCardRoot"},"renderedComponents":["Badge","Button","ContainerCardBody","ContainerCardMedia","ContainerCardRoot","GroupItem"],"variantOptions":{"Alert":{"intent":["danger","info","success"],"variant":["filled","outline"]},"Badge":{"color":["danger","neutral"]},"Button":{"tone":["loud","quiet"],"variant":["ghost","primary","secondary"]},"ContainerCardMedia":{"size":["lg","md"]},"ContainerCardRoot":{"size":["lg","md"]}},"stateNames":{"Badge":["active","disabled"]}},"parseCount":17,"usageResidue":[],"css":"@layer anm-global, anm-base, anm-variants, anm-compounds, anm-states, anm-system, anm-custom;\n\n@layer anm-base {\n .animus-Alert-a385f997 {\n padding: 0.75rem;\n display: flex;\n align-items: flex-start;\n border-radius: 4px;\n font-size: 0.875rem;\n line-height: 1.5;\n }\n .animus-Badge-99781d29 {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n display: inline-flex;\n align-items: center;\n border-radius: 9999px;\n font-size: 0.75rem;\n font-weight: 500;\n line-height: 1;\n }\n .animus-Card-9aa7af5d {\n padding: 1rem;\n background-color: var(--color-surface);\n --current-bg: var(--color-surface);\n border-radius: 8px;\n color: var(--color-text);\n container-type: inline-size;\n container-name: card;\n }\n @container card (min-width: 400px) {\n .animus-Card-9aa7af5d {\n padding: 1.5rem;\n width: 50cqw;\n }\n }\n @media (prefers-reduced-motion: reduce) {\n .animus-Card-9aa7af5d {\n transition: none;\n }\n }\n @supports (display: grid) {\n .animus-Card-9aa7af5d {\n display: grid;\n font-size: 0.875rem;\n }\n }\n @supports (display: grid) {\n @media (min-width: 640px) {\n .animus-Card-9aa7af5d {\n font-size: 1rem;\n }\n }\n }\n @supports (display: grid) {\n .animus-Card-9aa7af5d:focus-visible {\n outline: 2px solid;\n }\n }\n @supports (display: grid) {\n @container card (min-width: 600px) {\n .animus-Card-9aa7af5d {\n gap: 2cqi;\n }\n }\n }\n .animus-ContainerCardBody-133c6ad9 {\n font-size: 0.875rem;\n line-height: 1.5;\n color: var(--color-text);\n }\n @container card (min-width: 400px) {\n .animus-ContainerCardBody-133c6ad9 {\n font-size: 1rem;\n }\n }\n .animus-ContainerCardMedia-51db5d07 {\n display: block;\n width: 100%;\n min-height: 64px;\n border-radius: 4px;\n background: var(--current-bg);\n }\n @container card (min-width: 400px) {\n .animus-ContainerCardMedia-51db5d07 {\n min-height: 120px;\n width: 50cqw;\n }\n }\n .animus-ContainerCardRoot-01c5b011 {\n gap: 0.5rem;\n padding: 1rem;\n display: flex;\n flex-direction: column;\n border-radius: 8px;\n background-color: var(--color-surface);\n --current-bg: var(--color-surface);\n color: var(--color-text);\n container-type: inline-size;\n container-name: card;\n }\n .animus-GroupItem-32b2d32f {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n display: inline-flex;\n align-items: center;\n border-radius: 4px;\n background-color: var(--color-surface);\n --current-bg: var(--color-surface);\n color: var(--color-text);\n }\n [data-active=\"true\"] .animus-GroupItem-32b2d32f {\n background-color: var(--color-primary);\n --current-bg: var(--color-primary);\n color: var(--color-background);\n }\n .group:hover .animus-GroupItem-32b2d32f {\n opacity: 0.9;\n }\n [data-color-mode=\"dark\"] .animus-GroupItem-32b2d32f {\n color: var(--color-text-muted);\n }\n .animus-Box-399302cf {\n display: flex;\n position: relative;\n }\n .animus-Button-c63b6dcd {\n border: none;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border-radius: 4px;\n font-weight: 600;\n line-height: 1;\n cursor: pointer;\n }\n .animus-Button-b3718a43 {\n border-radius: 4px;\n padding: 8px;\n background-color: var(--color-blue-500);\n }\n}\n\n@layer anm-variants {\n @layer standalone, composed;\n @layer standalone {\n\n .animus-Alert-a385f997--variant-filled {\n color: var(--color-background);\n }\n .animus-Alert-a385f997--variant-outline {\n border-width: 1px;\n border-style: solid;\n background-color: transparent;\n --current-bg: transparent;\n }\n .animus-Alert-a385f997--intent-info {\n background-color: var(--color-primary);\n --current-bg: var(--color-primary);\n }\n .animus-Alert-a385f997--intent-danger {\n background-color: var(--color-danger);\n --current-bg: var(--color-danger);\n }\n .animus-Alert-a385f997--intent-success {\n background-color: var(--color-secondary);\n --current-bg: var(--color-secondary);\n }\n .animus-Badge-99781d29--color-neutral {\n background-color: var(--color-surface);\n --current-bg: var(--color-surface);\n color: var(--color-text);\n }\n .animus-Badge-99781d29--color-danger {\n background-color: var(--color-danger);\n --current-bg: var(--color-danger);\n color: var(--color-background);\n }\n .animus-ContainerCardRoot-01c5b011--size-lg {\n padding: 1.5rem;\n }\n .animus-Button-c63b6dcd--variant-primary {\n background-color: var(--color-primary);\n --current-bg: var(--color-primary);\n color: var(--color-background);\n }\n .animus-Button-c63b6dcd--variant-secondary {\n background-color: var(--color-secondary);\n --current-bg: var(--color-secondary);\n color: var(--color-background);\n }\n .animus-Button-c63b6dcd--variant-ghost {\n background-color: transparent;\n --current-bg: transparent;\n color: var(--color-text);\n }\n .animus-Button-b3718a43--tone-quiet {\n background-color: var(--color-gray-700);\n }\n .animus-Button-b3718a43--tone-loud {\n font-weight: 700;\n background-color: var(--color-blue-700);\n }\n }\n @layer composed {\n }\n}\n\n@layer anm-compounds {\n .animus-Alert-a385f997--compound-0 {\n border-color: var(--color-primary);\n color: var(--color-primary);\n }\n .animus-Alert-a385f997--compound-1 {\n border-color: var(--color-danger);\n color: var(--color-danger);\n }\n .animus-Alert-a385f997--compound-2 {\n border-color: var(--color-secondary);\n color: var(--color-secondary);\n }\n}\n\n@layer anm-states {\n .animus-Badge-99781d29--disabled {\n opacity: 0.5;\n cursor: not-allowed;\n }\n .animus-Badge-99781d29--active {\n outline: 2px solid;\n outline-color: var(--color-primary);\n }\n}\n\n@layer anm-system {\n .animus-dyn-flex {\n flex: var(--animus-flex);\n }\n @media (min-width: 640px) {\n .animus-dyn-flex-sm {\n flex: var(--animus-flex-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-flex-md {\n flex: var(--animus-flex-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-flex-lg {\n flex: var(--animus-flex-lg);\n }\n }\n .animus-dyn-m {\n margin: var(--animus-m);\n }\n @media (min-width: 640px) {\n .animus-dyn-m-sm {\n margin: var(--animus-m-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-m-md {\n margin: var(--animus-m-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-m-lg {\n margin: var(--animus-m-lg);\n }\n }\n .animus-dyn-p {\n padding: var(--animus-p);\n }\n @media (min-width: 640px) {\n .animus-dyn-p-sm {\n padding: var(--animus-p-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-p-md {\n padding: var(--animus-p-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-p-lg {\n padding: var(--animus-p-lg);\n }\n }\n .animus-dyn-gap {\n gap: var(--animus-gap);\n }\n @media (min-width: 640px) {\n .animus-dyn-gap-sm {\n gap: var(--animus-gap-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-gap-md {\n gap: var(--animus-gap-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-gap-lg {\n gap: var(--animus-gap-lg);\n }\n }\n .animus-dyn-area {\n grid-area: var(--animus-area);\n }\n .animus-dyn-grid-area {\n grid-area: var(--animus-grid-area);\n }\n @media (min-width: 640px) {\n .animus-dyn-area-sm {\n grid-area: var(--animus-area-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-grid-area-sm {\n grid-area: var(--animus-grid-area-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-area-md {\n grid-area: var(--animus-area-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-grid-area-md {\n grid-area: var(--animus-grid-area-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-area-lg {\n grid-area: var(--animus-area-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-grid-area-lg {\n grid-area: var(--animus-grid-area-lg);\n }\n }\n .animus-dyn-grid-column {\n grid-column: var(--animus-grid-column);\n }\n @media (min-width: 640px) {\n .animus-dyn-grid-column-sm {\n grid-column: var(--animus-grid-column-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-grid-column-md {\n grid-column: var(--animus-grid-column-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-grid-column-lg {\n grid-column: var(--animus-grid-column-lg);\n }\n }\n .animus-dyn-grid-row {\n grid-row: var(--animus-grid-row);\n }\n @media (min-width: 640px) {\n .animus-dyn-grid-row-sm {\n grid-row: var(--animus-grid-row-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-grid-row-md {\n grid-row: var(--animus-grid-row-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-grid-row-lg {\n grid-row: var(--animus-grid-row-lg);\n }\n }\n .animus-dyn-overflow {\n overflow: var(--animus-overflow);\n }\n @media (min-width: 640px) {\n .animus-dyn-overflow-sm {\n overflow: var(--animus-overflow-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-overflow-md {\n overflow: var(--animus-overflow-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-overflow-lg {\n overflow: var(--animus-overflow-lg);\n }\n }\n .animus-dyn-align-content {\n align-content: var(--animus-align-content);\n }\n @media (min-width: 640px) {\n .animus-dyn-align-content-sm {\n align-content: var(--animus-align-content-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-align-content-md {\n align-content: var(--animus-align-content-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-align-content-lg {\n align-content: var(--animus-align-content-lg);\n }\n }\n .animus-dyn-align-items {\n align-items: var(--animus-align-items);\n }\n @media (min-width: 640px) {\n .animus-dyn-align-items-sm {\n align-items: var(--animus-align-items-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-align-items-md {\n align-items: var(--animus-align-items-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-align-items-lg {\n align-items: var(--animus-align-items-lg);\n }\n }\n .animus-dyn-align-self {\n align-self: var(--animus-align-self);\n }\n @media (min-width: 640px) {\n .animus-dyn-align-self-sm {\n align-self: var(--animus-align-self-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-align-self-md {\n align-self: var(--animus-align-self-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-align-self-lg {\n align-self: var(--animus-align-self-lg);\n }\n }\n .animus-dyn-bottom {\n bottom: var(--animus-bottom);\n }\n @media (min-width: 640px) {\n .animus-dyn-bottom-sm {\n bottom: var(--animus-bottom-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-bottom-md {\n bottom: var(--animus-bottom-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-bottom-lg {\n bottom: var(--animus-bottom-lg);\n }\n }\n .animus-dyn-column-gap {\n column-gap: var(--animus-column-gap);\n }\n @media (min-width: 640px) {\n .animus-dyn-column-gap-sm {\n column-gap: var(--animus-column-gap-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-column-gap-md {\n column-gap: var(--animus-column-gap-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-column-gap-lg {\n column-gap: var(--animus-column-gap-lg);\n }\n }\n .animus-dyn-display {\n display: var(--animus-display);\n }\n @media (min-width: 640px) {\n .animus-dyn-display-sm {\n display: var(--animus-display-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-display-md {\n display: var(--animus-display-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-display-lg {\n display: var(--animus-display-lg);\n }\n }\n .animus-dyn-flex-basis {\n flex-basis: var(--animus-flex-basis);\n }\n @media (min-width: 640px) {\n .animus-dyn-flex-basis-sm {\n flex-basis: var(--animus-flex-basis-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-flex-basis-md {\n flex-basis: var(--animus-flex-basis-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-flex-basis-lg {\n flex-basis: var(--animus-flex-basis-lg);\n }\n }\n .animus-dyn-flex-dir {\n flex-direction: var(--animus-flex-dir);\n }\n .animus-dyn-flex-direction {\n flex-direction: var(--animus-flex-direction);\n }\n @media (min-width: 640px) {\n .animus-dyn-flex-dir-sm {\n flex-direction: var(--animus-flex-dir-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-flex-direction-sm {\n flex-direction: var(--animus-flex-direction-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-flex-dir-md {\n flex-direction: var(--animus-flex-dir-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-flex-direction-md {\n flex-direction: var(--animus-flex-direction-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-flex-dir-lg {\n flex-direction: var(--animus-flex-dir-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-flex-direction-lg {\n flex-direction: var(--animus-flex-direction-lg);\n }\n }\n .animus-dyn-flex-grow {\n flex-grow: var(--animus-flex-grow);\n }\n @media (min-width: 640px) {\n .animus-dyn-flex-grow-sm {\n flex-grow: var(--animus-flex-grow-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-flex-grow-md {\n flex-grow: var(--animus-flex-grow-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-flex-grow-lg {\n flex-grow: var(--animus-flex-grow-lg);\n }\n }\n .animus-dyn-flex-shrink {\n flex-shrink: var(--animus-flex-shrink);\n }\n @media (min-width: 640px) {\n .animus-dyn-flex-shrink-sm {\n flex-shrink: var(--animus-flex-shrink-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-flex-shrink-md {\n flex-shrink: var(--animus-flex-shrink-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-flex-shrink-lg {\n flex-shrink: var(--animus-flex-shrink-lg);\n }\n }\n .animus-dyn-flex-wrap {\n flex-wrap: var(--animus-flex-wrap);\n }\n @media (min-width: 640px) {\n .animus-dyn-flex-wrap-sm {\n flex-wrap: var(--animus-flex-wrap-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-flex-wrap-md {\n flex-wrap: var(--animus-flex-wrap-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-flex-wrap-lg {\n flex-wrap: var(--animus-flex-wrap-lg);\n }\n }\n .animus-dyn-font-size {\n font-size: var(--animus-font-size);\n }\n @media (min-width: 640px) {\n .animus-dyn-font-size-sm {\n font-size: var(--animus-font-size-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-font-size-md {\n font-size: var(--animus-font-size-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-font-size-lg {\n font-size: var(--animus-font-size-lg);\n }\n }\n .animus-dyn-grid-column-end {\n grid-column-end: var(--animus-grid-column-end);\n }\n @media (min-width: 640px) {\n .animus-dyn-grid-column-end-sm {\n grid-column-end: var(--animus-grid-column-end-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-grid-column-end-md {\n grid-column-end: var(--animus-grid-column-end-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-grid-column-end-lg {\n grid-column-end: var(--animus-grid-column-end-lg);\n }\n }\n .animus-dyn-grid-column-start {\n grid-column-start: var(--animus-grid-column-start);\n }\n @media (min-width: 640px) {\n .animus-dyn-grid-column-start-sm {\n grid-column-start: var(--animus-grid-column-start-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-grid-column-start-md {\n grid-column-start: var(--animus-grid-column-start-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-grid-column-start-lg {\n grid-column-start: var(--animus-grid-column-start-lg);\n }\n }\n .animus-dyn-grid-row-end {\n grid-row-end: var(--animus-grid-row-end);\n }\n @media (min-width: 640px) {\n .animus-dyn-grid-row-end-sm {\n grid-row-end: var(--animus-grid-row-end-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-grid-row-end-md {\n grid-row-end: var(--animus-grid-row-end-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-grid-row-end-lg {\n grid-row-end: var(--animus-grid-row-end-lg);\n }\n }\n .animus-dyn-grid-row-start {\n grid-row-start: var(--animus-grid-row-start);\n }\n @media (min-width: 640px) {\n .animus-dyn-grid-row-start-sm {\n grid-row-start: var(--animus-grid-row-start-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-grid-row-start-md {\n grid-row-start: var(--animus-grid-row-start-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-grid-row-start-lg {\n grid-row-start: var(--animus-grid-row-start-lg);\n }\n }\n .animus-dyn-h {\n height: var(--animus-h);\n }\n .animus-dyn-height {\n height: var(--animus-height);\n }\n @media (min-width: 640px) {\n .animus-dyn-h-sm {\n height: var(--animus-h-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-height-sm {\n height: var(--animus-height-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-h-md {\n height: var(--animus-h-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-height-md {\n height: var(--animus-height-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-h-lg {\n height: var(--animus-h-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-height-lg {\n height: var(--animus-height-lg);\n }\n }\n .animus-dyn-justify-content {\n justify-content: var(--animus-justify-content);\n }\n @media (min-width: 640px) {\n .animus-dyn-justify-content-sm {\n justify-content: var(--animus-justify-content-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-justify-content-md {\n justify-content: var(--animus-justify-content-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-justify-content-lg {\n justify-content: var(--animus-justify-content-lg);\n }\n }\n .animus-dyn-justify-items {\n justify-items: var(--animus-justify-items);\n }\n @media (min-width: 640px) {\n .animus-dyn-justify-items-sm {\n justify-items: var(--animus-justify-items-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-justify-items-md {\n justify-items: var(--animus-justify-items-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-justify-items-lg {\n justify-items: var(--animus-justify-items-lg);\n }\n }\n .animus-dyn-justify-self {\n justify-self: var(--animus-justify-self);\n }\n @media (min-width: 640px) {\n .animus-dyn-justify-self-sm {\n justify-self: var(--animus-justify-self-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-justify-self-md {\n justify-self: var(--animus-justify-self-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-justify-self-lg {\n justify-self: var(--animus-justify-self-lg);\n }\n }\n .animus-dyn-left {\n left: var(--animus-left);\n }\n @media (min-width: 640px) {\n .animus-dyn-left-sm {\n left: var(--animus-left-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-left-md {\n left: var(--animus-left-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-left-lg {\n left: var(--animus-left-lg);\n }\n }\n .animus-dyn-mb {\n margin-bottom: var(--animus-mb);\n }\n @media (min-width: 640px) {\n .animus-dyn-mb-sm {\n margin-bottom: var(--animus-mb-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-mb-md {\n margin-bottom: var(--animus-mb-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-mb-lg {\n margin-bottom: var(--animus-mb-lg);\n }\n }\n .animus-dyn-ml {\n margin-left: var(--animus-ml);\n }\n .animus-dyn-mx {\n margin-left: var(--animus-mx);\n margin-right: var(--animus-mx);\n }\n @media (min-width: 640px) {\n .animus-dyn-ml-sm {\n margin-left: var(--animus-ml-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-mx-sm {\n margin-left: var(--animus-mx-sm);\n margin-right: var(--animus-mx-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-ml-md {\n margin-left: var(--animus-ml-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-mx-md {\n margin-left: var(--animus-mx-md);\n margin-right: var(--animus-mx-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-ml-lg {\n margin-left: var(--animus-ml-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-mx-lg {\n margin-left: var(--animus-mx-lg);\n margin-right: var(--animus-mx-lg);\n }\n }\n .animus-dyn-mr {\n margin-right: var(--animus-mr);\n }\n @media (min-width: 640px) {\n .animus-dyn-mr-sm {\n margin-right: var(--animus-mr-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-mr-md {\n margin-right: var(--animus-mr-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-mr-lg {\n margin-right: var(--animus-mr-lg);\n }\n }\n .animus-dyn-mt {\n margin-top: var(--animus-mt);\n }\n .animus-dyn-my {\n margin-top: var(--animus-my);\n margin-bottom: var(--animus-my);\n }\n @media (min-width: 640px) {\n .animus-dyn-mt-sm {\n margin-top: var(--animus-mt-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-my-sm {\n margin-top: var(--animus-my-sm);\n margin-bottom: var(--animus-my-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-mt-md {\n margin-top: var(--animus-mt-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-my-md {\n margin-top: var(--animus-my-md);\n margin-bottom: var(--animus-my-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-mt-lg {\n margin-top: var(--animus-mt-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-my-lg {\n margin-top: var(--animus-my-lg);\n margin-bottom: var(--animus-my-lg);\n }\n }\n .animus-dyn-max-h {\n max-height: var(--animus-max-h);\n }\n .animus-dyn-max-height {\n max-height: var(--animus-max-height);\n }\n @media (min-width: 640px) {\n .animus-dyn-max-h-sm {\n max-height: var(--animus-max-h-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-max-height-sm {\n max-height: var(--animus-max-height-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-max-h-md {\n max-height: var(--animus-max-h-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-max-height-md {\n max-height: var(--animus-max-height-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-max-h-lg {\n max-height: var(--animus-max-h-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-max-height-lg {\n max-height: var(--animus-max-height-lg);\n }\n }\n .animus-dyn-max-w {\n max-width: var(--animus-max-w);\n }\n .animus-dyn-max-width {\n max-width: var(--animus-max-width);\n }\n @media (min-width: 640px) {\n .animus-dyn-max-w-sm {\n max-width: var(--animus-max-w-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-max-width-sm {\n max-width: var(--animus-max-width-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-max-w-md {\n max-width: var(--animus-max-w-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-max-width-md {\n max-width: var(--animus-max-width-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-max-w-lg {\n max-width: var(--animus-max-w-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-max-width-lg {\n max-width: var(--animus-max-width-lg);\n }\n }\n .animus-dyn-min-h {\n min-height: var(--animus-min-h);\n }\n .animus-dyn-min-height {\n min-height: var(--animus-min-height);\n }\n @media (min-width: 640px) {\n .animus-dyn-min-h-sm {\n min-height: var(--animus-min-h-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-min-height-sm {\n min-height: var(--animus-min-height-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-min-h-md {\n min-height: var(--animus-min-h-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-min-height-md {\n min-height: var(--animus-min-height-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-min-h-lg {\n min-height: var(--animus-min-h-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-min-height-lg {\n min-height: var(--animus-min-height-lg);\n }\n }\n .animus-dyn-min-w {\n min-width: var(--animus-min-w);\n }\n .animus-dyn-min-width {\n min-width: var(--animus-min-width);\n }\n @media (min-width: 640px) {\n .animus-dyn-min-w-sm {\n min-width: var(--animus-min-w-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-min-width-sm {\n min-width: var(--animus-min-width-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-min-w-md {\n min-width: var(--animus-min-w-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-min-width-md {\n min-width: var(--animus-min-width-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-min-w-lg {\n min-width: var(--animus-min-w-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-min-width-lg {\n min-width: var(--animus-min-width-lg);\n }\n }\n .animus-dyn-opacity {\n opacity: var(--animus-opacity);\n }\n @media (min-width: 640px) {\n .animus-dyn-opacity-sm {\n opacity: var(--animus-opacity-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-opacity-md {\n opacity: var(--animus-opacity-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-opacity-lg {\n opacity: var(--animus-opacity-lg);\n }\n }\n .animus-dyn-order {\n order: var(--animus-order);\n }\n @media (min-width: 640px) {\n .animus-dyn-order-sm {\n order: var(--animus-order-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-order-md {\n order: var(--animus-order-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-order-lg {\n order: var(--animus-order-lg);\n }\n }\n .animus-dyn-overflow-x {\n overflow-x: var(--animus-overflow-x);\n }\n @media (min-width: 640px) {\n .animus-dyn-overflow-x-sm {\n overflow-x: var(--animus-overflow-x-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-overflow-x-md {\n overflow-x: var(--animus-overflow-x-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-overflow-x-lg {\n overflow-x: var(--animus-overflow-x-lg);\n }\n }\n .animus-dyn-overflow-y {\n overflow-y: var(--animus-overflow-y);\n }\n @media (min-width: 640px) {\n .animus-dyn-overflow-y-sm {\n overflow-y: var(--animus-overflow-y-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-overflow-y-md {\n overflow-y: var(--animus-overflow-y-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-overflow-y-lg {\n overflow-y: var(--animus-overflow-y-lg);\n }\n }\n .animus-dyn-pb {\n padding-bottom: var(--animus-pb);\n }\n @media (min-width: 640px) {\n .animus-dyn-pb-sm {\n padding-bottom: var(--animus-pb-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-pb-md {\n padding-bottom: var(--animus-pb-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-pb-lg {\n padding-bottom: var(--animus-pb-lg);\n }\n }\n .animus-dyn-pl {\n padding-left: var(--animus-pl);\n }\n .animus-dyn-px {\n padding-left: var(--animus-px);\n padding-right: var(--animus-px);\n }\n @media (min-width: 640px) {\n .animus-dyn-pl-sm {\n padding-left: var(--animus-pl-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-px-sm {\n padding-left: var(--animus-px-sm);\n padding-right: var(--animus-px-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-pl-md {\n padding-left: var(--animus-pl-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-px-md {\n padding-left: var(--animus-px-md);\n padding-right: var(--animus-px-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-pl-lg {\n padding-left: var(--animus-pl-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-px-lg {\n padding-left: var(--animus-px-lg);\n padding-right: var(--animus-px-lg);\n }\n }\n .animus-dyn-pr {\n padding-right: var(--animus-pr);\n }\n @media (min-width: 640px) {\n .animus-dyn-pr-sm {\n padding-right: var(--animus-pr-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-pr-md {\n padding-right: var(--animus-pr-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-pr-lg {\n padding-right: var(--animus-pr-lg);\n }\n }\n .animus-dyn-pt {\n padding-top: var(--animus-pt);\n }\n .animus-dyn-py {\n padding-top: var(--animus-py);\n padding-bottom: var(--animus-py);\n }\n @media (min-width: 640px) {\n .animus-dyn-pt-sm {\n padding-top: var(--animus-pt-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-py-sm {\n padding-top: var(--animus-py-sm);\n padding-bottom: var(--animus-py-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-pt-md {\n padding-top: var(--animus-pt-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-py-md {\n padding-top: var(--animus-py-md);\n padding-bottom: var(--animus-py-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-pt-lg {\n padding-top: var(--animus-pt-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-py-lg {\n padding-top: var(--animus-py-lg);\n padding-bottom: var(--animus-py-lg);\n }\n }\n .animus-dyn-pos {\n position: var(--animus-pos);\n }\n .animus-dyn-position {\n position: var(--animus-position);\n }\n @media (min-width: 640px) {\n .animus-dyn-pos-sm {\n position: var(--animus-pos-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-position-sm {\n position: var(--animus-position-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-pos-md {\n position: var(--animus-pos-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-position-md {\n position: var(--animus-position-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-pos-lg {\n position: var(--animus-pos-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-position-lg {\n position: var(--animus-position-lg);\n }\n }\n .animus-dyn-right {\n right: var(--animus-right);\n }\n @media (min-width: 640px) {\n .animus-dyn-right-sm {\n right: var(--animus-right-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-right-md {\n right: var(--animus-right-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-right-lg {\n right: var(--animus-right-lg);\n }\n }\n .animus-dyn-row-gap {\n row-gap: var(--animus-row-gap);\n }\n @media (min-width: 640px) {\n .animus-dyn-row-gap-sm {\n row-gap: var(--animus-row-gap-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-row-gap-md {\n row-gap: var(--animus-row-gap-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-row-gap-lg {\n row-gap: var(--animus-row-gap-lg);\n }\n }\n .animus-dyn-inset {\n top: var(--animus-inset);\n right: var(--animus-inset);\n bottom: var(--animus-inset);\n left: var(--animus-inset);\n }\n .animus-dyn-top {\n top: var(--animus-top);\n }\n @media (min-width: 640px) {\n .animus-dyn-inset-sm {\n top: var(--animus-inset-sm);\n right: var(--animus-inset-sm);\n bottom: var(--animus-inset-sm);\n left: var(--animus-inset-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-top-sm {\n top: var(--animus-top-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-inset-md {\n top: var(--animus-inset-md);\n right: var(--animus-inset-md);\n bottom: var(--animus-inset-md);\n left: var(--animus-inset-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-top-md {\n top: var(--animus-top-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-inset-lg {\n top: var(--animus-inset-lg);\n right: var(--animus-inset-lg);\n bottom: var(--animus-inset-lg);\n left: var(--animus-inset-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-top-lg {\n top: var(--animus-top-lg);\n }\n }\n .animus-dyn-vertical-align {\n vertical-align: var(--animus-vertical-align);\n }\n @media (min-width: 640px) {\n .animus-dyn-vertical-align-sm {\n vertical-align: var(--animus-vertical-align-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-vertical-align-md {\n vertical-align: var(--animus-vertical-align-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-vertical-align-lg {\n vertical-align: var(--animus-vertical-align-lg);\n }\n }\n .animus-dyn-size {\n width: var(--animus-size);\n height: var(--animus-size);\n }\n .animus-dyn-w {\n width: var(--animus-w);\n }\n .animus-dyn-width {\n width: var(--animus-width);\n }\n @media (min-width: 640px) {\n .animus-dyn-size-sm {\n width: var(--animus-size-sm);\n height: var(--animus-size-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-w-sm {\n width: var(--animus-w-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-width-sm {\n width: var(--animus-width-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-size-md {\n width: var(--animus-size-md);\n height: var(--animus-size-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-w-md {\n width: var(--animus-w-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-width-md {\n width: var(--animus-width-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-size-lg {\n width: var(--animus-size-lg);\n height: var(--animus-size-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-w-lg {\n width: var(--animus-w-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-width-lg {\n width: var(--animus-width-lg);\n }\n }\n .animus-dyn-z-index {\n z-index: var(--animus-z-index);\n }\n @media (min-width: 640px) {\n .animus-dyn-z-index-sm {\n z-index: var(--animus-z-index-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-z-index-md {\n z-index: var(--animus-z-index-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-z-index-lg {\n z-index: var(--animus-z-index-lg);\n }\n }\n}\n\n","sheets":{"declaration":"@layer anm-global, anm-base, anm-variants, anm-compounds, anm-states, anm-system, anm-custom;\n","global":"@layer anm-global {\n@font-face { font-family: AnimusTestFont; src: url('animus-asset:@animus-ui/test-ds/assets/test-font.woff2') format('woff2'); font-display: swap; }\n\n*, *::before, *::after {\n box-sizing: border-box;\n}\n\nbody {\n margin: 0;\n background-color: var(--color-background);\n --current-bg: var(--color-background);\n color: var(--color-text);\n font-family: system-ui, sans-serif;\n}\n@keyframes animus-kf-1x7guim {\n 0% {\n opacity: 0;\n background-color: var(--color-background);\n --current-bg: var(--color-background);\n }\n 100% {\n opacity: 1;\n background-color: var(--color-surface);\n --current-bg: var(--color-surface);\n }\n}\n\n@keyframes animus-kf-1yqv0zl {\n 0%, 100% {\n transform: scale(1);\n }\n 50% {\n transform: scale(1.05);\n }\n}\n\n@keyframes animus-kf-muo7kp {\n 0%, 100% {\n opacity: 1;\n }\n 50% {\n opacity: 0.6;\n }\n}\n}\n","base":"@layer anm-base {\n .animus-Alert-a385f997 {\n padding: 0.75rem;\n display: flex;\n align-items: flex-start;\n border-radius: 4px;\n font-size: 0.875rem;\n line-height: 1.5;\n }\n .animus-Badge-99781d29 {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n display: inline-flex;\n align-items: center;\n border-radius: 9999px;\n font-size: 0.75rem;\n font-weight: 500;\n line-height: 1;\n }\n .animus-Card-9aa7af5d {\n padding: 1rem;\n background-color: var(--color-surface);\n --current-bg: var(--color-surface);\n border-radius: 8px;\n color: var(--color-text);\n container-type: inline-size;\n container-name: card;\n }\n @container card (min-width: 400px) {\n .animus-Card-9aa7af5d {\n padding: 1.5rem;\n width: 50cqw;\n }\n }\n @media (prefers-reduced-motion: reduce) {\n .animus-Card-9aa7af5d {\n transition: none;\n }\n }\n @supports (display: grid) {\n .animus-Card-9aa7af5d {\n display: grid;\n font-size: 0.875rem;\n }\n }\n @supports (display: grid) {\n @media (min-width: 640px) {\n .animus-Card-9aa7af5d {\n font-size: 1rem;\n }\n }\n }\n @supports (display: grid) {\n .animus-Card-9aa7af5d:focus-visible {\n outline: 2px solid;\n }\n }\n @supports (display: grid) {\n @container card (min-width: 600px) {\n .animus-Card-9aa7af5d {\n gap: 2cqi;\n }\n }\n }\n .animus-ContainerCardBody-133c6ad9 {\n font-size: 0.875rem;\n line-height: 1.5;\n color: var(--color-text);\n }\n @container card (min-width: 400px) {\n .animus-ContainerCardBody-133c6ad9 {\n font-size: 1rem;\n }\n }\n .animus-ContainerCardMedia-51db5d07 {\n display: block;\n width: 100%;\n min-height: 64px;\n border-radius: 4px;\n background: var(--current-bg);\n }\n @container card (min-width: 400px) {\n .animus-ContainerCardMedia-51db5d07 {\n min-height: 120px;\n width: 50cqw;\n }\n }\n .animus-ContainerCardRoot-01c5b011 {\n gap: 0.5rem;\n padding: 1rem;\n display: flex;\n flex-direction: column;\n border-radius: 8px;\n background-color: var(--color-surface);\n --current-bg: var(--color-surface);\n color: var(--color-text);\n container-type: inline-size;\n container-name: card;\n }\n .animus-GroupItem-32b2d32f {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n display: inline-flex;\n align-items: center;\n border-radius: 4px;\n background-color: var(--color-surface);\n --current-bg: var(--color-surface);\n color: var(--color-text);\n }\n [data-active=\"true\"] .animus-GroupItem-32b2d32f {\n background-color: var(--color-primary);\n --current-bg: var(--color-primary);\n color: var(--color-background);\n }\n .group:hover .animus-GroupItem-32b2d32f {\n opacity: 0.9;\n }\n [data-color-mode=\"dark\"] .animus-GroupItem-32b2d32f {\n color: var(--color-text-muted);\n }\n .animus-Box-399302cf {\n display: flex;\n position: relative;\n }\n .animus-Button-c63b6dcd {\n border: none;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border-radius: 4px;\n font-weight: 600;\n line-height: 1;\n cursor: pointer;\n }\n .animus-Button-b3718a43 {\n border-radius: 4px;\n padding: 8px;\n background-color: var(--color-blue-500);\n }\n}\n","variants":"@layer anm-variants {\n @layer standalone, composed;\n @layer standalone {\n\n .animus-Alert-a385f997--variant-filled {\n color: var(--color-background);\n }\n .animus-Alert-a385f997--variant-outline {\n border-width: 1px;\n border-style: solid;\n background-color: transparent;\n --current-bg: transparent;\n }\n .animus-Alert-a385f997--intent-info {\n background-color: var(--color-primary);\n --current-bg: var(--color-primary);\n }\n .animus-Alert-a385f997--intent-danger {\n background-color: var(--color-danger);\n --current-bg: var(--color-danger);\n }\n .animus-Alert-a385f997--intent-success {\n background-color: var(--color-secondary);\n --current-bg: var(--color-secondary);\n }\n .animus-Badge-99781d29--color-neutral {\n background-color: var(--color-surface);\n --current-bg: var(--color-surface);\n color: var(--color-text);\n }\n .animus-Badge-99781d29--color-danger {\n background-color: var(--color-danger);\n --current-bg: var(--color-danger);\n color: var(--color-background);\n }\n .animus-ContainerCardRoot-01c5b011--size-lg {\n padding: 1.5rem;\n }\n .animus-Button-c63b6dcd--variant-primary {\n background-color: var(--color-primary);\n --current-bg: var(--color-primary);\n color: var(--color-background);\n }\n .animus-Button-c63b6dcd--variant-secondary {\n background-color: var(--color-secondary);\n --current-bg: var(--color-secondary);\n color: var(--color-background);\n }\n .animus-Button-c63b6dcd--variant-ghost {\n background-color: transparent;\n --current-bg: transparent;\n color: var(--color-text);\n }\n .animus-Button-b3718a43--tone-quiet {\n background-color: var(--color-gray-700);\n }\n .animus-Button-b3718a43--tone-loud {\n font-weight: 700;\n background-color: var(--color-blue-700);\n }\n }\n @layer composed {\n }\n}\n","compounds":"@layer anm-compounds {\n .animus-Alert-a385f997--compound-0 {\n border-color: var(--color-primary);\n color: var(--color-primary);\n }\n .animus-Alert-a385f997--compound-1 {\n border-color: var(--color-danger);\n color: var(--color-danger);\n }\n .animus-Alert-a385f997--compound-2 {\n border-color: var(--color-secondary);\n color: var(--color-secondary);\n }\n}\n","states":"@layer anm-states {\n .animus-Badge-99781d29--disabled {\n opacity: 0.5;\n cursor: not-allowed;\n }\n .animus-Badge-99781d29--active {\n outline: 2px solid;\n outline-color: var(--color-primary);\n }\n}\n","system":"@layer anm-system {\n .animus-dyn-flex {\n flex: var(--animus-flex);\n }\n @media (min-width: 640px) {\n .animus-dyn-flex-sm {\n flex: var(--animus-flex-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-flex-md {\n flex: var(--animus-flex-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-flex-lg {\n flex: var(--animus-flex-lg);\n }\n }\n .animus-dyn-m {\n margin: var(--animus-m);\n }\n @media (min-width: 640px) {\n .animus-dyn-m-sm {\n margin: var(--animus-m-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-m-md {\n margin: var(--animus-m-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-m-lg {\n margin: var(--animus-m-lg);\n }\n }\n .animus-dyn-p {\n padding: var(--animus-p);\n }\n @media (min-width: 640px) {\n .animus-dyn-p-sm {\n padding: var(--animus-p-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-p-md {\n padding: var(--animus-p-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-p-lg {\n padding: var(--animus-p-lg);\n }\n }\n .animus-dyn-gap {\n gap: var(--animus-gap);\n }\n @media (min-width: 640px) {\n .animus-dyn-gap-sm {\n gap: var(--animus-gap-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-gap-md {\n gap: var(--animus-gap-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-gap-lg {\n gap: var(--animus-gap-lg);\n }\n }\n .animus-dyn-area {\n grid-area: var(--animus-area);\n }\n .animus-dyn-grid-area {\n grid-area: var(--animus-grid-area);\n }\n @media (min-width: 640px) {\n .animus-dyn-area-sm {\n grid-area: var(--animus-area-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-grid-area-sm {\n grid-area: var(--animus-grid-area-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-area-md {\n grid-area: var(--animus-area-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-grid-area-md {\n grid-area: var(--animus-grid-area-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-area-lg {\n grid-area: var(--animus-area-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-grid-area-lg {\n grid-area: var(--animus-grid-area-lg);\n }\n }\n .animus-dyn-grid-column {\n grid-column: var(--animus-grid-column);\n }\n @media (min-width: 640px) {\n .animus-dyn-grid-column-sm {\n grid-column: var(--animus-grid-column-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-grid-column-md {\n grid-column: var(--animus-grid-column-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-grid-column-lg {\n grid-column: var(--animus-grid-column-lg);\n }\n }\n .animus-dyn-grid-row {\n grid-row: var(--animus-grid-row);\n }\n @media (min-width: 640px) {\n .animus-dyn-grid-row-sm {\n grid-row: var(--animus-grid-row-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-grid-row-md {\n grid-row: var(--animus-grid-row-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-grid-row-lg {\n grid-row: var(--animus-grid-row-lg);\n }\n }\n .animus-dyn-overflow {\n overflow: var(--animus-overflow);\n }\n @media (min-width: 640px) {\n .animus-dyn-overflow-sm {\n overflow: var(--animus-overflow-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-overflow-md {\n overflow: var(--animus-overflow-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-overflow-lg {\n overflow: var(--animus-overflow-lg);\n }\n }\n .animus-dyn-align-content {\n align-content: var(--animus-align-content);\n }\n @media (min-width: 640px) {\n .animus-dyn-align-content-sm {\n align-content: var(--animus-align-content-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-align-content-md {\n align-content: var(--animus-align-content-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-align-content-lg {\n align-content: var(--animus-align-content-lg);\n }\n }\n .animus-dyn-align-items {\n align-items: var(--animus-align-items);\n }\n @media (min-width: 640px) {\n .animus-dyn-align-items-sm {\n align-items: var(--animus-align-items-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-align-items-md {\n align-items: var(--animus-align-items-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-align-items-lg {\n align-items: var(--animus-align-items-lg);\n }\n }\n .animus-dyn-align-self {\n align-self: var(--animus-align-self);\n }\n @media (min-width: 640px) {\n .animus-dyn-align-self-sm {\n align-self: var(--animus-align-self-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-align-self-md {\n align-self: var(--animus-align-self-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-align-self-lg {\n align-self: var(--animus-align-self-lg);\n }\n }\n .animus-dyn-bottom {\n bottom: var(--animus-bottom);\n }\n @media (min-width: 640px) {\n .animus-dyn-bottom-sm {\n bottom: var(--animus-bottom-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-bottom-md {\n bottom: var(--animus-bottom-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-bottom-lg {\n bottom: var(--animus-bottom-lg);\n }\n }\n .animus-dyn-column-gap {\n column-gap: var(--animus-column-gap);\n }\n @media (min-width: 640px) {\n .animus-dyn-column-gap-sm {\n column-gap: var(--animus-column-gap-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-column-gap-md {\n column-gap: var(--animus-column-gap-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-column-gap-lg {\n column-gap: var(--animus-column-gap-lg);\n }\n }\n .animus-dyn-display {\n display: var(--animus-display);\n }\n @media (min-width: 640px) {\n .animus-dyn-display-sm {\n display: var(--animus-display-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-display-md {\n display: var(--animus-display-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-display-lg {\n display: var(--animus-display-lg);\n }\n }\n .animus-dyn-flex-basis {\n flex-basis: var(--animus-flex-basis);\n }\n @media (min-width: 640px) {\n .animus-dyn-flex-basis-sm {\n flex-basis: var(--animus-flex-basis-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-flex-basis-md {\n flex-basis: var(--animus-flex-basis-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-flex-basis-lg {\n flex-basis: var(--animus-flex-basis-lg);\n }\n }\n .animus-dyn-flex-dir {\n flex-direction: var(--animus-flex-dir);\n }\n .animus-dyn-flex-direction {\n flex-direction: var(--animus-flex-direction);\n }\n @media (min-width: 640px) {\n .animus-dyn-flex-dir-sm {\n flex-direction: var(--animus-flex-dir-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-flex-direction-sm {\n flex-direction: var(--animus-flex-direction-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-flex-dir-md {\n flex-direction: var(--animus-flex-dir-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-flex-direction-md {\n flex-direction: var(--animus-flex-direction-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-flex-dir-lg {\n flex-direction: var(--animus-flex-dir-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-flex-direction-lg {\n flex-direction: var(--animus-flex-direction-lg);\n }\n }\n .animus-dyn-flex-grow {\n flex-grow: var(--animus-flex-grow);\n }\n @media (min-width: 640px) {\n .animus-dyn-flex-grow-sm {\n flex-grow: var(--animus-flex-grow-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-flex-grow-md {\n flex-grow: var(--animus-flex-grow-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-flex-grow-lg {\n flex-grow: var(--animus-flex-grow-lg);\n }\n }\n .animus-dyn-flex-shrink {\n flex-shrink: var(--animus-flex-shrink);\n }\n @media (min-width: 640px) {\n .animus-dyn-flex-shrink-sm {\n flex-shrink: var(--animus-flex-shrink-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-flex-shrink-md {\n flex-shrink: var(--animus-flex-shrink-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-flex-shrink-lg {\n flex-shrink: var(--animus-flex-shrink-lg);\n }\n }\n .animus-dyn-flex-wrap {\n flex-wrap: var(--animus-flex-wrap);\n }\n @media (min-width: 640px) {\n .animus-dyn-flex-wrap-sm {\n flex-wrap: var(--animus-flex-wrap-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-flex-wrap-md {\n flex-wrap: var(--animus-flex-wrap-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-flex-wrap-lg {\n flex-wrap: var(--animus-flex-wrap-lg);\n }\n }\n .animus-dyn-font-size {\n font-size: var(--animus-font-size);\n }\n @media (min-width: 640px) {\n .animus-dyn-font-size-sm {\n font-size: var(--animus-font-size-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-font-size-md {\n font-size: var(--animus-font-size-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-font-size-lg {\n font-size: var(--animus-font-size-lg);\n }\n }\n .animus-dyn-grid-column-end {\n grid-column-end: var(--animus-grid-column-end);\n }\n @media (min-width: 640px) {\n .animus-dyn-grid-column-end-sm {\n grid-column-end: var(--animus-grid-column-end-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-grid-column-end-md {\n grid-column-end: var(--animus-grid-column-end-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-grid-column-end-lg {\n grid-column-end: var(--animus-grid-column-end-lg);\n }\n }\n .animus-dyn-grid-column-start {\n grid-column-start: var(--animus-grid-column-start);\n }\n @media (min-width: 640px) {\n .animus-dyn-grid-column-start-sm {\n grid-column-start: var(--animus-grid-column-start-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-grid-column-start-md {\n grid-column-start: var(--animus-grid-column-start-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-grid-column-start-lg {\n grid-column-start: var(--animus-grid-column-start-lg);\n }\n }\n .animus-dyn-grid-row-end {\n grid-row-end: var(--animus-grid-row-end);\n }\n @media (min-width: 640px) {\n .animus-dyn-grid-row-end-sm {\n grid-row-end: var(--animus-grid-row-end-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-grid-row-end-md {\n grid-row-end: var(--animus-grid-row-end-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-grid-row-end-lg {\n grid-row-end: var(--animus-grid-row-end-lg);\n }\n }\n .animus-dyn-grid-row-start {\n grid-row-start: var(--animus-grid-row-start);\n }\n @media (min-width: 640px) {\n .animus-dyn-grid-row-start-sm {\n grid-row-start: var(--animus-grid-row-start-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-grid-row-start-md {\n grid-row-start: var(--animus-grid-row-start-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-grid-row-start-lg {\n grid-row-start: var(--animus-grid-row-start-lg);\n }\n }\n .animus-dyn-h {\n height: var(--animus-h);\n }\n .animus-dyn-height {\n height: var(--animus-height);\n }\n @media (min-width: 640px) {\n .animus-dyn-h-sm {\n height: var(--animus-h-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-height-sm {\n height: var(--animus-height-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-h-md {\n height: var(--animus-h-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-height-md {\n height: var(--animus-height-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-h-lg {\n height: var(--animus-h-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-height-lg {\n height: var(--animus-height-lg);\n }\n }\n .animus-dyn-justify-content {\n justify-content: var(--animus-justify-content);\n }\n @media (min-width: 640px) {\n .animus-dyn-justify-content-sm {\n justify-content: var(--animus-justify-content-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-justify-content-md {\n justify-content: var(--animus-justify-content-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-justify-content-lg {\n justify-content: var(--animus-justify-content-lg);\n }\n }\n .animus-dyn-justify-items {\n justify-items: var(--animus-justify-items);\n }\n @media (min-width: 640px) {\n .animus-dyn-justify-items-sm {\n justify-items: var(--animus-justify-items-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-justify-items-md {\n justify-items: var(--animus-justify-items-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-justify-items-lg {\n justify-items: var(--animus-justify-items-lg);\n }\n }\n .animus-dyn-justify-self {\n justify-self: var(--animus-justify-self);\n }\n @media (min-width: 640px) {\n .animus-dyn-justify-self-sm {\n justify-self: var(--animus-justify-self-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-justify-self-md {\n justify-self: var(--animus-justify-self-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-justify-self-lg {\n justify-self: var(--animus-justify-self-lg);\n }\n }\n .animus-dyn-left {\n left: var(--animus-left);\n }\n @media (min-width: 640px) {\n .animus-dyn-left-sm {\n left: var(--animus-left-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-left-md {\n left: var(--animus-left-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-left-lg {\n left: var(--animus-left-lg);\n }\n }\n .animus-dyn-mb {\n margin-bottom: var(--animus-mb);\n }\n @media (min-width: 640px) {\n .animus-dyn-mb-sm {\n margin-bottom: var(--animus-mb-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-mb-md {\n margin-bottom: var(--animus-mb-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-mb-lg {\n margin-bottom: var(--animus-mb-lg);\n }\n }\n .animus-dyn-ml {\n margin-left: var(--animus-ml);\n }\n .animus-dyn-mx {\n margin-left: var(--animus-mx);\n margin-right: var(--animus-mx);\n }\n @media (min-width: 640px) {\n .animus-dyn-ml-sm {\n margin-left: var(--animus-ml-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-mx-sm {\n margin-left: var(--animus-mx-sm);\n margin-right: var(--animus-mx-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-ml-md {\n margin-left: var(--animus-ml-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-mx-md {\n margin-left: var(--animus-mx-md);\n margin-right: var(--animus-mx-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-ml-lg {\n margin-left: var(--animus-ml-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-mx-lg {\n margin-left: var(--animus-mx-lg);\n margin-right: var(--animus-mx-lg);\n }\n }\n .animus-dyn-mr {\n margin-right: var(--animus-mr);\n }\n @media (min-width: 640px) {\n .animus-dyn-mr-sm {\n margin-right: var(--animus-mr-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-mr-md {\n margin-right: var(--animus-mr-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-mr-lg {\n margin-right: var(--animus-mr-lg);\n }\n }\n .animus-dyn-mt {\n margin-top: var(--animus-mt);\n }\n .animus-dyn-my {\n margin-top: var(--animus-my);\n margin-bottom: var(--animus-my);\n }\n @media (min-width: 640px) {\n .animus-dyn-mt-sm {\n margin-top: var(--animus-mt-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-my-sm {\n margin-top: var(--animus-my-sm);\n margin-bottom: var(--animus-my-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-mt-md {\n margin-top: var(--animus-mt-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-my-md {\n margin-top: var(--animus-my-md);\n margin-bottom: var(--animus-my-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-mt-lg {\n margin-top: var(--animus-mt-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-my-lg {\n margin-top: var(--animus-my-lg);\n margin-bottom: var(--animus-my-lg);\n }\n }\n .animus-dyn-max-h {\n max-height: var(--animus-max-h);\n }\n .animus-dyn-max-height {\n max-height: var(--animus-max-height);\n }\n @media (min-width: 640px) {\n .animus-dyn-max-h-sm {\n max-height: var(--animus-max-h-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-max-height-sm {\n max-height: var(--animus-max-height-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-max-h-md {\n max-height: var(--animus-max-h-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-max-height-md {\n max-height: var(--animus-max-height-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-max-h-lg {\n max-height: var(--animus-max-h-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-max-height-lg {\n max-height: var(--animus-max-height-lg);\n }\n }\n .animus-dyn-max-w {\n max-width: var(--animus-max-w);\n }\n .animus-dyn-max-width {\n max-width: var(--animus-max-width);\n }\n @media (min-width: 640px) {\n .animus-dyn-max-w-sm {\n max-width: var(--animus-max-w-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-max-width-sm {\n max-width: var(--animus-max-width-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-max-w-md {\n max-width: var(--animus-max-w-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-max-width-md {\n max-width: var(--animus-max-width-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-max-w-lg {\n max-width: var(--animus-max-w-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-max-width-lg {\n max-width: var(--animus-max-width-lg);\n }\n }\n .animus-dyn-min-h {\n min-height: var(--animus-min-h);\n }\n .animus-dyn-min-height {\n min-height: var(--animus-min-height);\n }\n @media (min-width: 640px) {\n .animus-dyn-min-h-sm {\n min-height: var(--animus-min-h-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-min-height-sm {\n min-height: var(--animus-min-height-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-min-h-md {\n min-height: var(--animus-min-h-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-min-height-md {\n min-height: var(--animus-min-height-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-min-h-lg {\n min-height: var(--animus-min-h-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-min-height-lg {\n min-height: var(--animus-min-height-lg);\n }\n }\n .animus-dyn-min-w {\n min-width: var(--animus-min-w);\n }\n .animus-dyn-min-width {\n min-width: var(--animus-min-width);\n }\n @media (min-width: 640px) {\n .animus-dyn-min-w-sm {\n min-width: var(--animus-min-w-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-min-width-sm {\n min-width: var(--animus-min-width-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-min-w-md {\n min-width: var(--animus-min-w-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-min-width-md {\n min-width: var(--animus-min-width-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-min-w-lg {\n min-width: var(--animus-min-w-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-min-width-lg {\n min-width: var(--animus-min-width-lg);\n }\n }\n .animus-dyn-opacity {\n opacity: var(--animus-opacity);\n }\n @media (min-width: 640px) {\n .animus-dyn-opacity-sm {\n opacity: var(--animus-opacity-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-opacity-md {\n opacity: var(--animus-opacity-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-opacity-lg {\n opacity: var(--animus-opacity-lg);\n }\n }\n .animus-dyn-order {\n order: var(--animus-order);\n }\n @media (min-width: 640px) {\n .animus-dyn-order-sm {\n order: var(--animus-order-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-order-md {\n order: var(--animus-order-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-order-lg {\n order: var(--animus-order-lg);\n }\n }\n .animus-dyn-overflow-x {\n overflow-x: var(--animus-overflow-x);\n }\n @media (min-width: 640px) {\n .animus-dyn-overflow-x-sm {\n overflow-x: var(--animus-overflow-x-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-overflow-x-md {\n overflow-x: var(--animus-overflow-x-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-overflow-x-lg {\n overflow-x: var(--animus-overflow-x-lg);\n }\n }\n .animus-dyn-overflow-y {\n overflow-y: var(--animus-overflow-y);\n }\n @media (min-width: 640px) {\n .animus-dyn-overflow-y-sm {\n overflow-y: var(--animus-overflow-y-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-overflow-y-md {\n overflow-y: var(--animus-overflow-y-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-overflow-y-lg {\n overflow-y: var(--animus-overflow-y-lg);\n }\n }\n .animus-dyn-pb {\n padding-bottom: var(--animus-pb);\n }\n @media (min-width: 640px) {\n .animus-dyn-pb-sm {\n padding-bottom: var(--animus-pb-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-pb-md {\n padding-bottom: var(--animus-pb-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-pb-lg {\n padding-bottom: var(--animus-pb-lg);\n }\n }\n .animus-dyn-pl {\n padding-left: var(--animus-pl);\n }\n .animus-dyn-px {\n padding-left: var(--animus-px);\n padding-right: var(--animus-px);\n }\n @media (min-width: 640px) {\n .animus-dyn-pl-sm {\n padding-left: var(--animus-pl-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-px-sm {\n padding-left: var(--animus-px-sm);\n padding-right: var(--animus-px-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-pl-md {\n padding-left: var(--animus-pl-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-px-md {\n padding-left: var(--animus-px-md);\n padding-right: var(--animus-px-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-pl-lg {\n padding-left: var(--animus-pl-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-px-lg {\n padding-left: var(--animus-px-lg);\n padding-right: var(--animus-px-lg);\n }\n }\n .animus-dyn-pr {\n padding-right: var(--animus-pr);\n }\n @media (min-width: 640px) {\n .animus-dyn-pr-sm {\n padding-right: var(--animus-pr-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-pr-md {\n padding-right: var(--animus-pr-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-pr-lg {\n padding-right: var(--animus-pr-lg);\n }\n }\n .animus-dyn-pt {\n padding-top: var(--animus-pt);\n }\n .animus-dyn-py {\n padding-top: var(--animus-py);\n padding-bottom: var(--animus-py);\n }\n @media (min-width: 640px) {\n .animus-dyn-pt-sm {\n padding-top: var(--animus-pt-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-py-sm {\n padding-top: var(--animus-py-sm);\n padding-bottom: var(--animus-py-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-pt-md {\n padding-top: var(--animus-pt-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-py-md {\n padding-top: var(--animus-py-md);\n padding-bottom: var(--animus-py-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-pt-lg {\n padding-top: var(--animus-pt-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-py-lg {\n padding-top: var(--animus-py-lg);\n padding-bottom: var(--animus-py-lg);\n }\n }\n .animus-dyn-pos {\n position: var(--animus-pos);\n }\n .animus-dyn-position {\n position: var(--animus-position);\n }\n @media (min-width: 640px) {\n .animus-dyn-pos-sm {\n position: var(--animus-pos-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-position-sm {\n position: var(--animus-position-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-pos-md {\n position: var(--animus-pos-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-position-md {\n position: var(--animus-position-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-pos-lg {\n position: var(--animus-pos-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-position-lg {\n position: var(--animus-position-lg);\n }\n }\n .animus-dyn-right {\n right: var(--animus-right);\n }\n @media (min-width: 640px) {\n .animus-dyn-right-sm {\n right: var(--animus-right-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-right-md {\n right: var(--animus-right-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-right-lg {\n right: var(--animus-right-lg);\n }\n }\n .animus-dyn-row-gap {\n row-gap: var(--animus-row-gap);\n }\n @media (min-width: 640px) {\n .animus-dyn-row-gap-sm {\n row-gap: var(--animus-row-gap-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-row-gap-md {\n row-gap: var(--animus-row-gap-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-row-gap-lg {\n row-gap: var(--animus-row-gap-lg);\n }\n }\n .animus-dyn-inset {\n top: var(--animus-inset);\n right: var(--animus-inset);\n bottom: var(--animus-inset);\n left: var(--animus-inset);\n }\n .animus-dyn-top {\n top: var(--animus-top);\n }\n @media (min-width: 640px) {\n .animus-dyn-inset-sm {\n top: var(--animus-inset-sm);\n right: var(--animus-inset-sm);\n bottom: var(--animus-inset-sm);\n left: var(--animus-inset-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-top-sm {\n top: var(--animus-top-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-inset-md {\n top: var(--animus-inset-md);\n right: var(--animus-inset-md);\n bottom: var(--animus-inset-md);\n left: var(--animus-inset-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-top-md {\n top: var(--animus-top-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-inset-lg {\n top: var(--animus-inset-lg);\n right: var(--animus-inset-lg);\n bottom: var(--animus-inset-lg);\n left: var(--animus-inset-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-top-lg {\n top: var(--animus-top-lg);\n }\n }\n .animus-dyn-vertical-align {\n vertical-align: var(--animus-vertical-align);\n }\n @media (min-width: 640px) {\n .animus-dyn-vertical-align-sm {\n vertical-align: var(--animus-vertical-align-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-vertical-align-md {\n vertical-align: var(--animus-vertical-align-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-vertical-align-lg {\n vertical-align: var(--animus-vertical-align-lg);\n }\n }\n .animus-dyn-size {\n width: var(--animus-size);\n height: var(--animus-size);\n }\n .animus-dyn-w {\n width: var(--animus-w);\n }\n .animus-dyn-width {\n width: var(--animus-width);\n }\n @media (min-width: 640px) {\n .animus-dyn-size-sm {\n width: var(--animus-size-sm);\n height: var(--animus-size-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-w-sm {\n width: var(--animus-w-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-width-sm {\n width: var(--animus-width-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-size-md {\n width: var(--animus-size-md);\n height: var(--animus-size-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-w-md {\n width: var(--animus-w-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-width-md {\n width: var(--animus-width-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-size-lg {\n width: var(--animus-size-lg);\n height: var(--animus-size-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-w-lg {\n width: var(--animus-w-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-width-lg {\n width: var(--animus-width-lg);\n }\n }\n .animus-dyn-z-index {\n z-index: var(--animus-z-index);\n }\n @media (min-width: 640px) {\n .animus-dyn-z-index-sm {\n z-index: var(--animus-z-index-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-z-index-md {\n z-index: var(--animus-z-index-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-z-index-lg {\n z-index: var(--animus-z-index-lg);\n }\n }\n}\n","custom":""},"diagnostics":[{"file":"../../packages/test-ds/src/components/Alert.tsx","component":"Alert","kind":"external-token-candidate","message":"'space.0.75rem' in 'padding' did not resolve against the consumer theme","token":"space.0.75rem"},{"file":"../../packages/test-ds/src/components/Alert.tsx","component":"Alert","kind":"external-token-candidate","message":"'radii.4px' in 'border-radius' did not resolve against the consumer theme","token":"radii.4px"},{"file":"../../packages/test-ds/src/components/Alert.tsx","component":"Alert","kind":"external-token-candidate","message":"'fontSizes.0.875rem' in 'font-size' did not resolve against the consumer theme","token":"fontSizes.0.875rem"},{"file":"../../packages/test-ds/src/components/Alert.tsx","component":"Alert","kind":"external-token-candidate","message":"'lineHeights.1.5' in 'line-height' did not resolve against the consumer theme","token":"lineHeights.1.5"},{"file":"../../packages/test-ds/src/components/Alert.tsx","component":"Alert","kind":"external-token-candidate","message":"'borderWidths.1px' in 'border-width' did not resolve against the consumer theme","token":"borderWidths.1px"},{"file":"../../packages/test-ds/src/components/Badge.tsx","component":"Badge","kind":"external-token-candidate","message":"'space.0.5rem' in 'padding-left' did not resolve against the consumer theme","token":"space.0.5rem"},{"file":"../../packages/test-ds/src/components/Badge.tsx","component":"Badge","kind":"external-token-candidate","message":"'space.0.5rem' in 'padding-right' did not resolve against the consumer theme","token":"space.0.5rem"},{"file":"../../packages/test-ds/src/components/Badge.tsx","component":"Badge","kind":"external-token-candidate","message":"'space.0.25rem' in 'padding-top' did not resolve against the consumer theme","token":"space.0.25rem"},{"file":"../../packages/test-ds/src/components/Badge.tsx","component":"Badge","kind":"external-token-candidate","message":"'space.0.25rem' in 'padding-bottom' did not resolve against the consumer theme","token":"space.0.25rem"},{"file":"../../packages/test-ds/src/components/Badge.tsx","component":"Badge","kind":"external-token-candidate","message":"'radii.9999px' in 'border-radius' did not resolve against the consumer theme","token":"radii.9999px"},{"file":"../../packages/test-ds/src/components/Badge.tsx","component":"Badge","kind":"external-token-candidate","message":"'fontSizes.0.75rem' in 'font-size' did not resolve against the consumer theme","token":"fontSizes.0.75rem"},{"file":"../../packages/test-ds/src/components/Badge.tsx","component":"Badge","kind":"external-token-candidate","message":"'fontWeights.500' in 'font-weight' did not resolve against the consumer theme","token":"fontWeights.500"},{"file":"../../packages/test-ds/src/components/Badge.tsx","component":"Badge","kind":"external-token-candidate","message":"'lineHeights.1' in 'line-height' did not resolve against the consumer theme","token":"lineHeights.1"},{"file":"../../packages/test-ds/src/components/Badge.tsx","component":"Badge","kind":"external-token-candidate","message":"'opacities.0.5' in 'opacity' did not resolve against the consumer theme","token":"opacities.0.5"},{"file":"../../packages/test-ds/src/components/Button.tsx","component":"Button","kind":"external-token-candidate","message":"'radii.4px' in 'border-radius' did not resolve against the consumer theme","token":"radii.4px"},{"file":"../../packages/test-ds/src/components/Button.tsx","component":"Button","kind":"external-token-candidate","message":"'fontWeights.600' in 'font-weight' did not resolve against the consumer theme","token":"fontWeights.600"},{"file":"../../packages/test-ds/src/components/Button.tsx","component":"Button","kind":"external-token-candidate","message":"'lineHeights.1' in 'line-height' did not resolve against the consumer theme","token":"lineHeights.1"},{"file":"../../packages/test-ds/src/components/Card.tsx","component":"Card","kind":"external-token-candidate","message":"'space.1rem' in 'padding' did not resolve against the consumer theme","token":"space.1rem"},{"file":"../../packages/test-ds/src/components/Card.tsx","component":"Card","kind":"external-token-candidate","message":"'radii.8px' in 'border-radius' did not resolve against the consumer theme","token":"radii.8px"},{"file":"../../packages/test-ds/src/components/Card.tsx","component":"Card","kind":"external-token-candidate","message":"'space.1.5rem' in 'padding' did not resolve against the consumer theme","token":"space.1.5rem"},{"file":"../../packages/test-ds/src/components/Card.tsx","component":"Card","kind":"external-token-candidate","message":"'fontSizes.0.875rem' in 'font-size' did not resolve against the consumer theme","token":"fontSizes.0.875rem"},{"file":"../../packages/test-ds/src/components/Card.tsx","component":"Card","kind":"external-token-candidate","message":"'fontSizes.1rem' in 'font-size' did not resolve against the consumer theme","token":"fontSizes.1rem"},{"file":"../../packages/test-ds/src/components/Card.tsx","component":"Card","kind":"external-token-candidate","message":"'space.2cqi' in 'gap' did not resolve against the consumer theme","token":"space.2cqi"},{"file":"../../packages/test-ds/src/components/ContainerCard.tsx","component":"ContainerCardBody","kind":"external-token-candidate","message":"'fontSizes.0.875rem' in 'font-size' did not resolve against the consumer theme","token":"fontSizes.0.875rem"},{"file":"../../packages/test-ds/src/components/ContainerCard.tsx","component":"ContainerCardBody","kind":"external-token-candidate","message":"'lineHeights.1.5' in 'line-height' did not resolve against the consumer theme","token":"lineHeights.1.5"},{"file":"../../packages/test-ds/src/components/ContainerCard.tsx","component":"ContainerCardBody","kind":"external-token-candidate","message":"'fontSizes.1rem' in 'font-size' did not resolve against the consumer theme","token":"fontSizes.1rem"},{"file":"../../packages/test-ds/src/components/ContainerCard.tsx","component":"ContainerCardMedia","kind":"external-token-candidate","message":"'radii.4px' in 'border-radius' did not resolve against the consumer theme","token":"radii.4px"},{"file":"../../packages/test-ds/src/components/ContainerCard.tsx","component":"ContainerCardRoot","kind":"external-token-candidate","message":"'space.0.5rem' in 'gap' did not resolve against the consumer theme","token":"space.0.5rem"},{"file":"../../packages/test-ds/src/components/ContainerCard.tsx","component":"ContainerCardRoot","kind":"external-token-candidate","message":"'space.1rem' in 'padding' did not resolve against the consumer theme","token":"space.1rem"},{"file":"../../packages/test-ds/src/components/ContainerCard.tsx","component":"ContainerCardRoot","kind":"external-token-candidate","message":"'radii.8px' in 'border-radius' did not resolve against the consumer theme","token":"radii.8px"},{"file":"../../packages/test-ds/src/components/ContainerCard.tsx","component":"ContainerCardRoot","kind":"external-token-candidate","message":"'space.1.5rem' in 'padding' did not resolve against the consumer theme","token":"space.1.5rem"},{"file":"../../packages/test-ds/src/components/GroupItem.tsx","component":"GroupItem","kind":"external-token-candidate","message":"'space.0.5rem' in 'padding-left' did not resolve against the consumer theme","token":"space.0.5rem"},{"file":"../../packages/test-ds/src/components/GroupItem.tsx","component":"GroupItem","kind":"external-token-candidate","message":"'space.0.5rem' in 'padding-right' did not resolve against the consumer theme","token":"space.0.5rem"},{"file":"../../packages/test-ds/src/components/GroupItem.tsx","component":"GroupItem","kind":"external-token-candidate","message":"'space.0.25rem' in 'padding-top' did not resolve against the consumer theme","token":"space.0.25rem"},{"file":"../../packages/test-ds/src/components/GroupItem.tsx","component":"GroupItem","kind":"external-token-candidate","message":"'space.0.25rem' in 'padding-bottom' did not resolve against the consumer theme","token":"space.0.25rem"},{"file":"../../packages/test-ds/src/components/GroupItem.tsx","component":"GroupItem","kind":"external-token-candidate","message":"'radii.4px' in 'border-radius' did not resolve against the consumer theme","token":"radii.4px"},{"file":"../../packages/test-ds/src/components/GroupItem.tsx","component":"GroupItem","kind":"external-token-candidate","message":"'opacities.0.9' in 'opacity' did not resolve against the consumer theme","token":"opacities.0.9"}],"report":{"components_total":10,"components_extracted":10,"components_eliminated":0,"variants_total":16,"variants_used":16,"variants_eliminated":0,"states_total":2,"states_used":2,"states_eliminated":0,"components_forced":0,"variants_forced":0,"states_forced":0,"eliminated_details":[]},"system_prop_map":{},"dynamic_props":{"alignContent":{"varName":"--animus-align-content","slotClass":"animus-dyn-align-content","property":"alignContent","transformName":null,"transformFnSource":null,"scaleValues":{}},"alignItems":{"varName":"--animus-align-items","slotClass":"animus-dyn-align-items","property":"alignItems","transformName":null,"transformFnSource":null,"scaleValues":{}},"alignSelf":{"varName":"--animus-align-self","slotClass":"animus-dyn-align-self","property":"alignSelf","transformName":null,"transformFnSource":null,"scaleValues":{}},"area":{"varName":"--animus-area","slotClass":"animus-dyn-area","property":"gridArea","transformName":null,"transformFnSource":null,"scaleValues":{}},"bottom":{"varName":"--animus-bottom","slotClass":"animus-dyn-bottom","property":"bottom","transformName":"size","transformFnSource":null,"scaleValues":{}},"columnGap":{"varName":"--animus-column-gap","slotClass":"animus-dyn-column-gap","property":"columnGap","transformName":null,"transformFnSource":null,"scaleValues":{"0":"0","12":"0.75rem","16":"1rem","24":"1.5rem","32":"2rem","4":"0.25rem","8":"0.5rem"}},"display":{"varName":"--animus-display","slotClass":"animus-dyn-display","property":"display","transformName":null,"transformFnSource":null,"scaleValues":{}},"flex":{"varName":"--animus-flex","slotClass":"animus-dyn-flex","property":"flex","transformName":null,"transformFnSource":null,"scaleValues":{}},"flexBasis":{"varName":"--animus-flex-basis","slotClass":"animus-dyn-flex-basis","property":"flexBasis","transformName":null,"transformFnSource":null,"scaleValues":{}},"flexDir":{"varName":"--animus-flex-dir","slotClass":"animus-dyn-flex-dir","property":"flexDirection","transformName":null,"transformFnSource":null,"scaleValues":{}},"flexDirection":{"varName":"--animus-flex-direction","slotClass":"animus-dyn-flex-direction","property":"flexDirection","transformName":null,"transformFnSource":null,"scaleValues":{}},"flexGrow":{"varName":"--animus-flex-grow","slotClass":"animus-dyn-flex-grow","property":"flexGrow","transformName":null,"transformFnSource":null,"scaleValues":{}},"flexShrink":{"varName":"--animus-flex-shrink","slotClass":"animus-dyn-flex-shrink","property":"flexShrink","transformName":null,"transformFnSource":null,"scaleValues":{}},"flexWrap":{"varName":"--animus-flex-wrap","slotClass":"animus-dyn-flex-wrap","property":"flexWrap","transformName":null,"transformFnSource":null,"scaleValues":{}},"fontSize":{"varName":"--animus-font-size","slotClass":"animus-dyn-font-size","property":"fontSize","transformName":null,"transformFnSource":null,"scaleValues":{"12":"0.75rem","14":"0.875rem","16":"1rem","20":"1.25rem","24":"1.5rem"}},"gap":{"varName":"--animus-gap","slotClass":"animus-dyn-gap","property":"gap","transformName":null,"transformFnSource":null,"scaleValues":{"0":"0","12":"0.75rem","16":"1rem","24":"1.5rem","32":"2rem","4":"0.25rem","8":"0.5rem"}},"gridArea":{"varName":"--animus-grid-area","slotClass":"animus-dyn-grid-area","property":"gridArea","transformName":null,"transformFnSource":null,"scaleValues":{}},"gridColumn":{"varName":"--animus-grid-column","slotClass":"animus-dyn-grid-column","property":"gridColumn","transformName":null,"transformFnSource":null,"scaleValues":{}},"gridColumnEnd":{"varName":"--animus-grid-column-end","slotClass":"animus-dyn-grid-column-end","property":"gridColumnEnd","transformName":null,"transformFnSource":null,"scaleValues":{}},"gridColumnStart":{"varName":"--animus-grid-column-start","slotClass":"animus-dyn-grid-column-start","property":"gridColumnStart","transformName":null,"transformFnSource":null,"scaleValues":{}},"gridRow":{"varName":"--animus-grid-row","slotClass":"animus-dyn-grid-row","property":"gridRow","transformName":null,"transformFnSource":null,"scaleValues":{}},"gridRowEnd":{"varName":"--animus-grid-row-end","slotClass":"animus-dyn-grid-row-end","property":"gridRowEnd","transformName":null,"transformFnSource":null,"scaleValues":{}},"gridRowStart":{"varName":"--animus-grid-row-start","slotClass":"animus-dyn-grid-row-start","property":"gridRowStart","transformName":null,"transformFnSource":null,"scaleValues":{}},"h":{"varName":"--animus-h","slotClass":"animus-dyn-h","property":"height","transformName":"size","transformFnSource":null,"scaleValues":{}},"height":{"varName":"--animus-height","slotClass":"animus-dyn-height","property":"height","transformName":"size","transformFnSource":null,"scaleValues":{}},"inset":{"varName":"--animus-inset","slotClass":"animus-dyn-inset","property":"inset","properties":["top","right","bottom","left"],"transformName":"size","transformFnSource":null,"scaleValues":{}},"justifyContent":{"varName":"--animus-justify-content","slotClass":"animus-dyn-justify-content","property":"justifyContent","transformName":null,"transformFnSource":null,"scaleValues":{}},"justifyItems":{"varName":"--animus-justify-items","slotClass":"animus-dyn-justify-items","property":"justifyItems","transformName":null,"transformFnSource":null,"scaleValues":{}},"justifySelf":{"varName":"--animus-justify-self","slotClass":"animus-dyn-justify-self","property":"justifySelf","transformName":null,"transformFnSource":null,"scaleValues":{}},"left":{"varName":"--animus-left","slotClass":"animus-dyn-left","property":"left","transformName":"size","transformFnSource":null,"scaleValues":{}},"m":{"varName":"--animus-m","slotClass":"animus-dyn-m","property":"margin","transformName":null,"transformFnSource":null,"scaleValues":{"0":"0","12":"0.75rem","16":"1rem","24":"1.5rem","32":"2rem","4":"0.25rem","8":"0.5rem"}},"maxH":{"varName":"--animus-max-h","slotClass":"animus-dyn-max-h","property":"maxHeight","transformName":"size","transformFnSource":null,"scaleValues":{}},"maxHeight":{"varName":"--animus-max-height","slotClass":"animus-dyn-max-height","property":"maxHeight","transformName":"size","transformFnSource":null,"scaleValues":{}},"maxW":{"varName":"--animus-max-w","slotClass":"animus-dyn-max-w","property":"maxWidth","transformName":"size","transformFnSource":null,"scaleValues":{}},"maxWidth":{"varName":"--animus-max-width","slotClass":"animus-dyn-max-width","property":"maxWidth","transformName":"size","transformFnSource":null,"scaleValues":{}},"mb":{"varName":"--animus-mb","slotClass":"animus-dyn-mb","property":"marginBottom","transformName":null,"transformFnSource":null,"scaleValues":{"0":"0","12":"0.75rem","16":"1rem","24":"1.5rem","32":"2rem","4":"0.25rem","8":"0.5rem"}},"minH":{"varName":"--animus-min-h","slotClass":"animus-dyn-min-h","property":"minHeight","transformName":"size","transformFnSource":null,"scaleValues":{}},"minHeight":{"varName":"--animus-min-height","slotClass":"animus-dyn-min-height","property":"minHeight","transformName":"size","transformFnSource":null,"scaleValues":{}},"minW":{"varName":"--animus-min-w","slotClass":"animus-dyn-min-w","property":"minWidth","transformName":"size","transformFnSource":null,"scaleValues":{}},"minWidth":{"varName":"--animus-min-width","slotClass":"animus-dyn-min-width","property":"minWidth","transformName":"size","transformFnSource":null,"scaleValues":{}},"ml":{"varName":"--animus-ml","slotClass":"animus-dyn-ml","property":"marginLeft","transformName":null,"transformFnSource":null,"scaleValues":{"0":"0","12":"0.75rem","16":"1rem","24":"1.5rem","32":"2rem","4":"0.25rem","8":"0.5rem"}},"mr":{"varName":"--animus-mr","slotClass":"animus-dyn-mr","property":"marginRight","transformName":null,"transformFnSource":null,"scaleValues":{"0":"0","12":"0.75rem","16":"1rem","24":"1.5rem","32":"2rem","4":"0.25rem","8":"0.5rem"}},"mt":{"varName":"--animus-mt","slotClass":"animus-dyn-mt","property":"marginTop","transformName":null,"transformFnSource":null,"scaleValues":{"0":"0","12":"0.75rem","16":"1rem","24":"1.5rem","32":"2rem","4":"0.25rem","8":"0.5rem"}},"mx":{"varName":"--animus-mx","slotClass":"animus-dyn-mx","property":"margin","properties":["marginLeft","marginRight"],"transformName":null,"transformFnSource":null,"scaleValues":{"0":"0","12":"0.75rem","16":"1rem","24":"1.5rem","32":"2rem","4":"0.25rem","8":"0.5rem"}},"my":{"varName":"--animus-my","slotClass":"animus-dyn-my","property":"margin","properties":["marginTop","marginBottom"],"transformName":null,"transformFnSource":null,"scaleValues":{"0":"0","12":"0.75rem","16":"1rem","24":"1.5rem","32":"2rem","4":"0.25rem","8":"0.5rem"}},"opacity":{"varName":"--animus-opacity","slotClass":"animus-dyn-opacity","property":"opacity","transformName":null,"transformFnSource":null,"scaleValues":{}},"order":{"varName":"--animus-order","slotClass":"animus-dyn-order","property":"order","transformName":null,"transformFnSource":null,"scaleValues":{}},"overflow":{"varName":"--animus-overflow","slotClass":"animus-dyn-overflow","property":"overflow","transformName":null,"transformFnSource":null,"scaleValues":{}},"overflowX":{"varName":"--animus-overflow-x","slotClass":"animus-dyn-overflow-x","property":"overflowX","transformName":null,"transformFnSource":null,"scaleValues":{}},"overflowY":{"varName":"--animus-overflow-y","slotClass":"animus-dyn-overflow-y","property":"overflowY","transformName":null,"transformFnSource":null,"scaleValues":{}},"p":{"varName":"--animus-p","slotClass":"animus-dyn-p","property":"padding","transformName":null,"transformFnSource":null,"scaleValues":{"0":"0","12":"0.75rem","16":"1rem","24":"1.5rem","32":"2rem","4":"0.25rem","8":"0.5rem"}},"pb":{"varName":"--animus-pb","slotClass":"animus-dyn-pb","property":"paddingBottom","transformName":null,"transformFnSource":null,"scaleValues":{"0":"0","12":"0.75rem","16":"1rem","24":"1.5rem","32":"2rem","4":"0.25rem","8":"0.5rem"}},"pl":{"varName":"--animus-pl","slotClass":"animus-dyn-pl","property":"paddingLeft","transformName":null,"transformFnSource":null,"scaleValues":{"0":"0","12":"0.75rem","16":"1rem","24":"1.5rem","32":"2rem","4":"0.25rem","8":"0.5rem"}},"pos":{"varName":"--animus-pos","slotClass":"animus-dyn-pos","property":"position","transformName":null,"transformFnSource":null,"scaleValues":{}},"position":{"varName":"--animus-position","slotClass":"animus-dyn-position","property":"position","transformName":null,"transformFnSource":null,"scaleValues":{}},"pr":{"varName":"--animus-pr","slotClass":"animus-dyn-pr","property":"paddingRight","transformName":null,"transformFnSource":null,"scaleValues":{"0":"0","12":"0.75rem","16":"1rem","24":"1.5rem","32":"2rem","4":"0.25rem","8":"0.5rem"}},"pt":{"varName":"--animus-pt","slotClass":"animus-dyn-pt","property":"paddingTop","transformName":null,"transformFnSource":null,"scaleValues":{"0":"0","12":"0.75rem","16":"1rem","24":"1.5rem","32":"2rem","4":"0.25rem","8":"0.5rem"}},"px":{"varName":"--animus-px","slotClass":"animus-dyn-px","property":"padding","properties":["paddingLeft","paddingRight"],"transformName":null,"transformFnSource":null,"scaleValues":{"0":"0","12":"0.75rem","16":"1rem","24":"1.5rem","32":"2rem","4":"0.25rem","8":"0.5rem"}},"py":{"varName":"--animus-py","slotClass":"animus-dyn-py","property":"padding","properties":["paddingTop","paddingBottom"],"transformName":null,"transformFnSource":null,"scaleValues":{"0":"0","12":"0.75rem","16":"1rem","24":"1.5rem","32":"2rem","4":"0.25rem","8":"0.5rem"}},"right":{"varName":"--animus-right","slotClass":"animus-dyn-right","property":"right","transformName":"size","transformFnSource":null,"scaleValues":{}},"rowGap":{"varName":"--animus-row-gap","slotClass":"animus-dyn-row-gap","property":"rowGap","transformName":null,"transformFnSource":null,"scaleValues":{"0":"0","12":"0.75rem","16":"1rem","24":"1.5rem","32":"2rem","4":"0.25rem","8":"0.5rem"}},"size":{"varName":"--animus-size","slotClass":"animus-dyn-size","property":"width","properties":["width","height"],"transformName":"size","transformFnSource":null,"scaleValues":{}},"top":{"varName":"--animus-top","slotClass":"animus-dyn-top","property":"top","transformName":"size","transformFnSource":null,"scaleValues":{}},"verticalAlign":{"varName":"--animus-vertical-align","slotClass":"animus-dyn-vertical-align","property":"verticalAlign","transformName":null,"transformFnSource":null,"scaleValues":{}},"w":{"varName":"--animus-w","slotClass":"animus-dyn-w","property":"width","transformName":"size","transformFnSource":null,"scaleValues":{}},"width":{"varName":"--animus-width","slotClass":"animus-dyn-width","property":"width","transformName":"size","transformFnSource":null,"scaleValues":{}},"zIndex":{"varName":"--animus-z-index","slotClass":"animus-dyn-z-index","property":"zIndex","transformName":null,"transformFnSource":null,"scaleValues":{}}},"component_fragments":{"../../packages/test-ds/src/components/Alert.tsx::Alert":{"base":" .animus-Alert-a385f997 {\n padding: 0.75rem;\n display: flex;\n align-items: flex-start;\n border-radius: 4px;\n font-size: 0.875rem;\n line-height: 1.5;\n }\n","variants":" .animus-Alert-a385f997--variant-filled {\n color: var(--color-background);\n }\n .animus-Alert-a385f997--variant-outline {\n border-width: 1px;\n border-style: solid;\n background-color: transparent;\n --current-bg: transparent;\n }\n .animus-Alert-a385f997--intent-info {\n background-color: var(--color-primary);\n --current-bg: var(--color-primary);\n }\n .animus-Alert-a385f997--intent-danger {\n background-color: var(--color-danger);\n --current-bg: var(--color-danger);\n }\n .animus-Alert-a385f997--intent-success {\n background-color: var(--color-secondary);\n --current-bg: var(--color-secondary);\n }\n","compounds":" .animus-Alert-a385f997--compound-0 {\n border-color: var(--color-primary);\n color: var(--color-primary);\n }\n .animus-Alert-a385f997--compound-1 {\n border-color: var(--color-danger);\n color: var(--color-danger);\n }\n .animus-Alert-a385f997--compound-2 {\n border-color: var(--color-secondary);\n color: var(--color-secondary);\n }\n"},"../../packages/test-ds/src/components/Badge.tsx::Badge":{"base":" .animus-Badge-99781d29 {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n display: inline-flex;\n align-items: center;\n border-radius: 9999px;\n font-size: 0.75rem;\n font-weight: 500;\n line-height: 1;\n }\n","variants":" .animus-Badge-99781d29--color-neutral {\n background-color: var(--color-surface);\n --current-bg: var(--color-surface);\n color: var(--color-text);\n }\n .animus-Badge-99781d29--color-danger {\n background-color: var(--color-danger);\n --current-bg: var(--color-danger);\n color: var(--color-background);\n }\n","states":" .animus-Badge-99781d29--disabled {\n opacity: 0.5;\n cursor: not-allowed;\n }\n .animus-Badge-99781d29--active {\n outline: 2px solid;\n outline-color: var(--color-primary);\n }\n"},"../../packages/test-ds/src/components/Card.tsx::Card":{"base":" .animus-Card-9aa7af5d {\n padding: 1rem;\n background-color: var(--color-surface);\n --current-bg: var(--color-surface);\n border-radius: 8px;\n color: var(--color-text);\n container-type: inline-size;\n container-name: card;\n }\n @container card (min-width: 400px) {\n .animus-Card-9aa7af5d {\n padding: 1.5rem;\n width: 50cqw;\n }\n }\n @media (prefers-reduced-motion: reduce) {\n .animus-Card-9aa7af5d {\n transition: none;\n }\n }\n @supports (display: grid) {\n .animus-Card-9aa7af5d {\n display: grid;\n font-size: 0.875rem;\n }\n }\n @supports (display: grid) {\n @media (min-width: 640px) {\n .animus-Card-9aa7af5d {\n font-size: 1rem;\n }\n }\n }\n @supports (display: grid) {\n .animus-Card-9aa7af5d:focus-visible {\n outline: 2px solid;\n }\n }\n @supports (display: grid) {\n @container card (min-width: 600px) {\n .animus-Card-9aa7af5d {\n gap: 2cqi;\n }\n }\n }\n"},"../../packages/test-ds/src/components/ContainerCard.tsx::ContainerCardBody":{"base":" .animus-ContainerCardBody-133c6ad9 {\n font-size: 0.875rem;\n line-height: 1.5;\n color: var(--color-text);\n }\n @container card (min-width: 400px) {\n .animus-ContainerCardBody-133c6ad9 {\n font-size: 1rem;\n }\n }\n"},"../../packages/test-ds/src/components/ContainerCard.tsx::ContainerCardMedia":{"base":" .animus-ContainerCardMedia-51db5d07 {\n display: block;\n width: 100%;\n min-height: 64px;\n border-radius: 4px;\n background: var(--current-bg);\n }\n @container card (min-width: 400px) {\n .animus-ContainerCardMedia-51db5d07 {\n min-height: 120px;\n width: 50cqw;\n }\n }\n"},"../../packages/test-ds/src/components/ContainerCard.tsx::ContainerCardRoot":{"base":" .animus-ContainerCardRoot-01c5b011 {\n gap: 0.5rem;\n padding: 1rem;\n display: flex;\n flex-direction: column;\n border-radius: 8px;\n background-color: var(--color-surface);\n --current-bg: var(--color-surface);\n color: var(--color-text);\n container-type: inline-size;\n container-name: card;\n }\n","variants":" .animus-ContainerCardRoot-01c5b011--size-lg {\n padding: 1.5rem;\n }\n"},"../../packages/test-ds/src/components/GroupItem.tsx::GroupItem":{"base":" .animus-GroupItem-32b2d32f {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n display: inline-flex;\n align-items: center;\n border-radius: 4px;\n background-color: var(--color-surface);\n --current-bg: var(--color-surface);\n color: var(--color-text);\n }\n [data-active=\"true\"] .animus-GroupItem-32b2d32f {\n background-color: var(--color-primary);\n --current-bg: var(--color-primary);\n color: var(--color-background);\n }\n .group:hover .animus-GroupItem-32b2d32f {\n opacity: 0.9;\n }\n [data-color-mode=\"dark\"] .animus-GroupItem-32b2d32f {\n color: var(--color-text-muted);\n }\n"},"src/Box.tsx::Box":{"base":" .animus-Box-399302cf {\n display: flex;\n position: relative;\n }\n"},"src/Button.tsx::Button":{"base":" .animus-Button-b3718a43 {\n border-radius: 4px;\n padding: 8px;\n background-color: var(--color-blue-500);\n }\n","variants":" .animus-Button-b3718a43--tone-quiet {\n background-color: var(--color-gray-700);\n }\n .animus-Button-b3718a43--tone-loud {\n font-weight: 700;\n background-color: var(--color-blue-700);\n }\n"}},"reverse_provenance":{},"components":{"../../packages/test-ds/src/components/Alert.tsx::Alert":{"file":"../../packages/test-ds/src/components/Alert.tsx","binding":"Alert","class_name":"animus-Alert-a385f997","extends_from":null,"terminal":"asElement","tag":"div","replacement":"createComponent('div', 'animus-Alert-a385f997', {\"variants\":{\"variant\":{\"options\":[\"filled\",\"outline\"]},\"intent\":{\"options\":[\"info\",\"danger\",\"success\"]}},\"compounds\":[{\"conditions\":{\"intent\":\"info\",\"variant\":\"outline\"},\"className\":\"animus-Alert-a385f997--compound-0\"},{\"conditions\":{\"intent\":\"danger\",\"variant\":\"outline\"},\"className\":\"animus-Alert-a385f997--compound-1\"},{\"conditions\":{\"intent\":\"success\",\"variant\":\"outline\"},\"className\":\"animus-Alert-a385f997--compound-2\"}]})","system_prop_names":[]},"../../packages/test-ds/src/components/Badge.tsx::Badge":{"file":"../../packages/test-ds/src/components/Badge.tsx","binding":"Badge","class_name":"animus-Badge-99781d29","extends_from":null,"terminal":"asElement","tag":"span","replacement":"createComponent('span', 'animus-Badge-99781d29', {\"variants\":{\"color\":{\"options\":[\"neutral\",\"danger\"]}},\"states\":[\"disabled\",\"active\"]})","system_prop_names":[]},"../../packages/test-ds/src/components/Button.tsx::Button":{"file":"../../packages/test-ds/src/components/Button.tsx","binding":"Button","class_name":"animus-Button-c63b6dcd","extends_from":null,"terminal":"asElement","tag":"button","replacement":"createComponent('button', 'animus-Button-c63b6dcd', {\"variants\":{\"variant\":{\"options\":[\"primary\",\"secondary\",\"ghost\"]}},\"systemPropNames\":[\"fontSize\",\"px\",\"py\"]}, systemPropMap, dynamicPropConfig)","system_prop_names":["fontSize","px","py"]},"../../packages/test-ds/src/components/Card.tsx::Card":{"file":"../../packages/test-ds/src/components/Card.tsx","binding":"Card","class_name":"animus-Card-9aa7af5d","extends_from":null,"terminal":"asElement","tag":"div","replacement":"createComponent('div', 'animus-Card-9aa7af5d', {\"systemPropNames\":[\"m\",\"mx\",\"my\"]}, systemPropMap, dynamicPropConfig)","system_prop_names":["m","mx","my"]},"../../packages/test-ds/src/components/ContainerCard.tsx::ContainerCardBody":{"file":"../../packages/test-ds/src/components/ContainerCard.tsx","binding":"ContainerCardBody","class_name":"animus-ContainerCardBody-133c6ad9","extends_from":null,"terminal":"asElement","tag":"div","replacement":"createComponent('div', 'animus-ContainerCardBody-133c6ad9', {})","system_prop_names":[]},"../../packages/test-ds/src/components/ContainerCard.tsx::ContainerCardMedia":{"file":"../../packages/test-ds/src/components/ContainerCard.tsx","binding":"ContainerCardMedia","class_name":"animus-ContainerCardMedia-51db5d07","extends_from":null,"terminal":"asElement","tag":"div","replacement":"createComponent('div', 'animus-ContainerCardMedia-51db5d07', {\"variants\":{\"size\":{\"options\":[\"md\",\"lg\"],\"default\":\"md\"}}})","system_prop_names":[]},"../../packages/test-ds/src/components/ContainerCard.tsx::ContainerCardRoot":{"file":"../../packages/test-ds/src/components/ContainerCard.tsx","binding":"ContainerCardRoot","class_name":"animus-ContainerCardRoot-01c5b011","extends_from":null,"terminal":"asElement","tag":"article","replacement":"createComponent('article', 'animus-ContainerCardRoot-01c5b011', {\"variants\":{\"size\":{\"options\":[\"md\",\"lg\"],\"default\":\"md\"}}})","system_prop_names":[]},"../../packages/test-ds/src/components/GroupItem.tsx::GroupItem":{"file":"../../packages/test-ds/src/components/GroupItem.tsx","binding":"GroupItem","class_name":"animus-GroupItem-32b2d32f","extends_from":null,"terminal":"asElement","tag":"span","replacement":"createComponent('span', 'animus-GroupItem-32b2d32f', {})","system_prop_names":[]},"src/Box.tsx::Box":{"file":"src/Box.tsx","binding":"Box","class_name":"animus-Box-399302cf","extends_from":null,"terminal":"asElement","tag":"div","replacement":"createComponent('div', 'animus-Box-399302cf', {\"systemPropNames\":[].concat(systemPropGroups.layout,systemPropGroups.positioning,systemPropGroups.space)}, systemPropMap, dynamicPropConfig)","system_prop_names":["alignContent","alignItems","alignSelf","area","bottom","columnGap","display","flex","flexBasis","flexDir","flexDirection","flexGrow","flexShrink","flexWrap","gap","gridArea","gridColumn","gridColumnEnd","gridColumnStart","gridRow","gridRowEnd","gridRowStart","h","height","inset","justifyContent","justifyItems","justifySelf","left","m","maxH","maxHeight","maxW","maxWidth","mb","minH","minHeight","minW","minWidth","ml","mr","mt","mx","my","opacity","order","overflow","overflowX","overflowY","p","pb","pl","pos","position","pr","pt","px","py","right","rowGap","size","top","verticalAlign","w","width","zIndex"]},"src/Button.tsx::Button":{"file":"src/Button.tsx","binding":"Button","class_name":"animus-Button-b3718a43","extends_from":null,"terminal":"asElement","tag":"button","replacement":"createComponent('button', 'animus-Button-b3718a43', {\"variants\":{\"tone\":{\"options\":[\"quiet\",\"loud\"]}}})","system_prop_names":[]}},"files":{"../../packages/test-ds/src/components/Alert.tsx":["../../packages/test-ds/src/components/Alert.tsx::Alert"],"../../packages/test-ds/src/components/Badge.tsx":["../../packages/test-ds/src/components/Badge.tsx::Badge"],"../../packages/test-ds/src/components/Button.tsx":["../../packages/test-ds/src/components/Button.tsx::Button"],"../../packages/test-ds/src/components/Card.tsx":["../../packages/test-ds/src/components/Card.tsx::Card"],"../../packages/test-ds/src/components/ContainerCard.tsx":["../../packages/test-ds/src/components/ContainerCard.tsx::ContainerCardBody","../../packages/test-ds/src/components/ContainerCard.tsx::ContainerCardMedia","../../packages/test-ds/src/components/ContainerCard.tsx::ContainerCardRoot"],"../../packages/test-ds/src/components/GroupItem.tsx":["../../packages/test-ds/src/components/GroupItem.tsx::GroupItem"],"src/Box.tsx":["src/Box.tsx::Box"],"src/Button.tsx":["src/Button.tsx::Button"]},"timing":{"parseCount":17}} \ No newline at end of file +{"fileFacts":{"../../packages/test-ds/src/components/Alert.tsx":{"path":"../../packages/test-ds/src/components/Alert.tsx","chains":[{"className":"animus-Alert-a385f997","descriptor":{"binding":"Alert","terminal":"asElement","tag":"div","stages":[{"method":"styles","argSpan":[67,200],"secondArgSpan":null},{"method":"variant","argSpan":[213,381],"secondArgSpan":null},{"method":"variant","argSpan":[394,541],"secondArgSpan":null},{"method":"compound","argSpan":[560,598],"secondArgSpan":[604,648]},{"method":"compound","argSpan":[670,710],"secondArgSpan":[716,758]},{"method":"compound","argSpan":[780,821],"secondArgSpan":[827,875]}],"extractable":true,"bailReason":null,"span":[54,899],"extendsFrom":null},"stages":[{"method":"styles","value":{"display":"flex","alignItems":"flex-start","p":12,"borderRadius":"4px","fontSize":14,"lineHeight":"1.5"},"secondValue":null,"skipped":[],"captured":[],"evalError":null},{"method":"variant","value":{"prop":"variant","defaultVariant":null,"base":null,"variants":{"filled":{"color":"background"},"outline":{"bg":"transparent","borderWidth":"1px","borderStyle":"solid"}}},"secondValue":null,"skipped":[],"captured":[],"evalError":null},{"method":"variant","value":{"prop":"intent","defaultVariant":null,"base":null,"variants":{"info":{"bg":"primary"},"danger":{"bg":"danger"},"success":{"bg":"secondary"}}},"secondValue":null,"skipped":[],"captured":[],"evalError":null},{"method":"compound","value":{"variant":"outline","intent":"info"},"secondValue":{"borderColor":"primary","color":"primary"},"skipped":[],"captured":[],"evalError":null},{"method":"compound","value":{"variant":"outline","intent":"danger"},"secondValue":{"borderColor":"danger","color":"danger"},"skipped":[],"captured":[],"evalError":null},{"method":"compound","value":{"variant":"outline","intent":"success"},"secondValue":{"borderColor":"secondary","color":"secondary"},"skipped":[],"captured":[],"evalError":null}],"fatalError":null}],"statics":{},"usage":[],"compose":[],"imports":[{"local":"ds","imported":"ds","source":"../system"}],"exports":[{"exported":"Alert","local":"Alert","source":null,"original":null}],"transforms":[],"parseDiagnostics":[]},"../../packages/test-ds/src/components/Badge.tsx":{"path":"../../packages/test-ds/src/components/Badge.tsx","chains":[{"className":"animus-Badge-99781d29","descriptor":{"binding":"Badge","terminal":"asElement","tag":"span","stages":[{"method":"styles","argSpan":[67,238],"secondArgSpan":null},{"method":"variant","argSpan":[251,400],"secondArgSpan":null},{"method":"states","argSpan":[412,537],"secondArgSpan":null}],"extractable":true,"bailReason":null,"span":[54,559],"extendsFrom":null},"stages":[{"method":"styles","value":{"display":"inline-flex","alignItems":"center","px":8,"py":4,"borderRadius":"9999px","fontSize":12,"fontWeight":"500","lineHeight":"1"},"secondValue":null,"skipped":[],"captured":[],"evalError":null},{"method":"variant","value":{"prop":"color","defaultVariant":null,"base":null,"variants":{"neutral":{"bg":"surface","color":"text"},"danger":{"bg":"danger","color":"background"}}},"secondValue":null,"skipped":[],"captured":[],"evalError":null},{"method":"states","value":{"disabled":{"opacity":"0.5","cursor":"not-allowed"},"active":{"outline":"2px solid","outlineColor":"primary"}},"secondValue":null,"skipped":[],"captured":[],"evalError":null}],"fatalError":null}],"statics":{},"usage":[],"compose":[],"imports":[{"local":"ds","imported":"ds","source":"../system"}],"exports":[{"exported":"Badge","local":"Badge","source":null,"original":null}],"transforms":[],"parseDiagnostics":[]},"../../packages/test-ds/src/components/Button.tsx":{"path":"../../packages/test-ds/src/components/Button.tsx","chains":[{"className":"animus-Button-c63b6dcd","descriptor":{"binding":"Button","terminal":"asElement","tag":"button","stages":[{"method":"styles","argSpan":[68,269],"secondArgSpan":null},{"method":"variant","argSpan":[282,496],"secondArgSpan":null},{"method":"system","argSpan":[508,546],"secondArgSpan":null}],"extractable":true,"bailReason":null,"span":[55,570],"extendsFrom":null},"stages":[{"method":"styles","value":{"display":"inline-flex","alignItems":"center","justifyContent":"center","borderRadius":"4px","fontWeight":"600","cursor":"pointer","border":"none","lineHeight":"1"},"secondValue":null,"skipped":[],"captured":[],"evalError":null},{"method":"variant","value":{"prop":"variant","defaultVariant":null,"base":null,"variants":{"primary":{"bg":"primary","color":"background"},"secondary":{"bg":"secondary","color":"background"},"ghost":{"bg":"transparent","color":"text"}}},"secondValue":null,"skipped":[],"captured":[],"evalError":null},{"method":"system","value":{"px":true,"py":true,"fontSize":true},"secondValue":null,"skipped":[],"captured":[],"evalError":null}],"fatalError":null}],"statics":{},"usage":[],"compose":[],"imports":[{"local":"ds","imported":"ds","source":"../system"}],"exports":[{"exported":"Button","local":"Button","source":null,"original":null}],"transforms":[],"parseDiagnostics":[]},"../../packages/test-ds/src/components/Card.tsx":{"path":"../../packages/test-ds/src/components/Card.tsx","chains":[{"className":"animus-Card-9aa7af5d","descriptor":{"binding":"Card","terminal":"asElement","tag":"div","stages":[{"method":"styles","argSpan":[573,2126],"secondArgSpan":null},{"method":"system","argSpan":[2138,2169],"secondArgSpan":null}],"extractable":true,"bailReason":null,"span":[560,2190],"extendsFrom":null},"stages":[{"method":"styles","value":{"bg":"surface","p":16,"borderRadius":"8px","color":"text","containerType":"inline-size","containerName":"card","@container card (min-width: 400px)":{"p":24,"width":"50cqw"},"@media (prefers-reduced-motion: reduce)":{"transition":"none"},"@supports (display: grid)":{"display":"grid","&:focus-visible":{"outline":"2px solid"},"@container card (min-width: 600px)":{"gap":"2cqi"},"fontSize":{"_":14,"sm":16}}},"secondValue":null,"skipped":[],"captured":[],"evalError":null},{"method":"system","value":{"m":true,"mx":true,"my":true},"secondValue":null,"skipped":[],"captured":[],"evalError":null}],"fatalError":null}],"statics":{},"usage":[],"compose":[],"imports":[{"local":"ds","imported":"ds","source":"../system"}],"exports":[{"exported":"Card","local":"Card","source":null,"original":null}],"transforms":[],"parseDiagnostics":[]},"../../packages/test-ds/src/components/ContainerCard.tsx":{"path":"../../packages/test-ds/src/components/ContainerCard.tsx","chains":[{"className":"animus-ContainerCardRoot-01c5b011","descriptor":{"binding":"ContainerCardRoot","terminal":"asElement","tag":"article","stages":[{"method":"styles","argSpan":[1089,1435],"secondArgSpan":null},{"method":"variant","argSpan":[1448,1555],"secondArgSpan":null}],"extractable":true,"bailReason":null,"span":[1076,1580],"extendsFrom":null},"stages":[{"method":"styles","value":{"display":"flex","flexDirection":"column","gap":8,"p":16,"borderRadius":"8px","bg":"surface","color":"text","containerType":"inline-size","containerName":"card"},"secondValue":null,"skipped":[],"captured":[],"evalError":null},{"method":"variant","value":{"prop":"size","defaultVariant":"md","base":null,"variants":{"md":{},"lg":{"p":24}}},"secondValue":null,"skipped":[],"captured":[],"evalError":null}],"fatalError":null},{"className":"animus-ContainerCardMedia-51db5d07","descriptor":{"binding":"ContainerCardMedia","terminal":"asElement","tag":"div","stages":[{"method":"styles","argSpan":[1623,2194],"secondArgSpan":null},{"method":"variant","argSpan":[2207,2307],"secondArgSpan":null}],"extractable":true,"bailReason":null,"span":[1610,2328],"extendsFrom":null},"stages":[{"method":"styles","value":{"display":"block","width":"100%","minHeight":"64px","borderRadius":"4px","background":"var(--current-bg)","@container card (min-width: 400px)":{"minHeight":"120px","width":"50cqw"}},"secondValue":null,"skipped":[],"captured":[],"evalError":null},{"method":"variant","value":{"prop":"size","defaultVariant":"md","base":null,"variants":{"md":{},"lg":{}}},"secondValue":null,"skipped":[],"captured":[],"evalError":null}],"fatalError":null},{"className":"animus-ContainerCardBody-133c6ad9","descriptor":{"binding":"ContainerCardBody","terminal":"asElement","tag":"div","stages":[{"method":"styles","argSpan":[2370,2636],"secondArgSpan":null}],"extractable":true,"bailReason":null,"span":[2357,2657],"extendsFrom":null},"stages":[{"method":"styles","value":{"fontSize":14,"lineHeight":"1.5","color":"text","@container card (min-width: 400px)":{"fontSize":16}},"secondValue":null,"skipped":[],"captured":[],"evalError":null}],"fatalError":null}],"statics":{},"usage":[],"compose":[{"family_binding":"ContainerCard","root_binding":"ContainerCardRoot","slots":[["Root","ContainerCardRoot"],["Media","ContainerCardMedia"],["Body","ContainerCardBody"]],"shared_keys":["size"],"context":false,"span":[2689,2849],"name":"ContainerCard"}],"imports":[{"local":"compose","imported":"compose","source":"@animus-ui/system"},{"local":"ds","imported":"ds","source":"../system"}],"exports":[{"exported":"ContainerCard","local":"ContainerCard","source":null,"original":null}],"transforms":[],"parseDiagnostics":[]},"../../packages/test-ds/src/components/GroupItem.tsx":{"path":"../../packages/test-ds/src/components/GroupItem.tsx","chains":[{"className":"animus-GroupItem-32b2d32f","descriptor":{"binding":"GroupItem","terminal":"asElement","tag":"span","stages":[{"method":"styles","argSpan":[844,1148],"secondArgSpan":null}],"extractable":true,"bailReason":null,"span":[831,1170],"extendsFrom":null},"stages":[{"method":"styles","value":{"display":"inline-flex","alignItems":"center","px":8,"py":4,"borderRadius":"4px","bg":"surface","color":"text","[data-active=\"true\"] &":{"bg":"primary","color":"background"},"_groupHover":{"opacity":"0.9"},"_dark":{"color":"text.muted"}},"secondValue":null,"skipped":[],"captured":[],"evalError":null}],"fatalError":null}],"statics":{},"usage":[],"compose":[],"imports":[{"local":"ds","imported":"ds","source":"../system"}],"exports":[{"exported":"GroupItem","local":"GroupItem","source":null,"original":null}],"transforms":[],"parseDiagnostics":[]},"../../packages/test-ds/src/definition.ts":{"path":"../../packages/test-ds/src/definition.ts","chains":[],"statics":{},"usage":[],"compose":[],"imports":[],"exports":[{"exported":"system","local":null,"source":"./system","original":"ds"},{"exported":"theme","local":null,"source":"./theme","original":"referenceTokens"}],"transforms":[],"parseDiagnostics":[]},"../../packages/test-ds/src/dev-types.ts":{"path":"../../packages/test-ds/src/dev-types.ts","chains":[],"statics":{},"usage":[],"compose":[],"imports":[{"local":"referenceTokens","imported":"referenceTokens","source":"./theme"}],"exports":[],"transforms":[],"parseDiagnostics":[]},"../../packages/test-ds/src/index.ts":{"path":"../../packages/test-ds/src/index.ts","chains":[],"statics":{"kitSizes":{"sm":{"fontSize":14,"px":8,"py":4},"md":{"fontSize":16,"px":16,"py":8},"lg":{"fontSize":20,"px":24,"py":12}}},"usage":[],"compose":[],"imports":[],"exports":[{"exported":"Alert","local":null,"source":"./components/Alert","original":"Alert"},{"exported":"Badge","local":null,"source":"./components/Badge","original":"Badge"},{"exported":"Button","local":null,"source":"./components/Button","original":"Button"},{"exported":"Card","local":null,"source":"./components/Card","original":"Card"},{"exported":"ContainerCard","local":null,"source":"./components/ContainerCard","original":"ContainerCard"},{"exported":"GroupItem","local":null,"source":"./components/GroupItem","original":"GroupItem"},{"exported":"ds","local":null,"source":"./system","original":"ds"},{"exported":"referenceTokens","local":null,"source":"./theme","original":"referenceTokens"},{"exported":"kitSizes","local":"kitSizes","source":null,"original":null},{"exported":"kitMotion","local":null,"source":"./system","original":"kitMotion"}],"transforms":[],"parseDiagnostics":[]},"../../packages/test-ds/src/system.ts":{"path":"../../packages/test-ds/src/system.ts","chains":[],"statics":{"kitMotion":{"pulse":"animus-kf-muo7kp"}},"usage":[],"compose":[],"imports":[{"local":"createSystem","imported":"createSystem","source":"@animus-ui/system"},{"local":"border","imported":"border","source":"@animus-ui/system/groups"},{"local":"color","imported":"color","source":"@animus-ui/system/groups"},{"local":"flex","imported":"flex","source":"@animus-ui/system/groups"},{"local":"layout","imported":"layout","source":"@animus-ui/system/groups"},{"local":"positioning","imported":"positioning","source":"@animus-ui/system/groups"},{"local":"space","imported":"space","source":"@animus-ui/system/groups"},{"local":"typography","imported":"typography","source":"@animus-ui/system/groups"}],"exports":[{"exported":"kitMotion","local":"kitMotion","source":null,"original":null},{"exported":"ds","local":"ds","source":null,"original":null}],"transforms":[],"parseDiagnostics":[]},"../../packages/test-ds/src/theme.ts":{"path":"../../packages/test-ds/src/theme.ts","chains":[],"statics":{},"usage":[],"compose":[],"imports":[{"local":"createTheme","imported":"createTheme","source":"@animus-ui/system"}],"exports":[{"exported":"referenceTokens","local":"referenceTokens","source":null,"original":null}],"transforms":[],"parseDiagnostics":[]},"src/Box.tsx":{"path":"src/Box.tsx","chains":[{"className":"animus-Box-399302cf","descriptor":{"binding":"Box","terminal":"asElement","tag":"div","stages":[{"method":"styles","argSpan":[60,112],"secondArgSpan":null},{"method":"system","argSpan":[124,172],"secondArgSpan":null}],"extractable":true,"bailReason":null,"span":[47,193],"extendsFrom":null},"stages":[{"method":"styles","value":{"display":"flex","position":"relative"},"secondValue":null,"skipped":[],"captured":[],"evalError":null},{"method":"system","value":{"space":true,"layout":true,"positioning":true},"secondValue":null,"skipped":[],"captured":[],"evalError":null}],"fatalError":null}],"statics":{},"usage":[],"compose":[],"imports":[{"local":"ds","imported":"ds","source":"./ds"}],"exports":[{"exported":"Box","local":"Box","source":null,"original":null}],"transforms":[],"parseDiagnostics":[]},"src/Button.tsx":{"path":"src/Button.tsx","chains":[{"className":"animus-Button-b3718a43","descriptor":{"binding":"Button","terminal":"asElement","tag":"button","stages":[{"method":"styles","argSpan":[63,146],"secondArgSpan":null},{"method":"variant","argSpan":[159,313],"secondArgSpan":null}],"extractable":true,"bailReason":null,"span":[50,337],"extendsFrom":null},"stages":[{"method":"styles","value":{"padding":"8px","borderRadius":"4px","backgroundColor":"blue.500"},"secondValue":null,"skipped":[],"captured":[],"evalError":null},{"method":"variant","value":{"prop":"tone","defaultVariant":null,"base":null,"variants":{"quiet":{"backgroundColor":"gray.700"},"loud":{"backgroundColor":"blue.700","fontWeight":700}}},"secondValue":null,"skipped":[],"captured":[],"evalError":null}],"fatalError":null}],"statics":{},"usage":[{"element":{"tag":{"ident":"Button"},"attrs":[{"name":"tone","staticValue":"loud","dynamic":false,"dynamicKind":null,"dynamicSpan":null,"skip":false,"variantClass":"loud"}]}}],"compose":[],"imports":[{"local":"ds","imported":"ds","source":"./ds"}],"exports":[{"exported":"Button","local":"Button","source":null,"original":null},{"exported":"App","local":"App","source":null,"original":null}],"transforms":[],"parseDiagnostics":[]},"src/Frame.tsx":{"path":"src/Frame.tsx","chains":[],"statics":{},"usage":[{"element":{"tag":{"ident":"section"},"attrs":[{"name":"className","staticValue":"frame","dynamic":false,"dynamicKind":null,"dynamicSpan":null,"skip":false,"variantClass":"frame"}]}}],"compose":[],"imports":[{"local":"ReactNode","imported":"ReactNode","source":"react"}],"exports":[{"exported":"Frame","local":"Frame","source":null,"original":null}],"transforms":[],"parseDiagnostics":[]},"src/Group.tsx":{"path":"src/Group.tsx","chains":[],"statics":{},"usage":[{"element":{"tag":{"ident":"div"},"attrs":[]}},{"element":{"tag":{"ident":"div"},"attrs":[{"name":"className","staticValue":"group","dynamic":false,"dynamicKind":null,"dynamicSpan":null,"skip":false,"variantClass":"group"},{"name":"data-active","staticValue":"true","dynamic":false,"dynamicKind":null,"dynamicSpan":null,"skip":false,"variantClass":"true"}]}},{"element":{"tag":{"ident":"GroupItem"},"attrs":[]}},{"element":{"tag":{"ident":"div"},"attrs":[{"name":"data-active","staticValue":"false","dynamic":false,"dynamicKind":null,"dynamicSpan":null,"skip":false,"variantClass":"false"}]}},{"element":{"tag":{"ident":"GroupItem"},"attrs":[]}},{"element":{"tag":{"ident":"Frame"},"attrs":[]}},{"element":{"tag":{"ident":"GroupItem"},"attrs":[]}},{"element":{"tag":{"ident":"div"},"attrs":[{"name":"data-active","staticValue":null,"dynamic":true,"dynamicKind":"conditional","dynamicSpan":{"start":1616,"end":1641},"skip":false,"variantClass":"__dynamic__"}]}},{"element":{"tag":{"ident":"GroupItem"},"attrs":[]}}],"compose":[],"imports":[{"local":"GroupItem","imported":"GroupItem","source":"@animus-ui/test-ds"},{"local":"Frame","imported":"Frame","source":"./Frame"}],"exports":[{"exported":"GroupDemo","local":"GroupDemo","source":null,"original":null}],"transforms":[],"parseDiagnostics":[]},"src/ds.ts":{"path":"src/ds.ts","chains":[],"statics":{"animations":{"fadeIn":"animus-kf-1x7guim","pulse":"animus-kf-1yqv0zl"}},"usage":[],"compose":[],"imports":[{"local":"asset","imported":"asset","source":"@animus-ui/system"},{"local":"createSystem","imported":"createSystem","source":"@animus-ui/system"},{"local":"createTheme","imported":"createTheme","source":"@animus-ui/system"},{"local":"testDs","imported":"system","source":"@animus-ui/test-ds/definition"}],"exports":[{"exported":"theme","local":"theme","source":null,"original":null},{"exported":"globalStyles","local":"globalStyles","source":null,"original":null},{"exported":"animations","local":"animations","source":null,"original":null},{"exported":"ds","local":"ds","source":null,"original":null}],"transforms":[],"parseDiagnostics":[]},"src/entry.tsx":{"path":"src/entry.tsx","chains":[],"statics":{},"usage":[{"element":{"tag":{"ident":"div"},"attrs":[]}},{"element":{"tag":{"ident":"ButtonApp"},"attrs":[]}},{"element":{"tag":{"ident":"Badge"},"attrs":[{"name":"color","staticValue":"danger","dynamic":false,"dynamicKind":null,"dynamicSpan":null,"skip":false,"variantClass":"danger"}]}}],"compose":[],"imports":[{"local":"Badge","imported":"Badge","source":"@animus-ui/test-ds"},{"local":"ButtonApp","imported":"App","source":"./Button"},{"local":"Button","imported":"Button","source":"./Button"}],"exports":[{"exported":"Badge","local":"Badge","source":null,"original":null},{"exported":"Button","local":"Button","source":null,"original":null},{"exported":"App","local":"App","source":null,"original":null}],"transforms":[],"parseDiagnostics":[]}},"crossFile":{"componentNames":["Alert","Badge","Box","Button","Card","ContainerCardBody","ContainerCardMedia","ContainerCardRoot","GroupItem"],"classResolvers":[],"memberBindings":{"ContainerCard.Body":"ContainerCardBody","ContainerCard.Media":"ContainerCardMedia","ContainerCard.Root":"ContainerCardRoot"},"renderedComponents":["Badge","Button","ContainerCardBody","ContainerCardMedia","ContainerCardRoot","GroupItem"],"variantOptions":{"Alert":{"intent":["danger","info","success"],"variant":["filled","outline"]},"Badge":{"color":["danger","neutral"]},"Button":{"tone":["loud","quiet"],"variant":["ghost","primary","secondary"]},"ContainerCardMedia":{"size":["lg","md"]},"ContainerCardRoot":{"size":["lg","md"]}},"stateNames":{"Badge":["active","disabled"]}},"parseCount":17,"usageResidue":[],"css":"@layer anm-global, anm-base, anm-variants, anm-compounds, anm-states, anm-system, anm-custom;\n\n@layer anm-base {\n .animus-Alert-a385f997 {\n padding: 0.75rem;\n display: flex;\n align-items: flex-start;\n border-radius: 4px;\n font-size: 0.875rem;\n line-height: 1.5;\n }\n .animus-Badge-99781d29 {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n display: inline-flex;\n align-items: center;\n border-radius: 9999px;\n font-size: 0.75rem;\n font-weight: 500;\n line-height: 1;\n }\n .animus-Card-9aa7af5d {\n padding: 1rem;\n background-color: var(--color-surface);\n --current-bg: var(--color-surface);\n border-radius: 8px;\n color: var(--color-text);\n container-type: inline-size;\n container-name: card;\n }\n @container card (min-width: 400px) {\n .animus-Card-9aa7af5d {\n padding: 1.5rem;\n width: 50cqw;\n }\n }\n @media (prefers-reduced-motion: reduce) {\n .animus-Card-9aa7af5d {\n transition: none;\n }\n }\n @supports (display: grid) {\n .animus-Card-9aa7af5d {\n display: grid;\n font-size: 0.875rem;\n }\n }\n @supports (display: grid) {\n @media (min-width: 640px) {\n .animus-Card-9aa7af5d {\n font-size: 1rem;\n }\n }\n }\n @supports (display: grid) {\n .animus-Card-9aa7af5d:focus-visible {\n outline: 2px solid;\n }\n }\n @supports (display: grid) {\n @container card (min-width: 600px) {\n .animus-Card-9aa7af5d {\n gap: 2cqi;\n }\n }\n }\n .animus-ContainerCardBody-133c6ad9 {\n font-size: 0.875rem;\n line-height: 1.5;\n color: var(--color-text);\n }\n @container card (min-width: 400px) {\n .animus-ContainerCardBody-133c6ad9 {\n font-size: 1rem;\n }\n }\n .animus-ContainerCardMedia-51db5d07 {\n display: block;\n width: 100%;\n min-height: 64px;\n border-radius: 4px;\n background: var(--current-bg);\n }\n @container card (min-width: 400px) {\n .animus-ContainerCardMedia-51db5d07 {\n min-height: 120px;\n width: 50cqw;\n }\n }\n .animus-ContainerCardRoot-01c5b011 {\n gap: 0.5rem;\n padding: 1rem;\n display: flex;\n flex-direction: column;\n border-radius: 8px;\n background-color: var(--color-surface);\n --current-bg: var(--color-surface);\n color: var(--color-text);\n container-type: inline-size;\n container-name: card;\n }\n .animus-GroupItem-32b2d32f {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n display: inline-flex;\n align-items: center;\n border-radius: 4px;\n background-color: var(--color-surface);\n --current-bg: var(--color-surface);\n color: var(--color-text);\n }\n [data-active=\"true\"] .animus-GroupItem-32b2d32f {\n background-color: var(--color-primary);\n --current-bg: var(--color-primary);\n color: var(--color-background);\n }\n .group:hover .animus-GroupItem-32b2d32f {\n opacity: 0.9;\n }\n [data-color-mode=\"dark\"] .animus-GroupItem-32b2d32f {\n color: var(--color-text-muted);\n }\n .animus-Box-399302cf {\n display: flex;\n position: relative;\n }\n .animus-Button-c63b6dcd {\n border: none;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border-radius: 4px;\n font-weight: 600;\n line-height: 1;\n cursor: pointer;\n }\n .animus-Button-b3718a43 {\n border-radius: 4px;\n padding: 8px;\n background-color: var(--color-blue-500);\n }\n}\n\n@layer anm-variants {\n @layer standalone, composed;\n @layer standalone {\n\n .animus-Alert-a385f997--variant-filled {\n color: var(--color-background);\n }\n .animus-Alert-a385f997--variant-outline {\n border-width: 1px;\n border-style: solid;\n background-color: transparent;\n --current-bg: transparent;\n }\n .animus-Alert-a385f997--intent-info {\n background-color: var(--color-primary);\n --current-bg: var(--color-primary);\n }\n .animus-Alert-a385f997--intent-danger {\n background-color: var(--color-danger);\n --current-bg: var(--color-danger);\n }\n .animus-Alert-a385f997--intent-success {\n background-color: var(--color-secondary);\n --current-bg: var(--color-secondary);\n }\n .animus-Badge-99781d29--color-neutral {\n background-color: var(--color-surface);\n --current-bg: var(--color-surface);\n color: var(--color-text);\n }\n .animus-Badge-99781d29--color-danger {\n background-color: var(--color-danger);\n --current-bg: var(--color-danger);\n color: var(--color-background);\n }\n .animus-ContainerCardRoot-01c5b011--size-lg {\n padding: 1.5rem;\n }\n .animus-Button-c63b6dcd--variant-primary {\n background-color: var(--color-primary);\n --current-bg: var(--color-primary);\n color: var(--color-background);\n }\n .animus-Button-c63b6dcd--variant-secondary {\n background-color: var(--color-secondary);\n --current-bg: var(--color-secondary);\n color: var(--color-background);\n }\n .animus-Button-c63b6dcd--variant-ghost {\n background-color: transparent;\n --current-bg: transparent;\n color: var(--color-text);\n }\n .animus-Button-b3718a43--tone-quiet {\n background-color: var(--color-gray-700);\n }\n .animus-Button-b3718a43--tone-loud {\n font-weight: 700;\n background-color: var(--color-blue-700);\n }\n }\n @layer composed {\n }\n}\n\n@layer anm-compounds {\n .animus-Alert-a385f997--compound-0 {\n border-color: var(--color-primary);\n color: var(--color-primary);\n }\n .animus-Alert-a385f997--compound-1 {\n border-color: var(--color-danger);\n color: var(--color-danger);\n }\n .animus-Alert-a385f997--compound-2 {\n border-color: var(--color-secondary);\n color: var(--color-secondary);\n }\n}\n\n@layer anm-states {\n .animus-Badge-99781d29--disabled {\n opacity: 0.5;\n cursor: not-allowed;\n }\n .animus-Badge-99781d29--active {\n outline: 2px solid;\n outline-color: var(--color-primary);\n }\n}\n\n@layer anm-system {\n .animus-dyn-flex {\n flex: var(--animus-flex);\n }\n @media (min-width: 640px) {\n .animus-dyn-flex-sm {\n flex: var(--animus-flex-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-flex-md {\n flex: var(--animus-flex-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-flex-lg {\n flex: var(--animus-flex-lg);\n }\n }\n .animus-dyn-m {\n margin: var(--animus-m);\n }\n @media (min-width: 640px) {\n .animus-dyn-m-sm {\n margin: var(--animus-m-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-m-md {\n margin: var(--animus-m-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-m-lg {\n margin: var(--animus-m-lg);\n }\n }\n .animus-dyn-p {\n padding: var(--animus-p);\n }\n @media (min-width: 640px) {\n .animus-dyn-p-sm {\n padding: var(--animus-p-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-p-md {\n padding: var(--animus-p-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-p-lg {\n padding: var(--animus-p-lg);\n }\n }\n .animus-dyn-gap {\n gap: var(--animus-gap);\n }\n @media (min-width: 640px) {\n .animus-dyn-gap-sm {\n gap: var(--animus-gap-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-gap-md {\n gap: var(--animus-gap-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-gap-lg {\n gap: var(--animus-gap-lg);\n }\n }\n .animus-dyn-area {\n grid-area: var(--animus-area);\n }\n .animus-dyn-grid-area {\n grid-area: var(--animus-grid-area);\n }\n @media (min-width: 640px) {\n .animus-dyn-area-sm {\n grid-area: var(--animus-area-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-grid-area-sm {\n grid-area: var(--animus-grid-area-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-area-md {\n grid-area: var(--animus-area-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-grid-area-md {\n grid-area: var(--animus-grid-area-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-area-lg {\n grid-area: var(--animus-area-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-grid-area-lg {\n grid-area: var(--animus-grid-area-lg);\n }\n }\n .animus-dyn-grid-column {\n grid-column: var(--animus-grid-column);\n }\n @media (min-width: 640px) {\n .animus-dyn-grid-column-sm {\n grid-column: var(--animus-grid-column-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-grid-column-md {\n grid-column: var(--animus-grid-column-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-grid-column-lg {\n grid-column: var(--animus-grid-column-lg);\n }\n }\n .animus-dyn-grid-row {\n grid-row: var(--animus-grid-row);\n }\n @media (min-width: 640px) {\n .animus-dyn-grid-row-sm {\n grid-row: var(--animus-grid-row-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-grid-row-md {\n grid-row: var(--animus-grid-row-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-grid-row-lg {\n grid-row: var(--animus-grid-row-lg);\n }\n }\n .animus-dyn-overflow {\n overflow: var(--animus-overflow);\n }\n @media (min-width: 640px) {\n .animus-dyn-overflow-sm {\n overflow: var(--animus-overflow-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-overflow-md {\n overflow: var(--animus-overflow-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-overflow-lg {\n overflow: var(--animus-overflow-lg);\n }\n }\n .animus-dyn-align-content {\n align-content: var(--animus-align-content);\n }\n @media (min-width: 640px) {\n .animus-dyn-align-content-sm {\n align-content: var(--animus-align-content-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-align-content-md {\n align-content: var(--animus-align-content-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-align-content-lg {\n align-content: var(--animus-align-content-lg);\n }\n }\n .animus-dyn-align-items {\n align-items: var(--animus-align-items);\n }\n @media (min-width: 640px) {\n .animus-dyn-align-items-sm {\n align-items: var(--animus-align-items-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-align-items-md {\n align-items: var(--animus-align-items-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-align-items-lg {\n align-items: var(--animus-align-items-lg);\n }\n }\n .animus-dyn-align-self {\n align-self: var(--animus-align-self);\n }\n @media (min-width: 640px) {\n .animus-dyn-align-self-sm {\n align-self: var(--animus-align-self-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-align-self-md {\n align-self: var(--animus-align-self-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-align-self-lg {\n align-self: var(--animus-align-self-lg);\n }\n }\n .animus-dyn-bottom {\n bottom: var(--animus-bottom);\n }\n @media (min-width: 640px) {\n .animus-dyn-bottom-sm {\n bottom: var(--animus-bottom-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-bottom-md {\n bottom: var(--animus-bottom-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-bottom-lg {\n bottom: var(--animus-bottom-lg);\n }\n }\n .animus-dyn-column-gap {\n column-gap: var(--animus-column-gap);\n }\n @media (min-width: 640px) {\n .animus-dyn-column-gap-sm {\n column-gap: var(--animus-column-gap-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-column-gap-md {\n column-gap: var(--animus-column-gap-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-column-gap-lg {\n column-gap: var(--animus-column-gap-lg);\n }\n }\n .animus-dyn-display {\n display: var(--animus-display);\n }\n @media (min-width: 640px) {\n .animus-dyn-display-sm {\n display: var(--animus-display-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-display-md {\n display: var(--animus-display-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-display-lg {\n display: var(--animus-display-lg);\n }\n }\n .animus-dyn-flex-basis {\n flex-basis: var(--animus-flex-basis);\n }\n @media (min-width: 640px) {\n .animus-dyn-flex-basis-sm {\n flex-basis: var(--animus-flex-basis-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-flex-basis-md {\n flex-basis: var(--animus-flex-basis-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-flex-basis-lg {\n flex-basis: var(--animus-flex-basis-lg);\n }\n }\n .animus-dyn-flex-dir {\n flex-direction: var(--animus-flex-dir);\n }\n .animus-dyn-flex-direction {\n flex-direction: var(--animus-flex-direction);\n }\n @media (min-width: 640px) {\n .animus-dyn-flex-dir-sm {\n flex-direction: var(--animus-flex-dir-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-flex-direction-sm {\n flex-direction: var(--animus-flex-direction-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-flex-dir-md {\n flex-direction: var(--animus-flex-dir-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-flex-direction-md {\n flex-direction: var(--animus-flex-direction-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-flex-dir-lg {\n flex-direction: var(--animus-flex-dir-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-flex-direction-lg {\n flex-direction: var(--animus-flex-direction-lg);\n }\n }\n .animus-dyn-flex-grow {\n flex-grow: var(--animus-flex-grow);\n }\n @media (min-width: 640px) {\n .animus-dyn-flex-grow-sm {\n flex-grow: var(--animus-flex-grow-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-flex-grow-md {\n flex-grow: var(--animus-flex-grow-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-flex-grow-lg {\n flex-grow: var(--animus-flex-grow-lg);\n }\n }\n .animus-dyn-flex-shrink {\n flex-shrink: var(--animus-flex-shrink);\n }\n @media (min-width: 640px) {\n .animus-dyn-flex-shrink-sm {\n flex-shrink: var(--animus-flex-shrink-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-flex-shrink-md {\n flex-shrink: var(--animus-flex-shrink-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-flex-shrink-lg {\n flex-shrink: var(--animus-flex-shrink-lg);\n }\n }\n .animus-dyn-flex-wrap {\n flex-wrap: var(--animus-flex-wrap);\n }\n @media (min-width: 640px) {\n .animus-dyn-flex-wrap-sm {\n flex-wrap: var(--animus-flex-wrap-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-flex-wrap-md {\n flex-wrap: var(--animus-flex-wrap-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-flex-wrap-lg {\n flex-wrap: var(--animus-flex-wrap-lg);\n }\n }\n .animus-dyn-font-size {\n font-size: var(--animus-font-size);\n }\n @media (min-width: 640px) {\n .animus-dyn-font-size-sm {\n font-size: var(--animus-font-size-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-font-size-md {\n font-size: var(--animus-font-size-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-font-size-lg {\n font-size: var(--animus-font-size-lg);\n }\n }\n .animus-dyn-grid-column-end {\n grid-column-end: var(--animus-grid-column-end);\n }\n @media (min-width: 640px) {\n .animus-dyn-grid-column-end-sm {\n grid-column-end: var(--animus-grid-column-end-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-grid-column-end-md {\n grid-column-end: var(--animus-grid-column-end-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-grid-column-end-lg {\n grid-column-end: var(--animus-grid-column-end-lg);\n }\n }\n .animus-dyn-grid-column-start {\n grid-column-start: var(--animus-grid-column-start);\n }\n @media (min-width: 640px) {\n .animus-dyn-grid-column-start-sm {\n grid-column-start: var(--animus-grid-column-start-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-grid-column-start-md {\n grid-column-start: var(--animus-grid-column-start-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-grid-column-start-lg {\n grid-column-start: var(--animus-grid-column-start-lg);\n }\n }\n .animus-dyn-grid-row-end {\n grid-row-end: var(--animus-grid-row-end);\n }\n @media (min-width: 640px) {\n .animus-dyn-grid-row-end-sm {\n grid-row-end: var(--animus-grid-row-end-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-grid-row-end-md {\n grid-row-end: var(--animus-grid-row-end-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-grid-row-end-lg {\n grid-row-end: var(--animus-grid-row-end-lg);\n }\n }\n .animus-dyn-grid-row-start {\n grid-row-start: var(--animus-grid-row-start);\n }\n @media (min-width: 640px) {\n .animus-dyn-grid-row-start-sm {\n grid-row-start: var(--animus-grid-row-start-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-grid-row-start-md {\n grid-row-start: var(--animus-grid-row-start-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-grid-row-start-lg {\n grid-row-start: var(--animus-grid-row-start-lg);\n }\n }\n .animus-dyn-h {\n height: var(--animus-h);\n }\n .animus-dyn-height {\n height: var(--animus-height);\n }\n @media (min-width: 640px) {\n .animus-dyn-h-sm {\n height: var(--animus-h-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-height-sm {\n height: var(--animus-height-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-h-md {\n height: var(--animus-h-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-height-md {\n height: var(--animus-height-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-h-lg {\n height: var(--animus-h-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-height-lg {\n height: var(--animus-height-lg);\n }\n }\n .animus-dyn-justify-content {\n justify-content: var(--animus-justify-content);\n }\n @media (min-width: 640px) {\n .animus-dyn-justify-content-sm {\n justify-content: var(--animus-justify-content-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-justify-content-md {\n justify-content: var(--animus-justify-content-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-justify-content-lg {\n justify-content: var(--animus-justify-content-lg);\n }\n }\n .animus-dyn-justify-items {\n justify-items: var(--animus-justify-items);\n }\n @media (min-width: 640px) {\n .animus-dyn-justify-items-sm {\n justify-items: var(--animus-justify-items-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-justify-items-md {\n justify-items: var(--animus-justify-items-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-justify-items-lg {\n justify-items: var(--animus-justify-items-lg);\n }\n }\n .animus-dyn-justify-self {\n justify-self: var(--animus-justify-self);\n }\n @media (min-width: 640px) {\n .animus-dyn-justify-self-sm {\n justify-self: var(--animus-justify-self-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-justify-self-md {\n justify-self: var(--animus-justify-self-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-justify-self-lg {\n justify-self: var(--animus-justify-self-lg);\n }\n }\n .animus-dyn-left {\n left: var(--animus-left);\n }\n @media (min-width: 640px) {\n .animus-dyn-left-sm {\n left: var(--animus-left-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-left-md {\n left: var(--animus-left-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-left-lg {\n left: var(--animus-left-lg);\n }\n }\n .animus-dyn-mb {\n margin-bottom: var(--animus-mb);\n }\n @media (min-width: 640px) {\n .animus-dyn-mb-sm {\n margin-bottom: var(--animus-mb-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-mb-md {\n margin-bottom: var(--animus-mb-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-mb-lg {\n margin-bottom: var(--animus-mb-lg);\n }\n }\n .animus-dyn-ml {\n margin-left: var(--animus-ml);\n }\n .animus-dyn-mx {\n margin-left: var(--animus-mx);\n margin-right: var(--animus-mx);\n }\n @media (min-width: 640px) {\n .animus-dyn-ml-sm {\n margin-left: var(--animus-ml-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-mx-sm {\n margin-left: var(--animus-mx-sm);\n margin-right: var(--animus-mx-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-ml-md {\n margin-left: var(--animus-ml-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-mx-md {\n margin-left: var(--animus-mx-md);\n margin-right: var(--animus-mx-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-ml-lg {\n margin-left: var(--animus-ml-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-mx-lg {\n margin-left: var(--animus-mx-lg);\n margin-right: var(--animus-mx-lg);\n }\n }\n .animus-dyn-mr {\n margin-right: var(--animus-mr);\n }\n @media (min-width: 640px) {\n .animus-dyn-mr-sm {\n margin-right: var(--animus-mr-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-mr-md {\n margin-right: var(--animus-mr-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-mr-lg {\n margin-right: var(--animus-mr-lg);\n }\n }\n .animus-dyn-mt {\n margin-top: var(--animus-mt);\n }\n .animus-dyn-my {\n margin-top: var(--animus-my);\n margin-bottom: var(--animus-my);\n }\n @media (min-width: 640px) {\n .animus-dyn-mt-sm {\n margin-top: var(--animus-mt-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-my-sm {\n margin-top: var(--animus-my-sm);\n margin-bottom: var(--animus-my-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-mt-md {\n margin-top: var(--animus-mt-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-my-md {\n margin-top: var(--animus-my-md);\n margin-bottom: var(--animus-my-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-mt-lg {\n margin-top: var(--animus-mt-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-my-lg {\n margin-top: var(--animus-my-lg);\n margin-bottom: var(--animus-my-lg);\n }\n }\n .animus-dyn-max-h {\n max-height: var(--animus-max-h);\n }\n .animus-dyn-max-height {\n max-height: var(--animus-max-height);\n }\n @media (min-width: 640px) {\n .animus-dyn-max-h-sm {\n max-height: var(--animus-max-h-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-max-height-sm {\n max-height: var(--animus-max-height-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-max-h-md {\n max-height: var(--animus-max-h-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-max-height-md {\n max-height: var(--animus-max-height-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-max-h-lg {\n max-height: var(--animus-max-h-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-max-height-lg {\n max-height: var(--animus-max-height-lg);\n }\n }\n .animus-dyn-max-w {\n max-width: var(--animus-max-w);\n }\n .animus-dyn-max-width {\n max-width: var(--animus-max-width);\n }\n @media (min-width: 640px) {\n .animus-dyn-max-w-sm {\n max-width: var(--animus-max-w-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-max-width-sm {\n max-width: var(--animus-max-width-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-max-w-md {\n max-width: var(--animus-max-w-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-max-width-md {\n max-width: var(--animus-max-width-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-max-w-lg {\n max-width: var(--animus-max-w-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-max-width-lg {\n max-width: var(--animus-max-width-lg);\n }\n }\n .animus-dyn-min-h {\n min-height: var(--animus-min-h);\n }\n .animus-dyn-min-height {\n min-height: var(--animus-min-height);\n }\n @media (min-width: 640px) {\n .animus-dyn-min-h-sm {\n min-height: var(--animus-min-h-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-min-height-sm {\n min-height: var(--animus-min-height-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-min-h-md {\n min-height: var(--animus-min-h-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-min-height-md {\n min-height: var(--animus-min-height-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-min-h-lg {\n min-height: var(--animus-min-h-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-min-height-lg {\n min-height: var(--animus-min-height-lg);\n }\n }\n .animus-dyn-min-w {\n min-width: var(--animus-min-w);\n }\n .animus-dyn-min-width {\n min-width: var(--animus-min-width);\n }\n @media (min-width: 640px) {\n .animus-dyn-min-w-sm {\n min-width: var(--animus-min-w-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-min-width-sm {\n min-width: var(--animus-min-width-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-min-w-md {\n min-width: var(--animus-min-w-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-min-width-md {\n min-width: var(--animus-min-width-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-min-w-lg {\n min-width: var(--animus-min-w-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-min-width-lg {\n min-width: var(--animus-min-width-lg);\n }\n }\n .animus-dyn-opacity {\n opacity: var(--animus-opacity);\n }\n @media (min-width: 640px) {\n .animus-dyn-opacity-sm {\n opacity: var(--animus-opacity-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-opacity-md {\n opacity: var(--animus-opacity-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-opacity-lg {\n opacity: var(--animus-opacity-lg);\n }\n }\n .animus-dyn-order {\n order: var(--animus-order);\n }\n @media (min-width: 640px) {\n .animus-dyn-order-sm {\n order: var(--animus-order-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-order-md {\n order: var(--animus-order-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-order-lg {\n order: var(--animus-order-lg);\n }\n }\n .animus-dyn-overflow-x {\n overflow-x: var(--animus-overflow-x);\n }\n @media (min-width: 640px) {\n .animus-dyn-overflow-x-sm {\n overflow-x: var(--animus-overflow-x-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-overflow-x-md {\n overflow-x: var(--animus-overflow-x-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-overflow-x-lg {\n overflow-x: var(--animus-overflow-x-lg);\n }\n }\n .animus-dyn-overflow-y {\n overflow-y: var(--animus-overflow-y);\n }\n @media (min-width: 640px) {\n .animus-dyn-overflow-y-sm {\n overflow-y: var(--animus-overflow-y-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-overflow-y-md {\n overflow-y: var(--animus-overflow-y-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-overflow-y-lg {\n overflow-y: var(--animus-overflow-y-lg);\n }\n }\n .animus-dyn-pb {\n padding-bottom: var(--animus-pb);\n }\n @media (min-width: 640px) {\n .animus-dyn-pb-sm {\n padding-bottom: var(--animus-pb-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-pb-md {\n padding-bottom: var(--animus-pb-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-pb-lg {\n padding-bottom: var(--animus-pb-lg);\n }\n }\n .animus-dyn-pl {\n padding-left: var(--animus-pl);\n }\n .animus-dyn-px {\n padding-left: var(--animus-px);\n padding-right: var(--animus-px);\n }\n @media (min-width: 640px) {\n .animus-dyn-pl-sm {\n padding-left: var(--animus-pl-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-px-sm {\n padding-left: var(--animus-px-sm);\n padding-right: var(--animus-px-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-pl-md {\n padding-left: var(--animus-pl-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-px-md {\n padding-left: var(--animus-px-md);\n padding-right: var(--animus-px-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-pl-lg {\n padding-left: var(--animus-pl-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-px-lg {\n padding-left: var(--animus-px-lg);\n padding-right: var(--animus-px-lg);\n }\n }\n .animus-dyn-pr {\n padding-right: var(--animus-pr);\n }\n @media (min-width: 640px) {\n .animus-dyn-pr-sm {\n padding-right: var(--animus-pr-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-pr-md {\n padding-right: var(--animus-pr-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-pr-lg {\n padding-right: var(--animus-pr-lg);\n }\n }\n .animus-dyn-pt {\n padding-top: var(--animus-pt);\n }\n .animus-dyn-py {\n padding-top: var(--animus-py);\n padding-bottom: var(--animus-py);\n }\n @media (min-width: 640px) {\n .animus-dyn-pt-sm {\n padding-top: var(--animus-pt-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-py-sm {\n padding-top: var(--animus-py-sm);\n padding-bottom: var(--animus-py-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-pt-md {\n padding-top: var(--animus-pt-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-py-md {\n padding-top: var(--animus-py-md);\n padding-bottom: var(--animus-py-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-pt-lg {\n padding-top: var(--animus-pt-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-py-lg {\n padding-top: var(--animus-py-lg);\n padding-bottom: var(--animus-py-lg);\n }\n }\n .animus-dyn-pos {\n position: var(--animus-pos);\n }\n .animus-dyn-position {\n position: var(--animus-position);\n }\n @media (min-width: 640px) {\n .animus-dyn-pos-sm {\n position: var(--animus-pos-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-position-sm {\n position: var(--animus-position-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-pos-md {\n position: var(--animus-pos-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-position-md {\n position: var(--animus-position-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-pos-lg {\n position: var(--animus-pos-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-position-lg {\n position: var(--animus-position-lg);\n }\n }\n .animus-dyn-right {\n right: var(--animus-right);\n }\n @media (min-width: 640px) {\n .animus-dyn-right-sm {\n right: var(--animus-right-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-right-md {\n right: var(--animus-right-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-right-lg {\n right: var(--animus-right-lg);\n }\n }\n .animus-dyn-row-gap {\n row-gap: var(--animus-row-gap);\n }\n @media (min-width: 640px) {\n .animus-dyn-row-gap-sm {\n row-gap: var(--animus-row-gap-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-row-gap-md {\n row-gap: var(--animus-row-gap-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-row-gap-lg {\n row-gap: var(--animus-row-gap-lg);\n }\n }\n .animus-dyn-inset {\n top: var(--animus-inset);\n right: var(--animus-inset);\n bottom: var(--animus-inset);\n left: var(--animus-inset);\n }\n .animus-dyn-top {\n top: var(--animus-top);\n }\n @media (min-width: 640px) {\n .animus-dyn-inset-sm {\n top: var(--animus-inset-sm);\n right: var(--animus-inset-sm);\n bottom: var(--animus-inset-sm);\n left: var(--animus-inset-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-top-sm {\n top: var(--animus-top-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-inset-md {\n top: var(--animus-inset-md);\n right: var(--animus-inset-md);\n bottom: var(--animus-inset-md);\n left: var(--animus-inset-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-top-md {\n top: var(--animus-top-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-inset-lg {\n top: var(--animus-inset-lg);\n right: var(--animus-inset-lg);\n bottom: var(--animus-inset-lg);\n left: var(--animus-inset-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-top-lg {\n top: var(--animus-top-lg);\n }\n }\n .animus-dyn-vertical-align {\n vertical-align: var(--animus-vertical-align);\n }\n @media (min-width: 640px) {\n .animus-dyn-vertical-align-sm {\n vertical-align: var(--animus-vertical-align-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-vertical-align-md {\n vertical-align: var(--animus-vertical-align-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-vertical-align-lg {\n vertical-align: var(--animus-vertical-align-lg);\n }\n }\n .animus-dyn-size {\n width: var(--animus-size);\n height: var(--animus-size);\n }\n .animus-dyn-w {\n width: var(--animus-w);\n }\n .animus-dyn-width {\n width: var(--animus-width);\n }\n @media (min-width: 640px) {\n .animus-dyn-size-sm {\n width: var(--animus-size-sm);\n height: var(--animus-size-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-w-sm {\n width: var(--animus-w-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-width-sm {\n width: var(--animus-width-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-size-md {\n width: var(--animus-size-md);\n height: var(--animus-size-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-w-md {\n width: var(--animus-w-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-width-md {\n width: var(--animus-width-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-size-lg {\n width: var(--animus-size-lg);\n height: var(--animus-size-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-w-lg {\n width: var(--animus-w-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-width-lg {\n width: var(--animus-width-lg);\n }\n }\n .animus-dyn-z-index {\n z-index: var(--animus-z-index);\n }\n @media (min-width: 640px) {\n .animus-dyn-z-index-sm {\n z-index: var(--animus-z-index-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-z-index-md {\n z-index: var(--animus-z-index-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-z-index-lg {\n z-index: var(--animus-z-index-lg);\n }\n }\n}\n\n","sheets":{"declaration":"@layer anm-global, anm-base, anm-variants, anm-compounds, anm-states, anm-system, anm-custom;\n","global":"@layer anm-global {\n@font-face { font-family: AnimusTestFont; src: url('animus-asset:@animus-ui/test-ds/assets/test-font.woff2') format('woff2'); font-display: swap; }\n\n*, *::before, *::after {\n box-sizing: border-box;\n}\n\nbody {\n margin: 0;\n background-color: var(--color-background);\n --current-bg: var(--color-background);\n color: var(--color-text);\n font-family: system-ui, sans-serif;\n}\n@keyframes animus-kf-muo7kp {\n 0%, 100% {\n opacity: 1;\n }\n 50% {\n opacity: 0.6;\n }\n}\n\n@keyframes animus-kf-1x7guim {\n 0% {\n opacity: 0;\n background-color: var(--color-background);\n --current-bg: var(--color-background);\n }\n 100% {\n opacity: 1;\n background-color: var(--color-surface);\n --current-bg: var(--color-surface);\n }\n}\n\n@keyframes animus-kf-1yqv0zl {\n 0%, 100% {\n transform: scale(1);\n }\n 50% {\n transform: scale(1.05);\n }\n}\n}\n","base":"@layer anm-base {\n .animus-Alert-a385f997 {\n padding: 0.75rem;\n display: flex;\n align-items: flex-start;\n border-radius: 4px;\n font-size: 0.875rem;\n line-height: 1.5;\n }\n .animus-Badge-99781d29 {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n display: inline-flex;\n align-items: center;\n border-radius: 9999px;\n font-size: 0.75rem;\n font-weight: 500;\n line-height: 1;\n }\n .animus-Card-9aa7af5d {\n padding: 1rem;\n background-color: var(--color-surface);\n --current-bg: var(--color-surface);\n border-radius: 8px;\n color: var(--color-text);\n container-type: inline-size;\n container-name: card;\n }\n @container card (min-width: 400px) {\n .animus-Card-9aa7af5d {\n padding: 1.5rem;\n width: 50cqw;\n }\n }\n @media (prefers-reduced-motion: reduce) {\n .animus-Card-9aa7af5d {\n transition: none;\n }\n }\n @supports (display: grid) {\n .animus-Card-9aa7af5d {\n display: grid;\n font-size: 0.875rem;\n }\n }\n @supports (display: grid) {\n @media (min-width: 640px) {\n .animus-Card-9aa7af5d {\n font-size: 1rem;\n }\n }\n }\n @supports (display: grid) {\n .animus-Card-9aa7af5d:focus-visible {\n outline: 2px solid;\n }\n }\n @supports (display: grid) {\n @container card (min-width: 600px) {\n .animus-Card-9aa7af5d {\n gap: 2cqi;\n }\n }\n }\n .animus-ContainerCardBody-133c6ad9 {\n font-size: 0.875rem;\n line-height: 1.5;\n color: var(--color-text);\n }\n @container card (min-width: 400px) {\n .animus-ContainerCardBody-133c6ad9 {\n font-size: 1rem;\n }\n }\n .animus-ContainerCardMedia-51db5d07 {\n display: block;\n width: 100%;\n min-height: 64px;\n border-radius: 4px;\n background: var(--current-bg);\n }\n @container card (min-width: 400px) {\n .animus-ContainerCardMedia-51db5d07 {\n min-height: 120px;\n width: 50cqw;\n }\n }\n .animus-ContainerCardRoot-01c5b011 {\n gap: 0.5rem;\n padding: 1rem;\n display: flex;\n flex-direction: column;\n border-radius: 8px;\n background-color: var(--color-surface);\n --current-bg: var(--color-surface);\n color: var(--color-text);\n container-type: inline-size;\n container-name: card;\n }\n .animus-GroupItem-32b2d32f {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n display: inline-flex;\n align-items: center;\n border-radius: 4px;\n background-color: var(--color-surface);\n --current-bg: var(--color-surface);\n color: var(--color-text);\n }\n [data-active=\"true\"] .animus-GroupItem-32b2d32f {\n background-color: var(--color-primary);\n --current-bg: var(--color-primary);\n color: var(--color-background);\n }\n .group:hover .animus-GroupItem-32b2d32f {\n opacity: 0.9;\n }\n [data-color-mode=\"dark\"] .animus-GroupItem-32b2d32f {\n color: var(--color-text-muted);\n }\n .animus-Box-399302cf {\n display: flex;\n position: relative;\n }\n .animus-Button-c63b6dcd {\n border: none;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border-radius: 4px;\n font-weight: 600;\n line-height: 1;\n cursor: pointer;\n }\n .animus-Button-b3718a43 {\n border-radius: 4px;\n padding: 8px;\n background-color: var(--color-blue-500);\n }\n}\n","variants":"@layer anm-variants {\n @layer standalone, composed;\n @layer standalone {\n\n .animus-Alert-a385f997--variant-filled {\n color: var(--color-background);\n }\n .animus-Alert-a385f997--variant-outline {\n border-width: 1px;\n border-style: solid;\n background-color: transparent;\n --current-bg: transparent;\n }\n .animus-Alert-a385f997--intent-info {\n background-color: var(--color-primary);\n --current-bg: var(--color-primary);\n }\n .animus-Alert-a385f997--intent-danger {\n background-color: var(--color-danger);\n --current-bg: var(--color-danger);\n }\n .animus-Alert-a385f997--intent-success {\n background-color: var(--color-secondary);\n --current-bg: var(--color-secondary);\n }\n .animus-Badge-99781d29--color-neutral {\n background-color: var(--color-surface);\n --current-bg: var(--color-surface);\n color: var(--color-text);\n }\n .animus-Badge-99781d29--color-danger {\n background-color: var(--color-danger);\n --current-bg: var(--color-danger);\n color: var(--color-background);\n }\n .animus-ContainerCardRoot-01c5b011--size-lg {\n padding: 1.5rem;\n }\n .animus-Button-c63b6dcd--variant-primary {\n background-color: var(--color-primary);\n --current-bg: var(--color-primary);\n color: var(--color-background);\n }\n .animus-Button-c63b6dcd--variant-secondary {\n background-color: var(--color-secondary);\n --current-bg: var(--color-secondary);\n color: var(--color-background);\n }\n .animus-Button-c63b6dcd--variant-ghost {\n background-color: transparent;\n --current-bg: transparent;\n color: var(--color-text);\n }\n .animus-Button-b3718a43--tone-quiet {\n background-color: var(--color-gray-700);\n }\n .animus-Button-b3718a43--tone-loud {\n font-weight: 700;\n background-color: var(--color-blue-700);\n }\n }\n @layer composed {\n }\n}\n","compounds":"@layer anm-compounds {\n .animus-Alert-a385f997--compound-0 {\n border-color: var(--color-primary);\n color: var(--color-primary);\n }\n .animus-Alert-a385f997--compound-1 {\n border-color: var(--color-danger);\n color: var(--color-danger);\n }\n .animus-Alert-a385f997--compound-2 {\n border-color: var(--color-secondary);\n color: var(--color-secondary);\n }\n}\n","states":"@layer anm-states {\n .animus-Badge-99781d29--disabled {\n opacity: 0.5;\n cursor: not-allowed;\n }\n .animus-Badge-99781d29--active {\n outline: 2px solid;\n outline-color: var(--color-primary);\n }\n}\n","system":"@layer anm-system {\n .animus-dyn-flex {\n flex: var(--animus-flex);\n }\n @media (min-width: 640px) {\n .animus-dyn-flex-sm {\n flex: var(--animus-flex-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-flex-md {\n flex: var(--animus-flex-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-flex-lg {\n flex: var(--animus-flex-lg);\n }\n }\n .animus-dyn-m {\n margin: var(--animus-m);\n }\n @media (min-width: 640px) {\n .animus-dyn-m-sm {\n margin: var(--animus-m-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-m-md {\n margin: var(--animus-m-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-m-lg {\n margin: var(--animus-m-lg);\n }\n }\n .animus-dyn-p {\n padding: var(--animus-p);\n }\n @media (min-width: 640px) {\n .animus-dyn-p-sm {\n padding: var(--animus-p-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-p-md {\n padding: var(--animus-p-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-p-lg {\n padding: var(--animus-p-lg);\n }\n }\n .animus-dyn-gap {\n gap: var(--animus-gap);\n }\n @media (min-width: 640px) {\n .animus-dyn-gap-sm {\n gap: var(--animus-gap-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-gap-md {\n gap: var(--animus-gap-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-gap-lg {\n gap: var(--animus-gap-lg);\n }\n }\n .animus-dyn-area {\n grid-area: var(--animus-area);\n }\n .animus-dyn-grid-area {\n grid-area: var(--animus-grid-area);\n }\n @media (min-width: 640px) {\n .animus-dyn-area-sm {\n grid-area: var(--animus-area-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-grid-area-sm {\n grid-area: var(--animus-grid-area-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-area-md {\n grid-area: var(--animus-area-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-grid-area-md {\n grid-area: var(--animus-grid-area-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-area-lg {\n grid-area: var(--animus-area-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-grid-area-lg {\n grid-area: var(--animus-grid-area-lg);\n }\n }\n .animus-dyn-grid-column {\n grid-column: var(--animus-grid-column);\n }\n @media (min-width: 640px) {\n .animus-dyn-grid-column-sm {\n grid-column: var(--animus-grid-column-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-grid-column-md {\n grid-column: var(--animus-grid-column-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-grid-column-lg {\n grid-column: var(--animus-grid-column-lg);\n }\n }\n .animus-dyn-grid-row {\n grid-row: var(--animus-grid-row);\n }\n @media (min-width: 640px) {\n .animus-dyn-grid-row-sm {\n grid-row: var(--animus-grid-row-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-grid-row-md {\n grid-row: var(--animus-grid-row-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-grid-row-lg {\n grid-row: var(--animus-grid-row-lg);\n }\n }\n .animus-dyn-overflow {\n overflow: var(--animus-overflow);\n }\n @media (min-width: 640px) {\n .animus-dyn-overflow-sm {\n overflow: var(--animus-overflow-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-overflow-md {\n overflow: var(--animus-overflow-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-overflow-lg {\n overflow: var(--animus-overflow-lg);\n }\n }\n .animus-dyn-align-content {\n align-content: var(--animus-align-content);\n }\n @media (min-width: 640px) {\n .animus-dyn-align-content-sm {\n align-content: var(--animus-align-content-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-align-content-md {\n align-content: var(--animus-align-content-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-align-content-lg {\n align-content: var(--animus-align-content-lg);\n }\n }\n .animus-dyn-align-items {\n align-items: var(--animus-align-items);\n }\n @media (min-width: 640px) {\n .animus-dyn-align-items-sm {\n align-items: var(--animus-align-items-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-align-items-md {\n align-items: var(--animus-align-items-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-align-items-lg {\n align-items: var(--animus-align-items-lg);\n }\n }\n .animus-dyn-align-self {\n align-self: var(--animus-align-self);\n }\n @media (min-width: 640px) {\n .animus-dyn-align-self-sm {\n align-self: var(--animus-align-self-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-align-self-md {\n align-self: var(--animus-align-self-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-align-self-lg {\n align-self: var(--animus-align-self-lg);\n }\n }\n .animus-dyn-bottom {\n bottom: var(--animus-bottom);\n }\n @media (min-width: 640px) {\n .animus-dyn-bottom-sm {\n bottom: var(--animus-bottom-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-bottom-md {\n bottom: var(--animus-bottom-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-bottom-lg {\n bottom: var(--animus-bottom-lg);\n }\n }\n .animus-dyn-column-gap {\n column-gap: var(--animus-column-gap);\n }\n @media (min-width: 640px) {\n .animus-dyn-column-gap-sm {\n column-gap: var(--animus-column-gap-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-column-gap-md {\n column-gap: var(--animus-column-gap-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-column-gap-lg {\n column-gap: var(--animus-column-gap-lg);\n }\n }\n .animus-dyn-display {\n display: var(--animus-display);\n }\n @media (min-width: 640px) {\n .animus-dyn-display-sm {\n display: var(--animus-display-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-display-md {\n display: var(--animus-display-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-display-lg {\n display: var(--animus-display-lg);\n }\n }\n .animus-dyn-flex-basis {\n flex-basis: var(--animus-flex-basis);\n }\n @media (min-width: 640px) {\n .animus-dyn-flex-basis-sm {\n flex-basis: var(--animus-flex-basis-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-flex-basis-md {\n flex-basis: var(--animus-flex-basis-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-flex-basis-lg {\n flex-basis: var(--animus-flex-basis-lg);\n }\n }\n .animus-dyn-flex-dir {\n flex-direction: var(--animus-flex-dir);\n }\n .animus-dyn-flex-direction {\n flex-direction: var(--animus-flex-direction);\n }\n @media (min-width: 640px) {\n .animus-dyn-flex-dir-sm {\n flex-direction: var(--animus-flex-dir-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-flex-direction-sm {\n flex-direction: var(--animus-flex-direction-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-flex-dir-md {\n flex-direction: var(--animus-flex-dir-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-flex-direction-md {\n flex-direction: var(--animus-flex-direction-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-flex-dir-lg {\n flex-direction: var(--animus-flex-dir-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-flex-direction-lg {\n flex-direction: var(--animus-flex-direction-lg);\n }\n }\n .animus-dyn-flex-grow {\n flex-grow: var(--animus-flex-grow);\n }\n @media (min-width: 640px) {\n .animus-dyn-flex-grow-sm {\n flex-grow: var(--animus-flex-grow-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-flex-grow-md {\n flex-grow: var(--animus-flex-grow-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-flex-grow-lg {\n flex-grow: var(--animus-flex-grow-lg);\n }\n }\n .animus-dyn-flex-shrink {\n flex-shrink: var(--animus-flex-shrink);\n }\n @media (min-width: 640px) {\n .animus-dyn-flex-shrink-sm {\n flex-shrink: var(--animus-flex-shrink-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-flex-shrink-md {\n flex-shrink: var(--animus-flex-shrink-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-flex-shrink-lg {\n flex-shrink: var(--animus-flex-shrink-lg);\n }\n }\n .animus-dyn-flex-wrap {\n flex-wrap: var(--animus-flex-wrap);\n }\n @media (min-width: 640px) {\n .animus-dyn-flex-wrap-sm {\n flex-wrap: var(--animus-flex-wrap-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-flex-wrap-md {\n flex-wrap: var(--animus-flex-wrap-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-flex-wrap-lg {\n flex-wrap: var(--animus-flex-wrap-lg);\n }\n }\n .animus-dyn-font-size {\n font-size: var(--animus-font-size);\n }\n @media (min-width: 640px) {\n .animus-dyn-font-size-sm {\n font-size: var(--animus-font-size-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-font-size-md {\n font-size: var(--animus-font-size-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-font-size-lg {\n font-size: var(--animus-font-size-lg);\n }\n }\n .animus-dyn-grid-column-end {\n grid-column-end: var(--animus-grid-column-end);\n }\n @media (min-width: 640px) {\n .animus-dyn-grid-column-end-sm {\n grid-column-end: var(--animus-grid-column-end-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-grid-column-end-md {\n grid-column-end: var(--animus-grid-column-end-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-grid-column-end-lg {\n grid-column-end: var(--animus-grid-column-end-lg);\n }\n }\n .animus-dyn-grid-column-start {\n grid-column-start: var(--animus-grid-column-start);\n }\n @media (min-width: 640px) {\n .animus-dyn-grid-column-start-sm {\n grid-column-start: var(--animus-grid-column-start-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-grid-column-start-md {\n grid-column-start: var(--animus-grid-column-start-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-grid-column-start-lg {\n grid-column-start: var(--animus-grid-column-start-lg);\n }\n }\n .animus-dyn-grid-row-end {\n grid-row-end: var(--animus-grid-row-end);\n }\n @media (min-width: 640px) {\n .animus-dyn-grid-row-end-sm {\n grid-row-end: var(--animus-grid-row-end-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-grid-row-end-md {\n grid-row-end: var(--animus-grid-row-end-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-grid-row-end-lg {\n grid-row-end: var(--animus-grid-row-end-lg);\n }\n }\n .animus-dyn-grid-row-start {\n grid-row-start: var(--animus-grid-row-start);\n }\n @media (min-width: 640px) {\n .animus-dyn-grid-row-start-sm {\n grid-row-start: var(--animus-grid-row-start-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-grid-row-start-md {\n grid-row-start: var(--animus-grid-row-start-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-grid-row-start-lg {\n grid-row-start: var(--animus-grid-row-start-lg);\n }\n }\n .animus-dyn-h {\n height: var(--animus-h);\n }\n .animus-dyn-height {\n height: var(--animus-height);\n }\n @media (min-width: 640px) {\n .animus-dyn-h-sm {\n height: var(--animus-h-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-height-sm {\n height: var(--animus-height-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-h-md {\n height: var(--animus-h-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-height-md {\n height: var(--animus-height-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-h-lg {\n height: var(--animus-h-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-height-lg {\n height: var(--animus-height-lg);\n }\n }\n .animus-dyn-justify-content {\n justify-content: var(--animus-justify-content);\n }\n @media (min-width: 640px) {\n .animus-dyn-justify-content-sm {\n justify-content: var(--animus-justify-content-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-justify-content-md {\n justify-content: var(--animus-justify-content-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-justify-content-lg {\n justify-content: var(--animus-justify-content-lg);\n }\n }\n .animus-dyn-justify-items {\n justify-items: var(--animus-justify-items);\n }\n @media (min-width: 640px) {\n .animus-dyn-justify-items-sm {\n justify-items: var(--animus-justify-items-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-justify-items-md {\n justify-items: var(--animus-justify-items-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-justify-items-lg {\n justify-items: var(--animus-justify-items-lg);\n }\n }\n .animus-dyn-justify-self {\n justify-self: var(--animus-justify-self);\n }\n @media (min-width: 640px) {\n .animus-dyn-justify-self-sm {\n justify-self: var(--animus-justify-self-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-justify-self-md {\n justify-self: var(--animus-justify-self-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-justify-self-lg {\n justify-self: var(--animus-justify-self-lg);\n }\n }\n .animus-dyn-left {\n left: var(--animus-left);\n }\n @media (min-width: 640px) {\n .animus-dyn-left-sm {\n left: var(--animus-left-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-left-md {\n left: var(--animus-left-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-left-lg {\n left: var(--animus-left-lg);\n }\n }\n .animus-dyn-mb {\n margin-bottom: var(--animus-mb);\n }\n @media (min-width: 640px) {\n .animus-dyn-mb-sm {\n margin-bottom: var(--animus-mb-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-mb-md {\n margin-bottom: var(--animus-mb-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-mb-lg {\n margin-bottom: var(--animus-mb-lg);\n }\n }\n .animus-dyn-ml {\n margin-left: var(--animus-ml);\n }\n .animus-dyn-mx {\n margin-left: var(--animus-mx);\n margin-right: var(--animus-mx);\n }\n @media (min-width: 640px) {\n .animus-dyn-ml-sm {\n margin-left: var(--animus-ml-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-mx-sm {\n margin-left: var(--animus-mx-sm);\n margin-right: var(--animus-mx-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-ml-md {\n margin-left: var(--animus-ml-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-mx-md {\n margin-left: var(--animus-mx-md);\n margin-right: var(--animus-mx-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-ml-lg {\n margin-left: var(--animus-ml-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-mx-lg {\n margin-left: var(--animus-mx-lg);\n margin-right: var(--animus-mx-lg);\n }\n }\n .animus-dyn-mr {\n margin-right: var(--animus-mr);\n }\n @media (min-width: 640px) {\n .animus-dyn-mr-sm {\n margin-right: var(--animus-mr-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-mr-md {\n margin-right: var(--animus-mr-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-mr-lg {\n margin-right: var(--animus-mr-lg);\n }\n }\n .animus-dyn-mt {\n margin-top: var(--animus-mt);\n }\n .animus-dyn-my {\n margin-top: var(--animus-my);\n margin-bottom: var(--animus-my);\n }\n @media (min-width: 640px) {\n .animus-dyn-mt-sm {\n margin-top: var(--animus-mt-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-my-sm {\n margin-top: var(--animus-my-sm);\n margin-bottom: var(--animus-my-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-mt-md {\n margin-top: var(--animus-mt-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-my-md {\n margin-top: var(--animus-my-md);\n margin-bottom: var(--animus-my-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-mt-lg {\n margin-top: var(--animus-mt-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-my-lg {\n margin-top: var(--animus-my-lg);\n margin-bottom: var(--animus-my-lg);\n }\n }\n .animus-dyn-max-h {\n max-height: var(--animus-max-h);\n }\n .animus-dyn-max-height {\n max-height: var(--animus-max-height);\n }\n @media (min-width: 640px) {\n .animus-dyn-max-h-sm {\n max-height: var(--animus-max-h-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-max-height-sm {\n max-height: var(--animus-max-height-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-max-h-md {\n max-height: var(--animus-max-h-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-max-height-md {\n max-height: var(--animus-max-height-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-max-h-lg {\n max-height: var(--animus-max-h-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-max-height-lg {\n max-height: var(--animus-max-height-lg);\n }\n }\n .animus-dyn-max-w {\n max-width: var(--animus-max-w);\n }\n .animus-dyn-max-width {\n max-width: var(--animus-max-width);\n }\n @media (min-width: 640px) {\n .animus-dyn-max-w-sm {\n max-width: var(--animus-max-w-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-max-width-sm {\n max-width: var(--animus-max-width-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-max-w-md {\n max-width: var(--animus-max-w-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-max-width-md {\n max-width: var(--animus-max-width-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-max-w-lg {\n max-width: var(--animus-max-w-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-max-width-lg {\n max-width: var(--animus-max-width-lg);\n }\n }\n .animus-dyn-min-h {\n min-height: var(--animus-min-h);\n }\n .animus-dyn-min-height {\n min-height: var(--animus-min-height);\n }\n @media (min-width: 640px) {\n .animus-dyn-min-h-sm {\n min-height: var(--animus-min-h-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-min-height-sm {\n min-height: var(--animus-min-height-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-min-h-md {\n min-height: var(--animus-min-h-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-min-height-md {\n min-height: var(--animus-min-height-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-min-h-lg {\n min-height: var(--animus-min-h-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-min-height-lg {\n min-height: var(--animus-min-height-lg);\n }\n }\n .animus-dyn-min-w {\n min-width: var(--animus-min-w);\n }\n .animus-dyn-min-width {\n min-width: var(--animus-min-width);\n }\n @media (min-width: 640px) {\n .animus-dyn-min-w-sm {\n min-width: var(--animus-min-w-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-min-width-sm {\n min-width: var(--animus-min-width-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-min-w-md {\n min-width: var(--animus-min-w-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-min-width-md {\n min-width: var(--animus-min-width-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-min-w-lg {\n min-width: var(--animus-min-w-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-min-width-lg {\n min-width: var(--animus-min-width-lg);\n }\n }\n .animus-dyn-opacity {\n opacity: var(--animus-opacity);\n }\n @media (min-width: 640px) {\n .animus-dyn-opacity-sm {\n opacity: var(--animus-opacity-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-opacity-md {\n opacity: var(--animus-opacity-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-opacity-lg {\n opacity: var(--animus-opacity-lg);\n }\n }\n .animus-dyn-order {\n order: var(--animus-order);\n }\n @media (min-width: 640px) {\n .animus-dyn-order-sm {\n order: var(--animus-order-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-order-md {\n order: var(--animus-order-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-order-lg {\n order: var(--animus-order-lg);\n }\n }\n .animus-dyn-overflow-x {\n overflow-x: var(--animus-overflow-x);\n }\n @media (min-width: 640px) {\n .animus-dyn-overflow-x-sm {\n overflow-x: var(--animus-overflow-x-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-overflow-x-md {\n overflow-x: var(--animus-overflow-x-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-overflow-x-lg {\n overflow-x: var(--animus-overflow-x-lg);\n }\n }\n .animus-dyn-overflow-y {\n overflow-y: var(--animus-overflow-y);\n }\n @media (min-width: 640px) {\n .animus-dyn-overflow-y-sm {\n overflow-y: var(--animus-overflow-y-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-overflow-y-md {\n overflow-y: var(--animus-overflow-y-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-overflow-y-lg {\n overflow-y: var(--animus-overflow-y-lg);\n }\n }\n .animus-dyn-pb {\n padding-bottom: var(--animus-pb);\n }\n @media (min-width: 640px) {\n .animus-dyn-pb-sm {\n padding-bottom: var(--animus-pb-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-pb-md {\n padding-bottom: var(--animus-pb-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-pb-lg {\n padding-bottom: var(--animus-pb-lg);\n }\n }\n .animus-dyn-pl {\n padding-left: var(--animus-pl);\n }\n .animus-dyn-px {\n padding-left: var(--animus-px);\n padding-right: var(--animus-px);\n }\n @media (min-width: 640px) {\n .animus-dyn-pl-sm {\n padding-left: var(--animus-pl-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-px-sm {\n padding-left: var(--animus-px-sm);\n padding-right: var(--animus-px-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-pl-md {\n padding-left: var(--animus-pl-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-px-md {\n padding-left: var(--animus-px-md);\n padding-right: var(--animus-px-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-pl-lg {\n padding-left: var(--animus-pl-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-px-lg {\n padding-left: var(--animus-px-lg);\n padding-right: var(--animus-px-lg);\n }\n }\n .animus-dyn-pr {\n padding-right: var(--animus-pr);\n }\n @media (min-width: 640px) {\n .animus-dyn-pr-sm {\n padding-right: var(--animus-pr-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-pr-md {\n padding-right: var(--animus-pr-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-pr-lg {\n padding-right: var(--animus-pr-lg);\n }\n }\n .animus-dyn-pt {\n padding-top: var(--animus-pt);\n }\n .animus-dyn-py {\n padding-top: var(--animus-py);\n padding-bottom: var(--animus-py);\n }\n @media (min-width: 640px) {\n .animus-dyn-pt-sm {\n padding-top: var(--animus-pt-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-py-sm {\n padding-top: var(--animus-py-sm);\n padding-bottom: var(--animus-py-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-pt-md {\n padding-top: var(--animus-pt-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-py-md {\n padding-top: var(--animus-py-md);\n padding-bottom: var(--animus-py-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-pt-lg {\n padding-top: var(--animus-pt-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-py-lg {\n padding-top: var(--animus-py-lg);\n padding-bottom: var(--animus-py-lg);\n }\n }\n .animus-dyn-pos {\n position: var(--animus-pos);\n }\n .animus-dyn-position {\n position: var(--animus-position);\n }\n @media (min-width: 640px) {\n .animus-dyn-pos-sm {\n position: var(--animus-pos-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-position-sm {\n position: var(--animus-position-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-pos-md {\n position: var(--animus-pos-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-position-md {\n position: var(--animus-position-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-pos-lg {\n position: var(--animus-pos-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-position-lg {\n position: var(--animus-position-lg);\n }\n }\n .animus-dyn-right {\n right: var(--animus-right);\n }\n @media (min-width: 640px) {\n .animus-dyn-right-sm {\n right: var(--animus-right-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-right-md {\n right: var(--animus-right-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-right-lg {\n right: var(--animus-right-lg);\n }\n }\n .animus-dyn-row-gap {\n row-gap: var(--animus-row-gap);\n }\n @media (min-width: 640px) {\n .animus-dyn-row-gap-sm {\n row-gap: var(--animus-row-gap-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-row-gap-md {\n row-gap: var(--animus-row-gap-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-row-gap-lg {\n row-gap: var(--animus-row-gap-lg);\n }\n }\n .animus-dyn-inset {\n top: var(--animus-inset);\n right: var(--animus-inset);\n bottom: var(--animus-inset);\n left: var(--animus-inset);\n }\n .animus-dyn-top {\n top: var(--animus-top);\n }\n @media (min-width: 640px) {\n .animus-dyn-inset-sm {\n top: var(--animus-inset-sm);\n right: var(--animus-inset-sm);\n bottom: var(--animus-inset-sm);\n left: var(--animus-inset-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-top-sm {\n top: var(--animus-top-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-inset-md {\n top: var(--animus-inset-md);\n right: var(--animus-inset-md);\n bottom: var(--animus-inset-md);\n left: var(--animus-inset-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-top-md {\n top: var(--animus-top-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-inset-lg {\n top: var(--animus-inset-lg);\n right: var(--animus-inset-lg);\n bottom: var(--animus-inset-lg);\n left: var(--animus-inset-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-top-lg {\n top: var(--animus-top-lg);\n }\n }\n .animus-dyn-vertical-align {\n vertical-align: var(--animus-vertical-align);\n }\n @media (min-width: 640px) {\n .animus-dyn-vertical-align-sm {\n vertical-align: var(--animus-vertical-align-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-vertical-align-md {\n vertical-align: var(--animus-vertical-align-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-vertical-align-lg {\n vertical-align: var(--animus-vertical-align-lg);\n }\n }\n .animus-dyn-size {\n width: var(--animus-size);\n height: var(--animus-size);\n }\n .animus-dyn-w {\n width: var(--animus-w);\n }\n .animus-dyn-width {\n width: var(--animus-width);\n }\n @media (min-width: 640px) {\n .animus-dyn-size-sm {\n width: var(--animus-size-sm);\n height: var(--animus-size-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-w-sm {\n width: var(--animus-w-sm);\n }\n }\n @media (min-width: 640px) {\n .animus-dyn-width-sm {\n width: var(--animus-width-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-size-md {\n width: var(--animus-size-md);\n height: var(--animus-size-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-w-md {\n width: var(--animus-w-md);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-width-md {\n width: var(--animus-width-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-size-lg {\n width: var(--animus-size-lg);\n height: var(--animus-size-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-w-lg {\n width: var(--animus-w-lg);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-width-lg {\n width: var(--animus-width-lg);\n }\n }\n .animus-dyn-z-index {\n z-index: var(--animus-z-index);\n }\n @media (min-width: 640px) {\n .animus-dyn-z-index-sm {\n z-index: var(--animus-z-index-sm);\n }\n }\n @media (min-width: 768px) {\n .animus-dyn-z-index-md {\n z-index: var(--animus-z-index-md);\n }\n }\n @media (min-width: 1024px) {\n .animus-dyn-z-index-lg {\n z-index: var(--animus-z-index-lg);\n }\n }\n}\n","custom":""},"diagnostics":[{"file":"../../packages/test-ds/src/components/Alert.tsx","component":"Alert","kind":"external-token-candidate","message":"'space.0.75rem' in 'padding' did not resolve against the consumer theme","token":"space.0.75rem"},{"file":"../../packages/test-ds/src/components/Alert.tsx","component":"Alert","kind":"external-token-candidate","message":"'radii.4px' in 'border-radius' did not resolve against the consumer theme","token":"radii.4px"},{"file":"../../packages/test-ds/src/components/Alert.tsx","component":"Alert","kind":"external-token-candidate","message":"'fontSizes.0.875rem' in 'font-size' did not resolve against the consumer theme","token":"fontSizes.0.875rem"},{"file":"../../packages/test-ds/src/components/Alert.tsx","component":"Alert","kind":"external-token-candidate","message":"'lineHeights.1.5' in 'line-height' did not resolve against the consumer theme","token":"lineHeights.1.5"},{"file":"../../packages/test-ds/src/components/Alert.tsx","component":"Alert","kind":"external-token-candidate","message":"'borderWidths.1px' in 'border-width' did not resolve against the consumer theme","token":"borderWidths.1px"},{"file":"../../packages/test-ds/src/components/Badge.tsx","component":"Badge","kind":"external-token-candidate","message":"'space.0.5rem' in 'padding-left' did not resolve against the consumer theme","token":"space.0.5rem"},{"file":"../../packages/test-ds/src/components/Badge.tsx","component":"Badge","kind":"external-token-candidate","message":"'space.0.5rem' in 'padding-right' did not resolve against the consumer theme","token":"space.0.5rem"},{"file":"../../packages/test-ds/src/components/Badge.tsx","component":"Badge","kind":"external-token-candidate","message":"'space.0.25rem' in 'padding-top' did not resolve against the consumer theme","token":"space.0.25rem"},{"file":"../../packages/test-ds/src/components/Badge.tsx","component":"Badge","kind":"external-token-candidate","message":"'space.0.25rem' in 'padding-bottom' did not resolve against the consumer theme","token":"space.0.25rem"},{"file":"../../packages/test-ds/src/components/Badge.tsx","component":"Badge","kind":"external-token-candidate","message":"'radii.9999px' in 'border-radius' did not resolve against the consumer theme","token":"radii.9999px"},{"file":"../../packages/test-ds/src/components/Badge.tsx","component":"Badge","kind":"external-token-candidate","message":"'fontSizes.0.75rem' in 'font-size' did not resolve against the consumer theme","token":"fontSizes.0.75rem"},{"file":"../../packages/test-ds/src/components/Badge.tsx","component":"Badge","kind":"external-token-candidate","message":"'fontWeights.500' in 'font-weight' did not resolve against the consumer theme","token":"fontWeights.500"},{"file":"../../packages/test-ds/src/components/Badge.tsx","component":"Badge","kind":"external-token-candidate","message":"'lineHeights.1' in 'line-height' did not resolve against the consumer theme","token":"lineHeights.1"},{"file":"../../packages/test-ds/src/components/Badge.tsx","component":"Badge","kind":"external-token-candidate","message":"'opacities.0.5' in 'opacity' did not resolve against the consumer theme","token":"opacities.0.5"},{"file":"../../packages/test-ds/src/components/Button.tsx","component":"Button","kind":"external-token-candidate","message":"'radii.4px' in 'border-radius' did not resolve against the consumer theme","token":"radii.4px"},{"file":"../../packages/test-ds/src/components/Button.tsx","component":"Button","kind":"external-token-candidate","message":"'fontWeights.600' in 'font-weight' did not resolve against the consumer theme","token":"fontWeights.600"},{"file":"../../packages/test-ds/src/components/Button.tsx","component":"Button","kind":"external-token-candidate","message":"'lineHeights.1' in 'line-height' did not resolve against the consumer theme","token":"lineHeights.1"},{"file":"../../packages/test-ds/src/components/Card.tsx","component":"Card","kind":"external-token-candidate","message":"'space.1rem' in 'padding' did not resolve against the consumer theme","token":"space.1rem"},{"file":"../../packages/test-ds/src/components/Card.tsx","component":"Card","kind":"external-token-candidate","message":"'radii.8px' in 'border-radius' did not resolve against the consumer theme","token":"radii.8px"},{"file":"../../packages/test-ds/src/components/Card.tsx","component":"Card","kind":"external-token-candidate","message":"'space.1.5rem' in 'padding' did not resolve against the consumer theme","token":"space.1.5rem"},{"file":"../../packages/test-ds/src/components/Card.tsx","component":"Card","kind":"external-token-candidate","message":"'fontSizes.0.875rem' in 'font-size' did not resolve against the consumer theme","token":"fontSizes.0.875rem"},{"file":"../../packages/test-ds/src/components/Card.tsx","component":"Card","kind":"external-token-candidate","message":"'fontSizes.1rem' in 'font-size' did not resolve against the consumer theme","token":"fontSizes.1rem"},{"file":"../../packages/test-ds/src/components/Card.tsx","component":"Card","kind":"external-token-candidate","message":"'space.2cqi' in 'gap' did not resolve against the consumer theme","token":"space.2cqi"},{"file":"../../packages/test-ds/src/components/ContainerCard.tsx","component":"ContainerCardBody","kind":"external-token-candidate","message":"'fontSizes.0.875rem' in 'font-size' did not resolve against the consumer theme","token":"fontSizes.0.875rem"},{"file":"../../packages/test-ds/src/components/ContainerCard.tsx","component":"ContainerCardBody","kind":"external-token-candidate","message":"'lineHeights.1.5' in 'line-height' did not resolve against the consumer theme","token":"lineHeights.1.5"},{"file":"../../packages/test-ds/src/components/ContainerCard.tsx","component":"ContainerCardBody","kind":"external-token-candidate","message":"'fontSizes.1rem' in 'font-size' did not resolve against the consumer theme","token":"fontSizes.1rem"},{"file":"../../packages/test-ds/src/components/ContainerCard.tsx","component":"ContainerCardMedia","kind":"external-token-candidate","message":"'radii.4px' in 'border-radius' did not resolve against the consumer theme","token":"radii.4px"},{"file":"../../packages/test-ds/src/components/ContainerCard.tsx","component":"ContainerCardRoot","kind":"external-token-candidate","message":"'space.0.5rem' in 'gap' did not resolve against the consumer theme","token":"space.0.5rem"},{"file":"../../packages/test-ds/src/components/ContainerCard.tsx","component":"ContainerCardRoot","kind":"external-token-candidate","message":"'space.1rem' in 'padding' did not resolve against the consumer theme","token":"space.1rem"},{"file":"../../packages/test-ds/src/components/ContainerCard.tsx","component":"ContainerCardRoot","kind":"external-token-candidate","message":"'radii.8px' in 'border-radius' did not resolve against the consumer theme","token":"radii.8px"},{"file":"../../packages/test-ds/src/components/ContainerCard.tsx","component":"ContainerCardRoot","kind":"external-token-candidate","message":"'space.1.5rem' in 'padding' did not resolve against the consumer theme","token":"space.1.5rem"},{"file":"../../packages/test-ds/src/components/GroupItem.tsx","component":"GroupItem","kind":"external-token-candidate","message":"'space.0.5rem' in 'padding-left' did not resolve against the consumer theme","token":"space.0.5rem"},{"file":"../../packages/test-ds/src/components/GroupItem.tsx","component":"GroupItem","kind":"external-token-candidate","message":"'space.0.5rem' in 'padding-right' did not resolve against the consumer theme","token":"space.0.5rem"},{"file":"../../packages/test-ds/src/components/GroupItem.tsx","component":"GroupItem","kind":"external-token-candidate","message":"'space.0.25rem' in 'padding-top' did not resolve against the consumer theme","token":"space.0.25rem"},{"file":"../../packages/test-ds/src/components/GroupItem.tsx","component":"GroupItem","kind":"external-token-candidate","message":"'space.0.25rem' in 'padding-bottom' did not resolve against the consumer theme","token":"space.0.25rem"},{"file":"../../packages/test-ds/src/components/GroupItem.tsx","component":"GroupItem","kind":"external-token-candidate","message":"'radii.4px' in 'border-radius' did not resolve against the consumer theme","token":"radii.4px"},{"file":"../../packages/test-ds/src/components/GroupItem.tsx","component":"GroupItem","kind":"external-token-candidate","message":"'opacities.0.9' in 'opacity' did not resolve against the consumer theme","token":"opacities.0.9"}],"report":{"components_total":10,"components_extracted":10,"components_eliminated":0,"variants_total":16,"variants_used":16,"variants_eliminated":0,"states_total":2,"states_used":2,"states_eliminated":0,"components_forced":0,"variants_forced":0,"states_forced":0,"eliminated_details":[]},"system_prop_map":{},"dynamic_props":{"alignContent":{"varName":"--animus-align-content","slotClass":"animus-dyn-align-content","property":"alignContent","transformName":null,"transformFnSource":null,"scaleValues":{}},"alignItems":{"varName":"--animus-align-items","slotClass":"animus-dyn-align-items","property":"alignItems","transformName":null,"transformFnSource":null,"scaleValues":{}},"alignSelf":{"varName":"--animus-align-self","slotClass":"animus-dyn-align-self","property":"alignSelf","transformName":null,"transformFnSource":null,"scaleValues":{}},"area":{"varName":"--animus-area","slotClass":"animus-dyn-area","property":"gridArea","transformName":null,"transformFnSource":null,"scaleValues":{}},"bottom":{"varName":"--animus-bottom","slotClass":"animus-dyn-bottom","property":"bottom","transformName":"size","transformFnSource":null,"scaleValues":{}},"columnGap":{"varName":"--animus-column-gap","slotClass":"animus-dyn-column-gap","property":"columnGap","transformName":null,"transformFnSource":null,"scaleValues":{"0":"0","12":"0.75rem","16":"1rem","24":"1.5rem","32":"2rem","4":"0.25rem","8":"0.5rem"}},"display":{"varName":"--animus-display","slotClass":"animus-dyn-display","property":"display","transformName":null,"transformFnSource":null,"scaleValues":{}},"flex":{"varName":"--animus-flex","slotClass":"animus-dyn-flex","property":"flex","transformName":null,"transformFnSource":null,"scaleValues":{}},"flexBasis":{"varName":"--animus-flex-basis","slotClass":"animus-dyn-flex-basis","property":"flexBasis","transformName":null,"transformFnSource":null,"scaleValues":{}},"flexDir":{"varName":"--animus-flex-dir","slotClass":"animus-dyn-flex-dir","property":"flexDirection","transformName":null,"transformFnSource":null,"scaleValues":{}},"flexDirection":{"varName":"--animus-flex-direction","slotClass":"animus-dyn-flex-direction","property":"flexDirection","transformName":null,"transformFnSource":null,"scaleValues":{}},"flexGrow":{"varName":"--animus-flex-grow","slotClass":"animus-dyn-flex-grow","property":"flexGrow","transformName":null,"transformFnSource":null,"scaleValues":{}},"flexShrink":{"varName":"--animus-flex-shrink","slotClass":"animus-dyn-flex-shrink","property":"flexShrink","transformName":null,"transformFnSource":null,"scaleValues":{}},"flexWrap":{"varName":"--animus-flex-wrap","slotClass":"animus-dyn-flex-wrap","property":"flexWrap","transformName":null,"transformFnSource":null,"scaleValues":{}},"fontSize":{"varName":"--animus-font-size","slotClass":"animus-dyn-font-size","property":"fontSize","transformName":null,"transformFnSource":null,"scaleValues":{"12":"0.75rem","14":"0.875rem","16":"1rem","20":"1.25rem","24":"1.5rem"}},"gap":{"varName":"--animus-gap","slotClass":"animus-dyn-gap","property":"gap","transformName":null,"transformFnSource":null,"scaleValues":{"0":"0","12":"0.75rem","16":"1rem","24":"1.5rem","32":"2rem","4":"0.25rem","8":"0.5rem"}},"gridArea":{"varName":"--animus-grid-area","slotClass":"animus-dyn-grid-area","property":"gridArea","transformName":null,"transformFnSource":null,"scaleValues":{}},"gridColumn":{"varName":"--animus-grid-column","slotClass":"animus-dyn-grid-column","property":"gridColumn","transformName":null,"transformFnSource":null,"scaleValues":{}},"gridColumnEnd":{"varName":"--animus-grid-column-end","slotClass":"animus-dyn-grid-column-end","property":"gridColumnEnd","transformName":null,"transformFnSource":null,"scaleValues":{}},"gridColumnStart":{"varName":"--animus-grid-column-start","slotClass":"animus-dyn-grid-column-start","property":"gridColumnStart","transformName":null,"transformFnSource":null,"scaleValues":{}},"gridRow":{"varName":"--animus-grid-row","slotClass":"animus-dyn-grid-row","property":"gridRow","transformName":null,"transformFnSource":null,"scaleValues":{}},"gridRowEnd":{"varName":"--animus-grid-row-end","slotClass":"animus-dyn-grid-row-end","property":"gridRowEnd","transformName":null,"transformFnSource":null,"scaleValues":{}},"gridRowStart":{"varName":"--animus-grid-row-start","slotClass":"animus-dyn-grid-row-start","property":"gridRowStart","transformName":null,"transformFnSource":null,"scaleValues":{}},"h":{"varName":"--animus-h","slotClass":"animus-dyn-h","property":"height","transformName":"size","transformFnSource":null,"scaleValues":{}},"height":{"varName":"--animus-height","slotClass":"animus-dyn-height","property":"height","transformName":"size","transformFnSource":null,"scaleValues":{}},"inset":{"varName":"--animus-inset","slotClass":"animus-dyn-inset","property":"inset","properties":["top","right","bottom","left"],"transformName":"size","transformFnSource":null,"scaleValues":{}},"justifyContent":{"varName":"--animus-justify-content","slotClass":"animus-dyn-justify-content","property":"justifyContent","transformName":null,"transformFnSource":null,"scaleValues":{}},"justifyItems":{"varName":"--animus-justify-items","slotClass":"animus-dyn-justify-items","property":"justifyItems","transformName":null,"transformFnSource":null,"scaleValues":{}},"justifySelf":{"varName":"--animus-justify-self","slotClass":"animus-dyn-justify-self","property":"justifySelf","transformName":null,"transformFnSource":null,"scaleValues":{}},"left":{"varName":"--animus-left","slotClass":"animus-dyn-left","property":"left","transformName":"size","transformFnSource":null,"scaleValues":{}},"m":{"varName":"--animus-m","slotClass":"animus-dyn-m","property":"margin","transformName":null,"transformFnSource":null,"scaleValues":{"0":"0","12":"0.75rem","16":"1rem","24":"1.5rem","32":"2rem","4":"0.25rem","8":"0.5rem"}},"maxH":{"varName":"--animus-max-h","slotClass":"animus-dyn-max-h","property":"maxHeight","transformName":"size","transformFnSource":null,"scaleValues":{}},"maxHeight":{"varName":"--animus-max-height","slotClass":"animus-dyn-max-height","property":"maxHeight","transformName":"size","transformFnSource":null,"scaleValues":{}},"maxW":{"varName":"--animus-max-w","slotClass":"animus-dyn-max-w","property":"maxWidth","transformName":"size","transformFnSource":null,"scaleValues":{}},"maxWidth":{"varName":"--animus-max-width","slotClass":"animus-dyn-max-width","property":"maxWidth","transformName":"size","transformFnSource":null,"scaleValues":{}},"mb":{"varName":"--animus-mb","slotClass":"animus-dyn-mb","property":"marginBottom","transformName":null,"transformFnSource":null,"scaleValues":{"0":"0","12":"0.75rem","16":"1rem","24":"1.5rem","32":"2rem","4":"0.25rem","8":"0.5rem"}},"minH":{"varName":"--animus-min-h","slotClass":"animus-dyn-min-h","property":"minHeight","transformName":"size","transformFnSource":null,"scaleValues":{}},"minHeight":{"varName":"--animus-min-height","slotClass":"animus-dyn-min-height","property":"minHeight","transformName":"size","transformFnSource":null,"scaleValues":{}},"minW":{"varName":"--animus-min-w","slotClass":"animus-dyn-min-w","property":"minWidth","transformName":"size","transformFnSource":null,"scaleValues":{}},"minWidth":{"varName":"--animus-min-width","slotClass":"animus-dyn-min-width","property":"minWidth","transformName":"size","transformFnSource":null,"scaleValues":{}},"ml":{"varName":"--animus-ml","slotClass":"animus-dyn-ml","property":"marginLeft","transformName":null,"transformFnSource":null,"scaleValues":{"0":"0","12":"0.75rem","16":"1rem","24":"1.5rem","32":"2rem","4":"0.25rem","8":"0.5rem"}},"mr":{"varName":"--animus-mr","slotClass":"animus-dyn-mr","property":"marginRight","transformName":null,"transformFnSource":null,"scaleValues":{"0":"0","12":"0.75rem","16":"1rem","24":"1.5rem","32":"2rem","4":"0.25rem","8":"0.5rem"}},"mt":{"varName":"--animus-mt","slotClass":"animus-dyn-mt","property":"marginTop","transformName":null,"transformFnSource":null,"scaleValues":{"0":"0","12":"0.75rem","16":"1rem","24":"1.5rem","32":"2rem","4":"0.25rem","8":"0.5rem"}},"mx":{"varName":"--animus-mx","slotClass":"animus-dyn-mx","property":"margin","properties":["marginLeft","marginRight"],"transformName":null,"transformFnSource":null,"scaleValues":{"0":"0","12":"0.75rem","16":"1rem","24":"1.5rem","32":"2rem","4":"0.25rem","8":"0.5rem"}},"my":{"varName":"--animus-my","slotClass":"animus-dyn-my","property":"margin","properties":["marginTop","marginBottom"],"transformName":null,"transformFnSource":null,"scaleValues":{"0":"0","12":"0.75rem","16":"1rem","24":"1.5rem","32":"2rem","4":"0.25rem","8":"0.5rem"}},"opacity":{"varName":"--animus-opacity","slotClass":"animus-dyn-opacity","property":"opacity","transformName":null,"transformFnSource":null,"scaleValues":{}},"order":{"varName":"--animus-order","slotClass":"animus-dyn-order","property":"order","transformName":null,"transformFnSource":null,"scaleValues":{}},"overflow":{"varName":"--animus-overflow","slotClass":"animus-dyn-overflow","property":"overflow","transformName":null,"transformFnSource":null,"scaleValues":{}},"overflowX":{"varName":"--animus-overflow-x","slotClass":"animus-dyn-overflow-x","property":"overflowX","transformName":null,"transformFnSource":null,"scaleValues":{}},"overflowY":{"varName":"--animus-overflow-y","slotClass":"animus-dyn-overflow-y","property":"overflowY","transformName":null,"transformFnSource":null,"scaleValues":{}},"p":{"varName":"--animus-p","slotClass":"animus-dyn-p","property":"padding","transformName":null,"transformFnSource":null,"scaleValues":{"0":"0","12":"0.75rem","16":"1rem","24":"1.5rem","32":"2rem","4":"0.25rem","8":"0.5rem"}},"pb":{"varName":"--animus-pb","slotClass":"animus-dyn-pb","property":"paddingBottom","transformName":null,"transformFnSource":null,"scaleValues":{"0":"0","12":"0.75rem","16":"1rem","24":"1.5rem","32":"2rem","4":"0.25rem","8":"0.5rem"}},"pl":{"varName":"--animus-pl","slotClass":"animus-dyn-pl","property":"paddingLeft","transformName":null,"transformFnSource":null,"scaleValues":{"0":"0","12":"0.75rem","16":"1rem","24":"1.5rem","32":"2rem","4":"0.25rem","8":"0.5rem"}},"pos":{"varName":"--animus-pos","slotClass":"animus-dyn-pos","property":"position","transformName":null,"transformFnSource":null,"scaleValues":{}},"position":{"varName":"--animus-position","slotClass":"animus-dyn-position","property":"position","transformName":null,"transformFnSource":null,"scaleValues":{}},"pr":{"varName":"--animus-pr","slotClass":"animus-dyn-pr","property":"paddingRight","transformName":null,"transformFnSource":null,"scaleValues":{"0":"0","12":"0.75rem","16":"1rem","24":"1.5rem","32":"2rem","4":"0.25rem","8":"0.5rem"}},"pt":{"varName":"--animus-pt","slotClass":"animus-dyn-pt","property":"paddingTop","transformName":null,"transformFnSource":null,"scaleValues":{"0":"0","12":"0.75rem","16":"1rem","24":"1.5rem","32":"2rem","4":"0.25rem","8":"0.5rem"}},"px":{"varName":"--animus-px","slotClass":"animus-dyn-px","property":"padding","properties":["paddingLeft","paddingRight"],"transformName":null,"transformFnSource":null,"scaleValues":{"0":"0","12":"0.75rem","16":"1rem","24":"1.5rem","32":"2rem","4":"0.25rem","8":"0.5rem"}},"py":{"varName":"--animus-py","slotClass":"animus-dyn-py","property":"padding","properties":["paddingTop","paddingBottom"],"transformName":null,"transformFnSource":null,"scaleValues":{"0":"0","12":"0.75rem","16":"1rem","24":"1.5rem","32":"2rem","4":"0.25rem","8":"0.5rem"}},"right":{"varName":"--animus-right","slotClass":"animus-dyn-right","property":"right","transformName":"size","transformFnSource":null,"scaleValues":{}},"rowGap":{"varName":"--animus-row-gap","slotClass":"animus-dyn-row-gap","property":"rowGap","transformName":null,"transformFnSource":null,"scaleValues":{"0":"0","12":"0.75rem","16":"1rem","24":"1.5rem","32":"2rem","4":"0.25rem","8":"0.5rem"}},"size":{"varName":"--animus-size","slotClass":"animus-dyn-size","property":"width","properties":["width","height"],"transformName":"size","transformFnSource":null,"scaleValues":{}},"top":{"varName":"--animus-top","slotClass":"animus-dyn-top","property":"top","transformName":"size","transformFnSource":null,"scaleValues":{}},"verticalAlign":{"varName":"--animus-vertical-align","slotClass":"animus-dyn-vertical-align","property":"verticalAlign","transformName":null,"transformFnSource":null,"scaleValues":{}},"w":{"varName":"--animus-w","slotClass":"animus-dyn-w","property":"width","transformName":"size","transformFnSource":null,"scaleValues":{}},"width":{"varName":"--animus-width","slotClass":"animus-dyn-width","property":"width","transformName":"size","transformFnSource":null,"scaleValues":{}},"zIndex":{"varName":"--animus-z-index","slotClass":"animus-dyn-z-index","property":"zIndex","transformName":null,"transformFnSource":null,"scaleValues":{}}},"component_fragments":{"../../packages/test-ds/src/components/Alert.tsx::Alert":{"base":" .animus-Alert-a385f997 {\n padding: 0.75rem;\n display: flex;\n align-items: flex-start;\n border-radius: 4px;\n font-size: 0.875rem;\n line-height: 1.5;\n }\n","variants":" .animus-Alert-a385f997--variant-filled {\n color: var(--color-background);\n }\n .animus-Alert-a385f997--variant-outline {\n border-width: 1px;\n border-style: solid;\n background-color: transparent;\n --current-bg: transparent;\n }\n .animus-Alert-a385f997--intent-info {\n background-color: var(--color-primary);\n --current-bg: var(--color-primary);\n }\n .animus-Alert-a385f997--intent-danger {\n background-color: var(--color-danger);\n --current-bg: var(--color-danger);\n }\n .animus-Alert-a385f997--intent-success {\n background-color: var(--color-secondary);\n --current-bg: var(--color-secondary);\n }\n","compounds":" .animus-Alert-a385f997--compound-0 {\n border-color: var(--color-primary);\n color: var(--color-primary);\n }\n .animus-Alert-a385f997--compound-1 {\n border-color: var(--color-danger);\n color: var(--color-danger);\n }\n .animus-Alert-a385f997--compound-2 {\n border-color: var(--color-secondary);\n color: var(--color-secondary);\n }\n"},"../../packages/test-ds/src/components/Badge.tsx::Badge":{"base":" .animus-Badge-99781d29 {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n display: inline-flex;\n align-items: center;\n border-radius: 9999px;\n font-size: 0.75rem;\n font-weight: 500;\n line-height: 1;\n }\n","variants":" .animus-Badge-99781d29--color-neutral {\n background-color: var(--color-surface);\n --current-bg: var(--color-surface);\n color: var(--color-text);\n }\n .animus-Badge-99781d29--color-danger {\n background-color: var(--color-danger);\n --current-bg: var(--color-danger);\n color: var(--color-background);\n }\n","states":" .animus-Badge-99781d29--disabled {\n opacity: 0.5;\n cursor: not-allowed;\n }\n .animus-Badge-99781d29--active {\n outline: 2px solid;\n outline-color: var(--color-primary);\n }\n"},"../../packages/test-ds/src/components/Card.tsx::Card":{"base":" .animus-Card-9aa7af5d {\n padding: 1rem;\n background-color: var(--color-surface);\n --current-bg: var(--color-surface);\n border-radius: 8px;\n color: var(--color-text);\n container-type: inline-size;\n container-name: card;\n }\n @container card (min-width: 400px) {\n .animus-Card-9aa7af5d {\n padding: 1.5rem;\n width: 50cqw;\n }\n }\n @media (prefers-reduced-motion: reduce) {\n .animus-Card-9aa7af5d {\n transition: none;\n }\n }\n @supports (display: grid) {\n .animus-Card-9aa7af5d {\n display: grid;\n font-size: 0.875rem;\n }\n }\n @supports (display: grid) {\n @media (min-width: 640px) {\n .animus-Card-9aa7af5d {\n font-size: 1rem;\n }\n }\n }\n @supports (display: grid) {\n .animus-Card-9aa7af5d:focus-visible {\n outline: 2px solid;\n }\n }\n @supports (display: grid) {\n @container card (min-width: 600px) {\n .animus-Card-9aa7af5d {\n gap: 2cqi;\n }\n }\n }\n"},"../../packages/test-ds/src/components/ContainerCard.tsx::ContainerCardBody":{"base":" .animus-ContainerCardBody-133c6ad9 {\n font-size: 0.875rem;\n line-height: 1.5;\n color: var(--color-text);\n }\n @container card (min-width: 400px) {\n .animus-ContainerCardBody-133c6ad9 {\n font-size: 1rem;\n }\n }\n"},"../../packages/test-ds/src/components/ContainerCard.tsx::ContainerCardMedia":{"base":" .animus-ContainerCardMedia-51db5d07 {\n display: block;\n width: 100%;\n min-height: 64px;\n border-radius: 4px;\n background: var(--current-bg);\n }\n @container card (min-width: 400px) {\n .animus-ContainerCardMedia-51db5d07 {\n min-height: 120px;\n width: 50cqw;\n }\n }\n"},"../../packages/test-ds/src/components/ContainerCard.tsx::ContainerCardRoot":{"base":" .animus-ContainerCardRoot-01c5b011 {\n gap: 0.5rem;\n padding: 1rem;\n display: flex;\n flex-direction: column;\n border-radius: 8px;\n background-color: var(--color-surface);\n --current-bg: var(--color-surface);\n color: var(--color-text);\n container-type: inline-size;\n container-name: card;\n }\n","variants":" .animus-ContainerCardRoot-01c5b011--size-lg {\n padding: 1.5rem;\n }\n"},"../../packages/test-ds/src/components/GroupItem.tsx::GroupItem":{"base":" .animus-GroupItem-32b2d32f {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n display: inline-flex;\n align-items: center;\n border-radius: 4px;\n background-color: var(--color-surface);\n --current-bg: var(--color-surface);\n color: var(--color-text);\n }\n [data-active=\"true\"] .animus-GroupItem-32b2d32f {\n background-color: var(--color-primary);\n --current-bg: var(--color-primary);\n color: var(--color-background);\n }\n .group:hover .animus-GroupItem-32b2d32f {\n opacity: 0.9;\n }\n [data-color-mode=\"dark\"] .animus-GroupItem-32b2d32f {\n color: var(--color-text-muted);\n }\n"},"src/Box.tsx::Box":{"base":" .animus-Box-399302cf {\n display: flex;\n position: relative;\n }\n"},"src/Button.tsx::Button":{"base":" .animus-Button-b3718a43 {\n border-radius: 4px;\n padding: 8px;\n background-color: var(--color-blue-500);\n }\n","variants":" .animus-Button-b3718a43--tone-quiet {\n background-color: var(--color-gray-700);\n }\n .animus-Button-b3718a43--tone-loud {\n font-weight: 700;\n background-color: var(--color-blue-700);\n }\n"}},"reverse_provenance":{},"components":{"../../packages/test-ds/src/components/Alert.tsx::Alert":{"file":"../../packages/test-ds/src/components/Alert.tsx","binding":"Alert","class_name":"animus-Alert-a385f997","extends_from":null,"terminal":"asElement","tag":"div","replacement":"createComponent('div', 'animus-Alert-a385f997', {\"variants\":{\"variant\":{\"options\":[\"filled\",\"outline\"]},\"intent\":{\"options\":[\"info\",\"danger\",\"success\"]}},\"compounds\":[{\"conditions\":{\"intent\":\"info\",\"variant\":\"outline\"},\"className\":\"animus-Alert-a385f997--compound-0\"},{\"conditions\":{\"intent\":\"danger\",\"variant\":\"outline\"},\"className\":\"animus-Alert-a385f997--compound-1\"},{\"conditions\":{\"intent\":\"success\",\"variant\":\"outline\"},\"className\":\"animus-Alert-a385f997--compound-2\"}]})","system_prop_names":[]},"../../packages/test-ds/src/components/Badge.tsx::Badge":{"file":"../../packages/test-ds/src/components/Badge.tsx","binding":"Badge","class_name":"animus-Badge-99781d29","extends_from":null,"terminal":"asElement","tag":"span","replacement":"createComponent('span', 'animus-Badge-99781d29', {\"variants\":{\"color\":{\"options\":[\"neutral\",\"danger\"]}},\"states\":[\"disabled\",\"active\"]})","system_prop_names":[]},"../../packages/test-ds/src/components/Button.tsx::Button":{"file":"../../packages/test-ds/src/components/Button.tsx","binding":"Button","class_name":"animus-Button-c63b6dcd","extends_from":null,"terminal":"asElement","tag":"button","replacement":"createComponent('button', 'animus-Button-c63b6dcd', {\"variants\":{\"variant\":{\"options\":[\"primary\",\"secondary\",\"ghost\"]}},\"systemPropNames\":[\"fontSize\",\"px\",\"py\"]}, systemPropMap, dynamicPropConfig)","system_prop_names":["fontSize","px","py"]},"../../packages/test-ds/src/components/Card.tsx::Card":{"file":"../../packages/test-ds/src/components/Card.tsx","binding":"Card","class_name":"animus-Card-9aa7af5d","extends_from":null,"terminal":"asElement","tag":"div","replacement":"createComponent('div', 'animus-Card-9aa7af5d', {\"systemPropNames\":[\"m\",\"mx\",\"my\"]}, systemPropMap, dynamicPropConfig)","system_prop_names":["m","mx","my"]},"../../packages/test-ds/src/components/ContainerCard.tsx::ContainerCardBody":{"file":"../../packages/test-ds/src/components/ContainerCard.tsx","binding":"ContainerCardBody","class_name":"animus-ContainerCardBody-133c6ad9","extends_from":null,"terminal":"asElement","tag":"div","replacement":"createComponent('div', 'animus-ContainerCardBody-133c6ad9', {})","system_prop_names":[]},"../../packages/test-ds/src/components/ContainerCard.tsx::ContainerCardMedia":{"file":"../../packages/test-ds/src/components/ContainerCard.tsx","binding":"ContainerCardMedia","class_name":"animus-ContainerCardMedia-51db5d07","extends_from":null,"terminal":"asElement","tag":"div","replacement":"createComponent('div', 'animus-ContainerCardMedia-51db5d07', {\"variants\":{\"size\":{\"options\":[\"md\",\"lg\"],\"default\":\"md\"}}})","system_prop_names":[]},"../../packages/test-ds/src/components/ContainerCard.tsx::ContainerCardRoot":{"file":"../../packages/test-ds/src/components/ContainerCard.tsx","binding":"ContainerCardRoot","class_name":"animus-ContainerCardRoot-01c5b011","extends_from":null,"terminal":"asElement","tag":"article","replacement":"createComponent('article', 'animus-ContainerCardRoot-01c5b011', {\"variants\":{\"size\":{\"options\":[\"md\",\"lg\"],\"default\":\"md\"}}})","system_prop_names":[]},"../../packages/test-ds/src/components/GroupItem.tsx::GroupItem":{"file":"../../packages/test-ds/src/components/GroupItem.tsx","binding":"GroupItem","class_name":"animus-GroupItem-32b2d32f","extends_from":null,"terminal":"asElement","tag":"span","replacement":"createComponent('span', 'animus-GroupItem-32b2d32f', {})","system_prop_names":[]},"src/Box.tsx::Box":{"file":"src/Box.tsx","binding":"Box","class_name":"animus-Box-399302cf","extends_from":null,"terminal":"asElement","tag":"div","replacement":"createComponent('div', 'animus-Box-399302cf', {\"systemPropNames\":[].concat(systemPropGroups.layout,systemPropGroups.positioning,systemPropGroups.space)}, systemPropMap, dynamicPropConfig)","system_prop_names":["alignContent","alignItems","alignSelf","area","bottom","columnGap","display","flex","flexBasis","flexDir","flexDirection","flexGrow","flexShrink","flexWrap","gap","gridArea","gridColumn","gridColumnEnd","gridColumnStart","gridRow","gridRowEnd","gridRowStart","h","height","inset","justifyContent","justifyItems","justifySelf","left","m","maxH","maxHeight","maxW","maxWidth","mb","minH","minHeight","minW","minWidth","ml","mr","mt","mx","my","opacity","order","overflow","overflowX","overflowY","p","pb","pl","pos","position","pr","pt","px","py","right","rowGap","size","top","verticalAlign","w","width","zIndex"]},"src/Button.tsx::Button":{"file":"src/Button.tsx","binding":"Button","class_name":"animus-Button-b3718a43","extends_from":null,"terminal":"asElement","tag":"button","replacement":"createComponent('button', 'animus-Button-b3718a43', {\"variants\":{\"tone\":{\"options\":[\"quiet\",\"loud\"]}}})","system_prop_names":[]}},"files":{"../../packages/test-ds/src/components/Alert.tsx":["../../packages/test-ds/src/components/Alert.tsx::Alert"],"../../packages/test-ds/src/components/Badge.tsx":["../../packages/test-ds/src/components/Badge.tsx::Badge"],"../../packages/test-ds/src/components/Button.tsx":["../../packages/test-ds/src/components/Button.tsx::Button"],"../../packages/test-ds/src/components/Card.tsx":["../../packages/test-ds/src/components/Card.tsx::Card"],"../../packages/test-ds/src/components/ContainerCard.tsx":["../../packages/test-ds/src/components/ContainerCard.tsx::ContainerCardBody","../../packages/test-ds/src/components/ContainerCard.tsx::ContainerCardMedia","../../packages/test-ds/src/components/ContainerCard.tsx::ContainerCardRoot"],"../../packages/test-ds/src/components/GroupItem.tsx":["../../packages/test-ds/src/components/GroupItem.tsx::GroupItem"],"src/Box.tsx":["src/Box.tsx::Box"],"src/Button.tsx":["src/Button.tsx::Button"]},"timing":{"parseCount":17}} \ No newline at end of file diff --git a/packages/oracle/__tests__/fixtures/rollup-app/styles.css b/packages/oracle/__tests__/fixtures/rollup-app/styles.css index c67a6ab6..e1342c81 100644 --- a/packages/oracle/__tests__/fixtures/rollup-app/styles.css +++ b/packages/oracle/__tests__/fixtures/rollup-app/styles.css @@ -81,4 +81,4 @@ --color-text-muted: #737373; color-scheme: light; } -@layer anm-global{@font-face{font-family:AnimusTestFont;src:url(./assets/test-font.f2a09939.woff2)format("woff2");font-display:swap}*,:before,:after{box-sizing:border-box}body{background-color:var(--color-background);--current-bg:var(--color-background);color:var(--color-text);margin:0;font-family:system-ui,sans-serif}@keyframes animus-kf-1x7guim{0%{opacity:0;background-color:var(--color-background);--current-bg:var(--color-background)}to{opacity:1;background-color:var(--color-surface);--current-bg:var(--color-surface)}}@keyframes animus-kf-1yqv0zl{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}@keyframes animus-kf-muo7kp{0%,to{opacity:1}50%{opacity:.6}}}@layer anm-base{.animus-Alert-a385f997{border-radius:4px;align-items:flex-start;padding:.75rem;font-size:.875rem;line-height:1.5;display:flex}.animus-Badge-99781d29{border-radius:9999px;align-items:center;padding:.25rem .5rem;font-size:.75rem;font-weight:500;line-height:1;display:inline-flex}.animus-Card-9aa7af5d{background-color:var(--color-surface);--current-bg:var(--color-surface);color:var(--color-text);border-radius:8px;padding:1rem;container:card/inline-size}@container card (width>=400px){.animus-Card-9aa7af5d{width:50cqw;padding:1.5rem}}@media (prefers-reduced-motion:reduce){.animus-Card-9aa7af5d{transition:none}}@supports (display:grid){.animus-Card-9aa7af5d{font-size:.875rem;display:grid}@media (width>=640px){.animus-Card-9aa7af5d{font-size:1rem}}.animus-Card-9aa7af5d:focus-visible{outline:2px solid}@container card (width>=600px){.animus-Card-9aa7af5d{gap:2cqi}}}.animus-ContainerCardBody-133c6ad9{color:var(--color-text);font-size:.875rem;line-height:1.5}@container card (width>=400px){.animus-ContainerCardBody-133c6ad9{font-size:1rem}}.animus-ContainerCardMedia-51db5d07{background:var(--current-bg);border-radius:4px;width:100%;min-height:64px;display:block}@container card (width>=400px){.animus-ContainerCardMedia-51db5d07{width:50cqw;min-height:120px}}.animus-ContainerCardRoot-01c5b011{background-color:var(--color-surface);--current-bg:var(--color-surface);color:var(--color-text);border-radius:8px;flex-direction:column;gap:.5rem;padding:1rem;display:flex;container:card/inline-size}.animus-GroupItem-32b2d32f{background-color:var(--color-surface);--current-bg:var(--color-surface);color:var(--color-text);border-radius:4px;align-items:center;padding:.25rem .5rem;display:inline-flex}[data-active=true] .animus-GroupItem-32b2d32f{background-color:var(--color-primary);--current-bg:var(--color-primary);color:var(--color-background)}.group:hover .animus-GroupItem-32b2d32f{opacity:.9}[data-color-mode=dark] .animus-GroupItem-32b2d32f{color:var(--color-text-muted)}.animus-Box-399302cf{display:flex;position:relative}.animus-Button-c63b6dcd{cursor:pointer;border:none;border-radius:4px;justify-content:center;align-items:center;font-weight:600;line-height:1;display:inline-flex}.animus-Button-b3718a43{background-color:var(--color-blue-500);border-radius:4px;padding:8px}}@layer anm-variants{@layer standalone{.animus-Alert-a385f997--variant-filled{color:var(--color-background)}.animus-Alert-a385f997--variant-outline{--current-bg:transparent;background-color:#0000;border-style:solid;border-width:1px}.animus-Alert-a385f997--intent-info{background-color:var(--color-primary);--current-bg:var(--color-primary)}.animus-Alert-a385f997--intent-danger{background-color:var(--color-danger);--current-bg:var(--color-danger)}.animus-Alert-a385f997--intent-success{background-color:var(--color-secondary);--current-bg:var(--color-secondary)}.animus-Badge-99781d29--color-neutral{background-color:var(--color-surface);--current-bg:var(--color-surface);color:var(--color-text)}.animus-Badge-99781d29--color-danger{background-color:var(--color-danger);--current-bg:var(--color-danger);color:var(--color-background)}.animus-ContainerCardRoot-01c5b011--size-lg{padding:1.5rem}.animus-Button-c63b6dcd--variant-primary{background-color:var(--color-primary);--current-bg:var(--color-primary);color:var(--color-background)}.animus-Button-c63b6dcd--variant-secondary{background-color:var(--color-secondary);--current-bg:var(--color-secondary);color:var(--color-background)}.animus-Button-c63b6dcd--variant-ghost{--current-bg:transparent;color:var(--color-text);background-color:#0000}.animus-Button-b3718a43--tone-quiet{background-color:var(--color-gray-700)}.animus-Button-b3718a43--tone-loud{background-color:var(--color-blue-700);font-weight:700}}@layer composed;}@layer anm-compounds{.animus-Alert-a385f997--compound-0{border-color:var(--color-primary);color:var(--color-primary)}.animus-Alert-a385f997--compound-1{border-color:var(--color-danger);color:var(--color-danger)}.animus-Alert-a385f997--compound-2{border-color:var(--color-secondary);color:var(--color-secondary)}}@layer anm-states{.animus-Badge-99781d29--disabled{opacity:.5;cursor:not-allowed}.animus-Badge-99781d29--active{outline:2px solid;outline-color:var(--color-primary)}}@layer anm-system{.animus-dyn-flex{flex:var(--animus-flex)}@media (width>=640px){.animus-dyn-flex-sm{flex:var(--animus-flex-sm)}}@media (width>=768px){.animus-dyn-flex-md{flex:var(--animus-flex-md)}}@media (width>=1024px){.animus-dyn-flex-lg{flex:var(--animus-flex-lg)}}.animus-dyn-m{margin:var(--animus-m)}@media (width>=640px){.animus-dyn-m-sm{margin:var(--animus-m-sm)}}@media (width>=768px){.animus-dyn-m-md{margin:var(--animus-m-md)}}@media (width>=1024px){.animus-dyn-m-lg{margin:var(--animus-m-lg)}}.animus-dyn-p{padding:var(--animus-p)}@media (width>=640px){.animus-dyn-p-sm{padding:var(--animus-p-sm)}}@media (width>=768px){.animus-dyn-p-md{padding:var(--animus-p-md)}}@media (width>=1024px){.animus-dyn-p-lg{padding:var(--animus-p-lg)}}.animus-dyn-gap{gap:var(--animus-gap)}@media (width>=640px){.animus-dyn-gap-sm{gap:var(--animus-gap-sm)}}@media (width>=768px){.animus-dyn-gap-md{gap:var(--animus-gap-md)}}@media (width>=1024px){.animus-dyn-gap-lg{gap:var(--animus-gap-lg)}}.animus-dyn-area{grid-area:var(--animus-area)}.animus-dyn-grid-area{grid-area:var(--animus-grid-area)}@media (width>=640px){.animus-dyn-area-sm{grid-area:var(--animus-area-sm)}.animus-dyn-grid-area-sm{grid-area:var(--animus-grid-area-sm)}}@media (width>=768px){.animus-dyn-area-md{grid-area:var(--animus-area-md)}.animus-dyn-grid-area-md{grid-area:var(--animus-grid-area-md)}}@media (width>=1024px){.animus-dyn-area-lg{grid-area:var(--animus-area-lg)}.animus-dyn-grid-area-lg{grid-area:var(--animus-grid-area-lg)}}.animus-dyn-grid-column{grid-column:var(--animus-grid-column)}@media (width>=640px){.animus-dyn-grid-column-sm{grid-column:var(--animus-grid-column-sm)}}@media (width>=768px){.animus-dyn-grid-column-md{grid-column:var(--animus-grid-column-md)}}@media (width>=1024px){.animus-dyn-grid-column-lg{grid-column:var(--animus-grid-column-lg)}}.animus-dyn-grid-row{grid-row:var(--animus-grid-row)}@media (width>=640px){.animus-dyn-grid-row-sm{grid-row:var(--animus-grid-row-sm)}}@media (width>=768px){.animus-dyn-grid-row-md{grid-row:var(--animus-grid-row-md)}}@media (width>=1024px){.animus-dyn-grid-row-lg{grid-row:var(--animus-grid-row-lg)}}.animus-dyn-overflow{overflow:var(--animus-overflow)}@media (width>=640px){.animus-dyn-overflow-sm{overflow:var(--animus-overflow-sm)}}@media (width>=768px){.animus-dyn-overflow-md{overflow:var(--animus-overflow-md)}}@media (width>=1024px){.animus-dyn-overflow-lg{overflow:var(--animus-overflow-lg)}}.animus-dyn-align-content{align-content:var(--animus-align-content)}@media (width>=640px){.animus-dyn-align-content-sm{align-content:var(--animus-align-content-sm)}}@media (width>=768px){.animus-dyn-align-content-md{align-content:var(--animus-align-content-md)}}@media (width>=1024px){.animus-dyn-align-content-lg{align-content:var(--animus-align-content-lg)}}.animus-dyn-align-items{align-items:var(--animus-align-items)}@media (width>=640px){.animus-dyn-align-items-sm{align-items:var(--animus-align-items-sm)}}@media (width>=768px){.animus-dyn-align-items-md{align-items:var(--animus-align-items-md)}}@media (width>=1024px){.animus-dyn-align-items-lg{align-items:var(--animus-align-items-lg)}}.animus-dyn-align-self{align-self:var(--animus-align-self)}@media (width>=640px){.animus-dyn-align-self-sm{align-self:var(--animus-align-self-sm)}}@media (width>=768px){.animus-dyn-align-self-md{align-self:var(--animus-align-self-md)}}@media (width>=1024px){.animus-dyn-align-self-lg{align-self:var(--animus-align-self-lg)}}.animus-dyn-bottom{bottom:var(--animus-bottom)}@media (width>=640px){.animus-dyn-bottom-sm{bottom:var(--animus-bottom-sm)}}@media (width>=768px){.animus-dyn-bottom-md{bottom:var(--animus-bottom-md)}}@media (width>=1024px){.animus-dyn-bottom-lg{bottom:var(--animus-bottom-lg)}}.animus-dyn-column-gap{column-gap:var(--animus-column-gap)}@media (width>=640px){.animus-dyn-column-gap-sm{column-gap:var(--animus-column-gap-sm)}}@media (width>=768px){.animus-dyn-column-gap-md{column-gap:var(--animus-column-gap-md)}}@media (width>=1024px){.animus-dyn-column-gap-lg{column-gap:var(--animus-column-gap-lg)}}.animus-dyn-display{display:var(--animus-display)}@media (width>=640px){.animus-dyn-display-sm{display:var(--animus-display-sm)}}@media (width>=768px){.animus-dyn-display-md{display:var(--animus-display-md)}}@media (width>=1024px){.animus-dyn-display-lg{display:var(--animus-display-lg)}}.animus-dyn-flex-basis{flex-basis:var(--animus-flex-basis)}@media (width>=640px){.animus-dyn-flex-basis-sm{flex-basis:var(--animus-flex-basis-sm)}}@media (width>=768px){.animus-dyn-flex-basis-md{flex-basis:var(--animus-flex-basis-md)}}@media (width>=1024px){.animus-dyn-flex-basis-lg{flex-basis:var(--animus-flex-basis-lg)}}.animus-dyn-flex-dir{flex-direction:var(--animus-flex-dir)}.animus-dyn-flex-direction{flex-direction:var(--animus-flex-direction)}@media (width>=640px){.animus-dyn-flex-dir-sm{flex-direction:var(--animus-flex-dir-sm)}.animus-dyn-flex-direction-sm{flex-direction:var(--animus-flex-direction-sm)}}@media (width>=768px){.animus-dyn-flex-dir-md{flex-direction:var(--animus-flex-dir-md)}.animus-dyn-flex-direction-md{flex-direction:var(--animus-flex-direction-md)}}@media (width>=1024px){.animus-dyn-flex-dir-lg{flex-direction:var(--animus-flex-dir-lg)}.animus-dyn-flex-direction-lg{flex-direction:var(--animus-flex-direction-lg)}}.animus-dyn-flex-grow{flex-grow:var(--animus-flex-grow)}@media (width>=640px){.animus-dyn-flex-grow-sm{flex-grow:var(--animus-flex-grow-sm)}}@media (width>=768px){.animus-dyn-flex-grow-md{flex-grow:var(--animus-flex-grow-md)}}@media (width>=1024px){.animus-dyn-flex-grow-lg{flex-grow:var(--animus-flex-grow-lg)}}.animus-dyn-flex-shrink{flex-shrink:var(--animus-flex-shrink)}@media (width>=640px){.animus-dyn-flex-shrink-sm{flex-shrink:var(--animus-flex-shrink-sm)}}@media (width>=768px){.animus-dyn-flex-shrink-md{flex-shrink:var(--animus-flex-shrink-md)}}@media (width>=1024px){.animus-dyn-flex-shrink-lg{flex-shrink:var(--animus-flex-shrink-lg)}}.animus-dyn-flex-wrap{flex-wrap:var(--animus-flex-wrap)}@media (width>=640px){.animus-dyn-flex-wrap-sm{flex-wrap:var(--animus-flex-wrap-sm)}}@media (width>=768px){.animus-dyn-flex-wrap-md{flex-wrap:var(--animus-flex-wrap-md)}}@media (width>=1024px){.animus-dyn-flex-wrap-lg{flex-wrap:var(--animus-flex-wrap-lg)}}.animus-dyn-font-size{font-size:var(--animus-font-size)}@media (width>=640px){.animus-dyn-font-size-sm{font-size:var(--animus-font-size-sm)}}@media (width>=768px){.animus-dyn-font-size-md{font-size:var(--animus-font-size-md)}}@media (width>=1024px){.animus-dyn-font-size-lg{font-size:var(--animus-font-size-lg)}}.animus-dyn-grid-column-end{grid-column-end:var(--animus-grid-column-end)}@media (width>=640px){.animus-dyn-grid-column-end-sm{grid-column-end:var(--animus-grid-column-end-sm)}}@media (width>=768px){.animus-dyn-grid-column-end-md{grid-column-end:var(--animus-grid-column-end-md)}}@media (width>=1024px){.animus-dyn-grid-column-end-lg{grid-column-end:var(--animus-grid-column-end-lg)}}.animus-dyn-grid-column-start{grid-column-start:var(--animus-grid-column-start)}@media (width>=640px){.animus-dyn-grid-column-start-sm{grid-column-start:var(--animus-grid-column-start-sm)}}@media (width>=768px){.animus-dyn-grid-column-start-md{grid-column-start:var(--animus-grid-column-start-md)}}@media (width>=1024px){.animus-dyn-grid-column-start-lg{grid-column-start:var(--animus-grid-column-start-lg)}}.animus-dyn-grid-row-end{grid-row-end:var(--animus-grid-row-end)}@media (width>=640px){.animus-dyn-grid-row-end-sm{grid-row-end:var(--animus-grid-row-end-sm)}}@media (width>=768px){.animus-dyn-grid-row-end-md{grid-row-end:var(--animus-grid-row-end-md)}}@media (width>=1024px){.animus-dyn-grid-row-end-lg{grid-row-end:var(--animus-grid-row-end-lg)}}.animus-dyn-grid-row-start{grid-row-start:var(--animus-grid-row-start)}@media (width>=640px){.animus-dyn-grid-row-start-sm{grid-row-start:var(--animus-grid-row-start-sm)}}@media (width>=768px){.animus-dyn-grid-row-start-md{grid-row-start:var(--animus-grid-row-start-md)}}@media (width>=1024px){.animus-dyn-grid-row-start-lg{grid-row-start:var(--animus-grid-row-start-lg)}}.animus-dyn-h{height:var(--animus-h)}.animus-dyn-height{height:var(--animus-height)}@media (width>=640px){.animus-dyn-h-sm{height:var(--animus-h-sm)}.animus-dyn-height-sm{height:var(--animus-height-sm)}}@media (width>=768px){.animus-dyn-h-md{height:var(--animus-h-md)}.animus-dyn-height-md{height:var(--animus-height-md)}}@media (width>=1024px){.animus-dyn-h-lg{height:var(--animus-h-lg)}.animus-dyn-height-lg{height:var(--animus-height-lg)}}.animus-dyn-justify-content{justify-content:var(--animus-justify-content)}@media (width>=640px){.animus-dyn-justify-content-sm{justify-content:var(--animus-justify-content-sm)}}@media (width>=768px){.animus-dyn-justify-content-md{justify-content:var(--animus-justify-content-md)}}@media (width>=1024px){.animus-dyn-justify-content-lg{justify-content:var(--animus-justify-content-lg)}}.animus-dyn-justify-items{justify-items:var(--animus-justify-items)}@media (width>=640px){.animus-dyn-justify-items-sm{justify-items:var(--animus-justify-items-sm)}}@media (width>=768px){.animus-dyn-justify-items-md{justify-items:var(--animus-justify-items-md)}}@media (width>=1024px){.animus-dyn-justify-items-lg{justify-items:var(--animus-justify-items-lg)}}.animus-dyn-justify-self{justify-self:var(--animus-justify-self)}@media (width>=640px){.animus-dyn-justify-self-sm{justify-self:var(--animus-justify-self-sm)}}@media (width>=768px){.animus-dyn-justify-self-md{justify-self:var(--animus-justify-self-md)}}@media (width>=1024px){.animus-dyn-justify-self-lg{justify-self:var(--animus-justify-self-lg)}}.animus-dyn-left{left:var(--animus-left)}@media (width>=640px){.animus-dyn-left-sm{left:var(--animus-left-sm)}}@media (width>=768px){.animus-dyn-left-md{left:var(--animus-left-md)}}@media (width>=1024px){.animus-dyn-left-lg{left:var(--animus-left-lg)}}.animus-dyn-mb{margin-bottom:var(--animus-mb)}@media (width>=640px){.animus-dyn-mb-sm{margin-bottom:var(--animus-mb-sm)}}@media (width>=768px){.animus-dyn-mb-md{margin-bottom:var(--animus-mb-md)}}@media (width>=1024px){.animus-dyn-mb-lg{margin-bottom:var(--animus-mb-lg)}}.animus-dyn-ml{margin-left:var(--animus-ml)}.animus-dyn-mx{margin-left:var(--animus-mx);margin-right:var(--animus-mx)}@media (width>=640px){.animus-dyn-ml-sm{margin-left:var(--animus-ml-sm)}.animus-dyn-mx-sm{margin-left:var(--animus-mx-sm);margin-right:var(--animus-mx-sm)}}@media (width>=768px){.animus-dyn-ml-md{margin-left:var(--animus-ml-md)}.animus-dyn-mx-md{margin-left:var(--animus-mx-md);margin-right:var(--animus-mx-md)}}@media (width>=1024px){.animus-dyn-ml-lg{margin-left:var(--animus-ml-lg)}.animus-dyn-mx-lg{margin-left:var(--animus-mx-lg);margin-right:var(--animus-mx-lg)}}.animus-dyn-mr{margin-right:var(--animus-mr)}@media (width>=640px){.animus-dyn-mr-sm{margin-right:var(--animus-mr-sm)}}@media (width>=768px){.animus-dyn-mr-md{margin-right:var(--animus-mr-md)}}@media (width>=1024px){.animus-dyn-mr-lg{margin-right:var(--animus-mr-lg)}}.animus-dyn-mt{margin-top:var(--animus-mt)}.animus-dyn-my{margin-top:var(--animus-my);margin-bottom:var(--animus-my)}@media (width>=640px){.animus-dyn-mt-sm{margin-top:var(--animus-mt-sm)}.animus-dyn-my-sm{margin-top:var(--animus-my-sm);margin-bottom:var(--animus-my-sm)}}@media (width>=768px){.animus-dyn-mt-md{margin-top:var(--animus-mt-md)}.animus-dyn-my-md{margin-top:var(--animus-my-md);margin-bottom:var(--animus-my-md)}}@media (width>=1024px){.animus-dyn-mt-lg{margin-top:var(--animus-mt-lg)}.animus-dyn-my-lg{margin-top:var(--animus-my-lg);margin-bottom:var(--animus-my-lg)}}.animus-dyn-max-h{max-height:var(--animus-max-h)}.animus-dyn-max-height{max-height:var(--animus-max-height)}@media (width>=640px){.animus-dyn-max-h-sm{max-height:var(--animus-max-h-sm)}.animus-dyn-max-height-sm{max-height:var(--animus-max-height-sm)}}@media (width>=768px){.animus-dyn-max-h-md{max-height:var(--animus-max-h-md)}.animus-dyn-max-height-md{max-height:var(--animus-max-height-md)}}@media (width>=1024px){.animus-dyn-max-h-lg{max-height:var(--animus-max-h-lg)}.animus-dyn-max-height-lg{max-height:var(--animus-max-height-lg)}}.animus-dyn-max-w{max-width:var(--animus-max-w)}.animus-dyn-max-width{max-width:var(--animus-max-width)}@media (width>=640px){.animus-dyn-max-w-sm{max-width:var(--animus-max-w-sm)}.animus-dyn-max-width-sm{max-width:var(--animus-max-width-sm)}}@media (width>=768px){.animus-dyn-max-w-md{max-width:var(--animus-max-w-md)}.animus-dyn-max-width-md{max-width:var(--animus-max-width-md)}}@media (width>=1024px){.animus-dyn-max-w-lg{max-width:var(--animus-max-w-lg)}.animus-dyn-max-width-lg{max-width:var(--animus-max-width-lg)}}.animus-dyn-min-h{min-height:var(--animus-min-h)}.animus-dyn-min-height{min-height:var(--animus-min-height)}@media (width>=640px){.animus-dyn-min-h-sm{min-height:var(--animus-min-h-sm)}.animus-dyn-min-height-sm{min-height:var(--animus-min-height-sm)}}@media (width>=768px){.animus-dyn-min-h-md{min-height:var(--animus-min-h-md)}.animus-dyn-min-height-md{min-height:var(--animus-min-height-md)}}@media (width>=1024px){.animus-dyn-min-h-lg{min-height:var(--animus-min-h-lg)}.animus-dyn-min-height-lg{min-height:var(--animus-min-height-lg)}}.animus-dyn-min-w{min-width:var(--animus-min-w)}.animus-dyn-min-width{min-width:var(--animus-min-width)}@media (width>=640px){.animus-dyn-min-w-sm{min-width:var(--animus-min-w-sm)}.animus-dyn-min-width-sm{min-width:var(--animus-min-width-sm)}}@media (width>=768px){.animus-dyn-min-w-md{min-width:var(--animus-min-w-md)}.animus-dyn-min-width-md{min-width:var(--animus-min-width-md)}}@media (width>=1024px){.animus-dyn-min-w-lg{min-width:var(--animus-min-w-lg)}.animus-dyn-min-width-lg{min-width:var(--animus-min-width-lg)}}.animus-dyn-opacity{opacity:var(--animus-opacity)}@media (width>=640px){.animus-dyn-opacity-sm{opacity:var(--animus-opacity-sm)}}@media (width>=768px){.animus-dyn-opacity-md{opacity:var(--animus-opacity-md)}}@media (width>=1024px){.animus-dyn-opacity-lg{opacity:var(--animus-opacity-lg)}}.animus-dyn-order{order:var(--animus-order)}@media (width>=640px){.animus-dyn-order-sm{order:var(--animus-order-sm)}}@media (width>=768px){.animus-dyn-order-md{order:var(--animus-order-md)}}@media (width>=1024px){.animus-dyn-order-lg{order:var(--animus-order-lg)}}.animus-dyn-overflow-x{overflow-x:var(--animus-overflow-x)}@media (width>=640px){.animus-dyn-overflow-x-sm{overflow-x:var(--animus-overflow-x-sm)}}@media (width>=768px){.animus-dyn-overflow-x-md{overflow-x:var(--animus-overflow-x-md)}}@media (width>=1024px){.animus-dyn-overflow-x-lg{overflow-x:var(--animus-overflow-x-lg)}}.animus-dyn-overflow-y{overflow-y:var(--animus-overflow-y)}@media (width>=640px){.animus-dyn-overflow-y-sm{overflow-y:var(--animus-overflow-y-sm)}}@media (width>=768px){.animus-dyn-overflow-y-md{overflow-y:var(--animus-overflow-y-md)}}@media (width>=1024px){.animus-dyn-overflow-y-lg{overflow-y:var(--animus-overflow-y-lg)}}.animus-dyn-pb{padding-bottom:var(--animus-pb)}@media (width>=640px){.animus-dyn-pb-sm{padding-bottom:var(--animus-pb-sm)}}@media (width>=768px){.animus-dyn-pb-md{padding-bottom:var(--animus-pb-md)}}@media (width>=1024px){.animus-dyn-pb-lg{padding-bottom:var(--animus-pb-lg)}}.animus-dyn-pl{padding-left:var(--animus-pl)}.animus-dyn-px{padding-left:var(--animus-px);padding-right:var(--animus-px)}@media (width>=640px){.animus-dyn-pl-sm{padding-left:var(--animus-pl-sm)}.animus-dyn-px-sm{padding-left:var(--animus-px-sm);padding-right:var(--animus-px-sm)}}@media (width>=768px){.animus-dyn-pl-md{padding-left:var(--animus-pl-md)}.animus-dyn-px-md{padding-left:var(--animus-px-md);padding-right:var(--animus-px-md)}}@media (width>=1024px){.animus-dyn-pl-lg{padding-left:var(--animus-pl-lg)}.animus-dyn-px-lg{padding-left:var(--animus-px-lg);padding-right:var(--animus-px-lg)}}.animus-dyn-pr{padding-right:var(--animus-pr)}@media (width>=640px){.animus-dyn-pr-sm{padding-right:var(--animus-pr-sm)}}@media (width>=768px){.animus-dyn-pr-md{padding-right:var(--animus-pr-md)}}@media (width>=1024px){.animus-dyn-pr-lg{padding-right:var(--animus-pr-lg)}}.animus-dyn-pt{padding-top:var(--animus-pt)}.animus-dyn-py{padding-top:var(--animus-py);padding-bottom:var(--animus-py)}@media (width>=640px){.animus-dyn-pt-sm{padding-top:var(--animus-pt-sm)}.animus-dyn-py-sm{padding-top:var(--animus-py-sm);padding-bottom:var(--animus-py-sm)}}@media (width>=768px){.animus-dyn-pt-md{padding-top:var(--animus-pt-md)}.animus-dyn-py-md{padding-top:var(--animus-py-md);padding-bottom:var(--animus-py-md)}}@media (width>=1024px){.animus-dyn-pt-lg{padding-top:var(--animus-pt-lg)}.animus-dyn-py-lg{padding-top:var(--animus-py-lg);padding-bottom:var(--animus-py-lg)}}.animus-dyn-pos{position:var(--animus-pos)}.animus-dyn-position{position:var(--animus-position)}@media (width>=640px){.animus-dyn-pos-sm{position:var(--animus-pos-sm)}.animus-dyn-position-sm{position:var(--animus-position-sm)}}@media (width>=768px){.animus-dyn-pos-md{position:var(--animus-pos-md)}.animus-dyn-position-md{position:var(--animus-position-md)}}@media (width>=1024px){.animus-dyn-pos-lg{position:var(--animus-pos-lg)}.animus-dyn-position-lg{position:var(--animus-position-lg)}}.animus-dyn-right{right:var(--animus-right)}@media (width>=640px){.animus-dyn-right-sm{right:var(--animus-right-sm)}}@media (width>=768px){.animus-dyn-right-md{right:var(--animus-right-md)}}@media (width>=1024px){.animus-dyn-right-lg{right:var(--animus-right-lg)}}.animus-dyn-row-gap{row-gap:var(--animus-row-gap)}@media (width>=640px){.animus-dyn-row-gap-sm{row-gap:var(--animus-row-gap-sm)}}@media (width>=768px){.animus-dyn-row-gap-md{row-gap:var(--animus-row-gap-md)}}@media (width>=1024px){.animus-dyn-row-gap-lg{row-gap:var(--animus-row-gap-lg)}}.animus-dyn-inset{top:var(--animus-inset);right:var(--animus-inset);bottom:var(--animus-inset);left:var(--animus-inset)}.animus-dyn-top{top:var(--animus-top)}@media (width>=640px){.animus-dyn-inset-sm{top:var(--animus-inset-sm);right:var(--animus-inset-sm);bottom:var(--animus-inset-sm);left:var(--animus-inset-sm)}.animus-dyn-top-sm{top:var(--animus-top-sm)}}@media (width>=768px){.animus-dyn-inset-md{top:var(--animus-inset-md);right:var(--animus-inset-md);bottom:var(--animus-inset-md);left:var(--animus-inset-md)}.animus-dyn-top-md{top:var(--animus-top-md)}}@media (width>=1024px){.animus-dyn-inset-lg{top:var(--animus-inset-lg);right:var(--animus-inset-lg);bottom:var(--animus-inset-lg);left:var(--animus-inset-lg)}.animus-dyn-top-lg{top:var(--animus-top-lg)}}.animus-dyn-vertical-align{vertical-align:var(--animus-vertical-align)}@media (width>=640px){.animus-dyn-vertical-align-sm{vertical-align:var(--animus-vertical-align-sm)}}@media (width>=768px){.animus-dyn-vertical-align-md{vertical-align:var(--animus-vertical-align-md)}}@media (width>=1024px){.animus-dyn-vertical-align-lg{vertical-align:var(--animus-vertical-align-lg)}}.animus-dyn-size{width:var(--animus-size);height:var(--animus-size)}.animus-dyn-w{width:var(--animus-w)}.animus-dyn-width{width:var(--animus-width)}@media (width>=640px){.animus-dyn-size-sm{width:var(--animus-size-sm);height:var(--animus-size-sm)}.animus-dyn-w-sm{width:var(--animus-w-sm)}.animus-dyn-width-sm{width:var(--animus-width-sm)}}@media (width>=768px){.animus-dyn-size-md{width:var(--animus-size-md);height:var(--animus-size-md)}.animus-dyn-w-md{width:var(--animus-w-md)}.animus-dyn-width-md{width:var(--animus-width-md)}}@media (width>=1024px){.animus-dyn-size-lg{width:var(--animus-size-lg);height:var(--animus-size-lg)}.animus-dyn-w-lg{width:var(--animus-w-lg)}.animus-dyn-width-lg{width:var(--animus-width-lg)}}.animus-dyn-z-index{z-index:var(--animus-z-index)}@media (width>=640px){.animus-dyn-z-index-sm{z-index:var(--animus-z-index-sm)}}@media (width>=768px){.animus-dyn-z-index-md{z-index:var(--animus-z-index-md)}}@media (width>=1024px){.animus-dyn-z-index-lg{z-index:var(--animus-z-index-lg)}}} \ No newline at end of file +@layer anm-global{@font-face{font-family:AnimusTestFont;src:url(./assets/test-font.f2a09939.woff2)format("woff2");font-display:swap}*,:before,:after{box-sizing:border-box}body{background-color:var(--color-background);--current-bg:var(--color-background);color:var(--color-text);margin:0;font-family:system-ui,sans-serif}@keyframes animus-kf-muo7kp{0%,to{opacity:1}50%{opacity:.6}}@keyframes animus-kf-1x7guim{0%{opacity:0;background-color:var(--color-background);--current-bg:var(--color-background)}to{opacity:1;background-color:var(--color-surface);--current-bg:var(--color-surface)}}@keyframes animus-kf-1yqv0zl{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}}@layer anm-base{.animus-Alert-a385f997{border-radius:4px;align-items:flex-start;padding:.75rem;font-size:.875rem;line-height:1.5;display:flex}.animus-Badge-99781d29{border-radius:9999px;align-items:center;padding:.25rem .5rem;font-size:.75rem;font-weight:500;line-height:1;display:inline-flex}.animus-Card-9aa7af5d{background-color:var(--color-surface);--current-bg:var(--color-surface);color:var(--color-text);border-radius:8px;padding:1rem;container:card/inline-size}@container card (width>=400px){.animus-Card-9aa7af5d{width:50cqw;padding:1.5rem}}@media (prefers-reduced-motion:reduce){.animus-Card-9aa7af5d{transition:none}}@supports (display:grid){.animus-Card-9aa7af5d{font-size:.875rem;display:grid}@media (width>=640px){.animus-Card-9aa7af5d{font-size:1rem}}.animus-Card-9aa7af5d:focus-visible{outline:2px solid}@container card (width>=600px){.animus-Card-9aa7af5d{gap:2cqi}}}.animus-ContainerCardBody-133c6ad9{color:var(--color-text);font-size:.875rem;line-height:1.5}@container card (width>=400px){.animus-ContainerCardBody-133c6ad9{font-size:1rem}}.animus-ContainerCardMedia-51db5d07{background:var(--current-bg);border-radius:4px;width:100%;min-height:64px;display:block}@container card (width>=400px){.animus-ContainerCardMedia-51db5d07{width:50cqw;min-height:120px}}.animus-ContainerCardRoot-01c5b011{background-color:var(--color-surface);--current-bg:var(--color-surface);color:var(--color-text);border-radius:8px;flex-direction:column;gap:.5rem;padding:1rem;display:flex;container:card/inline-size}.animus-GroupItem-32b2d32f{background-color:var(--color-surface);--current-bg:var(--color-surface);color:var(--color-text);border-radius:4px;align-items:center;padding:.25rem .5rem;display:inline-flex}[data-active=true] .animus-GroupItem-32b2d32f{background-color:var(--color-primary);--current-bg:var(--color-primary);color:var(--color-background)}.group:hover .animus-GroupItem-32b2d32f{opacity:.9}[data-color-mode=dark] .animus-GroupItem-32b2d32f{color:var(--color-text-muted)}.animus-Box-399302cf{display:flex;position:relative}.animus-Button-c63b6dcd{cursor:pointer;border:none;border-radius:4px;justify-content:center;align-items:center;font-weight:600;line-height:1;display:inline-flex}.animus-Button-b3718a43{background-color:var(--color-blue-500);border-radius:4px;padding:8px}}@layer anm-variants{@layer standalone{.animus-Alert-a385f997--variant-filled{color:var(--color-background)}.animus-Alert-a385f997--variant-outline{--current-bg:transparent;background-color:#0000;border-style:solid;border-width:1px}.animus-Alert-a385f997--intent-info{background-color:var(--color-primary);--current-bg:var(--color-primary)}.animus-Alert-a385f997--intent-danger{background-color:var(--color-danger);--current-bg:var(--color-danger)}.animus-Alert-a385f997--intent-success{background-color:var(--color-secondary);--current-bg:var(--color-secondary)}.animus-Badge-99781d29--color-neutral{background-color:var(--color-surface);--current-bg:var(--color-surface);color:var(--color-text)}.animus-Badge-99781d29--color-danger{background-color:var(--color-danger);--current-bg:var(--color-danger);color:var(--color-background)}.animus-ContainerCardRoot-01c5b011--size-lg{padding:1.5rem}.animus-Button-c63b6dcd--variant-primary{background-color:var(--color-primary);--current-bg:var(--color-primary);color:var(--color-background)}.animus-Button-c63b6dcd--variant-secondary{background-color:var(--color-secondary);--current-bg:var(--color-secondary);color:var(--color-background)}.animus-Button-c63b6dcd--variant-ghost{--current-bg:transparent;color:var(--color-text);background-color:#0000}.animus-Button-b3718a43--tone-quiet{background-color:var(--color-gray-700)}.animus-Button-b3718a43--tone-loud{background-color:var(--color-blue-700);font-weight:700}}@layer composed;}@layer anm-compounds{.animus-Alert-a385f997--compound-0{border-color:var(--color-primary);color:var(--color-primary)}.animus-Alert-a385f997--compound-1{border-color:var(--color-danger);color:var(--color-danger)}.animus-Alert-a385f997--compound-2{border-color:var(--color-secondary);color:var(--color-secondary)}}@layer anm-states{.animus-Badge-99781d29--disabled{opacity:.5;cursor:not-allowed}.animus-Badge-99781d29--active{outline:2px solid;outline-color:var(--color-primary)}}@layer anm-system{.animus-dyn-flex{flex:var(--animus-flex)}@media (width>=640px){.animus-dyn-flex-sm{flex:var(--animus-flex-sm)}}@media (width>=768px){.animus-dyn-flex-md{flex:var(--animus-flex-md)}}@media (width>=1024px){.animus-dyn-flex-lg{flex:var(--animus-flex-lg)}}.animus-dyn-m{margin:var(--animus-m)}@media (width>=640px){.animus-dyn-m-sm{margin:var(--animus-m-sm)}}@media (width>=768px){.animus-dyn-m-md{margin:var(--animus-m-md)}}@media (width>=1024px){.animus-dyn-m-lg{margin:var(--animus-m-lg)}}.animus-dyn-p{padding:var(--animus-p)}@media (width>=640px){.animus-dyn-p-sm{padding:var(--animus-p-sm)}}@media (width>=768px){.animus-dyn-p-md{padding:var(--animus-p-md)}}@media (width>=1024px){.animus-dyn-p-lg{padding:var(--animus-p-lg)}}.animus-dyn-gap{gap:var(--animus-gap)}@media (width>=640px){.animus-dyn-gap-sm{gap:var(--animus-gap-sm)}}@media (width>=768px){.animus-dyn-gap-md{gap:var(--animus-gap-md)}}@media (width>=1024px){.animus-dyn-gap-lg{gap:var(--animus-gap-lg)}}.animus-dyn-area{grid-area:var(--animus-area)}.animus-dyn-grid-area{grid-area:var(--animus-grid-area)}@media (width>=640px){.animus-dyn-area-sm{grid-area:var(--animus-area-sm)}.animus-dyn-grid-area-sm{grid-area:var(--animus-grid-area-sm)}}@media (width>=768px){.animus-dyn-area-md{grid-area:var(--animus-area-md)}.animus-dyn-grid-area-md{grid-area:var(--animus-grid-area-md)}}@media (width>=1024px){.animus-dyn-area-lg{grid-area:var(--animus-area-lg)}.animus-dyn-grid-area-lg{grid-area:var(--animus-grid-area-lg)}}.animus-dyn-grid-column{grid-column:var(--animus-grid-column)}@media (width>=640px){.animus-dyn-grid-column-sm{grid-column:var(--animus-grid-column-sm)}}@media (width>=768px){.animus-dyn-grid-column-md{grid-column:var(--animus-grid-column-md)}}@media (width>=1024px){.animus-dyn-grid-column-lg{grid-column:var(--animus-grid-column-lg)}}.animus-dyn-grid-row{grid-row:var(--animus-grid-row)}@media (width>=640px){.animus-dyn-grid-row-sm{grid-row:var(--animus-grid-row-sm)}}@media (width>=768px){.animus-dyn-grid-row-md{grid-row:var(--animus-grid-row-md)}}@media (width>=1024px){.animus-dyn-grid-row-lg{grid-row:var(--animus-grid-row-lg)}}.animus-dyn-overflow{overflow:var(--animus-overflow)}@media (width>=640px){.animus-dyn-overflow-sm{overflow:var(--animus-overflow-sm)}}@media (width>=768px){.animus-dyn-overflow-md{overflow:var(--animus-overflow-md)}}@media (width>=1024px){.animus-dyn-overflow-lg{overflow:var(--animus-overflow-lg)}}.animus-dyn-align-content{align-content:var(--animus-align-content)}@media (width>=640px){.animus-dyn-align-content-sm{align-content:var(--animus-align-content-sm)}}@media (width>=768px){.animus-dyn-align-content-md{align-content:var(--animus-align-content-md)}}@media (width>=1024px){.animus-dyn-align-content-lg{align-content:var(--animus-align-content-lg)}}.animus-dyn-align-items{align-items:var(--animus-align-items)}@media (width>=640px){.animus-dyn-align-items-sm{align-items:var(--animus-align-items-sm)}}@media (width>=768px){.animus-dyn-align-items-md{align-items:var(--animus-align-items-md)}}@media (width>=1024px){.animus-dyn-align-items-lg{align-items:var(--animus-align-items-lg)}}.animus-dyn-align-self{align-self:var(--animus-align-self)}@media (width>=640px){.animus-dyn-align-self-sm{align-self:var(--animus-align-self-sm)}}@media (width>=768px){.animus-dyn-align-self-md{align-self:var(--animus-align-self-md)}}@media (width>=1024px){.animus-dyn-align-self-lg{align-self:var(--animus-align-self-lg)}}.animus-dyn-bottom{bottom:var(--animus-bottom)}@media (width>=640px){.animus-dyn-bottom-sm{bottom:var(--animus-bottom-sm)}}@media (width>=768px){.animus-dyn-bottom-md{bottom:var(--animus-bottom-md)}}@media (width>=1024px){.animus-dyn-bottom-lg{bottom:var(--animus-bottom-lg)}}.animus-dyn-column-gap{column-gap:var(--animus-column-gap)}@media (width>=640px){.animus-dyn-column-gap-sm{column-gap:var(--animus-column-gap-sm)}}@media (width>=768px){.animus-dyn-column-gap-md{column-gap:var(--animus-column-gap-md)}}@media (width>=1024px){.animus-dyn-column-gap-lg{column-gap:var(--animus-column-gap-lg)}}.animus-dyn-display{display:var(--animus-display)}@media (width>=640px){.animus-dyn-display-sm{display:var(--animus-display-sm)}}@media (width>=768px){.animus-dyn-display-md{display:var(--animus-display-md)}}@media (width>=1024px){.animus-dyn-display-lg{display:var(--animus-display-lg)}}.animus-dyn-flex-basis{flex-basis:var(--animus-flex-basis)}@media (width>=640px){.animus-dyn-flex-basis-sm{flex-basis:var(--animus-flex-basis-sm)}}@media (width>=768px){.animus-dyn-flex-basis-md{flex-basis:var(--animus-flex-basis-md)}}@media (width>=1024px){.animus-dyn-flex-basis-lg{flex-basis:var(--animus-flex-basis-lg)}}.animus-dyn-flex-dir{flex-direction:var(--animus-flex-dir)}.animus-dyn-flex-direction{flex-direction:var(--animus-flex-direction)}@media (width>=640px){.animus-dyn-flex-dir-sm{flex-direction:var(--animus-flex-dir-sm)}.animus-dyn-flex-direction-sm{flex-direction:var(--animus-flex-direction-sm)}}@media (width>=768px){.animus-dyn-flex-dir-md{flex-direction:var(--animus-flex-dir-md)}.animus-dyn-flex-direction-md{flex-direction:var(--animus-flex-direction-md)}}@media (width>=1024px){.animus-dyn-flex-dir-lg{flex-direction:var(--animus-flex-dir-lg)}.animus-dyn-flex-direction-lg{flex-direction:var(--animus-flex-direction-lg)}}.animus-dyn-flex-grow{flex-grow:var(--animus-flex-grow)}@media (width>=640px){.animus-dyn-flex-grow-sm{flex-grow:var(--animus-flex-grow-sm)}}@media (width>=768px){.animus-dyn-flex-grow-md{flex-grow:var(--animus-flex-grow-md)}}@media (width>=1024px){.animus-dyn-flex-grow-lg{flex-grow:var(--animus-flex-grow-lg)}}.animus-dyn-flex-shrink{flex-shrink:var(--animus-flex-shrink)}@media (width>=640px){.animus-dyn-flex-shrink-sm{flex-shrink:var(--animus-flex-shrink-sm)}}@media (width>=768px){.animus-dyn-flex-shrink-md{flex-shrink:var(--animus-flex-shrink-md)}}@media (width>=1024px){.animus-dyn-flex-shrink-lg{flex-shrink:var(--animus-flex-shrink-lg)}}.animus-dyn-flex-wrap{flex-wrap:var(--animus-flex-wrap)}@media (width>=640px){.animus-dyn-flex-wrap-sm{flex-wrap:var(--animus-flex-wrap-sm)}}@media (width>=768px){.animus-dyn-flex-wrap-md{flex-wrap:var(--animus-flex-wrap-md)}}@media (width>=1024px){.animus-dyn-flex-wrap-lg{flex-wrap:var(--animus-flex-wrap-lg)}}.animus-dyn-font-size{font-size:var(--animus-font-size)}@media (width>=640px){.animus-dyn-font-size-sm{font-size:var(--animus-font-size-sm)}}@media (width>=768px){.animus-dyn-font-size-md{font-size:var(--animus-font-size-md)}}@media (width>=1024px){.animus-dyn-font-size-lg{font-size:var(--animus-font-size-lg)}}.animus-dyn-grid-column-end{grid-column-end:var(--animus-grid-column-end)}@media (width>=640px){.animus-dyn-grid-column-end-sm{grid-column-end:var(--animus-grid-column-end-sm)}}@media (width>=768px){.animus-dyn-grid-column-end-md{grid-column-end:var(--animus-grid-column-end-md)}}@media (width>=1024px){.animus-dyn-grid-column-end-lg{grid-column-end:var(--animus-grid-column-end-lg)}}.animus-dyn-grid-column-start{grid-column-start:var(--animus-grid-column-start)}@media (width>=640px){.animus-dyn-grid-column-start-sm{grid-column-start:var(--animus-grid-column-start-sm)}}@media (width>=768px){.animus-dyn-grid-column-start-md{grid-column-start:var(--animus-grid-column-start-md)}}@media (width>=1024px){.animus-dyn-grid-column-start-lg{grid-column-start:var(--animus-grid-column-start-lg)}}.animus-dyn-grid-row-end{grid-row-end:var(--animus-grid-row-end)}@media (width>=640px){.animus-dyn-grid-row-end-sm{grid-row-end:var(--animus-grid-row-end-sm)}}@media (width>=768px){.animus-dyn-grid-row-end-md{grid-row-end:var(--animus-grid-row-end-md)}}@media (width>=1024px){.animus-dyn-grid-row-end-lg{grid-row-end:var(--animus-grid-row-end-lg)}}.animus-dyn-grid-row-start{grid-row-start:var(--animus-grid-row-start)}@media (width>=640px){.animus-dyn-grid-row-start-sm{grid-row-start:var(--animus-grid-row-start-sm)}}@media (width>=768px){.animus-dyn-grid-row-start-md{grid-row-start:var(--animus-grid-row-start-md)}}@media (width>=1024px){.animus-dyn-grid-row-start-lg{grid-row-start:var(--animus-grid-row-start-lg)}}.animus-dyn-h{height:var(--animus-h)}.animus-dyn-height{height:var(--animus-height)}@media (width>=640px){.animus-dyn-h-sm{height:var(--animus-h-sm)}.animus-dyn-height-sm{height:var(--animus-height-sm)}}@media (width>=768px){.animus-dyn-h-md{height:var(--animus-h-md)}.animus-dyn-height-md{height:var(--animus-height-md)}}@media (width>=1024px){.animus-dyn-h-lg{height:var(--animus-h-lg)}.animus-dyn-height-lg{height:var(--animus-height-lg)}}.animus-dyn-justify-content{justify-content:var(--animus-justify-content)}@media (width>=640px){.animus-dyn-justify-content-sm{justify-content:var(--animus-justify-content-sm)}}@media (width>=768px){.animus-dyn-justify-content-md{justify-content:var(--animus-justify-content-md)}}@media (width>=1024px){.animus-dyn-justify-content-lg{justify-content:var(--animus-justify-content-lg)}}.animus-dyn-justify-items{justify-items:var(--animus-justify-items)}@media (width>=640px){.animus-dyn-justify-items-sm{justify-items:var(--animus-justify-items-sm)}}@media (width>=768px){.animus-dyn-justify-items-md{justify-items:var(--animus-justify-items-md)}}@media (width>=1024px){.animus-dyn-justify-items-lg{justify-items:var(--animus-justify-items-lg)}}.animus-dyn-justify-self{justify-self:var(--animus-justify-self)}@media (width>=640px){.animus-dyn-justify-self-sm{justify-self:var(--animus-justify-self-sm)}}@media (width>=768px){.animus-dyn-justify-self-md{justify-self:var(--animus-justify-self-md)}}@media (width>=1024px){.animus-dyn-justify-self-lg{justify-self:var(--animus-justify-self-lg)}}.animus-dyn-left{left:var(--animus-left)}@media (width>=640px){.animus-dyn-left-sm{left:var(--animus-left-sm)}}@media (width>=768px){.animus-dyn-left-md{left:var(--animus-left-md)}}@media (width>=1024px){.animus-dyn-left-lg{left:var(--animus-left-lg)}}.animus-dyn-mb{margin-bottom:var(--animus-mb)}@media (width>=640px){.animus-dyn-mb-sm{margin-bottom:var(--animus-mb-sm)}}@media (width>=768px){.animus-dyn-mb-md{margin-bottom:var(--animus-mb-md)}}@media (width>=1024px){.animus-dyn-mb-lg{margin-bottom:var(--animus-mb-lg)}}.animus-dyn-ml{margin-left:var(--animus-ml)}.animus-dyn-mx{margin-left:var(--animus-mx);margin-right:var(--animus-mx)}@media (width>=640px){.animus-dyn-ml-sm{margin-left:var(--animus-ml-sm)}.animus-dyn-mx-sm{margin-left:var(--animus-mx-sm);margin-right:var(--animus-mx-sm)}}@media (width>=768px){.animus-dyn-ml-md{margin-left:var(--animus-ml-md)}.animus-dyn-mx-md{margin-left:var(--animus-mx-md);margin-right:var(--animus-mx-md)}}@media (width>=1024px){.animus-dyn-ml-lg{margin-left:var(--animus-ml-lg)}.animus-dyn-mx-lg{margin-left:var(--animus-mx-lg);margin-right:var(--animus-mx-lg)}}.animus-dyn-mr{margin-right:var(--animus-mr)}@media (width>=640px){.animus-dyn-mr-sm{margin-right:var(--animus-mr-sm)}}@media (width>=768px){.animus-dyn-mr-md{margin-right:var(--animus-mr-md)}}@media (width>=1024px){.animus-dyn-mr-lg{margin-right:var(--animus-mr-lg)}}.animus-dyn-mt{margin-top:var(--animus-mt)}.animus-dyn-my{margin-top:var(--animus-my);margin-bottom:var(--animus-my)}@media (width>=640px){.animus-dyn-mt-sm{margin-top:var(--animus-mt-sm)}.animus-dyn-my-sm{margin-top:var(--animus-my-sm);margin-bottom:var(--animus-my-sm)}}@media (width>=768px){.animus-dyn-mt-md{margin-top:var(--animus-mt-md)}.animus-dyn-my-md{margin-top:var(--animus-my-md);margin-bottom:var(--animus-my-md)}}@media (width>=1024px){.animus-dyn-mt-lg{margin-top:var(--animus-mt-lg)}.animus-dyn-my-lg{margin-top:var(--animus-my-lg);margin-bottom:var(--animus-my-lg)}}.animus-dyn-max-h{max-height:var(--animus-max-h)}.animus-dyn-max-height{max-height:var(--animus-max-height)}@media (width>=640px){.animus-dyn-max-h-sm{max-height:var(--animus-max-h-sm)}.animus-dyn-max-height-sm{max-height:var(--animus-max-height-sm)}}@media (width>=768px){.animus-dyn-max-h-md{max-height:var(--animus-max-h-md)}.animus-dyn-max-height-md{max-height:var(--animus-max-height-md)}}@media (width>=1024px){.animus-dyn-max-h-lg{max-height:var(--animus-max-h-lg)}.animus-dyn-max-height-lg{max-height:var(--animus-max-height-lg)}}.animus-dyn-max-w{max-width:var(--animus-max-w)}.animus-dyn-max-width{max-width:var(--animus-max-width)}@media (width>=640px){.animus-dyn-max-w-sm{max-width:var(--animus-max-w-sm)}.animus-dyn-max-width-sm{max-width:var(--animus-max-width-sm)}}@media (width>=768px){.animus-dyn-max-w-md{max-width:var(--animus-max-w-md)}.animus-dyn-max-width-md{max-width:var(--animus-max-width-md)}}@media (width>=1024px){.animus-dyn-max-w-lg{max-width:var(--animus-max-w-lg)}.animus-dyn-max-width-lg{max-width:var(--animus-max-width-lg)}}.animus-dyn-min-h{min-height:var(--animus-min-h)}.animus-dyn-min-height{min-height:var(--animus-min-height)}@media (width>=640px){.animus-dyn-min-h-sm{min-height:var(--animus-min-h-sm)}.animus-dyn-min-height-sm{min-height:var(--animus-min-height-sm)}}@media (width>=768px){.animus-dyn-min-h-md{min-height:var(--animus-min-h-md)}.animus-dyn-min-height-md{min-height:var(--animus-min-height-md)}}@media (width>=1024px){.animus-dyn-min-h-lg{min-height:var(--animus-min-h-lg)}.animus-dyn-min-height-lg{min-height:var(--animus-min-height-lg)}}.animus-dyn-min-w{min-width:var(--animus-min-w)}.animus-dyn-min-width{min-width:var(--animus-min-width)}@media (width>=640px){.animus-dyn-min-w-sm{min-width:var(--animus-min-w-sm)}.animus-dyn-min-width-sm{min-width:var(--animus-min-width-sm)}}@media (width>=768px){.animus-dyn-min-w-md{min-width:var(--animus-min-w-md)}.animus-dyn-min-width-md{min-width:var(--animus-min-width-md)}}@media (width>=1024px){.animus-dyn-min-w-lg{min-width:var(--animus-min-w-lg)}.animus-dyn-min-width-lg{min-width:var(--animus-min-width-lg)}}.animus-dyn-opacity{opacity:var(--animus-opacity)}@media (width>=640px){.animus-dyn-opacity-sm{opacity:var(--animus-opacity-sm)}}@media (width>=768px){.animus-dyn-opacity-md{opacity:var(--animus-opacity-md)}}@media (width>=1024px){.animus-dyn-opacity-lg{opacity:var(--animus-opacity-lg)}}.animus-dyn-order{order:var(--animus-order)}@media (width>=640px){.animus-dyn-order-sm{order:var(--animus-order-sm)}}@media (width>=768px){.animus-dyn-order-md{order:var(--animus-order-md)}}@media (width>=1024px){.animus-dyn-order-lg{order:var(--animus-order-lg)}}.animus-dyn-overflow-x{overflow-x:var(--animus-overflow-x)}@media (width>=640px){.animus-dyn-overflow-x-sm{overflow-x:var(--animus-overflow-x-sm)}}@media (width>=768px){.animus-dyn-overflow-x-md{overflow-x:var(--animus-overflow-x-md)}}@media (width>=1024px){.animus-dyn-overflow-x-lg{overflow-x:var(--animus-overflow-x-lg)}}.animus-dyn-overflow-y{overflow-y:var(--animus-overflow-y)}@media (width>=640px){.animus-dyn-overflow-y-sm{overflow-y:var(--animus-overflow-y-sm)}}@media (width>=768px){.animus-dyn-overflow-y-md{overflow-y:var(--animus-overflow-y-md)}}@media (width>=1024px){.animus-dyn-overflow-y-lg{overflow-y:var(--animus-overflow-y-lg)}}.animus-dyn-pb{padding-bottom:var(--animus-pb)}@media (width>=640px){.animus-dyn-pb-sm{padding-bottom:var(--animus-pb-sm)}}@media (width>=768px){.animus-dyn-pb-md{padding-bottom:var(--animus-pb-md)}}@media (width>=1024px){.animus-dyn-pb-lg{padding-bottom:var(--animus-pb-lg)}}.animus-dyn-pl{padding-left:var(--animus-pl)}.animus-dyn-px{padding-left:var(--animus-px);padding-right:var(--animus-px)}@media (width>=640px){.animus-dyn-pl-sm{padding-left:var(--animus-pl-sm)}.animus-dyn-px-sm{padding-left:var(--animus-px-sm);padding-right:var(--animus-px-sm)}}@media (width>=768px){.animus-dyn-pl-md{padding-left:var(--animus-pl-md)}.animus-dyn-px-md{padding-left:var(--animus-px-md);padding-right:var(--animus-px-md)}}@media (width>=1024px){.animus-dyn-pl-lg{padding-left:var(--animus-pl-lg)}.animus-dyn-px-lg{padding-left:var(--animus-px-lg);padding-right:var(--animus-px-lg)}}.animus-dyn-pr{padding-right:var(--animus-pr)}@media (width>=640px){.animus-dyn-pr-sm{padding-right:var(--animus-pr-sm)}}@media (width>=768px){.animus-dyn-pr-md{padding-right:var(--animus-pr-md)}}@media (width>=1024px){.animus-dyn-pr-lg{padding-right:var(--animus-pr-lg)}}.animus-dyn-pt{padding-top:var(--animus-pt)}.animus-dyn-py{padding-top:var(--animus-py);padding-bottom:var(--animus-py)}@media (width>=640px){.animus-dyn-pt-sm{padding-top:var(--animus-pt-sm)}.animus-dyn-py-sm{padding-top:var(--animus-py-sm);padding-bottom:var(--animus-py-sm)}}@media (width>=768px){.animus-dyn-pt-md{padding-top:var(--animus-pt-md)}.animus-dyn-py-md{padding-top:var(--animus-py-md);padding-bottom:var(--animus-py-md)}}@media (width>=1024px){.animus-dyn-pt-lg{padding-top:var(--animus-pt-lg)}.animus-dyn-py-lg{padding-top:var(--animus-py-lg);padding-bottom:var(--animus-py-lg)}}.animus-dyn-pos{position:var(--animus-pos)}.animus-dyn-position{position:var(--animus-position)}@media (width>=640px){.animus-dyn-pos-sm{position:var(--animus-pos-sm)}.animus-dyn-position-sm{position:var(--animus-position-sm)}}@media (width>=768px){.animus-dyn-pos-md{position:var(--animus-pos-md)}.animus-dyn-position-md{position:var(--animus-position-md)}}@media (width>=1024px){.animus-dyn-pos-lg{position:var(--animus-pos-lg)}.animus-dyn-position-lg{position:var(--animus-position-lg)}}.animus-dyn-right{right:var(--animus-right)}@media (width>=640px){.animus-dyn-right-sm{right:var(--animus-right-sm)}}@media (width>=768px){.animus-dyn-right-md{right:var(--animus-right-md)}}@media (width>=1024px){.animus-dyn-right-lg{right:var(--animus-right-lg)}}.animus-dyn-row-gap{row-gap:var(--animus-row-gap)}@media (width>=640px){.animus-dyn-row-gap-sm{row-gap:var(--animus-row-gap-sm)}}@media (width>=768px){.animus-dyn-row-gap-md{row-gap:var(--animus-row-gap-md)}}@media (width>=1024px){.animus-dyn-row-gap-lg{row-gap:var(--animus-row-gap-lg)}}.animus-dyn-inset{top:var(--animus-inset);right:var(--animus-inset);bottom:var(--animus-inset);left:var(--animus-inset)}.animus-dyn-top{top:var(--animus-top)}@media (width>=640px){.animus-dyn-inset-sm{top:var(--animus-inset-sm);right:var(--animus-inset-sm);bottom:var(--animus-inset-sm);left:var(--animus-inset-sm)}.animus-dyn-top-sm{top:var(--animus-top-sm)}}@media (width>=768px){.animus-dyn-inset-md{top:var(--animus-inset-md);right:var(--animus-inset-md);bottom:var(--animus-inset-md);left:var(--animus-inset-md)}.animus-dyn-top-md{top:var(--animus-top-md)}}@media (width>=1024px){.animus-dyn-inset-lg{top:var(--animus-inset-lg);right:var(--animus-inset-lg);bottom:var(--animus-inset-lg);left:var(--animus-inset-lg)}.animus-dyn-top-lg{top:var(--animus-top-lg)}}.animus-dyn-vertical-align{vertical-align:var(--animus-vertical-align)}@media (width>=640px){.animus-dyn-vertical-align-sm{vertical-align:var(--animus-vertical-align-sm)}}@media (width>=768px){.animus-dyn-vertical-align-md{vertical-align:var(--animus-vertical-align-md)}}@media (width>=1024px){.animus-dyn-vertical-align-lg{vertical-align:var(--animus-vertical-align-lg)}}.animus-dyn-size{width:var(--animus-size);height:var(--animus-size)}.animus-dyn-w{width:var(--animus-w)}.animus-dyn-width{width:var(--animus-width)}@media (width>=640px){.animus-dyn-size-sm{width:var(--animus-size-sm);height:var(--animus-size-sm)}.animus-dyn-w-sm{width:var(--animus-w-sm)}.animus-dyn-width-sm{width:var(--animus-width-sm)}}@media (width>=768px){.animus-dyn-size-md{width:var(--animus-size-md);height:var(--animus-size-md)}.animus-dyn-w-md{width:var(--animus-w-md)}.animus-dyn-width-md{width:var(--animus-width-md)}}@media (width>=1024px){.animus-dyn-size-lg{width:var(--animus-size-lg);height:var(--animus-size-lg)}.animus-dyn-w-lg{width:var(--animus-w-lg)}.animus-dyn-width-lg{width:var(--animus-width-lg)}}.animus-dyn-z-index{z-index:var(--animus-z-index)}@media (width>=640px){.animus-dyn-z-index-sm{z-index:var(--animus-z-index-sm)}}@media (width>=768px){.animus-dyn-z-index-md{z-index:var(--animus-z-index-md)}}@media (width>=1024px){.animus-dyn-z-index-lg{z-index:var(--animus-z-index-lg)}}} \ No newline at end of file diff --git a/packages/oracle/__tests__/host-universe.test.ts b/packages/oracle/__tests__/host-universe.test.ts index a7aed5d3..a3744c7b 100644 --- a/packages/oracle/__tests__/host-universe.test.ts +++ b/packages/oracle/__tests__/host-universe.test.ts @@ -58,7 +58,7 @@ describe('createAnimusHost — the style universe over the emitted artifacts', ( } expect(host.program).toMatchObject({ kind: 'analysis-artifacts' }); expect(host.program.label).toBe( - 'animus-commit:410fa0bb91141167e1cad2d6cd6dd150' + 'animus-commit:b06d23b64b8afc57701072492fe0ec10' ); }); diff --git a/packages/showcase/CLAUDE.md b/packages/showcase/CLAUDE.md index 150fdc16..57ecdfb1 100644 --- a/packages/showcase/CLAUDE.md +++ b/packages/showcase/CLAUDE.md @@ -31,7 +31,7 @@ Each component is in its own file (1 named export per file). This structure exer ## Design System (`src/ds.ts`) -- `createSystem().addGroup().build()` returns `{ system: ds, createGlobalStyles }` +- `createSystem().addGroup().build()` returns the bundle (`{ system, createGlobalStyles, createKeyframes, registerKeyframes, seal }`); `ds` is the SEALED instance from `bundle.seal()` (vocabulary-registration) - `createGlobalStyles()` is a factory returned from `.build()`, used to define global/reset styles - Tokens built separately via `createTheme()` and exported as `tokens`. Theme type augmented via `declare module`. - Custom transforms: `fluid` (clamp-based responsive), `ratio` (aspect-ratio) diff --git a/packages/showcase/src/App.tsx b/packages/showcase/src/App.tsx index d871c369..d0cb0703 100644 --- a/packages/showcase/src/App.tsx +++ b/packages/showcase/src/App.tsx @@ -1,94 +1,38 @@ -import type { ComponentType } from 'react'; -import { lazy, Suspense, useEffect, useState } from 'react'; -import { BrowserRouter, Navigate, Route, Routes } from 'react-router-dom'; +import { lazy, Suspense } from 'react'; +import { BrowserRouter, Link, Route, Routes } from 'react-router-dom'; -import { DOCS_NAV, hasChildren } from './constants/docsNav'; import { DocsLayout } from './layout/DocsLayout'; import { Shell } from './layout/Shell'; -import type { NavEntry } from './constants/docsNav'; - const Home = lazy(() => import('./pages/Home')); const Examples = lazy(() => import('./pages/Examples')); -const contentModules = import.meta.glob('./content/**/*.mdx', { - import: 'default', -}); - -function DocPage({ contentKey }: { contentKey: string }) { - const [Content, setContent] = useState(null); - const loader = contentModules[`./content/${contentKey}.mdx`]; - - useEffect(() => { - setContent(null); - if (loader) { - loader().then((mod) => setContent(() => mod)); - } - }, [loader]); - - if (!loader) return ; - if (Content === null) return null; - return ; -} - -function generateDocRoutes(nav: NavEntry[]) { - return nav.map((entry) => { - if (hasChildren(entry)) { - const segment = entry.path.replace('/docs/', ''); - const firstChild = entry.children[0]; - return ( - - } /> - {entry.children.map((child) => { - const childSegment = child.path.split('/').pop()!; - const contentKey = child.path.replace('/docs/', ''); - return ( - } - /> - ); - })} - - ); - } - - // Top-level leaf entries - if (entry.path === '/docs') { - return ( - } - /> - ); - } - - // Examples is a custom component, not markdown - if (entry.path === '/docs/examples') { - return ( - - - - } - /> - ); - } - - const segment = entry.path.replace('/docs/', ''); - return ( - } - /> - ); - }); +// The MDX guides were deleted, not archived: the system-definition API is +// still settling and every written page had drifted into teaching shapes +// the current pipeline rejects. Examples stay — they are extracted, built, +// and asserted on every verify run, so they cannot silently drift. +function DocsPlaceholder() { + return ( +
+

+ Documentation is offline +

+

+ The system-definition API is still settling, and written guides kept + drifting out of truth. They have been removed until the API freezes. The{' '} + Examples are live, extracted code and + remain accurate. +

+
+ ); } function NotFound() { @@ -118,7 +62,15 @@ export default function App() { } /> }> - {generateDocRoutes(DOCS_NAV)} + } /> + + + + } + /> } /> diff --git a/packages/showcase/src/constants/docsNav.ts b/packages/showcase/src/constants/docsNav.ts index 48ff7273..d0ab3e93 100644 --- a/packages/showcase/src/constants/docsNav.ts +++ b/packages/showcase/src/constants/docsNav.ts @@ -15,89 +15,9 @@ export function hasChildren(entry: NavEntry): entry is NavSection { return 'children' in entry && entry.children.length > 0; } +// The written guides were removed until the system-definition API settles +// (vocabulary-registration); restore sections here when they return. export const DOCS_NAV: NavEntry[] = [ - { label: 'Introduction', path: '/docs' }, - { label: 'Getting Started', path: '/docs/start' }, - { - label: 'Component Authoring', - path: '/docs/authoring', - children: [ - { label: 'Base Styling', path: '/docs/authoring/base-styling' }, - { - label: 'Variants & States', - path: '/docs/authoring/variants-states', - }, - { label: 'Selectors & Nesting', path: '/docs/authoring/selectors' }, - { label: 'Conditions', path: '/docs/authoring/conditions' }, - { label: 'System Props', path: '/docs/authoring/system-props' }, - { - label: 'Custom Props & Transforms', - path: '/docs/authoring/custom-props', - }, - { label: 'Composition', path: '/docs/authoring/composition' }, - { label: 'Recipes & Patterns', path: '/docs/authoring/recipes' }, - ], - }, - { - label: 'Architecture & Theming', - path: '/docs/architecture', - children: [ - { label: 'Theming & Tokens', path: '/docs/architecture/theming' }, - { label: 'Color Modes', path: '/docs/architecture/color-modes' }, - { label: 'System Setup', path: '/docs/architecture/system-setup' }, - { - label: 'Theme Extension', - path: '/docs/architecture/theme-extension', - }, - { - label: 'Library Authoring', - path: '/docs/architecture/library-authoring', - }, - { label: 'Global Styles', path: '/docs/architecture/global-styles' }, - ], - }, - { - label: 'Integrations', - path: '/docs/compiler', - children: [ - { label: 'Vite Plugin', path: '/docs/compiler/vite-plugin' }, - { label: 'Next.js & Remix', path: '/docs/compiler/nextjs-remix' }, - ], - }, - { - label: 'Advanced', - path: '/docs/advanced', - children: [ - { label: 'TypeScript', path: '/docs/advanced/typescript' }, - { - label: 'Framework Agnostic', - path: '/docs/advanced/framework-agnostic', - }, - { label: 'Svelte', path: '/docs/advanced/svelte' }, - { - label: 'Extraction & CSS Output', - path: '/docs/advanced/extraction', - }, - ], - }, - { - label: 'Reference', - path: '/docs/reference', - children: [ - { label: 'Builder Chain', path: '/docs/reference/builder-chain' }, - { label: 'createTheme()', path: '/docs/reference/create-theme' }, - { label: 'createSystem()', path: '/docs/reference/create-system' }, - { label: 'compose()', path: '/docs/reference/compose' }, - ], - }, - { - label: 'Support', - path: '/docs/support', - children: [ - { label: 'Troubleshooting', path: '/docs/support/troubleshooting' }, - { label: 'Migration & Adoption', path: '/docs/support/migration' }, - { label: 'Kitchen Sink', path: '/docs/support/component-test' }, - ], - }, + { label: 'Overview', path: '/docs' }, { label: 'Examples', path: '/docs/examples' }, ]; diff --git a/packages/showcase/src/content/advanced/extraction.mdx b/packages/showcase/src/content/advanced/extraction.mdx deleted file mode 100644 index ce84123f..00000000 --- a/packages/showcase/src/content/advanced/extraction.mdx +++ /dev/null @@ -1,291 +0,0 @@ -import { ChainStep } from '../../components/docs/ChainStep'; -import { CodeExample } from '../../components/docs/CodeExample'; -import { BeforeAfter } from '../../components/docs/BeforeAfter'; -import { Callout } from '../../components/docs/Callout'; - -# Static Extraction & CSS Output - -Animus performs static analysis at build time — no runtime style computation, no style injection. The Vite plugin drives a Rust NAPI crate that reads every source file, walks builder chains, evaluates style values, and emits a complete `@layer`-structured stylesheet before the browser ever loads a byte. - -This page explains how that pipeline works from source to CSS. - ---- - -## The Extraction Pipeline - -`project_analyzer.rs` orchestrates extraction as a six-phase pipeline over the entire source file set. - - → records "primary" usage for Button.intent -// An "intent" option never used in JSX is pruned before CSS emit`, - }, - { - label: 'Generate', - layer: 'emit', - description: - 'css_generator emits @layer-structured CSS for all surviving component definitions. transform_emitter builds createComponent() replacement strings for each builder chain terminal. The manifest (UniverseManifest) is returned as JSON to the plugin.', - code: `// Output: manifest JSON containing css, sheets, components, utilities -// Plugin then runs transform resolution subprocess if __TRANSFORM__ markers exist`, - }, - ]} -/> - - - Chain walking and JSX scanning are separate passes because they need different - traversal strategies. The chain walker walks expression statements backward - from terminals. The JSX scanner walks element trees looking for component - usage. Combining them into one pass would require a shared traversal that - serves neither well. - - - - `