/* 延续现有通话深色样式，角色居中，字幕和操作区保留独立空间。 */
.vc-call .call-bg-upload, .vc-call .call-avatar { display: none; }
.vc-call .call-bg { opacity: 1; }
.vc-character { position: absolute; inset: 0; z-index: 1; overflow: hidden; }
.vc-portrait { position: absolute; width: 100%; height: 100%; object-fit: cover; object-position: center 30%; opacity: 0; transform: scale(1.015); transition: opacity .25s, transform .25s; }
.vc-portrait.visible { opacity: 1; transform: scale(1); }
.vc-call[data-state="idle"] .vc-portrait.visible { animation: vc-breathe 7s ease-in-out infinite alternate; }
@keyframes vc-breathe { to { transform: scale(1.025); } }
.vc-call .call-bg-overlay { z-index: 2; background: linear-gradient(180deg,rgba(0,0,0,.56),transparent 38%,rgba(0,0,0,.55) 64%,rgba(0,0,0,.92)); }
.vc-call .call-top { align-items: flex-start; padding: 22px 140px 12px 20px; gap: 5px; }
.vc-call .call-friend-name { font-size: 20px; letter-spacing: 0; }
.vc-call .call-status-text { font-size: 12px; color: #eee; }
.vc-preview { position: absolute; z-index: 7; right: 14px; top: 18px; width: 108px; height: 144px; border-radius: 14px; overflow: hidden; background: #25282c; border: 1px solid #ffffff55; }
.vc-self { width: 100%; height: 100%; object-fit: cover; }
.vc-camera-status { position: absolute; bottom: 0; left: 0; right: 0; padding: 7px 5px; color: #fff; font-size: 10px; line-height: 1.5; text-align: center; background: #000b; }
.vc-role-status { position: absolute; top: 100px; left: 20px; max-width: calc(100% - 160px); z-index: 5; color: #fff; font-size: 12px; text-shadow: 0 1px 4px #000; }
.vc-tools { position: absolute; top: 175px; right: 14px; display: flex; gap: 5px; z-index: 7; }
.vc-tools button { padding: 8px; border: 1px solid #ffffff60; border-radius: 9px; background: #17191fdb; color: #fff; font: inherit; font-size: 11px; min-height: 36px; cursor: pointer; }
.vc-call .call-bubbles { flex: 0 1 27%; min-height: 70px; margin-top: auto; }
.vc-call .call-actions { padding-top: 12px; padding-bottom: max(20px, env(safe-area-inset-bottom)); }
.vc-call .call-actions.hidden { display: flex !important; margin-top: auto; }
.vc-call .call-action-btn:disabled { opacity: .4; pointer-events: none; }
.vc-call .call-input-bar { flex-shrink: 0; }
.vc-editor { position: fixed; inset: 0; z-index: 100050; display: flex; align-items: center; justify-content: center; padding: 14px; background: #000a; font-family: var(--font, sans-serif); color: #eef1f5; }
.vc-sheet { background: #24282d; width: 100%; max-width: 520px; max-height: calc(100dvh - 28px); overflow-y: auto; overscroll-behavior: contain; padding: 20px; border-radius: 20px; box-sizing: border-box; }
.vc-sheet header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.vc-sheet h2 { font-size: 19px; margin: 0; }
.vc-sheet p { font-size: 12px; line-height: 1.7; color: #c4cbd4; }
.vc-sheet button { background: #353e48; color: #fff; border: 1px solid #637080; border-radius: 9px; padding: 9px 11px; cursor: pointer; font: inherit; font-size: 12px; min-height: 36px; }
.vc-sheet button:disabled { opacity: .45; cursor: wait; }
.vc-sheet button:active, .vc-tools button:active { transform: scale(.97); }
.vc-sheet button:focus-visible, .vc-sheet textarea:focus-visible, .vc-tools button:focus-visible { outline: 2px solid #a9d5ee; outline-offset: 3px; }
.vc-reference { display: flex; gap: 14px; margin: 20px 0; align-items: center; }
.vc-reference img { width: 78px; height: 92px; object-fit: cover; border-radius: 12px; background: #353e48; font-size: 12px; }
.vc-reference p { margin: 5px 0 8px; }
.vc-reference button { margin: 2px 4px 2px 0; }
.vc-sheet label { display: block; font-size: 13px; margin-bottom: 8px; }
.vc-sheet textarea { box-sizing: border-box; width: 100%; color: #fff; background: #1a1f24; border: 1px solid #637080; border-radius: 10px; padding: 10px; font: inherit; font-size: 13px; resize: vertical; }
.vc-sheet textarea::placeholder { color: #b3bdc8; }
.vc-generate { display: flex; gap: 8px; margin-top: 12px; }
.vc-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; margin: 18px 0; }
.vc-cell { min-width: 0; }
.vc-cell img, .vc-cell video { width: 100%; aspect-ratio: 1; object-fit: cover; background: #353e48; border-radius: 12px; display: block; font-size: 12px; }
.vc-cell strong { display: block; font-size: 13px; margin: 8px 0; }
.vc-cell button { padding: 6px 7px; margin-right: 4px; min-height: 34px; font-size: 11px; }
.vc-sheet footer { display: flex; justify-content: flex-end; gap: 10px; padding-top: 8px; }
.vc-sheet [data-save], .vc-sheet [data-generate] { background: #badced; border-color: #badced; color: #182833; font-weight: 600; }
.vc-editor-status { min-height: 20px; color: #deebf4 !important; }
.vc-editor-status.vc-error { color: #ff9a9a !important; font-weight: 600; }
@media (max-height: 600px) { .vc-preview { width: 80px; height: 105px; } .vc-tools { top: 130px; } .vc-call .call-top { padding-top: 12px; } .vc-call .call-actions { padding-bottom: 10px; } .vc-call .call-action-btn { width: 46px; height: 46px; } }
@media (prefers-reduced-motion: reduce) { .vc-portrait, .vc-call .vc-portrait.visible { animation: none; transition: none; transform: none; } }