{
  "$schema": "https://www.designtokens.org/schemas/2025.10/format.json",
  "$description": "Supergraphic Panel — the Chat Archaeologist visual design system. Source palette and font families are extracted from packages/viewer/src/styles.css. Scale tokens (radius, shadow, duration, font.size, font.weight, status aliases) are prescriptive additions authored for replicators; see design-system/spec.md for rationale.",
  "color": {
    "sunflower": {
      "$value": "#ffcc99",
      "$type": "color",
      "$description": "Primary text and titles. Never decorative."
    },
    "sunflower-muted": {
      "$value": "#d9ad82",
      "$type": "color",
      "$description": "Pre-composited sunflower × 0.85 over black. Solid background for inactive sidebar items so black text holds 10.25:1 WCAG AAA regardless of backdrop."
    },
    "butterscotch": {
      "$value": "#dd9944",
      "$type": "color",
      "$description": "Chrome: top bar, sidebar elbows, ALL-CAPS labels, dividers. Never body text."
    },
    "butterscotch-muted": {
      "$value": "#6a4a20",
      "$type": "color",
      "$description": "Muted chrome for inactive mobile pill-bar items. Carries sunflower foreground at AA."
    },
    "ice": {
      "$value": "#99ccff",
      "$type": "color",
      "$description": "Data and code: model names, inline code, quantitative highlights. Decorative use forbidden."
    },
    "violet": {
      "$value": "#cc99cc",
      "$type": "color",
      "$description": "Thinking / processing state: streaming indicators, semantic-analysis running, copy-to-MD action."
    },
    "peach": {
      "$value": "#ff9933",
      "$type": "color",
      "$description": "Cost and error accent: cost bars, error banners, CLI-Direct badge. Attention, not alarm."
    },
    "bg": {
      "$value": "#000000",
      "$type": "color",
      "$description": "Root frame background. Pure black."
    },
    "bg-1": {
      "$value": "#07070a",
      "$type": "color",
      "$description": "Card and panel surface. One step above root."
    },
    "bg-2": {
      "$value": "#0d0d12",
      "$type": "color",
      "$description": "Card hover surface. One step above bg-1."
    },
    "text": {
      "$value": "#ffcc99",
      "$type": "color",
      "$description": "Alias for sunflower when used as a text color. Same value, semantic role differs."
    },
    "dim": {
      "$value": "#665544",
      "$type": "color",
      "$description": "Reserved for inert placeholder glyphs (em-dashes, \"—\", missing values). Not for functional text — fails WCAG AA for body."
    },
    "divider": {
      "$value": "rgba(221, 153, 68, 0.18)",
      "$type": "color",
      "$description": "rgba(221, 153, 68, 0.18). Panel and card borders. Inherits from butterscotch at low alpha."
    }
  },
  "font": {
    "family": {
      "chrome": {
        "$value": [
          "Antonio",
          "Oswald",
          "Impact",
          "sans-serif"
        ],
        "$type": "fontFamily",
        "$description": "ALL-CAPS labels, KPI values, titles, pills, top-bar. The voice of the chrome."
      },
      "prose": {
        "$value": [
          "IBM Plex Sans",
          "Segoe UI",
          "system-ui",
          "sans-serif"
        ],
        "$type": "fontFamily",
        "$description": "Body text inside cards and messages (≥12px paragraph text). IBM Plex Sans."
      },
      "mono": {
        "$value": [
          "JetBrains Mono",
          "Consolas",
          "Menlo",
          "monospace"
        ],
        "$type": "fontFamily",
        "$description": "Model names, timestamps, code, keyboard hints, axis ticks. JetBrains Mono."
      }
    },
    "weight": {
      "regular": {
        "$value": 400,
        "$type": "fontWeight",
        "$description": "Prescriptive: Body prose only. Both IBM Plex Sans and JetBrains Mono ship a regular weight."
      },
      "medium": {
        "$value": 500,
        "$type": "fontWeight",
        "$description": "Prescriptive: Default chrome weight. Antonio at 500 is the reliable fallback when 600/700 feel heavy."
      },
      "semibold": {
        "$value": 600,
        "$type": "fontWeight",
        "$description": "Prescriptive: Emphasized prose and mono."
      },
      "bold": {
        "$value": 700,
        "$type": "fontWeight",
        "$description": "Prescriptive: Titles, pills, ALL-CAPS labels, KPI values. The chrome default for anything that should read as a label."
      }
    },
    "size": {
      "9": {
        "$value": "9px",
        "$type": "dimension",
        "$description": "Prescriptive: Row-label and legend caps. Floor for legible Antonio caps with 0.18em tracking."
      },
      "10": {
        "$value": "10px",
        "$type": "dimension",
        "$description": "Prescriptive: Sidebar short badge, filter-row labels."
      },
      "11": {
        "$value": "11px",
        "$type": "dimension",
        "$description": "Prescriptive: Chrome labels, pill text."
      },
      "12": {
        "$value": "12px",
        "$type": "dimension",
        "$description": "Prescriptive: Body prose floor inside cards."
      },
      "13": {
        "$value": "13px",
        "$type": "dimension",
        "$description": "Prescriptive: Info-popover body prose."
      },
      "15": {
        "$value": "15.5px",
        "$type": "dimension",
        "$description": "Prescriptive: Session-card titles. Oddly specific on purpose — verified optically against the 2-line clamp at tier A."
      },
      "18": {
        "$value": "18px",
        "$type": "dimension",
        "$description": "Prescriptive: Top-bar title at tier B+."
      }
    }
  },
  "radius": {
    "sm": {
      "$value": "6px",
      "$type": "dimension",
      "$description": "Prescriptive: Card and panel corners at mobile tier."
    },
    "md": {
      "$value": "8px",
      "$type": "dimension",
      "$description": "Prescriptive: Card and panel corners at tablet / desktop."
    },
    "lg": {
      "$value": "10px",
      "$type": "dimension",
      "$description": "Prescriptive: Mid-bar and mode-area at desktop."
    },
    "pill": {
      "$value": "14px",
      "$type": "dimension",
      "$description": "Prescriptive: Source-pill, top-bar source-buttons (sized to half-height)."
    },
    "pill-lg": {
      "$value": "20px",
      "$type": "dimension",
      "$description": "Prescriptive: Narrow-banner, command-mode \"more\" button, search input at tier B+."
    },
    "elbow": {
      "$value": "32px",
      "$type": "dimension",
      "$description": "Prescriptive: Sidebar elbow at mobile. Asymmetric: `32px 0 0 0` or `0 0 0 32px` — never four-corner-equal."
    },
    "elbow-lg": {
      "$value": "40px",
      "$type": "dimension",
      "$description": "Prescriptive: Sidebar elbow at desktop. Anchors the L-corner where vertical and horizontal arms meet."
    }
  },
  "shadow": {
    "none": {
      "$value": "none",
      "$type": "shadow",
      "$description": "Prescriptive: Default. The system does not use drop shadows for hierarchy — hierarchy comes from left-accent rules, border color, and surface stepping (bg → bg-1 → bg-2)."
    },
    "panel": {
      "$value": {
        "color": "rgba(0, 0, 0, 0.6)",
        "offsetX": "0px",
        "offsetY": "10px",
        "blur": "40px",
        "spread": "0px"
      },
      "$type": "shadow",
      "$description": "Prescriptive: Reserved for floating panels that escape the frame (info-popover, rescan-banner, tier-sheet backdrop). Never on in-frame cards."
    },
    "ring-ice": {
      "$value": "inset 0 0 0 3px color-mix(in srgb, #99ccff 60%, transparent)",
      "$type": "shadow",
      "$description": "Prescriptive: Focus ring for quantitative / ice-accent contexts. Ring pulse, not glow."
    },
    "ring-violet": {
      "$value": "inset 0 0 0 3px color-mix(in srgb, #cc99cc 60%, transparent)",
      "$type": "shadow",
      "$description": "Prescriptive: Focus ring for thinking / violet-accent contexts."
    }
  },
  "duration": {
    "fast": {
      "$value": "80ms",
      "$type": "duration",
      "$description": "Prescriptive: Background color transitions on sidebar items, pill-bar pills."
    },
    "base": {
      "$value": "120ms",
      "$type": "duration",
      "$description": "Prescriptive: Default card hover transition (background, border, transform)."
    },
    "slow": {
      "$value": "200ms",
      "$type": "duration",
      "$description": "Prescriptive: Analysis-launcher progress-fill width transition."
    },
    "boot": {
      "$value": "1400ms",
      "$type": "duration",
      "$description": "Prescriptive: Full boot cascade from top-bar through command-mode cards. Individual panel animations sit at 400–600ms with staggered delays."
    },
    "pulse-focus": {
      "$value": "2200ms",
      "$type": "duration",
      "$description": "Prescriptive: Focus-pulse animations on filter-bar rows when navigated via analysis-tab cards."
    }
  },
  "status": {
    "concept": {
      "$value": "{color.violet}",
      "$type": "color",
      "$description": "Earliest / thinking state. Maps to violet. Prescriptive."
    },
    "active": {
      "$value": "{color.sunflower}",
      "$type": "color",
      "$description": "In-progress / primary state. Maps to sunflower. Prescriptive."
    },
    "open-pr": {
      "$value": "{color.ice}",
      "$type": "color",
      "$description": "In review / quantitative active state. Maps to ice. Prescriptive."
    },
    "merged": {
      "$value": "{color.butterscotch}",
      "$type": "color",
      "$description": "Completed / steady chrome state. Maps to butterscotch. Prescriptive."
    },
    "released": {
      "$value": "{color.peach}",
      "$type": "color",
      "$description": "Shipped / notable accent. Maps to peach. Prescriptive."
    }
  }
}