@property --vcw-ang{syntax:"<angle>";inherits:false;initial-value:0deg}

.vcw-root{--vcw-a:#00B7DF;--vcw-b:#FF6600;--vcw-fg:#eafcff;--vcw-mut:#8fa3b3;--vcw-bad:#ff4d6d;font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;font-size:15px;line-height:1.45}
.vcw-root *,.vcw-root *::before,.vcw-root *::after{box-sizing:border-box}
.vcw-root[data-mode="float"]{position:fixed;right:20px;bottom:20px;z-index:99990}
.vcw-root.vcw-inline{display:block;position:relative}

/* ---------- Launch button: dark glass + rotating neon border ---------- */
.vcw-launch{position:relative;isolation:isolate;display:inline-flex;align-items:center;gap:.65em;padding:.95em 1.45em;border:0;border-radius:999px;background:rgba(6,10,18,.88);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:var(--vcw-fg);font-family:inherit;font-size:15px;font-weight:700;letter-spacing:.02em;line-height:1;cursor:pointer;transition:transform .2s ease;animation:vcw-ring 2.6s ease-out infinite}
.vcw-launch svg{color:var(--vcw-a);filter:drop-shadow(0 0 6px var(--vcw-a))}
.vcw-launch::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;padding:1.5px;background:conic-gradient(from var(--vcw-ang),var(--vcw-a),var(--vcw-b),var(--vcw-a));-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);mask-composite:exclude;animation:vcw-spin 4s linear infinite}
.vcw-launch::after{content:"";position:absolute;inset:-5px;z-index:-1;border-radius:inherit;background:conic-gradient(from var(--vcw-ang),var(--vcw-a),var(--vcw-b),var(--vcw-a));filter:blur(14px);opacity:.28;animation:vcw-spin 4s linear infinite}
.vcw-launch:hover{transform:translateY(-2px) scale(1.03)}
.vcw-launch:hover::after{opacity:.5}
.vcw-launch:focus-visible,.vcw-btn:focus-visible,.vcw-x:focus-visible{outline:2px solid #fff;outline-offset:3px}

@keyframes vcw-spin{to{--vcw-ang:360deg}}
@keyframes vcw-ring{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--vcw-a) 55%,transparent)}70%,100%{box-shadow:0 0 0 18px transparent}}

/* ---------- Panel ---------- */
.vcw-panel{position:relative;overflow:hidden;border-radius:24px;padding:18px 18px 16px;color:var(--vcw-fg);text-align:center;
	background:
		radial-gradient(120% 70% at 50% -10%,color-mix(in srgb,var(--vcw-a) 22%,transparent),transparent 60%),
		linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px) 0 0/26px 26px,
		linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px) 0 0/26px 26px,
		linear-gradient(165deg,rgba(13,20,33,.92),rgba(5,8,15,.96));
	-webkit-backdrop-filter:blur(20px) saturate(150%);backdrop-filter:blur(20px) saturate(150%);
	border:1px solid rgba(255,255,255,.09);
	box-shadow:0 30px 80px rgba(0,0,0,.65),0 0 0 1px color-mix(in srgb,var(--vcw-a) 18%,transparent) inset,0 0 70px color-mix(in srgb,var(--vcw-a) 14%,transparent)}
.vcw-panel::before{content:"";position:absolute;left:12%;right:12%;top:0;height:2px;background:linear-gradient(90deg,transparent,var(--vcw-a),var(--vcw-b),transparent);opacity:.9;filter:drop-shadow(0 0 6px var(--vcw-a))}
.vcw-panel[hidden]{display:none}
.vcw-panel:not([hidden]){animation:vcw-in .38s cubic-bezier(.2,.9,.3,1.15)}
@keyframes vcw-in{from{opacity:0;transform:translateY(14px) scale(.96)}to{opacity:1;transform:none}}
.vcw-root[data-mode="float"] .vcw-panel{position:absolute;right:0;bottom:calc(100% + 14px);width:min(360px,calc(100vw - 32px))}
.vcw-root.vcw-inline .vcw-panel{margin-top:14px;width:min(380px,100%)}

/* ---------- Header + state chip ---------- */
.vcw-head{display:flex;align-items:center;justify-content:space-between;gap:10px;text-align:left}
.vcw-ttl{display:flex;flex-direction:column;gap:6px}
.vcw-ttl strong{font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.vcw-chip{display:inline-flex;align-items:center;gap:7px;align-self:flex-start;padding:3px 10px 3px 8px;border:1px solid color-mix(in srgb,var(--vcw-a) 45%,transparent);border-radius:999px;background:color-mix(in srgb,var(--vcw-a) 10%,transparent);font-size:10.5px;font-weight:700;letter-spacing:.16em;color:var(--vcw-a)}
.vcw-chip i{width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 8px currentColor}
.vcw-root[data-state="live"] .vcw-chip i{animation:vcw-blink 1s ease-in-out infinite}
.vcw-root[data-state="live"][data-mode-ai="speaking"] .vcw-chip{color:var(--vcw-b);border-color:color-mix(in srgb,var(--vcw-b) 50%,transparent);background:color-mix(in srgb,var(--vcw-b) 12%,transparent)}
.vcw-root[data-state="error"] .vcw-chip{color:var(--vcw-bad);border-color:color-mix(in srgb,var(--vcw-bad) 50%,transparent);background:color-mix(in srgb,var(--vcw-bad) 12%,transparent)}
@keyframes vcw-blink{50%{opacity:.25}}
.vcw-x{flex:none;width:32px;height:32px;border:1px solid rgba(255,255,255,.1);border-radius:50%;background:rgba(255,255,255,.05);color:var(--vcw-fg);font-size:19px;line-height:1;cursor:pointer;transition:background .15s}
.vcw-x:hover{background:rgba(255,255,255,.14)}

/* ---------- Reactive orb (canvas) ---------- */
.vcw-orb{display:block;width:200px;height:200px;margin:2px auto 0}

.vcw-status{margin:0 0 2px;font-size:15px;font-weight:600;text-shadow:0 0 18px color-mix(in srgb,var(--vcw-a) 60%,transparent)}
.vcw-timer{min-height:1.5em;margin:0 0 12px;color:var(--vcw-a);font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:14px;letter-spacing:.22em;font-variant-numeric:tabular-nums}

/* ---------- Buttons ---------- */
.vcw-btn{position:relative;display:block;width:100%;padding:.9em 1em;border:0;border-radius:14px;background:linear-gradient(120deg,var(--vcw-a),var(--vcw-b));color:#05121a;font-family:inherit;font-size:15px;font-weight:800;letter-spacing:.03em;cursor:pointer;box-shadow:0 8px 28px color-mix(in srgb,var(--vcw-a) 35%,transparent);transition:transform .15s ease,box-shadow .2s ease,filter .2s}
.vcw-btn:hover:not(:disabled){transform:translateY(-1px);filter:brightness(1.08);box-shadow:0 12px 34px color-mix(in srgb,var(--vcw-b) 40%,transparent)}
.vcw-btn:disabled{opacity:.6;cursor:progress}
.vcw-root[data-state="live"] .vcw-btn{background:linear-gradient(120deg,#ff3d6b,#ff6a3d);color:#fff;box-shadow:0 8px 28px rgba(255,61,107,.4)}

.vcw-extra{margin:12px 0 0;color:var(--vcw-mut)}
.vcw-extra:empty{display:none}
.vcw-extra a,.vcw-note a{color:var(--vcw-a)}
.vcw-note{margin:14px 0 0;font-size:11.5px;line-height:1.45;color:var(--vcw-mut)}
.vcw-note strong{color:var(--vcw-b)}

@media (prefers-reduced-motion:reduce){
	.vcw-launch,.vcw-launch::before,.vcw-launch::after,.vcw-panel:not([hidden]),.vcw-chip i{animation:none!important}
	.vcw-launch,.vcw-btn{transition:none}
}
