{
  "$description": "Brand: Signal — dark mode",
  "color": {
    "swatches": {
      "$description": "Source-of-truth color swatches from palette signal@1.0.0",
      "signal-blue": {
        "$value": "#3A76F0",
        "$type": "color",
        "$description": "Signature Signal blue — the brand's primary color, used on the Signal mark, primary CTAs, and the outgoing-message bubble.\n"
      },
      "signal-blue-deep": {
        "$value": "#2563EB",
        "$type": "color",
        "$description": "Deeper marketing-site primary-action blue — used on the hero CTA button across signal.org.\n"
      },
      "signal-blue-action": {
        "$value": "#1A77C0",
        "$type": "color",
        "$description": "Deeper interactive blue — used on link hover and pressed states."
      },
      "signal-bubble-blue": {
        "$value": "#1A77C0",
        "$type": "color",
        "$description": "Chat-thread blue color."
      },
      "signal-bubble-green": {
        "$value": "#2C8948",
        "$type": "color",
        "$description": "Chat-thread green color."
      },
      "signal-bubble-green-light": {
        "$value": "#43955C",
        "$type": "color",
        "$description": "Chat-thread lighter green color."
      },
      "signal-bubble-purple": {
        "$value": "#6A2D8E",
        "$type": "color",
        "$description": "Chat-thread purple color."
      },
      "signal-bubble-violet": {
        "$value": "#7C25B1",
        "$type": "color",
        "$description": "Chat-thread violet color."
      },
      "signal-bubble-crimson": {
        "$value": "#C7354C",
        "$type": "color",
        "$description": "Chat-thread crimson / red color."
      },
      "signal-bubble-rust": {
        "$value": "#BA481E",
        "$type": "color",
        "$description": "Chat-thread rust / burnt-orange color."
      },
      "signal-bubble-amber": {
        "$value": "#FFC107",
        "$type": "color",
        "$description": "Chat-thread amber / yellow color (the Signal \"yellow bubble\")."
      },
      "signal-success": {
        "$value": "#287B41",
        "$type": "color",
        "$description": "Authored success / sent-status green."
      },
      "signal-error": {
        "$value": "#C01D36",
        "$type": "color",
        "$description": "Authored error / failed-send red."
      },
      "signal-warning": {
        "$value": "#E57200",
        "$type": "color",
        "$description": "Authored warning amber."
      },
      "signal-white": {
        "$value": "#FFFFFF",
        "$type": "color",
        "$description": "Pure white — primary surface on the marketing site and light-mode chat canvas."
      },
      "signal-surface-light": {
        "$value": "#F4F5F5",
        "$type": "color",
        "$description": "Light-mode elevated surface — chat-list rail."
      },
      "signal-border-light": {
        "$value": "#E0E2E3",
        "$type": "color",
        "$description": "Quiet divider on the marketing-site surface."
      },
      "signal-text-on-light": {
        "$value": "#1B1E20",
        "$type": "color",
        "$description": "Primary text on the marketing-site and light-mode chat canvas."
      },
      "signal-text-secondary-light": {
        "$value": "#5B646C",
        "$type": "color",
        "$description": "Secondary text on light-mode surfaces."
      },
      "signal-canvas-dark": {
        "$value": "#1B1E20",
        "$type": "color",
        "$description": "Deep near-black — Signal's dark-mode chat canvas tone, captured from the deployed signal.org dark stylesheet.\n"
      },
      "signal-surface-dark": {
        "$value": "#2D3236",
        "$type": "color",
        "$description": "Dark-mode elevated surface — chat-list rail."
      },
      "signal-surface-dark-elevated": {
        "$value": "#303A49",
        "$type": "color",
        "$description": "Dark-mode deepest-elevated surface."
      },
      "signal-text-on-dark": {
        "$value": "#FFFFFF",
        "$type": "color",
        "$description": "Primary text on the dark-mode canvas."
      },
      "signal-text-secondary-dark": {
        "$value": "#A7AFBC",
        "$type": "color",
        "$description": "Secondary text and timestamps on the dark canvas."
      }
    },
    "roles": {
      "$description": "Semantic color roles (dark mode) mapped to palette swatches",
      "background": {
        "$value": "{color.swatches.signal-canvas-dark}",
        "$type": "color",
        "$description": "background role → Signal Canvas Dark"
      },
      "surface": {
        "$value": "{color.swatches.signal-surface-dark}",
        "$type": "color",
        "$description": "surface role → Signal Surface Dark"
      },
      "surface-elevated": {
        "$value": "{color.swatches.signal-surface-dark-elevated}",
        "$type": "color",
        "$description": "surface-elevated role → Signal Surface Dark Elevated"
      },
      "text-primary": {
        "$value": "{color.swatches.signal-text-on-dark}",
        "$type": "color",
        "$description": "text-primary role → Signal Text on Dark"
      },
      "text-secondary": {
        "$value": "{color.swatches.signal-text-secondary-dark}",
        "$type": "color",
        "$description": "text-secondary role → Signal Text Secondary Dark"
      },
      "text-tertiary": {
        "$value": "{color.swatches.signal-text-secondary-dark}",
        "$type": "color",
        "$description": "text-tertiary role → Signal Text Secondary Dark"
      },
      "primary": {
        "$value": "{color.swatches.signal-blue}",
        "$type": "color",
        "$description": "primary role → Signal Blue"
      },
      "primary-hover": {
        "$value": "{color.swatches.signal-blue-deep}",
        "$type": "color",
        "$description": "primary-hover role → Signal Blue Deep"
      },
      "accent": {
        "$value": "{color.swatches.signal-blue}",
        "$type": "color",
        "$description": "accent role → Signal Blue"
      },
      "accent-hover": {
        "$value": "{color.swatches.signal-blue-action}",
        "$type": "color",
        "$description": "accent-hover role → Signal Blue Action"
      },
      "warning": {
        "$value": "{color.swatches.signal-bubble-amber}",
        "$type": "color",
        "$description": "warning role → Signal Bubble Amber"
      },
      "warning-hover": {
        "$value": "{color.swatches.signal-warning}",
        "$type": "color",
        "$description": "warning-hover role → Signal Warning"
      },
      "error": {
        "$value": "{color.swatches.signal-bubble-crimson}",
        "$type": "color",
        "$description": "error role → Signal Bubble Crimson"
      },
      "success": {
        "$value": "{color.swatches.signal-bubble-green}",
        "$type": "color",
        "$description": "success role → Signal Bubble Green"
      },
      "border": {
        "$value": "{color.swatches.signal-surface-dark-elevated}",
        "$type": "color",
        "$description": "border role → Signal Surface Dark Elevated"
      },
      "brand-overrides": {
        "$description": "Brand-level role overrides (take precedence over palette role mappings)",
        "identity": {
          "$value": "{color.swatches.signal-blue}",
          "$type": "color",
          "$description": "Brand role identity → Signal Blue"
        },
        "on-identity": {
          "$value": "{color.swatches.signal-white}",
          "$type": "color",
          "$description": "Brand role on-identity → Signal White"
        },
        "background": {
          "$value": "{color.swatches.signal-white}",
          "$type": "color",
          "$description": "Brand role background → Signal White"
        },
        "surface": {
          "$value": "{color.swatches.signal-surface-light}",
          "$type": "color",
          "$description": "Brand role surface → Signal Surface Light"
        },
        "surface-elevated": {
          "$value": "{color.swatches.signal-white}",
          "$type": "color",
          "$description": "Brand role surface-elevated → Signal White"
        },
        "text-primary": {
          "$value": "{color.swatches.signal-text-on-light}",
          "$type": "color",
          "$description": "Brand role text-primary → Signal Text on Light"
        },
        "text-secondary": {
          "$value": "{color.swatches.signal-text-secondary-light}",
          "$type": "color",
          "$description": "Brand role text-secondary → Signal Text Secondary Light"
        },
        "primary": {
          "$value": "{color.swatches.signal-blue}",
          "$type": "color",
          "$description": "Brand role primary → Signal Blue"
        },
        "primary-hover": {
          "$value": "{color.swatches.signal-blue-deep}",
          "$type": "color",
          "$description": "Brand role primary-hover → Signal Blue Deep"
        },
        "accent": {
          "$value": "{color.swatches.signal-blue}",
          "$type": "color",
          "$description": "Brand role accent → Signal Blue"
        },
        "accent-hover": {
          "$value": "{color.swatches.signal-blue-action}",
          "$type": "color",
          "$description": "Brand role accent-hover → Signal Blue Action"
        },
        "mark": {
          "$value": "{color.swatches.signal-blue}",
          "$type": "color",
          "$description": "Brand role mark → Signal Blue"
        },
        "success": {
          "$value": "{color.swatches.signal-success}",
          "$type": "color",
          "$description": "Brand role success → Signal Success"
        },
        "warning": {
          "$value": "{color.swatches.signal-warning}",
          "$type": "color",
          "$description": "Brand role warning → Signal Warning"
        },
        "error": {
          "$value": "{color.swatches.signal-error}",
          "$type": "color",
          "$description": "Brand role error → Signal Error"
        }
      }
    }
  },
  "font": {
    "$description": "Typography roles mapped to font atoms",
    "heading": {
      "family": {
        "$value": [
          "proxima-nova",
          "Inter",
          "-apple-system",
          "BlinkMacSystemFont",
          "Segoe UI",
          "Helvetica Neue",
          "Helvetica",
          "Arial",
          "sans-serif"
        ],
        "$type": "fontFamily",
        "$description": "heading role → Proxima Nova (proxima-nova@1.0.0)"
      },
      "weight": {
        "400": {
          "$value": 400,
          "$type": "fontWeight"
        },
        "500": {
          "$value": 500,
          "$type": "fontWeight"
        },
        "600": {
          "$value": 600,
          "$type": "fontWeight"
        },
        "700": {
          "$value": 700,
          "$type": "fontWeight"
        },
        "$description": "Available font weights"
      }
    },
    "body": {
      "family": {
        "$value": [
          "proxima-nova",
          "Inter",
          "-apple-system",
          "BlinkMacSystemFont",
          "Segoe UI",
          "Helvetica Neue",
          "Helvetica",
          "Arial",
          "sans-serif"
        ],
        "$type": "fontFamily",
        "$description": "body role → Proxima Nova (proxima-nova@1.0.0)"
      },
      "weight": {
        "400": {
          "$value": 400,
          "$type": "fontWeight"
        },
        "500": {
          "$value": 500,
          "$type": "fontWeight"
        },
        "600": {
          "$value": 600,
          "$type": "fontWeight"
        },
        "700": {
          "$value": 700,
          "$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"
      }
    }
  }
}