:root{--bg-primary: #0a0a0f;--bg-secondary: #12121a;--bg-glass: rgba(18, 18, 26, .8);--text-primary: #ffffff;--text-secondary: #a0a0b0;--accent: #6366f1;--accent-glow: rgba(99, 102, 241, .4);--success: #22c55e;--warning: #f59e0b;--error: #ef4444;--border-radius: 16px;--transition: all .3s cubic-bezier(.4, 0, .2, 1)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;overflow:hidden}body{font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;background:radial-gradient(circle at 50% 30%,#2a2a35,#1a1a20 40%,#000);color:var(--text-primary);line-height:1.5}#avatar-container{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1}#avatar-canvas{width:100%;height:100%;display:block}#avatar-selector{position:fixed;top:24px;right:24px;display:flex;align-items:center;gap:10px;padding:10px 16px;background:var(--bg-glass);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);border-radius:12px;z-index:100}#avatar-selector label{font-size:13px;font-weight:500;color:var(--text-secondary)}#avatar-select{padding:8px 12px;background:var(--bg-secondary);border:1px solid rgba(255,255,255,.15);border-radius:8px;color:var(--text-primary);font-size:13px;font-family:inherit;cursor:pointer;outline:none;transition:var(--transition)}#avatar-select:hover{border-color:var(--accent)}#avatar-select:focus{border-color:var(--accent);box-shadow:0 0 10px var(--accent-glow)}#avatar-select option{background:var(--bg-secondary);color:var(--text-primary)}#avatar-select optgroup{font-weight:600;color:var(--accent)}#toggle-ui-btn{position:fixed;top:24px;right:24px;width:48px;height:48px;padding:0;background:#0f172ab3;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);border-radius:50%;color:#fff;font-size:20px;cursor:pointer;z-index:200;transition:var(--transition);display:flex;align-items:center;justify-content:center}#toggle-ui-btn:hover{background:#6366f180;transform:scale(1.1)}body.ui-hidden .ui-element,body.ui-hidden #chat-container,body.ui-hidden #loading-overlay{opacity:0;pointer-events:none;transition:opacity .3s ease}body.ui-hidden #toggle-ui-btn{opacity:.5}body.ui-hidden #toggle-ui-btn:hover{opacity:1}#webhook-simulate-btn{position:fixed;top:24px;left:24px;padding:12px 20px;background:linear-gradient(135deg,var(--accent),#8b5cf6);border:none;border-radius:12px;color:#fff;font-size:14px;font-weight:600;font-family:inherit;cursor:pointer;z-index:100;transition:var(--transition);box-shadow:0 4px 15px #6366f166}#webhook-simulate-btn:hover{transform:translateY(-2px);box-shadow:0 6px 25px #6366f199}#webhook-simulate-btn:active{transform:translateY(0)}#webhook-simulate-btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.toggle-group{display:flex;align-items:center;gap:8px;margin-left:16px;padding-left:16px;border-left:1px solid rgba(255,255,255,.15)}.toggle-switch{position:relative;display:inline-block;width:44px;height:24px}.toggle-switch input{opacity:0;width:0;height:0}.toggle-slider{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--bg-secondary);border:1px solid rgba(255,255,255,.1);border-radius:24px;cursor:pointer;transition:var(--transition)}.toggle-slider:before{content:"";position:absolute;height:18px;width:18px;left:2px;bottom:2px;background:var(--text-secondary);border-radius:50%;transition:var(--transition)}.toggle-switch input:checked+.toggle-slider{background:var(--accent);border-color:var(--accent);box-shadow:0 0 12px var(--accent-glow)}.toggle-switch input:checked+.toggle-slider:before{transform:translate(20px);background:#fff}.toggle-label{font-size:12px;color:var(--text-secondary);white-space:nowrap}#status-indicator{position:fixed;top:24px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:10px;padding:10px 20px;background:var(--bg-glass);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.1);border-radius:100px;z-index:100;transition:var(--transition)}.status-dot{width:10px;height:10px;border-radius:50%;background:var(--success);box-shadow:0 0 10px var(--success);animation:pulse 2s infinite}.status-dot.thinking{background:var(--warning);box-shadow:0 0 10px var(--warning);animation:pulse .5s infinite}.status-dot.speaking{background:var(--accent);box-shadow:0 0 10px var(--accent);animation:pulse .3s infinite}.status-dot.warning{background:var(--warning);box-shadow:0 0 10px var(--warning);animation:none}.status-dot.error{background:var(--error);box-shadow:0 0 10px var(--error);animation:none}.status-text{font-size:14px;font-weight:500;color:var(--text-secondary)}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(.9)}}#chat-container{position:fixed;bottom:20px;left:20px;width:280px;max-width:30vw;padding:10px;background:var(--bg-glass);-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border:1px solid rgba(255,255,255,.1);border-radius:12px;z-index:100;transform-origin:bottom left;transform:scale(.9)}#chat-messages{max-height:100px;overflow-y:auto;margin-bottom:8px;padding:0;display:flex;flex-direction:column;gap:6px;scrollbar-width:thin;scrollbar-color:var(--accent) transparent}#chat-messages::-webkit-scrollbar{width:2px}#chat-messages::-webkit-scrollbar-thumb{background:var(--accent);border-radius:2px}.message{max-width:100%;padding:6px 10px;border-radius:8px;font-size:12px;line-height:1.3;animation:fadeSlideUp .3s ease-out;position:relative}.emotion-dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;box-shadow:0 0 5px #fff6}.emotion-dot.happy{background-color:gold;box-shadow:0 0 5px gold}.emotion-dot.sad{background-color:#4682b4;box-shadow:0 0 5px #4682b4}.emotion-dot.angry{background-color:#ff4500;box-shadow:0 0 5px #ff4500}.emotion-dot.surprised{background-color:#ff69b4;box-shadow:0 0 5px #ff69b4}.emotion-dot.thinking{background-color:#9370db;box-shadow:0 0 5px #9370db}.emotion-dot.neutral{background-color:#a9a9a9;box-shadow:0 0 5px #a9a9a9}.message.user{align-self:flex-end;background:var(--accent);color:#fff;border-bottom-right-radius:4px}.message.assistant{align-self:flex-start;background:#ffffff14;border:1px solid rgba(255,255,255,.1);border-bottom-left-radius:4px}@keyframes fadeSlideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}#chat-form{width:100%;margin:0}.input-wrapper{display:flex;gap:8px;padding:5px;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:25px;transition:var(--transition)}.input-wrapper:focus-within{border-color:var(--accent);box-shadow:0 0 10px var(--accent-glow)}#chat-input{flex:1;padding:8px 12px;background:transparent;border:none;outline:none;color:var(--text-primary);font-size:13px;font-family:inherit}#chat-input::placeholder{color:var(--text-secondary)}#send-button{width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:var(--accent);border:none;border-radius:50%;cursor:pointer;transition:var(--transition)}#send-button:hover{transform:scale(1.05);box-shadow:0 0 20px var(--accent-glow)}#send-button:active{transform:scale(.95)}#send-button:disabled{opacity:.5;cursor:not-allowed;transform:none}#send-button svg{width:20px;height:20px;color:#fff}#loading-overlay{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;background:var(--bg-primary);z-index:1000;transition:opacity .5s ease-out}#loading-overlay.hidden{opacity:0;pointer-events:none}.loader{width:60px;height:60px;border:3px solid var(--bg-secondary);border-top-color:var(--accent);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}#loading-overlay p{color:var(--text-secondary);font-size:14px}@media(max-width:640px){#chat-container{padding:16px 16px 24px}.message{max-width:90%}#chat-input{font-size:14px;padding:10px 16px}#send-button{width:44px;height:44px}}