{
  "$description": "Design token Salento.dev (formato W3C DTCG). Livelli: primitive (color, font, typography, spacing, radius) -> brand (colori del marchio dal media kit + colori con nome e ruolo da DESIGN.md del sito) -> semantic (ruoli della pagina brand e dei formati) -> group (icone dei gruppi: sfondo, accenti per gruppo, temporanei) + placeholder (colori segnaposto dei soggetti). Fonte di verità: questo repo (ADR-0011).",
  "color": {
    "$type": "color",
    "mist": {
      "50": {
        "$value": "#f9fbfb",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(98.7% 0.002 197.1)",
            "source": "tailwindcss@4 --color-mist-50"
          }
        }
      },
      "100": {
        "$value": "#f1f3f3",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(96.3% 0.002 197.1)",
            "source": "tailwindcss@4 --color-mist-100"
          }
        }
      },
      "200": {
        "$value": "#e3e7e8",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(92.5% 0.005 214.3)",
            "source": "tailwindcss@4 --color-mist-200"
          }
        }
      },
      "300": {
        "$value": "#d0d6d8",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(87.2% 0.007 219.6)",
            "source": "tailwindcss@4 --color-mist-300"
          }
        }
      },
      "400": {
        "$value": "#9ca8ab",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(72.3% 0.014 214.4)",
            "source": "tailwindcss@4 --color-mist-400"
          }
        }
      },
      "500": {
        "$value": "#67787c",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(56% 0.021 213.5)",
            "source": "tailwindcss@4 --color-mist-500"
          }
        }
      },
      "600": {
        "$value": "#4b585b",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(45% 0.017 213.2)",
            "source": "tailwindcss@4 --color-mist-600"
          }
        }
      },
      "700": {
        "$value": "#394447",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(37.8% 0.015 216)",
            "source": "tailwindcss@4 --color-mist-700"
          }
        }
      },
      "800": {
        "$value": "#22292b",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(27.5% 0.011 216.9)",
            "source": "tailwindcss@4 --color-mist-800"
          }
        }
      },
      "900": {
        "$value": "#161b1d",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(21.8% 0.008 223.9)",
            "source": "tailwindcss@4 --color-mist-900"
          }
        }
      },
      "950": {
        "$value": "#090b0c",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(14.8% 0.004 228.8)",
            "source": "tailwindcss@4 --color-mist-950"
          }
        }
      }
    },
    "cyan": {
      "50": {
        "$value": "#ecfeff",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(98.4% 0.019 200.873)",
            "source": "tailwindcss@4 --color-cyan-50"
          }
        }
      },
      "100": {
        "$value": "#cefafe",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(95.6% 0.045 203.388)",
            "source": "tailwindcss@4 --color-cyan-100"
          }
        }
      },
      "200": {
        "$value": "#a2f4fd",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(91.7% 0.08 205.041)",
            "source": "tailwindcss@4 --color-cyan-200"
          }
        }
      },
      "300": {
        "$value": "#53eafd",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(86.5% 0.127 207.078)",
            "source": "tailwindcss@4 --color-cyan-300"
          }
        }
      },
      "400": {
        "$value": "#00d3f2",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(78.9% 0.154 211.53)",
            "source": "tailwindcss@4 --color-cyan-400"
          }
        }
      },
      "500": {
        "$value": "#00b8db",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(71.5% 0.143 215.221)",
            "source": "tailwindcss@4 --color-cyan-500"
          }
        }
      },
      "600": {
        "$value": "#0092b8",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(60.9% 0.126 221.723)",
            "source": "tailwindcss@4 --color-cyan-600"
          }
        }
      },
      "700": {
        "$value": "#007595",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(52% 0.105 223.128)",
            "source": "tailwindcss@4 --color-cyan-700"
          }
        }
      },
      "800": {
        "$value": "#005f78",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(45% 0.085 224.283)",
            "source": "tailwindcss@4 --color-cyan-800"
          }
        }
      },
      "900": {
        "$value": "#104e64",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(39.8% 0.07 227.392)",
            "source": "tailwindcss@4 --color-cyan-900"
          }
        }
      },
      "950": {
        "$value": "#053345",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(30.2% 0.056 229.695)",
            "source": "tailwindcss@4 --color-cyan-950"
          }
        }
      }
    },
    "violet": {
      "50": {
        "$value": "#f5f3ff",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(96.9% 0.016 293.756)",
            "source": "tailwindcss@4 --color-violet-50"
          }
        }
      },
      "100": {
        "$value": "#ede9fe",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(94.3% 0.029 294.588)",
            "source": "tailwindcss@4 --color-violet-100"
          }
        }
      },
      "200": {
        "$value": "#ddd6ff",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(89.4% 0.057 293.283)",
            "source": "tailwindcss@4 --color-violet-200"
          }
        }
      },
      "300": {
        "$value": "#c4b4ff",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(81.1% 0.111 293.571)",
            "source": "tailwindcss@4 --color-violet-300"
          }
        }
      },
      "400": {
        "$value": "#a684ff",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(70.2% 0.183 293.541)",
            "source": "tailwindcss@4 --color-violet-400"
          }
        }
      },
      "500": {
        "$value": "#8e51ff",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(60.6% 0.25 292.717)",
            "source": "tailwindcss@4 --color-violet-500"
          }
        }
      },
      "600": {
        "$value": "#7f22fe",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(54.1% 0.281 293.009)",
            "source": "tailwindcss@4 --color-violet-600"
          }
        }
      },
      "700": {
        "$value": "#7008e7",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(49.1% 0.27 292.581)",
            "source": "tailwindcss@4 --color-violet-700"
          }
        }
      },
      "800": {
        "$value": "#5d0ec0",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(43.2% 0.232 292.759)",
            "source": "tailwindcss@4 --color-violet-800"
          }
        }
      },
      "900": {
        "$value": "#4d179a",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(38% 0.189 293.745)",
            "source": "tailwindcss@4 --color-violet-900"
          }
        }
      },
      "950": {
        "$value": "#2f0d68",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(28.3% 0.141 291.089)",
            "source": "tailwindcss@4 --color-violet-950"
          }
        }
      }
    },
    "fuchsia": {
      "50": {
        "$value": "#fdf4ff",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(97.7% 0.017 320.058)",
            "source": "tailwindcss@4 --color-fuchsia-50"
          }
        }
      },
      "100": {
        "$value": "#fae8ff",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(95.2% 0.037 318.852)",
            "source": "tailwindcss@4 --color-fuchsia-100"
          }
        }
      },
      "200": {
        "$value": "#f6cfff",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(90.3% 0.076 319.62)",
            "source": "tailwindcss@4 --color-fuchsia-200"
          }
        }
      },
      "300": {
        "$value": "#f4a8ff",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(83.3% 0.145 321.434)",
            "source": "tailwindcss@4 --color-fuchsia-300"
          }
        }
      },
      "400": {
        "$value": "#ed6aff",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(74% 0.238 322.16)",
            "source": "tailwindcss@4 --color-fuchsia-400"
          }
        }
      },
      "500": {
        "$value": "#e12afb",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(66.7% 0.295 322.15)",
            "source": "tailwindcss@4 --color-fuchsia-500"
          }
        }
      },
      "600": {
        "$value": "#c800de",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(59.1% 0.293 322.896)",
            "source": "tailwindcss@4 --color-fuchsia-600"
          }
        }
      },
      "700": {
        "$value": "#a800b7",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(51.8% 0.253 323.949)",
            "source": "tailwindcss@4 --color-fuchsia-700"
          }
        }
      },
      "800": {
        "$value": "#8a0194",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(45.2% 0.211 324.591)",
            "source": "tailwindcss@4 --color-fuchsia-800"
          }
        }
      },
      "900": {
        "$value": "#721378",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(40.1% 0.17 325.612)",
            "source": "tailwindcss@4 --color-fuchsia-900"
          }
        }
      },
      "950": {
        "$value": "#4b004f",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(29.3% 0.136 325.661)",
            "source": "tailwindcss@4 --color-fuchsia-950"
          }
        }
      }
    },
    "emerald": {
      "50": {
        "$value": "#ecfdf5",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(97.9% 0.021 166.113)",
            "source": "tailwindcss@4 --color-emerald-50"
          }
        }
      },
      "100": {
        "$value": "#d0fae5",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(95% 0.052 163.051)",
            "source": "tailwindcss@4 --color-emerald-100"
          }
        }
      },
      "200": {
        "$value": "#a4f4cf",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(90.5% 0.093 164.15)",
            "source": "tailwindcss@4 --color-emerald-200"
          }
        }
      },
      "300": {
        "$value": "#5ee9b5",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(84.5% 0.143 164.978)",
            "source": "tailwindcss@4 --color-emerald-300"
          }
        }
      },
      "400": {
        "$value": "#00d492",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(76.5% 0.177 163.223)",
            "source": "tailwindcss@4 --color-emerald-400"
          }
        }
      },
      "500": {
        "$value": "#00bc7d",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(69.6% 0.17 162.48)",
            "source": "tailwindcss@4 --color-emerald-500"
          }
        }
      },
      "600": {
        "$value": "#009966",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(59.6% 0.145 163.225)",
            "source": "tailwindcss@4 --color-emerald-600"
          }
        }
      },
      "700": {
        "$value": "#007a55",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(50.8% 0.118 165.612)",
            "source": "tailwindcss@4 --color-emerald-700"
          }
        }
      },
      "800": {
        "$value": "#006045",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(43.2% 0.095 166.913)",
            "source": "tailwindcss@4 --color-emerald-800"
          }
        }
      },
      "900": {
        "$value": "#004f3b",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(37.8% 0.077 168.94)",
            "source": "tailwindcss@4 --color-emerald-900"
          }
        }
      },
      "950": {
        "$value": "#002c22",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(26.2% 0.051 172.552)",
            "source": "tailwindcss@4 --color-emerald-950"
          }
        }
      }
    },
    "lime": {
      "50": {
        "$value": "#f7fee7",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(98.6% 0.031 120.757)",
            "source": "tailwindcss@4 --color-lime-50"
          }
        }
      },
      "100": {
        "$value": "#ecfcca",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(96.7% 0.067 122.328)",
            "source": "tailwindcss@4 --color-lime-100"
          }
        }
      },
      "200": {
        "$value": "#d8f999",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(93.8% 0.127 124.321)",
            "source": "tailwindcss@4 --color-lime-200"
          }
        }
      },
      "300": {
        "$value": "#bbf451",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(89.7% 0.196 126.665)",
            "source": "tailwindcss@4 --color-lime-300"
          }
        }
      },
      "400": {
        "$value": "#9ae600",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(84.1% 0.238 128.85)",
            "source": "tailwindcss@4 --color-lime-400"
          }
        }
      },
      "500": {
        "$value": "#7ccf00",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(76.8% 0.233 130.85)",
            "source": "tailwindcss@4 --color-lime-500"
          }
        }
      },
      "600": {
        "$value": "#5ea500",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(64.8% 0.2 131.684)",
            "source": "tailwindcss@4 --color-lime-600"
          }
        }
      },
      "700": {
        "$value": "#497d00",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(53.2% 0.157 131.589)",
            "source": "tailwindcss@4 --color-lime-700"
          }
        }
      },
      "800": {
        "$value": "#3c6300",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(45.3% 0.124 130.933)",
            "source": "tailwindcss@4 --color-lime-800"
          }
        }
      },
      "900": {
        "$value": "#35530e",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(40.5% 0.101 131.063)",
            "source": "tailwindcss@4 --color-lime-900"
          }
        }
      },
      "950": {
        "$value": "#192e03",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(27.4% 0.072 132.109)",
            "source": "tailwindcss@4 --color-lime-950"
          }
        }
      }
    },
    "amber": {
      "50": {
        "$value": "#fffbeb",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(98.7% 0.022 95.277)",
            "source": "tailwindcss@4 --color-amber-50"
          }
        }
      },
      "100": {
        "$value": "#fef3c6",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(96.2% 0.059 95.617)",
            "source": "tailwindcss@4 --color-amber-100"
          }
        }
      },
      "200": {
        "$value": "#fee685",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(92.4% 0.12 95.746)",
            "source": "tailwindcss@4 --color-amber-200"
          }
        }
      },
      "300": {
        "$value": "#ffd230",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(87.9% 0.169 91.605)",
            "source": "tailwindcss@4 --color-amber-300"
          }
        }
      },
      "400": {
        "$value": "#ffb900",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(82.8% 0.189 84.429)",
            "source": "tailwindcss@4 --color-amber-400"
          }
        }
      },
      "500": {
        "$value": "#fe9a00",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(76.9% 0.188 70.08)",
            "source": "tailwindcss@4 --color-amber-500"
          }
        }
      },
      "600": {
        "$value": "#e17100",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(66.6% 0.179 58.318)",
            "source": "tailwindcss@4 --color-amber-600"
          }
        }
      },
      "700": {
        "$value": "#bb4d00",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(55.5% 0.163 48.998)",
            "source": "tailwindcss@4 --color-amber-700"
          }
        }
      },
      "800": {
        "$value": "#973c00",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(47.3% 0.137 46.201)",
            "source": "tailwindcss@4 --color-amber-800"
          }
        }
      },
      "900": {
        "$value": "#7b3306",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(41.4% 0.112 45.904)",
            "source": "tailwindcss@4 --color-amber-900"
          }
        }
      },
      "950": {
        "$value": "#461901",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(27.9% 0.077 45.635)",
            "source": "tailwindcss@4 --color-amber-950"
          }
        }
      }
    },
    "green": {
      "400": {
        "$value": "#05df72",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(79.2% 0.209 151.711)",
            "source": "tailwindcss@4 --color-green-400"
          }
        }
      },
      "500": {
        "$value": "#00c950",
        "$extensions": {
          "dev.salento": {
            "oklch": "oklch(72.3% 0.219 149.579)",
            "source": "tailwindcss@4 --color-green-500"
          }
        }
      }
    },
    "pietra": {
      "$value": "#e2b45a",
      "$description": "Pietra leccese: oro caldo desaturato, accento dei gruppi temporanei. Vedi ADR-0003.",
      "$extensions": {
        "dev.salento": {
          "oklch": "oklch(79.4% 0.120 82.250)",
          "nearest": "amber-400 (piu desaturato)"
        }
      }
    },
    "pietra-dark": {
      "$value": "#976403",
      "$description": "Pietra in ombra: tono scuro della pietra per le ombre piatte dei soggetti temporanei. Calcolato, non dal sito (vedi ADR-0008).",
      "$extensions": {
        "dev.salento": {
          "oklch": "oklch(54.5% 0.115 73.944)",
          "derivation": "darkShade(pietra): L −25, C ×0.95, H −8° (src/color.js)"
        }
      }
    },
    "black": {
      "$value": "#000000",
      "$description": "Nero puro: telaio a puntini dietro il pannello (Void Black); Black del media kit (sfondo dei WEBP e delle anteprime del logo su scuro).",
      "$extensions": {
        "dev.salento": {
          "source": "tailwindcss@4 --color-black"
        }
      }
    },
    "white": {
      "$value": "#ffffff",
      "$description": "Bianco puro: White del media kit (logo white-on-dark, sfondo dei WEBP chiari).",
      "$extensions": {
        "dev.salento": {
          "source": "tailwindcss@4 --color-white; media kit Salento.dev 2026 (https://salento.dev/sd-media-kit-2026/)"
        }
      }
    },
    "salento": {
      "$description": "Colori del marchio dal media kit (ADR-0014): sono i colori del logo ufficiale. Non sono scale Tailwind.",
      "cyan": {
        "$value": "#20d0ed",
        "$description": "Salento Cyan (RGB 32, 208, 237): logo cyan-on-dark e colore primario del brand.",
        "$extensions": {
          "dev.salento": {
            "source": "media kit Salento.dev 2026 (https://salento.dev/sd-media-kit-2026/)",
            "oklch": "oklch(78.9% 0.134 212.9)",
            "nearest": "tra cyan-400 e cyan-500"
          }
        }
      },
      "dark": {
        "$value": "#1d1e1c",
        "$description": "Salento Dark (RGB 29, 30, 28): inchiostro del logo dark-on-light su sfondi chiari.",
        "$extensions": {
          "dev.salento": {
            "source": "media kit Salento.dev 2026 (https://salento.dev/sd-media-kit-2026/)",
            "oklch": "oklch(23.3% 0.004 128.7)"
          }
        }
      }
    }
  },
  "font": {
    "$type": "fontFamily",
    "outfit": {
      "$value": [
        "Outfit",
        "Albert Sans",
        "sans-serif"
      ]
    },
    "albert-sans": {
      "$value": [
        "Albert Sans",
        "Verdana",
        "sans-serif"
      ]
    },
    "roboto-mono": {
      "$value": [
        "Roboto Mono",
        "ui-monospace",
        "monospace"
      ]
    }
  },
  "font-weight": {
    "$type": "fontWeight",
    "light": {
      "$value": 300
    },
    "regular": {
      "$value": 400
    },
    "medium": {
      "$value": 500
    },
    "semibold": {
      "$value": 600
    },
    "bold": {
      "$value": 700
    },
    "black": {
      "$value": 900
    }
  },
  "typography": {
    "$type": "typography",
    "$description": "Gerarchia tipografica del sito (DESIGN.md). fontSize è il valore desktop; `responsive` indica la scala mobile → desktop.",
    "display": {
      "$value": {
        "fontFamily": "{font.outfit}",
        "fontSize": {
          "value": 4.5,
          "unit": "rem"
        },
        "fontWeight": 700,
        "lineHeight": 1.1,
        "letterSpacing": {
          "value": -0.025,
          "unit": "em"
        }
      },
      "$extensions": {
        "dev.salento": {
          "name": "Display",
          "source": "salento-dev/website DESIGN.md (chore/design-system-cleanup @ fb3aab5) typography.display",
          "responsive": "3rem → 4.5rem",
          "use": "Hero della home, con la prima riga in cyan."
        }
      }
    },
    "display-page": {
      "$value": {
        "fontFamily": "{font.outfit}",
        "fontSize": {
          "value": 4.5,
          "unit": "rem"
        },
        "fontWeight": 900,
        "lineHeight": 1.25,
        "letterSpacing": {
          "value": -0.05,
          "unit": "em"
        }
      },
      "$extensions": {
        "dev.salento": {
          "name": "Display Page",
          "source": "salento-dev/website DESIGN.md (chore/design-system-cleanup @ fb3aab5) typography.display-page",
          "responsive": "3rem → 4.5rem",
          "textTransform": "uppercase",
          "use": "Hero delle pagine interne, maiuscolo, una parola in cyan."
        }
      }
    },
    "headline": {
      "$value": {
        "fontFamily": "{font.outfit}",
        "fontSize": {
          "value": 3,
          "unit": "rem"
        },
        "fontWeight": 700,
        "lineHeight": 1,
        "letterSpacing": {
          "value": 0,
          "unit": "em"
        }
      },
      "$extensions": {
        "dev.salento": {
          "name": "Headline",
          "source": "salento-dev/website DESIGN.md (chore/design-system-cleanup @ fb3aab5) typography.headline",
          "responsive": "2.25rem → 3rem",
          "use": "Titolo degli header di sezione (variante small 1.5rem → 1.875rem)."
        }
      }
    },
    "title": {
      "$value": {
        "fontFamily": "{font.outfit}",
        "fontSize": {
          "value": 1.125,
          "unit": "rem"
        },
        "fontWeight": 700,
        "lineHeight": 1.5,
        "letterSpacing": {
          "value": 0,
          "unit": "em"
        }
      },
      "$extensions": {
        "dev.salento": {
          "name": "Title",
          "source": "salento-dev/website DESIGN.md (chore/design-system-cleanup @ fb3aab5) typography.title",
          "use": "Titoli di card e liste (500–700)."
        }
      }
    },
    "body": {
      "$value": {
        "fontFamily": "{font.albert-sans}",
        "fontSize": {
          "value": 1,
          "unit": "rem"
        },
        "fontWeight": 400,
        "lineHeight": 1.5,
        "letterSpacing": {
          "value": 0,
          "unit": "em"
        }
      },
      "$extensions": {
        "dev.salento": {
          "name": "Body",
          "source": "salento-dev/website DESIGN.md (chore/design-system-cleanup @ fb3aab5) typography.body",
          "use": "Testo corrente in Body Mist; estratti delle card a 0.875rem."
        }
      }
    },
    "body-lead": {
      "$value": {
        "fontFamily": "{font.albert-sans}",
        "fontSize": {
          "value": 1.125,
          "unit": "rem"
        },
        "fontWeight": 400,
        "lineHeight": 1.625,
        "letterSpacing": {
          "value": 0,
          "unit": "em"
        }
      },
      "$extensions": {
        "dev.salento": {
          "name": "Body Lead",
          "source": "salento-dev/website DESIGN.md (chore/design-system-cleanup @ fb3aab5) typography.body-lead",
          "use": "Descrizioni hero (300–400), larghezza massima ~42rem."
        }
      }
    },
    "eyebrow": {
      "$value": {
        "fontFamily": "{font.albert-sans}",
        "fontSize": {
          "value": 0.75,
          "unit": "rem"
        },
        "fontWeight": 600,
        "lineHeight": 1.5,
        "letterSpacing": {
          "value": 0.05,
          "unit": "em"
        }
      },
      "$extensions": {
        "dev.salento": {
          "name": "Eyebrow",
          "source": "salento-dev/website DESIGN.md (chore/design-system-cleanup @ fb3aab5) typography.eyebrow",
          "textTransform": "uppercase",
          "use": "Sopra i titoli di sezione, sempre in cyan."
        }
      }
    },
    "telemetry": {
      "$value": {
        "fontFamily": "{font.roboto-mono}",
        "fontSize": {
          "value": 0.625,
          "unit": "rem"
        },
        "fontWeight": 400,
        "lineHeight": 1,
        "letterSpacing": {
          "value": 0.1,
          "unit": "em"
        }
      },
      "$extensions": {
        "dev.salento": {
          "name": "Telemetry",
          "source": "salento-dev/website DESIGN.md (chore/design-system-cleanup @ fb3aab5) typography.telemetry",
          "textTransform": "uppercase",
          "use": "Etichette di sistema: stati, conteggi, percorsi, categorie."
        }
      }
    }
  },
  "spacing": {
    "1": {
      "$value": {
        "value": 4,
        "unit": "px"
      }
    },
    "2": {
      "$value": {
        "value": 8,
        "unit": "px"
      }
    },
    "3": {
      "$value": {
        "value": 12,
        "unit": "px"
      }
    },
    "4": {
      "$value": {
        "value": 16,
        "unit": "px"
      }
    },
    "6": {
      "$value": {
        "value": 24,
        "unit": "px"
      }
    },
    "8": {
      "$value": {
        "value": 32,
        "unit": "px"
      }
    },
    "12": {
      "$value": {
        "value": 48,
        "unit": "px"
      }
    },
    "16": {
      "$value": {
        "value": 64,
        "unit": "px"
      }
    },
    "$type": "dimension",
    "bracket": {
      "$value": {
        "value": 10,
        "unit": "px"
      },
      "$description": "Staffe d'angolo e angolo tagliato.",
      "$extensions": {
        "dev.salento": {
          "rem": "0.625rem",
          "source": "salento-dev/website DESIGN.md (chore/design-system-cleanup @ fb3aab5)"
        }
      }
    },
    "card": {
      "$value": {
        "value": 20,
        "unit": "px"
      },
      "$description": "Padding interno delle card.",
      "$extensions": {
        "dev.salento": {
          "rem": "1.25rem",
          "source": "salento-dev/website DESIGN.md (chore/design-system-cleanup @ fb3aab5)"
        }
      }
    },
    "control": {
      "$value": {
        "value": 40,
        "unit": "px"
      },
      "$description": "Altezza dei controlli (bottoni utility).",
      "$extensions": {
        "dev.salento": {
          "rem": "2.5rem",
          "source": "salento-dev/website DESIGN.md (chore/design-system-cleanup @ fb3aab5)"
        }
      }
    },
    "page-x": {
      "$value": {
        "value": 64,
        "unit": "px"
      },
      "$description": "Padding orizzontale della pagina (desktop; 1.5rem → 2rem → 4rem).",
      "$extensions": {
        "dev.salento": {
          "rem": "4rem",
          "source": "salento-dev/website DESIGN.md (chore/design-system-cleanup @ fb3aab5)"
        }
      }
    },
    "section": {
      "$value": {
        "value": 80,
        "unit": "px"
      },
      "$description": "Distanza tra le sezioni.",
      "$extensions": {
        "dev.salento": {
          "rem": "5rem",
          "source": "salento-dev/website DESIGN.md (chore/design-system-cleanup @ fb3aab5)"
        }
      }
    },
    "hero-y": {
      "$value": {
        "value": 128,
        "unit": "px"
      },
      "$description": "Padding verticale dell'hero (desktop; 6rem → 8rem).",
      "$extensions": {
        "dev.salento": {
          "rem": "8rem",
          "source": "salento-dev/website DESIGN.md (chore/design-system-cleanup @ fb3aab5)"
        }
      }
    }
  },
  "radius": {
    "$type": "dimension",
    "xs": {
      "$value": {
        "value": 2,
        "unit": "px"
      },
      "$description": "Default del sistema (0.125rem): card, input, tag, bottoni utility.",
      "$extensions": {
        "dev.salento": {
          "designMd": "rounded.xs"
        }
      }
    },
    "sm": {
      "$value": {
        "value": 2,
        "unit": "px"
      },
      "$description": "Uguale a xs (nome Tailwind v3), mantenuto per compatibilità."
    },
    "default": {
      "$value": {
        "value": 4,
        "unit": "px"
      },
      "$description": "Token --radius del sito (0.25rem): usato poco.",
      "$extensions": {
        "dev.salento": {
          "designMd": "rounded.sm"
        }
      }
    },
    "lg": {
      "$value": {
        "value": 6,
        "unit": "px"
      },
      "$description": "Quasi assente nel sito: non usare su card e contenitori.",
      "$extensions": {
        "dev.salento": {
          "designMd": "rounded.lg"
        }
      }
    },
    "xl": {
      "$value": {
        "value": 8,
        "unit": "px"
      },
      "$description": "Non usato dal sistema."
    },
    "full": {
      "$value": {
        "value": 9999,
        "unit": "px"
      },
      "$description": "Pill: solo CTA, badge e status pill.",
      "$extensions": {
        "dev.salento": {
          "designMd": "rounded.full"
        }
      }
    }
  },
  "brand": {
    "$description": "Colori con nome e ruolo. Importati da DESIGN.md del sito (salento-dev/website, branch chore/design-system-cleanup @ fb3aab5, 2026-10-24): `designMd` è il valore dichiarato lì, `siteToken` il token Tailwind del sito. Categorie: marchio (colori del logo, dal media kit: ADR-0014), neutri, primario, riserva, funzionali, community. Ambito delle regole: ADR-0012.",
    "color": {
      "$type": "color",
      "salento-cyan": {
        "$value": "{color.salento.cyan}",
        "$description": "Colore primario del brand e del logo (cyan-on-dark): la spia accesa. Solo su fondi scuri, mai su fondi chiari. Il sito usa ancora Signal Cyan (cyan-500) e migrerà a questo valore (ADR-0014).",
        "$extensions": {
          "dev.salento": {
            "name": "Salento Cyan",
            "category": "marchio",
            "source": "media kit Salento.dev 2026 (https://salento.dev/sd-media-kit-2026/)",
            "rgb": "32, 208, 237"
          }
        }
      },
      "salento-dark": {
        "$value": "{color.salento.dark}",
        "$description": "Inchiostro del logo su sfondi chiari (dark-on-light). Non è una superficie del sito: le superfici restano la scala mist.",
        "$extensions": {
          "dev.salento": {
            "name": "Salento Dark",
            "category": "marchio",
            "source": "media kit Salento.dev 2026 (https://salento.dev/sd-media-kit-2026/)",
            "rgb": "29, 30, 28"
          }
        }
      },
      "white": {
        "$value": "{color.white}",
        "$description": "Logo white-on-dark su sfondi scuri; sfondo dei WEBP chiari del logo pack.",
        "$extensions": {
          "dev.salento": {
            "name": "White",
            "category": "marchio",
            "source": "media kit Salento.dev 2026 (https://salento.dev/sd-media-kit-2026/)",
            "rgb": "255, 255, 255"
          }
        }
      },
      "black": {
        "$value": "{color.black}",
        "$description": "Sfondo dei WEBP scuri e delle anteprime del logo; sfondo dell'avatar.",
        "$extensions": {
          "dev.salento": {
            "name": "Black",
            "category": "marchio",
            "source": "media kit Salento.dev 2026 (https://salento.dev/sd-media-kit-2026/)",
            "rgb": "0, 0, 0"
          }
        }
      },
      "void-black": {
        "$value": "{color.black}",
        "$description": "Telaio della pagina dietro il pannello (nero + pattern a puntini) e corpo del terminale.",
        "$extensions": {
          "dev.salento": {
            "name": "Void Black",
            "category": "neutri",
            "designMd": "#000000",
            "siteToken": "black"
          }
        }
      },
      "console-black": {
        "$value": "{color.mist.950}",
        "$description": "Sfondo del pannello principale, header, hero.",
        "$extensions": {
          "dev.salento": {
            "name": "Console Black",
            "category": "neutri",
            "designMd": "oklch(14.8% 0.004 228.8)",
            "siteToken": "surface (mist-950)"
          }
        }
      },
      "panel-graphite": {
        "$value": "{color.mist.900}",
        "$description": "Card e moduli; sfondo dei bottoni utility.",
        "$extensions": {
          "dev.salento": {
            "name": "Panel Graphite",
            "category": "neutri",
            "designMd": "oklch(21.8% 0.008 223.9)",
            "siteToken": "surface-900"
          }
        }
      },
      "control-graphite": {
        "$value": "{color.mist.800}",
        "$description": "Input, tag, chip; colore di tutti i bordi a 1px e delle giunzioni triangolari.",
        "$extensions": {
          "dev.salento": {
            "name": "Control Graphite",
            "category": "neutri",
            "designMd": "oklch(27.5% 0.011 216.9)",
            "siteToken": "surface-800 = border"
          }
        }
      },
      "raised-graphite": {
        "$value": "{color.mist.700}",
        "$description": "Stato attivo dei bottoni, barra d'azione, ring delle miniature.",
        "$extensions": {
          "dev.salento": {
            "name": "Raised Graphite",
            "category": "neutri",
            "designMd": "oklch(37.8% 0.015 216)",
            "siteToken": "surface-700"
          }
        }
      },
      "bracket-grey": {
        "$value": "{color.mist.600}",
        "$description": "Staffe d'angolo a riposo, decorazioni.",
        "$extensions": {
          "dev.salento": {
            "name": "Bracket Grey",
            "category": "neutri",
            "designMd": "oklch(45% 0.017 213.2)",
            "siteToken": "surface-600"
          }
        }
      },
      "muted-mist": {
        "$value": "{color.mist.400}",
        "$description": "Meta info, descrizioni di sezione, conteggi.",
        "$extensions": {
          "dev.salento": {
            "name": "Muted Mist",
            "category": "neutri",
            "designMd": "oklch(72.3% 0.014 214.4)",
            "siteToken": "surface-400"
          }
        }
      },
      "body-mist": {
        "$value": "{color.mist.300}",
        "$description": "Testo corrente.",
        "$extensions": {
          "dev.salento": {
            "name": "Body Mist",
            "category": "neutri",
            "designMd": "oklch(87.2% 0.007 219.6)",
            "siteToken": "surface-300"
          }
        }
      },
      "soft-mist": {
        "$value": "{color.mist.200}",
        "$description": "Colore base dei titoli, testo dei tag.",
        "$extensions": {
          "dev.salento": {
            "name": "Soft Mist",
            "category": "neutri",
            "designMd": "oklch(92.5% 0.005 214.3)",
            "siteToken": "surface-200"
          }
        }
      },
      "bright-mist": {
        "$value": "{color.mist.50}",
        "$description": "Titoli di sezione, testo enfatizzato, sfondo della CTA pill, logo.",
        "$extensions": {
          "dev.salento": {
            "name": "Bright Mist",
            "category": "neutri",
            "designMd": "oklch(98.7% 0.002 197.1)",
            "siteToken": "surface-50"
          }
        }
      },
      "pattern-sand": {
        "$value": "#ebd8b1",
        "$description": "Puntini del pattern del telaio (5% di opacità, 15% per i puntini accesi). Unico neutro caldo: solo nel pattern.",
        "$extensions": {
          "dev.salento": {
            "name": "Pattern Sand",
            "category": "neutri",
            "siteToken": "resources/images/dots-pattern-15.png"
          }
        }
      },
      "signal-cyan": {
        "$value": "{color.cyan.500}",
        "$description": "Colore attuale dell'interfaccia del sito (primary = cyan-500), da migrare a Salento Cyan (ADR-0014). Ruolo: eyebrow, una parola nei titoli, link, icone, stato \"prossimo evento\", staffe in evidenza.",
        "$extensions": {
          "dev.salento": {
            "name": "Signal Cyan",
            "category": "primario",
            "designMd": "oklch(71.5% 0.143 215.221)",
            "siteToken": "primary (cyan-500)",
            "status": "da migrare a brand.color.salento-cyan"
          }
        }
      },
      "signal-cyan-deep": {
        "$value": "{color.cyan.700}",
        "$description": "Hover dei link primary.",
        "$extensions": {
          "dev.salento": {
            "name": "Signal Cyan Deep",
            "category": "primario",
            "designMd": "oklch(52% 0.105 223.128)",
            "siteToken": "primary-dark (cyan-700)"
          }
        }
      },
      "signal-cyan-pale": {
        "$value": "{color.cyan.300}",
        "$description": "Staffe della navbar. Usi minori, mai su grandi aree.",
        "$extensions": {
          "dev.salento": {
            "name": "Signal Cyan Pale",
            "category": "primario",
            "designMd": "oklch(86.5% 0.127 207.078)",
            "siteToken": "primary-light (cyan-300)"
          }
        }
      },
      "signal-cyan-wash": {
        "$value": "{color.cyan.50}",
        "$description": "Cerchio icona della CTA. Usi minori, mai su grandi aree.",
        "$extensions": {
          "dev.salento": {
            "name": "Signal Cyan Wash",
            "category": "primario",
            "designMd": "oklch(98.4% 0.019 200.873)",
            "siteToken": "cyan-50"
          }
        }
      },
      "reserve-violet": {
        "$value": "{color.violet.500}",
        "$description": "Riserva: non è una voce attiva dell'interfaccia (oggi solo l'hover di \"Clear\" nella ricerca).",
        "$extensions": {
          "dev.salento": {
            "name": "Reserve Violet",
            "category": "riserva",
            "designMd": "oklch(60.6% 0.25 292.717)",
            "siteToken": "secondary (violet-500)"
          }
        }
      },
      "reserve-fuchsia": {
        "$value": "{color.fuchsia.500}",
        "$description": "Riserva: inutilizzato nell'interfaccia.",
        "$extensions": {
          "dev.salento": {
            "name": "Reserve Fuchsia",
            "category": "riserva",
            "designMd": "oklch(66.7% 0.295 322.15)",
            "siteToken": "tertiary (fuchsia-500)"
          }
        }
      },
      "whatsapp-green": {
        "$value": "{color.green.400}",
        "$description": "Prestito funzionale: solo canale WhatsApp e stato \"in corso\". Mai decorazione.",
        "$extensions": {
          "dev.salento": {
            "name": "WhatsApp Green",
            "category": "funzionali",
            "designMd": "oklch(79.2% 0.209 151.711)",
            "siteToken": "green-400/500"
          }
        }
      },
      "wip-amber": {
        "$value": "{color.amber.500}",
        "$description": "Prestito funzionale: solo eventi in pianificazione (al 20%, testo amber-200). Mai decorazione.",
        "$extensions": {
          "dev.salento": {
            "name": "WIP Amber",
            "category": "funzionali",
            "designMd": "oklch(76.9% 0.188 70.08)",
            "siteToken": "amber-500"
          }
        }
      },
      "pietra": {
        "$value": "{color.pietra}",
        "$description": "Pietra leccese: accento fisso dei gruppi temporanei nelle grafiche della community. Non è l'ambra WIP (ADR-0003, ADR-0012).",
        "$extensions": {
          "dev.salento": {
            "name": "Pietra",
            "category": "community",
            "source": "brand (ADR-0003)"
          }
        }
      },
      "pietra-dark": {
        "$value": "{color.pietra-dark}",
        "$description": "Ombre piatte dei soggetti dei gruppi temporanei (calcolata, ADR-0008).",
        "$extensions": {
          "dev.salento": {
            "name": "Pietra in ombra",
            "category": "community",
            "source": "brand (ADR-0008)"
          }
        }
      }
    }
  },
  "semantic": {
    "$description": "Ruoli generali (brand book, galleria, formati futuri come le cover eventi). `primary` è Salento Cyan (ADR-0014). Le icone dei gruppi usano group.*.",
    "bg": {
      "$type": "color",
      "$value": "{color.mist.950}"
    },
    "surface": {
      "$type": "color",
      "$value": "{color.mist.900}"
    },
    "border": {
      "$type": "color",
      "$value": "{color.mist.800}"
    },
    "text": {
      "$type": "color",
      "$value": "{color.mist.50}"
    },
    "text-muted": {
      "$type": "color",
      "$value": "{color.mist.400}"
    },
    "primary": {
      "$type": "color",
      "$value": "{brand.color.salento-cyan}",
      "$description": "Colore primario: Salento Cyan (ADR-0014). Solo su fondi scuri."
    },
    "accent": {
      "$type": "color",
      "$value": "{semantic.primary}",
      "$description": "Link e accenti: alias di primary."
    },
    "ink-on-light": {
      "$type": "color",
      "$value": "{brand.color.salento-dark}",
      "$description": "Logo e segni del marchio su fondi chiari (Salento Dark)."
    },
    "secondary": {
      "$type": "color",
      "$value": "{color.violet.500}"
    },
    "font-headline": {
      "$type": "fontFamily",
      "$value": "{font.outfit}"
    },
    "font-body": {
      "$type": "fontFamily",
      "$value": "{font.albert-sans}"
    },
    "font-mono": {
      "$type": "fontFamily",
      "$value": "{font.roboto-mono}"
    },
    "radius": {
      "$type": "dimension",
      "$value": "{radius.xs}"
    }
  },
  "group": {
    "$description": "Icone dei gruppi WhatsApp (ADR-0007, ADR-0008). `accents.<nome>` = accenti ammessi nel campo `accent` dei gruppi permanenti; `temporary` = accento fisso dei gruppi temporanei. `accent` colora soggetto e doodle, `accent-dark` le ombre piatte.",
    "icon": {
      "bg": {
        "$type": "color",
        "$value": "{color.mist.900}",
        "$description": "Sfondo dell’icona (e colore degli stacchi tra le forme e del logo stampato)."
      },
      "highlight": {
        "$type": "color",
        "$value": "{color.mist.50}",
        "$description": "Riflessi e superfici chiare del soggetto."
      }
    },
    "accents": {
      "cyan": {
        "accent": {
          "$type": "color",
          "$value": "{color.cyan.400}"
        },
        "accent-dark": {
          "$type": "color",
          "$value": "{color.cyan.700}"
        }
      },
      "violet": {
        "accent": {
          "$type": "color",
          "$value": "{color.violet.400}"
        },
        "accent-dark": {
          "$type": "color",
          "$value": "{color.violet.700}"
        }
      },
      "fuchsia": {
        "accent": {
          "$type": "color",
          "$value": "{color.fuchsia.400}"
        },
        "accent-dark": {
          "$type": "color",
          "$value": "{color.fuchsia.700}"
        }
      },
      "emerald": {
        "accent": {
          "$type": "color",
          "$value": "{color.emerald.400}"
        },
        "accent-dark": {
          "$type": "color",
          "$value": "{color.emerald.700}"
        }
      },
      "lime": {
        "accent": {
          "$type": "color",
          "$value": "{color.lime.500}"
        },
        "accent-dark": {
          "$type": "color",
          "$value": "{color.lime.700}"
        },
        "$description": "lime-500 invece di 400: il 400 è troppo acido accanto agli altri accenti."
      }
    },
    "temporary": {
      "accent": {
        "$type": "color",
        "$value": "{color.pietra}"
      },
      "accent-dark": {
        "$type": "color",
        "$value": "{color.pietra-dark}"
      }
    }
  },
  "placeholder": {
    "$description": "Colori segnaposto con cui si disegnano i soggetti (assets/subjects/*.svg): il generatore li sostituisce con i colori del gruppo. Non sono colori del brand: non usarli altrove.",
    "accent": {
      "$type": "color",
      "$value": "#ff00ff",
      "$description": "→ group.accents.<accento>.accent (o pietra)"
    },
    "accent-dark": {
      "$type": "color",
      "$value": "#800080",
      "$description": "→ accent-dark (ombre piatte, parti secondarie)"
    },
    "highlight": {
      "$type": "color",
      "$value": "#ffffff",
      "$description": "→ group.icon.highlight (mist-50)"
    },
    "bg": {
      "$type": "color",
      "$value": "#000000",
      "$description": "→ group.icon.bg (stacchi tra le forme, logo stampato)"
    }
  }
}
