minor UI fixes

src/components/ItemForge.tsx

@@ -31,7 +31,6 @@ export function ItemForge({ prefill, onPrefillConsumed }: Props = {}) {
   const [item, setItem] = useState<ItemResponse | null>(null);
   const [rawResponse, setRawResponse] = useState<string | null>(null);
   const [loading, setLoading] = useState(false);
-  const [error, setError] = useState("");
   const [artNonce, setArtNonce] = useState(0);
   const { addToast } = useToast();
 
@@ -50,7 +49,6 @@ export function ItemForge({ prefill, onPrefillConsumed }: Props = {}) {
 
   async function generate() {
     setLoading(true);
-    setError("");
     setItem(null);
     setRawResponse(null);
     try {
@@ -92,11 +90,9 @@ The JSON must have exactly these keys:
           `${parsed.name || "Magic item"} — ${parsed.rarity || rarity} ${parsed.type || itemType}. ${flattenValue(parsed.description)}\nMechanics: ${flattenValue(parsed.mechanical)}\nLore: ${flattenValue(parsed.lore)}`,
         );
       } else {
-        setError("Could not parse LLM response as JSON. Raw response shown below.");
         addToast("LLM returned an unparseable response", "error");
       }
     } catch (e) {
-      setError(String(e));
       addToast(`Item generation failed: ${e}`, "error");
     }
     setLoading(false);
@@ -114,6 +110,14 @@ The JSON must have exactly these keys:
   const mechanicalText = item ? flattenValue(item.mechanical) : "";
   const hasParseError = !item && rawResponse;
 
+  // ponytail: one-click "surprise me" — random rarity + type, no typed prompt.
+  function randomItem() {
+    setRarity(RARITIES[Math.floor(Math.random() * RARITIES.length)]);
+    setItemType(TYPES[Math.floor(Math.random() * TYPES.length)]);
+    setPrompt("");
+    setTimeout(generate, 0);
+  }
+
   return (
     <div className="flex flex-col gap-3">
       <div className="grid grid-cols-2 gap-2">
@@ -159,10 +163,19 @@ The JSON must have exactly these keys:
       >
         {loading ? "⚔ Forging…" : "⚔ Forge Item"}
       </button>
+      <button
+        onClick={randomItem}
+        disabled={loading}
+        title="Surprise me — random rarity and type"
+        className="rounded-lg bg-[var(--color-bg-surface)] border border-[var(--color-border-glass)] text-[var(--color-text-dim)] px-3 py-2 text-sm hover:text-[var(--color-gold-bright)] hover:border-[var(--color-gold-bright)] transition-colors cursor-pointer disabled:opacity-50"
+      >
+        🎲 Random
+      </button>
 
-      {error && (
-        <div className="rounded-lg bg-[var(--color-danger)]/10 border border-[var(--color-danger)]/30 p-3 text-[var(--color-danger)] text-xs">
-          {error}
+      {!item && !loading && !hasParseError && (
+        <div className="flex flex-col items-center justify-center py-8 text-center text-[var(--color-text-dim)] text-xs">
+          <span>No item yet.</span>
+          <span className="mt-1">Pick rarity + type, then Forge.</span>
         </div>
       )}