:root{--bg:#fff;--fg:#111827;--muted:#6b7280;--card:#f9fafb;--border:#e5e7eb;--green:#00E676;--red:#FF1744}
@media (prefers-color-scheme:dark){:root{--bg:#0b0f14;--fg:#e5e7eb;--muted:#94a3b8;--card:#0f172a;--border:#1f2937}}
.vec-root{max-width:980px;margin:0 auto}
.vec-card{border:1px solid var(--border);border-radius:16px;padding:16px;margin:16px 0;background:var(--card);box-shadow:0 2px 8px rgba(0,0,0,.05)}
.vec-card h3 {color:#FAFAFA}
.vec-center{display:flex;align-items:center;gap:16px}
.vec-btn{padding:10px 16px;border-radius:12px;border:1px solid var(--fg);background:var(--fg);color:#fff;cursor:pointer;text-decoration:none;display:inline-block}
.vec-btn[disabled]{opacity:.6;cursor:not-allowed}
.vec-btn.current{opacity:.7;pointer-events:none}
.vec-muted{color:var(--muted);font-size:14px}
.vec-pre{white-space:pre-wrap;word-wrap:break-word;background:var(--bg);padding:12px;border:1px solid var(--border);max-height:320px;overflow:auto}
#vec_google_msg{min-height:1.25rem}
.vec-pre {color:#FAFAFA}

/* Single circular toggle button 140px, ES labels */
.vec-toggle-btn{
  width:140px;height:140px;border-radius:9999px;
  border:none;background:var(--green);color:#fff;font-weight:800;
  letter-spacing:.5px;
  font-size:20px;cursor:pointer;text-transform:uppercase;
  box-shadow:0 10px 24px rgba(0,0,0,.18);
  transition:transform .08s ease, background .2s ease, box-shadow .2s ease;
}
.vec-toggle-btn:active{transform:scale(.96)}
.vec-toggle-btn.is-recording{background:var(--red);animation:vecPulse 1.2s ease-in-out infinite}
@keyframes vecPulse{
  0%{box-shadow:0 0 0 0 rgba(255,23,68,.45)}
  70%{box-shadow:0 0 0 22px rgba(255,23,68,0)}
  100%{box-shadow:0 0 0 0 rgba(255,23,68,0)}
}

/* Compact list styles */
.vec-list-compact details{border-bottom:1px dashed var(--border);padding:10px 0}
.vec-summary{cursor:pointer;outline:none}
.vec-summary::-webkit-details-marker{display:none}
.vec-summary:before{content:'▸ ';}
details[open] .vec-summary:before{content:'▾ ';}
.vec-row-inner{margin-top:8px}