Upload folder using huggingface_hub

index.html

@@ -195,14 +195,15 @@
 
         /* ── Mic + waveform ── */
         .controls {
-            display: flex; align-items: center; justify-content: center;
-            gap: 1rem; margin-bottom: 1rem;
+            display: flex; flex-direction: column; align-items: center;
+            gap: 0.75rem; margin-bottom: 1.25rem;
         }
         .mic-btn {
-            width: 56px; height: 56px; border-radius: 50%;
-            border: 2px solid #E9E2CB; background: rgba(255,255,255,0.7);
+            width: 88px; height: 88px; border-radius: 50%;
+            border: 3px solid #E9E2CB; background: rgba(255,255,255,0.7);
             cursor: pointer; display: flex; align-items: center; justify-content: center;
             transition: all 0.2s;
+            box-shadow: 0 4px 16px rgba(0,0,0,0.06);
         }
         .mic-btn:hover { border-color: #FF8205; background: rgba(255,130,5,0.05); }
         .mic-btn.listening {
@@ -213,12 +214,12 @@
         .mic-btn.disabled { opacity: 0.3; cursor: not-allowed; pointer-events: none; }
         @keyframes ring {
             0% { box-shadow: 0 0 0 0 rgba(255,130,5,0.3); }
-            100% { box-shadow: 0 0 0 16px rgba(255,130,5,0); }
+            100% { box-shadow: 0 0 0 20px rgba(255,130,5,0); }
         }
-        .mic-btn svg { width: 24px; height: 24px; fill: #888; transition: fill 0.2s; }
+        .mic-btn svg { width: 36px; height: 36px; fill: #999; transition: fill 0.2s; }
         .mic-btn.listening svg { fill: #FF8205; }
 
-        .waveform { flex: 1; height: 44px; max-width: 400px; }
+        .waveform { width: 100%; max-width: 480px; height: 44px; }
         .waveform canvas {
             width: 100%; height: 100%; display: block; border-radius: 4px;
             border: 1px solid #E9E2CB; background: rgba(255,255,255,0.4);