update extension popup UI to match web app style

Changed color scheme from purple/indigo to purple/cyan/orange:
- Header: gradient from yellow-400 → orange-500 → pink-600 (firefly banner)
- Background: purple-50 → white → cyan-50 gradient
- Primary button: orange-600 with hover state
- Secondary button: purple-800 border
- Progress bar: orange → pink gradient
- Links and accents: orange-600

Matches web app's tailwind.config.js color system.

packages/extension/src/popup/popup.css

···
   min-height: 400px;
   font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
   color: #1e293b;
-  background: linear-gradient(135deg, #f8fafc 0%, #e0e7ff 100%);
+  background: linear-gradient(135deg, #faf5ff 0%, #ffffff 50%, #ecfeff 100%);
 }
 
 .container {
···
 }
 
 header {
-  background: linear-gradient(135deg, #7c3aed 0%, #6366f1 100%);
+  background: linear-gradient(to right, #facc15 0%, #f97316 50%, #ec4899 100%);
   color: white;
   padding: 20px;
   text-align: center;
···
 }
 
 .btn-primary {
-  background: linear-gradient(135deg, #7c3aed 0%, #6366f1 100%);
+  background: #ea580c;
   color: white;
   border: none;
   padding: 12px 24px;
···
   cursor: pointer;
   margin-top: 16px;
   width: 100%;
-  transition: transform 0.2s, box-shadow 0.2s;
+  transition: transform 0.2s, box-shadow 0.2s, background-color 0.2s;
 }
 
 .btn-primary:hover {
+  background: #c2410c;
   transform: translateY(-1px);
-  box-shadow: 0 4px 12px rgba(124, 58, 237, 0.3);
+  box-shadow: 0 4px 12px rgba(234, 88, 12, 0.3);
 }
 
 .btn-primary:active {
···
 
 .btn-secondary {
   background: white;
-  color: #7c3aed;
-  border: 2px solid #7c3aed;
+  color: #6b21a8;
+  border: 2px solid #6b21a8;
   padding: 10px 24px;
   border-radius: 8px;
   font-size: 14px;
···
 }
 
 .btn-secondary:hover {
-  background: #f5f3ff;
+  background: #faf5ff;
 }
 
 .progress {
···
 .progress-bar {
   width: 100%;
   height: 8px;
-  background: #e0e7ff;
+  background: #f0f9ff;
   border-radius: 4px;
   overflow: hidden;
   margin-bottom: 12px;
···
 
 .progress-fill {
   height: 100%;
-  background: linear-gradient(90deg, #7c3aed 0%, #6366f1 100%);
+  background: linear-gradient(90deg, #ea580c 0%, #ec4899 100%);
   width: 0%;
   transition: width 0.3s ease;
   animation: pulse 2s infinite;
···
 }
 
 .count-display strong {
-  color: #7c3aed;
+  color: #ea580c;
   font-size: 18px;
 }
 
···
 }
 
 footer a {
-  color: #7c3aed;
+  color: #ea580c;
   text-decoration: none;
   font-size: 13px;
   font-weight: 500;