@usenavii/core 0.3.0 → 0.5.0

package/dist/index.cjs

@@ -189,6 +189,63 @@ var ANCHORS = {
     groundY: 94,
     cheekY: 53,
     cheekOffset: 12
+  },
+  // Squircle — FULL-BLEED. Body fills 0-100, face composed as ID portrait:
+  // upper-third eye line, lower-third mouth, generous cheek/eye spread.
+  squircle: {
+    cx: 50,
+    eyeY: 44,
+    eyeOffset: 13,
+    eyeScale: 1,
+    mouthY: 62,
+    mouthSpan: 8,
+    topperX: 50,
+    topperY: 8,
+    groundY: 98,
+    cheekY: 52,
+    cheekOffset: 24
+  },
+  // Pumpkin — round body w/ slight horizontal lobing. Face mid-low, stem on top.
+  pumpkin: {
+    cx: 50,
+    eyeY: 52,
+    eyeOffset: 11,
+    eyeScale: 1,
+    mouthY: 66,
+    mouthSpan: 9,
+    topperX: 50,
+    topperY: 18,
+    groundY: 88,
+    cheekY: 60,
+    cheekOffset: 20
+  },
+  // Ghost — tall wavy silhouette. Face high (under the "hood"), wavy hem below.
+  ghost: {
+    cx: 50,
+    eyeY: 42,
+    eyeOffset: 8,
+    eyeScale: 1.05,
+    mouthY: 54,
+    mouthSpan: 6,
+    topperX: 50,
+    topperY: 12,
+    groundY: 92,
+    cheekY: 50,
+    cheekOffset: 14
+  },
+  // SkullHead — slightly elongated egg w/ deep eye sockets.
+  skullHead: {
+    cx: 50,
+    eyeY: 50,
+    eyeOffset: 10,
+    eyeScale: 1,
+    mouthY: 70,
+    mouthSpan: 7,
+    topperX: 50,
+    topperY: 16,
+    groundY: 90,
+    cheekY: 60,
+    cheekOffset: 16
   }
 };
 
@@ -209,27 +266,49 @@ var BODY_PATHS = {
   // Taro — gourd shape: small head bulge, fuller bottom
   taro: "M50 14 C58 14 64 22 64 30 C64 36 60 40 60 46 C60 54 76 60 78 76 C80 88 66 91 50 91 C34 91 20 88 22 76 C24 60 40 54 40 46 C40 40 36 36 36 30 C36 22 42 14 50 14 Z",
   // Wisp — tall narrow body, slight bottom flare, ghost-like
-  wisp: "M50 12 C60 12 66 24 66 40 C66 60 74 78 70 90 C64 96 36 96 30 90 C26 78 34 60 34 40 C34 24 40 12 50 12 Z"
+  wisp: "M50 12 C60 12 66 24 66 40 C66 60 74 78 70 90 C64 96 36 96 30 90 C26 78 34 60 34 40 C34 24 40 12 50 12 Z",
+  // Squircle — FULL-BLEED corporate plate. Fills entire viewport with tight
+  // corner radius (~4px). Reads as a tile / ID photo not a contained avatar.
+  // Pairs with `flat: true` packs (Office) — face floats on a wall of color.
+  squircle: "M4 0 C2 0 0 2 0 4 C0 35 0 65 0 96 C0 98 2 100 4 100 C35 100 65 100 96 100 C98 100 100 98 100 96 C100 65 100 35 100 4 C100 2 98 0 96 0 C65 0 35 0 4 0 Z",
+  // Pumpkin — round, slightly wider than tall, with subtle horizontal "lobes"
+  // for the iconic carved-pumpkin gourd shape. Stem area kept clear at top.
+  pumpkin: "M50 18 C70 18 86 30 86 52 C86 74 70 88 50 88 C30 88 14 74 14 52 C14 30 30 18 50 18 Z",
+  // Ghost — soft rounded top with wavy bottom hem (3 humps), evoking a sheet.
+  ghost: "M50 12 C68 12 78 24 78 42 C78 60 80 76 80 88 L74 84 L68 90 L62 84 L56 90 L50 84 L44 90 L38 84 L32 90 L26 84 L20 88 C20 76 22 60 22 42 C22 24 32 12 50 12 Z",
+  // SkullHead — egg-ish shape, slight pinch at jaw for skull silhouette.
+  skullHead: "M50 16 C68 16 80 30 80 50 C80 64 76 72 70 78 L68 86 L60 88 L60 82 L40 82 L40 88 L32 86 L30 78 C24 72 20 64 20 50 C20 30 32 16 50 16 Z"
 };
-function renderBodyDefs(_id, _palette, gradId) {
+function renderBodyDefs(_id, palette, gradId, opts) {
+  if (opts?.flat) {
+    return `<radialGradient id="${gradId}"><stop offset="0%" stop-color="${palette.bodyFrom}" /><stop offset="100%" stop-color="${palette.bodyFrom}" /></radialGradient>`;
+  }
   return `
 <radialGradient id="${gradId}" cx="42%" cy="32%" r="68%">
-  <stop offset="0%" stop-color="${_palette.bodyFrom}" />
-  <stop offset="100%" stop-color="${_palette.bodyTo}" />
+  <stop offset="0%" stop-color="${palette.bodyFrom}" />
+  <stop offset="100%" stop-color="${palette.bodyTo}" />
 </radialGradient>`.trim();
 }
-function renderBody(id, palette, gradId) {
+function renderBody(id, palette, gradId, opts) {
   const d = BODY_PATHS[id];
   const a = ANCHORS[id];
+  const flat = opts?.flat === true;
   const outlineColor = withAlpha(palette.ink, 0.18);
-  return [
-    // Ground shadow — soft ellipse just below body, grounds the figure
-    `<ellipse cx="${a.cx}" cy="${a.groundY + 4}" rx="22" ry="2.6" fill="${palette.ink}" opacity="0.16" />`,
-    // Body fill
-    `<path d="${d}" fill="url(#${gradId})" stroke="${outlineColor}" stroke-width="0.7" />`,
-    // Sheen — small light spot upper-left, scaled to body
-    `<ellipse cx="${a.cx - 12}" cy="${a.eyeY - 14}" rx="11" ry="7" fill="#FFFFFF" opacity="0.22" transform="rotate(-18 ${a.cx - 12} ${a.eyeY - 14})" />`
-  ].join("");
+  const parts = [];
+  if (!flat) {
+    parts.push(
+      `<ellipse cx="${a.cx}" cy="${a.groundY + 4}" rx="22" ry="2.6" fill="${palette.ink}" opacity="0.16" />`
+    );
+  }
+  parts.push(
+    flat ? `<path d="${d}" fill="url(#${gradId})" />` : `<path d="${d}" fill="url(#${gradId})" stroke="${outlineColor}" stroke-width="0.7" />`
+  );
+  if (!flat) {
+    parts.push(
+      `<ellipse cx="${a.cx - 12}" cy="${a.eyeY - 14}" rx="11" ry="7" fill="#FFFFFF" opacity="0.22" transform="rotate(-18 ${a.cx - 12} ${a.eyeY - 14})" />`
+    );
+  }
+  return parts.join("");
 }
 function withAlpha(hex, alpha) {
   const h = hex.replace("#", "");
@@ -242,12 +321,13 @@ function withAlpha(hex, alpha) {
 }
 
 // src/parts/eyes.ts
-function renderEyes(id, palette, anchor) {
+function renderEyes(id, palette, anchor, opts) {
   const lx = anchor.cx - anchor.eyeOffset;
   const rx = anchor.cx + anchor.eyeOffset;
   const y = anchor.eyeY;
   const s = anchor.eyeScale;
   const ink = palette.ink;
+  const sw = opts?.strokeMul ?? 1;
   switch (id) {
     case "round":
       return [
@@ -269,24 +349,24 @@ function renderEyes(id, palette, anchor) {
       ].join("");
     case "squint":
       return [
-        arc(lx - 4.5, y, lx, y - 3.5, lx + 4.5, y, ink, 1.8),
-        arc(rx - 4.5, y, rx, y - 3.5, rx + 4.5, y, ink, 1.8)
+        arc(lx - 4.5, y, lx, y - 3.5, lx + 4.5, y, ink, 1.8 * sw),
+        arc(rx - 4.5, y, rx, y - 3.5, rx + 4.5, y, ink, 1.8 * sw)
       ].join("");
     case "wink":
       return [
         sclera(lx, y, 4 * s, 4.5 * s),
         pupil(lx, y, 2.2 * s, ink),
         glint(lx + 1, y - 1),
-        arc(rx - 4, y, rx, y - 3.5, rx + 4, y, ink, 1.8)
+        arc(rx - 4, y, rx, y - 3.5, rx + 4, y, ink, 1.8 * sw)
       ].join("");
     case "sleepy":
       return [
         // Heavier upper lid — half-closed
-        `<path d="M${lx - 4} ${y - 0.5} Q${lx} ${y + 2} ${lx + 4} ${y - 0.5}" stroke="${ink}" stroke-width="1.7" stroke-linecap="round" fill="none" />`,
-        `<path d="M${rx - 4} ${y - 0.5} Q${rx} ${y + 2} ${rx + 4} ${y - 0.5}" stroke="${ink}" stroke-width="1.7" stroke-linecap="round" fill="none" />`,
+        `<path d="M${lx - 4} ${y - 0.5} Q${lx} ${y + 2} ${lx + 4} ${y - 0.5}" stroke="${ink}" stroke-width="${1.7 * sw}" stroke-linecap="round" fill="none" />`,
+        `<path d="M${rx - 4} ${y - 0.5} Q${rx} ${y + 2} ${rx + 4} ${y - 0.5}" stroke="${ink}" stroke-width="${1.7 * sw}" stroke-linecap="round" fill="none" />`,
         // tiny visible pupils
-        `<circle cx="${lx}" cy="${y + 0.5}" r="0.9" fill="${ink}" />`,
-        `<circle cx="${rx}" cy="${y + 0.5}" r="0.9" fill="${ink}" />`
+        `<circle cx="${lx}" cy="${y + 0.5}" r="${0.9 * sw}" fill="${ink}" />`,
+        `<circle cx="${rx}" cy="${y + 0.5}" r="${0.9 * sw}" fill="${ink}" />`
       ].join("");
     case "star":
       return [starEye(lx, y, ink), starEye(rx, y, ink)].join("");
@@ -303,20 +383,20 @@ function renderEyes(id, palette, anchor) {
       ].join("");
     case "dot":
       return [
-        `<circle cx="${lx}" cy="${y}" r="${1.4 * s}" fill="${ink}" />`,
-        `<circle cx="${rx}" cy="${y}" r="${1.4 * s}" fill="${ink}" />`
+        `<circle cx="${lx}" cy="${y}" r="${1.4 * s * sw}" fill="${ink}" />`,
+        `<circle cx="${rx}" cy="${y}" r="${1.4 * s * sw}" fill="${ink}" />`
       ].join("");
     case "cross":
-      return [crossEye(lx, y, ink), crossEye(rx, y, ink)].join("");
+      return [crossEye(lx, y, ink, sw), crossEye(rx, y, ink, sw)].join("");
   }
 }
 function heartEye(cx, cy, color) {
   const s = 2;
   return `<path d="M${cx} ${cy + s * 1.4} L${cx - s * 1.8} ${cy - s * 0.2} A${s} ${s} 0 0 1 ${cx} ${cy - s * 0.6} A${s} ${s} 0 0 1 ${cx + s * 1.8} ${cy - s * 0.2} Z" fill="${color}" />`;
 }
-function crossEye(cx, cy, color) {
+function crossEye(cx, cy, color, sw = 1) {
   const s = 2.4;
-  return `<g stroke="${color}" stroke-width="1.6" stroke-linecap="round"><line x1="${cx - s}" y1="${cy - s}" x2="${cx + s}" y2="${cy + s}" /><line x1="${cx - s}" y1="${cy + s}" x2="${cx + s}" y2="${cy - s}" /></g>`;
+  return `<g stroke="${color}" stroke-width="${1.6 * sw}" stroke-linecap="round"><line x1="${cx - s}" y1="${cy - s}" x2="${cx + s}" y2="${cy + s}" /><line x1="${cx - s}" y1="${cy + s}" x2="${cx + s}" y2="${cy - s}" /></g>`;
 }
 function sclera(cx, cy, rx, ry) {
   return `<ellipse cx="${cx}" cy="${cy}" rx="${rx}" ry="${ry}" fill="#FFFFFF" />`;
@@ -336,41 +416,68 @@ function starEye(cx, cy, color) {
 }
 
 // src/parts/mouth.ts
-function renderMouth(id, palette, anchor, curveScale = 1) {
+function renderMouth(id, palette, anchor, curveScale = 1, opts) {
   const cx = anchor.cx;
   const y = anchor.mouthY;
   const w = anchor.mouthSpan * curveScale;
   const ink = palette.ink;
+  const sw = opts?.strokeMul ?? 1;
+  const base = 1.8 * sw;
   switch (id) {
     case "smile":
-      return `<path d="M${cx - w} ${y} Q${cx} ${y + 5} ${cx + w} ${y}" stroke="${ink}" stroke-width="1.8" stroke-linecap="round" fill="none" />`;
+      return `<path d="M${cx - w} ${y} Q${cx} ${y + 5} ${cx + w} ${y}" stroke="${ink}" stroke-width="${base}" stroke-linecap="round" fill="none" />`;
     case "grin":
-      return `<path d="M${cx - w - 1} ${y - 2} Q${cx} ${y + 7} ${cx + w + 1} ${y - 2}" stroke="${ink}" stroke-width="1.8" stroke-linecap="round" fill="none" />`;
+      return `<path d="M${cx - w - 1} ${y - 2} Q${cx} ${y + 7} ${cx + w + 1} ${y - 2}" stroke="${ink}" stroke-width="${base}" stroke-linecap="round" fill="none" />`;
     case "open":
       return [
-        `<path d="M${cx - w - 1} ${y - 2} Q${cx} ${y + 9} ${cx + w + 1} ${y - 2}" stroke="${ink}" stroke-width="1.8" stroke-linecap="round" fill="${ink}" fill-opacity="0.55" />`,
+        `<path d="M${cx - w - 1} ${y - 2} Q${cx} ${y + 9} ${cx + w + 1} ${y - 2}" stroke="${ink}" stroke-width="${base}" stroke-linecap="round" fill="${ink}" fill-opacity="0.55" />`,
         `<ellipse cx="${cx}" cy="${y + 3}" rx="${w * 0.55}" ry="1.8" fill="#F472B6" opacity="0.75" />`
       ].join("");
     case "flat":
-      return `<path d="M${cx - w + 1} ${y} L${cx + w - 1} ${y}" stroke="${ink}" stroke-width="1.8" stroke-linecap="round" fill="none" />`;
+      return `<path d="M${cx - w + 1} ${y} L${cx + w - 1} ${y}" stroke="${ink}" stroke-width="${base}" stroke-linecap="round" fill="none" />`;
     case "smirk":
-      return `<path d="M${cx - w} ${y} Q${cx} ${y + 3} ${cx + w + 1} ${y - 2}" stroke="${ink}" stroke-width="1.8" stroke-linecap="round" fill="none" />`;
+      return `<path d="M${cx - w} ${y} Q${cx} ${y + 3} ${cx + w + 1} ${y - 2}" stroke="${ink}" stroke-width="${base}" stroke-linecap="round" fill="none" />`;
     case "awe":
       return `<ellipse cx="${cx}" cy="${y + 1}" rx="${w * 0.45}" ry="3.2" fill="${ink}" opacity="0.85" />`;
     case "tongue":
       return [
-        `<path d="M${cx - w} ${y} Q${cx} ${y + 6} ${cx + w} ${y}" stroke="${ink}" stroke-width="1.8" stroke-linecap="round" fill="none" />`,
-        `<path d="M${cx - 2} ${y + 4} Q${cx} ${y + 9} ${cx + 2} ${y + 4} Z" fill="#F472B6" stroke="${ink}" stroke-width="0.6" />`
+        `<path d="M${cx - w} ${y} Q${cx} ${y + 6} ${cx + w} ${y}" stroke="${ink}" stroke-width="${base}" stroke-linecap="round" fill="none" />`,
+        `<path d="M${cx - 2} ${y + 4} Q${cx} ${y + 9} ${cx + 2} ${y + 4} Z" fill="#F472B6" stroke="${ink}" stroke-width="${0.6 * sw}" />`
       ].join("");
     case "tooth":
       return [
-        `<path d="M${cx - w} ${y} Q${cx} ${y + 5} ${cx + w} ${y}" stroke="${ink}" stroke-width="1.8" stroke-linecap="round" fill="none" />`,
-        `<rect x="${cx - 1.2}" y="${y + 0.4}" width="2.4" height="2.6" rx="0.4" fill="#FFFFFF" stroke="${ink}" stroke-width="0.4" />`
+        `<path d="M${cx - w} ${y} Q${cx} ${y + 5} ${cx + w} ${y}" stroke="${ink}" stroke-width="${base}" stroke-linecap="round" fill="none" />`,
+        `<rect x="${cx - 1.2}" y="${y + 0.4}" width="2.4" height="2.6" rx="0.4" fill="#FFFFFF" stroke="${ink}" stroke-width="${0.4 * sw}" />`
       ].join("");
     case "wave":
-      return `<path d="M${cx - w} ${y + 1} Q${cx - w / 2} ${y - 1.5} ${cx} ${y + 1} Q${cx + w / 2} ${y + 3.5} ${cx + w} ${y + 1}" stroke="${ink}" stroke-width="1.8" stroke-linecap="round" fill="none" />`;
+      return `<path d="M${cx - w} ${y + 1} Q${cx - w / 2} ${y - 1.5} ${cx} ${y + 1} Q${cx + w / 2} ${y + 3.5} ${cx + w} ${y + 1}" stroke="${ink}" stroke-width="${base}" stroke-linecap="round" fill="none" />`;
     case "dot":
-      return `<circle cx="${cx}" cy="${y + 1}" r="1.2" fill="${ink}" />`;
+      return `<circle cx="${cx}" cy="${y + 1}" r="${1.2 * sw}" fill="${ink}" />`;
+    case "jagged": {
+      const half = w + 1;
+      const top = y - 1;
+      const bot = y + 5;
+      const step = half * 2 / 8;
+      const x0 = cx - half;
+      const points = [];
+      points.push(`${x0} ${top}`);
+      for (let i = 1; i <= 8; i++) {
+        const px = x0 + step * i;
+        const py = i % 2 === 1 ? bot : top;
+        points.push(`${px.toFixed(2)} ${py}`);
+      }
+      return `<path d="M${points.join(" L")} L${cx + half} ${top} Z" fill="${ink}" />`;
+    }
+    case "fangs": {
+      const half = w - 1;
+      return [
+        `<path d="M${cx - half} ${y} L${cx + half} ${y}" stroke="${ink}" stroke-width="${base}" stroke-linecap="round" fill="none" />`,
+        // Left fang
+        `<path d="M${cx - 2.5} ${y + 0.4} L${cx - 1.2} ${y + 4.5} L${cx - 0.2} ${y + 0.4} Z" fill="#FFFFFF" stroke="${ink}" stroke-width="${0.5 * sw}" />`,
+        // Right fang
+        `<path d="M${cx + 0.2} ${y + 0.4} L${cx + 1.2} ${y + 4.5} L${cx + 2.5} ${y + 0.4} Z" fill="#FFFFFF" stroke="${ink}" stroke-width="${0.5 * sw}" />`
+      ].join("");
+    }
   }
 }
 
@@ -407,7 +514,8 @@ function renderAntenna(id, anchor, palette) {
 }
 
 // src/parts/accessory.ts
-function renderAccessory(id, palette, anchor) {
+function renderAccessory(id, palette, anchor, opts) {
+  const sw = opts?.strokeMul ?? 1;
   switch (id) {
     case "none":
       return "";
@@ -442,10 +550,11 @@ function renderAccessory(id, palette, anchor) {
       const rx = anchor.cx + anchor.eyeOffset;
       const y = anchor.eyeY;
       const r = 6;
+      const gw = 1.2 * sw;
       return [
-        `<circle cx="${lx}" cy="${y}" r="${r}" fill="none" stroke="${palette.ink}" stroke-width="1.2" />`,
-        `<circle cx="${rx}" cy="${y}" r="${r}" fill="none" stroke="${palette.ink}" stroke-width="1.2" />`,
-        `<line x1="${lx + r}" y1="${y}" x2="${rx - r}" y2="${y}" stroke="${palette.ink}" stroke-width="1.2" />`,
+        `<circle cx="${lx}" cy="${y}" r="${r}" fill="none" stroke="${palette.ink}" stroke-width="${gw}" />`,
+        `<circle cx="${rx}" cy="${y}" r="${r}" fill="none" stroke="${palette.ink}" stroke-width="${gw}" />`,
+        `<line x1="${lx + r}" y1="${y}" x2="${rx - r}" y2="${y}" stroke="${palette.ink}" stroke-width="${gw}" />`,
         // subtle lens fill
         `<circle cx="${lx}" cy="${y}" r="${r - 1}" fill="#FFFFFF" opacity="0.18" />`,
         `<circle cx="${rx}" cy="${y}" r="${r - 1}" fill="#FFFFFF" opacity="0.18" />`
@@ -463,6 +572,20 @@ function renderAccessory(id, palette, anchor) {
     case "mole": {
       return `<circle cx="${anchor.cx - anchor.cheekOffset * 0.6}" cy="${anchor.cheekY + 2}" r="0.9" fill="${palette.ink}" />`;
     }
+    case "earring": {
+      const ex = anchor.cheekOffset + 4;
+      const ey = anchor.cheekY + 4;
+      const lx = anchor.cx - ex;
+      const rx = anchor.cx + ex;
+      return [
+        // Left earring — small stud + drop
+        `<circle cx="${lx}" cy="${ey}" r="${1.1 * sw}" fill="${palette.accent}" stroke="${palette.ink}" stroke-width="${0.4 * sw}" />`,
+        `<ellipse cx="${lx}" cy="${ey + 3.2}" rx="${1.3 * sw}" ry="${2 * sw}" fill="${palette.accent}" stroke="${palette.ink}" stroke-width="${0.4 * sw}" />`,
+        // Right earring
+        `<circle cx="${rx}" cy="${ey}" r="${1.1 * sw}" fill="${palette.accent}" stroke="${palette.ink}" stroke-width="${0.4 * sw}" />`,
+        `<ellipse cx="${rx}" cy="${ey + 3.2}" rx="${1.3 * sw}" ry="${2 * sw}" fill="${palette.accent}" stroke="${palette.ink}" stroke-width="${0.4 * sw}" />`
+      ].join("");
+    }
   }
   function dot(cx, cy, color) {
     return `<circle cx="${cx}" cy="${cy}" r="0.85" fill="${color}" opacity="0.55" />`;
@@ -556,6 +679,84 @@ function renderTopper(id, anchor, palette) {
         `<path d="M${cx - 5} ${topY + 4} L${cx - 6} ${topY - 4} M${cx - 6} ${topY - 4} L${cx - 10} ${topY - 6} M${cx - 6} ${topY - 4} L${cx - 6} ${topY - 9} M${cx - 6} ${topY - 9} L${cx - 8} ${topY - 11} M${cx - 6} ${topY - 9} L${cx - 3} ${topY - 11}" stroke="${ink}" stroke-width="1.3" stroke-linecap="round" fill="none" />`,
         `<path d="M${cx + 5} ${topY + 4} L${cx + 6} ${topY - 4} M${cx + 6} ${topY - 4} L${cx + 10} ${topY - 6} M${cx + 6} ${topY - 4} L${cx + 6} ${topY - 9} M${cx + 6} ${topY - 9} L${cx + 8} ${topY - 11} M${cx + 6} ${topY - 9} L${cx + 3} ${topY - 11}" stroke="${ink}" stroke-width="1.3" stroke-linecap="round" fill="none" />`
       ].join("");
+    case "bob": {
+      const eyeY = anchor.eyeY;
+      const tt = topY - 4;
+      const bt = eyeY + 6;
+      return [
+        // Main hair cap — slightly asymmetric for soft look
+        `<path d="M${cx - 24} ${bt} Q${cx - 26} ${eyeY - 4} ${cx - 22} ${tt + 4} Q${cx - 14} ${tt - 2} ${cx} ${tt - 3} Q${cx + 14} ${tt - 2} ${cx + 22} ${tt + 4} Q${cx + 26} ${eyeY - 4} ${cx + 24} ${bt} Q${cx + 18} ${eyeY + 2} ${cx + 14} ${eyeY - 2} Q${cx} ${eyeY - 8} ${cx - 14} ${eyeY - 2} Q${cx - 18} ${eyeY + 2} ${cx - 24} ${bt} Z" fill="${ink}" opacity="0.92" />`,
+        // Subtle highlight strand
+        `<path d="M${cx - 14} ${tt + 4} Q${cx - 6} ${tt + 2} ${cx + 2} ${tt + 6}" stroke="${palette.accent}" stroke-width="0.6" fill="none" opacity="0.25" />`
+      ].join("");
+    }
+    case "bun": {
+      const baseY = topY + 4;
+      const bunY = topY - 8;
+      return [
+        // Hair base on crown
+        `<path d="M${cx - 16} ${baseY} Q${cx} ${topY - 4} ${cx + 16} ${baseY} Q${cx + 12} ${baseY - 4} ${cx} ${baseY - 6} Q${cx - 12} ${baseY - 4} ${cx - 16} ${baseY} Z" fill="${ink}" opacity="0.92" />`,
+        // Bun disc
+        `<ellipse cx="${cx}" cy="${bunY}" rx="6" ry="5" fill="${ink}" opacity="0.95" />`,
+        // Bun wrap detail
+        `<ellipse cx="${cx}" cy="${bunY - 0.5}" rx="3.5" ry="2.5" fill="none" stroke="${palette.accent}" stroke-width="0.4" opacity="0.4" />`
+      ].join("");
+    }
+    case "witchHat": {
+      const tipY = topY - 26;
+      const baseY = topY + 2;
+      return [
+        // Cone — slight curve, tilts right
+        `<path d="M${cx - 14} ${baseY} Q${cx - 4} ${baseY - 10} ${cx + 4} ${tipY} Q${cx + 2} ${baseY - 4} ${cx + 14} ${baseY} Z" fill="${ink}" opacity="0.96" />`,
+        // Brim — wide flat oval w/ slight curve
+        `<ellipse cx="${cx}" cy="${baseY + 2}" rx="22" ry="3.4" fill="${ink}" opacity="0.96" />`,
+        // Band across cone base
+        `<rect x="${cx - 14}" y="${baseY - 4}" width="28" height="3" fill="${palette.accent}" opacity="0.85" />`,
+        // Buckle
+        `<rect x="${cx - 2}" y="${baseY - 4}" width="4" height="3" fill="${palette.bodyFrom}" stroke="${ink}" stroke-width="0.4" />`,
+        // Star/moon sparkle near tip
+        `<circle cx="${cx + 2}" cy="${tipY + 6}" r="0.9" fill="${palette.accent}" opacity="0.9" />`
+      ].join("");
+    }
+    case "pumpkinStem": {
+      return [
+        // Main stem — slightly curved
+        `<path d="M${cx - 2} ${topY + 4} Q${cx} ${topY - 2} ${cx + 1} ${topY - 8} L${cx + 3} ${topY - 8} Q${cx + 4} ${topY} ${cx + 2} ${topY + 4} Z" fill="#3F6F2C" stroke="${ink}" stroke-width="0.5" />`,
+        // Leaf curling off
+        `<path d="M${cx + 3} ${topY - 4} Q${cx + 9} ${topY - 8} ${cx + 12} ${topY - 4} Q${cx + 8} ${topY - 2} ${cx + 3} ${topY - 2} Z" fill="#4A8035" stroke="${ink}" stroke-width="0.4" />`,
+        // Vein on leaf
+        `<path d="M${cx + 5} ${topY - 3} L${cx + 11} ${topY - 5}" stroke="#2D5020" stroke-width="0.4" />`
+      ].join("");
+    }
+    case "ghostSheet": {
+      return [
+        // Sheet cap — wider than body, hangs lower at sides
+        `<path d="M${cx - 22} ${topY + 8} Q${cx - 26} ${topY - 4} ${cx - 14} ${topY - 10} Q${cx} ${topY - 14} ${cx + 14} ${topY - 10} Q${cx + 26} ${topY - 4} ${cx + 22} ${topY + 8} Q${cx + 12} ${topY + 4} ${cx} ${topY + 6} Q${cx - 12} ${topY + 4} ${cx - 22} ${topY + 8} Z" fill="${palette.accent}" stroke="${ink}" stroke-width="0.6" opacity="0.9" />`,
+        // Fold shadows
+        `<path d="M${cx - 12} ${topY - 6} Q${cx - 10} ${topY - 2} ${cx - 14} ${topY + 4}" stroke="${ink}" stroke-width="0.45" fill="none" opacity="0.35" />`,
+        `<path d="M${cx + 12} ${topY - 6} Q${cx + 10} ${topY - 2} ${cx + 14} ${topY + 4}" stroke="${ink}" stroke-width="0.45" fill="none" opacity="0.35" />`
+      ].join("");
+    }
+    case "ponytail": {
+      const eyeY = anchor.eyeY;
+      const fh = eyeY - 7;
+      const crownY = topY;
+      const baseX = cx + 18;
+      const baseY = crownY + 6;
+      return [
+        // Sleek hair cap — narrower than bob, hugs the crown, soft hairline.
+        `<path d="M${cx - 22} ${fh} Q${cx - 24} ${crownY - 2} ${cx - 12} ${crownY - 4} L${cx + 14} ${crownY - 4} Q${cx + 24} ${crownY} ${cx + 22} ${fh} Q${cx + 10} ${fh - 1} ${cx} ${fh + 2} Q${cx - 10} ${fh - 1} ${cx - 22} ${fh} Z" fill="${ink}" opacity="0.94" />`,
+        // Subtle highlight sweeping back toward the tie
+        `<path d="M${cx - 12} ${crownY - 2} Q${cx} ${crownY - 3} ${baseX - 2} ${baseY - 2}" stroke="${palette.accent}" stroke-width="0.5" fill="none" opacity="0.3" />`,
+        // Ponytail tie — small ring where the hair gathers
+        `<ellipse cx="${baseX}" cy="${baseY}" rx="3" ry="2.4" fill="${ink}" opacity="0.95" />`,
+        `<ellipse cx="${baseX}" cy="${baseY}" rx="1.4" ry="1.1" fill="${palette.accent}" opacity="0.32" />`,
+        // Tail — long tapered strand curving down and slightly out
+        `<path d="M${baseX - 1} ${baseY + 2} Q${baseX + 5} ${baseY + 10} ${baseX + 8} ${baseY + 20} Q${baseX + 9} ${baseY + 28} ${baseX + 4} ${baseY + 30} Q${baseX + 1} ${baseY + 22} ${baseX - 3} ${baseY + 12} Z" fill="${ink}" opacity="0.92" />`,
+        // Inner highlight following the tail's flow direction
+        `<path d="M${baseX + 2} ${baseY + 6} Q${baseX + 5} ${baseY + 16} ${baseX + 6} ${baseY + 24}" stroke="${palette.accent}" stroke-width="0.5" fill="none" opacity="0.25" />`
+      ].join("");
+    }
   }
 }
 
@@ -626,6 +827,20 @@ function renderOutfit(id, anchor, palette) {
         `<circle cx="${cx}" cy="${cy + 7}" r="1.6" fill="${accent}" stroke="${ink}" stroke-width="0.5" />`,
         `<circle cx="${cx}" cy="${cy + 7}" r="0.7" fill="${palette.blush}" />`
       ].join("");
+    case "tie": {
+      const knotTop = cy - 3;
+      const knotBot = cy + 1;
+      return [
+        // Shirt-collar peek behind the tie (so tie reads as worn over a shirt)
+        `<path d="M${cx - 11} ${cy - 2} L${cx - 3} ${knotBot} L${cx + 3} ${knotBot} L${cx + 11} ${cy - 2} L${cx + 6} ${cy + 6} L${cx - 6} ${cy + 6} Z" fill="${accent}" stroke="${ink}" stroke-width="0.55" />`,
+        // Knot — small trapezoid centered
+        `<path d="M${cx - 3.2} ${knotTop} L${cx + 3.2} ${knotTop} L${cx + 2.4} ${knotBot} L${cx - 2.4} ${knotBot} Z" fill="${palette.bodyTo}" stroke="${ink}" stroke-width="0.5" />`,
+        // Blade — narrower at top, widens, then pointed tip at bottom
+        `<path d="M${cx - 2.4} ${knotBot} L${cx + 2.4} ${knotBot} L${cx + 3.4} ${cy + 6} L${cx + 2.8} ${cy + 12} L${cx} ${cy + 15} L${cx - 2.8} ${cy + 12} L${cx - 3.4} ${cy + 6} Z" fill="${palette.bodyTo}" stroke="${ink}" stroke-width="0.5" />`,
+        // Subtle highlight stripe down the blade
+        `<path d="M${cx} ${knotBot + 0.5} L${cx} ${cy + 13.5}" stroke="${ink}" stroke-width="0.35" opacity="0.35" />`
+      ].join("");
+    }
   }
 }
 
@@ -639,6 +854,9 @@ var BODY_IDS = [
   "dumpling",
   "taro",
   "wisp"
+  // NOTE: 'squircle' is intentionally NOT in the base pool — pack-only body so
+  // existing seeds keep their original picks (no determinism shift). Packs can
+  // opt-in via `picks.body: ['squircle']`.
 ];
 var EYE_IDS = [
   "round",
@@ -692,31 +910,550 @@ var TOPPER_IDS = [
   "antlers"
 ];
 
+// src/packs/office.ts
+var palettes = [
+  // Near-grayscale with cool blue undertone
+  { id: "office:graphite", bodyFrom: "#989BA2", bodyTo: "#696D72", accent: "#FFFFFF", ink: "#1A1C1F", blush: "#A09D99" },
+  // Warm stone — barely tinted neutral
+  { id: "office:stone", bodyFrom: "#A5A29D", bodyTo: "#74726F", accent: "#FFFFFF", ink: "#1C1B19", blush: "#A8A5A0" },
+  // Muted sage — barely-green grey
+  { id: "office:sage", bodyFrom: "#9EA299", bodyTo: "#6F726B", accent: "#FFFFFF", ink: "#1B1D19", blush: "#A3A099" },
+  // Taupe — desaturated warm grey
+  { id: "office:taupe", bodyFrom: "#ACA098", bodyTo: "#78716C", accent: "#FFFFFF", ink: "#1E1B18", blush: "#AFA59C" },
+  // Cool slate — neutral grey with hint of blue
+  { id: "office:slate", bodyFrom: "#9DA2AA", bodyTo: "#6C7077", accent: "#FFFFFF", ink: "#1A1C20", blush: "#A0A2A6" }
+];
+var officePack = {
+  id: "office",
+  name: "Office",
+  description: "Corporate ID-badge. Flat, muted, square silhouette. Mix of professional outfits + hairstyles.",
+  emoji: "\u{1F4BC}",
+  palettes,
+  paletteExclusive: true,
+  flat: true,
+  bgColor: "#FFFFFF",
+  featureStroke: 1.35,
+  picks: {
+    body: ["squircle"],
+    eyes: ["dot", "sleepy", "squint"],
+    mouth: ["flat", "dot"],
+    antenna: ["none"],
+    // Gender + style variety comes from accessory + outfit mix, NOT hair toppers
+    // (hair rendered as solid silhouettes reads as helmets at small sizes).
+    accessory: ["none", "glasses", "mole", "freckles", "earring", "earring"],
+    topper: ["none"],
+    background: ["solid"],
+    // Outfit mix — tie reads masc, necklace/bowtie/collar neutral-or-femme. No scarf (too bulky).
+    outfit: ["tie", "necklace", "collar", "bowtie"]
+  },
+  styleHints: {
+    masc: {
+      outfit: ["tie", "bowtie"],
+      accessory: ["none", "glasses", "mole", "freckles"]
+    },
+    femme: {
+      outfit: ["necklace"],
+      accessory: ["earring", "glasses", "mole"]
+    },
+    neutral: {
+      outfit: ["collar", "bowtie", "necklace"],
+      accessory: ["none", "glasses", "freckles"]
+    }
+  }
+};
+
+// src/packs/office-bright.ts
+var palettes2 = [
+  // Cobalt — vibrant deep blue
+  { id: "office-bright:cobalt", bodyFrom: "#4F8DFF", bodyTo: "#1E40AF", accent: "#FFFFFF", ink: "#0A1638", blush: "#7BA7FF" },
+  // Emerald — vivid green
+  { id: "office-bright:emerald", bodyFrom: "#3CCB85", bodyTo: "#047857", accent: "#FFFFFF", ink: "#062418", blush: "#76DAA8" },
+  // Fuchsia — hot magenta-pink
+  { id: "office-bright:fuchsia", bodyFrom: "#F0529C", bodyTo: "#BE185D", accent: "#FFFFFF", ink: "#3A0820", blush: "#F58FBC" },
+  // Amber — vivid orange-yellow
+  { id: "office-bright:amber", bodyFrom: "#FFB347", bodyTo: "#C2700B", accent: "#FFFFFF", ink: "#3B1F03", blush: "#FFC97A" },
+  // Violet — saturated purple
+  { id: "office-bright:violet", bodyFrom: "#9F7AEA", bodyTo: "#6D28D9", accent: "#FFFFFF", ink: "#1A0A3A", blush: "#BFA0F0" }
+];
+var officeBrightPack = {
+  id: "office-bright",
+  name: "Office Bright",
+  description: "Vivid corporate variant of Office. Saturated brand-style palettes, same flat ID-badge composition.",
+  emoji: "\u{1F3A8}",
+  palettes: palettes2,
+  paletteExclusive: true,
+  flat: true,
+  bgColor: "#FFFFFF",
+  featureStroke: 1.35,
+  picks: {
+    body: ["squircle"],
+    eyes: ["dot", "sleepy", "squint"],
+    mouth: ["flat", "dot"],
+    antenna: ["none"],
+    accessory: ["none", "glasses", "mole", "freckles", "earring", "earring"],
+    topper: ["none"],
+    background: ["solid"],
+    outfit: ["tie", "necklace", "collar", "bowtie"]
+  },
+  styleHints: {
+    masc: {
+      outfit: ["tie", "bowtie"],
+      accessory: ["none", "glasses", "mole", "freckles"]
+    },
+    femme: {
+      outfit: ["necklace"],
+      accessory: ["earring", "glasses", "mole"]
+    },
+    neutral: {
+      outfit: ["collar", "bowtie", "necklace"],
+      accessory: ["none", "glasses", "freckles"]
+    }
+  }
+};
+
+// src/packs/halloween.ts
+var palettes3 = [
+  // Vivid pumpkin orange — high saturation against dark plate
+  { id: "halloween:pumpkin", bodyFrom: "#FF8C2A", bodyTo: "#D85A00", accent: "#FFE9C4", ink: "#1A0700", blush: "#FFA76A" },
+  // Electric witch purple
+  { id: "halloween:witch", bodyFrom: "#B266FF", bodyTo: "#6A1FB8", accent: "#F0D9FF", ink: "#0E031F", blush: "#D6A0FF" },
+  // Acid slime — radioactive Halloween green
+  { id: "halloween:slime", bodyFrom: "#B3F23A", bodyTo: "#5E9F00", accent: "#E8FFB8", ink: "#091300", blush: "#D8FF7C" },
+  // Blood crimson — deep saturated red
+  { id: "halloween:blood", bodyFrom: "#E83248", bodyTo: "#8E0014", accent: "#FFD6DA", ink: "#1F0004", blush: "#FF8A98" },
+  // Bone — pale warm white, ghost-like
+  { id: "halloween:bone", bodyFrom: "#F5EEDB", bodyTo: "#C8B89A", accent: "#FFFEF5", ink: "#1A1612", blush: "#E8D9B8" }
+];
+var halloweenPack = {
+  id: "halloween",
+  name: "Halloween",
+  description: "Spooky themed pack. Pumpkin/ghost/skull bodies, jagged grins, witch hats, dark night plate.",
+  emoji: "\u{1F383}",
+  palettes: palettes3,
+  paletteExclusive: true,
+  flat: true,
+  bgColor: "#0E0A1A",
+  // deep night-purple
+  featureStroke: 1.4,
+  picks: {
+    body: ["pumpkin", "ghost", "skullHead"],
+    eyes: ["cross", "dot", "sleepy", "wide"],
+    mouth: ["jagged", "fangs", "flat", "dot"],
+    antenna: ["none"],
+    accessory: ["none", "sparkle", "eyepatch", "mole"],
+    topper: ["none", "witchHat", "pumpkinStem", "ghostSheet", "horns", "antlers"],
+    background: ["solid"],
+    outfit: ["none", "collar", "scarf"]
+  },
+  styleHints: {
+    // 'masc' → creepy / skeletal vibe
+    masc: {
+      outfit: ["none", "collar"],
+      accessory: ["none", "eyepatch"],
+      topper: ["horns", "antlers", "witchHat"]
+    },
+    // 'femme' → witchy / sparkly vibe
+    femme: {
+      outfit: ["none", "scarf"],
+      accessory: ["sparkle", "mole"],
+      topper: ["witchHat", "ghostSheet", "pumpkinStem"]
+    },
+    // 'neutral' → balanced classic Halloween — pumpkin or none topper
+    neutral: {
+      outfit: ["none"],
+      accessory: ["none", "sparkle"],
+      topper: ["none", "witchHat", "pumpkinStem"]
+    }
+  }
+};
+
+// src/packs/pastel.ts
+var palettes4 = [
+  // Cotton candy — soft pink, the most kawaii signal
+  { id: "pastel:cotton-candy", bodyFrom: "#FFB4D4", bodyTo: "#FF7AAB", accent: "#FFF0F6", ink: "#5E1C40", blush: "#FFC6DC" },
+  // Butter — warm pastel yellow
+  { id: "pastel:butter", bodyFrom: "#FFE07F", bodyTo: "#E6B12E", accent: "#FFFBE6", ink: "#5C4810", blush: "#FFE5A0" },
+  // Mint cream — soft green
+  { id: "pastel:mint-cream", bodyFrom: "#A8E9C8", bodyTo: "#5BC499", accent: "#EFFEF5", ink: "#194433", blush: "#C2EED4" },
+  // Lavender — gentle purple
+  { id: "pastel:lavender", bodyFrom: "#C8B5F0", bodyTo: "#9275D4", accent: "#F6F0FE", ink: "#321F58", blush: "#D8C6F0" },
+  // Peach bloom — warm coral peach
+  { id: "pastel:peach-bloom", bodyFrom: "#FFC1A0", bodyTo: "#F08F6A", accent: "#FFF1E8", ink: "#6E2F12", blush: "#FFC6AC" },
+  // Sky drop — pastel baby blue
+  { id: "pastel:sky-drop", bodyFrom: "#A8D9F5", bodyTo: "#6BB1E0", accent: "#EFF8FE", ink: "#15324A", blush: "#BCDDF0" }
+];
+var pastelPack = {
+  id: "pastel",
+  name: "Pastel",
+  description: "Kawaii cozy companion. Round chubby bodies, big eyes, blushy cheeks, soft cream plate. Finch-like.",
+  emoji: "\u{1F338}",
+  palettes: palettes4,
+  paletteExclusive: true,
+  flat: true,
+  bgColor: "#FBF6F0",
+  // warm cream plate
+  featureStroke: 1.3,
+  picks: {
+    body: ["dumpling", "orb", "pebble"],
+    // Big expressive eyes — wide/round read as kawaii, sleepy/wink soften it.
+    // Drop oval (too anime) + cross (too aggressive) for cohesion.
+    eyes: ["round", "wide", "sleepy", "wink", "heart", "star"],
+    // Tiny mouths — smile/dot/tongue. No grin/awe (too loud).
+    mouth: ["smile", "dot", "tongue", "smirk"],
+    antenna: ["none", "classic", "curl"],
+    // Blush weighted heavy — every pastel avatar gets blushy by default
+    accessory: ["blush", "blush", "blush", "freckles", "sparkle", "none"],
+    // Round ears / headband / halo / tuft give character variety
+    topper: ["none", "roundEars", "ears", "headband", "halo", "tuft"],
+    background: ["solid"],
+    // Outfit stays minimal — collar gives "shirt" peek
+    outfit: ["none", "collar", "sunflower", "necklace"]
+  },
+  styleHints: {
+    // 'masc' → softer kawaii: minimal toppers, dot/sleepy eyes
+    masc: {
+      eyes: ["round", "sleepy", "wink"],
+      accessory: ["blush", "freckles", "none"],
+      topper: ["none", "tuft", "cap"],
+      outfit: ["none", "collar"]
+    },
+    // 'femme' → full kawaii: heart/star eyes, ears+halo, sparkles
+    femme: {
+      eyes: ["heart", "star", "wide"],
+      accessory: ["blush", "sparkle"],
+      topper: ["roundEars", "ears", "halo", "headband"],
+      outfit: ["none", "sunflower", "necklace"]
+    },
+    // 'neutral' → balanced
+    neutral: {
+      eyes: ["round", "wide", "sleepy"],
+      accessory: ["blush", "freckles"],
+      topper: ["none", "roundEars", "tuft"],
+      outfit: ["none", "collar"]
+    }
+  }
+};
+
+// src/packs/neon.ts
+var palettes5 = [
+  // Hot pink — synthwave signature
+  { id: "neon:pink", bodyFrom: "#FF6FD8", bodyTo: "#D6168C", accent: "#FFE5F5", ink: "#1F0214", blush: "#FFB3DD" },
+  // Acid lime — radioactive green
+  { id: "neon:lime", bodyFrom: "#D9FF3D", bodyTo: "#5FB800", accent: "#F5FFD0", ink: "#0F1500", blush: "#E5FF8A" },
+  // Electric cyan — Tron blue
+  { id: "neon:cyan", bodyFrom: "#4DEFFF", bodyTo: "#0099C9", accent: "#D6FBFF", ink: "#00141C", blush: "#A5EEFA" },
+  // Sodium — bright street-lamp yellow-orange
+  { id: "neon:sodium", bodyFrom: "#FFEC4D", bodyTo: "#E59700", accent: "#FFFADB", ink: "#221400", blush: "#FFE082" },
+  // Magenta violet — saturated purple
+  { id: "neon:violet", bodyFrom: "#C66DFF", bodyTo: "#6B14D6", accent: "#EFDDFF", ink: "#0F0024", blush: "#D8B0FF" },
+  // Plasma orange-red — fiery
+  { id: "neon:plasma", bodyFrom: "#FF6A3D", bodyTo: "#C42500", accent: "#FFD9CC", ink: "#1F0500", blush: "#FFA98A" }
+];
+var neonPack = {
+  id: "neon",
+  name: "Neon",
+  description: "Cyberpunk gaming PFP. Vivid neon bodies on a dark plate with soft glow halo. Sharp + intense.",
+  emoji: "\u26A1",
+  palettes: palettes5,
+  paletteExclusive: true,
+  flat: true,
+  bgColor: "#0A0A14",
+  // deep night plate
+  featureStroke: 1.5,
+  glow: true,
+  picks: {
+    body: ["tall", "wisp", "taro"],
+    eyes: ["star", "wide", "cross", "dot"],
+    mouth: ["grin", "awe", "tooth", "smirk"],
+    antenna: ["spike", "double", "none"],
+    accessory: ["sparkle", "glasses", "eyepatch", "none"],
+    topper: ["none", "antlers", "horn", "horns", "tuft", "cap"],
+    background: ["solid"],
+    outfit: ["none", "scarf", "necklace"]
+  },
+  styleHints: {
+    // 'masc' → aggressive: cross eyes, horns, spike antenna, eyepatch
+    masc: {
+      accessory: ["eyepatch", "glasses", "none"],
+      topper: ["horns", "horn", "antlers"],
+      outfit: ["none"]
+    },
+    // 'femme' → glamour: sparkle, halo, soft tuft
+    femme: {
+      accessory: ["sparkle", "glasses"],
+      topper: ["tuft", "halo"],
+      outfit: ["necklace", "scarf", "none"]
+    },
+    // 'neutral' → balanced edgy
+    neutral: {
+      accessory: ["glasses", "sparkle", "none"],
+      topper: ["none", "cap", "tuft"],
+      outfit: ["none"]
+    }
+  }
+};
+
+// src/packs/mono.ts
+var palettes6 = [
+  // Obsidian — near-black body, WHITE face features for contrast
+  { id: "mono:obsidian", bodyFrom: "#2A2A2A", bodyTo: "#0A0A0A", accent: "#FAFAFA", ink: "#F2F2F2", blush: "#5A5A5A" },
+  // Graphite — dark warm grey body, light face
+  { id: "mono:graphite", bodyFrom: "#4A4A4A", bodyTo: "#222222", accent: "#F4F4F4", ink: "#EBEBEB", blush: "#7A7A7A" },
+  // Slate — mid-grey body, dark face (good contrast either way; going dark for editorial)
+  { id: "mono:slate", bodyFrom: "#8E8E8E", bodyTo: "#5A5A5A", accent: "#F8F8F8", ink: "#0A0A0A", blush: "#A8A8A8" },
+  // Silver — mid-light grey, dark face
+  { id: "mono:silver", bodyFrom: "#B8B8B8", bodyTo: "#888888", accent: "#FCFCFC", ink: "#1A1A1A", blush: "#D0D0D0" },
+  // Fog — palest grey, dark face
+  { id: "mono:fog", bodyFrom: "#E0E0E0", bodyTo: "#B0B0B0", accent: "#FFFFFF", ink: "#2A2A2A", blush: "#EDEDED" },
+  // Ash — warm sand-grey, dark face with brown hint
+  { id: "mono:ash", bodyFrom: "#A39A8E", bodyTo: "#6A6055", accent: "#F8F4EF", ink: "#1A1612", blush: "#B8AFA5" }
+];
+var monoPack = {
+  id: "mono",
+  name: "Mono",
+  description: "Editorial minimal. Clean grayscale silhouette on warm white plate, thin lines, no decoration.",
+  emoji: "\u{1F5A4}",
+  palettes: palettes6,
+  paletteExclusive: true,
+  flat: true,
+  bgColor: "#FAFAF8",
+  // warm near-white plate
+  featureStroke: 1.15,
+  // subtle but visible (vs Office 1.35, Neon 1.5)
+  picks: {
+    body: ["squircle"],
+    eyes: ["dot"],
+    mouth: ["flat", "dot"],
+    antenna: ["none"],
+    accessory: ["none", "none", "mole", "glasses", "freckles"],
+    topper: ["none"],
+    background: ["solid"],
+    outfit: ["none"]
+  },
+  styleHints: {
+    // 'masc' → bare silhouette, nothing
+    masc: {
+      accessory: ["none"],
+      outfit: ["none"],
+      topper: ["none"]
+    },
+    // 'femme' → one subtle accent (mole or freckles)
+    femme: {
+      accessory: ["mole", "freckles"],
+      outfit: ["none"],
+      topper: ["none"]
+    },
+    // 'neutral' → glasses option
+    neutral: {
+      accessory: ["none", "glasses"],
+      outfit: ["none"],
+      topper: ["none"]
+    }
+  }
+};
+
+// src/packs/earth.ts
+var palettes7 = [
+  // Sage — calm soft green
+  { id: "earth:sage", bodyFrom: "#A8C49A", bodyTo: "#6D8E60", accent: "#F2F7EA", ink: "#1F2E18", blush: "#C8D7B4" },
+  // Clay — terracotta warmth
+  { id: "earth:clay", bodyFrom: "#D49072", bodyTo: "#9C4F2E", accent: "#FBEBDD", ink: "#3D1A0B", blush: "#E5BCA5" },
+  // Sand — warm beige
+  { id: "earth:sand", bodyFrom: "#E1CC9F", bodyTo: "#A88B5A", accent: "#FFF5E0", ink: "#4A3818", blush: "#EBD8B0" },
+  // Moss — deeper forest green
+  { id: "earth:moss", bodyFrom: "#82A570", bodyTo: "#3F6038", accent: "#EAF4DC", ink: "#0D1F08", blush: "#B9D2A1" },
+  // Terracotta — fiery clay, more saturated
+  { id: "earth:terracotta", bodyFrom: "#D87555", bodyTo: "#A53F22", accent: "#FFE5D8", ink: "#380F02", blush: "#EBA188" },
+  // Mushroom — warm dusty mauve-brown
+  { id: "earth:mushroom", bodyFrom: "#B59B8A", bodyTo: "#7D6353", accent: "#F4ECE3", ink: "#2C1C13", blush: "#C6B0A0" }
+];
+var earthPack = {
+  id: "earth",
+  name: "Earth",
+  description: "Wellness companion. Warm earthy palettes, soft round body, sleepy meditative face, leaf + halo toppers.",
+  emoji: "\u{1F33F}",
+  palettes: palettes7,
+  paletteExclusive: true,
+  flat: true,
+  bgColor: "#FBF6EE",
+  // warm cream plate
+  featureStroke: 1.2,
+  picks: {
+    body: ["orb", "dumpling", "pebble"],
+    eyes: ["sleepy", "sleepy", "dot"],
+    mouth: ["smile", "dot", "flat"],
+    antenna: ["none"],
+    accessory: ["blush", "blush", "freckles", "mole", "sparkle", "none"],
+    topper: ["none", "leaf", "halo", "headband", "tuft"],
+    background: ["solid"],
+    outfit: ["none", "collar", "scarf", "necklace"]
+  },
+  styleHints: {
+    // 'masc' → minimal earth: dot eyes, no topper, no accessory
+    masc: {
+      accessory: ["none", "freckles", "mole"],
+      topper: ["none", "tuft"],
+      outfit: ["none", "collar"]
+    },
+    // 'femme' → wellness teacher: sleepy + leaf/halo + blush + sparkle
+    femme: {
+      accessory: ["blush", "sparkle"],
+      topper: ["leaf", "halo", "headband"],
+      outfit: ["none", "scarf", "necklace"]
+    },
+    // 'neutral' → balanced calm
+    neutral: {
+      accessory: ["blush", "freckles"],
+      topper: ["none", "leaf", "tuft"],
+      outfit: ["none", "collar"]
+    }
+  }
+};
+
+// src/packs/index.ts
+var BUILT_IN_PACKS = [
+  officePack,
+  officeBrightPack,
+  halloweenPack,
+  pastelPack,
+  neonPack,
+  monoPack,
+  earthPack
+];
+var PACK_REGISTRY = Object.fromEntries(
+  BUILT_IN_PACKS.map((p) => [p.id, p])
+);
+function resolvePacks(ids) {
+  if (!ids || ids.length === 0) return [];
+  const seen = /* @__PURE__ */ new Set();
+  const result = [];
+  for (const id of ids) {
+    if (seen.has(id)) continue;
+    const pack = PACK_REGISTRY[id];
+    if (pack) {
+      seen.add(id);
+      result.push(pack);
+    }
+  }
+  return result;
+}
+
 // src/select.ts
+function applyStyleHint(pool, packs, hint, partKey) {
+  for (const pack of packs) {
+    const subset = pack.styleHints?.[hint]?.[partKey];
+    if (subset && subset.length > 0) {
+      const narrowed = pool.filter((id) => subset.includes(id));
+      if (narrowed.length > 0) return narrowed;
+    }
+  }
+  return pool;
+}
+function resolvePartPool(basePool, packs, partKey) {
+  const constraints = packs.map((p) => p.picks?.[partKey]).filter((list) => Array.isArray(list) && list.length > 0);
+  if (constraints.length === 0) return basePool;
+  let pool = constraints[0];
+  for (let i = 1; i < constraints.length; i++) {
+    pool = pool.filter((id) => constraints[i].includes(id));
+  }
+  if (pool.length > 0) return pool;
+  const seen = /* @__PURE__ */ new Set();
+  const union = [];
+  for (const list of constraints) {
+    for (const id of list) {
+      if (!seen.has(id)) {
+        seen.add(id);
+        union.push(id);
+      }
+    }
+  }
+  return union.length > 0 ? union : basePool;
+}
 function selectAvatar(seed2, options = {}) {
   const rng = createRng(seed2);
-  const paletteOverride = options.paletteId ? PALETTE_BY_ID[options.paletteId] : void 0;
-  const palette = paletteOverride ?? rng.pick(PALETTES);
-  const body = rng.pick(BODY_IDS);
-  const eyes = rng.pick(EYE_IDS);
-  const mouth = rng.pick(MOUTH_IDS);
-  const antenna = rng.pick(ANTENNA_IDS);
-  const accessory = rng.pick(ACCESSORY_IDS);
+  const enabledPacks = resolvePacks(options.packs);
+  const packPalettes = [];
+  let exclusivePackPalettes = null;
+  for (const pack of enabledPacks) {
+    if (pack.palettes && pack.palettes.length > 0) {
+      packPalettes.push(...pack.palettes);
+      if (pack.paletteExclusive) {
+        exclusivePackPalettes = exclusivePackPalettes ?? [];
+        exclusivePackPalettes.push(...pack.palettes);
+      }
+    }
+  }
+  const palettePool = exclusivePackPalettes ? exclusivePackPalettes : packPalettes.length > 0 ? [...PALETTES, ...packPalettes] : PALETTES;
+  const paletteByIdLookup = options.paletteId ? PALETTE_BY_ID[options.paletteId] ?? packPalettes.find((p) => p.id === options.paletteId) : void 0;
+  const paletteOverride = options.palette ?? paletteByIdLookup;
+  const palette = paletteOverride ?? rng.pick(palettePool);
+  const bodyPool = resolvePartPool(BODY_IDS, enabledPacks, "body");
+  const eyesPool = resolvePartPool(EYE_IDS, enabledPacks, "eyes");
+  const mouthPool = resolvePartPool(MOUTH_IDS, enabledPacks, "mouth");
+  const antennaPool = resolvePartPool(ANTENNA_IDS, enabledPacks, "antenna");
+  let accessoryPool = resolvePartPool(ACCESSORY_IDS, enabledPacks, "accessory");
+  const backgroundPool = resolvePartPool(BACKGROUND_IDS, enabledPacks, "background");
+  let topperPool = resolvePartPool(TOPPER_IDS, enabledPacks, "topper");
+  const styleHint = options.style;
+  if (styleHint) {
+    accessoryPool = applyStyleHint(accessoryPool, enabledPacks, styleHint, "accessory");
+    topperPool = applyStyleHint(topperPool, enabledPacks, styleHint, "topper");
+  }
+  const body = rng.pick(bodyPool);
+  const eyes = rng.pick(eyesPool);
+  const mouth = rng.pick(mouthPool);
+  const antenna = rng.pick(antennaPool);
+  const accessory = rng.pick(accessoryPool);
   let background;
   if (typeof options.background === "string") {
     background = options.background;
   } else if (options.background && typeof options.background === "object") {
     background = "solid";
   } else {
-    background = rng.pick(BACKGROUND_IDS);
+    background = rng.pick(backgroundPool);
   }
-  const topperRaw = rng.pick(TOPPER_IDS);
+  const topperRaw = rng.pick(topperPool);
   const topper = antenna !== "none" && topperRaw !== "none" && topperRaw !== "leaf" ? "none" : topperRaw;
   const hueShift = Math.round(rng.range(-30, 30));
   const bodyScale = Number(rng.range(0.92, 1.08).toFixed(3));
   const eyeGapShift = Number(rng.range(-2, 2).toFixed(2));
   const mouthCurveScale = Number(rng.range(0.85, 1.15).toFixed(3));
   const antennaTilt = Math.round(rng.range(-8, 8));
+  const outfitConstraints = enabledPacks.map((p) => p.picks?.outfit).filter((list) => Array.isArray(list) && list.length > 0);
+  let outfit = "none";
+  if (outfitConstraints.length > 0) {
+    let pool = outfitConstraints[0];
+    for (let i = 1; i < outfitConstraints.length; i++) {
+      pool = pool.filter((id) => outfitConstraints[i].includes(id));
+    }
+    if (pool.length === 0) {
+      const seen = /* @__PURE__ */ new Set();
+      const union = [];
+      for (const list of outfitConstraints) {
+        for (const id of list) {
+          if (!seen.has(id)) {
+            seen.add(id);
+            union.push(id);
+          }
+        }
+      }
+      pool = union;
+    }
+    if (styleHint) {
+      pool = applyStyleHint(pool, enabledPacks, styleHint, "outfit");
+    }
+    outfit = pool.length > 0 ? rng.pick(pool) : "none";
+  }
+  let flat;
+  let bgColor;
+  let featureStroke;
+  let glow;
+  for (const pack of enabledPacks) {
+    if (pack.flat) flat = true;
+    if (pack.bgColor) bgColor = pack.bgColor;
+    if (pack.featureStroke) featureStroke = pack.featureStroke;
+    if (pack.glow) glow = true;
+  }
   return {
     seed: seed2,
     palette,
@@ -727,12 +1464,16 @@ function selectAvatar(seed2, options = {}) {
     accessory,
     background,
     topper,
-    outfit: "none",
+    outfit,
     hueShift,
     bodyScale,
     eyeGapShift,
     mouthCurveScale,
-    antennaTilt
+    antennaTilt,
+    ...flat ? { flat: true } : {},
+    ...bgColor ? { bgColor } : {},
+    ...featureStroke ? { featureStroke } : {},
+    ...glow ? { glow: true } : {}
   };
 }
 
@@ -802,31 +1543,42 @@ function renderAvatarInner(spec, options = {}) {
     ...baseAnchor,
     eyeOffset: baseAnchor.eyeOffset + (spec.eyeGapShift ?? 0)
   };
+  const strokeMul = spec.featureStroke ?? 1;
   const antennaSvg = renderAntenna(spec.antenna, anchor, spec.palette);
-  const accessorySvg = renderAccessory(spec.accessory, spec.palette, anchor);
-  const bodyMarkup = renderBody(spec.body, spec.palette, gradId);
-  const bodyTransform = transformBody(spec.bodyScale ?? 1, anchor);
+  const accessorySvg = renderAccessory(spec.accessory, spec.palette, anchor, { strokeMul });
+  const flat = spec.flat === true;
+  const glow = spec.glow === true;
+  const glowId = `navii-glow-${id}`;
+  const bodyMarkup = renderBody(spec.body, spec.palette, gradId, { flat });
+  const effectiveBodyScale = flat ? 1 : spec.bodyScale ?? 1;
+  const bodyTransform = transformBody(effectiveBodyScale, anchor);
   const bodyFilter = spec.hueShift && spec.hueShift !== 0 ? ` filter="url(#${hueId})"` : "";
   const bodyWrapped = `<g${bodyTransform}${bodyFilter}><g class="body">${bodyMarkup}</g></g>`;
+  const glowLayer = glow ? `<g${bodyTransform} filter="url(#${glowId})" opacity="0.85"><g class="body-glow">${bodyMarkup.replace(/fill="url\(#[^"]+\)"/g, `fill="${spec.palette.bodyFrom}"`)}</g></g>` : "";
   const antennaWrapped = antennaSvg ? `<g${transformAntenna(spec.antennaTilt ?? 0, anchor)}><g class="antenna">${antennaSvg}</g></g>` : "";
   const tileBg = resolveTileBg(options.tileBg, spec.palette);
   const tileCircle = tileBg ? `<circle cx="50" cy="50" r="50" fill="${tileBg}" />` : "";
   const outfitSvg = renderOutfit(spec.outfit ?? "none", anchor, spec.palette);
+  const packPlate = spec.bgColor ? `<rect x="0" y="0" width="100" height="100" fill="${spec.bgColor}" />` : "";
+  const backgroundMarkup = spec.bgColor ? "" : renderBackground(spec.background, spec.palette, bgOverride);
   const parts = [
     tileCircle,
-    renderBackground(spec.background, spec.palette, bgOverride),
+    packPlate,
+    backgroundMarkup,
+    glowLayer,
     bodyWrapped,
     // outfit sits on the body but below the face, so face features stay readable
     outfitSvg,
     renderTopper(spec.topper, anchor, spec.palette),
-    wrap("eyes", renderEyes(spec.eyes, spec.palette, anchor)),
-    renderMouth(spec.mouth, spec.palette, anchor, spec.mouthCurveScale ?? 1),
+    wrap("eyes", renderEyes(spec.eyes, spec.palette, anchor, { strokeMul })),
+    renderMouth(spec.mouth, spec.palette, anchor, spec.mouthCurveScale ?? 1, { strokeMul }),
     antennaWrapped,
     accessorySvg && spec.accessory === "sparkle" ? wrap("sparkle", accessorySvg) : accessorySvg
   ].join("");
   const defs = [
-    renderBodyDefs(spec.body, spec.palette, gradId),
-    spec.hueShift && spec.hueShift !== 0 ? `<filter id="${hueId}" color-interpolation-filters="sRGB"><feColorMatrix type="hueRotate" values="${spec.hueShift}" /></filter>` : ""
+    renderBodyDefs(spec.body, spec.palette, gradId, { flat }),
+    spec.hueShift && spec.hueShift !== 0 ? `<filter id="${hueId}" color-interpolation-filters="sRGB"><feColorMatrix type="hueRotate" values="${spec.hueShift}" /></filter>` : "",
+    glow ? `<filter id="${glowId}" x="-30%" y="-30%" width="160%" height="160%"><feGaussianBlur stdDeviation="4" /></filter>` : ""
   ].join("");
   return [
     `<defs>${defs}</defs>`,
@@ -950,8 +1702,18 @@ function createAvatar(seed2, options = {}) {
   }
   return renderAvatar(selectAvatar(seed2, options), options);
 }
+function random(options = {}) {
+  const seed2 = randomSeed();
+  return { svg: createAvatar(seed2, options), seed: seed2 };
+}
+function randomSeed() {
+  const c = globalThis.crypto;
+  if (c && typeof c.randomUUID === "function") return c.randomUUID();
+  return Math.random().toString(36).slice(2) + Math.random().toString(36).slice(2);
+}
 var Navii = {
   create: createAvatar,
+  random,
   render: renderAvatar,
   select: selectAvatar,
   group: renderGroup,
@@ -959,14 +1721,18 @@ var Navii = {
   build
 };
 
+exports.BUILT_IN_PACKS = BUILT_IN_PACKS;
 exports.Navii = Navii;
+exports.PACK_REGISTRY = PACK_REGISTRY;
 exports.build = build;
 exports.createAvatar = createAvatar;
 exports.createRng = createRng;
 exports.cyrb53 = cyrb53;
+exports.random = random;
 exports.renderAvatar = renderAvatar;
 exports.renderAvatarInner = renderAvatarInner;
 exports.renderGroup = renderGroup;
+exports.resolvePacks = resolvePacks;
 exports.seed = seed;
 exports.selectAvatar = selectAvatar;
 //# sourceMappingURL=index.cjs.map