wensity 0.1.8 → 0.1.10

package/dist/index.js

@@ -1,12 +1,12 @@
 #!/usr/bin/env node
 
 // src/commands.ts
-import { mkdir as mkdir5, readFile as readFile5, writeFile as writeFile5 } from "fs/promises";
-import { dirname as dirname6, join as join6 } from "path";
+import { mkdir as mkdir6, readFile as readFile6, writeFile as writeFile6 } from "fs/promises";
+import { dirname as dirname7, join as join7 } from "path";
 
 // src/constants.ts
 var CLI_NAME = "wensity";
-var CLI_VERSION = "0.1.8";
+var CLI_VERSION = "0.1.9";
 var CONFIG_FILE_NAME = "wensity.json";
 var DEFAULT_API_ORIGIN = "https://ui.wensity.com";
 var DEFAULT_REGISTRY_PATH = "/api/registry";
@@ -18,7 +18,9 @@ var INIT_PRIMITIVE_CSS_SLUG = "button";
 var HELP_TEXT = `Wensity CLI ${CLI_VERSION}
 
 Usage:
-  wensity init [--preset <code>] [--preset-file <path>] [options]
+  wensity init [--preset <code>] [--preset-file <path>] [--template next|vite|astro|react-router] [options]
+  wensity apply --preset <code> [options]
+  wensity preset inspect <code> [--json]
   wensity login [options]
   wensity logout
   wensity whoami [--json]
@@ -28,7 +30,9 @@ Usage:
   wensity version
 
 Commands:
-  init       Create wensity.json and local helper files (optional --preset applies style + CSS)
+  init       Create wensity.json and local helper files (optional --preset applies style + CSS; optional --template scaffolds an app)
+  apply      Apply a preset to an existing Wensity project
+  preset    Inspect or work with shareable Wensity style presets
   login      Save a Wensity API token for premium component access
   logout     Remove saved CLI credentials
   whoami     Verify the saved token and print the authenticated account
@@ -44,6 +48,7 @@ Options:
   --token <token>      Provide a token non-interactively for login
   --preset <code>      Apply a shareable Wensity style preset (wsty1.\u2026); merges style when config exists
   --preset-file <path> Read a preset code or JSON payload from a file
+  --template <name>    Scaffold a new app before init: next, vite, astro, react-router
   --force              Overwrite generated files when adding or initializing
   --no-install         Write files without running the package manager
   --dry-run            Print planned writes and installs without changing files
@@ -52,9 +57,12 @@ Options:
   --version            Print the CLI version
 
 Preset notes:
-  Generate codes at ${DEFAULT_API_ORIGIN}/docs/primitives/setup
+  Generate codes at ${DEFAULT_API_ORIGIN}/create-preset (guide: ${DEFAULT_API_ORIGIN}/docs/create-preset)
+  preset inspect decodes the token, font packages, and resolved primitive tokens
+  apply --preset updates existing style + primitive CSS without scaffolding helper files
   Plain init refuses an existing wensity.json unless --force
   init --preset merges style + primitive CSS; does not rewrite installed source
+  init --template writes a minimal app scaffold in the current directory before Wensity files
   add/update read style.iconLibrary for UI primitives only (Tabler|Lucide)
   Invalid/expired/unsupported codes exit non-zero with an actionable message
 `;
@@ -118,7 +126,7 @@ function hasFlag(args, name) {
   return args.options.get(name) === true;
 }
 function expectsValue(name) {
-  return ["api-url", "registry", "token", "type", "preset", "preset-file"].includes(name);
+  return ["api-url", "registry", "token", "type", "preset", "preset-file", "template"].includes(name);
 }
 function normalizeOptionName(name) {
   if (name === "dry") return "dry-run";
@@ -138,9 +146,15 @@ var BASE_COLOR_IDS = [
   "inherit",
   "neutral",
   "zinc",
+  "gray",
   "slate",
+  "cool-gray",
   "stone",
-  "taupe"
+  "taupe",
+  "mauve",
+  "olive",
+  "mist",
+  "black"
 ];
 var THEME_COLOR_IDS = [
   "ink",
@@ -148,16 +162,68 @@ var THEME_COLOR_IDS = [
   "blue",
   "violet",
   "green",
-  "orange"
+  "orange",
+  "amber",
+  "cyan",
+  "emerald",
+  "indigo",
+  "pink",
+  "purple",
+  "rose",
+  "sky",
+  "teal",
+  "yellow",
+  "fuchsia",
+  "lime"
 ];
 var CHART_PALETTE_IDS = [
   "theme",
   "warm",
   "cool",
-  "mixed"
+  "mixed",
+  "neutral",
+  "zinc",
+  "stone",
+  "gray",
+  "amber",
+  "cyan",
+  "emerald",
+  "indigo",
+  "lime",
+  "pink",
+  "purple",
+  "rose",
+  "sky",
+  "teal",
+  "yellow",
+  "taupe"
+];
+var HEADING_FONT_IDS = [
+  "system",
+  "playfair",
+  "instrument-serif",
+  "fraunces",
+  "space-grotesk",
+  "noto-serif",
+  "eb-garamond",
+  "lora",
+  "montserrat",
+  "manrope",
+  "inter"
+];
+var BODY_FONT_IDS = [
+  "system",
+  "inter",
+  "geist",
+  "dm-sans",
+  "plus-jakarta-sans",
+  "figtree",
+  "noto-sans",
+  "public-sans",
+  "outfit",
+  "manrope",
+  "ibm-plex-sans"
 ];
-var HEADING_FONT_IDS = ["system", "playfair"];
-var BODY_FONT_IDS = ["system", "inter"];
 var RADIUS_PRESET_CSS = {
   none: "0px",
   small: "0.5rem",
@@ -274,8 +340,8 @@ var DEFAULT_STYLE_CONFIG_CANONICAL = {
   baseColor: "inherit",
   themeColor: "ink",
   chartPalette: "theme",
-  headingFont: "system",
-  bodyFont: "system",
+  headingFont: "inter",
+  bodyFont: "inter",
   iconLibrary: "tabler",
   radius: "medium"
 };
@@ -604,7 +670,7 @@ function validateStyleConfigCanonicalPartial(value) {
   if ("baseColor" in value) {
     if (typeof value.baseColor !== "string" || !isBaseColorId(value.baseColor)) {
       throw new PresetValidationError(
-        "Invalid style.baseColor. Expected inherit | neutral | zinc | slate | stone | taupe.",
+        "Invalid style.baseColor. Expected a supported base color id.",
         "style.baseColor"
       );
     }
@@ -613,7 +679,7 @@ function validateStyleConfigCanonicalPartial(value) {
   if ("themeColor" in value) {
     if (typeof value.themeColor !== "string" || !isThemeColorId(value.themeColor)) {
       throw new PresetValidationError(
-        "Invalid style.themeColor. Expected ink | red | blue | violet | green | orange.",
+        "Invalid style.themeColor. Expected a supported theme color id.",
         "style.themeColor"
       );
     }
@@ -622,7 +688,7 @@ function validateStyleConfigCanonicalPartial(value) {
   if ("chartPalette" in value) {
     if (typeof value.chartPalette !== "string" || !isChartPaletteId(value.chartPalette)) {
       throw new PresetValidationError(
-        "Invalid style.chartPalette. Expected theme | warm | cool | mixed.",
+        "Invalid style.chartPalette. Expected a supported chart palette id.",
         "style.chartPalette"
       );
     }
@@ -631,7 +697,7 @@ function validateStyleConfigCanonicalPartial(value) {
   if ("headingFont" in value) {
     if (typeof value.headingFont !== "string" || !isHeadingFontId(value.headingFont)) {
       throw new PresetValidationError(
-        "Invalid style.headingFont. Expected system | playfair.",
+        "Invalid style.headingFont. Expected a supported heading font id.",
         "style.headingFont"
       );
     }
@@ -640,7 +706,7 @@ function validateStyleConfigCanonicalPartial(value) {
   if ("bodyFont" in value) {
     if (typeof value.bodyFont !== "string" || !isBodyFontId(value.bodyFont)) {
       throw new PresetValidationError(
-        "Invalid style.bodyFont. Expected system | inter.",
+        "Invalid style.bodyFont. Expected a supported body font id.",
         "style.bodyFont"
       );
     }
@@ -769,9 +835,29 @@ function utf8ByteLength(text) {
   return new TextEncoder().encode(text).byteLength;
 }
 var BASE64URL_ALPHABET = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789-_";
-var COMPACT_CANONICAL_PREFIX = "c";
+var COMPACT_CANONICAL_LEGACY_PREFIX = "c";
+var COMPACT_CANONICAL_PREFIX = "d";
+var COMPACT_CANONICAL_EXPANDED_PREFIX = "e";
+var COMPACT_CANONICAL_CHART_PREFIX = "f";
+var COMPACT_CANONICAL_THEME_PREFIX = "g";
+var COMPACT_CANONICAL_BASE_PREFIX = "h";
 var COMPACT_CANONICAL_BODY_LENGTH = 3;
 var COMPACT_CANONICAL_ENCODED_LENGTH = COMPACT_CANONICAL_PREFIX.length + COMPACT_CANONICAL_BODY_LENGTH;
+var COMPACT_CANONICAL_EXPANDED_BODY_LENGTH = 4;
+var COMPACT_CANONICAL_EXPANDED_ENCODED_LENGTH = COMPACT_CANONICAL_EXPANDED_PREFIX.length + COMPACT_CANONICAL_EXPANDED_BODY_LENGTH;
+var COMPACT_CANONICAL_CHART_ENCODED_LENGTH = COMPACT_CANONICAL_CHART_PREFIX.length + COMPACT_CANONICAL_EXPANDED_BODY_LENGTH;
+var COMPACT_CANONICAL_THEME_ENCODED_LENGTH = COMPACT_CANONICAL_THEME_PREFIX.length + COMPACT_CANONICAL_EXPANDED_BODY_LENGTH;
+var COMPACT_CANONICAL_BASE_BODY_LENGTH = 5;
+var COMPACT_CANONICAL_BASE_ENCODED_LENGTH = COMPACT_CANONICAL_BASE_PREFIX.length + COMPACT_CANONICAL_BASE_BODY_LENGTH;
+var COMPACT_CANONICAL_LEGACY_BASE_MAX_INDEX = 7;
+var COMPACT_CANONICAL_LEGACY_THEME_MAX_INDEX = 5;
+var COMPACT_CANONICAL_LEGACY_CHART_MAX_INDEX = 3;
+var COMPACT_CANONICAL_LEGACY_FONT_MAX_INDEX = 1;
+var COMPACT_CANONICAL_FONT_MAX_INDEX = 7;
+var COMPACT_CANONICAL_EXPANDED_FONT_MAX_INDEX = 15;
+var COMPACT_CANONICAL_EXPANDED_CHART_MAX_INDEX = 31;
+var COMPACT_CANONICAL_EXPANDED_THEME_MAX_INDEX = 31;
+var COMPACT_CANONICAL_EXPANDED_BASE_MAX_INDEX = 31;
 function toBase64Url(bytes) {
   let out = "";
   for (let i = 0; i < bytes.length; i += 3) {
@@ -823,40 +909,216 @@ function readCompactChar(char) {
   return BASE64URL_ALPHABET.indexOf(char);
 }
 function encodeCompactCanonicalPayload(payload) {
-  let value = indexOfPresetValue(BASE_COLOR_IDS, payload.baseColor, "preset.baseColor");
-  value = value << 3 | indexOfPresetValue(THEME_COLOR_IDS, payload.themeColor, "preset.themeColor");
-  value = value << 2 | indexOfPresetValue(CHART_PALETTE_IDS, payload.chartPalette, "preset.chartPalette");
-  value = value << 1 | indexOfPresetValue(HEADING_FONT_IDS, payload.headingFont, "preset.headingFont");
-  value = value << 1 | indexOfPresetValue(BODY_FONT_IDS, payload.bodyFont, "preset.bodyFont");
-  value = value << 1 | indexOfPresetValue(ICON_LIBRARIES, payload.iconLibrary, "preset.iconLibrary");
-  value = value << 2 | indexOfPresetValue(RADIUS_PRESETS, payload.radius, "preset.radius");
-  return `${COMPACT_CANONICAL_PREFIX}${BASE64URL_ALPHABET[value >> 12 & 63]}${BASE64URL_ALPHABET[value >> 6 & 63]}${BASE64URL_ALPHABET[value & 63]}`;
+  const baseColorIndex = indexOfPresetValue(BASE_COLOR_IDS, payload.baseColor, "preset.baseColor");
+  const themeColorIndex = indexOfPresetValue(
+    THEME_COLOR_IDS,
+    payload.themeColor,
+    "preset.themeColor"
+  );
+  const chartPaletteIndex = indexOfPresetValue(
+    CHART_PALETTE_IDS,
+    payload.chartPalette,
+    "preset.chartPalette"
+  );
+  const headingFontIndex = indexOfPresetValue(
+    HEADING_FONT_IDS,
+    payload.headingFont,
+    "preset.headingFont"
+  );
+  const bodyFontIndex = indexOfPresetValue(BODY_FONT_IDS, payload.bodyFont, "preset.bodyFont");
+  const iconLibraryIndex = indexOfPresetValue(
+    ICON_LIBRARIES,
+    payload.iconLibrary,
+    "preset.iconLibrary"
+  );
+  const radiusIndex = indexOfPresetValue(RADIUS_PRESETS, payload.radius, "preset.radius");
+  if (baseColorIndex > 7) {
+    if (baseColorIndex > COMPACT_CANONICAL_EXPANDED_BASE_MAX_INDEX) {
+      throw new PresetValidationError(
+        "Too many curated base colors for compact preset encoding.",
+        "preset.baseColor"
+      );
+    }
+    if (themeColorIndex > COMPACT_CANONICAL_EXPANDED_THEME_MAX_INDEX) {
+      throw new PresetValidationError(
+        "Too many curated theme colors for compact preset encoding.",
+        "preset.themeColor"
+      );
+    }
+    if (chartPaletteIndex > COMPACT_CANONICAL_EXPANDED_CHART_MAX_INDEX) {
+      throw new PresetValidationError(
+        "Too many curated chart palettes for compact preset encoding.",
+        "preset.chartPalette"
+      );
+    }
+    if (headingFontIndex > COMPACT_CANONICAL_EXPANDED_FONT_MAX_INDEX || bodyFontIndex > COMPACT_CANONICAL_EXPANDED_FONT_MAX_INDEX) {
+      throw new PresetValidationError(
+        "Too many curated fonts for compact preset encoding.",
+        "preset.headingFont"
+      );
+    }
+    let baseValue = baseColorIndex;
+    baseValue = baseValue << 5 | themeColorIndex;
+    baseValue = baseValue << 5 | chartPaletteIndex;
+    baseValue = baseValue << 4 | headingFontIndex;
+    baseValue = baseValue << 4 | bodyFontIndex;
+    baseValue = baseValue << 1 | iconLibraryIndex;
+    baseValue = baseValue << 2 | radiusIndex;
+    return encodeCompactCanonicalValue(
+      COMPACT_CANONICAL_BASE_PREFIX,
+      baseValue,
+      COMPACT_CANONICAL_BASE_BODY_LENGTH
+    );
+  }
+  if (themeColorIndex > 7) {
+    if (themeColorIndex > COMPACT_CANONICAL_EXPANDED_THEME_MAX_INDEX) {
+      throw new PresetValidationError(
+        "Too many curated theme colors for compact preset encoding.",
+        "preset.themeColor"
+      );
+    }
+    if (chartPaletteIndex > COMPACT_CANONICAL_EXPANDED_CHART_MAX_INDEX) {
+      throw new PresetValidationError(
+        "Too many curated chart palettes for compact preset encoding.",
+        "preset.chartPalette"
+      );
+    }
+    if (headingFontIndex > COMPACT_CANONICAL_EXPANDED_FONT_MAX_INDEX || bodyFontIndex > COMPACT_CANONICAL_EXPANDED_FONT_MAX_INDEX) {
+      throw new PresetValidationError(
+        "Too many curated fonts for compact preset encoding.",
+        "preset.headingFont"
+      );
+    }
+    let themeValue = baseColorIndex;
+    themeValue = themeValue << 5 | themeColorIndex;
+    themeValue = themeValue << 5 | chartPaletteIndex;
+    themeValue = themeValue << 4 | headingFontIndex;
+    themeValue = themeValue << 4 | bodyFontIndex;
+    themeValue = themeValue << 1 | iconLibraryIndex;
+    themeValue = themeValue << 2 | radiusIndex;
+    return encodeCompactCanonicalValue(
+      COMPACT_CANONICAL_THEME_PREFIX,
+      themeValue,
+      COMPACT_CANONICAL_EXPANDED_BODY_LENGTH
+    );
+  }
+  if (baseColorIndex <= COMPACT_CANONICAL_LEGACY_BASE_MAX_INDEX && themeColorIndex <= COMPACT_CANONICAL_LEGACY_THEME_MAX_INDEX && chartPaletteIndex <= COMPACT_CANONICAL_LEGACY_CHART_MAX_INDEX && headingFontIndex <= COMPACT_CANONICAL_LEGACY_FONT_MAX_INDEX && bodyFontIndex <= COMPACT_CANONICAL_LEGACY_FONT_MAX_INDEX) {
+    let legacyValue = baseColorIndex;
+    legacyValue = legacyValue << 3 | themeColorIndex;
+    legacyValue = legacyValue << 2 | chartPaletteIndex;
+    legacyValue = legacyValue << 1 | headingFontIndex;
+    legacyValue = legacyValue << 1 | bodyFontIndex;
+    legacyValue = legacyValue << 1 | iconLibraryIndex;
+    legacyValue = legacyValue << 2 | radiusIndex;
+    return encodeCompactCanonicalValue(COMPACT_CANONICAL_LEGACY_PREFIX, legacyValue);
+  }
+  if (chartPaletteIndex > 3) {
+    if (chartPaletteIndex > COMPACT_CANONICAL_EXPANDED_CHART_MAX_INDEX) {
+      throw new PresetValidationError(
+        "Too many curated chart palettes for compact preset encoding.",
+        "preset.chartPalette"
+      );
+    }
+    if (headingFontIndex > COMPACT_CANONICAL_EXPANDED_FONT_MAX_INDEX || bodyFontIndex > COMPACT_CANONICAL_EXPANDED_FONT_MAX_INDEX) {
+      throw new PresetValidationError(
+        "Too many curated fonts for compact preset encoding.",
+        "preset.headingFont"
+      );
+    }
+    let chartValue = baseColorIndex;
+    chartValue = chartValue << 3 | themeColorIndex;
+    chartValue = chartValue << 5 | chartPaletteIndex;
+    chartValue = chartValue << 4 | headingFontIndex;
+    chartValue = chartValue << 4 | bodyFontIndex;
+    chartValue = chartValue << 1 | iconLibraryIndex;
+    chartValue = chartValue << 2 | radiusIndex;
+    return encodeCompactCanonicalValue(
+      COMPACT_CANONICAL_CHART_PREFIX,
+      chartValue,
+      COMPACT_CANONICAL_EXPANDED_BODY_LENGTH
+    );
+  }
+  if (headingFontIndex > COMPACT_CANONICAL_FONT_MAX_INDEX || bodyFontIndex > COMPACT_CANONICAL_FONT_MAX_INDEX) {
+    if (headingFontIndex > COMPACT_CANONICAL_EXPANDED_FONT_MAX_INDEX || bodyFontIndex > COMPACT_CANONICAL_EXPANDED_FONT_MAX_INDEX) {
+      throw new PresetValidationError(
+        "Too many curated fonts for compact preset encoding.",
+        "preset.headingFont"
+      );
+    }
+    let expandedValue = baseColorIndex;
+    expandedValue = expandedValue << 3 | themeColorIndex;
+    expandedValue = expandedValue << 2 | chartPaletteIndex;
+    expandedValue = expandedValue << 4 | headingFontIndex;
+    expandedValue = expandedValue << 4 | bodyFontIndex;
+    expandedValue = expandedValue << 1 | iconLibraryIndex;
+    expandedValue = expandedValue << 2 | radiusIndex;
+    return encodeCompactCanonicalValue(
+      COMPACT_CANONICAL_EXPANDED_PREFIX,
+      expandedValue,
+      COMPACT_CANONICAL_EXPANDED_BODY_LENGTH
+    );
+  }
+  let value = baseColorIndex;
+  value = value << 3 | themeColorIndex;
+  value = value << 2 | chartPaletteIndex;
+  value = value << 3 | headingFontIndex;
+  value = value << 3 | bodyFontIndex;
+  value = value << 1 | iconLibraryIndex;
+  value = value << 2 | radiusIndex;
+  return encodeCompactCanonicalValue(
+    COMPACT_CANONICAL_PREFIX,
+    value,
+    COMPACT_CANONICAL_BODY_LENGTH
+  );
+}
+function encodeCompactCanonicalValue(prefix, value, bodyLength = 3) {
+  let out = prefix;
+  for (let shift = (bodyLength - 1) * 6; shift >= 0; shift -= 6) {
+    out += BASE64URL_ALPHABET[value >> shift & 63];
+  }
+  return out;
 }
 function decodeCompactCanonicalPayload(encoded) {
-  if (encoded.length !== COMPACT_CANONICAL_ENCODED_LENGTH || !encoded.startsWith(COMPACT_CANONICAL_PREFIX)) {
+  const isLegacyCompact = encoded.startsWith(COMPACT_CANONICAL_LEGACY_PREFIX);
+  const isCurrentCompact = encoded.startsWith(COMPACT_CANONICAL_PREFIX);
+  const isExpandedCompact = encoded.startsWith(COMPACT_CANONICAL_EXPANDED_PREFIX);
+  const isChartCompact = encoded.startsWith(COMPACT_CANONICAL_CHART_PREFIX);
+  const isThemeCompact = encoded.startsWith(COMPACT_CANONICAL_THEME_PREFIX);
+  const isBaseCompact = encoded.startsWith(COMPACT_CANONICAL_BASE_PREFIX);
+  const expectedLength = isExpandedCompact ? COMPACT_CANONICAL_EXPANDED_ENCODED_LENGTH : isChartCompact ? COMPACT_CANONICAL_CHART_ENCODED_LENGTH : isThemeCompact ? COMPACT_CANONICAL_THEME_ENCODED_LENGTH : isBaseCompact ? COMPACT_CANONICAL_BASE_ENCODED_LENGTH : COMPACT_CANONICAL_ENCODED_LENGTH;
+  if (encoded.length !== expectedLength || !isCurrentCompact && !isLegacyCompact && !isExpandedCompact && !isChartCompact && !isThemeCompact && !isBaseCompact) {
     throw new PresetValidationError("Compact preset code has an invalid length.", "preset");
   }
-  const a = readCompactChar(encoded[1]);
-  const b = readCompactChar(encoded[2]);
-  const c = readCompactChar(encoded[3]);
-  if (a < 0 || b < 0 || c < 0) {
-    throw new PresetValidationError("Compact preset code is not valid base64url.", "preset");
+  let value = 0;
+  for (let i = 1; i < encoded.length; i += 1) {
+    const char = readCompactChar(encoded[i]);
+    if (char < 0) {
+      throw new PresetValidationError("Compact preset code is not valid base64url.", "preset");
+    }
+    value = value << 6 | char;
   }
-  let value = a << 12 | b << 6 | c;
   const radius = RADIUS_PRESETS[value & 3];
   value >>= 2;
   const iconLibrary = ICON_LIBRARIES[value & 1];
   value >>= 1;
-  const bodyFont = BODY_FONT_IDS[value & 1];
-  value >>= 1;
-  const headingFont = HEADING_FONT_IDS[value & 1];
-  value >>= 1;
-  const chartPalette = CHART_PALETTE_IDS[value & 3];
-  value >>= 2;
-  const themeColor = THEME_COLOR_IDS[value & 7];
-  value >>= 3;
-  const baseColor = BASE_COLOR_IDS[value & 7];
-  value >>= 3;
+  const fontMask = isLegacyCompact ? 1 : isExpandedCompact || isChartCompact || isThemeCompact || isBaseCompact ? 15 : 7;
+  const fontShift = isLegacyCompact ? 1 : isExpandedCompact || isChartCompact || isThemeCompact || isBaseCompact ? 4 : 3;
+  const bodyFont = BODY_FONT_IDS[value & fontMask];
+  value >>= fontShift;
+  const headingFont = HEADING_FONT_IDS[value & fontMask];
+  value >>= fontShift;
+  const chartMask = isChartCompact || isThemeCompact || isBaseCompact ? 31 : 3;
+  const chartShift = isChartCompact || isThemeCompact || isBaseCompact ? 5 : 2;
+  const chartPalette = CHART_PALETTE_IDS[value & chartMask];
+  value >>= chartShift;
+  const themeMask = isThemeCompact || isBaseCompact ? 31 : 7;
+  const themeShift = isThemeCompact || isBaseCompact ? 5 : 3;
+  const themeColor = THEME_COLOR_IDS[value & themeMask];
+  value >>= themeShift;
+  const baseMask = isBaseCompact ? 31 : 7;
+  const baseShift = isBaseCompact ? 5 : 3;
+  const baseColor = BASE_COLOR_IDS[value & baseMask];
+  value >>= baseShift;
   if (value !== 0 || !baseColor || !themeColor || !chartPalette || !headingFont || !bodyFont || !iconLibrary || !radius) {
     throw new PresetValidationError("Compact preset code contains an out-of-range value.", "preset");
   }
@@ -1051,31 +1313,31 @@ function validateCodecPayloadCanonical(value) {
   }
   if (typeof value.baseColor !== "string" || !isBaseColorId(value.baseColor)) {
     throw new PresetValidationError(
-      "Invalid preset.baseColor. Expected inherit | neutral | zinc | slate | stone | taupe.",
+      "Invalid preset.baseColor. Expected a supported base color id.",
       "preset.baseColor"
     );
   }
   if (typeof value.themeColor !== "string" || !isThemeColorId(value.themeColor)) {
     throw new PresetValidationError(
-      "Invalid preset.themeColor. Expected ink | red | blue | violet | green | orange.",
+      "Invalid preset.themeColor. Expected a supported theme color id.",
       "preset.themeColor"
     );
   }
   if (typeof value.chartPalette !== "string" || !isChartPaletteId(value.chartPalette)) {
     throw new PresetValidationError(
-      "Invalid preset.chartPalette. Expected theme | warm | cool | mixed.",
+      "Invalid preset.chartPalette. Expected a supported chart palette id.",
       "preset.chartPalette"
     );
   }
   if (typeof value.headingFont !== "string" || !isHeadingFontId(value.headingFont)) {
     throw new PresetValidationError(
-      "Invalid preset.headingFont. Expected system | playfair.",
+      "Invalid preset.headingFont. Expected a supported heading font id.",
       "preset.headingFont"
     );
   }
   if (typeof value.bodyFont !== "string" || !isBodyFontId(value.bodyFont)) {
     throw new PresetValidationError(
-      "Invalid preset.bodyFont. Expected system | inter.",
+      "Invalid preset.bodyFont. Expected a supported body font id.",
       "preset.bodyFont"
     );
   }
@@ -1144,7 +1406,7 @@ function decodePresetEnvelope(code) {
   if (!encoded) {
     throw new PresetValidationError("Preset code payload is empty.", "preset");
   }
-  if (encoded.length === COMPACT_CANONICAL_ENCODED_LENGTH && encoded.startsWith(COMPACT_CANONICAL_PREFIX)) {
+  if ((encoded.length === COMPACT_CANONICAL_ENCODED_LENGTH || encoded.length === COMPACT_CANONICAL_EXPANDED_ENCODED_LENGTH || encoded.length === COMPACT_CANONICAL_CHART_ENCODED_LENGTH || encoded.length === COMPACT_CANONICAL_THEME_ENCODED_LENGTH || encoded.length === COMPACT_CANONICAL_BASE_ENCODED_LENGTH) && (encoded.startsWith(COMPACT_CANONICAL_PREFIX) || encoded.startsWith(COMPACT_CANONICAL_LEGACY_PREFIX) || encoded.startsWith(COMPACT_CANONICAL_EXPANDED_PREFIX) || encoded.startsWith(COMPACT_CANONICAL_CHART_PREFIX) || encoded.startsWith(COMPACT_CANONICAL_THEME_PREFIX) || encoded.startsWith(COMPACT_CANONICAL_BASE_PREFIX))) {
     return decodeCompactCanonicalPayload(encoded);
   }
   if (encoded.includes("=") || /[^A-Za-z0-9_-]/.test(encoded)) {
@@ -1275,82 +1537,225 @@ var LUCIDE_TO_TABLER = Object.fromEntries(
 var BASE_COLOR_PALETTE = {
   zinc: {
     light: {
-      surfaceElevated: "#ffffff",
-      surfaceOverlay: "#ffffff",
-      foreground: "#09090b",
-      border: "rgba(9, 9, 11, 0.08)",
-      mutedForeground: "#71717a"
+      surfaceElevated: "oklch(1 0 0)",
+      surfaceOverlay: "oklch(1 0 0)",
+      surfaceHover: "oklch(0.967 0.001 286.375)",
+      surfaceActive: "color-mix(in oklab, oklch(0.967 0.001 286.375) 92%, oklch(0.141 0.005 285.823) 8%)",
+      borderSubtle: "oklch(0.92 0.004 286.32)",
+      textSecondary: "oklch(0.552 0.016 285.938)",
+      textPlaceholder: "color-mix(in oklab, oklch(0.552 0.016 285.938) 78%, transparent)"
     },
     dark: {
-      surfaceElevated: "#18181b",
-      surfaceOverlay: "#27272a",
-      foreground: "#fafafa",
-      border: "rgba(250, 250, 250, 0.10)",
-      mutedForeground: "#a1a1aa"
+      surfaceElevated: "oklch(0.21 0.006 285.885)",
+      surfaceOverlay: "oklch(0.21 0.006 285.885)",
+      surfaceHover: "oklch(0.274 0.006 286.033)",
+      surfaceActive: "color-mix(in oklab, oklch(0.274 0.006 286.033) 88%, oklch(0.985 0 0) 12%)",
+      borderSubtle: "oklch(1 0 0 / 10%)",
+      textSecondary: "oklch(0.705 0.015 286.067)",
+      textPlaceholder: "color-mix(in oklab, oklch(0.705 0.015 286.067) 78%, transparent)"
     }
   },
   neutral: {
     light: {
-      surfaceElevated: "#ffffff",
-      surfaceOverlay: "#ffffff",
-      foreground: "#171717",
-      border: "rgba(23, 23, 23, 0.08)",
-      mutedForeground: "#737373"
+      surfaceElevated: "oklch(1 0 0)",
+      surfaceOverlay: "oklch(1 0 0)",
+      surfaceHover: "oklch(0.97 0 0)",
+      surfaceActive: "color-mix(in oklab, oklch(0.97 0 0) 92%, oklch(0.145 0 0) 8%)",
+      borderSubtle: "oklch(0.922 0 0)",
+      textSecondary: "oklch(0.556 0 0)",
+      textPlaceholder: "color-mix(in oklab, oklch(0.556 0 0) 78%, transparent)"
+    },
+    dark: {
+      surfaceElevated: "oklch(0.205 0 0)",
+      surfaceOverlay: "oklch(0.205 0 0)",
+      surfaceHover: "oklch(0.269 0 0)",
+      surfaceActive: "color-mix(in oklab, oklch(0.269 0 0) 88%, oklch(0.985 0 0) 12%)",
+      borderSubtle: "oklch(1 0 0 / 10%)",
+      textSecondary: "oklch(0.708 0 0)",
+      textPlaceholder: "color-mix(in oklab, oklch(0.708 0 0) 78%, transparent)"
+    }
+  },
+  gray: {
+    light: {
+      surfaceElevated: "oklch(1 0 0)",
+      surfaceOverlay: "oklch(1 0 0)",
+      surfaceHover: "oklch(0.967 0.003 264.542)",
+      surfaceActive: "color-mix(in oklab, oklch(0.967 0.003 264.542) 92%, oklch(0.13 0.028 261.692) 8%)",
+      borderSubtle: "oklch(0.928 0.006 264.531)",
+      textSecondary: "oklch(0.551 0.027 264.364)",
+      textPlaceholder: "color-mix(in oklab, oklch(0.551 0.027 264.364) 78%, transparent)"
     },
     dark: {
-      surfaceElevated: "#171717",
-      surfaceOverlay: "#262626",
-      foreground: "#fafafa",
-      border: "rgba(250, 250, 250, 0.10)",
-      mutedForeground: "#a3a3a3"
+      surfaceElevated: "oklch(0.21 0.034 264.665)",
+      surfaceOverlay: "oklch(0.21 0.034 264.665)",
+      surfaceHover: "oklch(0.278 0.033 256.848)",
+      surfaceActive: "color-mix(in oklab, oklch(0.278 0.033 256.848) 88%, oklch(0.985 0.002 247.839) 12%)",
+      borderSubtle: "oklch(1 0 0 / 10%)",
+      textSecondary: "oklch(0.707 0.022 261.325)",
+      textPlaceholder: "color-mix(in oklab, oklch(0.707 0.022 261.325) 78%, transparent)"
     }
   },
   slate: {
     light: {
-      surfaceElevated: "#ffffff",
-      surfaceOverlay: "#ffffff",
-      foreground: "#0f172a",
-      border: "rgba(15, 23, 42, 0.08)",
-      mutedForeground: "#64748b"
+      surfaceElevated: "oklch(1 0 0)",
+      surfaceOverlay: "oklch(1 0 0)",
+      surfaceHover: "oklch(0.968 0.007 247.896)",
+      surfaceActive: "color-mix(in oklab, oklch(0.968 0.007 247.896) 92%, oklch(0.129 0.042 264.695) 8%)",
+      borderSubtle: "oklch(0.929 0.013 255.508)",
+      textSecondary: "oklch(0.554 0.046 257.417)",
+      textPlaceholder: "color-mix(in oklab, oklch(0.554 0.046 257.417) 78%, transparent)"
+    },
+    dark: {
+      surfaceElevated: "oklch(0.208 0.042 265.755)",
+      surfaceOverlay: "oklch(0.208 0.042 265.755)",
+      surfaceHover: "oklch(0.279 0.041 260.031)",
+      surfaceActive: "color-mix(in oklab, oklch(0.279 0.041 260.031) 88%, oklch(0.984 0.003 247.858) 12%)",
+      borderSubtle: "oklch(1 0 0 / 10%)",
+      textSecondary: "oklch(0.704 0.04 256.788)",
+      textPlaceholder: "color-mix(in oklab, oklch(0.704 0.04 256.788) 78%, transparent)"
+    }
+  },
+  "cool-gray": {
+    light: {
+      surfaceElevated: "oklch(1 0 0)",
+      surfaceOverlay: "oklch(1 0 0)",
+      surfaceHover: "oklch(0.963 0.002 197.1)",
+      surfaceActive: "color-mix(in oklab, oklch(0.963 0.002 197.1) 92%, oklch(0.148 0.004 228.8) 8%)",
+      borderSubtle: "oklch(0.925 0.005 214.3)",
+      textSecondary: "oklch(0.56 0.021 213.5)",
+      textPlaceholder: "color-mix(in oklab, oklch(0.56 0.021 213.5) 78%, transparent)"
     },
     dark: {
-      surfaceElevated: "#0f172a",
-      surfaceOverlay: "#1e293b",
-      foreground: "#f8fafc",
-      border: "rgba(248, 250, 252, 0.10)",
-      mutedForeground: "#94a3b8"
+      surfaceElevated: "oklch(0.218 0.008 223.9)",
+      surfaceOverlay: "oklch(0.218 0.008 223.9)",
+      surfaceHover: "oklch(0.275 0.011 216.9)",
+      surfaceActive: "color-mix(in oklab, oklch(0.275 0.011 216.9) 88%, oklch(0.987 0.002 197.1) 12%)",
+      borderSubtle: "oklch(1 0 0 / 10%)",
+      textSecondary: "oklch(0.723 0.014 214.4)",
+      textPlaceholder: "color-mix(in oklab, oklch(0.723 0.014 214.4) 78%, transparent)"
     }
   },
   stone: {
     light: {
-      surfaceElevated: "#ffffff",
-      surfaceOverlay: "#ffffff",
-      foreground: "#1c1917",
-      border: "rgba(28, 25, 23, 0.08)",
-      mutedForeground: "#78716c"
+      surfaceElevated: "oklch(1 0 0)",
+      surfaceOverlay: "oklch(1 0 0)",
+      surfaceHover: "oklch(0.97 0.001 106.424)",
+      surfaceActive: "color-mix(in oklab, oklch(0.97 0.001 106.424) 92%, oklch(0.147 0.004 49.25) 8%)",
+      borderSubtle: "oklch(0.923 0.003 48.717)",
+      textSecondary: "oklch(0.553 0.013 58.071)",
+      textPlaceholder: "color-mix(in oklab, oklch(0.553 0.013 58.071) 78%, transparent)"
     },
     dark: {
-      surfaceElevated: "#1c1917",
-      surfaceOverlay: "#292524",
-      foreground: "#fafaf9",
-      border: "rgba(250, 250, 249, 0.10)",
-      mutedForeground: "#a8a29e"
+      surfaceElevated: "oklch(0.216 0.006 56.043)",
+      surfaceOverlay: "oklch(0.216 0.006 56.043)",
+      surfaceHover: "oklch(0.268 0.007 34.298)",
+      surfaceActive: "color-mix(in oklab, oklch(0.268 0.007 34.298) 88%, oklch(0.985 0.001 106.423) 12%)",
+      borderSubtle: "oklch(1 0 0 / 10%)",
+      textSecondary: "oklch(0.709 0.01 56.259)",
+      textPlaceholder: "color-mix(in oklab, oklch(0.709 0.01 56.259) 78%, transparent)"
     }
   },
   taupe: {
     light: {
-      surfaceElevated: "#faf8f5",
-      surfaceOverlay: "#ffffff",
-      foreground: "#3b342e",
-      border: "rgba(59, 52, 46, 0.10)",
-      mutedForeground: "#8a7f74"
+      surfaceElevated: "oklch(1 0 0)",
+      surfaceOverlay: "oklch(1 0 0)",
+      surfaceHover: "oklch(0.96 0.002 17.2)",
+      surfaceActive: "color-mix(in oklab, oklch(0.96 0.002 17.2) 92%, oklch(0.147 0.004 49.3) 8%)",
+      borderSubtle: "oklch(0.922 0.005 34.3)",
+      textSecondary: "oklch(0.547 0.021 43.1)",
+      textPlaceholder: "color-mix(in oklab, oklch(0.547 0.021 43.1) 78%, transparent)"
+    },
+    dark: {
+      surfaceElevated: "oklch(0.214 0.009 43.1)",
+      surfaceOverlay: "oklch(0.214 0.009 43.1)",
+      surfaceHover: "oklch(0.268 0.011 36.5)",
+      surfaceActive: "color-mix(in oklab, oklch(0.268 0.011 36.5) 88%, oklch(0.986 0.002 67.8) 12%)",
+      borderSubtle: "oklch(1 0 0 / 10%)",
+      textSecondary: "oklch(0.714 0.014 41.2)",
+      textPlaceholder: "color-mix(in oklab, oklch(0.714 0.014 41.2) 78%, transparent)"
+    }
+  },
+  mauve: {
+    light: {
+      surfaceElevated: "oklch(1 0 0)",
+      surfaceOverlay: "oklch(1 0 0)",
+      surfaceHover: "oklch(0.96 0.003 325.6)",
+      surfaceActive: "color-mix(in oklab, oklch(0.96 0.003 325.6) 92%, oklch(0.145 0.008 326) 8%)",
+      borderSubtle: "oklch(0.922 0.005 325.62)",
+      textSecondary: "oklch(0.542 0.034 322.5)",
+      textPlaceholder: "color-mix(in oklab, oklch(0.542 0.034 322.5) 78%, transparent)"
+    },
+    dark: {
+      surfaceElevated: "oklch(0.212 0.019 322.12)",
+      surfaceOverlay: "oklch(0.212 0.019 322.12)",
+      surfaceHover: "oklch(0.263 0.024 320.12)",
+      surfaceActive: "color-mix(in oklab, oklch(0.263 0.024 320.12) 88%, oklch(0.985 0 0) 12%)",
+      borderSubtle: "oklch(1 0 0 / 10%)",
+      textSecondary: "oklch(0.711 0.019 323.02)",
+      textPlaceholder: "color-mix(in oklab, oklch(0.711 0.019 323.02) 78%, transparent)"
+    }
+  },
+  olive: {
+    light: {
+      surfaceElevated: "oklch(1 0 0)",
+      surfaceOverlay: "oklch(1 0 0)",
+      surfaceHover: "oklch(0.966 0.005 106.5)",
+      surfaceActive: "color-mix(in oklab, oklch(0.966 0.005 106.5) 92%, oklch(0.153 0.006 107.1) 8%)",
+      borderSubtle: "oklch(0.93 0.007 106.5)",
+      textSecondary: "oklch(0.58 0.031 107.3)",
+      textPlaceholder: "color-mix(in oklab, oklch(0.58 0.031 107.3) 78%, transparent)"
+    },
+    dark: {
+      surfaceElevated: "oklch(0.228 0.013 107.4)",
+      surfaceOverlay: "oklch(0.228 0.013 107.4)",
+      surfaceHover: "oklch(0.286 0.016 107.4)",
+      surfaceActive: "color-mix(in oklab, oklch(0.286 0.016 107.4) 88%, oklch(0.988 0.003 106.5) 12%)",
+      borderSubtle: "oklch(1 0 0 / 10%)",
+      textSecondary: "oklch(0.737 0.021 106.9)",
+      textPlaceholder: "color-mix(in oklab, oklch(0.737 0.021 106.9) 78%, transparent)"
+    }
+  },
+  mist: {
+    light: {
+      surfaceElevated: "oklch(1 0 0)",
+      surfaceOverlay: "oklch(1 0 0)",
+      surfaceHover: "oklch(0.963 0.002 197.1)",
+      surfaceActive: "color-mix(in oklab, oklch(0.963 0.002 197.1) 92%, oklch(0.148 0.004 228.8) 8%)",
+      borderSubtle: "oklch(0.925 0.005 214.3)",
+      textSecondary: "oklch(0.56 0.021 213.5)",
+      textPlaceholder: "color-mix(in oklab, oklch(0.56 0.021 213.5) 78%, transparent)"
+    },
+    dark: {
+      surfaceElevated: "oklch(0.218 0.008 223.9)",
+      surfaceOverlay: "oklch(0.218 0.008 223.9)",
+      surfaceHover: "oklch(0.275 0.011 216.9)",
+      surfaceActive: "color-mix(in oklab, oklch(0.275 0.011 216.9) 88%, oklch(0.987 0.002 197.1) 12%)",
+      borderSubtle: "oklch(1 0 0 / 10%)",
+      textSecondary: "oklch(0.723 0.014 214.4)",
+      textPlaceholder: "color-mix(in oklab, oklch(0.723 0.014 214.4) 78%, transparent)"
+    }
+  },
+  black: {
+    light: {
+      // Light stays light: white cards + soft grey chrome (same structure as
+      // `neutral`), not a washed dark theme. Character lives in slightly
+      // firmer secondary text / borders than neutral, not in tinted surfaces.
+      surfaceElevated: "oklch(1 0 0)",
+      surfaceOverlay: "oklch(1 0 0)",
+      surfaceHover: "oklch(0.97 0 0)",
+      surfaceActive: "color-mix(in oklab, oklch(0.97 0 0) 92%, oklch(0.145 0 0) 8%)",
+      borderSubtle: "oklch(0.922 0 0)",
+      textSecondary: "oklch(0.52 0 0)",
+      textPlaceholder: "color-mix(in oklab, oklch(0.52 0 0) 78%, transparent)"
     },
     dark: {
-      surfaceElevated: "#1c1916",
-      surfaceOverlay: "#2a2521",
-      foreground: "#f5f0ea",
-      border: "rgba(245, 240, 234, 0.10)",
-      mutedForeground: "#a89f94"
+      surfaceElevated: "oklch(0.145 0 0)",
+      surfaceOverlay: "oklch(0.165 0 0)",
+      surfaceHover: "oklch(0.22 0 0)",
+      surfaceActive: "color-mix(in oklab, oklch(0.22 0 0) 86%, oklch(0.985 0 0) 14%)",
+      borderSubtle: "oklch(1 0 0 / 12%)",
+      textSecondary: "oklch(0.68 0 0)",
+      textPlaceholder: "color-mix(in oklab, oklch(0.68 0 0) 78%, transparent)"
     }
   }
 };
@@ -1476,6 +1881,174 @@ var THEME_COLOR_PALETTE = {
       controlSolidForeground: "#fff7ed"
       // orange-50
     }
+  },
+  amber: {
+    light: {
+      controlSolid: "#b45309",
+      controlSolidHover: "#d97706",
+      controlSolidActive: "#92400e",
+      controlSolidForeground: "#fffbeb"
+    },
+    dark: {
+      controlSolid: "#92400e",
+      controlSolidHover: "#b45309",
+      controlSolidActive: "#78350f",
+      controlSolidForeground: "#fffbeb"
+    }
+  },
+  cyan: {
+    light: {
+      controlSolid: "#0e7490",
+      controlSolidHover: "#0891b2",
+      controlSolidActive: "#155e75",
+      controlSolidForeground: "#ecfeff"
+    },
+    dark: {
+      controlSolid: "#155e75",
+      controlSolidHover: "#0e7490",
+      controlSolidActive: "#164e63",
+      controlSolidForeground: "#ecfeff"
+    }
+  },
+  emerald: {
+    light: {
+      controlSolid: "#047857",
+      controlSolidHover: "#059669",
+      controlSolidActive: "#065f46",
+      controlSolidForeground: "#ecfdf5"
+    },
+    dark: {
+      controlSolid: "#065f46",
+      controlSolidHover: "#047857",
+      controlSolidActive: "#064e3b",
+      controlSolidForeground: "#ecfdf5"
+    }
+  },
+  indigo: {
+    light: {
+      controlSolid: "#4338ca",
+      controlSolidHover: "#4f46e5",
+      controlSolidActive: "#3730a3",
+      controlSolidForeground: "#eef2ff"
+    },
+    dark: {
+      controlSolid: "#3730a3",
+      controlSolidHover: "#4338ca",
+      controlSolidActive: "#312e81",
+      controlSolidForeground: "#eef2ff"
+    }
+  },
+  pink: {
+    light: {
+      controlSolid: "#be185d",
+      controlSolidHover: "#db2777",
+      controlSolidActive: "#9d174d",
+      controlSolidForeground: "#fdf2f8"
+    },
+    dark: {
+      controlSolid: "#9d174d",
+      controlSolidHover: "#be185d",
+      controlSolidActive: "#831843",
+      controlSolidForeground: "#fdf2f8"
+    }
+  },
+  purple: {
+    light: {
+      controlSolid: "#7e22ce",
+      controlSolidHover: "#9333ea",
+      controlSolidActive: "#6b21a8",
+      controlSolidForeground: "#faf5ff"
+    },
+    dark: {
+      controlSolid: "#6b21a8",
+      controlSolidHover: "#7e22ce",
+      controlSolidActive: "#581c87",
+      controlSolidForeground: "#faf5ff"
+    }
+  },
+  rose: {
+    light: {
+      controlSolid: "#be123c",
+      controlSolidHover: "#e11d48",
+      controlSolidActive: "#9f1239",
+      controlSolidForeground: "#fff1f2"
+    },
+    dark: {
+      controlSolid: "#9f1239",
+      controlSolidHover: "#be123c",
+      controlSolidActive: "#881337",
+      controlSolidForeground: "#fff1f2"
+    }
+  },
+  sky: {
+    light: {
+      controlSolid: "#0369a1",
+      controlSolidHover: "#0284c7",
+      controlSolidActive: "#075985",
+      controlSolidForeground: "#f0f9ff"
+    },
+    dark: {
+      controlSolid: "#075985",
+      controlSolidHover: "#0369a1",
+      controlSolidActive: "#0c4a6e",
+      controlSolidForeground: "#f0f9ff"
+    }
+  },
+  teal: {
+    light: {
+      controlSolid: "#0f766e",
+      controlSolidHover: "#0d9488",
+      controlSolidActive: "#115e59",
+      controlSolidForeground: "#f0fdfa"
+    },
+    dark: {
+      controlSolid: "#115e59",
+      controlSolidHover: "#0f766e",
+      controlSolidActive: "#134e4a",
+      controlSolidForeground: "#f0fdfa"
+    }
+  },
+  yellow: {
+    light: {
+      controlSolid: "#a16207",
+      controlSolidHover: "#ca8a04",
+      controlSolidActive: "#854d0e",
+      controlSolidForeground: "#fefce8"
+    },
+    dark: {
+      controlSolid: "#854d0e",
+      controlSolidHover: "#a16207",
+      controlSolidActive: "#713f12",
+      controlSolidForeground: "#fefce8"
+    }
+  },
+  fuchsia: {
+    light: {
+      controlSolid: "#a21caf",
+      controlSolidHover: "#c026d3",
+      controlSolidActive: "#86198f",
+      controlSolidForeground: "#fdf4ff"
+    },
+    dark: {
+      controlSolid: "#86198f",
+      controlSolidHover: "#a21caf",
+      controlSolidActive: "#701a75",
+      controlSolidForeground: "#fdf4ff"
+    }
+  },
+  lime: {
+    light: {
+      controlSolid: "#4d7c0f",
+      controlSolidHover: "#65a30d",
+      controlSolidActive: "#3f6212",
+      controlSolidForeground: "#f7fee7"
+    },
+    dark: {
+      controlSolid: "#3f6212",
+      controlSolidHover: "#4d7c0f",
+      controlSolidActive: "#365314",
+      controlSolidForeground: "#f7fee7"
+    }
   }
 };
 var DEFAULT_CHART_STOPS = {
@@ -1518,6 +2091,54 @@ var CHART_PALETTES = {
     orange: {
       light: ["#eda100", "#f97316", "#e34948", "#ca8a04", "#c2410c", "#db2777"],
       dark: ["#c98500", "#fb923c", "#e66767", "#facc15", "#fdba74", "#f472b6"]
+    },
+    amber: {
+      light: ["#d97706", "#f59e0b", "#b45309", "#fbbf24", "#92400e", "#f97316"],
+      dark: ["#fbbf24", "#f59e0b", "#fcd34d", "#d97706", "#fde68a", "#fb923c"]
+    },
+    cyan: {
+      light: ["#0891b2", "#06b6d4", "#0e7490", "#22d3ee", "#155e75", "#0284c7"],
+      dark: ["#22d3ee", "#67e8f9", "#06b6d4", "#38bdf8", "#a5f3fc", "#0891b2"]
+    },
+    emerald: {
+      light: ["#059669", "#10b981", "#047857", "#34d399", "#065f46", "#0d9488"],
+      dark: ["#34d399", "#6ee7b7", "#10b981", "#2dd4bf", "#a7f3d0", "#059669"]
+    },
+    indigo: {
+      light: ["#4f46e5", "#6366f1", "#4338ca", "#818cf8", "#3730a3", "#7c3aed"],
+      dark: ["#818cf8", "#a5b4fc", "#6366f1", "#a78bfa", "#c7d2fe", "#4f46e5"]
+    },
+    pink: {
+      light: ["#db2777", "#ec4899", "#be185d", "#f472b6", "#9d174d", "#e11d48"],
+      dark: ["#f472b6", "#f9a8d4", "#ec4899", "#fb7185", "#fbcfe8", "#db2777"]
+    },
+    purple: {
+      light: ["#9333ea", "#a855f7", "#7e22ce", "#c084fc", "#6b21a8", "#7c3aed"],
+      dark: ["#c084fc", "#d8b4fe", "#a855f7", "#a78bfa", "#e9d5ff", "#9333ea"]
+    },
+    rose: {
+      light: ["#e11d48", "#f43f5e", "#be123c", "#fb7185", "#9f1239", "#db2777"],
+      dark: ["#fb7185", "#fda4af", "#f43f5e", "#f472b6", "#ffe4e6", "#e11d48"]
+    },
+    sky: {
+      light: ["#0284c7", "#0ea5e9", "#0369a1", "#38bdf8", "#075985", "#2563eb"],
+      dark: ["#38bdf8", "#7dd3fc", "#0ea5e9", "#60a5fa", "#bae6fd", "#0284c7"]
+    },
+    teal: {
+      light: ["#0d9488", "#14b8a6", "#0f766e", "#2dd4bf", "#115e59", "#0891b2"],
+      dark: ["#2dd4bf", "#5eead4", "#14b8a6", "#22d3ee", "#99f6e4", "#0d9488"]
+    },
+    yellow: {
+      light: ["#ca8a04", "#eab308", "#a16207", "#facc15", "#854d0e", "#f59e0b"],
+      dark: ["#facc15", "#fde047", "#eab308", "#fbbf24", "#fef08a", "#ca8a04"]
+    },
+    fuchsia: {
+      light: ["#c026d3", "#d946ef", "#a21caf", "#e879f9", "#86198f", "#db2777"],
+      dark: ["#e879f9", "#f0abfc", "#d946ef", "#f472b6", "#fae8ff", "#c026d3"]
+    },
+    lime: {
+      light: ["#65a30d", "#84cc16", "#4d7c0f", "#a3e635", "#3f6212", "#16a34a"],
+      dark: ["#a3e635", "#bef264", "#84cc16", "#4ade80", "#d9f99d", "#65a30d"]
     }
   },
   warm: {
@@ -1531,31 +2152,137 @@ var CHART_PALETTES = {
   mixed: {
     light: ["#2a78d6", "#e34948", "#1baf7a", "#eda100", "#4a3aa7", "#db2777"],
     dark: ["#3987e5", "#e66767", "#199e70", "#c98500", "#9085e9", "#f472b6"]
+  },
+  neutral: {
+    light: ["#404040", "#737373", "#a3a3a3", "#525252", "#262626", "#d4d4d4"],
+    dark: ["#d4d4d4", "#a3a3a3", "#737373", "#e5e5e5", "#f5f5f5", "#525252"]
+  },
+  zinc: {
+    light: ["#3f3f46", "#71717a", "#a1a1aa", "#52525b", "#27272a", "#d4d4d8"],
+    dark: ["#d4d4d8", "#a1a1aa", "#71717a", "#e4e4e7", "#f4f4f5", "#52525b"]
+  },
+  stone: {
+    light: ["#44403c", "#78716c", "#a8a29e", "#57534e", "#292524", "#d6d3d1"],
+    dark: ["#d6d3d1", "#a8a29e", "#78716c", "#e7e5e4", "#fafaf9", "#57534e"]
+  },
+  gray: {
+    light: ["#374151", "#6b7280", "#9ca3af", "#4b5563", "#1f2937", "#d1d5db"],
+    dark: ["#d1d5db", "#9ca3af", "#6b7280", "#e5e7eb", "#f9fafb", "#4b5563"]
+  },
+  amber: {
+    light: ["#d97706", "#f59e0b", "#b45309", "#fbbf24", "#92400e", "#f97316"],
+    dark: ["#fbbf24", "#f59e0b", "#fcd34d", "#d97706", "#fde68a", "#fb923c"]
+  },
+  cyan: {
+    light: ["#0891b2", "#06b6d4", "#0e7490", "#22d3ee", "#155e75", "#0284c7"],
+    dark: ["#22d3ee", "#67e8f9", "#06b6d4", "#38bdf8", "#a5f3fc", "#0891b2"]
+  },
+  emerald: {
+    light: ["#059669", "#10b981", "#047857", "#34d399", "#065f46", "#0d9488"],
+    dark: ["#34d399", "#6ee7b7", "#10b981", "#2dd4bf", "#a7f3d0", "#059669"]
+  },
+  indigo: {
+    light: ["#4f46e5", "#6366f1", "#4338ca", "#818cf8", "#3730a3", "#7c3aed"],
+    dark: ["#818cf8", "#a5b4fc", "#6366f1", "#a78bfa", "#c7d2fe", "#4f46e5"]
+  },
+  lime: {
+    light: ["#65a30d", "#84cc16", "#4d7c0f", "#a3e635", "#3f6212", "#16a34a"],
+    dark: ["#a3e635", "#bef264", "#84cc16", "#4ade80", "#d9f99d", "#65a30d"]
+  },
+  pink: {
+    light: ["#db2777", "#ec4899", "#be185d", "#f472b6", "#9d174d", "#e11d48"],
+    dark: ["#f472b6", "#f9a8d4", "#ec4899", "#fb7185", "#fbcfe8", "#db2777"]
+  },
+  purple: {
+    light: ["#9333ea", "#a855f7", "#7e22ce", "#c084fc", "#6b21a8", "#7c3aed"],
+    dark: ["#c084fc", "#d8b4fe", "#a855f7", "#a78bfa", "#e9d5ff", "#9333ea"]
+  },
+  rose: {
+    light: ["#e11d48", "#f43f5e", "#be123c", "#fb7185", "#9f1239", "#db2777"],
+    dark: ["#fb7185", "#fda4af", "#f43f5e", "#f472b6", "#ffe4e6", "#e11d48"]
+  },
+  sky: {
+    light: ["#0284c7", "#0ea5e9", "#0369a1", "#38bdf8", "#075985", "#2563eb"],
+    dark: ["#38bdf8", "#7dd3fc", "#0ea5e9", "#60a5fa", "#bae6fd", "#0284c7"]
+  },
+  teal: {
+    light: ["#0d9488", "#14b8a6", "#0f766e", "#2dd4bf", "#115e59", "#0891b2"],
+    dark: ["#2dd4bf", "#5eead4", "#14b8a6", "#22d3ee", "#99f6e4", "#0d9488"]
+  },
+  yellow: {
+    light: ["#ca8a04", "#eab308", "#a16207", "#facc15", "#854d0e", "#f59e0b"],
+    dark: ["#facc15", "#fde047", "#eab308", "#fbbf24", "#fef08a", "#ca8a04"]
+  },
+  taupe: {
+    light: ["#8a6f55", "#a78b71", "#6f5a46", "#c4aa8f", "#4f4034", "#d97706"],
+    dark: ["#c4aa8f", "#dcc8b2", "#a78b71", "#f3ede6", "#8a6f55", "#fbbf24"]
   }
 };
 
 // ../wensity-preset/src/curated-fonts.ts
+var CURATED_FONT_UI_WEIGHTS = [400, 500, 600, 700];
+function curatedFontCssImportSpecifiers(pkg) {
+  return pkg.weights.map((weight) => `${pkg.packageName}/${weight}.css`);
+}
+function fontPackage(packageName, familyName, weights = CURATED_FONT_UI_WEIGHTS) {
+  return { packageName, familyName, weights };
+}
 var HEADING_FONT_PACKAGES = {
-  playfair: {
-    packageName: "@fontsource/playfair-display",
-    importSpecifier: "@fontsource/playfair-display",
-    familyName: "Playfair Display"
-  }
+  playfair: fontPackage("@fontsource/playfair-display", "Playfair Display"),
+  "instrument-serif": fontPackage(
+    "@fontsource/instrument-serif",
+    "Instrument Serif",
+    [400]
+  ),
+  fraunces: fontPackage("@fontsource/fraunces", "Fraunces"),
+  "space-grotesk": fontPackage("@fontsource/space-grotesk", "Space Grotesk"),
+  "noto-serif": fontPackage("@fontsource/noto-serif", "Noto Serif"),
+  "eb-garamond": fontPackage("@fontsource/eb-garamond", "EB Garamond"),
+  lora: fontPackage("@fontsource/lora", "Lora"),
+  montserrat: fontPackage("@fontsource/montserrat", "Montserrat"),
+  manrope: fontPackage("@fontsource/manrope", "Manrope"),
+  inter: fontPackage("@fontsource/inter", "Inter")
 };
 var BODY_FONT_PACKAGES = {
-  inter: {
-    packageName: "@fontsource/inter",
-    importSpecifier: "@fontsource/inter",
-    familyName: "Inter"
-  }
+  inter: fontPackage("@fontsource/inter", "Inter"),
+  geist: fontPackage("@fontsource/geist", "Geist"),
+  "dm-sans": fontPackage("@fontsource/dm-sans", "DM Sans"),
+  "plus-jakarta-sans": fontPackage(
+    "@fontsource/plus-jakarta-sans",
+    "Plus Jakarta Sans"
+  ),
+  figtree: fontPackage("@fontsource/figtree", "Figtree"),
+  "noto-sans": fontPackage("@fontsource/noto-sans", "Noto Sans"),
+  "public-sans": fontPackage("@fontsource/public-sans", "Public Sans"),
+  outfit: fontPackage("@fontsource/outfit", "Outfit"),
+  manrope: fontPackage("@fontsource/manrope", "Manrope"),
+  "ibm-plex-sans": fontPackage("@fontsource/ibm-plex-sans", "IBM Plex Sans")
 };
 var HEADING_FONT_CSS = {
   system: "var(--font-display)",
-  playfair: "'Playfair Display', Georgia, 'Times New Roman', serif"
+  playfair: "'Playfair Display', Georgia, 'Times New Roman', serif",
+  "instrument-serif": "'Instrument Serif', Georgia, 'Times New Roman', serif",
+  fraunces: "'Fraunces', Georgia, 'Times New Roman', serif",
+  "space-grotesk": "'Space Grotesk', ui-sans-serif, system-ui, sans-serif",
+  "noto-serif": "'Noto Serif', Georgia, 'Times New Roman', serif",
+  "eb-garamond": "'EB Garamond', Georgia, 'Times New Roman', serif",
+  lora: "'Lora', Georgia, 'Times New Roman', serif",
+  montserrat: "'Montserrat', ui-sans-serif, system-ui, sans-serif",
+  manrope: "'Manrope', ui-sans-serif, system-ui, sans-serif",
+  inter: "'Inter', ui-sans-serif, system-ui, sans-serif"
 };
 var BODY_FONT_CSS = {
   system: "var(--font-sans)",
-  inter: "'Inter', ui-sans-serif, system-ui, sans-serif"
+  inter: "'Inter', ui-sans-serif, system-ui, sans-serif",
+  geist: "'Geist', ui-sans-serif, system-ui, sans-serif",
+  "dm-sans": "'DM Sans', ui-sans-serif, system-ui, sans-serif",
+  "plus-jakarta-sans": "'Plus Jakarta Sans', ui-sans-serif, system-ui, sans-serif",
+  figtree: "'Figtree', ui-sans-serif, system-ui, sans-serif",
+  "noto-sans": "'Noto Sans', ui-sans-serif, system-ui, sans-serif",
+  "public-sans": "'Public Sans', ui-sans-serif, system-ui, sans-serif",
+  outfit: "'Outfit', ui-sans-serif, system-ui, sans-serif",
+  manrope: "'Manrope', ui-sans-serif, system-ui, sans-serif",
+  "ibm-plex-sans": "'IBM Plex Sans', ui-sans-serif, system-ui, sans-serif"
 };
 
 // ../wensity-preset/src/resolve.ts
@@ -1614,7 +2341,19 @@ var COLORED_THEME_IDS = /* @__PURE__ */ new Set([
   "blue",
   "violet",
   "green",
-  "orange"
+  "orange",
+  "amber",
+  "cyan",
+  "emerald",
+  "indigo",
+  "pink",
+  "purple",
+  "rose",
+  "sky",
+  "teal",
+  "yellow",
+  "fuchsia",
+  "lime"
 ]);
 function colorMix(source, percent) {
   return `color-mix(in srgb, ${source} ${percent}%, transparent)`;
@@ -1641,16 +2380,15 @@ function baseFromInherit(mode) {
   return { ...INHERIT_BASE_EXPRESSIONS[mode] };
 }
 function baseFromSeeds(seeds, mode) {
-  const hoverPercent = mode === "light" ? 4 : 5;
-  const activePercent = mode === "light" ? 7 : 10;
+  void mode;
   return {
     surfaceElevated: seeds.surfaceElevated,
     surfaceOverlay: seeds.surfaceOverlay,
-    surfaceHover: colorMix(seeds.foreground, hoverPercent),
-    surfaceActive: colorMix(seeds.foreground, activePercent),
-    borderSubtle: colorMix(seeds.border, 60),
-    textSecondary: colorMix(seeds.foreground, 72),
-    textPlaceholder: colorMix(seeds.mutedForeground, 85)
+    surfaceHover: seeds.surfaceHover,
+    surfaceActive: seeds.surfaceActive,
+    borderSubtle: seeds.borderSubtle,
+    textSecondary: seeds.textSecondary,
+    textPlaceholder: seeds.textPlaceholder
   };
 }
 function ringAndSelectedForInk(mode) {
@@ -1659,10 +2397,10 @@ function ringAndSelectedForInk(mode) {
     surfaceSelected: FIXED_SURFACE_SELECTED[mode]
   };
 }
-function ringAndSelectedFromAccent(accent, mode) {
+function ringFromAccentWithNeutralSelected(accent, mode) {
   return {
     ring: colorMix(accent, 45),
-    surfaceSelected: colorMix(accent, mode === "light" ? 6 : 8)
+    surfaceSelected: FIXED_SURFACE_SELECTED[mode]
   };
 }
 function buildModeTokens(args) {
@@ -1707,17 +2445,40 @@ function resolveStyleConfig(style) {
 }
 function resolveChartStops(chartPalette, themeColor, mode) {
   if (chartPalette === "theme") {
-    return CHART_PALETTES.theme[themeColor][mode];
+    const themeStops = CHART_PALETTES.theme[themeColor];
+    if (!themeStops) {
+      throw new Error(
+        `Missing CHART_PALETTES.theme entry for themeColor "${themeColor}".`
+      );
+    }
+    return themeStops[mode];
   }
-  return CHART_PALETTES[chartPalette][mode];
+  const stops = CHART_PALETTES[chartPalette];
+  if (!stops) {
+    throw new Error(
+      `Missing CHART_PALETTES entry for chartPalette "${chartPalette}".`
+    );
+  }
+  return stops[mode];
 }
 function resolveStyleConfigCanonical(style) {
   const theme = THEME_COLOR_PALETTE[style.themeColor];
+  if (!theme) {
+    throw new Error(
+      `Missing THEME_COLOR_PALETTE entry for themeColor "${style.themeColor}".`
+    );
+  }
+  const namedBase = style.baseColor === "inherit" ? null : BASE_COLOR_PALETTE[style.baseColor];
+  if (style.baseColor !== "inherit" && !namedBase) {
+    throw new Error(
+      `Missing BASE_COLOR_PALETTE entry for baseColor "${style.baseColor}".`
+    );
+  }
   const useAccentRing = COLORED_THEME_IDS.has(style.themeColor);
   const resolveMode = (mode) => {
-    const base = style.baseColor === "inherit" ? baseFromInherit(mode) : baseFromSeeds(BASE_COLOR_PALETTE[style.baseColor][mode], mode);
+    const base = namedBase ? baseFromSeeds(namedBase[mode], mode) : baseFromInherit(mode);
     const control = theme[mode];
-    const ringSelected = useAccentRing ? ringAndSelectedFromAccent(control.controlSolid, mode) : ringAndSelectedForInk(mode);
+    const ringSelected = useAccentRing ? ringFromAccentWithNeutralSelected(control.controlSolid, mode) : ringAndSelectedForInk(mode);
     const charts = resolveChartStops(style.chartPalette, style.themeColor, mode);
     return buildModeTokens({ base, control, ringSelected, charts });
   };
@@ -1732,6 +2493,34 @@ function resolveStyleConfigCanonical(style) {
     dark: resolveMode("dark")
   };
 }
+function resolvedTokensToCssVars(tokens, mode) {
+  const modeTokens = tokens[mode];
+  return {
+    [RESOLVED_TOKEN_CSS_VARS.surfaceElevated]: modeTokens.surfaceElevated,
+    [RESOLVED_TOKEN_CSS_VARS.surfaceOverlay]: modeTokens.surfaceOverlay,
+    [RESOLVED_TOKEN_CSS_VARS.surfaceHover]: modeTokens.surfaceHover,
+    [RESOLVED_TOKEN_CSS_VARS.surfaceActive]: modeTokens.surfaceActive,
+    [RESOLVED_TOKEN_CSS_VARS.surfaceSelected]: modeTokens.surfaceSelected,
+    [RESOLVED_TOKEN_CSS_VARS.borderSubtle]: modeTokens.borderSubtle,
+    [RESOLVED_TOKEN_CSS_VARS.ring]: modeTokens.ring,
+    [RESOLVED_TOKEN_CSS_VARS.textSecondary]: modeTokens.textSecondary,
+    [RESOLVED_TOKEN_CSS_VARS.textPlaceholder]: modeTokens.textPlaceholder,
+    [RESOLVED_TOKEN_CSS_VARS.controlSolid]: modeTokens.controlSolid,
+    [RESOLVED_TOKEN_CSS_VARS.controlSolidHover]: modeTokens.controlSolidHover,
+    [RESOLVED_TOKEN_CSS_VARS.controlSolidActive]: modeTokens.controlSolidActive,
+    [RESOLVED_TOKEN_CSS_VARS.controlSolidForeground]: modeTokens.controlSolidForeground,
+    [RESOLVED_TOKEN_CSS_VARS.chart1]: modeTokens.chart1,
+    [RESOLVED_TOKEN_CSS_VARS.chart2]: modeTokens.chart2,
+    [RESOLVED_TOKEN_CSS_VARS.chart3]: modeTokens.chart3,
+    [RESOLVED_TOKEN_CSS_VARS.chart4]: modeTokens.chart4,
+    [RESOLVED_TOKEN_CSS_VARS.chart5]: modeTokens.chart5,
+    [RESOLVED_TOKEN_CSS_VARS.chart6]: modeTokens.chart6,
+    [RESOLVED_TOKEN_CSS_VARS.radius]: tokens.radius,
+    [RESOLVED_TOKEN_CSS_VARS.fontSans]: tokens.fontSans,
+    [RESOLVED_TOKEN_CSS_VARS.fontDisplay]: tokens.fontDisplay,
+    [RESOLVED_TOKEN_CSS_VARS.fontMono]: tokens.fontMono
+  };
+}
 
 // src/paths.ts
 import { dirname, isAbsolute, relative, resolve, sep } from "path";
@@ -2107,10 +2896,12 @@ function planFontInstall(headingFont, bodyFont) {
       seenPackages.add(meta.packageName);
       packages.push(meta.packageName);
     }
-    const line = `@import "${meta.importSpecifier}";`;
-    if (!seenImports.has(line)) {
-      seenImports.add(line);
-      importLines.push(line);
+    for (const specifier of curatedFontCssImportSpecifiers(meta)) {
+      const line = `@import "${specifier}";`;
+      if (!seenImports.has(line)) {
+        seenImports.add(line);
+        importLines.push(line);
+      }
     }
   };
   if (headingFont !== "system") {
@@ -2702,13 +3493,13 @@ function missingDependencies(projectRoot, dependencies) {
 function readInstalledPackageNames(projectRoot) {
   const packageJsonPath = join4(projectRoot, "package.json");
   if (!existsSync2(packageJsonPath)) return void 0;
-  const packageJson = JSON.parse(readFileSync(packageJsonPath, "utf8"));
+  const packageJson2 = JSON.parse(readFileSync(packageJsonPath, "utf8"));
   return new Set(
     Object.keys({
-      ...packageJson.dependencies,
-      ...packageJson.devDependencies,
-      ...packageJson.peerDependencies,
-      ...packageJson.optionalDependencies
+      ...packageJson2.dependencies,
+      ...packageJson2.devDependencies,
+      ...packageJson2.peerDependencies,
+      ...packageJson2.optionalDependencies
     })
   );
 }
@@ -2851,6 +3642,109 @@ function toCliPresetError(error) {
   return new CliError(`Invalid preset: ${message}`);
 }
 
+// src/preset-inspect.ts
+function createPresetInspectSummary(input) {
+  const tokens = resolveTokensForStyle(input.style);
+  const fontPlan = fontPlanForStyle(input.style);
+  return {
+    presetCode: input.presetCode,
+    kind: isCanonicalStyleShape(input.style) ? "canonical" : "legacy",
+    style: input.style,
+    fontPackages: fontPlan.packages,
+    fontImports: fontPlan.importLines,
+    tokens: {
+      radius: tokens.radius,
+      fonts: {
+        sans: tokens.fontSans,
+        display: tokens.fontDisplay,
+        mono: tokens.fontMono
+      },
+      light: summarizeMode(tokens, "light"),
+      dark: summarizeMode(tokens, "dark")
+    }
+  };
+}
+function formatPresetInspectSummary(summary) {
+  return [
+    panel("Preset", [
+      `Code: ${summary.presetCode}`,
+      `Shape: ${summary.kind}`,
+      `Icon library: ${summary.style.iconLibrary}`,
+      `Radius: ${summary.style.radius} (${summary.tokens.radius})`
+    ]),
+    formatStylePanel(summary),
+    formatFontPanel(summary),
+    formatTokenPanel(summary)
+  ].join("\n");
+}
+function fontPlanForStyle(style) {
+  if (!isCanonicalStyleShape(style)) {
+    return { packages: [], importLines: [], block: null };
+  }
+  return planFontInstall(style.headingFont, style.bodyFont);
+}
+function summarizeMode(tokens, mode) {
+  const cssVars = resolvedTokensToCssVars(tokens, mode);
+  return {
+    controlSolid: cssVars["--primitive-control-solid"] ?? tokens[mode].controlSolid,
+    ring: cssVars["--primitive-ring"] ?? tokens[mode].ring,
+    surfaceSelected: cssVars["--primitive-surface-selected"] ?? tokens[mode].surfaceSelected,
+    chart: [
+      cssVars["--primitive-chart-1"] ?? tokens[mode].chart1,
+      cssVars["--primitive-chart-2"] ?? tokens[mode].chart2,
+      cssVars["--primitive-chart-3"] ?? tokens[mode].chart3,
+      cssVars["--primitive-chart-4"] ?? tokens[mode].chart4,
+      cssVars["--primitive-chart-5"] ?? tokens[mode].chart5,
+      cssVars["--primitive-chart-6"] ?? tokens[mode].chart6
+    ]
+  };
+}
+function formatStylePanel(summary) {
+  if (isCanonicalStyleShape(summary.style)) {
+    return panel("Style", [
+      `Base color: ${summary.style.baseColor}`,
+      `Theme color: ${summary.style.themeColor}`,
+      `Chart palette: ${summary.style.chartPalette}`,
+      `Heading font: ${summary.style.headingFont}`,
+      `Body font: ${summary.style.bodyFont}`
+    ]);
+  }
+  return panel("Style", [
+    "Legacy payload",
+    `Font sans: ${summary.style.fonts.sans}`,
+    `Font display: ${summary.style.fonts.display}`,
+    `Font mono: ${summary.style.fonts.mono}`
+  ]);
+}
+function formatFontPanel(summary) {
+  const rows = [
+    `--primitive-font-sans: ${summary.tokens.fonts.sans}`,
+    `--primitive-font-display: ${summary.tokens.fonts.display}`,
+    `--primitive-font-mono: ${summary.tokens.fonts.mono}`
+  ];
+  const install = summary.fontPackages.length ? [
+    "",
+    action(`Install packages: ${summary.fontPackages.join(" ")}`),
+    action(`CSS imports: ${summary.fontImports.join(" ")}`)
+  ].join("\n") : ["", action("No Fontsource packages required.")].join("\n");
+  return `${panel("Fonts", rows)}${install}`;
+}
+function formatTokenPanel(summary) {
+  return panel("Resolved primitive tokens", [
+    "Light",
+    `  control: ${summary.tokens.light.controlSolid}`,
+    `  ring: ${summary.tokens.light.ring}`,
+    `  selected: ${summary.tokens.light.surfaceSelected}`,
+    `  chart: ${summary.tokens.light.chart.join(", ")}`,
+    "",
+    "Dark",
+    `  control: ${summary.tokens.dark.controlSolid}`,
+    `  ring: ${summary.tokens.dark.ring}`,
+    `  selected: ${summary.tokens.dark.surfaceSelected}`,
+    `  chart: ${summary.tokens.dark.chart.join(", ")}`
+  ]);
+}
+
 // src/preset-init-writes.ts
 import { mkdir as mkdir3, writeFile as writeFile3 } from "fs/promises";
 import { dirname as dirname4 } from "path";
@@ -2878,6 +3772,351 @@ async function commitPresetInitWrites(input) {
   }
 }
 
+// src/project-templates.ts
+import { mkdir as mkdir4, readFile as readFile4, writeFile as writeFile4 } from "fs/promises";
+import { dirname as dirname5, join as join5 } from "path";
+var PROJECT_TEMPLATE_IDS = ["next", "vite", "astro", "react-router"];
+function parseProjectTemplate(value) {
+  if (!value) return void 0;
+  const normalized = value.toLowerCase();
+  if (normalized === "nextjs" || normalized === "next.js") return "next";
+  if (normalized === "reactrouter" || normalized === "react-router") return "react-router";
+  if (isProjectTemplateId(normalized)) return normalized;
+  throw new CliError(
+    `Unsupported template "${value}". Use one of: ${PROJECT_TEMPLATE_IDS.join(", ")}.`
+  );
+}
+function getProjectTemplateDefinition(id) {
+  return templateDefinitions[id];
+}
+function applyTemplateToConfig(config, template) {
+  return {
+    ...config,
+    tailwind: {
+      ...config.tailwind,
+      css: template.cssPath
+    }
+  };
+}
+async function scaffoldProjectTemplate(projectRoot, template, options) {
+  const planned = template.files.map((file) => file.path);
+  if (!options.force) {
+    const conflicts = [];
+    for (const file of template.files) {
+      if (await fileExists(join5(projectRoot, file.path))) {
+        conflicts.push(file.path);
+      }
+    }
+    if (conflicts.length > 0) {
+      throw new CliError(
+        `Template "${template.id}" would overwrite existing files: ${conflicts.join(", ")}. Use --force to overwrite.`
+      );
+    }
+  }
+  if (options.dryRun) return planned;
+  for (const file of template.files) {
+    await writeTemplateFile(projectRoot, file);
+  }
+  return planned;
+}
+async function writeTemplateFile(projectRoot, file) {
+  const absolute = join5(projectRoot, file.path);
+  await mkdir4(dirname5(absolute), { recursive: true });
+  if (file.path === "package.json" && await fileExists(absolute)) {
+    const existing = JSON.parse(await readFile4(absolute, "utf8"));
+    const next = JSON.parse(file.content);
+    await writeFile4(
+      absolute,
+      `${JSON.stringify(mergePackageJson(existing, next), null, 2)}
+`,
+      "utf8"
+    );
+    return;
+  }
+  await writeFile4(absolute, file.content, "utf8");
+}
+function mergePackageJson(existing, next) {
+  return {
+    ...existing,
+    ...next,
+    scripts: {
+      ...isRecord(existing.scripts) ? existing.scripts : {},
+      ...isRecord(next.scripts) ? next.scripts : {}
+    },
+    dependencies: {
+      ...isRecord(existing.dependencies) ? existing.dependencies : {},
+      ...isRecord(next.dependencies) ? next.dependencies : {}
+    },
+    devDependencies: {
+      ...isRecord(existing.devDependencies) ? existing.devDependencies : {},
+      ...isRecord(next.devDependencies) ? next.devDependencies : {}
+    }
+  };
+}
+function isRecord(value) {
+  return typeof value === "object" && value !== null && !Array.isArray(value);
+}
+function isProjectTemplateId(value) {
+  return PROJECT_TEMPLATE_IDS.includes(value);
+}
+function packageJson(name, input) {
+  return `${JSON.stringify({
+    name,
+    private: true,
+    version: "0.1.0",
+    type: "module",
+    scripts: input.scripts,
+    dependencies: input.dependencies,
+    devDependencies: input.devDependencies ?? {}
+  }, null, 2)}
+`;
+}
+var templateDefinitions = {
+  next: {
+    id: "next",
+    label: "Next.js",
+    cssPath: "src/app/globals.css",
+    files: [
+      {
+        path: "package.json",
+        content: packageJson("wensity-next-app", {
+          scripts: {
+            dev: "next dev",
+            build: "next build",
+            start: "next start"
+          },
+          dependencies: {
+            "next": "^16.2.4",
+            "react": "^19.2.4",
+            "react-dom": "^19.2.4"
+          },
+          devDependencies: {
+            "@types/node": "^22.10.2",
+            "@types/react": "^19.0.0",
+            "@types/react-dom": "^19.0.0",
+            "tailwindcss": "^4.0.0",
+            "typescript": "^5.7.2"
+          }
+        })
+      },
+      { path: "src/app/globals.css", content: '@import "tailwindcss";\n' },
+      {
+        path: "src/app/layout.tsx",
+        content: `import type { ReactNode } from "react";
+import "./globals.css";
+
+export default function RootLayout({ children }: { children: ReactNode }) {
+  return (
+    <html lang="en">
+      <body>{children}</body>
+    </html>
+  );
+}
+`
+      },
+      {
+        path: "src/app/page.tsx",
+        content: `export default function Page() {
+  return <main className="min-h-screen bg-background text-foreground" />;
+}
+`
+      },
+      {
+        path: "tsconfig.json",
+        content: `${JSON.stringify({
+          compilerOptions: {
+            target: "ES2017",
+            lib: ["dom", "dom.iterable", "esnext"],
+            allowJs: true,
+            skipLibCheck: true,
+            strict: true,
+            noEmit: true,
+            esModuleInterop: true,
+            module: "esnext",
+            moduleResolution: "bundler",
+            resolveJsonModule: true,
+            isolatedModules: true,
+            jsx: "preserve",
+            incremental: true,
+            paths: { "@/*": ["./src/*"] }
+          },
+          include: ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
+          exclude: ["node_modules"]
+        }, null, 2)}
+`
+      }
+    ]
+  },
+  vite: {
+    id: "vite",
+    label: "Vite",
+    cssPath: "src/index.css",
+    files: [
+      {
+        path: "package.json",
+        content: packageJson("wensity-vite-app", {
+          scripts: {
+            dev: "vite",
+            build: "vite build",
+            preview: "vite preview"
+          },
+          dependencies: {
+            "vite": "^7.3.0",
+            "react": "^19.2.4",
+            "react-dom": "^19.2.4"
+          },
+          devDependencies: {
+            "@vitejs/plugin-react": "^5.1.2",
+            "@types/react": "^19.0.0",
+            "@types/react-dom": "^19.0.0",
+            "tailwindcss": "^4.0.0",
+            "typescript": "^5.7.2"
+          }
+        })
+      },
+      { path: "index.html", content: '<div id="root"></div><script type="module" src="/src/main.tsx"></script>\n' },
+      { path: "src/index.css", content: '@import "tailwindcss";\n' },
+      {
+        path: "src/main.tsx",
+        content: `import { createRoot } from "react-dom/client";
+import "./index.css";
+
+createRoot(document.getElementById("root")!).render(
+  <main className="min-h-screen bg-background text-foreground" />,
+);
+`
+      },
+      {
+        path: "vite.config.ts",
+        content: `import { defineConfig } from "vite";
+import react from "@vitejs/plugin-react";
+
+export default defineConfig({
+  plugins: [react()],
+  resolve: {
+    alias: {
+      "@": new URL("./src", import.meta.url).pathname,
+    },
+  },
+});
+`
+      }
+    ]
+  },
+  astro: {
+    id: "astro",
+    label: "Astro",
+    cssPath: "src/styles/global.css",
+    files: [
+      {
+        path: "package.json",
+        content: packageJson("wensity-astro-app", {
+          scripts: {
+            dev: "astro dev",
+            build: "astro build",
+            preview: "astro preview"
+          },
+          dependencies: {
+            "@astrojs/react": "^4.4.0",
+            "astro": "^5.16.0",
+            "react": "^19.2.4",
+            "react-dom": "^19.2.4"
+          },
+          devDependencies: {
+            "tailwindcss": "^4.0.0",
+            "typescript": "^5.7.2"
+          }
+        })
+      },
+      { path: "src/styles/global.css", content: '@import "tailwindcss";\n' },
+      {
+        path: "astro.config.mjs",
+        content: `import { defineConfig } from "astro/config";
+import react from "@astrojs/react";
+
+export default defineConfig({
+  integrations: [react()],
+});
+`
+      },
+      {
+        path: "src/pages/index.astro",
+        content: `---
+import "../styles/global.css";
+---
+
+<main class="min-h-screen bg-background text-foreground"></main>
+`
+      }
+    ]
+  },
+  "react-router": {
+    id: "react-router",
+    label: "React Router",
+    cssPath: "src/app/globals.css",
+    files: [
+      {
+        path: "package.json",
+        content: packageJson("wensity-react-router-app", {
+          scripts: {
+            dev: "vite",
+            build: "vite build",
+            preview: "vite preview"
+          },
+          dependencies: {
+            "vite": "^7.3.0",
+            "react": "^19.2.4",
+            "react-dom": "^19.2.4",
+            "react-router": "^7.12.0"
+          },
+          devDependencies: {
+            "@vitejs/plugin-react": "^5.1.2",
+            "@types/react": "^19.0.0",
+            "@types/react-dom": "^19.0.0",
+            "tailwindcss": "^4.0.0",
+            "typescript": "^5.7.2"
+          }
+        })
+      },
+      { path: "index.html", content: '<div id="root"></div><script type="module" src="/src/main.tsx"></script>\n' },
+      { path: "src/app/globals.css", content: '@import "tailwindcss";\n' },
+      {
+        path: "src/main.tsx",
+        content: `import { createRoot } from "react-dom/client";
+import { BrowserRouter, Route, Routes } from "react-router";
+import "./app/globals.css";
+
+createRoot(document.getElementById("root")!).render(
+  <BrowserRouter>
+    <Routes>
+      <Route path="/" element={<main className="min-h-screen bg-background text-foreground" />} />
+    </Routes>
+  </BrowserRouter>,
+);
+`
+      },
+      {
+        path: "vite.config.ts",
+        content: `import { defineConfig } from "vite";
+import react from "@vitejs/plugin-react";
+
+export default defineConfig({
+  plugins: [react()],
+  resolve: {
+    alias: {
+      "@": new URL("./src", import.meta.url).pathname,
+    },
+  },
+});
+`
+      }
+    ]
+  }
+};
+function formatTemplateFiles(files) {
+  return files.map(toPosixPath);
+}
+
 // src/style-css.ts
 var ROOT_SELECTOR = ":root";
 var DARK_SELECTOR = ".dark";
@@ -2963,8 +4202,8 @@ function escapeRegExp(value) {
 }
 
 // src/component-install.ts
-import { mkdir as mkdir4, readFile as readFile4, writeFile as writeFile4 } from "fs/promises";
-import { dirname as dirname5, join as join5, relative as relative3 } from "path";
+import { mkdir as mkdir5, readFile as readFile5, writeFile as writeFile5 } from "fs/promises";
+import { dirname as dirname6, join as join6, relative as relative3 } from "path";
 
 // src/templates.ts
 function cnUtilityTemplate() {
@@ -3172,7 +4411,7 @@ async function prepareInstall(projectRoot, config, payload, options = {}) {
     }
   }
   if (!hasGraphHelperFiles && helperNeeds.primitives) {
-    const primitivesPath = toPosixPath(join5(config.components, "primitives.tsx"));
+    const primitivesPath = toPosixPath(join6(config.components, "primitives.tsx"));
     if (!await fileExists(resolveInside(projectRoot, primitivesPath))) {
       const primitives = primitivesTemplate(config.aliases.utils);
       files.push({
@@ -3213,7 +4452,7 @@ async function planPrimitiveCssFile(projectRoot, config, payload) {
   const cssRelative = config.tailwind?.css;
   if (!cssRelative) return void 0;
   const absolutePath = resolveInside(projectRoot, cssRelative);
-  const existing = await fileExists(absolutePath) ? await readFile4(absolutePath, "utf8") : "";
+  const existing = await fileExists(absolutePath) ? await readFile5(absolutePath, "utf8") : "";
   const withTokens = upsertPrimitiveCssBlock(existing, primitiveCss);
   const fonts = curatedFontsFromStyle(style);
   const fontPlan = planFontInstall(fonts.headingFont, fonts.bodyFont);
@@ -3262,8 +4501,8 @@ ${conflicts.map((path) => `  - ${path}`).join("\n")}`);
 }
 async function writePlannedFiles(files) {
   for (const file of files) {
-    await mkdir4(dirname5(file.absolutePath), { recursive: true });
-    await writeFile4(file.absolutePath, file.content, "utf8");
+    await mkdir5(dirname6(file.absolutePath), { recursive: true });
+    await writeFile5(file.absolutePath, file.content, "utf8");
   }
 }
 function summarizeFiles(projectRoot, files) {
@@ -3288,13 +4527,13 @@ function getPayloadFileKind(payloadFile) {
 }
 function getPayloadOutputPath(payloadFile, fallbackFileName, config) {
   if (isUtilsHelperFile(payloadFile)) return withSourceExtension(config.utils, "ts");
-  if (isOverlayHelperFile(payloadFile)) return toPosixPath(join5(config.components, "overlay.tsx"));
-  if (isPrimitivesHelperFile(payloadFile)) return toPosixPath(join5(config.components, "primitives.tsx"));
+  if (isOverlayHelperFile(payloadFile)) return toPosixPath(join6(config.components, "overlay.tsx"));
+  if (isPrimitivesHelperFile(payloadFile)) return toPosixPath(join6(config.components, "primitives.tsx"));
   if (payloadFile.kind === "helper") {
     throw new CliError(`Unsupported registry helper file path: ${payloadFile.path}`);
   }
   const safePayloadPath = sanitizePayloadPath(payloadFile.path, fallbackFileName);
-  return toPosixPath(join5(config.components, safePayloadPath));
+  return toPosixPath(join6(config.components, safePayloadPath));
 }
 function isGraphHelperFile(payloadFile) {
   return isUtilsHelperFile(payloadFile) || isOverlayHelperFile(payloadFile) || isPrimitivesHelperFile(payloadFile);
@@ -3391,7 +4630,7 @@ function normalizePackageName(specifier) {
 function withSourceExtension(path, extension) {
   const directory = parentDirectory(path);
   const fileName = extensionlessPath(path.split("/").at(-1) ?? path);
-  return toPosixPath(join5(directory === "." ? "" : directory, `${fileName}.${extension}`));
+  return toPosixPath(join6(directory === "." ? "" : directory, `${fileName}.${extension}`));
 }
 
 // src/commands.ts
@@ -3410,6 +4649,12 @@ async function run(context) {
     case "init":
       await initCommand(context, parsed);
       return;
+    case "apply":
+      await applyCommand(context, parsed);
+      return;
+    case "preset":
+      await presetCommand(context, parsed, positionals);
+      return;
     case "login":
       await loginCommand(context, parsed);
       return;
@@ -3437,6 +4682,35 @@ async function run(context) {
 ${HELP_TEXT.trimEnd()}`);
   }
 }
+async function presetCommand(_context, parsed, positionals) {
+  const [subcommand, positionalCode, ...extra] = positionals;
+  if (subcommand !== "inspect") {
+    throw new CliError(
+      `Unknown preset command: ${subcommand ?? ""}
+
+Usage: wensity preset inspect <code> [--json]`
+    );
+  }
+  if (extra.length > 0) {
+    throw new CliError("Too many arguments.\n\nUsage: wensity preset inspect <code> [--json]");
+  }
+  const optionCode = getStringOption(parsed, "preset");
+  const presetFile = getStringOption(parsed, "preset-file");
+  if (positionalCode && optionCode) {
+    throw new CliError("Use either a positional preset code or --preset <code>, not both.");
+  }
+  const { style, presetCode } = await resolvePresetStyle({
+    presetCode: optionCode ?? positionalCode,
+    presetFile
+  });
+  const summary = createPresetInspectSummary({ presetCode, style });
+  if (hasFlag(parsed, "json")) {
+    printJson(summary);
+    return;
+  }
+  printTitle("Preset inspection");
+  print(formatPresetInspectSummary(summary));
+}
 async function initCommand(context, parsed) {
   const dryRun = hasFlag(parsed, "dry-run");
   const force = hasFlag(parsed, "force");
@@ -3444,6 +4718,8 @@ async function initCommand(context, parsed) {
   const apiUrl = getStringOption(parsed, "api-url") ?? context.env.WENSITY_API_URL ?? DEFAULT_API_ORIGIN;
   const presetCode = getStringOption(parsed, "preset");
   const presetFile = getStringOption(parsed, "preset-file");
+  const templateId = parseProjectTemplate(getStringOption(parsed, "template"));
+  const template = templateId ? getProjectTemplateDefinition(templateId) : void 0;
   const hasPreset = Boolean(presetCode || presetFile);
   const dependencies = ["clsx", "tailwind-merge"];
   if (hasPreset) {
@@ -3454,18 +4730,21 @@ async function initCommand(context, parsed) {
       apiUrl,
       presetCode,
       presetFile,
-      dependencies
+      dependencies,
+      template
     });
     return;
   }
-  const config = createDefaultConfig(context.cwd, apiUrl);
-  const configPath = join6(context.cwd, CONFIG_FILE_NAME);
+  const templateFiles = template ? await scaffoldProjectTemplate(context.cwd, template, { dryRun, force }) : [];
+  const config = template ? applyTemplateToConfig(createDefaultConfig(context.cwd, apiUrl), template) : createDefaultConfig(context.cwd, apiUrl);
+  const configPath = join7(context.cwd, CONFIG_FILE_NAME);
   const utilityPath = resolveConfiguredFilePath(context.cwd, config.utils);
   const utilityRelativePath = toPosixPath(config.utils.endsWith(".ts") ? config.utils : `${config.utils}.ts`);
   if (dryRun) {
     printTitle("Project initialization preview");
     print(action("Would write:"));
-    print(formatList([CONFIG_FILE_NAME, utilityRelativePath]));
+    print(formatList([...formatTemplateFiles(templateFiles), CONFIG_FILE_NAME, utilityRelativePath]));
+    if (template) print(action(`Template: ${template.label}`));
     if (install) print(action(`Would install: ${dependencies.join(" ")}`));
     return;
   }
@@ -3493,13 +4772,17 @@ async function initWithPreset(context, options) {
     presetCode: options.presetCode,
     presetFile: options.presetFile
   });
-  const fonts = curatedFontsFromStyle(style);
-  const fontPlan = planFontInstall(fonts.headingFont, fonts.bodyFont);
-  const installDependencies = [...options.dependencies, ...fontPlan.packages];
-  const configPath = join6(context.cwd, CONFIG_FILE_NAME);
+  const configPath = join7(context.cwd, CONFIG_FILE_NAME);
   const configExists = await fileExists(configPath);
+  const templateFiles = options.template ? await scaffoldProjectTemplate(context.cwd, options.template, {
+    dryRun: options.dryRun,
+    force: options.force
+  }) : [];
   let config;
   if (configExists && !options.force) {
+    if (options.template) {
+      throw new CliError(`${CONFIG_FILE_NAME} already exists. Omit --template for existing projects or use --force.`);
+    }
     const loaded = await loadConfig(context.cwd, { apiUrl: options.apiUrl });
     config = {
       ...loaded.config,
@@ -3507,63 +4790,36 @@ async function initWithPreset(context, options) {
     };
   } else {
     config = {
-      ...createDefaultConfig(context.cwd, options.apiUrl),
+      ...options.template ? applyTemplateToConfig(createDefaultConfig(context.cwd, options.apiUrl), options.template) : createDefaultConfig(context.cwd, options.apiUrl),
       style
     };
   }
   const utilityPath = resolveConfiguredFilePath(context.cwd, config.utils);
   const utilityRelativePath = toPosixPath(config.utils.endsWith(".ts") ? config.utils : `${config.utils}.ts`);
-  const registry = config.registry;
-  let primitiveCss;
-  try {
-    const payload = await withSpinner(
-      `Fetching primitive tokens (${INIT_PRIMITIVE_CSS_SLUG})`,
-      () => fetchComponentPayload({ slug: INIT_PRIMITIVE_CSS_SLUG, registry }),
-      "Fetched primitive tokens"
-    );
-    if (typeof payload.primitiveCss !== "string" || !payload.primitiveCss.trim()) {
-      throw new CliError(
-        `Pinned slug "${INIT_PRIMITIVE_CSS_SLUG}" did not return primitiveCss. Cannot apply preset styles.`
-      );
-    }
-    primitiveCss = applyStyleToPrimitiveCss(payload.primitiveCss, style).trim();
-  } catch (error) {
-    if (error instanceof CliError) throw error;
-    const message = error instanceof Error ? error.message : String(error);
-    throw new CliError(`Failed to fetch primitive CSS for preset init: ${message}`);
-  }
-  const cssRelative = config.tailwind?.css;
-  if (!cssRelative) {
-    throw new CliError("No Tailwind CSS path configured. Set tailwind.css in wensity.json.");
-  }
-  const cssAbsolute = resolveInside(context.cwd, cssRelative);
-  const existingCss = await fileExists(cssAbsolute) ? await readFile5(cssAbsolute, "utf8") : "";
-  const withTokens = upsertPrimitiveCssBlock(existingCss, primitiveCss);
-  const nextCss = upsertFontImportBlock(withTokens, fontPlan.block);
-  const cssChanged = nextCss !== existingCss;
-  const installedPackages = readInstalledPackageNames(context.cwd);
-  const unusedFontWarning = installedPackages ? warnUnusedFontPackageMessage(fonts.headingFont, fonts.bodyFont, installedPackages) : void 0;
+  const prepared = await preparePresetStyleApplication(context.cwd, config, style, "preset init");
+  const installDependencies = [...options.dependencies, ...prepared.fontPlan.packages];
   if (options.dryRun) {
     printTitle("Project initialization preview (preset)");
     print(action("Would write:"));
-    const planned = [CONFIG_FILE_NAME, utilityRelativePath];
-    if (cssChanged) planned.push(toPosixPath(cssRelative));
+    const planned = [...formatTemplateFiles(templateFiles), CONFIG_FILE_NAME, utilityRelativePath];
+    if (prepared.cssChanged) planned.push(toPosixPath(prepared.cssRelative));
     print(formatList(planned));
+    if (options.template) print(action(`Template: ${options.template.label}`));
     print(action(`Preset: ${presetCode.slice(0, 24)}\u2026`));
     print(action(`Style: icon=${style.iconLibrary} radius=${style.radius}`));
-    if (fontPlan.packages.length > 0) {
-      print(action(`Fonts: ${fontPlan.packages.join(" ")}`));
+    if (prepared.fontPlan.packages.length > 0) {
+      print(action(`Fonts: ${prepared.fontPlan.packages.join(" ")}`));
     }
     if (options.install) print(action(`Would install: ${installDependencies.join(" ")}`));
-    if (unusedFontWarning) warn(unusedFontWarning);
+    if (prepared.unusedFontWarning) warn(prepared.unusedFontWarning);
     return;
   }
   const shouldWriteUtility = options.force || !await fileExists(utilityPath);
   await commitPresetInitWrites({
-    cssAbsolute,
-    existingCss,
-    nextCss,
-    cssChanged,
+    cssAbsolute: prepared.cssAbsolute,
+    existingCss: prepared.existingCss,
+    nextCss: prepared.nextCss,
+    cssChanged: prepared.cssChanged,
     writeUtility: shouldWriteUtility,
     utilityAbsolutePath: utilityPath,
     utilityContent: cnUtilityTemplate(),
@@ -3580,26 +4836,150 @@ async function initWithPreset(context, options) {
   }
   printTitle("Project initialized");
   const created = [
+    ...options.template ? [success(`template: ${options.template.label}`)] : [],
     success(CONFIG_FILE_NAME),
     success(utilityRelativePath),
     success(`registry: ${options.apiUrl}`),
     success(`preset applied (${style.iconLibrary}, radius=${style.radius})`)
   ];
-  if (cssChanged) {
-    created.push(success(`CSS tokens: ${toPosixPath(cssRelative)}`));
+  if (prepared.cssChanged) {
+    created.push(success(`CSS tokens: ${toPosixPath(prepared.cssRelative)}`));
   } else {
-    created.push(action(`CSS tokens unchanged: ${toPosixPath(cssRelative)}`));
+    created.push(action(`CSS tokens unchanged: ${toPosixPath(prepared.cssRelative)}`));
   }
-  if (fontPlan.packages.length > 0) {
-    created.push(success(`fonts: ${fontPlan.packages.join(", ")}`));
+  if (prepared.fontPlan.packages.length > 0) {
+    created.push(success(`fonts: ${prepared.fontPlan.packages.join(", ")}`));
   }
   print(panel("Created", created));
-  if (unusedFontWarning) warn(unusedFontWarning);
+  if (prepared.unusedFontWarning) warn(prepared.unusedFontWarning);
   print(nextSteps([
     "Browse available components: npx wensity list",
     "Install a primitive: npx wensity add button"
   ]));
 }
+async function applyCommand(context, parsed) {
+  const dryRun = hasFlag(parsed, "dry-run");
+  const install = !hasFlag(parsed, "no-install");
+  const apiUrl = getStringOption(parsed, "api-url") ?? context.env.WENSITY_API_URL;
+  const registryOverride = getStringOption(parsed, "registry");
+  const presetCodeInput = getStringOption(parsed, "preset");
+  const presetFile = getStringOption(parsed, "preset-file");
+  if (!presetCodeInput && !presetFile) {
+    throw new CliError("Missing preset. Pass --preset <code> or --preset-file <path>.");
+  }
+  const loaded = await loadConfig(context.cwd, { registry: registryOverride, apiUrl });
+  if (!loaded.exists) {
+    throw new CliError(`${CONFIG_FILE_NAME} not found. Run "wensity init" first, then "wensity apply --preset <code>".`);
+  }
+  const { style, presetCode } = await resolvePresetStyle({
+    presetCode: presetCodeInput,
+    presetFile
+  });
+  const prepared = await preparePresetStyleApplication(
+    loaded.projectRoot,
+    {
+      ...loaded.config,
+      style
+    },
+    style,
+    "preset apply"
+  );
+  const installDependencies = prepared.fontPlan.packages;
+  if (dryRun) {
+    printTitle("Preset apply preview");
+    print(action("Would write:"));
+    const planned = [CONFIG_FILE_NAME];
+    if (prepared.cssChanged) planned.push(toPosixPath(prepared.cssRelative));
+    print(formatList(planned));
+    print(action(`Preset: ${presetCode.slice(0, 24)}\u2026`));
+    print(action(`Style: icon=${style.iconLibrary} radius=${style.radius}`));
+    if (prepared.fontPlan.packages.length > 0) {
+      print(action(`Fonts: ${prepared.fontPlan.packages.join(" ")}`));
+    }
+    if (install && installDependencies.length > 0) {
+      print(action(`Would install: ${installDependencies.join(" ")}`));
+    }
+    if (prepared.unusedFontWarning) warn(prepared.unusedFontWarning);
+    return;
+  }
+  await commitPresetInitWrites({
+    cssAbsolute: prepared.cssAbsolute,
+    existingCss: prepared.existingCss,
+    nextCss: prepared.nextCss,
+    cssChanged: prepared.cssChanged,
+    writeUtility: false,
+    utilityAbsolutePath: resolveConfiguredFilePath(loaded.projectRoot, loaded.config.utils),
+    utilityContent: cnUtilityTemplate(),
+    commitConfig: async () => {
+      await mergeStyleIntoConfigFile(loaded.configPath, style);
+    }
+  });
+  if (install && installDependencies.length > 0) {
+    runInstall(loaded.projectRoot, missingDependencies(loaded.projectRoot, installDependencies));
+  }
+  printTitle("Preset applied");
+  const applied = [
+    success(CONFIG_FILE_NAME),
+    success(`preset applied (${style.iconLibrary}, radius=${style.radius})`)
+  ];
+  if (prepared.cssChanged) {
+    applied.push(success(`CSS tokens: ${toPosixPath(prepared.cssRelative)}`));
+  } else {
+    applied.push(action(`CSS tokens unchanged: ${toPosixPath(prepared.cssRelative)}`));
+  }
+  if (prepared.fontPlan.packages.length > 0) {
+    applied.push(success(`fonts: ${prepared.fontPlan.packages.join(", ")}`));
+  }
+  print(panel("Updated", applied));
+  if (prepared.unusedFontWarning) warn(prepared.unusedFontWarning);
+  print(nextSteps([
+    "Review your changed CSS tokens",
+    "Run your app to verify the updated primitive theme"
+  ]));
+}
+async function preparePresetStyleApplication(projectRoot, config, style, operation) {
+  const fonts = curatedFontsFromStyle(style);
+  const fontPlan = planFontInstall(fonts.headingFont, fonts.bodyFont);
+  const registry = config.registry;
+  let primitiveCss;
+  try {
+    const payload = await withSpinner(
+      `Fetching primitive tokens (${INIT_PRIMITIVE_CSS_SLUG})`,
+      () => fetchComponentPayload({ slug: INIT_PRIMITIVE_CSS_SLUG, registry }),
+      "Fetched primitive tokens"
+    );
+    if (typeof payload.primitiveCss !== "string" || !payload.primitiveCss.trim()) {
+      throw new CliError(
+        `Pinned slug "${INIT_PRIMITIVE_CSS_SLUG}" did not return primitiveCss. Cannot apply preset styles.`
+      );
+    }
+    primitiveCss = applyStyleToPrimitiveCss(payload.primitiveCss, style).trim();
+  } catch (error) {
+    if (error instanceof CliError) throw error;
+    const message = error instanceof Error ? error.message : String(error);
+    throw new CliError(`Failed to fetch primitive CSS for ${operation}: ${message}`);
+  }
+  const cssRelative = config.tailwind?.css;
+  if (!cssRelative) {
+    throw new CliError("No Tailwind CSS path configured. Set tailwind.css in wensity.json.");
+  }
+  const cssAbsolute = resolveInside(projectRoot, cssRelative);
+  const existingCss = await fileExists(cssAbsolute) ? await readFile6(cssAbsolute, "utf8") : "";
+  const withTokens = upsertPrimitiveCssBlock(existingCss, primitiveCss);
+  const nextCss = upsertFontImportBlock(withTokens, fontPlan.block);
+  const cssChanged = nextCss !== existingCss;
+  const installedPackages = readInstalledPackageNames(projectRoot);
+  const unusedFontWarning = installedPackages ? warnUnusedFontPackageMessage(fonts.headingFont, fonts.bodyFont, installedPackages) : void 0;
+  return {
+    fontPlan,
+    cssRelative,
+    cssAbsolute,
+    existingCss,
+    nextCss,
+    cssChanged,
+    unusedFontWarning
+  };
+}
 async function loginCommand(context, parsed) {
   const apiUrl = getStringOption(parsed, "api-url") ?? context.env.WENSITY_API_URL ?? DEFAULT_API_ORIGIN;
   const apiBaseUrl = normalizeUrlOrigin(apiUrl);
@@ -3889,8 +5269,8 @@ function formatAccountPanel(whoami, savedPath) {
   return panel(isPro ? "Wensity Pro" : "Wensity Free", lines);
 }
 async function writeTextFile(path, content) {
-  await mkdir5(dirname6(path), { recursive: true });
-  await writeFile5(path, content, "utf8");
+  await mkdir6(dirname7(path), { recursive: true });
+  await writeFile6(path, content, "utf8");
 }
 
 // src/index.ts