refactor: align favicon tool with Calculate/Media blueprint

- FaviconGenerator: lg:grid-cols-5 layout (2/5 setup, 3/5 results);
  glass panels, native inputs, custom tab switcher (Icons/HTML/Manifest),
  native progress bar, empty state placeholder, mobile Setup|Results tabs
- FaviconFileUpload: remove shadcn Button; match media FileUpload styling
  with file card, metadata chips (size, dimensions)
- CodeSnippet: remove shadcn Button; dark terminal (#06060e) with hover
  copy button, consistent with ASCII/ExportMenu code blocks

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

components/favicon/CodeSnippet.tsx

@@ -2,15 +2,13 @@
 
 import * as React from 'react';
 import { Copy, Check } from 'lucide-react';
-import { Button } from '@/components/ui/button';
 import { toast } from 'sonner';
 
 interface CodeSnippetProps {
   code: string;
-  language?: string;
 }
 
-export function CodeSnippet({ code, language }: CodeSnippetProps) {
+export function CodeSnippet({ code }: CodeSnippetProps) {
   const [copied, setCopied] = React.useState(false);
 
   const handleCopy = () => {
@@ -21,18 +19,15 @@ export function CodeSnippet({ code, language }: CodeSnippetProps) {
   };
 
   return (
-    <div className="relative group">
-      <div className="absolute right-4 top-4 opacity-0 group-hover:opacity-100 transition-opacity">
-        <Button
-          variant="secondary"
-          size="icon-xs"
-          onClick={handleCopy}
-          className="bg-background/50 backdrop-blur-md border border-border"
-        >
-          {copied ? <Check className="h-3 w-3" /> : <Copy className="h-3 w-3" />}
-        </Button>
-      </div>
-      <pre className="p-4 rounded-lg bg-input backdrop-blur-sm border border-border overflow-x-auto font-mono text-xs text-muted-foreground leading-relaxed">
+    <div className="relative group rounded-xl overflow-hidden border border-white/5" style={{ background: '#06060e' }}>
+      <button
+        onClick={handleCopy}
+        className="absolute right-3 top-3 opacity-0 group-hover:opacity-100 flex items-center gap-1 px-2 py-1 text-[10px] font-mono rounded-md border border-white/10 bg-white/5 text-white/40 hover:text-white/70 hover:border-white/20 transition-all"
+      >
+        {copied ? <Check className="w-2.5 h-2.5" /> : <Copy className="w-2.5 h-2.5" />}
+        {copied ? 'Copied' : 'Copy'}
+      </button>
+      <pre className="p-4 overflow-x-auto font-mono text-[11px] text-white/55 leading-relaxed">
         <code>{code}</code>
       </pre>
     </div>