{
  "$description": "Brand: Duolingo — dark mode",
  "color": {
    "swatches": {
      "$description": "Source-of-truth color swatches from palette duolingo@1.0.0",
      "feather-green": {
        "$value": "#58CC02",
        "$type": "color",
        "$description": "Duo the owl's signature green. The brand's primary action and identity color."
      },
      "mask-green": {
        "$value": "#89E219",
        "$type": "color",
        "$description": "Brighter sibling of Feather Green — used for signage and lighting accents on the mascot's face mask."
      },
      "tree-frog": {
        "$value": "#58A700",
        "$type": "color",
        "$description": "Pressed / active variant of Feather Green; the deeper-shadow green."
      },
      "sea-sponge": {
        "$value": "#D7FFB8",
        "$type": "color",
        "$description": "Pale lesson-complete green tint."
      },
      "turtle": {
        "$value": "#A5ED6E",
        "$type": "color",
        "$description": "Mid-pale green — secondary accent and badge fill."
      },
      "snow": {
        "$value": "#FFFFFF",
        "$type": "color",
        "$description": "Pure white — page canvas in light mode."
      },
      "polar": {
        "$value": "#F7F7F7",
        "$type": "color",
        "$description": "Off-white surface tint; the canonical page background hint."
      },
      "swan": {
        "$value": "#E5E5E5",
        "$type": "color",
        "$description": "Border / quiet divider color on Polar."
      },
      "hare": {
        "$value": "#AFAFAF",
        "$type": "color",
        "$description": "Mid grey — disabled state and tertiary text."
      },
      "wolf": {
        "$value": "#777777",
        "$type": "color",
        "$description": "Deep grey — secondary text on light surfaces."
      },
      "eel": {
        "$value": "#4B4B4B",
        "$type": "color",
        "$description": "The canonical Duolingo text ink. Used in place of pure black for body copy."
      },
      "cardinal": {
        "$value": "#FF4B4B",
        "$type": "color",
        "$description": "Duolingo's error / wrong-answer red. The most recognizable red in the system."
      },
      "fire-ant": {
        "$value": "#EA2B2B",
        "$type": "color",
        "$description": "Pressed / active variant of Cardinal — destructive confirmation."
      },
      "crab": {
        "$value": "#FF7878",
        "$type": "color",
        "$description": "Soft red — hover tint and error background."
      },
      "flamingo": {
        "$value": "#FFB2B2",
        "$type": "color",
        "$description": "Pale rose-pink — error background wash."
      },
      "bee": {
        "$value": "#FFC800",
        "$type": "color",
        "$description": "Streak / achievement gold. The motivational yellow."
      },
      "lion": {
        "$value": "#FFB100",
        "$type": "color",
        "$description": "Slightly deeper variant of Bee — pressed gold."
      },
      "fox": {
        "$value": "#FF9600",
        "$type": "color",
        "$description": "Vivid orange — celebration and tier-up moments."
      },
      "duck": {
        "$value": "#FBE56D",
        "$type": "color",
        "$description": "Pale lemon yellow — soft yellow background."
      },
      "canary": {
        "$value": "#FFF5D3",
        "$type": "color",
        "$description": "Pale cream — gentle warning background."
      },
      "macaw": {
        "$value": "#1CB0F6",
        "$type": "color",
        "$description": "Duolingo's signature info-blue. Links, hints, and learning-tip accents."
      },
      "whale": {
        "$value": "#1899D6",
        "$type": "color",
        "$description": "Pressed / active variant of Macaw."
      },
      "humpback": {
        "$value": "#2B70C9",
        "$type": "color",
        "$description": "Deeper navy-blue — secondary info accent."
      },
      "narwhal": {
        "$value": "#1453A3",
        "$type": "color",
        "$description": "Deepest navy — chart and data-viz anchor."
      },
      "blue-jay": {
        "$value": "#84D8FF",
        "$type": "color",
        "$description": "Pale sky blue — soft hint accent."
      },
      "moon-jelly": {
        "$value": "#7AF0F2",
        "$type": "color",
        "$description": "Soft cyan — illustration accent."
      },
      "beetle": {
        "$value": "#CE82FF",
        "$type": "color",
        "$description": "Soft purple — the recognizable Super Duolingo subscription accent."
      },
      "betta": {
        "$value": "#9069CD",
        "$type": "color",
        "$description": "Mid-purple — pressed Super accent."
      },
      "butterfly": {
        "$value": "#6F4EA1",
        "$type": "color",
        "$description": "Deep purple — Super hero gradient anchor."
      },
      "starfish": {
        "$value": "#FFAADE",
        "$type": "color",
        "$description": "Pale pink — illustration accent paired with purples."
      }
    },
    "roles": {
      "$description": "Semantic color roles (dark mode) mapped to palette swatches",
      "background": {
        "$value": "{color.swatches.eel}",
        "$type": "color",
        "$description": "background role → Eel"
      },
      "surface": {
        "$value": "{color.swatches.wolf}",
        "$type": "color",
        "$description": "surface role → Wolf"
      },
      "surface-elevated": {
        "$value": "{color.swatches.hare}",
        "$type": "color",
        "$description": "surface-elevated role → Hare"
      },
      "text-primary": {
        "$value": "{color.swatches.snow}",
        "$type": "color",
        "$description": "text-primary role → Snow"
      },
      "text-secondary": {
        "$value": "{color.swatches.polar}",
        "$type": "color",
        "$description": "text-secondary role → Polar"
      },
      "text-tertiary": {
        "$value": "{color.swatches.swan}",
        "$type": "color",
        "$description": "text-tertiary role → Swan"
      },
      "primary": {
        "$value": "{color.swatches.feather-green}",
        "$type": "color",
        "$description": "primary role → Feather Green (Owl)"
      },
      "primary-hover": {
        "$value": "{color.swatches.mask-green}",
        "$type": "color",
        "$description": "primary-hover role → Mask Green"
      },
      "accent": {
        "$value": "{color.swatches.macaw}",
        "$type": "color",
        "$description": "accent role → Macaw"
      },
      "accent-hover": {
        "$value": "{color.swatches.blue-jay}",
        "$type": "color",
        "$description": "accent-hover role → Blue Jay"
      },
      "warning": {
        "$value": "{color.swatches.bee}",
        "$type": "color",
        "$description": "warning role → Bee"
      },
      "warning-hover": {
        "$value": "{color.swatches.lion}",
        "$type": "color",
        "$description": "warning-hover role → Lion"
      },
      "error": {
        "$value": "{color.swatches.cardinal}",
        "$type": "color",
        "$description": "error role → Cardinal"
      },
      "success": {
        "$value": "{color.swatches.mask-green}",
        "$type": "color",
        "$description": "success role → Mask Green"
      },
      "border": {
        "$value": "{color.swatches.wolf}",
        "$type": "color",
        "$description": "border role → Wolf"
      },
      "brand-overrides": {
        "$description": "Brand-level role overrides (take precedence over palette role mappings)",
        "identity": {
          "$value": "{color.swatches.snow}",
          "$type": "color",
          "$description": "Brand role identity → Snow"
        },
        "on-identity": {
          "$value": "{color.swatches.eel}",
          "$type": "color",
          "$description": "Brand role on-identity → Eel"
        },
        "primary": {
          "$value": "{color.swatches.feather-green}",
          "$type": "color",
          "$description": "Brand role primary → Feather Green (Owl)"
        },
        "primary-hover": {
          "$value": "{color.swatches.tree-frog}",
          "$type": "color",
          "$description": "Brand role primary-hover → Tree Frog"
        },
        "accent": {
          "$value": "{color.swatches.macaw}",
          "$type": "color",
          "$description": "Brand role accent → Macaw"
        },
        "accent-hover": {
          "$value": "{color.swatches.whale}",
          "$type": "color",
          "$description": "Brand role accent-hover → Whale"
        },
        "mark": {
          "$value": "{color.swatches.feather-green}",
          "$type": "color",
          "$description": "Brand role mark → Feather Green (Owl)"
        },
        "success": {
          "$value": "{color.swatches.feather-green}",
          "$type": "color",
          "$description": "Brand role success → Feather Green (Owl)"
        },
        "warning": {
          "$value": "{color.swatches.bee}",
          "$type": "color",
          "$description": "Brand role warning → Bee"
        },
        "error": {
          "$value": "{color.swatches.cardinal}",
          "$type": "color",
          "$description": "Brand role error → Cardinal"
        },
        "text-primary-light": {
          "$value": "{color.swatches.eel}",
          "$type": "color",
          "$description": "Brand role text-primary-light → Eel"
        },
        "text-primary-dark": {
          "$value": "{color.swatches.snow}",
          "$type": "color",
          "$description": "Brand role text-primary-dark → Snow"
        },
        "background-light": {
          "$value": "{color.swatches.snow}",
          "$type": "color",
          "$description": "Brand role background-light → Snow"
        },
        "background-dark": {
          "$value": "{color.swatches.eel}",
          "$type": "color",
          "$description": "Brand role background-dark → Eel"
        },
        "surface-light": {
          "$value": "{color.swatches.polar}",
          "$type": "color",
          "$description": "Brand role surface-light → Polar"
        },
        "surface-dark": {
          "$value": "{color.swatches.wolf}",
          "$type": "color",
          "$description": "Brand role surface-dark → Wolf"
        },
        "text-secondary-light": {
          "$value": "{color.swatches.wolf}",
          "$type": "color",
          "$description": "Brand role text-secondary-light → Wolf"
        },
        "text-tertiary-light": {
          "$value": "{color.swatches.hare}",
          "$type": "color",
          "$description": "Brand role text-tertiary-light → Hare"
        },
        "border-light": {
          "$value": "{color.swatches.swan}",
          "$type": "color",
          "$description": "Brand role border-light → Swan"
        },
        "border-dark": {
          "$value": "{color.swatches.wolf}",
          "$type": "color",
          "$description": "Brand role border-dark → Wolf"
        }
      }
    }
  },
  "font": {
    "$description": "Typography roles mapped to font atoms",
    "heading": {
      "family": {
        "$value": [
          "Inter",
          "-apple-system",
          "BlinkMacSystemFont",
          "Segoe UI",
          "Roboto",
          "Helvetica Neue",
          "Arial",
          "sans-serif"
        ],
        "$type": "fontFamily",
        "$description": "heading role → Inter (inter@1.0.0)"
      },
      "weight": {
        "100": {
          "$value": 100,
          "$type": "fontWeight"
        },
        "200": {
          "$value": 200,
          "$type": "fontWeight"
        },
        "300": {
          "$value": 300,
          "$type": "fontWeight"
        },
        "400": {
          "$value": 400,
          "$type": "fontWeight"
        },
        "500": {
          "$value": 500,
          "$type": "fontWeight"
        },
        "600": {
          "$value": 600,
          "$type": "fontWeight"
        },
        "700": {
          "$value": 700,
          "$type": "fontWeight"
        },
        "800": {
          "$value": 800,
          "$type": "fontWeight"
        },
        "900": {
          "$value": 900,
          "$type": "fontWeight"
        },
        "$description": "Available font weights"
      }
    },
    "body": {
      "family": {
        "$value": [
          "Inter",
          "-apple-system",
          "BlinkMacSystemFont",
          "Segoe UI",
          "Roboto",
          "Helvetica Neue",
          "Arial",
          "sans-serif"
        ],
        "$type": "fontFamily",
        "$description": "body role → Inter (inter@1.0.0)"
      },
      "weight": {
        "100": {
          "$value": 100,
          "$type": "fontWeight"
        },
        "200": {
          "$value": 200,
          "$type": "fontWeight"
        },
        "300": {
          "$value": 300,
          "$type": "fontWeight"
        },
        "400": {
          "$value": 400,
          "$type": "fontWeight"
        },
        "500": {
          "$value": 500,
          "$type": "fontWeight"
        },
        "600": {
          "$value": 600,
          "$type": "fontWeight"
        },
        "700": {
          "$value": 700,
          "$type": "fontWeight"
        },
        "800": {
          "$value": 800,
          "$type": "fontWeight"
        },
        "900": {
          "$value": 900,
          "$type": "fontWeight"
        },
        "$description": "Available font weights"
      }
    },
    "mono": {
      "family": {
        "$value": [
          "JetBrainsMono Nerd Font",
          "JetBrains Mono",
          "Fira Code",
          "Menlo",
          "Monaco",
          "Consolas",
          "Liberation Mono",
          "monospace"
        ],
        "$type": "fontFamily",
        "$description": "mono role → JetBrainsMono Nerd Font (jetbrainsmono-nerdfont@1.0.0)"
      },
      "weight": {
        "100": {
          "$value": 100,
          "$type": "fontWeight"
        },
        "200": {
          "$value": 200,
          "$type": "fontWeight"
        },
        "300": {
          "$value": 300,
          "$type": "fontWeight"
        },
        "400": {
          "$value": 400,
          "$type": "fontWeight"
        },
        "500": {
          "$value": 500,
          "$type": "fontWeight"
        },
        "600": {
          "$value": 600,
          "$type": "fontWeight"
        },
        "700": {
          "$value": 700,
          "$type": "fontWeight"
        },
        "800": {
          "$value": 800,
          "$type": "fontWeight"
        },
        "$description": "Available font weights"
      }
    }
  }
}