export type TokenColor =
  | 'fg' | 'fg-muted' | 'fg-subtle'
  | 'bg' | 'surface' | 'surface-raised'
  | 'border' | 'border-strong'
  | 'accent' | 'accent-fg'
  | 'success' | 'warning' | 'danger' | 'info'
  | 'success-fg' | 'warning-fg' | 'danger-fg' | 'info-fg'

export type TokenSpace = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 8 | 10 | 12 | 16 | 20 | 24

export type TokenRadius = 'none' | 'sm' | 'md' | 'lg' | 'xl' | 'full'

export type TokenFontSize = 'xs' | 'sm' | 'base' | 'lg' | 'xl' | '2xl' | '3xl'

export type TokenWeight = 'normal' | 'medium' | 'semibold' | 'bold'

export type TokenShadow = 'sm' | 'md' | 'lg' | 'xl'

export type TokenMotionDuration = 'fast' | 'base' | 'slow'

export type TokenMotionEase = 'standard' | 'emphasized' | 'decelerate'

export type TokenFocusRing = 'width' | 'offset' | 'color'

export type TokenOpacity = 'disabled' | 'muted' | 'overlay'

export type TokenSize = 'control-sm' | 'control-md' | 'control-lg'

export type TokenZIndex = 'dropdown' | 'sticky' | 'overlay' | 'modal' | 'popover' | 'toast' | 'tooltip'

export type TokenLeading = 'tight' | 'normal' | 'relaxed'

export type TokenTracking = 'tight' | 'normal' | 'wide'

export type TokenFontFamily = 'sans' | 'mono'

export type TokenMeasure = 'measure'

export type TokenTextFluid = 'h1' | 'h2'

export interface TokenStyleProps {
  tone?: TokenColor
  pad?: TokenSpace
  radius?: TokenRadius
  size?: TokenFontSize
  weight?: TokenWeight
}

/** Frozen runtime mirror of each union — for iteration, validation, and the theme adapter. */
export const TOKEN_COLORS = [
  'fg', 'fg-muted', 'fg-subtle',
  'bg', 'surface', 'surface-raised',
  'border', 'border-strong',
  'accent', 'accent-fg',
  'success', 'warning', 'danger', 'info',
  'success-fg', 'warning-fg', 'danger-fg', 'info-fg',
] as const satisfies readonly TokenColor[]

export const TOKEN_RADII = ['none', 'sm', 'md', 'lg', 'xl', 'full'] as const satisfies readonly TokenRadius[]

export const TOKEN_FONT_SIZES = ['xs', 'sm', 'base', 'lg', 'xl', '2xl', '3xl'] as const satisfies readonly TokenFontSize[]

export const TOKEN_WEIGHTS = ['normal', 'medium', 'semibold', 'bold'] as const satisfies readonly TokenWeight[]

export const TOKEN_SHADOWS = ['sm', 'md', 'lg', 'xl'] as const satisfies readonly TokenShadow[]

export const TOKEN_MOTION_DURATIONS = ['fast', 'base', 'slow'] as const satisfies readonly TokenMotionDuration[]

export const TOKEN_MOTION_EASES = ['standard', 'emphasized', 'decelerate'] as const satisfies readonly TokenMotionEase[]

export const TOKEN_FOCUS_RING = ['width', 'offset', 'color'] as const satisfies readonly TokenFocusRing[]

export const TOKEN_OPACITIES = ['disabled', 'muted', 'overlay'] as const satisfies readonly TokenOpacity[]

export const TOKEN_SIZES = ['control-sm', 'control-md', 'control-lg'] as const satisfies readonly TokenSize[]

export const TOKEN_Z_INDEXES = ['dropdown', 'sticky', 'overlay', 'modal', 'popover', 'toast', 'tooltip'] as const satisfies readonly TokenZIndex[]

export const TOKEN_LEADING = ['tight', 'normal', 'relaxed'] as const satisfies readonly TokenLeading[]

export const TOKEN_TRACKING = ['tight', 'normal', 'wide'] as const satisfies readonly TokenTracking[]

export const TOKEN_FONT_FAMILIES = ['sans', 'mono'] as const satisfies readonly TokenFontFamily[]

export const TOKEN_MEASURES = ['measure'] as const satisfies readonly TokenMeasure[]

export const TOKEN_TEXT_FLUID = ['h1', 'h2'] as const satisfies readonly TokenTextFluid[]

/** CSS custom-property name for a token color (the seam a theme overrides). */
export function colorVar(token: TokenColor): string {
  return `--mod-color-${token}`
}