@cyberskill/design 1.1.1 → 1.3.8

package/tokens/elevation.css

@@ -4,13 +4,19 @@
  * the material composition + classes live in base/glass.css.
  * Shadow values are warm (umber-tinted), taken from the shipped surfaces. */
 :root {
-  /* ---- Depth (z-index) ---- */
+  /* ---- Depth (z-index) ----
+   * Order (low → high): bg < section < card < nav < dropdown < overlay < modal < toast.
+   * Toasts intentionally stack above modals so save-confirmation feedback stays visible
+   * while a dialog is open (UX-009). Dropdown sits above sticky nav; overlay (scrims
+   * that are not modal-owned) sits between dropdown and modal. */
   --cs-depth-bg: 0;        /* @kind other */ /* page background / hero washes */
   --cs-depth-section: 5;   /* @kind other */ /* major sections (matte, no glass) */
   --cs-depth-card: 10;     /* @kind other */ /* cards/panels (Standard Glass) */
   --cs-depth-nav: 50;      /* @kind other */ /* sticky nav (Light Glass) */
+  --cs-depth-dropdown: 60; /* @kind other */ /* menus, combobox, datepicker pops */
+  --cs-depth-overlay: 80;  /* @kind other */ /* non-modal scrims / light overlays */
   --cs-depth-modal: 100;   /* @kind other */ /* modals, command palette (Heavy Glass) */
-  --cs-depth-toast: 200;   /* @kind other */ /* toasts, popovers, dropdowns (Heavy Glass) */
+  --cs-depth-toast: 200;   /* @kind other */ /* toasts above modals (Heavy Glass) */
 
   /* ---- Glass material scalars (blur / saturate / surface opacity) ---- */
   --cs-glass-whisper-blur: 8px;   --cs-glass-whisper-saturate: 110%; --cs-glass-whisper-opacity: 60%;

package/tokens/native/CSTokens.kt

@@ -1,6 +1,6 @@
 // CyberSkill Design System — native design tokens.
 // GENERATED from tokens/tokens.dtcg.json — do not hand-edit; regenerate on token change.
-// release v1.1.1 · source sha256 9386ad73cf23d458…
+// release v1.3.8 · source sha256 5d7d5587bec9b99e…
 // conversions: rem→px at 16 · em→…Em relative doubles · rgba alpha→ARGB byte (round(a*255)) · durations in ms
 // dark element packs: see $extensions.overrides.elementsDark
 // provenance: tokens/provenance.json · parity gate: _audit/token-pipeline-test.html
@@ -28,6 +28,10 @@ object CSTokens {
   val colorBorderDefault = Color(0xFFE7D9C6)
   val colorLink = Color(0xFF6E3B0E)
   val colorLinkHover = Color(0xFF45210E)
+  val colorSemanticSuccessFg = Color(0xFFFFFFFF)
+  val colorSemanticDangerFg = Color(0xFFFFFFFF)
+  val colorSemanticWarningFg = Color(0xFFFFFFFF)
+  val colorSemanticInfoFg = Color(0xFFFFFFFF)
   val componentButtonPrimaryBg = Color(0xFF45210E)
   val componentButtonPrimaryFg = Color(0xFFFFFFFF)
   val componentButtonGap = 8.dp
@@ -52,6 +56,7 @@ object CSTokens {
   val componentTextfieldPaddingY = 10.dp
   val componentTextfieldPaddingX = 12.dp
   val componentTextfieldMinHeight = 44.dp
+  val focusRing = 3.dp
   val accent = Color(0xFFF4BA17)
   val accentStrong = Color(0xFFA47D17)
   val accentBright = Color(0xFFF4BA17)
@@ -60,13 +65,16 @@ object CSTokens {
   val accentInk = Color(0xFF45210E)
   val accentGlow = Color(0x7AF4BA17)
   val accentGradA = Color(0xFFF4BA17)
-  val accentGradB = Color(0xFFFCAF91)
+  val accentGradB = Color(0xFFF3B958)
+  val accentOnStrong = Color(0xFF1A1108)
   val depthBg = 0
   val depthSection = 5
   val depthCard = 10
   val depthNav = 50
   val depthModal = 100
   val depthToast = 200
+  val depthDropdown = 60
+  val depthOverlay = 80
   val glassWhisperBlur = 8.dp
   val glassWhisperSaturate = "110%"
   val glassWhisperOpacity = "60%"
@@ -110,12 +118,14 @@ object CSTokens {
   val radiusLg = 14.dp
   val radiusFull = 999.dp
   val breakpointXs = 0.dp
+  val breakpointPhone = 360.dp
   val breakpointSm = 640.dp
   val breakpointMd = 768.dp
   val breakpointLg = 1024.dp
   val breakpointXl = 1280.dp
   val breakpoint2xl = 1536.dp
   val containerMax = 1320.dp
+  val proseMeasure = 720.dp
   val fontFamilyUi = "Be Vietnam Pro, ui-sans-serif, system-ui, sans-serif"
   val fontFamilyDisplay = "Space Grotesk, Be Vietnam Pro, ui-sans-serif, system-ui, sans-serif"
   val fontFamilyMono = "JetBrains Mono, ui-monospace, SFMono-Regular, Menlo, Consolas, monospace"
@@ -127,6 +137,7 @@ object CSTokens {
   val fontLineHeightBody = 1.5f
   val fontLineHeightHeading = 1.35f
   val fontLineHeightTight = 1.15f
+  val fontSize2xs = 11.dp
   val fontSizeXs = 12.dp
   val fontSizeSm = 14.dp
   val fontSizeBase = 16.dp
@@ -145,6 +156,7 @@ object CSTokens {
   val textBodyLg = "var(--cs-font-size-md)"
   val textBody = "var(--cs-font-size-base)"
   val textSecondary = "var(--cs-font-size-sm)"
+  val textMicro = "var(--cs-font-size-2xs)"
   val textCaption = "var(--cs-font-size-xs)"
   val textEyebrow = "var(--cs-font-size-xs)"
   val letterSpacingTightEm = -0.01f
@@ -157,6 +169,10 @@ object CSTokens {
   val iconSm = 16.dp
   val iconMd = 20.dp
   val iconLg = 24.dp
+  val docInk = Color(0xFF1A1614)
+  val docSlate = Color(0xFF3F4C55)
+  val docFill = Color(0xFFFDE68A)
+  val docFillInk = Color(0xFF1A1614)
 
   // dark-theme color overrides
   val colorSurfacePageDark = Color(0xFF1A1108)
@@ -176,96 +192,115 @@ object CSTokens {
   val componentButtonPrimaryBgDark = Color(0xFFF4BA17)
   val componentButtonPrimaryFgDark = Color(0xFF1A1108)
   val componentTextfieldBorderDefaultDark = Color(0xFF5A4636)
+  val colorSemanticSuccessFgDark = Color(0xFF1A1108)
+  val colorSemanticDangerFgDark = Color(0xFF1A1108)
+  val colorSemanticWarningFgDark = Color(0xFF1A1108)
+  val colorSemanticInfoFgDark = Color(0xFF1A1108)
 
   // dark elemental accent packs (APCA-derived, v4.0.0)
   val accentThoSandDark = Color(0xFFF8E9C0)
   val accentBrightThoSandDark = Color(0xFFF6EBCC)
   val accentStrongThoSandDark = Color(0xFF665A37)
   val accentOnThoSandDark = Color(0xFFF5EAD9)
+  val accentOnStrongThoSandDark = Color(0xFFFFFDF8)
   val accentTintThoSandDark = Color(0xFF332701)
   val accentInkThoSandDark = Color(0xFFF6EBCC)
   val accentThoDark = Color(0xFFF4BA17)
   val accentBrightThoDark = Color(0xFFFEC42C)
   val accentStrongThoDark = Color(0xFF73560B)
   val accentOnThoDark = Color(0xFFF5EAD9)
+  val accentOnStrongThoDark = Color(0xFFFFFDF8)
   val accentTintThoDark = Color(0xFF352602)
   val accentInkThoDark = Color(0xFFFECD5E)
   val accentThoClayDark = Color(0xFFCDB07E)
   val accentBrightThoClayDark = Color(0xFFE4CDA8)
   val accentStrongThoClayDark = Color(0xFF1F1300)
   val accentOnThoClayDark = Color(0xFFF5EAD9)
+  val accentOnStrongThoClayDark = Color(0xFFFFFDF8)
   val accentTintThoClayDark = Color(0xFF372502)
   val accentInkThoClayDark = Color(0xFFE7D0AB)
   val accentHoaPlasmaDark = Color(0xFFFFE1D8)
   val accentBrightHoaPlasmaDark = Color(0xFFFCE6DF)
   val accentStrongHoaPlasmaDark = Color(0xFF6F5750)
   val accentOnHoaPlasmaDark = Color(0xFFF5EAD9)
+  val accentOnStrongHoaPlasmaDark = Color(0xFFFFFDF8)
   val accentTintHoaPlasmaDark = Color(0xFF38231C)
   val accentInkHoaPlasmaDark = Color(0xFFFCE6DF)
   val accentHoaDark = Color(0xFFFCAF91)
   val accentBrightHoaDark = Color(0xFFFED3C3)
   val accentStrongHoaDark = Color(0xFF8A4A30)
   val accentOnHoaDark = Color(0xFFF5EAD9)
+  val accentOnStrongHoaDark = Color(0xFFFFFDF8)
   val accentTintHoaDark = Color(0xFF411E0F)
   val accentInkHoaDark = Color(0xFFFED3C3)
   val accentHoaLavaDark = Color(0xFFE8A683)
   val accentBrightHoaLavaDark = Color(0xFFF8C4AA)
   val accentStrongHoaLavaDark = Color(0xFF280D00)
   val accentOnHoaLavaDark = Color(0xFFF5EAD9)
+  val accentOnStrongHoaLavaDark = Color(0xFFFFFDF8)
   val accentTintHoaLavaDark = Color(0xFF401F0B)
   val accentInkHoaLavaDark = Color(0xFFFBC7AD)
   val accentThuyMistDark = Color(0xFFC0F5FC)
   val accentBrightThuyMistDark = Color(0xFFCDF4F9)
   val accentStrongThuyMistDark = Color(0xFF316167)
   val accentOnThuyMistDark = Color(0xFFF5EAD9)
+  val accentOnStrongThuyMistDark = Color(0xFFFFFDF8)
   val accentTintThuyMistDark = Color(0xFF022F34)
   val accentInkThuyMistDark = Color(0xFFCDF4F9)
   val accentThuyDark = Color(0xFF2EDBF7)
   val accentBrightThuyDark = Color(0xFF99EEFF)
   val accentStrongThuyDark = Color(0xFF046270)
   val accentOnThuyDark = Color(0xFFF5EAD9)
+  val accentOnStrongThuyDark = Color(0xFFFFFDF8)
   val accentTintThuyDark = Color(0xFF032F36)
   val accentInkThuyDark = Color(0xFF99EEFF)
   val accentThuyOceanDark = Color(0xFF82BCCD)
   val accentBrightThuyOceanDark = Color(0xFFABD6E3)
   val accentStrongThuyOceanDark = Color(0xFF011A21)
   val accentOnThuyOceanDark = Color(0xFFF5EAD9)
+  val accentOnStrongThuyOceanDark = Color(0xFFFFFDF8)
   val accentTintThuyOceanDark = Color(0xFF002F3A)
   val accentInkThuyOceanDark = Color(0xFFAED9E6)
   val accentMocBambooDark = Color(0xFFE1F1C8)
   val accentBrightMocBambooDark = Color(0xFFE5F1D2)
   val accentStrongMocBambooDark = Color(0xFF54603E)
   val accentOnMocBambooDark = Color(0xFFF5EAD9)
+  val accentOnStrongMocBambooDark = Color(0xFFFFFDF8)
   val accentTintMocBambooDark = Color(0xFF232D0B)
   val accentInkMocBambooDark = Color(0xFFE5F1D2)
   val accentMocDark = Color(0xFFA3D768)
   val accentBrightMocDark = Color(0xFFC5ED9C)
   val accentStrongMocDark = Color(0xFF416501)
   val accentOnMocDark = Color(0xFFF5EAD9)
+  val accentOnStrongMocDark = Color(0xFFFFFDF8)
   val accentTintMocDark = Color(0xFF1F2E0B)
   val accentInkMocDark = Color(0xFFC5ED9C)
   val accentMocForestDark = Color(0xFF8EC27D)
   val accentBrightMocForestDark = Color(0xFFB0D8A3)
   val accentStrongMocForestDark = Color(0xFF061D00)
   val accentOnMocForestDark = Color(0xFFF5EAD9)
+  val accentOnStrongMocForestDark = Color(0xFFFFFDF8)
   val accentTintMocForestDark = Color(0xFF193011)
   val accentInkMocForestDark = Color(0xFFB6DFA9)
   val accentKimTitaniumDark = Color(0xFFFEE5C7)
   val accentBrightKimTitaniumDark = Color(0xFFFBE8D2)
   val accentStrongKimTitaniumDark = Color(0xFF6B573E)
   val accentOnKimTitaniumDark = Color(0xFFF5EAD9)
+  val accentOnStrongKimTitaniumDark = Color(0xFFFFFDF8)
   val accentTintKimTitaniumDark = Color(0xFF37250B)
   val accentInkKimTitaniumDark = Color(0xFFFBE8D2)
   val accentKimDark = Color(0xFFF3B958)
   val accentBrightKimDark = Color(0xFFFDD89F)
   val accentStrongKimDark = Color(0xFF795303)
   val accentOnKimDark = Color(0xFFF5EAD9)
+  val accentOnStrongKimDark = Color(0xFFFFFDF8)
   val accentTintKimDark = Color(0xFF382503)
   val accentInkKimDark = Color(0xFFFDD89F)
   val accentKimSteelDark = Color(0xFFCCB17E)
   val accentBrightKimSteelDark = Color(0xFFDFCBA5)
   val accentStrongKimSteelDark = Color(0xFF1F1400)
   val accentOnKimSteelDark = Color(0xFFF5EAD9)
+  val accentOnStrongKimSteelDark = Color(0xFFFFFDF8)
   val accentTintKimSteelDark = Color(0xFF362602)
   val accentInkKimSteelDark = Color(0xFFE6D1AB)
 }

package/tokens/native/CSTokens.swift

@@ -1,6 +1,6 @@
 // CyberSkill Design System — native design tokens.
 // GENERATED from tokens/tokens.dtcg.json — do not hand-edit; regenerate on token change.
-// release v1.1.1 · source sha256 9386ad73cf23d458…
+// release v1.3.8 · source sha256 5d7d5587bec9b99e…
 // conversions: rem→px at 16 · em→…Em relative doubles · rgba alpha→ARGB byte (round(a*255)) · durations in ms
 // dark element packs: see $extensions.overrides.elementsDark
 // provenance: tokens/provenance.json · parity gate: _audit/token-pipeline-test.html
@@ -30,6 +30,10 @@ public enum CSTokens {
   public static let colorBorderDefault = color(0xE7D9C6)
   public static let colorLink = color(0x6E3B0E)
   public static let colorLinkHover = color(0x45210E)
+  public static let colorSemanticSuccessFg = color(0xFFFFFF)
+  public static let colorSemanticDangerFg = color(0xFFFFFF)
+  public static let colorSemanticWarningFg = color(0xFFFFFF)
+  public static let colorSemanticInfoFg = color(0xFFFFFF)
   public static let componentButtonPrimaryBg = color(0x45210E)
   public static let componentButtonPrimaryFg = color(0xFFFFFF)
   public static let componentButtonGap: CGFloat = 8
@@ -54,6 +58,7 @@ public enum CSTokens {
   public static let componentTextfieldPaddingY: CGFloat = 10
   public static let componentTextfieldPaddingX: CGFloat = 12
   public static let componentTextfieldMinHeight: CGFloat = 44
+  public static let focusRing: CGFloat = 3
   public static let accent = color(0xF4BA17)
   public static let accentStrong = color(0xA47D17)
   public static let accentBright = color(0xF4BA17)
@@ -62,13 +67,16 @@ public enum CSTokens {
   public static let accentInk = color(0x45210E)
   public static let accentGlow = color(0xF4BA17, alpha: 0.48)
   public static let accentGradA = color(0xF4BA17)
-  public static let accentGradB = color(0xFCAF91)
+  public static let accentGradB = color(0xF3B958)
+  public static let accentOnStrong = color(0x1A1108)
   public static let depthBg: Double = 0
   public static let depthSection: Double = 5
   public static let depthCard: Double = 10
   public static let depthNav: Double = 50
   public static let depthModal: Double = 100
   public static let depthToast: Double = 200
+  public static let depthDropdown: Double = 60
+  public static let depthOverlay: Double = 80
   public static let glassWhisperBlur: CGFloat = 8
   public static let glassWhisperSaturate: String = "110%"
   public static let glassWhisperOpacity: String = "60%"
@@ -112,12 +120,14 @@ public enum CSTokens {
   public static let radiusLg: CGFloat = 14
   public static let radiusFull: CGFloat = 999
   public static let breakpointXs: CGFloat = 0
+  public static let breakpointPhone: CGFloat = 360
   public static let breakpointSm: CGFloat = 640
   public static let breakpointMd: CGFloat = 768
   public static let breakpointLg: CGFloat = 1024
   public static let breakpointXl: CGFloat = 1280
   public static let breakpoint2xl: CGFloat = 1536
   public static let containerMax: CGFloat = 1320
+  public static let proseMeasure: CGFloat = 720
   public static let fontFamilyUi: String = "Be Vietnam Pro, ui-sans-serif, system-ui, sans-serif"
   public static let fontFamilyDisplay: String = "Space Grotesk, Be Vietnam Pro, ui-sans-serif, system-ui, sans-serif"
   public static let fontFamilyMono: String = "JetBrains Mono, ui-monospace, SFMono-Regular, Menlo, Consolas, monospace"
@@ -129,6 +139,7 @@ public enum CSTokens {
   public static let fontLineHeightBody: Double = 1.5
   public static let fontLineHeightHeading: Double = 1.35
   public static let fontLineHeightTight: Double = 1.15
+  public static let fontSize2xs: CGFloat = 11
   public static let fontSizeXs: CGFloat = 12
   public static let fontSizeSm: CGFloat = 14
   public static let fontSizeBase: CGFloat = 16
@@ -147,6 +158,7 @@ public enum CSTokens {
   public static let textBodyLg: String = "var(--cs-font-size-md)"
   public static let textBody: String = "var(--cs-font-size-base)"
   public static let textSecondary: String = "var(--cs-font-size-sm)"
+  public static let textMicro: String = "var(--cs-font-size-2xs)"
   public static let textCaption: String = "var(--cs-font-size-xs)"
   public static let textEyebrow: String = "var(--cs-font-size-xs)"
   public static let letterSpacingTightEm: Double = -0.01
@@ -159,6 +171,10 @@ public enum CSTokens {
   public static let iconSm: CGFloat = 16
   public static let iconMd: CGFloat = 20
   public static let iconLg: CGFloat = 24
+  public static let docInk = color(0x1A1614)
+  public static let docSlate = color(0x3F4C55)
+  public static let docFill = color(0xFDE68A)
+  public static let docFillInk = color(0x1A1614)
 
   // MARK: dark-theme color overrides
   public static let colorSurfacePageDark = color(0x1A1108)
@@ -178,96 +194,115 @@ public enum CSTokens {
   public static let componentButtonPrimaryBgDark = color(0xF4BA17)
   public static let componentButtonPrimaryFgDark = color(0x1A1108)
   public static let componentTextfieldBorderDefaultDark = color(0x5A4636)
+  public static let colorSemanticSuccessFgDark = color(0x1A1108)
+  public static let colorSemanticDangerFgDark = color(0x1A1108)
+  public static let colorSemanticWarningFgDark = color(0x1A1108)
+  public static let colorSemanticInfoFgDark = color(0x1A1108)
 
   // MARK: dark elemental accent packs (APCA-derived, v4.0.0)
   public static let accentThoSandDark = color(0xF8E9C0)
   public static let accentBrightThoSandDark = color(0xF6EBCC)
   public static let accentStrongThoSandDark = color(0x665A37)
   public static let accentOnThoSandDark = color(0xF5EAD9)
+  public static let accentOnStrongThoSandDark = color(0xFFFDF8)
   public static let accentTintThoSandDark = color(0x332701)
   public static let accentInkThoSandDark = color(0xF6EBCC)
   public static let accentThoDark = color(0xF4BA17)
   public static let accentBrightThoDark = color(0xFEC42C)
   public static let accentStrongThoDark = color(0x73560B)
   public static let accentOnThoDark = color(0xF5EAD9)
+  public static let accentOnStrongThoDark = color(0xFFFDF8)
   public static let accentTintThoDark = color(0x352602)
   public static let accentInkThoDark = color(0xFECD5E)
   public static let accentThoClayDark = color(0xCDB07E)
   public static let accentBrightThoClayDark = color(0xE4CDA8)
   public static let accentStrongThoClayDark = color(0x1F1300)
   public static let accentOnThoClayDark = color(0xF5EAD9)
+  public static let accentOnStrongThoClayDark = color(0xFFFDF8)
   public static let accentTintThoClayDark = color(0x372502)
   public static let accentInkThoClayDark = color(0xE7D0AB)
   public static let accentHoaPlasmaDark = color(0xFFE1D8)
   public static let accentBrightHoaPlasmaDark = color(0xFCE6DF)
   public static let accentStrongHoaPlasmaDark = color(0x6F5750)
   public static let accentOnHoaPlasmaDark = color(0xF5EAD9)
+  public static let accentOnStrongHoaPlasmaDark = color(0xFFFDF8)
   public static let accentTintHoaPlasmaDark = color(0x38231C)
   public static let accentInkHoaPlasmaDark = color(0xFCE6DF)
   public static let accentHoaDark = color(0xFCAF91)
   public static let accentBrightHoaDark = color(0xFED3C3)
   public static let accentStrongHoaDark = color(0x8A4A30)
   public static let accentOnHoaDark = color(0xF5EAD9)
+  public static let accentOnStrongHoaDark = color(0xFFFDF8)
   public static let accentTintHoaDark = color(0x411E0F)
   public static let accentInkHoaDark = color(0xFED3C3)
   public static let accentHoaLavaDark = color(0xE8A683)
   public static let accentBrightHoaLavaDark = color(0xF8C4AA)
   public static let accentStrongHoaLavaDark = color(0x280D00)
   public static let accentOnHoaLavaDark = color(0xF5EAD9)
+  public static let accentOnStrongHoaLavaDark = color(0xFFFDF8)
   public static let accentTintHoaLavaDark = color(0x401F0B)
   public static let accentInkHoaLavaDark = color(0xFBC7AD)
   public static let accentThuyMistDark = color(0xC0F5FC)
   public static let accentBrightThuyMistDark = color(0xCDF4F9)
   public static let accentStrongThuyMistDark = color(0x316167)
   public static let accentOnThuyMistDark = color(0xF5EAD9)
+  public static let accentOnStrongThuyMistDark = color(0xFFFDF8)
   public static let accentTintThuyMistDark = color(0x022F34)
   public static let accentInkThuyMistDark = color(0xCDF4F9)
   public static let accentThuyDark = color(0x2EDBF7)
   public static let accentBrightThuyDark = color(0x99EEFF)
   public static let accentStrongThuyDark = color(0x046270)
   public static let accentOnThuyDark = color(0xF5EAD9)
+  public static let accentOnStrongThuyDark = color(0xFFFDF8)
   public static let accentTintThuyDark = color(0x032F36)
   public static let accentInkThuyDark = color(0x99EEFF)
   public static let accentThuyOceanDark = color(0x82BCCD)
   public static let accentBrightThuyOceanDark = color(0xABD6E3)
   public static let accentStrongThuyOceanDark = color(0x011A21)
   public static let accentOnThuyOceanDark = color(0xF5EAD9)
+  public static let accentOnStrongThuyOceanDark = color(0xFFFDF8)
   public static let accentTintThuyOceanDark = color(0x002F3A)
   public static let accentInkThuyOceanDark = color(0xAED9E6)
   public static let accentMocBambooDark = color(0xE1F1C8)
   public static let accentBrightMocBambooDark = color(0xE5F1D2)
   public static let accentStrongMocBambooDark = color(0x54603E)
   public static let accentOnMocBambooDark = color(0xF5EAD9)
+  public static let accentOnStrongMocBambooDark = color(0xFFFDF8)
   public static let accentTintMocBambooDark = color(0x232D0B)
   public static let accentInkMocBambooDark = color(0xE5F1D2)
   public static let accentMocDark = color(0xA3D768)
   public static let accentBrightMocDark = color(0xC5ED9C)
   public static let accentStrongMocDark = color(0x416501)
   public static let accentOnMocDark = color(0xF5EAD9)
+  public static let accentOnStrongMocDark = color(0xFFFDF8)
   public static let accentTintMocDark = color(0x1F2E0B)
   public static let accentInkMocDark = color(0xC5ED9C)
   public static let accentMocForestDark = color(0x8EC27D)
   public static let accentBrightMocForestDark = color(0xB0D8A3)
   public static let accentStrongMocForestDark = color(0x061D00)
   public static let accentOnMocForestDark = color(0xF5EAD9)
+  public static let accentOnStrongMocForestDark = color(0xFFFDF8)
   public static let accentTintMocForestDark = color(0x193011)
   public static let accentInkMocForestDark = color(0xB6DFA9)
   public static let accentKimTitaniumDark = color(0xFEE5C7)
   public static let accentBrightKimTitaniumDark = color(0xFBE8D2)
   public static let accentStrongKimTitaniumDark = color(0x6B573E)
   public static let accentOnKimTitaniumDark = color(0xF5EAD9)
+  public static let accentOnStrongKimTitaniumDark = color(0xFFFDF8)
   public static let accentTintKimTitaniumDark = color(0x37250B)
   public static let accentInkKimTitaniumDark = color(0xFBE8D2)
   public static let accentKimDark = color(0xF3B958)
   public static let accentBrightKimDark = color(0xFDD89F)
   public static let accentStrongKimDark = color(0x795303)
   public static let accentOnKimDark = color(0xF5EAD9)
+  public static let accentOnStrongKimDark = color(0xFFFDF8)
   public static let accentTintKimDark = color(0x382503)
   public static let accentInkKimDark = color(0xFDD89F)
   public static let accentKimSteelDark = color(0xCCB17E)
   public static let accentBrightKimSteelDark = color(0xDFCBA5)
   public static let accentStrongKimSteelDark = color(0x1F1400)
   public static let accentOnKimSteelDark = color(0xF5EAD9)
+  public static let accentOnStrongKimSteelDark = color(0xFFFDF8)
   public static let accentTintKimSteelDark = color(0x362602)
   public static let accentInkKimSteelDark = color(0xE6D1AB)
 }

package/tokens/native/cs_tokens.dart

@@ -1,6 +1,6 @@
 // CyberSkill Design System — native design tokens.
 // GENERATED from tokens/tokens.dtcg.json — do not hand-edit; regenerate on token change.
-// release v1.1.1 · source sha256 9386ad73cf23d458…
+// release v1.3.8 · source sha256 5d7d5587bec9b99e…
 // conversions: rem→px at 16 · em→…Em relative doubles · rgba alpha→ARGB byte (round(a*255)) · durations in ms
 // dark element packs: see $extensions.overrides.elementsDark
 // provenance: tokens/provenance.json · parity gate: _audit/token-pipeline-test.html
@@ -26,6 +26,10 @@ class CSTokens {
   static const Color colorBorderDefault = Color(0xFFE7D9C6);
   static const Color colorLink = Color(0xFF6E3B0E);
   static const Color colorLinkHover = Color(0xFF45210E);
+  static const Color colorSemanticSuccessFg = Color(0xFFFFFFFF);
+  static const Color colorSemanticDangerFg = Color(0xFFFFFFFF);
+  static const Color colorSemanticWarningFg = Color(0xFFFFFFFF);
+  static const Color colorSemanticInfoFg = Color(0xFFFFFFFF);
   static const Color componentButtonPrimaryBg = Color(0xFF45210E);
   static const Color componentButtonPrimaryFg = Color(0xFFFFFFFF);
   static const double componentButtonGap = 8;
@@ -50,6 +54,7 @@ class CSTokens {
   static const double componentTextfieldPaddingY = 10;
   static const double componentTextfieldPaddingX = 12;
   static const double componentTextfieldMinHeight = 44;
+  static const double focusRing = 3;
   static const Color accent = Color(0xFFF4BA17);
   static const Color accentStrong = Color(0xFFA47D17);
   static const Color accentBright = Color(0xFFF4BA17);
@@ -58,13 +63,16 @@ class CSTokens {
   static const Color accentInk = Color(0xFF45210E);
   static const Color accentGlow = Color(0x7AF4BA17);
   static const Color accentGradA = Color(0xFFF4BA17);
-  static const Color accentGradB = Color(0xFFFCAF91);
+  static const Color accentGradB = Color(0xFFF3B958);
+  static const Color accentOnStrong = Color(0xFF1A1108);
   static const double depthBg = 0;
   static const double depthSection = 5;
   static const double depthCard = 10;
   static const double depthNav = 50;
   static const double depthModal = 100;
   static const double depthToast = 200;
+  static const double depthDropdown = 60;
+  static const double depthOverlay = 80;
   static const double glassWhisperBlur = 8;
   static const String glassWhisperSaturate = "110%";
   static const String glassWhisperOpacity = "60%";
@@ -108,12 +116,14 @@ class CSTokens {
   static const double radiusLg = 14;
   static const double radiusFull = 999;
   static const double breakpointXs = 0;
+  static const double breakpointPhone = 360;
   static const double breakpointSm = 640;
   static const double breakpointMd = 768;
   static const double breakpointLg = 1024;
   static const double breakpointXl = 1280;
   static const double breakpoint2xl = 1536;
   static const double containerMax = 1320;
+  static const double proseMeasure = 720;
   static const String fontFamilyUi = "Be Vietnam Pro, ui-sans-serif, system-ui, sans-serif";
   static const String fontFamilyDisplay = "Space Grotesk, Be Vietnam Pro, ui-sans-serif, system-ui, sans-serif";
   static const String fontFamilyMono = "JetBrains Mono, ui-monospace, SFMono-Regular, Menlo, Consolas, monospace";
@@ -125,6 +135,7 @@ class CSTokens {
   static const double fontLineHeightBody = 1.5;
   static const double fontLineHeightHeading = 1.35;
   static const double fontLineHeightTight = 1.15;
+  static const double fontSize2xs = 11;
   static const double fontSizeXs = 12;
   static const double fontSizeSm = 14;
   static const double fontSizeBase = 16;
@@ -143,6 +154,7 @@ class CSTokens {
   static const String textBodyLg = "var(--cs-font-size-md)";
   static const String textBody = "var(--cs-font-size-base)";
   static const String textSecondary = "var(--cs-font-size-sm)";
+  static const String textMicro = "var(--cs-font-size-2xs)";
   static const String textCaption = "var(--cs-font-size-xs)";
   static const String textEyebrow = "var(--cs-font-size-xs)";
   static const double letterSpacingTightEm = -0.01;
@@ -155,6 +167,10 @@ class CSTokens {
   static const double iconSm = 16;
   static const double iconMd = 20;
   static const double iconLg = 24;
+  static const Color docInk = Color(0xFF1A1614);
+  static const Color docSlate = Color(0xFF3F4C55);
+  static const Color docFill = Color(0xFFFDE68A);
+  static const Color docFillInk = Color(0xFF1A1614);
 
   // dark-theme color overrides
   static const Color colorSurfacePageDark = Color(0xFF1A1108);
@@ -174,96 +190,115 @@ class CSTokens {
   static const Color componentButtonPrimaryBgDark = Color(0xFFF4BA17);
   static const Color componentButtonPrimaryFgDark = Color(0xFF1A1108);
   static const Color componentTextfieldBorderDefaultDark = Color(0xFF5A4636);
+  static const Color colorSemanticSuccessFgDark = Color(0xFF1A1108);
+  static const Color colorSemanticDangerFgDark = Color(0xFF1A1108);
+  static const Color colorSemanticWarningFgDark = Color(0xFF1A1108);
+  static const Color colorSemanticInfoFgDark = Color(0xFF1A1108);
 
   // dark elemental accent packs (APCA-derived, v4.0.0)
   static const Color accentThoSandDark = Color(0xFFF8E9C0);
   static const Color accentBrightThoSandDark = Color(0xFFF6EBCC);
   static const Color accentStrongThoSandDark = Color(0xFF665A37);
   static const Color accentOnThoSandDark = Color(0xFFF5EAD9);
+  static const Color accentOnStrongThoSandDark = Color(0xFFFFFDF8);
   static const Color accentTintThoSandDark = Color(0xFF332701);
   static const Color accentInkThoSandDark = Color(0xFFF6EBCC);
   static const Color accentThoDark = Color(0xFFF4BA17);
   static const Color accentBrightThoDark = Color(0xFFFEC42C);
   static const Color accentStrongThoDark = Color(0xFF73560B);
   static const Color accentOnThoDark = Color(0xFFF5EAD9);
+  static const Color accentOnStrongThoDark = Color(0xFFFFFDF8);
   static const Color accentTintThoDark = Color(0xFF352602);
   static const Color accentInkThoDark = Color(0xFFFECD5E);
   static const Color accentThoClayDark = Color(0xFFCDB07E);
   static const Color accentBrightThoClayDark = Color(0xFFE4CDA8);
   static const Color accentStrongThoClayDark = Color(0xFF1F1300);
   static const Color accentOnThoClayDark = Color(0xFFF5EAD9);
+  static const Color accentOnStrongThoClayDark = Color(0xFFFFFDF8);
   static const Color accentTintThoClayDark = Color(0xFF372502);
   static const Color accentInkThoClayDark = Color(0xFFE7D0AB);
   static const Color accentHoaPlasmaDark = Color(0xFFFFE1D8);
   static const Color accentBrightHoaPlasmaDark = Color(0xFFFCE6DF);
   static const Color accentStrongHoaPlasmaDark = Color(0xFF6F5750);
   static const Color accentOnHoaPlasmaDark = Color(0xFFF5EAD9);
+  static const Color accentOnStrongHoaPlasmaDark = Color(0xFFFFFDF8);
   static const Color accentTintHoaPlasmaDark = Color(0xFF38231C);
   static const Color accentInkHoaPlasmaDark = Color(0xFFFCE6DF);
   static const Color accentHoaDark = Color(0xFFFCAF91);
   static const Color accentBrightHoaDark = Color(0xFFFED3C3);
   static const Color accentStrongHoaDark = Color(0xFF8A4A30);
   static const Color accentOnHoaDark = Color(0xFFF5EAD9);
+  static const Color accentOnStrongHoaDark = Color(0xFFFFFDF8);
   static const Color accentTintHoaDark = Color(0xFF411E0F);
   static const Color accentInkHoaDark = Color(0xFFFED3C3);
   static const Color accentHoaLavaDark = Color(0xFFE8A683);
   static const Color accentBrightHoaLavaDark = Color(0xFFF8C4AA);
   static const Color accentStrongHoaLavaDark = Color(0xFF280D00);
   static const Color accentOnHoaLavaDark = Color(0xFFF5EAD9);
+  static const Color accentOnStrongHoaLavaDark = Color(0xFFFFFDF8);
   static const Color accentTintHoaLavaDark = Color(0xFF401F0B);
   static const Color accentInkHoaLavaDark = Color(0xFFFBC7AD);
   static const Color accentThuyMistDark = Color(0xFFC0F5FC);
   static const Color accentBrightThuyMistDark = Color(0xFFCDF4F9);
   static const Color accentStrongThuyMistDark = Color(0xFF316167);
   static const Color accentOnThuyMistDark = Color(0xFFF5EAD9);
+  static const Color accentOnStrongThuyMistDark = Color(0xFFFFFDF8);
   static const Color accentTintThuyMistDark = Color(0xFF022F34);
   static const Color accentInkThuyMistDark = Color(0xFFCDF4F9);
   static const Color accentThuyDark = Color(0xFF2EDBF7);
   static const Color accentBrightThuyDark = Color(0xFF99EEFF);
   static const Color accentStrongThuyDark = Color(0xFF046270);
   static const Color accentOnThuyDark = Color(0xFFF5EAD9);
+  static const Color accentOnStrongThuyDark = Color(0xFFFFFDF8);
   static const Color accentTintThuyDark = Color(0xFF032F36);
   static const Color accentInkThuyDark = Color(0xFF99EEFF);
   static const Color accentThuyOceanDark = Color(0xFF82BCCD);
   static const Color accentBrightThuyOceanDark = Color(0xFFABD6E3);
   static const Color accentStrongThuyOceanDark = Color(0xFF011A21);
   static const Color accentOnThuyOceanDark = Color(0xFFF5EAD9);
+  static const Color accentOnStrongThuyOceanDark = Color(0xFFFFFDF8);
   static const Color accentTintThuyOceanDark = Color(0xFF002F3A);
   static const Color accentInkThuyOceanDark = Color(0xFFAED9E6);
   static const Color accentMocBambooDark = Color(0xFFE1F1C8);
   static const Color accentBrightMocBambooDark = Color(0xFFE5F1D2);
   static const Color accentStrongMocBambooDark = Color(0xFF54603E);
   static const Color accentOnMocBambooDark = Color(0xFFF5EAD9);
+  static const Color accentOnStrongMocBambooDark = Color(0xFFFFFDF8);
   static const Color accentTintMocBambooDark = Color(0xFF232D0B);
   static const Color accentInkMocBambooDark = Color(0xFFE5F1D2);
   static const Color accentMocDark = Color(0xFFA3D768);
   static const Color accentBrightMocDark = Color(0xFFC5ED9C);
   static const Color accentStrongMocDark = Color(0xFF416501);
   static const Color accentOnMocDark = Color(0xFFF5EAD9);
+  static const Color accentOnStrongMocDark = Color(0xFFFFFDF8);
   static const Color accentTintMocDark = Color(0xFF1F2E0B);
   static const Color accentInkMocDark = Color(0xFFC5ED9C);
   static const Color accentMocForestDark = Color(0xFF8EC27D);
   static const Color accentBrightMocForestDark = Color(0xFFB0D8A3);
   static const Color accentStrongMocForestDark = Color(0xFF061D00);
   static const Color accentOnMocForestDark = Color(0xFFF5EAD9);
+  static const Color accentOnStrongMocForestDark = Color(0xFFFFFDF8);
   static const Color accentTintMocForestDark = Color(0xFF193011);
   static const Color accentInkMocForestDark = Color(0xFFB6DFA9);
   static const Color accentKimTitaniumDark = Color(0xFFFEE5C7);
   static const Color accentBrightKimTitaniumDark = Color(0xFFFBE8D2);
   static const Color accentStrongKimTitaniumDark = Color(0xFF6B573E);
   static const Color accentOnKimTitaniumDark = Color(0xFFF5EAD9);
+  static const Color accentOnStrongKimTitaniumDark = Color(0xFFFFFDF8);
   static const Color accentTintKimTitaniumDark = Color(0xFF37250B);
   static const Color accentInkKimTitaniumDark = Color(0xFFFBE8D2);
   static const Color accentKimDark = Color(0xFFF3B958);
   static const Color accentBrightKimDark = Color(0xFFFDD89F);
   static const Color accentStrongKimDark = Color(0xFF795303);
   static const Color accentOnKimDark = Color(0xFFF5EAD9);
+  static const Color accentOnStrongKimDark = Color(0xFFFFFDF8);
   static const Color accentTintKimDark = Color(0xFF382503);
   static const Color accentInkKimDark = Color(0xFFFDD89F);
   static const Color accentKimSteelDark = Color(0xFFCCB17E);
   static const Color accentBrightKimSteelDark = Color(0xFFDFCBA5);
   static const Color accentStrongKimSteelDark = Color(0xFF1F1400);
   static const Color accentOnKimSteelDark = Color(0xFFF5EAD9);
+  static const Color accentOnStrongKimSteelDark = Color(0xFFFFFDF8);
   static const Color accentTintKimSteelDark = Color(0xFF362602);
   static const Color accentInkKimSteelDark = Color(0xFFE6D1AB);
 }