@quilltap/theme-storybook 1.0.29 → 1.0.31

package/dist/{chunk-TZN7AU3N.mjs → chunk-C4SJNVAC.mjs}

@@ -769,7 +769,7 @@ var Badges = () => {
       /* @__PURE__ */ jsx7("h3", { style: { fontSize: "1.125rem", fontWeight: 700, marginBottom: "1rem", borderBottom: "1px solid var(--color-border)", paddingBottom: "0.5rem" }, children: "Entity Type Badges" }),
       /* @__PURE__ */ jsxs7("div", { style: { display: "flex", flexWrap: "wrap", gap: "0.75rem", alignItems: "center" }, children: [
         /* @__PURE__ */ jsx7("span", { className: "qt-badge qt-badge-character", children: "Character" }),
-        /* @__PURE__ */ jsx7("span", { className: "qt-badge qt-badge-persona", children: "Persona" }),
+        /* @__PURE__ */ jsx7("span", { className: "qt-badge qt-badge-user-character", children: "User Character" }),
         /* @__PURE__ */ jsx7("span", { className: "qt-badge qt-badge-chat", children: "Chat" }),
         /* @__PURE__ */ jsx7("span", { className: "qt-badge qt-badge-tag", children: "Tag" }),
         /* @__PURE__ */ jsx7("span", { className: "qt-badge qt-badge-memory", children: "Memory" })
@@ -1289,6 +1289,33 @@ var Chat = () => {
         ] }) })
       ] })
     ] }),
+    /* @__PURE__ */ jsxs11("section", { style: { marginBottom: "2rem" }, children: [
+      /* @__PURE__ */ jsx11("h3", { style: { fontSize: "1.125rem", fontWeight: 700, marginBottom: "1rem", borderBottom: "1px solid var(--color-border)", paddingBottom: "0.5rem" }, children: "Wardrobe Action Notices" }),
+      /* @__PURE__ */ jsx11("p", { style: { color: "var(--color-muted-foreground)", marginBottom: "1rem" }, children: "Inline summaries of outfit changes (equip, unequip, gift). Distinguished from whispers (dashed purple) and silent messages (dotted teal) by a double border and warm amber/gold tones." }),
+      /* @__PURE__ */ jsxs11("div", { style: { display: "flex", flexDirection: "column", gap: "1rem", maxWidth: "32rem" }, children: [
+        /* @__PURE__ */ jsxs11("div", { className: "qt-chat-wardrobe-notice", children: [
+          /* @__PURE__ */ jsx11("div", { className: "qt-chat-wardrobe-label", children: "Wardrobe" }),
+          /* @__PURE__ */ jsxs11("div", { className: "qt-chat-wardrobe-summary", children: [
+            /* @__PURE__ */ jsx11("div", { children: "Equipped \u201CCrimson Evening Gown\u201D in the top slot." }),
+            /* @__PURE__ */ jsx11("div", { children: "Wearing: Crimson Evening Gown (top, bottom), Glass Slippers (footwear)" })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs11("div", { className: "qt-chat-wardrobe-notice", children: [
+          /* @__PURE__ */ jsx11("div", { className: "qt-chat-wardrobe-label", children: "Wardrobe" }),
+          /* @__PURE__ */ jsxs11("div", { className: "qt-chat-wardrobe-summary", children: [
+            /* @__PURE__ */ jsx11("div", { children: "Removed item from the footwear slot." }),
+            /* @__PURE__ */ jsx11("div", { children: "Wearing: Crimson Evening Gown (top, bottom), barefoot" })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs11("div", { className: "qt-chat-wardrobe-notice", children: [
+          /* @__PURE__ */ jsx11("div", { className: "qt-chat-wardrobe-label", children: "Wardrobe" }),
+          /* @__PURE__ */ jsxs11("div", { className: "qt-chat-wardrobe-summary", children: [
+            /* @__PURE__ */ jsx11("div", { children: "Gifted \u201CSilver Pocket Watch\u201D to Marcus." }),
+            /* @__PURE__ */ jsx11("div", { children: "Marcus put it on immediately." })
+          ] })
+        ] })
+      ] })
+    ] }),
     /* @__PURE__ */ jsxs11("section", { style: { marginBottom: "2rem" }, children: [
       /* @__PURE__ */ jsx11("h3", { style: { fontSize: "1.125rem", fontWeight: 700, marginBottom: "1rem", borderBottom: "1px solid var(--color-border)", paddingBottom: "0.5rem" }, children: "Chat Toolbar" }),
       /* @__PURE__ */ jsx11("p", { style: { color: "var(--color-muted-foreground)", marginBottom: "1rem" }, children: "Formatting and action buttons for chat composition." }),

package/dist/index.css

@@ -290,8 +290,8 @@ body {
   --qt-alert-info-border: hsl(199 89% 48% / 0.3);
   --qt-badge-character-bg: hsl(217 91% 60% / 0.15);
   --qt-badge-character-fg: hsl(217 91% 45%);
-  --qt-badge-persona-bg: hsl(270 70% 60% / 0.15);
-  --qt-badge-persona-fg: hsl(270 70% 45%);
+  --qt-badge-user-character-bg: hsl(270 70% 60% / 0.15);
+  --qt-badge-user-character-fg: hsl(270 70% 45%);
   --qt-badge-chat-bg: hsl(142 76% 36% / 0.15);
   --qt-badge-chat-fg: hsl(142 76% 30%);
   --qt-badge-tag-bg: hsl(25 95% 53% / 0.15);
@@ -408,10 +408,18 @@ body {
   --qt-chat-assistant-border: var(--color-border);
   --qt-chat-assistant-font: var(--font-sans);
   --qt-chat-assistant-font-weight: inherit;
+  --qt-chat-whisper-bg: color-mix(in srgb, var(--qt-chat-assistant-bg) 60%, #9b8ec4 40%);
+  --qt-chat-whisper-fg: var(--qt-chat-assistant-fg);
+  --qt-chat-whisper-border: #9b8ec4;
+  --qt-chat-whisper-label-fg: #7c6fa0;
   --qt-chat-silent-bg: color-mix(in srgb, var(--qt-chat-assistant-bg) 65%, #7a9e8e 35%);
   --qt-chat-silent-fg: var(--qt-chat-assistant-fg);
   --qt-chat-silent-border: #7a9e8e;
   --qt-chat-silent-label-fg: #5d7e6e;
+  --qt-chat-wardrobe-bg: color-mix(in srgb, var(--qt-chat-assistant-bg) 60%, #c4a24e 40%);
+  --qt-chat-wardrobe-fg: var(--qt-chat-assistant-fg);
+  --qt-chat-wardrobe-border: #c4a24e;
+  --qt-chat-wardrobe-label-fg: #9a7d2e;
   --qt-chat-composer-bg: var(--color-background);
   --qt-chat-composer-border: var(--color-border);
   --qt-chat-composer-radius: var(--radius-lg);
@@ -986,6 +994,21 @@ body {
   color: var(--qt-chat-assistant-fg);
   border: 1px solid var(--color-border);
 }
+.qt-chat-message-whisper {
+  background: var(--qt-chat-whisper-bg);
+  color: var(--qt-chat-whisper-fg);
+  border: 2px dashed var(--qt-chat-whisper-border);
+  font-style: italic;
+}
+.qt-chat-whisper-label {
+  font-size: 0.75rem;
+  color: var(--qt-chat-whisper-label-fg);
+  font-style: italic;
+  margin-bottom: 0.25rem;
+}
+.qt-chat-message-whisper-overheard {
+  opacity: 0.6;
+}
 .qt-chat-message-silent {
   background: var(--qt-chat-silent-bg);
   color: var(--qt-chat-silent-fg);
@@ -998,6 +1021,27 @@ body {
   font-style: italic;
   margin-bottom: 0.25rem;
 }
+.qt-chat-wardrobe-notice {
+  background: var(--qt-chat-wardrobe-bg);
+  color: var(--qt-chat-wardrobe-fg);
+  border: 3px double var(--qt-chat-wardrobe-border);
+  border-radius: var(--radius-md, 0.375rem);
+  padding: 0.5rem 0.75rem;
+  margin-bottom: 0.5rem;
+  font-size: 0.8125rem;
+  line-height: 1.4;
+}
+.qt-chat-wardrobe-label {
+  font-size: 0.6875rem;
+  color: var(--qt-chat-wardrobe-label-fg);
+  font-weight: 600;
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+  margin-bottom: 0.25rem;
+}
+.qt-chat-wardrobe-summary {
+  color: var(--qt-chat-wardrobe-fg);
+}
 .qt-badge-silent {
   background: var(--qt-chat-silent-bg);
   color: var(--qt-chat-silent-label-fg);
@@ -1619,9 +1663,15 @@ body {
   }
 }
 .dark {
+  --qt-chat-whisper-bg: color-mix(in srgb, var(--qt-chat-assistant-bg) 60%, #6b5b95 40%);
+  --qt-chat-whisper-border: #6b5b95;
+  --qt-chat-whisper-label-fg: #a89cc8;
   --qt-chat-silent-bg: color-mix(in srgb, var(--qt-chat-assistant-bg) 65%, #4a7a6a 35%);
   --qt-chat-silent-border: #4a7a6a;
   --qt-chat-silent-label-fg: #8ab8a4;
+  --qt-chat-wardrobe-bg: color-mix(in srgb, var(--qt-chat-assistant-bg) 60%, #8a6d1b 40%);
+  --qt-chat-wardrobe-border: #8a6d1b;
+  --qt-chat-wardrobe-label-fg: #d4b65c;
   --qt-alert-success-bg: hsl(142 76% 36% / 0.2);
   --qt-alert-success-fg: hsl(142 76% 65%);
   --qt-alert-success-border: hsl(142 76% 36% / 0.5);
@@ -1636,8 +1686,8 @@ body {
   --qt-alert-info-border: hsl(199 89% 48% / 0.5);
   --qt-badge-character-bg: hsl(217 91% 60% / 0.3);
   --qt-badge-character-fg: hsl(217 91% 70%);
-  --qt-badge-persona-bg: hsl(270 70% 60% / 0.3);
-  --qt-badge-persona-fg: hsl(270 70% 70%);
+  --qt-badge-user-character-bg: hsl(270 70% 60% / 0.3);
+  --qt-badge-user-character-fg: hsl(270 70% 70%);
   --qt-badge-chat-bg: hsl(142 76% 36% / 0.3);
   --qt-badge-chat-fg: hsl(142 76% 65%);
   --qt-badge-tag-bg: hsl(25 95% 53% / 0.3);

package/dist/index.js

@@ -875,7 +875,7 @@ var Badges = () => {
       /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("h3", { style: { fontSize: "1.125rem", fontWeight: 700, marginBottom: "1rem", borderBottom: "1px solid var(--color-border)", paddingBottom: "0.5rem" }, children: "Entity Type Badges" }),
       /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { style: { display: "flex", flexWrap: "wrap", gap: "0.75rem", alignItems: "center" }, children: [
         /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "qt-badge qt-badge-character", children: "Character" }),
-        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "qt-badge qt-badge-persona", children: "Persona" }),
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "qt-badge qt-badge-user-character", children: "User Character" }),
         /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "qt-badge qt-badge-chat", children: "Chat" }),
         /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "qt-badge qt-badge-tag", children: "Tag" }),
         /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "qt-badge qt-badge-memory", children: "Memory" })
@@ -1395,6 +1395,33 @@ var Chat = () => {
         ] }) })
       ] })
     ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("section", { style: { marginBottom: "2rem" }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("h3", { style: { fontSize: "1.125rem", fontWeight: 700, marginBottom: "1rem", borderBottom: "1px solid var(--color-border)", paddingBottom: "0.5rem" }, children: "Wardrobe Action Notices" }),
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("p", { style: { color: "var(--color-muted-foreground)", marginBottom: "1rem" }, children: "Inline summaries of outfit changes (equip, unequip, gift). Distinguished from whispers (dashed purple) and silent messages (dotted teal) by a double border and warm amber/gold tones." }),
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: "1rem", maxWidth: "32rem" }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "qt-chat-wardrobe-notice", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "qt-chat-wardrobe-label", children: "Wardrobe" }),
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "qt-chat-wardrobe-summary", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { children: "Equipped \u201CCrimson Evening Gown\u201D in the top slot." }),
+            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { children: "Wearing: Crimson Evening Gown (top, bottom), Glass Slippers (footwear)" })
+          ] })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "qt-chat-wardrobe-notice", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "qt-chat-wardrobe-label", children: "Wardrobe" }),
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "qt-chat-wardrobe-summary", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { children: "Removed item from the footwear slot." }),
+            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { children: "Wearing: Crimson Evening Gown (top, bottom), barefoot" })
+          ] })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "qt-chat-wardrobe-notice", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "qt-chat-wardrobe-label", children: "Wardrobe" }),
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { className: "qt-chat-wardrobe-summary", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { children: "Gifted \u201CSilver Pocket Watch\u201D to Marcus." }),
+            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { children: "Marcus put it on immediately." })
+          ] })
+        ] })
+      ] })
+    ] }),
     /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("section", { style: { marginBottom: "2rem" }, children: [
       /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("h3", { style: { fontSize: "1.125rem", fontWeight: 700, marginBottom: "1rem", borderBottom: "1px solid var(--color-border)", paddingBottom: "0.5rem" }, children: "Chat Toolbar" }),
       /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("p", { style: { color: "var(--color-muted-foreground)", marginBottom: "1rem" }, children: "Formatting and action buttons for chat composition." }),

package/dist/index.mjs

@@ -17,7 +17,7 @@ import {
   Tabs,
   ThemeComparison,
   Typography
-} from "./chunk-TZN7AU3N.mjs";
+} from "./chunk-C4SJNVAC.mjs";
 import "./chunk-WUKYLWAZ.mjs";
 
 // src/preview.tsx

package/dist/stories/index.js

@@ -812,7 +812,7 @@ var Badges = () => {
       /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("h3", { style: { fontSize: "1.125rem", fontWeight: 700, marginBottom: "1rem", borderBottom: "1px solid var(--color-border)", paddingBottom: "0.5rem" }, children: "Entity Type Badges" }),
       /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { style: { display: "flex", flexWrap: "wrap", gap: "0.75rem", alignItems: "center" }, children: [
         /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "qt-badge qt-badge-character", children: "Character" }),
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "qt-badge qt-badge-persona", children: "Persona" }),
+        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "qt-badge qt-badge-user-character", children: "User Character" }),
         /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "qt-badge qt-badge-chat", children: "Chat" }),
         /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "qt-badge qt-badge-tag", children: "Tag" }),
         /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "qt-badge qt-badge-memory", children: "Memory" })
@@ -1332,6 +1332,33 @@ var Chat = () => {
         ] }) })
       ] })
     ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("section", { style: { marginBottom: "2rem" }, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("h3", { style: { fontSize: "1.125rem", fontWeight: 700, marginBottom: "1rem", borderBottom: "1px solid var(--color-border)", paddingBottom: "0.5rem" }, children: "Wardrobe Action Notices" }),
+      /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("p", { style: { color: "var(--color-muted-foreground)", marginBottom: "1rem" }, children: "Inline summaries of outfit changes (equip, unequip, gift). Distinguished from whispers (dashed purple) and silent messages (dotted teal) by a double border and warm amber/gold tones." }),
+      /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: "1rem", maxWidth: "32rem" }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "qt-chat-wardrobe-notice", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "qt-chat-wardrobe-label", children: "Wardrobe" }),
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "qt-chat-wardrobe-summary", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { children: "Equipped \u201CCrimson Evening Gown\u201D in the top slot." }),
+            /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { children: "Wearing: Crimson Evening Gown (top, bottom), Glass Slippers (footwear)" })
+          ] })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "qt-chat-wardrobe-notice", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "qt-chat-wardrobe-label", children: "Wardrobe" }),
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "qt-chat-wardrobe-summary", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { children: "Removed item from the footwear slot." }),
+            /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { children: "Wearing: Crimson Evening Gown (top, bottom), barefoot" })
+          ] })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "qt-chat-wardrobe-notice", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { className: "qt-chat-wardrobe-label", children: "Wardrobe" }),
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("div", { className: "qt-chat-wardrobe-summary", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { children: "Gifted \u201CSilver Pocket Watch\u201D to Marcus." }),
+            /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { children: "Marcus put it on immediately." })
+          ] })
+        ] })
+      ] })
+    ] }),
     /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)("section", { style: { marginBottom: "2rem" }, children: [
       /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("h3", { style: { fontSize: "1.125rem", fontWeight: 700, marginBottom: "1rem", borderBottom: "1px solid var(--color-border)", paddingBottom: "0.5rem" }, children: "Chat Toolbar" }),
       /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("p", { style: { color: "var(--color-muted-foreground)", marginBottom: "1rem" }, children: "Formatting and action buttons for chat composition." }),

package/dist/stories/index.mjs

@@ -17,7 +17,7 @@ import {
   Tabs,
   ThemeComparison,
   Typography
-} from "../chunk-TZN7AU3N.mjs";
+} from "../chunk-C4SJNVAC.mjs";
 import "../chunk-WUKYLWAZ.mjs";
 export {
   Avatars,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@quilltap/theme-storybook",
-  "version": "1.0.29",
+  "version": "1.0.31",
   "description": "Storybook preset and stories for developing Quilltap theme plugins",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -65,12 +65,12 @@
   "license": "MIT",
   "repository": {
     "type": "git",
-    "url": "https://github.com/foundry-9/quilltap.git",
+    "url": "https://github.com/foundry-9/quilltap-server.git",
     "directory": "packages/theme-storybook"
   },
-  "homepage": "https://github.com/foundry-9/quilltap/tree/main/packages/theme-storybook#readme",
+  "homepage": "https://github.com/foundry-9/quilltap-server/tree/main/packages/theme-storybook#readme",
   "bugs": {
-    "url": "https://github.com/foundry-9/quilltap/issues"
+    "url": "https://github.com/foundry-9/quilltap-server/issues"
   },
   "engines": {
     "node": ">=18.0.0"

package/src/css/qt-components.css

@@ -165,8 +165,8 @@
   /* Entity-type badge colors */
   --qt-badge-character-bg: hsl(217 91% 60% / 0.15);
   --qt-badge-character-fg: hsl(217 91% 45%);
-  --qt-badge-persona-bg: hsl(270 70% 60% / 0.15);
-  --qt-badge-persona-fg: hsl(270 70% 45%);
+  --qt-badge-user-character-bg: hsl(270 70% 60% / 0.15);
+  --qt-badge-user-character-fg: hsl(270 70% 45%);
   --qt-badge-chat-bg: hsl(142 76% 36% / 0.15);
   --qt-badge-chat-fg: hsl(142 76% 30%);
   --qt-badge-tag-bg: hsl(25 95% 53% / 0.15);
@@ -304,12 +304,24 @@
   --qt-chat-assistant-font: var(--font-sans);
   --qt-chat-assistant-font-weight: inherit;
 
+  /* Chat: Whisper messages */
+  --qt-chat-whisper-bg: color-mix(in srgb, var(--qt-chat-assistant-bg) 60%, #9b8ec4 40%);
+  --qt-chat-whisper-fg: var(--qt-chat-assistant-fg);
+  --qt-chat-whisper-border: #9b8ec4;
+  --qt-chat-whisper-label-fg: #7c6fa0;
+
   /* Chat: Silent messages — inner thoughts/actions from characters in silent mode */
   --qt-chat-silent-bg: color-mix(in srgb, var(--qt-chat-assistant-bg) 65%, #7a9e8e 35%);
   --qt-chat-silent-fg: var(--qt-chat-assistant-fg);
   --qt-chat-silent-border: #7a9e8e;
   --qt-chat-silent-label-fg: #5d7e6e;
 
+  /* Chat: Wardrobe action notices — warm amber/gold for dressing room actions */
+  --qt-chat-wardrobe-bg: color-mix(in srgb, var(--qt-chat-assistant-bg) 60%, #c4a24e 40%);
+  --qt-chat-wardrobe-fg: var(--qt-chat-assistant-fg);
+  --qt-chat-wardrobe-border: #c4a24e;
+  --qt-chat-wardrobe-label-fg: #9a7d2e;
+
   /* Chat composer variables */
   --qt-chat-composer-bg: var(--color-background);
   --qt-chat-composer-border: var(--color-border);
@@ -1025,6 +1037,27 @@
   border: 1px solid var(--color-border);
 }
 
+/**
+ * Whisper message — private messages between characters, not heard by all.
+ */
+.qt-chat-message-whisper {
+  background: var(--qt-chat-whisper-bg);
+  color: var(--qt-chat-whisper-fg);
+  border: 2px dashed var(--qt-chat-whisper-border);
+  font-style: italic;
+}
+
+.qt-chat-whisper-label {
+  font-size: 0.75rem;
+  color: var(--qt-chat-whisper-label-fg);
+  font-style: italic;
+  margin-bottom: 0.25rem;
+}
+
+.qt-chat-message-whisper-overheard {
+  opacity: 0.6;
+}
+
 /**
  * Silent message — inner thoughts and actions from character in silent mode.
  * Distinguished from whispers by a dotted border (vs dashed) and sage/teal tones.
@@ -1043,6 +1076,34 @@
   margin-bottom: 0.25rem;
 }
 
+/**
+ * Wardrobe action notice — inline summary of outfit changes.
+ * Double border with warm amber/gold tones, distinct from whisper (dashed) and silent (dotted).
+ */
+.qt-chat-wardrobe-notice {
+  background: var(--qt-chat-wardrobe-bg);
+  color: var(--qt-chat-wardrobe-fg);
+  border: 3px double var(--qt-chat-wardrobe-border);
+  border-radius: var(--radius-md, 0.375rem);
+  padding: 0.5rem 0.75rem;
+  margin-bottom: 0.5rem;
+  font-size: 0.8125rem;
+  line-height: 1.4;
+}
+
+.qt-chat-wardrobe-label {
+  font-size: 0.6875rem;
+  color: var(--qt-chat-wardrobe-label-fg);
+  font-weight: 600;
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+  margin-bottom: 0.25rem;
+}
+
+.qt-chat-wardrobe-summary {
+  color: var(--qt-chat-wardrobe-fg);
+}
+
 /**
  * Status badges for silent/absent participants
  */
@@ -1857,11 +1918,21 @@
    Adjusted colors for dark backgrounds with better contrast
    ========================================================================== */
 .dark {
+  /* Chat: Whisper messages — dark mode */
+  --qt-chat-whisper-bg: color-mix(in srgb, var(--qt-chat-assistant-bg) 60%, #6b5b95 40%);
+  --qt-chat-whisper-border: #6b5b95;
+  --qt-chat-whisper-label-fg: #a89cc8;
+
   /* Chat: Silent messages — darker mode variants */
   --qt-chat-silent-bg: color-mix(in srgb, var(--qt-chat-assistant-bg) 65%, #4a7a6a 35%);
   --qt-chat-silent-border: #4a7a6a;
   --qt-chat-silent-label-fg: #8ab8a4;
 
+  /* Chat: Wardrobe action notices — dark mode */
+  --qt-chat-wardrobe-bg: color-mix(in srgb, var(--qt-chat-assistant-bg) 60%, #8a6d1b 40%);
+  --qt-chat-wardrobe-border: #8a6d1b;
+  --qt-chat-wardrobe-label-fg: #d4b65c;
+
   /* Alert tokens - brighter, more saturated for dark backgrounds */
   --qt-alert-success-bg: hsl(142 76% 36% / 0.2);
   --qt-alert-success-fg: hsl(142 76% 65%);
@@ -1882,8 +1953,8 @@
   /* Entity badge tokens - brighter for dark backgrounds */
   --qt-badge-character-bg: hsl(217 91% 60% / 0.3);
   --qt-badge-character-fg: hsl(217 91% 70%);
-  --qt-badge-persona-bg: hsl(270 70% 60% / 0.3);
-  --qt-badge-persona-fg: hsl(270 70% 70%);
+  --qt-badge-user-character-bg: hsl(270 70% 60% / 0.3);
+  --qt-badge-user-character-fg: hsl(270 70% 70%);
   --qt-badge-chat-bg: hsl(142 76% 36% / 0.3);
   --qt-badge-chat-fg: hsl(142 76% 65%);
   --qt-badge-tag-bg: hsl(25 95% 53% / 0.3);

package/src/stories/components/Badges.tsx

@@ -90,7 +90,7 @@ export const Badges: React.FC = () => {
         </h3>
         <div style={{ display: 'flex', flexWrap: 'wrap', gap: '0.75rem', alignItems: 'center' }}>
           <span className="qt-badge qt-badge-character">Character</span>
-          <span className="qt-badge qt-badge-persona">Persona</span>
+          <span className="qt-badge qt-badge-user-character">User Character</span>
           <span className="qt-badge qt-badge-chat">Chat</span>
           <span className="qt-badge qt-badge-tag">Tag</span>
           <span className="qt-badge qt-badge-memory">Memory</span>

package/src/stories/components/Chat.tsx

@@ -248,6 +248,45 @@ export const Chat: React.FC = () => {
         </div>
       </section>
 
+      {/* Wardrobe Action Notices */}
+      <section style={{ marginBottom: '2rem' }}>
+        <h3 style={{ fontSize: '1.125rem', fontWeight: 700, marginBottom: '1rem', borderBottom: '1px solid var(--color-border)', paddingBottom: '0.5rem' }}>
+          Wardrobe Action Notices
+        </h3>
+        <p style={{ color: 'var(--color-muted-foreground)', marginBottom: '1rem' }}>
+          Inline summaries of outfit changes (equip, unequip, gift). Distinguished from whispers (dashed purple)
+          and silent messages (dotted teal) by a double border and warm amber/gold tones.
+        </p>
+        <div style={{ display: 'flex', flexDirection: 'column', gap: '1rem', maxWidth: '32rem' }}>
+          {/* Equip action */}
+          <div className="qt-chat-wardrobe-notice">
+            <div className="qt-chat-wardrobe-label">Wardrobe</div>
+            <div className="qt-chat-wardrobe-summary">
+              <div>Equipped &ldquo;Crimson Evening Gown&rdquo; in the top slot.</div>
+              <div>Wearing: Crimson Evening Gown (top, bottom), Glass Slippers (footwear)</div>
+            </div>
+          </div>
+
+          {/* Remove action */}
+          <div className="qt-chat-wardrobe-notice">
+            <div className="qt-chat-wardrobe-label">Wardrobe</div>
+            <div className="qt-chat-wardrobe-summary">
+              <div>Removed item from the footwear slot.</div>
+              <div>Wearing: Crimson Evening Gown (top, bottom), barefoot</div>
+            </div>
+          </div>
+
+          {/* Gift action */}
+          <div className="qt-chat-wardrobe-notice">
+            <div className="qt-chat-wardrobe-label">Wardrobe</div>
+            <div className="qt-chat-wardrobe-summary">
+              <div>Gifted &ldquo;Silver Pocket Watch&rdquo; to Marcus.</div>
+              <div>Marcus put it on immediately.</div>
+            </div>
+          </div>
+        </div>
+      </section>
+
       {/* Chat Toolbar */}
       <section style={{ marginBottom: '2rem' }}>
         <h3 style={{ fontSize: '1.125rem', fontWeight: 700, marginBottom: '1rem', borderBottom: '1px solid var(--color-border)', paddingBottom: '0.5rem' }}>