{
  "$description": "Current Loopd color palette extracted from the implemented web CSS on 2026-10-07. This is an importable token snapshot, not confirmation that a Figma canvas has been updated.",
  "$metadata": {
    "tokenSetOrder": [
      "light",
      "dark"
    ]
  },
  "$themes": [
    {
      "id": "loopd-light",
      "name": "Light",
      "selectedTokenSets": {
        "light": "enabled",
        "dark": "disabled"
      }
    },
    {
      "id": "loopd-dark",
      "name": "Dark",
      "selectedTokenSets": {
        "light": "disabled",
        "dark": "enabled"
      }
    }
  ],
  "light": {
    "color": {
      "background": {
        "$type": "color",
        "$value": "#f7f6fe",
        "$description": "Loopd CSS semantic token --background"
      },
      "foreground": {
        "$type": "color",
        "$value": "#030119",
        "$description": "Loopd CSS semantic token --foreground"
      },
      "card": {
        "$type": "color",
        "$value": "#ffffff",
        "$description": "Loopd CSS semantic token --card"
      },
      "card-foreground": {
        "$type": "color",
        "$value": "#030119",
        "$description": "Loopd CSS semantic token --card-foreground"
      },
      "popover": {
        "$type": "color",
        "$value": "#ffffff",
        "$description": "Loopd CSS semantic token --popover"
      },
      "popover-foreground": {
        "$type": "color",
        "$value": "#030119",
        "$description": "Loopd CSS semantic token --popover-foreground"
      },
      "primary": {
        "$type": "color",
        "$value": "#030119",
        "$description": "Loopd CSS semantic token --primary"
      },
      "primary-foreground": {
        "$type": "color",
        "$value": "#ffffff",
        "$description": "Loopd CSS semantic token --primary-foreground"
      },
      "secondary": {
        "$type": "color",
        "$value": "#eae8fe",
        "$description": "Loopd CSS semantic token --secondary"
      },
      "secondary-foreground": {
        "$type": "color",
        "$value": "#030119",
        "$description": "Loopd CSS semantic token --secondary-foreground"
      },
      "muted": {
        "$type": "color",
        "$value": "#f0effb",
        "$description": "Loopd CSS semantic token --muted"
      },
      "muted-foreground": {
        "$type": "color",
        "$value": "#6b6488",
        "$description": "Loopd CSS semantic token --muted-foreground"
      },
      "placeholder": {
        "$type": "color",
        "$value": "#807a9c",
        "$description": "Loopd CSS semantic token --placeholder"
      },
      "accent": {
        "$type": "color",
        "$value": "#eae8fe",
        "$description": "Loopd CSS semantic token --accent"
      },
      "accent-foreground": {
        "$type": "color",
        "$value": "#030119",
        "$description": "Loopd CSS semantic token --accent-foreground"
      },
      "destructive": {
        "$type": "color",
        "$value": "#cf2533",
        "$description": "Loopd CSS semantic token --destructive"
      },
      "destructive-foreground": {
        "$type": "color",
        "$value": "#ffffff",
        "$description": "Loopd CSS semantic token --destructive-foreground"
      },
      "border": {
        "$type": "color",
        "$value": "#e2dff6",
        "$description": "Loopd CSS semantic token --border"
      },
      "input": {
        "$type": "color",
        "$value": "#e2dff6",
        "$description": "Loopd CSS semantic token --input"
      },
      "ring": {
        "$type": "color",
        "$value": "#1d09f6",
        "$description": "Loopd CSS semantic token --ring"
      },
      "brand": {
        "$type": "color",
        "$value": "#1d09f6",
        "$description": "Loopd CSS semantic token --brand"
      },
      "brand-foreground": {
        "$type": "color",
        "$value": "#ffffff",
        "$description": "Loopd CSS semantic token --brand-foreground"
      },
      "brand-ink": {
        "$type": "color",
        "$value": "#1d09f6",
        "$description": "Loopd CSS semantic token --brand-ink"
      },
      "brand-50": {
        "$type": "color",
        "$value": "#e8e6fe",
        "$description": "Loopd CSS semantic token --brand-50"
      },
      "brand-100": {
        "$type": "color",
        "$value": "#c0bafd",
        "$description": "Loopd CSS semantic token --brand-100"
      },
      "brand-200": {
        "$type": "color",
        "$value": "#978efb",
        "$description": "Loopd CSS semantic token --brand-200"
      },
      "brand-300": {
        "$type": "color",
        "$value": "#6e62f9",
        "$description": "Loopd CSS semantic token --brand-300"
      },
      "brand-400": {
        "$type": "color",
        "$value": "#4535f8",
        "$description": "Loopd CSS semantic token --brand-400"
      },
      "brand-500": {
        "$type": "color",
        "$value": "#1d09f6",
        "$description": "Loopd CSS semantic token --brand-500"
      },
      "brand-600": {
        "$type": "color",
        "$value": "#1807ca",
        "$description": "Loopd CSS semantic token --brand-600"
      },
      "brand-700": {
        "$type": "color",
        "$value": "#100594",
        "$description": "Loopd CSS semantic token --brand-700"
      },
      "brand-800": {
        "$type": "color",
        "$value": "#0d0471",
        "$description": "Loopd CSS semantic token --brand-800"
      },
      "brand-900": {
        "$type": "color",
        "$value": "#080245",
        "$description": "Loopd CSS semantic token --brand-900"
      },
      "brand-950": {
        "$type": "color",
        "$value": "#030119",
        "$description": "Loopd CSS semantic token --brand-950"
      },
      "brand-deep": {
        "$type": "color",
        "$value": "#080245",
        "$description": "Loopd CSS semantic token --brand-deep"
      },
      "brand-strong": {
        "$type": "color",
        "$value": "#100594",
        "$description": "Loopd CSS semantic token --brand-strong"
      },
      "brand-bright": {
        "$type": "color",
        "$value": "#6e62f9",
        "$description": "Loopd CSS semantic token --brand-bright"
      },
      "wash-soft": {
        "$type": "color",
        "$value": "#f3f2fe",
        "$description": "Loopd CSS semantic token --wash-soft"
      },
      "wash": {
        "$type": "color",
        "$value": "#e8e6fe",
        "$description": "Loopd CSS semantic token --wash"
      },
      "wash-strong": {
        "$type": "color",
        "$value": "#c0bafd",
        "$description": "Loopd CSS semantic token --wash-strong"
      },
      "wash-deep": {
        "$type": "color",
        "$value": "#978efb",
        "$description": "Loopd CSS semantic token --wash-deep"
      },
      "action": {
        "$type": "color",
        "$value": "#1807ca",
        "$description": "Loopd CSS semantic token --action"
      },
      "action-foreground": {
        "$type": "color",
        "$value": "#ffffff",
        "$description": "Loopd CSS semantic token --action-foreground"
      },
      "success": {
        "$type": "color",
        "$value": "#087d3e",
        "$description": "Loopd CSS semantic token --success"
      },
      "success-foreground": {
        "$type": "color",
        "$value": "#ffffff",
        "$description": "Loopd CSS semantic token --success-foreground"
      },
      "warning": {
        "$type": "color",
        "$value": "#f99c00",
        "$description": "Loopd CSS semantic token --warning"
      },
      "warning-foreground": {
        "$type": "color",
        "$value": "#161616",
        "$description": "Loopd CSS semantic token --warning-foreground"
      },
      "info": {
        "$type": "color",
        "$value": "#1807ca",
        "$description": "Loopd CSS semantic token --info"
      },
      "tint-green": {
        "$type": "color",
        "$value": "#dbfce7",
        "$description": "Loopd CSS semantic token --tint-green"
      },
      "tint-green-border": {
        "$type": "color",
        "$value": "#b6ecc9",
        "$description": "Loopd CSS semantic token --tint-green-border"
      },
      "tint-green-subtle": {
        "$type": "color",
        "$value": "#f0fdf4",
        "$description": "Loopd CSS semantic token --tint-green-subtle"
      },
      "tint-green-fg": {
        "$type": "color",
        "$value": "#008236",
        "$description": "Loopd CSS semantic token --tint-green-fg"
      },
      "tint-green-fg-strong": {
        "$type": "color",
        "$value": "#15803d",
        "$description": "Loopd CSS semantic token --tint-green-fg-strong"
      },
      "tint-amber": {
        "$type": "color",
        "$value": "#fef9c2",
        "$description": "Loopd CSS semantic token --tint-amber"
      },
      "tint-amber-border": {
        "$type": "color",
        "$value": "#fde68a",
        "$description": "Loopd CSS semantic token --tint-amber-border"
      },
      "tint-amber-subtle": {
        "$type": "color",
        "$value": "#fffbeb",
        "$description": "Loopd CSS semantic token --tint-amber-subtle"
      },
      "tint-amber-fg": {
        "$type": "color",
        "$value": "#a65f00",
        "$description": "Loopd CSS semantic token --tint-amber-fg"
      },
      "tint-blue": {
        "$type": "color",
        "$value": "#dbeafe",
        "$description": "Loopd CSS semantic token --tint-blue"
      },
      "tint-blue-border": {
        "$type": "color",
        "$value": "#bfdbfe",
        "$description": "Loopd CSS semantic token --tint-blue-border"
      },
      "tint-blue-subtle": {
        "$type": "color",
        "$value": "#eff6ff",
        "$description": "Loopd CSS semantic token --tint-blue-subtle"
      },
      "tint-blue-fg": {
        "$type": "color",
        "$value": "#1d63c9",
        "$description": "Loopd CSS semantic token --tint-blue-fg"
      },
      "tint-red": {
        "$type": "color",
        "$value": "#fee2e2",
        "$description": "Loopd CSS semantic token --tint-red"
      },
      "tint-red-fg": {
        "$type": "color",
        "$value": "#c0303a",
        "$description": "Loopd CSS semantic token --tint-red-fg"
      },
      "tint-teal": {
        "$type": "color",
        "$value": "#cbfbf1",
        "$description": "Loopd CSS semantic token --tint-teal"
      },
      "tint-teal-fg": {
        "$type": "color",
        "$value": "#00786f",
        "$description": "Loopd CSS semantic token --tint-teal-fg"
      },
      "tint-indigo": {
        "$type": "color",
        "$value": "#e0e7ff",
        "$description": "Loopd CSS semantic token --tint-indigo"
      },
      "tint-indigo-fg": {
        "$type": "color",
        "$value": "#432dd7",
        "$description": "Loopd CSS semantic token --tint-indigo-fg"
      },
      "mock-ink": {
        "$type": "color",
        "$value": "#0d0d0d",
        "$description": "Loopd CSS semantic token --mock-ink"
      },
      "mock-ink-2": {
        "$type": "color",
        "$value": "#1f1f1f",
        "$description": "Loopd CSS semantic token --mock-ink-2"
      },
      "mock-ink-3": {
        "$type": "color",
        "$value": "#333333",
        "$description": "Loopd CSS semantic token --mock-ink-3"
      },
      "mock-ink-4": {
        "$type": "color",
        "$value": "#505050",
        "$description": "Loopd CSS semantic token --mock-ink-4"
      },
      "mock-grey": {
        "$type": "color",
        "$value": "#7a7a7a",
        "$description": "Loopd CSS semantic token --mock-grey"
      },
      "mock-grey-2": {
        "$type": "color",
        "$value": "#686d76",
        "$description": "Loopd CSS semantic token --mock-grey-2"
      },
      "mock-grey-3": {
        "$type": "color",
        "$value": "#6b6b6b",
        "$description": "Loopd CSS semantic token --mock-grey-3"
      },
      "mock-grey-4": {
        "$type": "color",
        "$value": "#696e73",
        "$description": "Loopd CSS semantic token --mock-grey-4"
      },
      "mock-grey-5": {
        "$type": "color",
        "$value": "#8e9196",
        "$description": "Loopd CSS semantic token --mock-grey-5"
      },
      "mock-success": {
        "$type": "color",
        "$value": "#1c8a52",
        "$description": "Loopd CSS semantic token --mock-success"
      },
      "mock-success-2": {
        "$type": "color",
        "$value": "#34c26b",
        "$description": "Loopd CSS semantic token --mock-success-2"
      },
      "mock-success-3": {
        "$type": "color",
        "$value": "#5ec98d",
        "$description": "Loopd CSS semantic token --mock-success-3"
      },
      "mock-success-4": {
        "$type": "color",
        "$value": "#7fd0a2",
        "$description": "Loopd CSS semantic token --mock-success-4"
      },
      "mock-success-fill": {
        "$type": "color",
        "$value": "#e6fbf0",
        "$description": "Loopd CSS semantic token --mock-success-fill"
      },
      "mock-info-fill": {
        "$type": "color",
        "$value": "#e8e6fe",
        "$description": "Loopd CSS semantic token --mock-info-fill"
      },
      "mock-danger": {
        "$type": "color",
        "$value": "#7d1f24",
        "$description": "Loopd CSS semantic token --mock-danger"
      },
      "content-secondary": {
        "$type": "color",
        "$value": "#5c5578",
        "$description": "Loopd CSS semantic token --content-secondary"
      },
      "surface-dark": {
        "$type": "color",
        "$value": "#030119",
        "$description": "Loopd CSS semantic token --surface-dark"
      },
      "surface-dark-foreground": {
        "$type": "color",
        "$value": "#f7f7f8",
        "$description": "Loopd CSS semantic token --surface-dark-foreground"
      },
      "chart-1": {
        "$type": "color",
        "$value": "#5dc16b",
        "$description": "Loopd CSS semantic token --chart-1"
      },
      "chart-2": {
        "$type": "color",
        "$value": "#1d09f6",
        "$description": "Loopd CSS semantic token --chart-2"
      },
      "chart-3": {
        "$type": "color",
        "$value": "#f99c00",
        "$description": "Loopd CSS semantic token --chart-3"
      },
      "chart-4": {
        "$type": "color",
        "$value": "#ac4bff",
        "$description": "Loopd CSS semantic token --chart-4"
      },
      "chart-5": {
        "$type": "color",
        "$value": "#ff2357",
        "$description": "Loopd CSS semantic token --chart-5"
      },
      "sidebar": {
        "$type": "color",
        "$value": "#ffffff",
        "$description": "Loopd CSS semantic token --sidebar"
      },
      "sidebar-foreground": {
        "$type": "color",
        "$value": "#030119",
        "$description": "Loopd CSS semantic token --sidebar-foreground"
      },
      "sidebar-primary": {
        "$type": "color",
        "$value": "#030119",
        "$description": "Loopd CSS semantic token --sidebar-primary"
      },
      "sidebar-primary-foreground": {
        "$type": "color",
        "$value": "#ffffff",
        "$description": "Loopd CSS semantic token --sidebar-primary-foreground"
      },
      "sidebar-accent": {
        "$type": "color",
        "$value": "#f0effb",
        "$description": "Loopd CSS semantic token --sidebar-accent"
      },
      "sidebar-accent-foreground": {
        "$type": "color",
        "$value": "#030119",
        "$description": "Loopd CSS semantic token --sidebar-accent-foreground"
      },
      "sidebar-border": {
        "$type": "color",
        "$value": "#e2dff6",
        "$description": "Loopd CSS semantic token --sidebar-border"
      },
      "sidebar-ring": {
        "$type": "color",
        "$value": "#1d09f6",
        "$description": "Loopd CSS semantic token --sidebar-ring"
      }
    }
  },
  "dark": {
    "color": {
      "background": {
        "$type": "color",
        "$value": "#08061e",
        "$description": "Loopd CSS semantic token --background"
      },
      "foreground": {
        "$type": "color",
        "$value": "#e8e6fe",
        "$description": "Loopd CSS semantic token --foreground"
      },
      "card": {
        "$type": "color",
        "$value": "#100c30",
        "$description": "Loopd CSS semantic token --card"
      },
      "card-foreground": {
        "$type": "color",
        "$value": "#e8e6fe",
        "$description": "Loopd CSS semantic token --card-foreground"
      },
      "popover": {
        "$type": "color",
        "$value": "#100c30",
        "$description": "Loopd CSS semantic token --popover"
      },
      "popover-foreground": {
        "$type": "color",
        "$value": "#e8e6fe",
        "$description": "Loopd CSS semantic token --popover-foreground"
      },
      "primary": {
        "$type": "color",
        "$value": "#e8e6fe",
        "$description": "Loopd CSS semantic token --primary"
      },
      "primary-foreground": {
        "$type": "color",
        "$value": "#030119",
        "$description": "Loopd CSS semantic token --primary-foreground"
      },
      "secondary": {
        "$type": "color",
        "$value": "#201a52",
        "$description": "Loopd CSS semantic token --secondary"
      },
      "secondary-foreground": {
        "$type": "color",
        "$value": "#e8e6fe",
        "$description": "Loopd CSS semantic token --secondary-foreground"
      },
      "muted": {
        "$type": "color",
        "$value": "#171240",
        "$description": "Loopd CSS semantic token --muted"
      },
      "muted-foreground": {
        "$type": "color",
        "$value": "#8b82c0",
        "$description": "Loopd CSS semantic token --muted-foreground"
      },
      "placeholder": {
        "$type": "color",
        "$value": "#736b9e",
        "$description": "Loopd CSS semantic token --placeholder"
      },
      "accent": {
        "$type": "color",
        "$value": "#201a52",
        "$description": "Loopd CSS semantic token --accent"
      },
      "accent-foreground": {
        "$type": "color",
        "$value": "#e8e6fe",
        "$description": "Loopd CSS semantic token --accent-foreground"
      },
      "destructive": {
        "$type": "color",
        "$value": "#ff6568",
        "$description": "Loopd CSS semantic token --destructive"
      },
      "destructive-foreground": {
        "$type": "color",
        "$value": "#ffffff",
        "$description": "Loopd CSS semantic token --destructive-foreground"
      },
      "border": {
        "$type": "color",
        "$value": "#2c2668",
        "$description": "Loopd CSS semantic token --border"
      },
      "input": {
        "$type": "color",
        "$value": "#2c2668",
        "$description": "Loopd CSS semantic token --input"
      },
      "ring": {
        "$type": "color",
        "$value": "#6e62f9",
        "$description": "Loopd CSS semantic token --ring"
      },
      "brand": {
        "$type": "color",
        "$value": "#4535f8",
        "$description": "Loopd CSS semantic token --brand"
      },
      "brand-foreground": {
        "$type": "color",
        "$value": "#ffffff",
        "$description": "Loopd CSS semantic token --brand-foreground"
      },
      "brand-ink": {
        "$type": "color",
        "$value": "#978efb",
        "$description": "Loopd CSS semantic token --brand-ink"
      },
      "brand-50": {
        "$type": "color",
        "$value": "#e8e6fe",
        "$description": "Loopd CSS semantic token --brand-50"
      },
      "brand-100": {
        "$type": "color",
        "$value": "#c0bafd",
        "$description": "Loopd CSS semantic token --brand-100"
      },
      "brand-200": {
        "$type": "color",
        "$value": "#978efb",
        "$description": "Loopd CSS semantic token --brand-200"
      },
      "brand-300": {
        "$type": "color",
        "$value": "#6e62f9",
        "$description": "Loopd CSS semantic token --brand-300"
      },
      "brand-400": {
        "$type": "color",
        "$value": "#4535f8",
        "$description": "Loopd CSS semantic token --brand-400"
      },
      "brand-500": {
        "$type": "color",
        "$value": "#1d09f6",
        "$description": "Loopd CSS semantic token --brand-500"
      },
      "brand-600": {
        "$type": "color",
        "$value": "#1807ca",
        "$description": "Loopd CSS semantic token --brand-600"
      },
      "brand-700": {
        "$type": "color",
        "$value": "#100594",
        "$description": "Loopd CSS semantic token --brand-700"
      },
      "brand-800": {
        "$type": "color",
        "$value": "#0d0471",
        "$description": "Loopd CSS semantic token --brand-800"
      },
      "brand-900": {
        "$type": "color",
        "$value": "#080245",
        "$description": "Loopd CSS semantic token --brand-900"
      },
      "brand-950": {
        "$type": "color",
        "$value": "#030119",
        "$description": "Loopd CSS semantic token --brand-950"
      },
      "brand-deep": {
        "$type": "color",
        "$value": "#080245",
        "$description": "Loopd CSS semantic token --brand-deep"
      },
      "brand-strong": {
        "$type": "color",
        "$value": "#1d09f6",
        "$description": "Loopd CSS semantic token --brand-strong"
      },
      "brand-bright": {
        "$type": "color",
        "$value": "#978efb",
        "$description": "Loopd CSS semantic token --brand-bright"
      },
      "wash-soft": {
        "$type": "color",
        "$value": "#0c0926",
        "$description": "Loopd CSS semantic token --wash-soft"
      },
      "wash": {
        "$type": "color",
        "$value": "#141034",
        "$description": "Loopd CSS semantic token --wash"
      },
      "wash-strong": {
        "$type": "color",
        "$value": "#1d1747",
        "$description": "Loopd CSS semantic token --wash-strong"
      },
      "wash-deep": {
        "$type": "color",
        "$value": "#292060",
        "$description": "Loopd CSS semantic token --wash-deep"
      },
      "action": {
        "$type": "color",
        "$value": "#978efb",
        "$description": "Loopd CSS semantic token --action"
      },
      "action-foreground": {
        "$type": "color",
        "$value": "#030119",
        "$description": "Loopd CSS semantic token --action-foreground"
      },
      "success": {
        "$type": "color",
        "$value": "#0cb85b",
        "$description": "Loopd CSS semantic token --success"
      },
      "success-foreground": {
        "$type": "color",
        "$value": "#030119",
        "$description": "Loopd CSS semantic token --success-foreground"
      },
      "warning": {
        "$type": "color",
        "$value": "#fcbb00",
        "$description": "Loopd CSS semantic token --warning"
      },
      "warning-foreground": {
        "$type": "color",
        "$value": "#030119",
        "$description": "Loopd CSS semantic token --warning-foreground"
      },
      "info": {
        "$type": "color",
        "$value": "#978efb",
        "$description": "Loopd CSS semantic token --info"
      },
      "tint-green": {
        "$type": "color",
        "$value": "#10281a",
        "$description": "Loopd CSS semantic token --tint-green"
      },
      "tint-green-border": {
        "$type": "color",
        "$value": "#1e4630",
        "$description": "Loopd CSS semantic token --tint-green-border"
      },
      "tint-green-subtle": {
        "$type": "color",
        "$value": "#0c1f14",
        "$description": "Loopd CSS semantic token --tint-green-subtle"
      },
      "tint-green-fg": {
        "$type": "color",
        "$value": "#4ade80",
        "$description": "Loopd CSS semantic token --tint-green-fg"
      },
      "tint-green-fg-strong": {
        "$type": "color",
        "$value": "#6ee7a0",
        "$description": "Loopd CSS semantic token --tint-green-fg-strong"
      },
      "tint-amber": {
        "$type": "color",
        "$value": "#2e2408",
        "$description": "Loopd CSS semantic token --tint-amber"
      },
      "tint-amber-border": {
        "$type": "color",
        "$value": "#4a3a10",
        "$description": "Loopd CSS semantic token --tint-amber-border"
      },
      "tint-amber-subtle": {
        "$type": "color",
        "$value": "#241c06",
        "$description": "Loopd CSS semantic token --tint-amber-subtle"
      },
      "tint-amber-fg": {
        "$type": "color",
        "$value": "#fbbf24",
        "$description": "Loopd CSS semantic token --tint-amber-fg"
      },
      "tint-blue": {
        "$type": "color",
        "$value": "#12233d",
        "$description": "Loopd CSS semantic token --tint-blue"
      },
      "tint-blue-border": {
        "$type": "color",
        "$value": "#1e3a5f",
        "$description": "Loopd CSS semantic token --tint-blue-border"
      },
      "tint-blue-subtle": {
        "$type": "color",
        "$value": "#0e1b2e",
        "$description": "Loopd CSS semantic token --tint-blue-subtle"
      },
      "tint-blue-fg": {
        "$type": "color",
        "$value": "#7cb3ff",
        "$description": "Loopd CSS semantic token --tint-blue-fg"
      },
      "tint-red": {
        "$type": "color",
        "$value": "#3a1416",
        "$description": "Loopd CSS semantic token --tint-red"
      },
      "tint-red-fg": {
        "$type": "color",
        "$value": "#ff8a8d",
        "$description": "Loopd CSS semantic token --tint-red-fg"
      },
      "tint-teal": {
        "$type": "color",
        "$value": "#0d2a28",
        "$description": "Loopd CSS semantic token --tint-teal"
      },
      "tint-teal-fg": {
        "$type": "color",
        "$value": "#2dd4bf",
        "$description": "Loopd CSS semantic token --tint-teal-fg"
      },
      "tint-indigo": {
        "$type": "color",
        "$value": "#1c1b3a",
        "$description": "Loopd CSS semantic token --tint-indigo"
      },
      "tint-indigo-fg": {
        "$type": "color",
        "$value": "#a5b4fc",
        "$description": "Loopd CSS semantic token --tint-indigo-fg"
      },
      "mock-ink": {
        "$type": "color",
        "$value": "#0d0d0d",
        "$description": "Loopd CSS semantic token --mock-ink"
      },
      "mock-ink-2": {
        "$type": "color",
        "$value": "#1f1f1f",
        "$description": "Loopd CSS semantic token --mock-ink-2"
      },
      "mock-ink-3": {
        "$type": "color",
        "$value": "#333333",
        "$description": "Loopd CSS semantic token --mock-ink-3"
      },
      "mock-ink-4": {
        "$type": "color",
        "$value": "#505050",
        "$description": "Loopd CSS semantic token --mock-ink-4"
      },
      "mock-grey": {
        "$type": "color",
        "$value": "#7a7a7a",
        "$description": "Loopd CSS semantic token --mock-grey"
      },
      "mock-grey-2": {
        "$type": "color",
        "$value": "#686d76",
        "$description": "Loopd CSS semantic token --mock-grey-2"
      },
      "mock-grey-3": {
        "$type": "color",
        "$value": "#6b6b6b",
        "$description": "Loopd CSS semantic token --mock-grey-3"
      },
      "mock-grey-4": {
        "$type": "color",
        "$value": "#696e73",
        "$description": "Loopd CSS semantic token --mock-grey-4"
      },
      "mock-grey-5": {
        "$type": "color",
        "$value": "#8e9196",
        "$description": "Loopd CSS semantic token --mock-grey-5"
      },
      "mock-success": {
        "$type": "color",
        "$value": "#1c8a52",
        "$description": "Loopd CSS semantic token --mock-success"
      },
      "mock-success-2": {
        "$type": "color",
        "$value": "#34c26b",
        "$description": "Loopd CSS semantic token --mock-success-2"
      },
      "mock-success-3": {
        "$type": "color",
        "$value": "#5ec98d",
        "$description": "Loopd CSS semantic token --mock-success-3"
      },
      "mock-success-4": {
        "$type": "color",
        "$value": "#7fd0a2",
        "$description": "Loopd CSS semantic token --mock-success-4"
      },
      "mock-success-fill": {
        "$type": "color",
        "$value": "#e6fbf0",
        "$description": "Loopd CSS semantic token --mock-success-fill"
      },
      "mock-info-fill": {
        "$type": "color",
        "$value": "#e8e6fe",
        "$description": "Loopd CSS semantic token --mock-info-fill"
      },
      "mock-danger": {
        "$type": "color",
        "$value": "#7d1f24",
        "$description": "Loopd CSS semantic token --mock-danger"
      },
      "content-secondary": {
        "$type": "color",
        "$value": "#8b82c0",
        "$description": "Loopd CSS semantic token --content-secondary"
      },
      "surface-dark": {
        "$type": "color",
        "$value": "#241d68",
        "$description": "Loopd CSS semantic token --surface-dark"
      },
      "surface-dark-foreground": {
        "$type": "color",
        "$value": "#f7f7f8",
        "$description": "Loopd CSS semantic token --surface-dark-foreground"
      },
      "chart-1": {
        "$type": "color",
        "$value": "#5dc16b",
        "$description": "Loopd CSS semantic token --chart-1"
      },
      "chart-2": {
        "$type": "color",
        "$value": "#1d09f6",
        "$description": "Loopd CSS semantic token --chart-2"
      },
      "chart-3": {
        "$type": "color",
        "$value": "#f99c00",
        "$description": "Loopd CSS semantic token --chart-3"
      },
      "chart-4": {
        "$type": "color",
        "$value": "#ac4bff",
        "$description": "Loopd CSS semantic token --chart-4"
      },
      "chart-5": {
        "$type": "color",
        "$value": "#ff2357",
        "$description": "Loopd CSS semantic token --chart-5"
      },
      "sidebar": {
        "$type": "color",
        "$value": "#100c30",
        "$description": "Loopd CSS semantic token --sidebar"
      },
      "sidebar-foreground": {
        "$type": "color",
        "$value": "#e8e6fe",
        "$description": "Loopd CSS semantic token --sidebar-foreground"
      },
      "sidebar-primary": {
        "$type": "color",
        "$value": "#e8e6fe",
        "$description": "Loopd CSS semantic token --sidebar-primary"
      },
      "sidebar-primary-foreground": {
        "$type": "color",
        "$value": "#030119",
        "$description": "Loopd CSS semantic token --sidebar-primary-foreground"
      },
      "sidebar-accent": {
        "$type": "color",
        "$value": "#201a52",
        "$description": "Loopd CSS semantic token --sidebar-accent"
      },
      "sidebar-accent-foreground": {
        "$type": "color",
        "$value": "#e8e6fe",
        "$description": "Loopd CSS semantic token --sidebar-accent-foreground"
      },
      "sidebar-border": {
        "$type": "color",
        "$value": "#2c2668",
        "$description": "Loopd CSS semantic token --sidebar-border"
      },
      "sidebar-ring": {
        "$type": "color",
        "$value": "#6e62f9",
        "$description": "Loopd CSS semantic token --sidebar-ring"
      }
    }
  }
}