refactor: replace hardcoded hex values with Tailwind semantic tokens

3,200+ hardcoded color values replaced with CSS variable-backed
Tailwind classes (bg-card, text-foreground, border-border, etc.).
Enables light mode via CSS variable swap. Only syntax highlighting
colors and intentional one-offs remain hardcoded (~15 values).

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

frontend/src/components/script-builder/ScriptBuilderInput.tsx

@@ -55,7 +55,7 @@ export function ScriptBuilderInput({
         rows={1}
         className={cn(
           "flex-1 resize-none rounded-xl px-4 py-2.5 text-sm",
-          "bg-[#14161d] border border-[#1e2130] text-[#e2e5eb] placeholder:text-[#848b9b]",
+          "bg-card border border-border text-foreground placeholder:text-muted-foreground",
           "focus:outline-none focus:border-[rgba(6,182,212,0.3)] transition-colors",
           "disabled:opacity-50"
         )}
@@ -67,8 +67,8 @@ export function ScriptBuilderInput({
         className={cn(
           "shrink-0 flex items-center justify-center w-10 h-10 rounded-xl transition-all",
           canSend
-            ? "bg-[#22d3ee] text-white hover:brightness-110 active:scale-[0.98]"
-            : "bg-[rgba(255,255,255,0.04)] text-[#5a6170] cursor-not-allowed"
+            ? "bg-primary text-white hover:brightness-110 active:scale-[0.98]"
+            : "bg-[rgba(255,255,255,0.04)] text-text-muted cursor-not-allowed"
         )}
       >
         <Send size={18} />