:root{color-scheme:dark;font-family:Outfit,Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:radial-gradient(circle at 50% 50%,#15152a,#0a0a14);color:#e4e4e7;--primary-neon: #6366f1;--secondary-neon: #ec4899;--accent-cyan: #06b6d4;--glass-bg: rgba(25, 25, 45, .6);--glass-border: rgba(255, 255, 255, .08)}body,html,#root{min-height:100vh;margin:0;overflow-x:hidden}.app-shell{max-width:1400px;margin:0 auto;padding:40px 24px}header{text-align:center;margin-bottom:48px;animation:fadeInDown .8s ease-out}header h1{margin:0 0 12px;font-size:3rem;font-weight:700;background:linear-gradient(135deg,var(--primary-neon) 0%,var(--secondary-neon) 50%,var(--accent-cyan) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;letter-spacing:-.05em;text-shadow:0 0 40px rgba(99,102,241,.25)}header p{margin:0;color:#9ca3af;font-size:1.15rem;letter-spacing:.05em}.dashboard-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:28px;align-items:start}@media (max-width: 1024px){.dashboard-grid{grid-template-columns:1fr}}.glass-panel{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:24px;padding:28px;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:0 12px 40px #0000004d;margin-bottom:28px;transition:all .3s cubic-bezier(.4,0,.2,1)}.glass-panel:hover{border-color:#6366f133;box-shadow:0 12px 40px #6366f114}.glass-panel h2{margin-top:0;margin-bottom:20px;font-size:1.4rem;font-weight:600;display:flex;align-items:center;gap:10px;background:linear-gradient(to right,#fff,#9ca3af);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.chat-viewport{height:420px;overflow-y:auto;border-radius:16px;background:#0a0a1466;border:1px solid rgba(255,255,255,.04);padding:20px;margin-bottom:20px;display:flex;flex-direction:column;gap:16px}.chat-bubble{max-width:80%;padding:14px 18px;border-radius:18px;line-height:1.6;font-size:.98rem;animation:scaleUp .3s cubic-bezier(.175,.885,.32,1.275) both}.chat-bubble.user{align-self:flex-end;background:linear-gradient(135deg,var(--primary-neon) 0%,rgba(99,102,241,.7) 100%);color:#fff;border-bottom-right-radius:4px;box-shadow:0 4px 15px #6366f133}.chat-bubble.assistant{align-self:flex-start;background:#ffffff0f;color:#e4e4e7;border-bottom-left-radius:4px;border:1px solid rgba(255,255,255,.05)}.chat-bubble.assistant em{font-style:italic;color:#cbd5e1;background:#6366f126;padding:2px 6px;border-radius:4px;border:1px solid rgba(99,102,241,.2);margin:0 4px}.dialogue-control-row{display:flex;gap:12px}.dialogue-control-row input{flex:1;margin-top:0}input,textarea{width:100%;padding:14px 16px;border-radius:14px;border:1px solid rgba(255,255,255,.1);background:#0a0a12b3;color:#fff;font-size:.98rem;transition:all .25s ease}input:focus,textarea:focus{outline:none;border-color:var(--primary-neon);box-shadow:0 0 15px #6366f140}button{cursor:pointer;background:linear-gradient(135deg,var(--primary-neon) 0%,var(--secondary-neon) 100%);color:#fff;border:none;font-weight:600;padding:14px 28px;border-radius:14px;font-size:1rem;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 20px #ec489926}button:hover{transform:translateY(-2px);box-shadow:0 6px 24px #ec48994d;filter:brightness(1.1)}button:active{transform:translateY(0)}button:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}.video-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}.capture-video,.capture-canvas{width:100%;height:200px;border-radius:16px;background:#08080f;object-fit:cover;border:1px solid rgba(255,255,255,.05)}.status{font-size:.9rem;color:#9ca3af;margin:10px 0;display:flex;align-items:center;gap:6px}.status:before{content:"";display:inline-block;width:8px;height:8px;background-color:var(--accent-cyan);border-radius:50%;box-shadow:0 0 10px var(--accent-cyan)}.feature-box{background:#0a0a1480;border-radius:14px;padding:16px;border:1px solid rgba(255,255,255,.04)}.energy-bar-container{margin-top:12px}.energy-bar-label{display:flex;justify-content:space-between;font-size:.85rem;color:#cbd5e1;margin-bottom:6px}.energy-bar{height:8px;background:#ffffff1a;border-radius:99px;overflow:hidden}.energy-bar-fill{height:100%;background:linear-gradient(to right,var(--accent-cyan),var(--primary-neon));border-radius:99px;transition:width .4s cubic-bezier(.075,.82,.165,1);box-shadow:0 0 8px #06b6d480}.topology-container{height:380px;border-radius:18px;background:radial-gradient(circle at center,#112,#07070d);border:1px solid rgba(255,255,255,.05);position:relative;overflow:hidden;margin-top:12px}.topology-canvas{width:100%;height:100%;display:block}.diagnostics-panel{display:flex;gap:16px;margin-top:16px}.diag-stat-card{flex:1;background:#ffffff08;border:1px solid rgba(255,255,255,.05);border-radius:12px;padding:12px;text-align:center}.diag-stat-card .value{font-size:1.5rem;font-weight:700;color:var(--secondary-neon);margin-top:4px}.diag-stat-card .label{font-size:.78rem;color:#9ca3af}.config-group{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:20px}.config-group label{margin-bottom:0}.error-box{background:#ef444426;color:#fca5a5;border:1px solid rgba(239,68,68,.3);border-radius:14px;padding:14px;margin-top:16px;font-size:.92rem}.response-box{background:#0a0a14cc;border:1px solid rgba(255,255,255,.05);padding:18px;border-radius:16px;margin-top:18px;font-size:.85rem;color:#9ca3af;overflow-x:auto}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:#ffffff03}::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:99px}::-webkit-scrollbar-thumb:hover{background:#fff3}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes scaleUp{0%{opacity:0;transform:scale(.95) translateY(10px)}to{opacity:1;transform:scale(1) translateY(0)}}.cockpit-grid{display:grid;grid-template-columns:1.4fr .9fr;gap:28px;align-items:start}@media (max-width: 1100px){.cockpit-grid{grid-template-columns:1fr}}.cockpit-main,.cockpit-side{display:flex;flex-direction:column}.chat-panel{margin-bottom:28px}.bubble-meta{display:flex;align-items:center;gap:8px;margin-top:6px;justify-content:flex-end}.bubble-expression{font-size:.75rem;color:#ffffff80}.bubble-time{font-size:.72rem;color:#ffffff59;font-variant-numeric:tabular-nums}.loading-bubble{display:flex;align-items:center;gap:6px;padding:14px 20px!important}.typing-dot{width:8px;height:8px;border-radius:50%;background:var(--accent-cyan);display:inline-block;animation:typingPulse 1.2s ease-in-out infinite}.typing-dot:nth-child(2){animation-delay:.2s}.typing-dot:nth-child(3){animation-delay:.4s}@keyframes typingPulse{0%,80%,to{opacity:.3;transform:scale(.85)}40%{opacity:1;transform:scale(1.2)}}.send-btn{flex-shrink:0;padding:0 24px;min-width:80px;align-self:stretch;border-radius:14px;font-size:1rem}.header-badge-row{display:flex;justify-content:center;gap:12px;margin-bottom:16px;flex-wrap:wrap}.backend-badge,.facial-badge{font-size:.82rem;padding:4px 14px;border-radius:99px;font-weight:500;letter-spacing:.03em;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.backend-badge.online{background:#22c55e26;color:#86efac;border:1px solid rgba(34,197,94,.3)}.backend-badge.offline{background:#ef444426;color:#fca5a5;border:1px solid rgba(239,68,68,.3)}.backend-badge.checking{background:#f59e0b26;color:#fde68a;border:1px solid rgba(245,158,11,.3)}.facial-badge{background:#6366f126;color:#a5b4fc;border:1px solid rgba(99,102,241,.25)}.form-label{display:block;font-size:.78rem;color:#9ca3af;margin-bottom:6px;letter-spacing:.04em;text-transform:uppercase}.session-info{display:flex;flex-direction:column}.session-id-display{font-size:.78rem;color:#6366f1;background:#6366f114;border:1px solid rgba(99,102,241,.15);border-radius:10px;padding:12px 14px;font-family:Courier New,monospace;word-break:break-all;flex:1;display:flex;align-items:center}.expression-display{display:flex;align-items:center;gap:14px;margin-bottom:14px}.expression-emoji{font-size:2.6rem;line-height:1;filter:drop-shadow(0 0 8px rgba(99,102,241,.4))}.expression-name{font-size:1.25rem;font-weight:700;color:#e4e4e7}.expression-sub{font-size:.78rem;color:#9ca3af;margin-top:2px}.btn-sm{padding:8px 16px!important;font-size:.85rem!important;border-radius:10px!important}.action-row{display:flex;align-items:center;gap:12px;margin-bottom:14px;flex-wrap:wrap}.device-label{font-size:.82rem;color:#9ca3af;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.badge-ready{font-size:.75rem;padding:3px 10px;border-radius:99px;background:#22c55e26;color:#86efac;border:1px solid rgba(34,197,94,.25);white-space:nowrap}.graph-stats-row{display:flex;align-items:center;gap:16px;margin-bottom:12px}.graph-stat{font-size:.85rem;color:#9ca3af}.graph-stat-val{font-size:1.05rem;font-weight:700;color:var(--accent-cyan);margin-right:3px}.graph-stat-hint{font-size:.75rem;color:#9ca3af80;margin-left:auto}.diag-feedback{margin-top:16px;background:#0a0a1480;border:1px solid rgba(255,255,255,.05);border-radius:12px;padding:14px 16px}.diag-feedback-label{font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;color:#9ca3af;margin-bottom:6px}.diag-feedback-text{font-size:.9rem;color:#cbd5e1;line-height:1.6}.diag-empty{margin-top:16px;font-size:.88rem;color:#9ca3af99;text-align:center;padding:12px 0}.form-card{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:24px;padding:28px;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);margin-bottom:28px}label{display:flex;flex-direction:column;gap:6px;color:#d1d5db;font-size:.92rem}.mode-toggle-group{display:flex;flex-direction:column}.mode-switches{display:flex;background:#0a0a12b3;border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:4px}.toggle-btn{flex:1;background:transparent;box-shadow:none;font-size:.85rem;padding:8px 12px;border-radius:9px;color:#9ca3af}.toggle-btn:hover{transform:none;box-shadow:none;color:#fff}.toggle-btn.active{background:linear-gradient(135deg,var(--primary-neon) 0%,rgba(99,102,241,.8) 100%);color:#fff;box-shadow:0 4px 12px #6366f133}.preset-scenes-section{background:#0a0a1466;border:1px solid rgba(255,255,255,.05);border-radius:16px;padding:16px;margin-bottom:20px}.preset-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin-top:8px}.preset-btn{display:flex;align-items:center;gap:10px;background:#ffffff08;border:1px solid rgba(255,255,255,.06);padding:10px;border-radius:12px;text-align:left;transition:all .25s cubic-bezier(.4,0,.2,1);box-shadow:none}.preset-btn:hover:not(:disabled){background:#6366f11a;border-color:#6366f166;transform:translateY(-2px);box-shadow:0 4px 15px #6366f126}.preset-emoji{font-size:1.6rem;line-height:1}.preset-info{display:flex;flex-direction:column}.preset-title{font-size:.85rem;font-weight:600;color:#e4e4e7}.preset-desc{font-size:.72rem;color:#9ca3af;margin-top:1px}.input-override-row{margin-bottom:16px}.override-select-group{display:flex;flex-direction:column;max-width:200px}.override-select{padding:8px 12px;border-radius:10px;border:1px solid rgba(255,255,255,.1);background:#0a0a12b3;color:#fff;font-size:.85rem;cursor:pointer;outline:none}.override-select:focus{border-color:var(--accent-cyan)}.comparison-row-wrapper{display:flex;flex-direction:column;gap:16px;margin-bottom:24px;width:100%;animation:scaleUp .35s cubic-bezier(.175,.885,.32,1.1) both}.comparison-bubbles-container{display:grid;grid-template-columns:1fr 1fr;gap:18px}@media (max-width: 768px){.comparison-bubbles-container{grid-template-columns:1fr}}.comparison-bubble-col{display:flex;flex-direction:column;background:#0a0a144d;border:1px solid rgba(255,255,255,.04);border-radius:20px;padding:16px;transition:all .3s ease}.comparison-bubble-col.base{border-left:3px solid #6b7280}.comparison-bubble-col.awakened{border-left:3px solid var(--secondary-neon);background:#6366f108;box-shadow:0 8px 32px #6366f10a}.comparison-bubble-col:hover{border-color:#ffffff1a;background:#ffffff05}.comparison-bubble-col.awakened:hover{border-color:#ec48994d;background:#6366f10d}.col-header{font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;margin-bottom:12px;color:#9ca3af;display:flex;align-items:center;gap:6px}.comparison-bubble-col.awakened .col-header{color:#f472b6;text-shadow:0 0 10px rgba(236,72,153,.2)}.comparison-bubble-box{font-size:.95rem;line-height:1.6;color:#e4e4e7;flex:1}.mini-score-bar{display:flex;gap:12px;margin-top:14px;font-size:.72rem;color:#9ca3af;border-top:1px solid rgba(255,255,255,.05);padding-top:10px}.mini-score-bar.color-awakened{color:#a5b4fc}.comparison-metric-chart{background:#0f0f1e99;border:1px solid rgba(255,255,255,.05);border-radius:16px;padding:16px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.metric-chart-header{font-size:.85rem;font-weight:600;color:#cbd5e1;margin-bottom:14px;border-left:3px solid var(--accent-cyan);padding-left:8px}.metric-bars-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}@media (max-width: 640px){.metric-bars-grid{grid-template-columns:1fr}}.metric-progress-item{display:flex;flex-direction:column;gap:6px}.metric-progress-labels{display:flex;justify-content:space-between;align-items:center}.metric-name{font-size:.78rem;color:#9ca3af;font-weight:500}.metric-values-diff{font-size:.75rem;font-family:monospace}.val-base{color:#9ca3af}.vs-sep{color:#fff3;margin:0 4px}.val-awakened{color:#818cf8;font-weight:600}.val-gain{color:#34d399;font-weight:600;margin-left:2px}.dual-progress-bar{display:flex;flex-direction:column;gap:4px}.progress-row{display:flex;align-items:center;gap:8px}.bar-tag{font-size:.65rem;color:#6b7280;width:42px;text-align:right;white-space:nowrap}.bar-tag.awakened-tag{color:#ec4899}.progress-track{flex:1;height:6px;background:#ffffff0d;border-radius:99px;overflow:hidden}.progress-fill{height:100%;border-radius:99px;transition:width .8s cubic-bezier(.19,1,.22,1)}.fill-base{background:#6b7280}.fill-awakened{background:linear-gradient(to right,var(--primary-neon),var(--secondary-neon));box-shadow:0 0 8px #6366f166}.avatar-container{margin-bottom:24px;position:relative;overflow:hidden;border:1px solid rgba(56,189,248,.3);background:radial-gradient(circle at 50% 20%,#0f172afa,#030712fc);box-shadow:0 12px 40px #38bdf81a;border-radius:20px;padding:20px}.avatar-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;flex-wrap:wrap;gap:12px}.avatar-title-group{display:flex;align-items:center;gap:12px}.avatar-title-group h2{font-size:1.15rem;font-weight:700;margin-bottom:0;background:linear-gradient(135deg,#38bdf8,#a855f7);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.status-pill{font-size:.75rem;padding:3px 12px;border-radius:99px;background:#ffffff0d;color:#94a3b8;border:1px solid rgba(255,255,255,.08);transition:all .3s ease}.status-pill.active{background:#38bdf826;color:#7dd3fc;border-color:#38bdf866;box-shadow:0 0 14px #38bdf859}.mode-selector{display:flex;gap:4px;background:#00000080;padding:4px;border-radius:12px;border:1px solid rgba(255,255,255,.08)}.btn-mode{padding:6px 12px!important;font-size:.78rem!important;border-radius:8px!important;background:transparent!important;color:#94a3b8!important;border:none!important;box-shadow:none!important}.btn-mode:hover{color:#fff!important}.btn-mode.active{background:#38bdf840!important;color:#7dd3fc!important;border:1px solid rgba(56,189,248,.4)!important;box-shadow:0 0 12px #38bdf840!important}.avatar-stage{width:100%;height:250px;border-radius:16px;background:radial-gradient(circle at center,#090d16,#030509);border:1px solid rgba(255,255,255,.08);position:relative;overflow:hidden;display:flex;justify-content:center;align-items:center}.canvas-wrapper{width:100%;height:100%;position:relative;display:flex;justify-content:center;align-items:center}.avatar-canvas{width:360px;height:250px;display:block}.action-floating-badge{position:absolute;top:48px;left:50%;transform:translate(-50%);background:#0f172ae6;border:1px solid rgba(234,179,8,.6);color:#fef08a;padding:5px 16px;border-radius:99px;font-size:.78rem;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 4px 18px #eab3084d;pointer-events:none;white-space:nowrap;z-index:10}.action-floating-badge span{font-weight:600;color:#fff}.broadcast-caption-bar{position:absolute;bottom:22px;left:16px;right:16px;background:#030712d9;border:1px solid rgba(56,189,248,.3);border-radius:10px;padding:6px 14px;display:flex;align-items:center;gap:10px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 6px 20px #0009;animation:fadeInDown .3s ease;z-index:10}.caption-tag{background:#ef4444;color:#fff;font-size:.65rem;font-weight:800;padding:2px 6px;border-radius:4px;letter-spacing:.05em}.caption-text{font-size:.82rem;color:#e2e8f0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}.xiaoice-wrapper{width:100%;height:100%;display:flex;justify-content:center;align-items:center}.xiaoice-placeholder{text-align:center;padding:24px;color:#94a3b8}.xiaoice-logo{font-size:2.8rem;margin-bottom:8px;animation:pulse 2s infinite ease-in-out}.xiaoice-sub{font-size:.75rem;color:#64748b;display:block;margin-top:6px}.speech-controls{margin-top:16px;display:flex;flex-direction:column;gap:12px}.control-row{display:flex;gap:12px}.btn-primary-action{flex:1;background:linear-gradient(135deg,#0284c7,#0369a1)!important;color:#fff!important;font-weight:600;padding:11px 18px!important;border-radius:12px!important;border:1px solid rgba(56,189,248,.4)!important;box-shadow:0 4px 15px #0284c740!important}.btn-primary-action.speaking{background:linear-gradient(135deg,#eab308,#ca8a04)!important;border-color:#eab30880!important;box-shadow:0 4px 20px #eab30859!important}.btn-secondary-action{background:#ffffff0d!important;color:#cbd5e1!important;border:1px solid rgba(255,255,255,.1)!important;padding:11px 16px!important;border-radius:12px!important;box-shadow:none!important}.voice-settings-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;background:#00000059;padding:12px;border-radius:12px;border:1px solid rgba(255,255,255,.05)}.voice-label,.rate-label{display:flex;flex-direction:column;gap:4px;font-size:.78rem;color:#94a3b8}.voice-select{background:#0f172ad9;border:1px solid rgba(255,255,255,.12);color:#e2e8f0;padding:6px 10px;border-radius:8px;font-size:.78rem;outline:none}.rate-slider{accent-color:#38bdf8;cursor:pointer}