/* BRAND tokens for bladestack.io style guide
   All brand colors live here; nothing else hardcodes color values. */
const BRAND = {
  primary: {
    50:  "#EEF0FF",
    100: "#DCE0FF",
    200: "#B9C1FF",
    300: "#8D99FF",
    400: "#6975FF",
    500: "#4353FF",
    600: "#3543E0",
    700: "#2A36B8",
    800: "#232C90",
    900: "#1B2270",
  },
  secondary: {
    50:  "#EEFAF6",
    100: "#DCF4ED",
    200: "#BCEADE",
    300: "#99DFCF",
    400: "#7AD4C0",
    500: "#5BC9B1",
    600: "#42AE96",
    700: "#318A77",
    800: "#226458",
    900: "#143F38",
  },
  surface: {
    canvas:  "#EFEFEF",
    card:    "#FFFFFF",
    callout: "#E8EAFF",
    rowAlt:  "#DCE0FF",
    border:  "#E5E7EB",
    grid:    "#E8EAEC",
  },
  ink: {
    body:   "#0F172A",
    muted:  "#4A4A5A",
    subtle: "#6B7280",
    light:  "#9CA3AF",
  },
  dark: {
    navyDeep:   "#050817",
    navy:       "#0A0E27",
    navyAccent: "#1B1D3A",
    slate:      "#1F2330",
    slateMuted: "#7C8493",
  },
  semantic: {
    success: "#10B981",
    warning: "#F59E0B",
    danger:  "#DC2626",
    info:    "#4353FF",
  },
  diagram: {
    a: "#DC2626",
    b: "#4353FF",
    c: "#D946EF",
    d: "#F97316",
    e: "#10B981",
  },
};

/* Type tiers — name, css, sample */
const TYPE_SCALE = [
  { name: "Cover Title",   size: 64, weight: 700, tracking: "-0.025em", sample: "Brand & Style" },
  { name: "Surface Title", size: 40, weight: 700, tracking: "-0.02em",  sample: "Numbered structure" },
  { name: "Section Lead",  size: 24, weight: 700, tracking: "-0.01em",  sample: "The grid is felt, not seen." },
  { name: "Card Heading",  size: 18, weight: 700, tracking: "0",        sample: "Restraint over decoration" },
  { name: "Eyebrow",       size: 12, weight: 700, tracking: "0.18em",   sample: "01 · PRINCIPLES", upper: true, color: "primary500" },
  { name: "Body",          size: 16, weight: 400, tracking: "0",        sample: "One signature blue carries every surface. One secondary teal provides contrast." },
  { name: "Caption",       size: 12, weight: 400, tracking: "0",        sample: "Fallback typeface when Aptos is unavailable.", color: "subtle" },
  { name: "Mono",          size: 13, weight: 500, tracking: "0",        sample: "#4353FF · const primary = 500", mono: true },
];

/* Approved gradient tokens — for Patterns tab */
const GRADIENT_TOKENS = [
  {
    name: "Primary Linear",
    role: "Hero CTA, active step indicators",
    css: "linear-gradient(135deg, #4353FF 0%, #2A36B8 100%)",
  },
  {
    name: "Primary Vivid",
    role: "Compact hero, accent strip",
    css: "linear-gradient(135deg, #6975FF 0%, #4353FF 50%, #232C90 100%)",
  },
  {
    name: "Secondary Linear",
    role: "Secondary CTA, data series two",
    css: "linear-gradient(135deg, #5BC9B1 0%, #318A77 100%)",
  },
  {
    name: "Brand Duo",
    role: "Footer pill, dual color bar",
    css: "linear-gradient(90deg, #4353FF 0%, #4353FF 50%, #5BC9B1 50%, #5BC9B1 100%)",
  },
  {
    name: "Surface Glow",
    role: "Atmosphere wash, low opacity overlay",
    css: "radial-gradient(60% 60% at 50% 30%, #DCE0FF 0%, rgba(220,224,255,0) 70%)",
  },
  {
    name: "Cover Mesh",
    role: "Cover and closing surfaces only",
    css: "conic-gradient(from 220deg at 70% 30%, #1B1D3A, #0A0E27, #050817, #232C90, #1B1D3A)",
  },
];

/* Six principles */
const PRINCIPLES = [
  {
    n: "01",
    title: "Restraint over decoration.",
    body: "One signature color, used intentionally. Surfaces stay quiet so the data carries the page.",
  },
  {
    n: "02",
    title: "Numbered structure.",
    body: "Numbered lists with primary-blue numerals are the default content rhythm. Prose is the fallback, not the default.",
  },
  {
    n: "03",
    title: "Tables earn the page.",
    body: "Primary-blue header band, alternating rows in white and light primary, no vertical borders. A table is a commitment.",
  },
  {
    n: "04",
    title: "Callouts mark the load-bearing claim.",
    body: "Pale primary background, left bar in primary blue. One per surface. If everything is highlighted, nothing is.",
  },
  {
    n: "05",
    title: "Section eyebrows orient the reader.",
    body: "Two-character number, middot, all-caps label, primary-blue underline. Top-left of every content surface.",
  },
  {
    n: "06",
    title: "Grid backdrop, never feature.",
    body: "A subtle 40px grid sits behind every surface. Felt, not seen. If you can read it without looking, opacity is too high.",
  },
];

Object.assign(window, { BRAND, TYPE_SCALE, GRADIENT_TOKENS, PRINCIPLES });