/** Same cyan palette as the host app's tokens.css, duplicated here because a canvas
 *  renders in its own document with no access to the host's stylesheet. */
export const theme = {
  bgDeep: '#0A0E12',
  bgSurface: '#121A21',
  bgElevated: '#1A2530',
  bgElevatedHover: '#22303D',
  border: '#223240',
  borderSoft: '#1A2632',
  text: '#E6EDF3',
  textMuted: '#8B9AA7',
  textFaint: '#5B6B78',
  cyan: '#22D3EE',
  cyanBright: '#67E8F9',
  cyanDeep: '#0E7490',
  cyanGlow: 'rgba(34, 211, 238, 0.25)',
  cyanGlowStrong: 'rgba(34, 211, 238, 0.45)',
  success: '#34D399',
  warning: '#FBBF24',
  danger: '#F87171',
  fontSans:
    "'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif"
} as const