feat: full gold theme + high-quality SVG images

app/globals.css

@@ -115,7 +115,6 @@
   box-shadow: 0 0 0 2px rgba(201, 162, 39, 0.5);
 }
 
-/* Gold button */
 .btn-gold {
   background: linear-gradient(135deg, #E8C547, #C9A227);
   color: #0a0a0a;
@@ -199,3 +198,87 @@
   background-size: 1000px 100%;
   animation: goldShimmer 2s infinite;
 }
+
+.btn-outline-gold {
+    background: transparent;
+    color: #e8c547;
+    border: 1px solid rgba(201,162,39,0.35);
+    font-weight: 600;
+    transition: background 0.2s, border-color 0.2s, box-shadow 0.2s;
+}
+.btn-outline-gold:hover {
+    background: rgba(201,162,39,0.08);
+    border-color: #c9a227;
+    box-shadow: 0 0 16px rgba(201,162,39,0.2);
+}
+
+.glow-gold     { box-shadow: 0 0 20px rgba(201,162,39,0.35), 0 0 60px rgba(201,162,39,0.10); }
+.glow-gold-sm  { box-shadow: 0 0 12px rgba(201,162,39,0.28); }
+.glow-gold-lg  { box-shadow: 0 0 40px rgba(201,162,39,0.40), 0 0 80px rgba(201,162,39,0.15); }
+
+.protocol-badge {
+    display: inline-flex;
+    align-items: center;
+    gap: 0.4rem;
+    padding: 0.25rem 0.75rem;
+    border-radius: 999px;
+    background: rgba(201,162,39,0.12);
+    border: 1px solid rgba(201,162,39,0.28);
+    color: #e8c547;
+    font-size: 0.72rem;
+    font-weight: 600;
+    letter-spacing: 0.06em;
+    text-transform: uppercase;
+}
+
+.gold-divider {
+    height: 1px;
+    background: linear-gradient(90deg, transparent, rgba(201,162,39,0.35), transparent);
+    margin: 2rem 0;
+}
+
+.protocol-input {
+    background: hsl(var(--input));
+    color: hsl(var(--foreground));
+    border: 1px solid hsl(var(--border));
+    border-radius: 0.5rem;
+    transition: border-color 0.2s, box-shadow 0.2s;
+}
+.protocol-input:focus {
+    outline: none;
+    border-color: var(--gold-dim);
+    box-shadow: 0 0 0 3px rgba(201,162,39,0.12);
+}
+
+::-webkit-scrollbar { width: 6px; }
+::-webkit-scrollbar-track { background: hsl(var(--background)); }
+::-webkit-scrollbar-thumb { background: rgba(201,162,39,0.3); border-radius: 3px; }
+::-webkit-scrollbar-thumb:hover { background: rgba(201,162,39,0.5); }
+
+@keyframes gold-pulse {
+    0%, 100% { opacity: 1; }
+    50%       { opacity: 0.55; }
+}
+@keyframes float {
+    0%, 100% { transform: translateY(0); }
+    50%       { transform: translateY(-8px); }
+}
+@keyframes shimmer {
+    0%   { background-position: -200% center; }
+    100% { background-position:  200% center; }
+}
+@keyframes spin-slow {
+    from { transform: rotate(0deg); }
+    to   { transform: rotate(360deg); }
+}
+
+.animate-gold-pulse { animation: gold-pulse 2.5s ease-in-out infinite; }
+.animate-float      { animation: float 4s ease-in-out infinite; }
+.animate-shimmer {
+    background: linear-gradient(90deg, transparent 0%, rgba(201,162,39,0.25) 50%, transparent 100%);
+    background-size: 200% 100%;
+    animation: shimmer 2s linear infinite;
+}
+.animate-spin-slow  { animation: spin-slow 12s linear infinite; }
+
+::selection { background: rgba(201,162,39,0.25); color: #fff; }