refactor: replace cyan accent with ember orange across entire frontend

Swap accent color from cyan (#22d3ee) to ember orange (#f97316) site-wide.
Cyan caused contrast issues and felt generic — orange brings warmth and
urgency fitting for a troubleshooting tool.

Changes:
- CSS variables: accent, accent-hover, accent-dim, accent-text, primary, ring
- Warning color shifted from amber (#fbbf24) to yellow (#eab308) for
  semantic separation from orange accent
- Brand SVGs: logo gradient updated to orange
- 50+ component files: all hardcoded cyan hex values, Tailwind cyan-*
  classes, and rgba(34,211,238,...) glow values replaced
- landing.css: all 45+ cyan references + 5 old border color fixes
- DESIGN-SYSTEM.md bumped to v5 with decisions log
- CLAUDE.md: all color references synced to charcoal palette + orange accent
- PWA theme-color meta tag updated to match sidebar (#10121a)

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

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

@@ -56,8 +56,8 @@ export function ScriptBuilderChat({
           )}
         >
           {msg.role === 'assistant' && (
-            <div className="shrink-0 w-8 h-8 rounded-lg bg-[rgba(6,182,212,0.1)] flex items-center justify-center mt-0.5">
-              <Bot size={16} className="text-cyan-400" />
+            <div className="shrink-0 w-8 h-8 rounded-lg bg-[rgba(249,115,22,0.1)] flex items-center justify-center mt-0.5">
+              <Bot size={16} className="text-orange-400" />
             </div>
           )}
 
@@ -65,7 +65,7 @@ export function ScriptBuilderChat({
             className={cn(
               "max-w-[85%] rounded-xl px-4 py-3 text-sm",
               msg.role === 'user'
-                ? "bg-[rgba(6,182,212,0.08)] border border-[rgba(6,182,212,0.15)] text-foreground"
+                ? "bg-[rgba(249,115,22,0.08)] border border-[rgba(249,115,22,0.15)] text-foreground"
                 : "card-flat"
             )}
           >
@@ -98,11 +98,11 @@ export function ScriptBuilderChat({
 
       {isLoading && (
         <div className="flex gap-3 justify-start">
-          <div className="shrink-0 w-8 h-8 rounded-lg bg-[rgba(6,182,212,0.1)] flex items-center justify-center">
-            <Bot size={16} className="text-cyan-400" />
+          <div className="shrink-0 w-8 h-8 rounded-lg bg-[rgba(249,115,22,0.1)] flex items-center justify-center">
+            <Bot size={16} className="text-orange-400" />
           </div>
           <div className="card-flat rounded-xl px-4 py-3 text-sm flex items-center gap-2">
-            <Loader2 size={14} className="animate-spin text-cyan-400" />
+            <Loader2 size={14} className="animate-spin text-orange-400" />
             <span className="text-muted-foreground">Generating script...</span>
           </div>
         </div>