@kolkrabbi/kol-theme 0.159.0 → 0.161.0

package/kol-components-atoms.css

@@ -101,7 +101,7 @@
 }
 .kol-control--textarea.kol-control-md > textarea { padding: 6px 16px; }
 .kol-control--textarea.kol-control-lg > textarea { padding: 8px 20px; }
-/* The grip — kol-icon-set-v1 `resize-grip` at the native placement. It IS
+/* The grip — kol-icon-set-interface `resize-grip` at the native placement. It IS
  * the resize handle (JS corner drag, both axes, in Textarea.jsx); native
  * resize is OFF because Firefox's grip can't be hidden any other way. */
 .kol-textarea-resize-icon {

package/kol-components-molecules.css

@@ -332,6 +332,21 @@
   border-color: currentColor;
 }
 
+/* hue — a colored chip (W17, 2026-09-30). Tag.jsx sets --kol-tag-hue from its `color` prop; the
+ * fill, hover and active are the primary chip's own steps, mixed from the hue instead of the ink.
+ * The ink is the hue mixed toward the text color so yellow still reads on a light surface. */
+.kol-tag--primary.kol-tag--hue {
+  background-color: color-mix(in srgb, var(--kol-tag-hue) 18%, transparent);
+  color: color-mix(in srgb, var(--kol-tag-hue) 70%, var(--kol-surface-on-primary));
+}
+.kol-tag--primary.kol-tag--hue:hover {
+  background-color: color-mix(in srgb, var(--kol-tag-hue) 28%, transparent);
+}
+.kol-tag--primary.kol-tag--hue.is-active {
+  background-color: color-mix(in srgb, var(--kol-tag-hue) 36%, transparent);
+  border-color: currentColor;
+}
+
 /* secondary — the outlined chip. Mirrors .pill-outline. */
 .kol-tag--secondary {
   background-color: var(--kol-surface-primary);
@@ -1497,9 +1512,7 @@
   max-width: 100%;
   padding: 1px 6px;
   border-radius: var(--kol-radius-sm);
-  font-family: var(--kol-font-family-mono);
-  font-size: 12px;
-  line-height: 16px;
+  /* type: `.kol-item-name` on the element — one name style in every view */
   text-align: center;
   overflow-wrap: anywhere;
   display: -webkit-box;

package/kol-components-workshop.css

@@ -295,6 +295,8 @@
   display: flex;
   justify-content: space-between;
   align-items: center;
+  /* the count never touches the label (W4, 2026-09-30: "Blog / editorial(28)") */
+  gap: var(--kol-spacing-2);
   transition: color 0.15s ease;
 }
 
@@ -357,6 +359,13 @@
   margin-top: 4px;
 }
 
+/* A CHAPTER INSIDE A CHAPTER (2026-09-30, the showcase review W1 — the rail nests to any depth).
+ * The nested group steps in by the ROW's text indent, so its caret sits on its sibling rows' text
+ * edge and its own rows land one indent further; the indent is read, never retyped. */
+.shell-nav-nest {
+  padding-left: var(--kol-pad-rail-row-x);
+}
+
 /* Navigation items — layout only; type/color (+ active) in JSX. */
 /* THE PAGE ROW — L3, the class owns the whole look (user ruling 2026-08-01).
  * PAGE in the rail's vocabulary (`Tokens`); the right rail's rows are SECTIONS

package/kol-type-roles.css

@@ -337,3 +337,17 @@
   text-transform: uppercase;
   color: var(--kol-fg-48);
 }
+
+/* =============================================================================
+ * ITEM — 1 role
+ * ============================================================================= */
+
+/* item-name — a file or folder's name in a browser, the SAME in every view: the columns, the rows
+ * and the grid's caption (user 2026-09-30: *"in finder there is set to the same font style and size
+ * regardless of mode"*). A size setting scales the row and the glyph, never this. Mono because a
+ * truncated row on the helper ramp's line-height 1 clips its descenders. */
+.kol-item-name {
+  font-family: var(--kol-font-family-mono);
+  font-size: 12px;
+  line-height: 16px;
+}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@kolkrabbi/kol-theme",
-  "version": "0.159.0",
-  "description": "KOL (Kolkrabbi) design-system tokens + base CSS — brand-neutral. The canonical token/cascade layer every other KOL package and consumer builds on.",
+  "version": "0.161.0",
+  "description": "Tokens and base CSS",
   "license": "MIT",
   "type": "module",
   "sideEffects": [