fix: auto-resize textareas + dark scrollbar in admin editors

Textareas auto-grow with content and on window resize, no scrollbar
or resize handle needed. Added dark admin scrollbar styles for cases
where overflow is needed.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

src/app/admin/_components/FormField.tsx

@@ -1,3 +1,5 @@
+import { useRef, useEffect } from "react";
+
 interface InputFieldProps {
   label: string;
   value: string;
@@ -42,15 +44,36 @@ export function TextareaField({
   placeholder,
   rows = 3,
 }: TextareaFieldProps) {
+  const ref = useRef<HTMLTextAreaElement>(null);
+
+  useEffect(() => {
+    const el = ref.current;
+    if (!el) return;
+    el.style.height = "auto";
+    el.style.height = el.scrollHeight + "px";
+  }, [value]);
+
+  useEffect(() => {
+    function onResize() {
+      const el = ref.current;
+      if (!el) return;
+      el.style.height = "auto";
+      el.style.height = el.scrollHeight + "px";
+    }
+    window.addEventListener("resize", onResize);
+    return () => window.removeEventListener("resize", onResize);
+  }, []);
+
   return (
     <div>
       <label className="block text-sm text-neutral-400 mb-1.5">{label}</label>
       <textarea
+        ref={ref}
         value={value}
         onChange={(e) => onChange(e.target.value)}
         placeholder={placeholder}
         rows={rows}
-        className="w-full rounded-lg border border-white/10 bg-neutral-800 px-4 py-2.5 text-white placeholder-neutral-500 outline-none focus:border-gold transition-colors resize-y"
+        className="w-full rounded-lg border border-white/10 bg-neutral-800 px-4 py-2.5 text-white placeholder-neutral-500 outline-none focus:border-gold transition-colors resize-none overflow-hidden"
       />
     </div>
   );

src/app/globals.css

@@ -59,3 +59,27 @@ body {
 .scrollbar-hide::-webkit-scrollbar {
   display: none;
 }
+
+/* ===== Admin dark scrollbar ===== */
+
+.admin-scrollbar {
+  scrollbar-width: thin;
+  scrollbar-color: rgba(255, 255, 255, 0.15) transparent;
+}
+
+.admin-scrollbar::-webkit-scrollbar {
+  width: 6px;
+}
+
+.admin-scrollbar::-webkit-scrollbar-track {
+  background: transparent;
+}
+
+.admin-scrollbar::-webkit-scrollbar-thumb {
+  background: rgba(255, 255, 255, 0.15);
+  border-radius: 3px;
+}
+
+.admin-scrollbar::-webkit-scrollbar-thumb:hover {
+  background: rgba(255, 255, 255, 0.3);
+}