{
  "meta": {
    "name": "Baseline Design Tokens",
    "version": "0.1.0",
    "generated_from": "aleris-tokens.css",
    "generated_at": "2026-09-17",
    "generator": "generate-tokens-json.js",
    "governance": "CSS is source of truth. Regenerate if JSON and CSS disagree."
  },
  "layers": {
    "primitives": {
      "color-brand": {
        "--color-petrol-100": {
          "value": "#d9e1e2",
          "usage": "Tinted backgrounds, selected row, inverted primary hover fill",
          "constraint": "Never as text color"
        },
        "--color-petrol-200": {
          "value": "#abc7c9",
          "usage": "Tinted backgrounds a step down from petrol-100",
          "constraint": "Never as text color – too light"
        },
        "--color-petrol-300": {
          "value": "#7fa9ae",
          "usage": "Secondary accents, hover tints",
          "constraint": "Not for body text – too light. Never behind white text: 2.56:1"
        },
        "--color-petrol-400": {
          "value": "#4f868e",
          "usage": "Mid petrol for structure and accents",
          "constraint": "Not for body text"
        },
        "--color-petrol-450": {
          "value": "#0f6b73",
          "usage": "The far stop of --surface-gradient-cold, and the petrol to reach for on any petrol ground light text sits on",
          "constraint": "Measured 2026-09-13, all four light roles clear 1.4.3's 4.5:1 body floor on it: white 6.23:1, petrol-100 4.69:1, sand-50 5.88:1, sand-100 5.31:1. VALUE TAKEN FROM sundviktlakemedel, which minted this token under this exact name on 2026-09-02, eleven days before Brand OS did, and for the same reason — a ghost Button inside its WaitPanel rendered at 1.00:1 against the top-left of its own gradient panel, so five of seven seeded patients had an unreachable action on their home screen. Brand OS independently added the same name at #437d85 on 2026-09-13, chosen as minimum headroom over white alone and placed on the petrol-500 → petrol-400 interpolation so the gradient's appearance would not change. That criterion was too narrow: at #437d85 petrol-100 measures 3.51:1 and a secondary line fails, which the consumer's value had already solved. Torfinn ruled for the consumer's value on 2026-09-13. IT IS NOT ON THE INTERPOLATION LINE — it is a deeper, more saturated teal, 52/18/18 in RGB from #437d85 — so the gradient does look different, and that is the cost of the wider floor rather than an oversight."
        },
        "--color-petrol-500": {
          "value": "#004851",
          "usage": "Primary text, headings, structural elements",
          "constraint": "Default text color. Only specify when deviating"
        },
        "--color-petrol-700": {
          "value": "#003238",
          "usage": "Secondary/confirm button press fill",
          "constraint": "Interaction only, never decorative or print. White text 13.88:1. Added 2026-08-05, card 19 – hover no longer needs a colour step (card 16, the hover/focus merge), so only the press step was needed, not the petrol-600 the design return also proposed"
        },
        "--color-sand-50": {
          "value": "#faf8f6",
          "usage": "Page background for instrumental surfaces",
          "constraint": "Tools, admin, dashboards only. Communicative uses sand-100"
        },
        "--color-sand-100": {
          "value": "#f2ece4",
          "usage": "Page background for communicative surfaces",
          "constraint": "Patient-facing, marketing, booking. Never use white as page bg"
        },
        "--color-sand-300": {
          "value": "#e7ceb5"
        },
        "--color-sand-500": {
          "value": "#d9b48f"
        },
        "--color-orange-100": {
          "value": "#fde8df"
        },
        "--color-orange-200": {
          "value": "#fbd1c0",
          "usage": "Soft tint, backgrounds and surfaces. Print and digital",
          "constraint": "Decorative/background only, not for interactive states"
        },
        "--color-orange-300": {
          "value": "#ffbe9f",
          "usage": "Light accent backgrounds, soft orange tints",
          "constraint": "Decorative/background only, not for interactive states"
        },
        "--color-orange-400": {
          "value": "#faaa8d",
          "usage": "Accent tint, backgrounds and surfaces. Print and digital",
          "constraint": "Decorative/background only, not for interactive states. Never an interactive state – this is the exact hex the retired primary hover pointed at"
        },
        "--color-orange-500": {
          "value": "#f58c61",
          "usage": "Accent, decorative, print. The brand orange",
          "constraint": "Brand use only. Never an interactive state or interactive fill – use orange-600/700"
        },
        "--color-orange-600": {
          "value": "#d14811",
          "usage": "Primary button fill, interactive orange",
          "constraint": "Interaction only, never decorative or print. White text 4.52:1. Never on a petrol surface"
        },
        "--color-orange-700": {
          "value": "#b23c0e",
          "usage": "Interaction hover and active fill",
          "constraint": "Interaction only, never decorative or print. White text 5.92:1"
        }
      },
      "color-legacy": {
        "--color-legacy-teal": {
          "value": "#00c6b2",
          "usage": "Legacy / heritage brand colour (formerly \"turquoise\"); existing surfaces only, predominantly Norway",
          "constraint": "Not for new work; replace on touch. In-set legacy — conformance warns, never errors, on new use",
          "tier": "legacy"
        }
      },
      "color-neutral": {
        "--color-gray-100": {
          "value": "#d7d2cb"
        },
        "--color-gray-300": {
          "value": "#9e9281"
        },
        "--color-gray-500": {
          "value": "#585044"
        },
        "--color-white": {
          "value": "#ffffff",
          "usage": "Card/surface backgrounds, inverse text bg",
          "constraint": "Never as page background. Pages are sand-100 or sand-50"
        }
      },
      "color-feedback": {
        "--color-error-500": {
          "value": "#c14444",
          "usage": "Validation errors, destructive actions",
          "constraint": "State communication only. Never decoration"
        },
        "--color-warning-500": {
          "value": "#d9b48f",
          "usage": "Warning states, caution indicators",
          "constraint": "State communication only. Same hex as sand-500 — context differentiates"
        }
      },
      "color": {
        "--color-info-500": {
          "value": "#007bc7",
          "usage": "Informational states — neutral notices that are neither a problem nor a completion",
          "constraint": "Indicator, or text on white only. Measured 2026-09-13: 4.51:1 on white, 4.26:1 on sand-50, 3.84:1 on sand-100 — so it clears AA for text on white and NOT on either sand ground, the same shape as confirm-500 and governed by the same rule (BASELINE.md § Forms, card 118: state text sits on a white card or an instrumental ground, never directly on the communicative one). Clears the 3:1 boundary floor on all three as a UI component. Added 2026-09-13, board card 156, because the design-system export carried an informational state the token set had no name for. Its value there was petrol-500, which is --text-primary — an info state in body-text colour does not read as a state, so this takes the blue already in the system as --color-goal-no-data rather than that. NOT an alias of that token: the goal set is constrained \"Dashboard only, never patient-facing\", and tying a general status to it would give one value two unrelated roles with nothing comparing them. Same hex, separate declarations, on the precedent warning-500/sand-500 already set."
        }
      },
      "color-confirm": {
        "--color-confirm-500": {
          "value": "#4f866e",
          "usage": "Completion indicator – status dots, badges, chips",
          "constraint": "Indicator only, never an interactive fill: white on it is 4.23:1. Distinct from goal-achieved green, which indicates \"target met\""
        }
      },
      "color-goal-status": {
        "--color-goal-achieved": {
          "value": "#2e8540",
          "usage": "KPI target met indicator",
          "constraint": "Dashboard only. Always pair with icon/shape. Never for interactive confirm"
        },
        "--color-goal-borderline": {
          "value": "#ffb81c",
          "usage": "KPI near-target indicator",
          "constraint": "Dashboard only. Always pair with icon/shape"
        },
        "--color-goal-missed": {
          "value": "#d4351c",
          "usage": "KPI target missed indicator",
          "constraint": "Dashboard only. Always pair with icon/shape"
        },
        "--color-goal-no-data": {
          "value": "#007bc7",
          "usage": "KPI no-data indicator",
          "constraint": "Dashboard only. Always pair with icon/shape"
        }
      },
      "color-chart": {
        "--color-chart-01-teal": {
          "value": "#0f9081"
        },
        "--color-chart-02-mint": {
          "value": "#94cbc4"
        },
        "--color-chart-03-blue": {
          "value": "#577ba3"
        },
        "--color-chart-04-blue-light": {
          "value": "#98c9ef"
        },
        "--color-chart-05-purple": {
          "value": "#a078c2"
        },
        "--color-chart-06-purple-light": {
          "value": "#d8b8ef"
        },
        "--color-chart-07-terracotta": {
          "value": "#d77a61"
        },
        "--color-chart-08-terracotta-light": {
          "value": "#f0c3b2"
        },
        "--color-chart-09-marine": {
          "value": "#6b9495"
        },
        "--color-chart-10-olive": {
          "value": "#bed0c0"
        },
        "--color-chart-11-warm-grey": {
          "value": "#e4ded5"
        },
        "--color-chart-12-dark-sand": {
          "value": "#d9b48f"
        }
      },
      "spacing": {
        "--spacing-0": {
          "value": "0px",
          "usage": "Zero gap, collapsed state",
          "constraint": "Use explicitly — don't omit spacing, set it to 0"
        },
        "--spacing-3xs": {
          "value": "4px",
          "usage": "Minimum gap, icon padding, label-to-field",
          "constraint": "Smallest usable gap. Never go below this"
        },
        "--spacing-2xs": {
          "value": "8px",
          "usage": "Tight element spacing, inline gaps",
          "constraint": "Related inline elements"
        },
        "--spacing-xs": {
          "value": "12px",
          "usage": "Related element spacing, input padding-y",
          "constraint": "Default vertical rhythm within components"
        },
        "--spacing-sm": {
          "value": "16px",
          "usage": "Default component padding, grid margin mobile",
          "constraint": "Most common padding value"
        },
        "--spacing-md": {
          "value": "24px",
          "usage": "Section spacing within components, card padding",
          "constraint": "Primary structural spacing"
        },
        "--spacing-lg": {
          "value": "36px",
          "usage": "Between components, above h2",
          "constraint": "Component-level separation"
        },
        "--spacing-xl": {
          "value": "48px",
          "usage": "Between sections",
          "constraint": "Section-level separation"
        },
        "--spacing-2xl": {
          "value": "72px",
          "usage": "Major section breaks",
          "constraint": "Communicative surfaces mainly"
        },
        "--spacing-3xl": {
          "value": "96px",
          "usage": "Page-level spacing",
          "constraint": "Communicative surfaces only. Never on instrumental"
        }
      },
      "radius": {
        "--radius-0": {
          "value": "0px",
          "usage": "Sharp corners, full-bleed edges",
          "constraint": "Explicit removal of rounding"
        },
        "--radius-s": {
          "value": "4px",
          "usage": "General containers: panels, modals, tables",
          "constraint": "General container tier. Cards use --radius-l instead. Not for buttons or inputs"
        },
        "--radius-l": {
          "value": "16px",
          "usage": "Cards only",
          "constraint": "Card tier, decided 2026-08-10 (board card 45) from a live production measurement. Not a general container value"
        },
        "--radius-m": {
          "value": "8px",
          "usage": "Interactive: buttons, inputs, dropdowns",
          "constraint": "Interactive element tier. Not for containers"
        },
        "--radius-full": {
          "value": "100px",
          "usage": "Compact indicators: badges, tags, avatars",
          "constraint": "Indicator tier only. No full-pill buttons exist in Aleris"
        }
      },
      "stroke": {
        "--stroke-0": {
          "value": "0px"
        },
        "--stroke-xs": {
          "value": "1px"
        },
        "--stroke-m": {
          "value": "2px"
        },
        "--stroke-xl": {
          "value": "4px"
        }
      },
      "typography": {
        "--font-family-primary": {
          "value": "'Museo Sans', Arial, sans-serif"
        },
        "--font-family-fallback": {
          "value": "Arial, sans-serif"
        },
        "--font-family-icons": {
          "value": "'Font Awesome 6 Pro'"
        },
        "--font-size-xs": {
          "value": "0.875rem"
        },
        "--font-size-sm": {
          "value": "1rem"
        },
        "--font-size-base": {
          "value": "1.125rem"
        },
        "--font-size-md": {
          "value": "1.375rem"
        },
        "--font-size-lg": {
          "value": "1.6875rem"
        },
        "--font-size-xl": {
          "value": "2.5rem"
        },
        "--font-size-2xl": {
          "value": "3.75rem"
        },
        "--font-weight-light": {
          "value": "300",
          "usage": "Large display text on communicative surfaces",
          "constraint": "Exceptional use only. Size must be xl (40px) or above"
        },
        "--font-weight-regular": {
          "value": "500",
          "usage": "Body text, labels, buttons, UI chrome",
          "constraint": "The workhorse. Never use 400 — Museo Sans has no 400 weight"
        },
        "--font-weight-bold": {
          "value": "700",
          "usage": "Headings, emphasis, CTAs",
          "constraint": "The other workhorse. 500 and 700 are the system"
        },
        "--font-weight-black": {
          "value": "900",
          "usage": "Almost never",
          "constraint": "Exceptional use only. Try 700 at larger size first"
        },
        "--line-height-tight": {
          "value": "1.1"
        },
        "--line-height-heading": {
          "value": "1.2"
        },
        "--line-height-subheading": {
          "value": "1.33"
        },
        "--line-height-body": {
          "value": "1.5"
        },
        "--letter-spacing-normal": {
          "value": "0"
        },
        "--letter-spacing-tight": {
          "value": "-0.01em"
        },
        "--letter-spacing-tighter": {
          "value": "-0.015em"
        },
        "--letter-spacing-tightest": {
          "value": "-0.02em"
        }
      },
      "elevation": {
        "--shadow-e0": {
          "value": "0px 0px 0px rgba(0, 72, 81, 0)"
        },
        "--shadow-e1": {
          "value": "-1px 1px 2px rgba(0, 72, 81, 0.04), -1px 2px 8px rgba(0, 72, 81, 0.06)"
        },
        "--shadow-e2": {
          "value": "-2px 2px 4px rgba(0, 72, 81, 0.06), -3px 8px 24px rgba(0, 72, 81, 0.1)"
        },
        "--shadow-e3": {
          "value": "-3px 8px 16px rgba(0, 72, 81, 0.08), -6px 24px 48px rgba(0, 72, 81, 0.16)"
        }
      },
      "grid": {
        "--grid-columns": {
          "value": "12"
        },
        "--grid-gutter": {
          "value": "var(--spacing-md)",
          "references": "--spacing-md"
        },
        "--grid-margin-mobile": {
          "value": "var(--spacing-sm)",
          "references": "--spacing-sm"
        },
        "--grid-margin-desktop": {
          "value": "var(--spacing-md)",
          "references": "--spacing-md"
        },
        "--grid-max-width-communicative": {
          "value": "1200px"
        },
        "--grid-max-width-instrumental": {
          "value": "1440px"
        },
        "--grid-column-communicative": {
          "value": "clamp(40rem, 40rem + (100vw - 48rem) / 4, 48rem)",
          "usage": "The reading column on a communicative surface — max-width of the content column inside --grid-max-width-communicative",
          "constraint": "One column at every width. Anchors are --breakpoint-sm and --breakpoint-md and are asserted equal to them. Holds 88 characters of 18px body at 768 and 105 at 1280 — chosen knowing that (card 120)"
        },
        "--grid-tile-min-instrumental": {
          "value": "14rem",
          "usage": "Minimum tile width for an instrumental grid: grid-template-columns: repeat(auto-fit, minmax(var(--grid-tile-min-instrumental), 1fr))",
          "constraint": "No breakpoints; the column count falls out of the width. Four tiles land on five columns from 1280 up — chosen knowing that (card 120)"
        },
        "--breakpoint-sm": {
          "value": "640px"
        },
        "--breakpoint-md": {
          "value": "768px"
        },
        "--breakpoint-lg": {
          "value": "1024px"
        },
        "--breakpoint-xl": {
          "value": "1280px"
        }
      },
      "icons": {
        "--icon-xs": {
          "value": "12px"
        },
        "--icon-sm": {
          "value": "16px"
        },
        "--icon-md": {
          "value": "18px"
        },
        "--icon-lg": {
          "value": "24px"
        },
        "--icon-xl": {
          "value": "48px"
        }
      }
    },
    "semantic": {
      "brand": {
        "--brand-primary": {
          "value": "var(--color-petrol-500)",
          "references": "--color-petrol-500"
        },
        "--brand-accent": {
          "value": "var(--color-orange-500)",
          "references": "--color-orange-500"
        },
        "--brand-light": {
          "value": "var(--color-white)",
          "references": "--color-white"
        }
      },
      "text": {
        "--text-primary": {
          "value": "var(--color-petrol-500)",
          "references": "--color-petrol-500"
        },
        "--text-secondary": {
          "value": "var(--color-gray-500)",
          "references": "--color-gray-500"
        },
        "--text-inverse": {
          "value": "var(--color-white)",
          "references": "--color-white"
        },
        "--text-link": {
          "value": "var(--color-petrol-500)",
          "references": "--color-petrol-500"
        },
        "--text-disabled": {
          "value": "var(--color-gray-300)",
          "references": "--color-gray-300"
        },
        "--text-error": {
          "value": "var(--color-error-500)",
          "references": "--color-error-500",
          "usage": "Error text — field validation, destructive-action warnings",
          "constraint": "5.03:1 white, 4.74:1 sand-50, 4.28:1 sand-100 — normal-text-safe on white and sand-50, large-text-only on sand-100, which is the communicative page ground where a field error most often sits. Found 2026-09-04 by the check in tokens.test.ts § \"semantic text aliases resolve to a colour that may carry text\"; not repointed, because the value is Foundation's and what to do about the sand-100 case is a decision — board card 118"
        }
      },
      "surface": {
        "--surface-page": {
          "value": "var(--color-sand-100)",
          "references": "--color-sand-100",
          "usage": "Communicative page background",
          "constraint": "Patient-facing, marketing, booking. Cards mandatory on this surface"
        },
        "--surface-page-instrumental": {
          "value": "var(--color-sand-50)",
          "references": "--color-sand-50",
          "usage": "Instrumental page background",
          "constraint": "Tools, admin, dashboards. Cards optional on this surface"
        },
        "--surface-card": {
          "value": "var(--color-white)",
          "references": "--color-white",
          "usage": "Card and panel backgrounds",
          "constraint": "Always white. Never sand on cards"
        },
        "--surface-elevated": {
          "value": "var(--color-white)",
          "references": "--color-white",
          "usage": "Dropdowns, popovers, tooltips",
          "constraint": "White with elevation shadow"
        },
        "--surface-overlay": {
          "value": "var(--color-white)",
          "references": "--color-white",
          "usage": "Modal and dialog backgrounds",
          "constraint": "White with highest elevation"
        },
        "--surface-subtle-neutral": {
          "value": "var(--color-sand-100)",
          "references": "--color-sand-100"
        },
        "--surface-subtle-warm": {
          "value": "var(--color-orange-100)",
          "references": "--color-orange-100"
        },
        "--surface-subtle-cold": {
          "value": "var(--color-petrol-100)",
          "references": "--color-petrol-100"
        },
        "--surface-strong-neutral": {
          "value": "var(--color-sand-500)",
          "references": "--color-sand-500"
        },
        "--surface-strong-warm": {
          "value": "var(--color-orange-500)",
          "references": "--color-orange-500"
        },
        "--surface-strong-cold": {
          "value": "var(--color-petrol-500)",
          "references": "--color-petrol-500"
        },
        "--surface-gradient-cold": {
          "value": "linear-gradient(135deg, var(--color-petrol-500) 0%, var(--color-petrol-450) 100%)"
        },
        "--surface-gradient-warm": {
          "value": "linear-gradient(135deg, var(--color-orange-500) 0%, var(--color-orange-300) 100%)"
        }
      },
      "border": {
        "--border-default": {
          "value": "var(--color-gray-100)",
          "references": "--color-gray-100"
        },
        "--border-strong": {
          "value": "var(--color-gray-300)",
          "references": "--color-gray-300"
        },
        "--border-focus": {
          "value": "var(--color-petrol-500)",
          "references": "--color-petrol-500"
        },
        "--border-error": {
          "value": "var(--color-error-500)",
          "references": "--color-error-500"
        }
      },
      "state": {
        "--state-focus-ring": {
          "value": "var(--color-petrol-500)",
          "references": "--color-petrol-500"
        },
        "--state-focus-ring-inner": {
          "value": "var(--color-white)",
          "references": "--color-white"
        },
        "--state-focus-ring-width": {
          "value": "var(--stroke-m)",
          "references": "--stroke-m"
        },
        "--state-focus-ring-shadow": {
          "value": "0 0 0 var(--state-focus-ring-width) var(--state-focus-ring-inner), 0 0 0 calc(var(--state-focus-ring-width) * 2) var(--state-focus-ring)"
        },
        "--state-focus-ring-shadow-inverse": {
          "value": "0 0 0 var(--state-focus-ring-width) var(--state-focus-ring), 0 0 0 calc(var(--state-focus-ring-width) * 2) var(--state-focus-ring-inner)"
        },
        "--state-hover-ring-shadow-primary": {
          "value": "0 0 0 var(--state-focus-ring-width) var(--color-orange-700)"
        },
        "--state-hover-ring-shadow-secondary": {
          "value": "0 0 0 var(--state-focus-ring-width) var(--color-petrol-500)"
        },
        "--state-press-shade": {
          "value": "rgba(0, 0, 0, 0.4)"
        },
        "--state-press-translate-y": {
          "value": "1px"
        },
        "--state-disabled-bg": {
          "value": "var(--color-gray-100)",
          "references": "--color-gray-100"
        },
        "--state-disabled-text": {
          "value": "var(--color-gray-300)",
          "references": "--color-gray-300"
        }
      },
      "status": {
        "--status-error": {
          "value": "var(--color-error-500)",
          "references": "--color-error-500"
        },
        "--status-warning": {
          "value": "var(--color-warning-500)",
          "references": "--color-warning-500"
        },
        "--status-confirm": {
          "value": "var(--color-confirm-500)",
          "references": "--color-confirm-500"
        },
        "--status-info": {
          "value": "var(--color-info-500)",
          "references": "--color-info-500"
        },
        "--status-background": {
          "value": "var(--color-white)",
          "references": "--color-white"
        }
      },
      "goal-status": {
        "--goal-achieved": {
          "value": "var(--color-goal-achieved)",
          "references": "--color-goal-achieved"
        },
        "--goal-borderline": {
          "value": "var(--color-goal-borderline)",
          "references": "--color-goal-borderline"
        },
        "--goal-missed": {
          "value": "var(--color-goal-missed)",
          "references": "--color-goal-missed"
        },
        "--goal-no-data": {
          "value": "var(--color-goal-no-data)",
          "references": "--color-goal-no-data"
        }
      },
      "chart": {
        "--chart-1": {
          "value": "var(--color-chart-01-teal)",
          "references": "--color-chart-01-teal"
        },
        "--chart-2": {
          "value": "var(--color-chart-02-mint)",
          "references": "--color-chart-02-mint"
        },
        "--chart-3": {
          "value": "var(--color-chart-03-blue)",
          "references": "--color-chart-03-blue"
        },
        "--chart-4": {
          "value": "var(--color-chart-04-blue-light)",
          "references": "--color-chart-04-blue-light"
        },
        "--chart-5": {
          "value": "var(--color-chart-05-purple)",
          "references": "--color-chart-05-purple"
        },
        "--chart-6": {
          "value": "var(--color-chart-06-purple-light)",
          "references": "--color-chart-06-purple-light"
        },
        "--chart-7": {
          "value": "var(--color-chart-07-terracotta)",
          "references": "--color-chart-07-terracotta"
        },
        "--chart-8": {
          "value": "var(--color-chart-08-terracotta-light)",
          "references": "--color-chart-08-terracotta-light"
        },
        "--chart-9": {
          "value": "var(--color-chart-09-marine)",
          "references": "--color-chart-09-marine"
        },
        "--chart-10": {
          "value": "var(--color-chart-10-olive)",
          "references": "--color-chart-10-olive"
        },
        "--chart-11": {
          "value": "var(--color-chart-11-warm-grey)",
          "references": "--color-chart-11-warm-grey"
        },
        "--chart-12": {
          "value": "var(--color-chart-12-dark-sand)",
          "references": "--color-chart-12-dark-sand"
        },
        "--chart-pair-1-a": {
          "value": "var(--color-chart-01-teal)",
          "references": "--color-chart-01-teal"
        },
        "--chart-pair-1-b": {
          "value": "var(--color-chart-07-terracotta)",
          "references": "--color-chart-07-terracotta"
        },
        "--chart-pair-2-a": {
          "value": "var(--color-chart-03-blue)",
          "references": "--color-chart-03-blue"
        },
        "--chart-pair-2-b": {
          "value": "var(--color-chart-08-terracotta-light)",
          "references": "--color-chart-08-terracotta-light"
        },
        "--chart-pair-3-a": {
          "value": "var(--color-chart-05-purple)",
          "references": "--color-chart-05-purple"
        },
        "--chart-pair-3-b": {
          "value": "var(--color-chart-10-olive)",
          "references": "--color-chart-10-olive"
        }
      },
      "elevation": {
        "--elevation-flat": {
          "value": "var(--shadow-e0)",
          "references": "--shadow-e0"
        },
        "--elevation-card": {
          "value": "var(--shadow-e1)",
          "references": "--shadow-e1"
        },
        "--elevation-dropdown": {
          "value": "var(--shadow-e2)",
          "references": "--shadow-e2"
        },
        "--elevation-modal": {
          "value": "var(--shadow-e3)",
          "references": "--shadow-e3"
        }
      }
    },
    "component": {
      "typography-compositions": {
        "--type-h1-size": {
          "value": "var(--font-size-2xl)",
          "references": "--font-size-2xl"
        },
        "--type-h1-weight": {
          "value": "var(--font-weight-bold)",
          "references": "--font-weight-bold"
        },
        "--type-h1-line-height": {
          "value": "var(--line-height-tight)",
          "references": "--line-height-tight"
        },
        "--type-h1-letter-spacing": {
          "value": "var(--letter-spacing-tightest)",
          "references": "--letter-spacing-tightest"
        },
        "--type-h1-color": {
          "value": "var(--text-primary)",
          "references": "--text-primary"
        },
        "--type-h2-size": {
          "value": "var(--font-size-xl)",
          "references": "--font-size-xl"
        },
        "--type-h2-weight": {
          "value": "var(--font-weight-bold)",
          "references": "--font-weight-bold"
        },
        "--type-h2-line-height": {
          "value": "var(--line-height-heading)",
          "references": "--line-height-heading"
        },
        "--type-h2-letter-spacing": {
          "value": "var(--letter-spacing-tighter)",
          "references": "--letter-spacing-tighter"
        },
        "--type-h2-color": {
          "value": "var(--text-primary)",
          "references": "--text-primary"
        },
        "--type-h3-size": {
          "value": "var(--font-size-lg)",
          "references": "--font-size-lg"
        },
        "--type-h3-weight": {
          "value": "var(--font-weight-bold)",
          "references": "--font-weight-bold"
        },
        "--type-h3-line-height": {
          "value": "var(--line-height-subheading)",
          "references": "--line-height-subheading"
        },
        "--type-h3-letter-spacing": {
          "value": "var(--letter-spacing-tight)",
          "references": "--letter-spacing-tight"
        },
        "--type-h3-color": {
          "value": "var(--text-primary)",
          "references": "--text-primary"
        },
        "--type-h4-size": {
          "value": "var(--font-size-md)",
          "references": "--font-size-md"
        },
        "--type-h4-weight": {
          "value": "var(--font-weight-bold)",
          "references": "--font-weight-bold"
        },
        "--type-h4-line-height": {
          "value": "var(--line-height-subheading)",
          "references": "--line-height-subheading"
        },
        "--type-h4-letter-spacing": {
          "value": "var(--letter-spacing-normal)",
          "references": "--letter-spacing-normal"
        },
        "--type-h4-color": {
          "value": "var(--text-primary)",
          "references": "--text-primary"
        },
        "--type-lead-size": {
          "value": "var(--font-size-lg)",
          "references": "--font-size-lg"
        },
        "--type-lead-weight": {
          "value": "var(--font-weight-regular)",
          "references": "--font-weight-regular"
        },
        "--type-lead-line-height": {
          "value": "var(--line-height-subheading)",
          "references": "--line-height-subheading"
        },
        "--type-lead-letter-spacing": {
          "value": "var(--letter-spacing-normal)",
          "references": "--letter-spacing-normal"
        },
        "--type-lead-color": {
          "value": "var(--text-secondary)",
          "references": "--text-secondary"
        },
        "--type-body-size": {
          "value": "var(--font-size-base)",
          "references": "--font-size-base"
        },
        "--type-body-weight": {
          "value": "var(--font-weight-regular)",
          "references": "--font-weight-regular"
        },
        "--type-body-line-height": {
          "value": "var(--line-height-body)",
          "references": "--line-height-body"
        },
        "--type-body-color": {
          "value": "var(--text-primary)",
          "references": "--text-primary"
        },
        "--type-body-bold-weight": {
          "value": "var(--font-weight-bold)",
          "references": "--font-weight-bold"
        },
        "--type-label-size": {
          "value": "var(--font-size-sm)",
          "references": "--font-size-sm"
        },
        "--type-label-weight": {
          "value": "var(--font-weight-regular)",
          "references": "--font-weight-regular"
        },
        "--type-label-line-height": {
          "value": "var(--line-height-body)",
          "references": "--line-height-body"
        },
        "--type-label-color": {
          "value": "var(--text-primary)",
          "references": "--text-primary"
        },
        "--type-small-size": {
          "value": "var(--font-size-xs)",
          "references": "--font-size-xs"
        },
        "--type-small-weight": {
          "value": "var(--font-weight-regular)",
          "references": "--font-weight-regular"
        },
        "--type-small-line-height": {
          "value": "var(--line-height-body)",
          "references": "--line-height-body"
        },
        "--type-small-color": {
          "value": "var(--text-secondary)",
          "references": "--text-secondary"
        }
      },
      "spacing-semantic": {
        "--spacing-page-padding": {
          "value": "var(--spacing-sm)",
          "references": "--spacing-sm"
        },
        "--spacing-card-padding": {
          "value": "var(--spacing-md)",
          "references": "--spacing-md"
        },
        "--spacing-section-gap": {
          "value": "var(--spacing-md)",
          "references": "--spacing-md"
        },
        "--spacing-element-gap": {
          "value": "var(--spacing-xs)",
          "references": "--spacing-xs"
        },
        "--spacing-label-gap": {
          "value": "var(--spacing-3xs)",
          "references": "--spacing-3xs"
        }
      },
      "button": {
        "--button-primary-bg": {
          "value": "var(--color-orange-600)",
          "references": "--color-orange-600"
        },
        "--button-primary-text": {
          "value": "var(--color-white)",
          "references": "--color-white"
        },
        "--button-primary-active-bg": {
          "value": "var(--color-orange-700)",
          "references": "--color-orange-700"
        },
        "--button-primary-radius": {
          "value": "var(--radius-m)",
          "references": "--radius-m"
        },
        "--button-primary-padding-x": {
          "value": "var(--spacing-md)",
          "references": "--spacing-md"
        },
        "--button-primary-padding-y": {
          "value": "var(--spacing-xs)",
          "references": "--spacing-xs"
        },
        "--button-primary-font-size": {
          "value": "var(--font-size-base)",
          "references": "--font-size-base"
        },
        "--button-primary-font-weight": {
          "value": "var(--font-weight-regular)",
          "references": "--font-weight-regular"
        },
        "--button-primary-shadow": {
          "value": "var(--shadow-e1)",
          "references": "--shadow-e1"
        },
        "--button-primary-inverse-bg": {
          "value": "var(--color-white)",
          "references": "--color-white"
        },
        "--button-primary-inverse-text": {
          "value": "var(--color-petrol-500)",
          "references": "--color-petrol-500"
        },
        "--button-primary-inverse-active-bg": {
          "value": "var(--color-petrol-100)",
          "references": "--color-petrol-100"
        },
        "--button-primary-inverse-focus-ring": {
          "value": "var(--state-focus-ring-inner)",
          "references": "--state-focus-ring-inner"
        },
        "--button-primary-inverse-focus-ring-inner": {
          "value": "var(--state-focus-ring)",
          "references": "--state-focus-ring"
        },
        "--button-primary-inverse-radius": {
          "value": "var(--button-primary-radius)",
          "references": "--button-primary-radius"
        },
        "--button-primary-inverse-padding-x": {
          "value": "var(--button-primary-padding-x)",
          "references": "--button-primary-padding-x"
        },
        "--button-primary-inverse-padding-y": {
          "value": "var(--button-primary-padding-y)",
          "references": "--button-primary-padding-y"
        },
        "--button-primary-inverse-font-size": {
          "value": "var(--button-primary-font-size)",
          "references": "--button-primary-font-size"
        },
        "--button-primary-inverse-font-weight": {
          "value": "var(--button-primary-font-weight)",
          "references": "--button-primary-font-weight"
        },
        "--button-secondary-bg": {
          "value": "var(--brand-primary)",
          "references": "--brand-primary"
        },
        "--button-secondary-text": {
          "value": "var(--color-white)",
          "references": "--color-white"
        },
        "--button-secondary-active-bg": {
          "value": "var(--color-petrol-700)",
          "references": "--color-petrol-700"
        },
        "--button-secondary-radius": {
          "value": "var(--radius-m)",
          "references": "--radius-m"
        },
        "--button-secondary-padding-x": {
          "value": "var(--button-primary-padding-x)",
          "references": "--button-primary-padding-x"
        },
        "--button-secondary-padding-y": {
          "value": "var(--button-primary-padding-y)",
          "references": "--button-primary-padding-y"
        },
        "--button-secondary-font-size": {
          "value": "var(--button-primary-font-size)",
          "references": "--button-primary-font-size"
        },
        "--button-secondary-font-weight": {
          "value": "var(--button-primary-font-weight)",
          "references": "--button-primary-font-weight"
        },
        "--button-outline-bg": {
          "value": "transparent"
        },
        "--button-outline-text": {
          "value": "var(--brand-primary)",
          "references": "--brand-primary"
        },
        "--button-outline-border": {
          "value": "var(--brand-primary)",
          "references": "--brand-primary"
        },
        "--button-outline-border-rule": {
          "value": "var(--stroke-xs) solid var(--button-outline-border)"
        },
        "--button-outline-radius": {
          "value": "var(--radius-m)",
          "references": "--radius-m"
        },
        "--button-outline-padding-x": {
          "value": "var(--button-primary-padding-x)",
          "references": "--button-primary-padding-x"
        },
        "--button-outline-padding-y": {
          "value": "var(--button-primary-padding-y)",
          "references": "--button-primary-padding-y"
        },
        "--button-outline-font-size": {
          "value": "var(--button-primary-font-size)",
          "references": "--button-primary-font-size"
        },
        "--button-outline-font-weight": {
          "value": "var(--button-primary-font-weight)",
          "references": "--button-primary-font-weight"
        },
        "--button-outline-active-bg": {
          "value": "var(--color-petrol-100)",
          "references": "--color-petrol-100"
        },
        "--button-ghost-bg": {
          "value": "transparent"
        },
        "--button-ghost-text": {
          "value": "var(--brand-primary)",
          "references": "--brand-primary"
        },
        "--button-ghost-radius": {
          "value": "var(--radius-m)",
          "references": "--radius-m"
        },
        "--button-ghost-padding-x": {
          "value": "var(--button-primary-padding-x)",
          "references": "--button-primary-padding-x"
        },
        "--button-ghost-padding-y": {
          "value": "var(--button-primary-padding-y)",
          "references": "--button-primary-padding-y"
        },
        "--button-ghost-font-size": {
          "value": "var(--button-primary-font-size)",
          "references": "--button-primary-font-size"
        },
        "--button-ghost-font-weight": {
          "value": "var(--button-primary-font-weight)",
          "references": "--button-primary-font-weight"
        },
        "--button-ghost-active-bg": {
          "value": "var(--color-petrol-100)",
          "references": "--color-petrol-100"
        },
        "--button-confirm-bg": {
          "value": "var(--button-secondary-bg)",
          "references": "--button-secondary-bg"
        },
        "--button-confirm-text": {
          "value": "var(--button-secondary-text)",
          "references": "--button-secondary-text"
        },
        "--button-confirm-active-bg": {
          "value": "var(--button-secondary-active-bg)",
          "references": "--button-secondary-active-bg"
        },
        "--button-confirm-icon": {
          "value": "check"
        },
        "--button-confirm-radius": {
          "value": "var(--radius-m)",
          "references": "--radius-m"
        },
        "--button-min-height-touch": {
          "value": "44px"
        },
        "--button-padding-y-touch": {
          "value": "var(--spacing-sm)",
          "references": "--spacing-sm"
        },
        "--button-min-height-pointer": {
          "value": "24px",
          "usage": "Minimum height for buttons on dense instrumental surfaces under pointer input",
          "constraint": "A floor, not a size. No pointer padding token exists — the only padding-y here is the touch one — so a button honouring this floor with default padding and a body line box still renders at 44px. A compact control needs a padding value this file does not yet carry (sundviktlakemedel, 2026-08-25)"
        },
        "--button-small-font-size": {
          "value": "var(--font-size-xs)",
          "references": "--font-size-xs"
        },
        "--button-small-padding-x": {
          "value": "var(--spacing-sm)",
          "references": "--spacing-sm"
        },
        "--button-small-padding-y": {
          "value": "var(--spacing-3xs)",
          "references": "--spacing-3xs"
        }
      },
      "tab-navigation": {
        "--tab-nav-bg": {
          "value": "transparent"
        },
        "--tab-nav-border-bottom": {
          "value": "var(--border-default)",
          "references": "--border-default"
        },
        "--tab-nav-border-bottom-rule": {
          "value": "var(--stroke-xs) solid var(--tab-nav-border-bottom)"
        },
        "--tab-nav-padding-x": {
          "value": "var(--spacing-sm)",
          "references": "--spacing-sm"
        },
        "--tab-nav-padding-y": {
          "value": "var(--spacing-xs)",
          "references": "--spacing-xs"
        },
        "--tab-nav-gap": {
          "value": "var(--spacing-md)",
          "references": "--spacing-md"
        },
        "--tab-nav-font-size": {
          "value": "var(--font-size-sm)",
          "references": "--font-size-sm"
        },
        "--tab-nav-font-weight": {
          "value": "var(--font-weight-regular)",
          "references": "--font-weight-regular"
        },
        "--tab-nav-color": {
          "value": "var(--text-secondary)",
          "references": "--text-secondary"
        },
        "--tab-nav-color-active": {
          "value": "var(--text-primary)",
          "references": "--text-primary"
        },
        "--tab-nav-color-hover": {
          "value": "var(--text-primary)",
          "references": "--text-primary"
        },
        "--tab-nav-indicator-color": {
          "value": "var(--color-petrol-500)",
          "references": "--color-petrol-500"
        },
        "--tab-nav-indicator-width": {
          "value": "2px"
        },
        "--tab-nav-sticky-z": {
          "value": "var(--z-sticky)",
          "references": "--z-sticky"
        }
      },
      "card": {
        "--card-bg": {
          "value": "var(--surface-card)",
          "references": "--surface-card"
        },
        "--card-radius": {
          "value": "var(--radius-l)",
          "references": "--radius-l"
        },
        "--card-padding": {
          "value": "var(--spacing-card-padding)",
          "references": "--spacing-card-padding"
        },
        "--card-border": {
          "value": "var(--border-default)",
          "references": "--border-default"
        },
        "--card-border-rule": {
          "value": "var(--stroke-xs) solid var(--card-border)"
        },
        "--card-shadow": {
          "value": "var(--elevation-card)",
          "references": "--elevation-card"
        },
        "--card-media-overflow": {
          "value": "hidden"
        }
      },
      "input": {
        "--input-bg": {
          "value": "var(--color-white)",
          "references": "--color-white"
        },
        "--input-border": {
          "value": "var(--border-default)",
          "references": "--border-default"
        },
        "--input-border-rule": {
          "value": "var(--stroke-xs) solid var(--input-border)"
        },
        "--input-border-focus": {
          "value": "var(--border-focus)",
          "references": "--border-focus"
        },
        "--input-border-error": {
          "value": "var(--border-error)",
          "references": "--border-error"
        },
        "--input-radius": {
          "value": "var(--radius-m)",
          "references": "--radius-m"
        },
        "--input-padding-x": {
          "value": "var(--spacing-sm)",
          "references": "--spacing-sm"
        },
        "--input-padding-y": {
          "value": "var(--spacing-xs)",
          "references": "--spacing-xs"
        },
        "--input-font-size": {
          "value": "var(--font-size-base)",
          "references": "--font-size-base"
        },
        "--input-text": {
          "value": "var(--text-primary)",
          "references": "--text-primary"
        },
        "--input-placeholder": {
          "value": "var(--color-gray-300)",
          "references": "--color-gray-300",
          "usage": "Placeholder text inside a field",
          "constraint": "Not required to meet the AA text floor — it is not required content, and every field in this system carries a visible label (§ Forms), so nothing depends on the placeholder to be understood. Points at the primitive rather than at a semantic text alias since --text-tertiary was retired 2026-09-04 (card 115); a placeholder is not a text level"
        },
        "--input-label-size": {
          "value": "var(--font-size-sm)",
          "references": "--font-size-sm"
        },
        "--input-label-weight": {
          "value": "var(--font-weight-bold)",
          "references": "--font-weight-bold"
        },
        "--input-label-color": {
          "value": "var(--text-primary)",
          "references": "--text-primary"
        },
        "--input-label-gap": {
          "value": "var(--spacing-3xs)",
          "references": "--spacing-3xs"
        },
        "--input-helper-size": {
          "value": "var(--font-size-xs)",
          "references": "--font-size-xs"
        },
        "--input-helper-color": {
          "value": "var(--text-secondary)",
          "references": "--text-secondary"
        },
        "--input-error-color": {
          "value": "var(--color-error-500)",
          "references": "--color-error-500"
        },
        "--input-error-size": {
          "value": "var(--font-size-xs)",
          "references": "--font-size-xs"
        },
        "--input-error-border": {
          "value": "var(--border-error)",
          "references": "--border-error"
        },
        "--input-optional-color": {
          "value": "var(--text-secondary)",
          "references": "--text-secondary"
        },
        "--input-focus-ring": {
          "value": "var(--state-focus-ring)",
          "references": "--state-focus-ring"
        },
        "--input-focus-ring-offset": {
          "value": "2px"
        },
        "--input-disabled-bg": {
          "value": "var(--color-gray-100)",
          "references": "--color-gray-100"
        },
        "--input-disabled-text": {
          "value": "var(--text-disabled)",
          "references": "--text-disabled"
        },
        "--input-disabled-border": {
          "value": "var(--color-gray-100)",
          "references": "--color-gray-100"
        },
        "--input-readonly-bg": {
          "value": "var(--surface-page)",
          "references": "--surface-page"
        },
        "--input-readonly-text": {
          "value": "var(--text-primary)",
          "references": "--text-primary"
        },
        "--input-readonly-border": {
          "value": "transparent"
        }
      },
      "badge": {
        "--badge-radius": {
          "value": "var(--radius-full)",
          "references": "--radius-full"
        },
        "--badge-font-size": {
          "value": "var(--font-size-xs)",
          "references": "--font-size-xs"
        },
        "--badge-padding-x": {
          "value": "var(--spacing-2xs)",
          "references": "--spacing-2xs"
        },
        "--badge-padding-y": {
          "value": "var(--spacing-3xs)",
          "references": "--spacing-3xs"
        }
      },
      "table": {
        "--table-row-height-compact": {
          "value": "36px"
        },
        "--table-row-height-default": {
          "value": "48px"
        },
        "--table-row-height-comfortable": {
          "value": "64px"
        },
        "--table-cell-padding-x": {
          "value": "var(--spacing-sm)",
          "references": "--spacing-sm"
        },
        "--table-cell-padding-y": {
          "value": "var(--spacing-2xs)",
          "references": "--spacing-2xs"
        },
        "--table-header-bg": {
          "value": "var(--surface-subtle-cold)",
          "references": "--surface-subtle-cold"
        },
        "--table-header-text": {
          "value": "var(--text-primary)",
          "references": "--text-primary"
        },
        "--table-header-weight": {
          "value": "var(--font-weight-bold)",
          "references": "--font-weight-bold"
        },
        "--table-header-size": {
          "value": "var(--font-size-xs)",
          "references": "--font-size-xs"
        },
        "--table-header-transform": {
          "value": "none"
        },
        "--table-header-letter-spacing": {
          "value": "0.05em"
        },
        "--table-body-size": {
          "value": "var(--font-size-sm)",
          "references": "--font-size-sm"
        },
        "--table-body-color": {
          "value": "var(--text-primary)",
          "references": "--text-primary"
        },
        "--table-row-hover-bg": {
          "value": "var(--surface-subtle-warm)",
          "references": "--surface-subtle-warm"
        },
        "--table-row-selected-bg": {
          "value": "var(--color-petrol-100)",
          "references": "--color-petrol-100"
        },
        "--table-row-border": {
          "value": "var(--border-default)",
          "references": "--border-default"
        },
        "--table-row-border-rule": {
          "value": "var(--stroke-xs) solid var(--table-row-border)"
        },
        "--table-row-stripe-bg": {
          "value": "var(--color-sand-100)",
          "references": "--color-sand-100"
        },
        "--table-density-preference-key": {
          "value": "'aleris-table-density'"
        }
      },
      "motion": {
        "--duration-instant": {
          "value": "100ms"
        },
        "--duration-fast": {
          "value": "200ms"
        },
        "--duration-moderate": {
          "value": "350ms"
        },
        "--duration-slow": {
          "value": "500ms"
        },
        "--ease-out": {
          "value": "cubic-bezier(0.0, 0.0, 0.2, 1)"
        },
        "--ease-in-out": {
          "value": "cubic-bezier(0.4, 0.0, 0.2, 1)"
        }
      },
      "skeleton": {
        "--skeleton-bg": {
          "value": "var(--color-gray-100)",
          "references": "--color-gray-100"
        },
        "--skeleton-shimmer": {
          "value": "linear-gradient(90deg, var(--color-gray-100) 0%, var(--color-sand-100) 50%, var(--color-gray-100) 100%)"
        },
        "--skeleton-duration": {
          "value": "1400ms",
          "usage": "One shimmer sweep",
          "constraint": "A loop, not a transition — do not alias the --duration-* scale. Changed from var(--duration-moderate) (350ms) on 2026-09-13, board card 156. The four --duration-* steps are transition levels, annotated as such — \"system reacting\", \"spatial tracking\" — and a shimmer is an ambient loop, a different kind of motion that happens to be measured in the same unit. At 350ms it swept four times inside this section's own \"< 2s: shimmer only\" window, which reads as flicker rather than as waiting. 1400ms is the design system export's value and Torfinn adopted it; the alias was the defect, and the value only looked right because nothing separated the two kinds of duration."
        },
        "--skeleton-easing": {
          "value": "var(--ease-in-out)",
          "references": "--ease-in-out"
        },
        "--skeleton-radius-rect": {
          "value": "var(--radius-s)",
          "references": "--radius-s"
        },
        "--skeleton-radius-circle": {
          "value": "var(--radius-full)",
          "references": "--radius-full"
        }
      },
      "z-index": {
        "--z-base": {
          "value": "0"
        },
        "--z-dropdown": {
          "value": "10"
        },
        "--z-sticky": {
          "value": "20"
        },
        "--z-sidebar": {
          "value": "30"
        },
        "--z-search": {
          "value": "40"
        },
        "--z-topbar": {
          "value": "50"
        },
        "--z-modal": {
          "value": "100"
        },
        "--z-toast": {
          "value": "110"
        }
      },
      "images": {
        "--image-ratio-hero": {
          "value": "16 / 9"
        },
        "--image-ratio-content": {
          "value": "3 / 2"
        },
        "--image-ratio-square": {
          "value": "1 / 1"
        },
        "--image-ratio-document": {
          "value": "4 / 3"
        },
        "--image-radius-default": {
          "value": "var(--radius-m)",
          "references": "--radius-m"
        },
        "--image-radius-avatar": {
          "value": "var(--radius-full)",
          "references": "--radius-full"
        },
        "--image-radius-none": {
          "value": "0"
        }
      }
    }
  },
  "stats": {
    "total": 372,
    "annotated": 55,
    "unannotated": 317,
    "by_layer": {
      "primitives": 105,
      "semantic": 68,
      "component": 199
    },
    "by_category": {
      "color-brand": 18,
      "color-legacy": 1,
      "color-neutral": 4,
      "color-feedback": 2,
      "color": 1,
      "color-confirm": 1,
      "color-goal-status": 4,
      "color-chart": 12,
      "spacing": 10,
      "radius": 5,
      "stroke": 4,
      "typography": 22,
      "elevation": 8,
      "grid": 12,
      "icons": 5,
      "brand": 3,
      "text": 6,
      "surface": 13,
      "border": 4,
      "state": 11,
      "status": 5,
      "goal-status": 4,
      "chart": 18,
      "typography-compositions": 38,
      "spacing-semantic": 5,
      "button": 56,
      "tab-navigation": 14,
      "card": 7,
      "input": 29,
      "badge": 4,
      "table": 19,
      "motion": 6,
      "skeleton": 6,
      "z-index": 8,
      "images": 7
    }
  }
}