@cyberskill/design 2.1.0 → 2.3.0

package/tokens/tokens.json

@@ -1,17 +1,17 @@
 {
   "$meta": {
     "system": "CyberSkill Design System",
-    "version": "2.1.0",
+    "version": "2.3.0",
     "generated": "2026-07-23",
     "note": "Generated from tokens/*.css. Root grouped by category; theme/element scopes carry overrides only. Regenerate after any token change (see docs/conventions.md).",
     "declarationGraph": {
       "path": "declarations.json",
       "schemaVersion": 1,
-      "sha256": "d68eaff5b774f0a983856d217a1b31e7147d8aca04f607b390077db82de274fc",
-      "declarations": 1077,
+      "sha256": "7d502e7e02118db2ff6485e9cea94eca05a3f3ff64c92bddef93d876c3000bd1",
+      "declarations": 1080,
       "publicDeclarations": 397,
       "publicNames": 216,
-      "privateDeclarations": 680
+      "privateDeclarations": 683
     }
   },
   "root": {
@@ -90,14 +90,14 @@
     },
     "accent": {
       "--cs-accent": "#F4BA17",
-      "--cs-accent-strong": "#916D10",
+      "--cs-accent-strong": "#916D11",
       "--cs-accent-bright": "#F4BA17",
       "--cs-accent-on": "#45210E",
       "--cs-accent-tint": "#FBF4E9",
       "--cs-accent-ink": "#45210E",
       "--cs-accent-glow": "rgba(244, 186, 23, 0.48)",
       "--cs-accent-grad-a": "#F4BA17",
-      "--cs-accent-grad-b": "#F3B958",
+      "--cs-accent-grad-b": "#C4B78F",
       "--cs-accent-on-strong": "#FFFFFF"
     },
     "depth": {
@@ -319,22 +319,22 @@
   },
   "elements": {
     "tho.sand": {
-      "--cs-accent": "#F8E9C0",
-      "--cs-accent-strong": "#80724E",
-      "--cs-accent-bright": "#F6EBCC",
-      "--cs-accent-on": "#292414",
+      "--cs-accent": "#F9E3A7",
+      "--cs-accent-strong": "#856A03",
+      "--cs-accent-bright": "#FDEAB7",
+      "--cs-accent-on": "#271E06",
       "--cs-accent-on-strong": "#FFFFFF",
-      "--cs-accent-tint": "#FBF7EA",
-      "--cs-accent-ink": "#292414",
-      "--cs-accent-glow": "rgba(248, 233, 192, 0.48)",
-      "--cs-accent-grad-a": "#F8E9C0",
-      "--cs-accent-grad-b": "#F3B958",
-      "--cs-color-text-accent": "#625431",
-      "--cs-color-link": "#625431"
+      "--cs-accent-tint": "#FEF8E7",
+      "--cs-accent-ink": "#292108",
+      "--cs-accent-glow": "rgba(249, 227, 167, 0.48)",
+      "--cs-accent-grad-a": "#F9E3A7",
+      "--cs-accent-grad-b": "#C4B78F",
+      "--cs-color-text-accent": "#695300",
+      "--cs-color-link": "#695300"
     },
     "tho": {
       "--cs-accent": "#F4BA17",
-      "--cs-accent-strong": "#916D10",
+      "--cs-accent-strong": "#916D11",
       "--cs-accent-bright": "#F4BA17",
       "--cs-accent-on": "#45210E",
       "--cs-accent-on-strong": "#FFFFFF",
@@ -342,191 +342,191 @@
       "--cs-accent-ink": "#45210E",
       "--cs-accent-glow": "rgba(244, 186, 23, 0.48)",
       "--cs-accent-grad-a": "#F4BA17",
-      "--cs-accent-grad-b": "#F3B958",
+      "--cs-accent-grad-b": "#C4B78F",
       "--cs-color-text-accent": "#6E3B0E",
       "--cs-color-link": "#644A05"
     },
     "tho.clay": {
-      "--cs-accent": "#513801",
-      "--cs-accent-strong": "#201300",
-      "--cs-accent-bright": "#DEC7A2",
-      "--cs-accent-on": "#2D220E",
+      "--cs-accent": "#723E06",
+      "--cs-accent-strong": "#5A3004",
+      "--cs-accent-bright": "#F2C5A3",
+      "--cs-accent-on": "#080200",
       "--cs-accent-on-strong": "#FFFFFF",
-      "--cs-accent-tint": "#FFF6E7",
-      "--cs-accent-ink": "#2D220E",
-      "--cs-accent-glow": "rgba(81, 56, 1, 0.48)",
-      "--cs-accent-grad-a": "#513801",
-      "--cs-accent-grad-b": "#F3B958",
-      "--cs-color-text-accent": "#201300",
-      "--cs-color-link": "#201300"
+      "--cs-accent-tint": "#FCEEE3",
+      "--cs-accent-ink": "#321B07",
+      "--cs-accent-glow": "rgba(114, 62, 6, 0.48)",
+      "--cs-accent-grad-a": "#723E06",
+      "--cs-accent-grad-b": "#C4B78F",
+      "--cs-color-text-accent": "#462402",
+      "--cs-color-link": "#462402"
     },
     "hoa.plasma": {
-      "--cs-accent": "#FFE1D8",
-      "--cs-accent-strong": "#856E68",
-      "--cs-accent-bright": "#FCE6DF",
-      "--cs-accent-on": "#2C211E",
+      "--cs-accent": "#FEDBDC",
+      "--cs-accent-strong": "#896163",
+      "--cs-accent-bright": "#FFE3E4",
+      "--cs-accent-on": "#281B1C",
       "--cs-accent-on-strong": "#FFFFFF",
-      "--cs-accent-tint": "#FEF4F2",
-      "--cs-accent-ink": "#2C211E",
-      "--cs-accent-glow": "rgba(255, 225, 216, 0.48)",
-      "--cs-accent-grad-a": "#FFE1D8",
+      "--cs-accent-tint": "#FFF5F5",
+      "--cs-accent-ink": "#2B1E1E",
+      "--cs-accent-glow": "rgba(254, 219, 220, 0.48)",
+      "--cs-accent-grad-a": "#FEDBDC",
       "--cs-accent-grad-b": "#F4BA17",
-      "--cs-color-text-accent": "#66504B",
-      "--cs-color-link": "#66504B"
+      "--cs-color-text-accent": "#714B4D",
+      "--cs-color-link": "#714B4D"
     },
     "hoa": {
-      "--cs-accent": "#FCAF91",
-      "--cs-accent-strong": "#A46146",
-      "--cs-accent-bright": "#FED3C3",
-      "--cs-accent-on": "#381B10",
+      "--cs-accent": "#FC9C69",
+      "--cs-accent-strong": "#96440B",
+      "--cs-accent-bright": "#FFD3BD",
+      "--cs-accent-on": "#361402",
       "--cs-accent-on-strong": "#FFFFFF",
-      "--cs-accent-tint": "#FFF4F0",
-      "--cs-accent-ink": "#381B10",
-      "--cs-accent-glow": "rgba(252, 175, 145, 0.48)",
-      "--cs-accent-grad-a": "#FCAF91",
+      "--cs-accent-tint": "#FFF1EA",
+      "--cs-accent-ink": "#3A1501",
+      "--cs-accent-glow": "rgba(252, 156, 105, 0.48)",
+      "--cs-accent-grad-a": "#FC9C69",
       "--cs-accent-grad-b": "#F4BA17",
-      "--cs-color-text-accent": "#793B20",
-      "--cs-color-link": "#793B20"
+      "--cs-color-text-accent": "#793609",
+      "--cs-color-link": "#793609"
     },
     "hoa.lava": {
-      "--cs-accent": "#622B06",
-      "--cs-accent-strong": "#280D00",
-      "--cs-accent-bright": "#F1BEA4",
-      "--cs-accent-on": "#361D0F",
+      "--cs-accent": "#93050F",
+      "--cs-accent-strong": "#760008",
+      "--cs-accent-bright": "#FFBCB4",
+      "--cs-accent-on": "#0D0000",
       "--cs-accent-on-strong": "#FFFFFF",
-      "--cs-accent-tint": "#FFF4EF",
-      "--cs-accent-ink": "#361D0F",
-      "--cs-accent-glow": "rgba(98, 43, 6, 0.48)",
-      "--cs-accent-grad-a": "#622B06",
+      "--cs-accent-tint": "#FFEBE9",
+      "--cs-accent-ink": "#400C0B",
+      "--cs-accent-glow": "rgba(147, 5, 15, 0.48)",
+      "--cs-accent-grad-a": "#93050F",
       "--cs-accent-grad-b": "#F4BA17",
-      "--cs-color-text-accent": "#280D00",
-      "--cs-color-link": "#280D00"
+      "--cs-color-text-accent": "#550306",
+      "--cs-color-link": "#550306"
     },
     "thuy.mist": {
-      "--cs-accent": "#C0F5FC",
-      "--cs-accent-strong": "#4B7B81",
-      "--cs-accent-bright": "#CDF4F9",
-      "--cs-accent-on": "#13282B",
+      "--cs-accent": "#9DF7F5",
+      "--cs-accent-strong": "#037D7D",
+      "--cs-accent-bright": "#B1FBF9",
+      "--cs-accent-on": "#012525",
       "--cs-accent-on-strong": "#FFFFFF",
-      "--cs-accent-tint": "#EBFAFC",
-      "--cs-accent-ink": "#13282B",
-      "--cs-accent-glow": "rgba(192, 245, 252, 0.48)",
-      "--cs-accent-grad-a": "#C0F5FC",
-      "--cs-accent-grad-b": "#A3D768",
-      "--cs-color-text-accent": "#2E5E64",
-      "--cs-color-link": "#2E5E64"
+      "--cs-accent-tint": "#E6FDFC",
+      "--cs-accent-ink": "#032727",
+      "--cs-accent-glow": "rgba(157, 247, 245, 0.48)",
+      "--cs-accent-grad-a": "#9DF7F5",
+      "--cs-accent-grad-b": "#82CF66",
+      "--cs-color-text-accent": "#116060",
+      "--cs-color-link": "#116060"
     },
     "thuy": {
-      "--cs-accent": "#2EDBF7",
-      "--cs-accent-strong": "#0B7E8E",
-      "--cs-accent-bright": "#99EEFF",
-      "--cs-accent-on": "#012A30",
+      "--cs-accent": "#00CEE4",
+      "--cs-accent-strong": "#166B76",
+      "--cs-accent-bright": "#94EFFD",
+      "--cs-accent-on": "#012429",
       "--cs-accent-on-strong": "#FFFFFF",
-      "--cs-accent-tint": "#E7FBFF",
-      "--cs-accent-ink": "#012A30",
-      "--cs-accent-glow": "rgba(46, 219, 247, 0.48)",
-      "--cs-accent-grad-a": "#2EDBF7",
-      "--cs-accent-grad-b": "#A3D768",
-      "--cs-color-text-accent": "#035763",
-      "--cs-color-link": "#035763"
+      "--cs-accent-tint": "#DFFBFF",
+      "--cs-accent-ink": "#03272C",
+      "--cs-accent-glow": "rgba(0, 206, 228, 0.48)",
+      "--cs-accent-grad-a": "#00CEE4",
+      "--cs-accent-grad-b": "#82CF66",
+      "--cs-color-text-accent": "#0D535C",
+      "--cs-color-link": "#0D535C"
     },
     "thuy.ocean": {
-      "--cs-accent": "#004554",
-      "--cs-accent-strong": "#011A21",
-      "--cs-accent-bright": "#A8D3E0",
-      "--cs-accent-on": "#10282F",
+      "--cs-accent": "#06556F",
+      "--cs-accent-strong": "#034257",
+      "--cs-accent-bright": "#A9D8ED",
+      "--cs-accent-on": "#001721",
       "--cs-accent-on-strong": "#FFFFFF",
-      "--cs-accent-tint": "#EAFAFF",
-      "--cs-accent-ink": "#10282F",
-      "--cs-accent-glow": "rgba(0, 69, 84, 0.48)",
-      "--cs-accent-grad-a": "#004554",
-      "--cs-accent-grad-b": "#A3D768",
-      "--cs-color-text-accent": "#011A21",
-      "--cs-color-link": "#011A21"
+      "--cs-accent-tint": "#E5F3FA",
+      "--cs-accent-ink": "#092531",
+      "--cs-accent-glow": "rgba(6, 85, 111, 0.48)",
+      "--cs-accent-grad-a": "#06556F",
+      "--cs-accent-grad-b": "#82CF66",
+      "--cs-color-text-accent": "#003142",
+      "--cs-color-link": "#003142"
     },
     "moc.bamboo": {
-      "--cs-accent": "#E1F1C8",
-      "--cs-accent-strong": "#6B7754",
-      "--cs-accent-bright": "#E5F1D2",
-      "--cs-accent-on": "#212617",
+      "--cs-accent": "#DAEFAA",
+      "--cs-accent-strong": "#62780E",
+      "--cs-accent-bright": "#E2F4BA",
+      "--cs-accent-on": "#1C2307",
       "--cs-accent-on-strong": "#FFFFFF",
-      "--cs-accent-tint": "#F4F9ED",
-      "--cs-accent-ink": "#212617",
-      "--cs-accent-glow": "rgba(225, 241, 200, 0.48)",
-      "--cs-accent-grad-a": "#E1F1C8",
-      "--cs-accent-grad-b": "#FCAF91",
-      "--cs-color-text-accent": "#505C3A",
-      "--cs-color-link": "#505C3A"
+      "--cs-accent-tint": "#F5FBE8",
+      "--cs-accent-ink": "#1E250A",
+      "--cs-accent-glow": "rgba(218, 239, 170, 0.48)",
+      "--cs-accent-grad-a": "#DAEFAA",
+      "--cs-accent-grad-b": "#FC9C69",
+      "--cs-color-text-accent": "#4A5B02",
+      "--cs-color-link": "#4A5B02"
     },
     "moc": {
-      "--cs-accent": "#A3D768",
-      "--cs-accent-strong": "#528003",
-      "--cs-accent-bright": "#C5ED9C",
-      "--cs-accent-on": "#182A00",
+      "--cs-accent": "#82CF66",
+      "--cs-accent-strong": "#2B7100",
+      "--cs-accent-bright": "#B9F0A6",
+      "--cs-accent-on": "#0A2700",
       "--cs-accent-on-strong": "#FFFFFF",
-      "--cs-accent-tint": "#EFFCE3",
-      "--cs-accent-ink": "#182A00",
-      "--cs-accent-glow": "rgba(163, 215, 104, 0.48)",
-      "--cs-accent-grad-a": "#A3D768",
-      "--cs-accent-grad-b": "#FCAF91",
-      "--cs-color-text-accent": "#38570C",
-      "--cs-color-link": "#38570C"
+      "--cs-accent-tint": "#EAFAE5",
+      "--cs-accent-ink": "#0D2902",
+      "--cs-accent-glow": "rgba(130, 207, 102, 0.48)",
+      "--cs-accent-grad-a": "#82CF66",
+      "--cs-accent-grad-b": "#FC9C69",
+      "--cs-color-text-accent": "#24570B",
+      "--cs-color-link": "#24570B"
     },
     "moc.forest": {
-      "--cs-accent": "#1A4A01",
-      "--cs-accent-strong": "#051D00",
-      "--cs-accent-bright": "#B0D8A3",
-      "--cs-accent-on": "#162A0E",
+      "--cs-accent": "#105C36",
+      "--cs-accent-strong": "#0A4829",
+      "--cs-accent-bright": "#ACDDBD",
+      "--cs-accent-on": "#011C0D",
       "--cs-accent-on-strong": "#FFFFFF",
-      "--cs-accent-tint": "#ECFDE7",
-      "--cs-accent-ink": "#162A0E",
-      "--cs-accent-glow": "rgba(26, 74, 1, 0.48)",
-      "--cs-accent-grad-a": "#1A4A01",
-      "--cs-accent-grad-b": "#FCAF91",
-      "--cs-color-text-accent": "#051D00",
-      "--cs-color-link": "#051D00"
+      "--cs-accent-tint": "#E6F5EB",
+      "--cs-accent-ink": "#0B2818",
+      "--cs-accent-glow": "rgba(16, 92, 54, 0.48)",
+      "--cs-accent-grad-a": "#105C36",
+      "--cs-accent-grad-b": "#FC9C69",
+      "--cs-color-text-accent": "#04361D",
+      "--cs-color-link": "#04361D"
     },
     "kim.titanium": {
-      "--cs-accent": "#FEE5C7",
-      "--cs-accent-strong": "#847058",
-      "--cs-accent-bright": "#FBE8D2",
-      "--cs-accent-on": "#2B2217",
+      "--cs-accent": "#D3E7FC",
+      "--cs-accent-strong": "#56708B",
+      "--cs-accent-bright": "#DDEDFF",
+      "--cs-accent-on": "#182029",
       "--cs-accent-on-strong": "#FFFFFF",
-      "--cs-accent-tint": "#FDF5ED",
-      "--cs-accent-ink": "#2B2217",
-      "--cs-accent-glow": "rgba(254, 229, 199, 0.48)",
-      "--cs-accent-grad-a": "#FEE5C7",
-      "--cs-accent-grad-b": "#2EDBF7",
-      "--cs-color-text-accent": "#67543D",
-      "--cs-color-link": "#67543D"
+      "--cs-accent-tint": "#F3F8FE",
+      "--cs-accent-ink": "#1A232B",
+      "--cs-accent-glow": "rgba(211, 231, 252, 0.48)",
+      "--cs-accent-grad-a": "#D3E7FC",
+      "--cs-accent-grad-b": "#00CEE4",
+      "--cs-color-text-accent": "#3D5670",
+      "--cs-color-link": "#3D5670"
     },
     "kim": {
-      "--cs-accent": "#F3B958",
-      "--cs-accent-strong": "#996A08",
-      "--cs-accent-bright": "#FDD89F",
-      "--cs-accent-on": "#312002",
+      "--cs-accent": "#C4B78F",
+      "--cs-accent-strong": "#6A5E3A",
+      "--cs-accent-bright": "#E8DEBD",
+      "--cs-accent-on": "#241F0F",
       "--cs-accent-on-strong": "#FFFFFF",
-      "--cs-accent-tint": "#FFF5E7",
-      "--cs-accent-ink": "#312002",
-      "--cs-accent-glow": "rgba(243, 185, 88, 0.48)",
-      "--cs-accent-grad-a": "#F3B958",
-      "--cs-accent-grad-b": "#2EDBF7",
-      "--cs-color-text-accent": "#65460B",
-      "--cs-color-link": "#65460B"
+      "--cs-accent-tint": "#F8F4EA",
+      "--cs-accent-ink": "#262112",
+      "--cs-accent-glow": "rgba(196, 183, 143, 0.48)",
+      "--cs-accent-grad-a": "#C4B78F",
+      "--cs-accent-grad-b": "#00CEE4",
+      "--cs-color-text-accent": "#564B27",
+      "--cs-color-link": "#564B27"
     },
     "kim.steel": {
-      "--cs-accent": "#503901",
-      "--cs-accent-strong": "#1F1400",
-      "--cs-accent-bright": "#DCC8A2",
-      "--cs-accent-on": "#2D220E",
+      "--cs-accent": "#384D72",
+      "--cs-accent-strong": "#293C5C",
+      "--cs-accent-bright": "#BED0F0",
+      "--cs-accent-on": "#020818",
       "--cs-accent-on-strong": "#FFFFFF",
-      "--cs-accent-tint": "#FEF6E7",
-      "--cs-accent-ink": "#2D220E",
-      "--cs-accent-glow": "rgba(80, 57, 1, 0.48)",
-      "--cs-accent-grad-a": "#503901",
-      "--cs-accent-grad-b": "#2EDBF7",
-      "--cs-color-text-accent": "#1F1400",
-      "--cs-color-link": "#1F1400"
+      "--cs-accent-tint": "#EBF1FB",
+      "--cs-accent-ink": "#182232",
+      "--cs-accent-glow": "rgba(56, 77, 114, 0.48)",
+      "--cs-accent-grad-a": "#384D72",
+      "--cs-accent-grad-b": "#00CEE4",
+      "--cs-color-text-accent": "#1B2E4C",
+      "--cs-color-link": "#1B2E4C"
     }
   },
   "densities": {

package/tokens/typography.css

@@ -65,9 +65,8 @@
   --cs-letter-spacing-normal: 0;
   --cs-letter-spacing-caps: 0.08em; /* uppercase eyebrows / table headers */
 
-  /* Heading treatment (Expression-overridable — the TYPE half of the treatment axis,
-   * v3 Batch 0). Expressions retune these so headings read Swiss / editorial / luxe /
-   * brutalist, not just via radius+shadow. Base = today's values (extrabold, tight). */
+  /* Heading treatment — semantic heading family, weight, and tracking roles
+   * consumed by .cs-display and .cs-h1…h4 in base/typography.css. */
   --cs-heading-family: var(--cs-font-family-ui);
   --cs-heading-weight-strong: var(--cs-font-weight-extrabold); /* display · h1 */
   --cs-heading-weight: var(--cs-font-weight-bold);             /* h2 · h3 */