@cyberskill/design 1.0.0 → 1.1.0

package/tokens/styles.css

@@ -0,0 +1,15 @@
+/* Style axis — data-cs-style packs.
+ *
+ * Sole pack today: liquid-glass ≡ current elevation + base/glass.css materials.
+ * Absent attribute ≡ liquid-glass (same default pattern as light theme / Thổ middle).
+ * Future packs override glass scalars / material composition only and must consume
+ * the existing 9 --cs-accent-* roles — never invent parallel Element packs.
+ */
+
+:root {
+  --cs-style-pack: liquid-glass; /* @kind other */
+}
+
+[data-cs-style="liquid-glass"] {
+  --cs-style-pack: liquid-glass;
+}

package/tokens/tokens.dtcg.json

@@ -3,7 +3,7 @@
   "$extensions": {
     "com.cyberskill": {
       "system": "CyberSkill Design System",
-      "version": "1.0.0",
+      "version": "1.1.0",
       "generated": "2026-07-23",
       "source": "tokens/tokens.json",
       "note": "Scope overrides (dark/system theme · 15 element×variant packs) are carried under $extensions.overrides keyed by CSS selector — apply the matching selector on :root/ancestor to activate.",
@@ -59,305 +59,320 @@
           }
         },
         "elements": {
+          "tho.sand": {
+            "--cs-accent": "#F8E9C0",
+            "--cs-accent-strong": "#90825E",
+            "--cs-accent-bright": "#F6EBCC",
+            "--cs-accent-on": "#292414",
+            "--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": "#FCAF91",
+            "--cs-color-text-accent": "#90825E",
+            "--cs-color-link": "#90825E"
+          },
           "tho": {
             "--cs-accent": "#F4BA17",
-            "--cs-accent-strong": "#B98200",
+            "--cs-accent-strong": "#A47D17",
             "--cs-accent-bright": "#F4BA17",
             "--cs-accent-on": "#45210E",
             "--cs-accent-tint": "#FBF4E9",
             "--cs-accent-ink": "#45210E",
-            "--cs-accent-glow": "rgba(244, 186, 23, 0.5)",
+            "--cs-accent-glow": "rgba(244, 186, 23, 0.48)",
             "--cs-accent-grad-a": "#F4BA17",
-            "--cs-accent-grad-b": "#C77B4A"
+            "--cs-accent-grad-b": "#FCAF91"
           },
           "tho.clay": {
-            "--cs-accent": "#C77B4A",
-            "--cs-accent-strong": "#8F5230",
-            "--cs-accent-bright": "#EDBF9D",
-            "--cs-accent-on": "#2E1607",
-            "--cs-accent-tint": "#F8EDE4",
-            "--cs-accent-ink": "#2E1607",
-            "--cs-accent-glow": "rgba(199, 123, 74, 0.5)",
-            "--cs-accent-grad-a": "#C77B4A",
-            "--cs-accent-grad-b": "#F4BA17",
-            "--cs-color-text-accent": "#8F5230",
-            "--cs-color-link": "#8F5230"
+            "--cs-accent": "#513801",
+            "--cs-accent-strong": "#201300",
+            "--cs-accent-bright": "#DEC7A2",
+            "--cs-accent-on": "#2D220E",
+            "--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": "#FCAF91",
+            "--cs-color-text-accent": "#201300",
+            "--cs-color-link": "#201300"
           },
-          "tho.sand": {
-            "--cs-accent": "#E4C98F",
-            "--cs-accent-strong": "#A98B4E",
-            "--cs-accent-bright": "#EFDCB2",
-            "--cs-accent-on": "#3A2A10",
-            "--cs-accent-tint": "#FAF3E3",
-            "--cs-accent-ink": "#3A2A10",
-            "--cs-accent-glow": "rgba(228, 201, 143, 0.55)",
-            "--cs-accent-grad-a": "#E4C98F",
+          "hoa.plasma": {
+            "--cs-accent": "#FFE1D8",
+            "--cs-accent-strong": "#967C75",
+            "--cs-accent-bright": "#FCE6DF",
+            "--cs-accent-on": "#2C211E",
+            "--cs-accent-tint": "#FEF4F2",
+            "--cs-accent-ink": "#2C211E",
+            "--cs-accent-glow": "rgba(255, 225, 216, 0.48)",
+            "--cs-accent-grad-a": "#FFE1D8",
             "--cs-accent-grad-b": "#F4BA17",
-            "--cs-color-text-accent": "#8A6F3C",
-            "--cs-color-link": "#8A6F3C"
+            "--cs-color-text-accent": "#967C75",
+            "--cs-color-link": "#967C75"
           },
           "hoa": {
-            "--cs-accent": "#E0632B",
-            "--cs-accent-strong": "#A93E14",
-            "--cs-accent-bright": "#F6A26B",
-            "--cs-accent-on": "#231007",
-            "--cs-accent-tint": "#FBEADF",
-            "--cs-accent-ink": "#231007",
-            "--cs-accent-glow": "rgba(224, 99, 43, 0.5)",
-            "--cs-accent-grad-a": "#E0632B",
+            "--cs-accent": "#FCAF91",
+            "--cs-accent-strong": "#B47054",
+            "--cs-accent-bright": "#FED3C3",
+            "--cs-accent-on": "#381B10",
+            "--cs-accent-tint": "#FFF4F0",
+            "--cs-accent-ink": "#381B10",
+            "--cs-accent-glow": "rgba(252, 175, 145, 0.48)",
+            "--cs-accent-grad-a": "#FCAF91",
             "--cs-accent-grad-b": "#F4BA17",
-            "--cs-color-text-accent": "#A93E14",
-            "--cs-color-link": "#A93E14"
+            "--cs-color-text-accent": "#B47054",
+            "--cs-color-link": "#B47054"
           },
           "hoa.lava": {
-            "--cs-accent": "#C43D1F",
-            "--cs-accent-strong": "#7E1F0E",
-            "--cs-accent-bright": "#F6AC85",
-            "--cs-accent-on": "#1D0B05",
-            "--cs-accent-tint": "#FAE5DC",
-            "--cs-accent-ink": "#1D0B05",
-            "--cs-accent-glow": "rgba(196, 61, 31, 0.55)",
-            "--cs-accent-grad-a": "#C43D1F",
-            "--cs-accent-grad-b": "#E0632B",
-            "--cs-color-text-accent": "#9B2D14",
-            "--cs-color-link": "#9B2D14"
+            "--cs-accent": "#622B06",
+            "--cs-accent-strong": "#280D00",
+            "--cs-accent-bright": "#F1BEA4",
+            "--cs-accent-on": "#361D0F",
+            "--cs-accent-tint": "#FFF4EF",
+            "--cs-accent-ink": "#361D0F",
+            "--cs-accent-glow": "rgba(98, 43, 6, 0.48)",
+            "--cs-accent-grad-a": "#622B06",
+            "--cs-accent-grad-b": "#F4BA17",
+            "--cs-color-text-accent": "#280D00",
+            "--cs-color-link": "#280D00"
           },
-          "hoa.plasma": {
-            "--cs-accent": "#E8506E",
-            "--cs-accent-strong": "#B02348",
-            "--cs-accent-bright": "#F7A8B8",
-            "--cs-accent-on": "#200812",
-            "--cs-accent-tint": "#FBE6EB",
-            "--cs-accent-ink": "#200812",
-            "--cs-accent-glow": "rgba(232, 80, 110, 0.5)",
-            "--cs-accent-grad-a": "#E8506E",
-            "--cs-accent-grad-b": "#F08A52",
-            "--cs-color-text-accent": "#B02348",
-            "--cs-color-link": "#B02348"
+          "thuy.mist": {
+            "--cs-accent": "#C0F5FC",
+            "--cs-accent-strong": "#5A8A90",
+            "--cs-accent-bright": "#CDF4F9",
+            "--cs-accent-on": "#13282B",
+            "--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": "#5A8A90",
+            "--cs-color-link": "#5A8A90"
           },
           "thuy": {
-            "--cs-accent": "#4E8E9B",
-            "--cs-accent-strong": "#2F5E6B",
-            "--cs-accent-bright": "#A6D0DA",
-            "--cs-accent-on": "#0E1D20",
-            "--cs-accent-tint": "#E6F1F2",
-            "--cs-accent-ink": "#0E1D20",
-            "--cs-accent-glow": "rgba(78, 142, 155, 0.5)",
-            "--cs-accent-grad-a": "#4E8E9B",
-            "--cs-accent-grad-b": "#7A9B57",
-            "--cs-color-text-accent": "#2F5E6B",
-            "--cs-color-link": "#2F5E6B"
+            "--cs-accent": "#2EDBF7",
+            "--cs-accent-strong": "#108EA0",
+            "--cs-accent-bright": "#99EEFF",
+            "--cs-accent-on": "#012A30",
+            "--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": "#108EA0",
+            "--cs-color-link": "#108EA0"
           },
           "thuy.ocean": {
-            "--cs-accent": "#2E5E7E",
-            "--cs-accent-strong": "#1C3E56",
-            "--cs-accent-bright": "#A9CCE0",
-            "--cs-accent-on": "#0B161E",
-            "--cs-accent-tint": "#E4EEF4",
-            "--cs-accent-ink": "#0B161E",
-            "--cs-accent-glow": "rgba(46, 94, 126, 0.55)",
-            "--cs-accent-grad-a": "#2E5E7E",
-            "--cs-accent-grad-b": "#4E8E9B",
-            "--cs-color-text-accent": "#1C3E56",
-            "--cs-color-link": "#1C3E56"
+            "--cs-accent": "#004554",
+            "--cs-accent-strong": "#011A21",
+            "--cs-accent-bright": "#A8D3E0",
+            "--cs-accent-on": "#10282F",
+            "--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"
           },
-          "thuy.mist": {
-            "--cs-accent": "#A7C4C9",
-            "--cs-accent-strong": "#5E7F85",
-            "--cs-accent-bright": "#C4DADD",
-            "--cs-accent-on": "#16262A",
-            "--cs-accent-tint": "#F0F6F7",
-            "--cs-accent-ink": "#16262A",
-            "--cs-accent-glow": "rgba(167, 196, 201, 0.55)",
-            "--cs-accent-grad-a": "#A7C4C9",
-            "--cs-accent-grad-b": "#4E8E9B",
-            "--cs-color-text-accent": "#4A686E",
-            "--cs-color-link": "#4A686E"
+          "moc.bamboo": {
+            "--cs-accent": "#E1F1C8",
+            "--cs-accent-strong": "#7C8965",
+            "--cs-accent-bright": "#E5F1D2",
+            "--cs-accent-on": "#212617",
+            "--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": "#7C8965",
+            "--cs-color-link": "#7C8965"
           },
           "moc": {
-            "--cs-accent": "#7A9B57",
-            "--cs-accent-strong": "#4C6B35",
-            "--cs-accent-bright": "#A9C177",
-            "--cs-accent-on": "#18200F",
-            "--cs-accent-tint": "#EEF3E2",
-            "--cs-accent-ink": "#18200F",
-            "--cs-accent-glow": "rgba(122, 155, 87, 0.5)",
-            "--cs-accent-grad-a": "#7A9B57",
-            "--cs-accent-grad-b": "#E0632B",
-            "--cs-color-text-accent": "#4C6B35",
-            "--cs-color-link": "#4C6B35"
-          },
-          "moc.bamboo": {
-            "--cs-accent": "#A9C177",
-            "--cs-accent-strong": "#6B8442",
-            "--cs-accent-bright": "#C4D69B",
-            "--cs-accent-on": "#1C240F",
-            "--cs-accent-tint": "#F3F7E8",
-            "--cs-accent-ink": "#1C240F",
-            "--cs-accent-glow": "rgba(169, 193, 119, 0.55)",
-            "--cs-accent-grad-a": "#A9C177",
-            "--cs-accent-grad-b": "#7A9B57",
-            "--cs-color-text-accent": "#5B7237",
-            "--cs-color-link": "#5B7237"
+            "--cs-accent": "#A3D768",
+            "--cs-accent-strong": "#629122",
+            "--cs-accent-bright": "#C5ED9C",
+            "--cs-accent-on": "#182A00",
+            "--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": "#629122",
+            "--cs-color-link": "#629122"
           },
           "moc.forest": {
-            "--cs-accent": "#3E5A2E",
-            "--cs-accent-strong": "#263A1B",
-            "--cs-accent-bright": "#B3CE9B",
-            "--cs-accent-on": "#101708",
-            "--cs-accent-tint": "#E9EFE1",
-            "--cs-accent-ink": "#101708",
-            "--cs-accent-glow": "rgba(62, 90, 46, 0.55)",
-            "--cs-accent-grad-a": "#3E5A2E",
-            "--cs-accent-grad-b": "#7A9B57",
-            "--cs-color-text-accent": "#31481F",
-            "--cs-color-link": "#31481F"
+            "--cs-accent": "#1A4A01",
+            "--cs-accent-strong": "#051D00",
+            "--cs-accent-bright": "#B0D8A3",
+            "--cs-accent-on": "#162A0E",
+            "--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"
+          },
+          "kim.titanium": {
+            "--cs-accent": "#FEE5C7",
+            "--cs-accent-strong": "#947F65",
+            "--cs-accent-bright": "#FBE8D2",
+            "--cs-accent-on": "#2B2217",
+            "--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": "#947F65",
+            "--cs-color-link": "#947F65"
           },
           "kim": {
-            "--cs-accent": "#BFB29B",
-            "--cs-accent-strong": "#7E7160",
-            "--cs-accent-bright": "#D8CCB6",
-            "--cs-accent-on": "#221C12",
-            "--cs-accent-tint": "#F3EFE6",
-            "--cs-accent-ink": "#221C12",
-            "--cs-accent-glow": "rgba(191, 178, 155, 0.5)",
-            "--cs-accent-grad-a": "#BFB29B",
-            "--cs-accent-grad-b": "#4E8E9B",
-            "--cs-color-text-accent": "#6E6151",
-            "--cs-color-link": "#6E6151"
+            "--cs-accent": "#F3B958",
+            "--cs-accent-strong": "#AC780B",
+            "--cs-accent-bright": "#FDD89F",
+            "--cs-accent-on": "#312002",
+            "--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": "#AC780B",
+            "--cs-color-link": "#AC780B"
           },
           "kim.steel": {
-            "--cs-accent": "#9FA3A3",
-            "--cs-accent-strong": "#63696B",
-            "--cs-accent-bright": "#C2C6C6",
-            "--cs-accent-on": "#191D1E",
-            "--cs-accent-tint": "#EFF1F1",
-            "--cs-accent-ink": "#191D1E",
-            "--cs-accent-glow": "rgba(159, 163, 163, 0.5)",
-            "--cs-accent-grad-a": "#9FA3A3",
-            "--cs-accent-grad-b": "#BFB29B",
-            "--cs-color-text-accent": "#565C5E",
-            "--cs-color-link": "#565C5E"
-          },
-          "kim.titanium": {
-            "--cs-accent": "#8A7F72",
-            "--cs-accent-strong": "#56504A",
-            "--cs-accent-bright": "#D9CFC0",
-            "--cs-accent-on": "#171310",
-            "--cs-accent-tint": "#EFEBE5",
-            "--cs-accent-ink": "#171310",
-            "--cs-accent-glow": "rgba(138, 127, 114, 0.5)",
-            "--cs-accent-grad-a": "#8A7F72",
-            "--cs-accent-grad-b": "#BFB29B",
-            "--cs-color-text-accent": "#56504A",
-            "--cs-color-link": "#56504A"
+            "--cs-accent": "#503901",
+            "--cs-accent-strong": "#1F1400",
+            "--cs-accent-bright": "#DCC8A2",
+            "--cs-accent-on": "#2D220E",
+            "--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"
           }
         },
         "elementsDark": {
+          "tho-sand": {
+            "--cs-accent": "#F8E9C0",
+            "--cs-accent-bright": "#F6EBCC",
+            "--cs-accent-strong": "#665A37",
+            "--cs-accent-on": "#f5ead9",
+            "--cs-accent-tint": "#332701",
+            "--cs-accent-ink": "#F6EBCC"
+          },
           "tho": {
+            "--cs-accent": "#F4BA17",
             "--cs-accent-bright": "#FEC42C",
-            "--cs-accent-strong": "#795507",
+            "--cs-accent-strong": "#73560B",
             "--cs-accent-on": "#f5ead9",
-            "--cs-accent-tint": "#2F2203",
-            "--cs-accent-ink": "#FEC849"
+            "--cs-accent-tint": "#352602",
+            "--cs-accent-ink": "#FECD5E"
           },
           "tho-clay": {
-            "--cs-accent": "#F3A372",
-            "--cs-accent-bright": "#F4C5A3",
-            "--cs-accent-strong": "#864927",
+            "--cs-accent": "#CDB07E",
+            "--cs-accent-bright": "#E4CDA8",
+            "--cs-accent-strong": "#1F1300",
             "--cs-accent-on": "#f5ead9",
-            "--cs-accent-tint": "#371C0B",
-            "--cs-accent-ink": "#F7C8A6"
+            "--cs-accent-tint": "#372502",
+            "--cs-accent-ink": "#E7D0AB"
           },
-          "tho-sand": {
-            "--cs-accent-strong": "#725615",
+          "hoa-plasma": {
+            "--cs-accent": "#FFE1D8",
+            "--cs-accent-bright": "#FCE6DF",
+            "--cs-accent-strong": "#6F5750",
             "--cs-accent-on": "#f5ead9",
-            "--cs-accent-tint": "#2F2203",
-            "--cs-accent-ink": "#EFDCB2"
+            "--cs-accent-tint": "#38231C",
+            "--cs-accent-ink": "#FCE6DF"
           },
           "hoa": {
-            "--cs-accent": "#FB9E7A",
-            "--cs-accent-bright": "#FEC099",
-            "--cs-accent-strong": "#9F3405",
+            "--cs-accent": "#FCAF91",
+            "--cs-accent-bright": "#FED3C3",
+            "--cs-accent-strong": "#8A4A30",
             "--cs-accent-on": "#f5ead9",
-            "--cs-accent-tint": "#381B10",
-            "--cs-accent-ink": "#FEC5A1"
+            "--cs-accent-tint": "#411E0F",
+            "--cs-accent-ink": "#FED3C3"
           },
           "hoa-lava": {
-            "--cs-accent": "#FE9982",
-            "--cs-accent-bright": "#FFBF9E",
+            "--cs-accent": "#E8A683",
+            "--cs-accent-bright": "#F8C4AA",
+            "--cs-accent-strong": "#280D00",
             "--cs-accent-on": "#f5ead9",
-            "--cs-accent-tint": "#391A13",
-            "--cs-accent-ink": "#FFC4A5"
+            "--cs-accent-tint": "#401F0B",
+            "--cs-accent-ink": "#FBC7AD"
           },
-          "hoa-plasma": {
-            "--cs-accent": "#FD97A3",
-            "--cs-accent-bright": "#FDBECA",
-            "--cs-accent-strong": "#A91A43",
+          "thuy-mist": {
+            "--cs-accent": "#C0F5FC",
+            "--cs-accent-bright": "#CDF4F9",
+            "--cs-accent-strong": "#316167",
             "--cs-accent-on": "#f5ead9",
-            "--cs-accent-tint": "#38191D",
-            "--cs-accent-ink": "#FDC3CE"
+            "--cs-accent-tint": "#022F34",
+            "--cs-accent-ink": "#CDF4F9"
           },
           "thuy": {
-            "--cs-accent": "#7FC0CE",
-            "--cs-accent-bright": "#ACD7E1",
+            "--cs-accent": "#2EDBF7",
+            "--cs-accent-bright": "#99EEFF",
+            "--cs-accent-strong": "#046270",
             "--cs-accent-on": "#f5ead9",
-            "--cs-accent-tint": "#042930",
-            "--cs-accent-ink": "#AFDAE4"
+            "--cs-accent-tint": "#032F36",
+            "--cs-accent-ink": "#99EEFF"
           },
           "thuy-ocean": {
-            "--cs-accent": "#87B9DD",
-            "--cs-accent-bright": "#B2D6EA",
+            "--cs-accent": "#82BCCD",
+            "--cs-accent-bright": "#ABD6E3",
+            "--cs-accent-strong": "#011A21",
             "--cs-accent-on": "#f5ead9",
-            "--cs-accent-tint": "#08273A",
-            "--cs-accent-ink": "#B2D6EA"
+            "--cs-accent-tint": "#002F3A",
+            "--cs-accent-ink": "#AED9E6"
           },
-          "thuy-mist": {
-            "--cs-accent-strong": "#3F5F65",
+          "moc-bamboo": {
+            "--cs-accent": "#E1F1C8",
+            "--cs-accent-bright": "#E5F1D2",
+            "--cs-accent-strong": "#54603E",
             "--cs-accent-on": "#f5ead9",
-            "--cs-accent-tint": "#0F282C",
-            "--cs-accent-ink": "#C4DADD"
+            "--cs-accent-tint": "#232D0B",
+            "--cs-accent-ink": "#E5F1D2"
           },
           "moc": {
-            "--cs-accent": "#9BBE78",
-            "--cs-accent-bright": "#BFD88D",
-            "--cs-accent-strong": "#44622D",
+            "--cs-accent": "#A3D768",
+            "--cs-accent-bright": "#C5ED9C",
+            "--cs-accent-strong": "#416501",
             "--cs-accent-on": "#f5ead9",
-            "--cs-accent-tint": "#1C290D",
-            "--cs-accent-ink": "#C2DB90"
+            "--cs-accent-tint": "#1F2E0B",
+            "--cs-accent-ink": "#C5ED9C"
           },
-          "moc-bamboo": {
-            "--cs-accent-strong": "#4C6421",
+          "moc-forest": {
+            "--cs-accent": "#8EC27D",
+            "--cs-accent-bright": "#B0D8A3",
+            "--cs-accent-strong": "#061D00",
             "--cs-accent-on": "#f5ead9",
-            "--cs-accent-tint": "#1F280A",
-            "--cs-accent-ink": "#C7D99E"
+            "--cs-accent-tint": "#193011",
+            "--cs-accent-ink": "#B6DFA9"
           },
-          "moc-forest": {
-            "--cs-accent": "#9EBE8D",
-            "--cs-accent-bright": "#BDD8A4",
+          "kim-titanium": {
+            "--cs-accent": "#FEE5C7",
+            "--cs-accent-bright": "#FBE8D2",
+            "--cs-accent-strong": "#6B573E",
             "--cs-accent-on": "#f5ead9",
-            "--cs-accent-tint": "#19290F",
-            "--cs-accent-ink": "#C0DBA7"
+            "--cs-accent-tint": "#37250B",
+            "--cs-accent-ink": "#FBE8D2"
           },
           "kim": {
-            "--cs-accent-strong": "#675A4A",
+            "--cs-accent": "#F3B958",
+            "--cs-accent-bright": "#FDD89F",
+            "--cs-accent-strong": "#795303",
             "--cs-accent-on": "#f5ead9",
-            "--cs-accent-tint": "#2D220F",
-            "--cs-accent-ink": "#DBCFB9"
+            "--cs-accent-tint": "#382503",
+            "--cs-accent-ink": "#FDD89F"
           },
           "kim-steel": {
-            "--cs-accent": "#B2B6B6",
-            "--cs-accent-bright": "#CCD0D0",
-            "--cs-accent-strong": "#555B5D",
-            "--cs-accent-on": "#f5ead9",
-            "--cs-accent-tint": "#222525",
-            "--cs-accent-ink": "#CFD3D3"
-          },
-          "kim-titanium": {
-            "--cs-accent": "#BFB3A5",
+            "--cs-accent": "#CCB17E",
+            "--cs-accent-bright": "#DFCBA5",
+            "--cs-accent-strong": "#1F1400",
             "--cs-accent-on": "#f5ead9",
-            "--cs-accent-tint": "#2B2217",
-            "--cs-accent-ink": "#D9CFC0"
+            "--cs-accent-tint": "#362602",
+            "--cs-accent-ink": "#E6D1AB"
           }
         }
       }
@@ -540,7 +555,7 @@
       "$type": "color"
     },
     "--cs-accent-strong": {
-      "$value": "#B98200",
+      "$value": "#A47D17",
       "$type": "color"
     },
     "--cs-accent-bright": {
@@ -560,7 +575,7 @@
       "$type": "color"
     },
     "--cs-accent-glow": {
-      "$value": "rgba(244, 186, 23, 0.5)",
+      "$value": "rgba(244, 186, 23, 0.48)",
       "$type": "color"
     },
     "--cs-accent-grad-a": {
@@ -568,7 +583,7 @@
       "$type": "color"
     },
     "--cs-accent-grad-b": {
-      "$value": "#C77B4A",
+      "$value": "#FCAF91",
       "$type": "color"
     }
   },
@@ -965,6 +980,16 @@
       ],
       "$type": "fontFamily"
     },
+    "--cs-font-family-display": {
+      "$value": [
+        "Space Grotesk",
+        "Be Vietnam Pro",
+        "ui-sans-serif",
+        "system-ui",
+        "sans-serif"
+      ],
+      "$type": "fontFamily"
+    },
     "--cs-font-family-mono": {
       "$value": [
         "JetBrains Mono",