{
  "meta": {
    "name": "Forge Core — Dead Signal design tokens",
    "version": "1.0.0",
    "description": "Single source of truth for every color (UI + 3D scene), size, and effect. Edit this file, then run `npm run build:tokens` to regenerate assets/css/tokens.css.",
    "referenceSyntax": "Wrap another token's name in curly braces to reference it, e.g. \"{c-signal}\" becomes var(--c-signal). References work inside larger values too: \"rgba({c-rock-rgb}, 0.85)\".",
    "urlNote": "url() values are relative to assets/css/, where tokens.css lives."
  },
  "groups": [
    {
      "id": "palette-ui",
      "title": "1a. Base palette: UI (raw values)",
      "tokens": {
        "c-mars-sky": { "value": "#280e19", "type": "color", "description": "Page background / deep sky" },
        "c-mars-sky-glow": { "value": "#2a1119", "type": "color", "description": "Center glow of the title screen" },
        "c-signal": { "value": "#fcf696", "type": "color", "description": "Signal yellow, the accent color" },
        "c-signal-rgb": { "value": "252, 246, 150", "type": "rgb", "description": "Signal yellow as an RGB triplet for rgba()" },
        "c-cream": { "value": "#f2e9da", "type": "color", "description": "Primary text" },
        "c-dust": { "value": "#c9a68c", "type": "color", "description": "Dimmed text" },
        "c-dome-frame-rgb": { "value": "155, 122, 113", "type": "rgb", "description": "Neutral borders and tinted surfaces" },
        "c-rock-rgb": { "value": "115, 40, 37", "type": "rgb", "description": "Errors, danger, grid boundary" },
        "c-ink": { "value": "#1e120a", "type": "color", "description": "Panel and primary button fill" },
        "c-night-rgb": { "value": "20, 8, 13", "type": "rgb", "description": "Modal dim overlay" },
        "c-black-rgb": { "value": "0, 0, 0", "type": "rgb", "description": "Shadows" },
        "c-white-rgb": { "value": "255, 255, 255", "type": "rgb", "description": "Inner highlights" }
      }
    },
    {
      "id": "palette-scene",
      "title": "1b. Base palette: 3D scene (read by JS)",
      "tokens": {
        "scene-sky-zenith": { "value": "#3a1018", "type": "color", "description": "Sky dome top" },
        "scene-sky-horizon": { "value": "#d9622c", "type": "color", "description": "Sky dome horizon + fog" },
        "scene-ground-near": { "value": "#dbc49d", "type": "color", "description": "Ground plane near the board" },
        "scene-ground-far": { "value": "#a64614", "type": "color", "description": "Ground plane at the edge" },
        "scene-mountains": { "value": "#35120f", "type": "color", "description": "Mountain ring silhouette" },
        "scene-light-ambient": { "value": "#a8836b", "type": "color", "description": "Ambient light" },
        "scene-light-hemi-sky": { "value": "#d98a5a", "type": "color", "description": "Hemisphere light, sky side" },
        "scene-light-hemi-ground": { "value": "#2a1810", "type": "color", "description": "Hemisphere light, ground side" },
        "scene-light-sun": { "value": "#ffd9a0", "type": "color", "description": "Directional sun light" },
        "scene-spark": { "value": "#fff2c9", "type": "color", "description": "Sparks on the broken power source" }
      }
    },
    {
      "id": "semantic",
      "title": "1c. Semantic colors (use these in components)",
      "tokens": {
        "bg": { "value": "{c-mars-sky}", "type": "color" },
        "text": { "value": "{c-cream}", "type": "color" },
        "text-dim": { "value": "{c-dust}", "type": "color" },
        "accent": { "value": "{c-signal}", "type": "color" },
        "border-neutral": { "value": "rgba({c-dome-frame-rgb}, 0.4)", "type": "color" },
        "surface-tint": { "value": "rgba({c-dome-frame-rgb}, 0.14)", "type": "color" },
        "panel-bg": { "value": "{c-ink}", "type": "color" },
        "panel-border": { "value": "{c-signal}", "type": "color" },
        "overlay-bg": { "value": "rgba({c-night-rgb}, 0.6)", "type": "color" },
        "error-bg": { "value": "rgba({c-rock-rgb}, 0.85)", "type": "color" },
        "error-border": { "value": "rgba({c-rock-rgb}, 0.9)", "type": "color" },
        "danger-hover-bg": { "value": "rgba({c-rock-rgb}, 0.35)", "type": "color" }
      }
    },
    {
      "id": "button",
      "title": "1d. Button tokens",
      "tokens": {
        "btn-primary-bg": { "value": "{c-ink}", "type": "color" },
        "btn-primary-border": { "value": "{c-signal}", "type": "color" },
        "btn-primary-text": { "value": "{c-signal}", "type": "color" },
        "btn-primary-bg-hover": { "value": "{c-signal}", "type": "color" },
        "btn-primary-text-hover": { "value": "{c-ink}", "type": "color" },
        "btn-secondary-bg": { "value": "{surface-tint}", "type": "color" },
        "btn-secondary-border": { "value": "{border-neutral}", "type": "color" },
        "btn-secondary-text": { "value": "{text}", "type": "color" },
        "btn-secondary-hover-accent": { "value": "{accent}", "type": "color" },
        "btn-radius": { "value": "0", "type": "dimension" },
        "btn-corner-image": { "value": "url('../images/forge-core-button-container-edge.png')", "type": "image", "description": "Top-left corner piece; bottom-right is mirrored" },
        "btn-corner-width": { "value": "48px", "type": "dimension" },
        "btn-corner-height": { "value": "28px", "type": "dimension" },
        "btn-corner-offset": { "value": "0px", "type": "dimension" }
      }
    },
    {
      "id": "container",
      "title": "1e. Container tokens",
      "tokens": {
        "panel-padding": { "value": "20px", "type": "dimension" },
        "panel-radius": { "value": "0", "type": "dimension" },
        "sidebar-width": { "value": "320px", "type": "dimension" },
        "sidebar-margin": { "value": "20px", "type": "dimension" },
        "sidebar-space": { "value": "calc({sidebar-width} + {sidebar-margin} * 2)", "type": "dimension" },
        "sidebar-gap": { "value": "24px", "type": "dimension" },
        "panel-corner-image": { "value": "url('../images/forge-core-container-edge.png')", "type": "image", "description": "Top-left corner piece; other corners are mirrored" },
        "panel-corner-width": { "value": "40px", "type": "dimension" },
        "panel-corner-height": { "value": "32px", "type": "dimension" },
        "panel-corner-offset": { "value": "3px", "type": "dimension" }
      }
    },
    {
      "id": "effects",
      "title": "1f. Effects",
      "tokens": {
        "blur-overlay": { "value": "blur(4px)", "type": "filter" },
        "shadow-panel": { "value": "0 8px 32px rgba({c-black-rgb}, 0.45), inset 0 1px 0 rgba({c-white-rgb}, 0.04)", "type": "shadow" },
        "shadow-toast": { "value": "0 8px 24px rgba({c-black-rgb}, 0.4)", "type": "shadow" },
        "glow-accent": { "value": "0 0 12px rgba({c-signal-rgb}, 0.5)", "type": "text-shadow" },
        "glow-active": { "value": "0 0 10px rgba({c-signal-rgb}, 0.3)", "type": "shadow" }
      }
    },
    {
      "id": "typography",
      "title": "1g. Typography",
      "tokens": {
        "font-mono": { "value": "'Courier New', monospace", "type": "font-family" },
        "fs-display": { "value": "2.4rem", "type": "font-size" },
        "fs-h1": { "value": "1.15rem", "type": "font-size" },
        "fs-h2": { "value": "1.2rem", "type": "font-size" },
        "fs-h3": { "value": "0.7rem", "type": "font-size" },
        "fs-body": { "value": "0.8rem", "type": "font-size" },
        "fs-small": { "value": "0.75rem", "type": "font-size" },
        "fs-tiny": { "value": "0.68rem", "type": "font-size" },
        "ls-label": { "value": "1.5px", "type": "letter-spacing" },
        "ls-heading": { "value": "2px", "type": "letter-spacing" }
      }
    },
    {
      "id": "spacing",
      "title": "1h. Spacing",
      "tokens": {
        "space-1": { "value": "4px", "type": "dimension" },
        "space-2": { "value": "8px", "type": "dimension" },
        "space-3": { "value": "10px", "type": "dimension" },
        "space-4": { "value": "14px", "type": "dimension" },
        "space-5": { "value": "16px", "type": "dimension" },
        "space-6": { "value": "20px", "type": "dimension" }
      }
    },
    {
      "id": "radius",
      "title": "1i. Radius",
      "tokens": {
        "radius-sm": { "value": "6px", "type": "dimension" },
        "radius-pill": { "value": "999px", "type": "dimension" }
      }
    },
    {
      "id": "z-index",
      "title": "1j. Z-index",
      "tokens": {
        "z-canvas": { "value": "0", "type": "number" },
        "z-panel": { "value": "10", "type": "number" },
        "z-toast": { "value": "30", "type": "number" },
        "z-modal": { "value": "50", "type": "number" }
      }
    }
  ],
  "media": [
    {
      "id": "mobile",
      "title": "Small screens: sidebar takes half the width",
      "query": "(max-width: 760px)",
      "tokens": {
        "panel-padding": { "value": "10px 12px" },
        "sidebar-width": { "value": "50vw" },
        "sidebar-gap": { "value": "16px" },
        "sidebar-margin": { "value": "12px" }
      }
    }
  ]
}