/* 10-29 컴온 — 비토의 손(빛줄기). 일할 때만 생기는 캔버스 한 장. */
.cmo-light{position:fixed;inset:0;width:100vw;height:100vh;z-index:2147483000;pointer-events:none;opacity:0}
.cmo-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* 비토 목소리 — 구체 위 투명 단추와 안내 한 줄 */
.vv-orb{position:absolute;z-index:3;border-radius:50%;background:transparent;border:0;cursor:pointer;-webkit-tap-highlight-color:transparent}
.vv-orb:focus-visible{outline:2px solid rgba(108,243,163,.7);outline-offset:6px}
.vv-hint{display:inline-flex;align-items:center;gap:10px;margin-top:22px;padding:8px 14px 8px 12px;border-radius:999px;border:1px solid rgba(108,243,163,.35);background:rgba(16,8,35,.55);color:#e9fff2;font:500 12px/1.3 "Fragment Mono",ui-monospace,monospace;letter-spacing:.04em;cursor:pointer;pointer-events:auto;max-width:min(420px,calc(100vw - 48px))}
.vv-dot{flex:none;width:8px;height:8px;border-radius:50%;background:#6cf3a3;box-shadow:0 0 0 0 rgba(108,243,163,.6);animation:vv-ping 2.4s ease-out infinite}
[data-vv="listening"] .vv-dot{animation-duration:.9s;background:#fff}
[data-vv="speaking"] .vv-hint,[data-vv="thinking"] .vv-hint{border-color:rgba(108,243,163,.7)}
.vv-say{text-wrap:pretty;word-break:keep-all}
@keyframes vv-ping{0%{box-shadow:0 0 0 0 rgba(108,243,163,.6)}70%,100%{box-shadow:0 0 0 10px rgba(108,243,163,0)}}
.vv-heard{min-height:1.4em;margin-top:10px;max-width:min(420px,calc(100vw - 48px));color:#b2a6c6;font-size:14px;line-height:1.5;word-break:keep-all;pointer-events:auto}
.vv-chip{margin:6px 6px 0 0;padding:6px 12px;border-radius:999px;border:1px solid rgba(108,243,163,.45);background:rgba(108,243,163,.08);color:#e9fff2;font:inherit;font-size:13px;cursor:pointer}
.vv-chip:hover{background:rgba(108,243,163,.2)}
@media (prefers-reduced-motion:reduce){.vv-dot{animation:none}}