export const semanticTokens = {
  colors: {
    bgCanvas: "#f5f7fa",
    bgSurface: "#ffffff",
    bgSurfaceSubtle: "#fafafb",
    bgPrimarySoft: "#f2f5f8",
    textPrimary: "#111827",
    textSecondary: "#667085",
    textTertiary: "#98a2b3",
    borderDefault: "#e4e7ec",
    borderStrong: "#d0d5dd",
    accentPrimary: "#111827",
    accentPrimaryHover: "#1f2937",
    success: "#067647",
    warning: "#b54708",
    danger: "#b42318",
    info: "#155eef",
  },
  radius: {
    sm: "0.5rem",
    md: "0.75rem",
    lg: "1rem",
    xl: "1.25rem",
    panel: "1rem",
  },
  shadow: {
    xs: "0 1px 2px rgba(16, 24, 40, 0.04)",
    sm: "0 1px 3px rgba(16, 24, 40, 0.08), 0 1px 2px rgba(16, 24, 40, 0.04)",
    md: "0 8px 24px rgba(16, 24, 40, 0.08)",
  },
  spacing: {
    pageX: "1.5rem",
    pageY: "1.5rem",
    cardX: "1.25rem",
    cardY: "1.25rem",
    sectionGap: "1.5rem",
    clusterGap: "1rem",
  },
} as const;

export type SemanticTokens = typeof semanticTokens;