:root{color-scheme:dark light}html,body,#root{height:100%;margin:0}body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Noto Sans,Apple SD Gothic Neo,sans-serif;background:#0b0f14;color:#e6eaf0}.canvas-wrap{position:fixed;inset:0}.topbar{position:fixed;left:12px;top:12px;display:flex;gap:16px;align-items:center;background:#10161f99;border:1px solid #1e2a38;border-radius:12px;padding:12px 16px;backdrop-filter:blur(10px);z-index:1000;min-width:400px}.app-title strong{font-size:16px;color:#e6eaf0}.status-indicators{display:flex;gap:12px;align-items:center}.connection-status{display:flex;align-items:center;gap:6px;font-size:12px;padding:4px 8px;border-radius:6px;background:#ffffff1a}.connection-status.connected{background:#4caf5033;color:#4caf50}.connection-status.connecting{background:#ffc10733;color:#ffc107}.status-dot{width:8px;height:8px;border-radius:50%;background:currentColor;animation:pulse 2s infinite}.connection-status.connected .status-dot{animation:none}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.error-indicator{background:#f4433633;color:#f44336;padding:4px 8px;border-radius:6px;font-size:11px}.reconnect-btn{background:#1a2433;border:1px solid #2b3a4f;padding:6px 10px;border-radius:8px;cursor:pointer;font-size:11px;color:#e6eaf0;transition:all .2s ease}.reconnect-btn:hover{background:#233146;border-color:#4caf50}.disconnect-btn{background:#dc3545;border:1px solid #dc3545;padding:6px 10px;border-radius:8px;cursor:pointer;font-size:11px;color:#fff;transition:all .2s ease}.disconnect-btn:hover{background:#c82333;border-color:#bd2130}.avatar-selection-panel{position:fixed;top:80px;left:20px;background:#000000e6;color:#fff;padding:20px;border-radius:12px;max-width:320px;z-index:1000;backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1)}.avatar-selection-panel h3{margin:0 0 16px;color:#4caf50;font-size:16px;text-align:center}.avatar-grid{display:flex;flex-direction:column;gap:12px}.avatar-option{display:flex;align-items:center;gap:12px;padding:12px;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:8px;cursor:pointer;transition:all .2s ease;position:relative}.avatar-option:hover{background:#ffffff1a;border-color:#4caf5080}.avatar-option.selected{background:#4caf5033;border-color:#4caf50}.avatar-preview{width:40px;height:40px;background:#4caf5033;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:20px}.avatar-option.selected .avatar-preview{background:#4caf5066}.avatar-info{flex:1}.avatar-name{font-weight:700;font-size:14px;margin-bottom:4px}.avatar-description{font-size:11px;color:#ccc;line-height:1.3}.selected-indicator{position:absolute;right:12px;top:50%;transform:translateY(-50%);color:#4caf50;font-size:18px;font-weight:700}.ai-settings-panel{position:fixed;top:80px;right:20px;background:#000000e6;color:#fff;padding:0;border-radius:12px;max-width:400px;z-index:1000;backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);overflow:hidden}.panel-header{display:flex;justify-content:space-between;align-items:center;padding:20px;cursor:pointer;background:#4caf501a;border-bottom:1px solid rgba(76,175,80,.3);transition:background .2s ease}.panel-header:hover{background:#4caf5026}.panel-header h3{margin:0;color:#4caf50;font-size:16px}.expand-icon{font-size:14px;color:#4caf50;transition:transform .2s ease}.expand-icon.expanded{transform:rotate(180deg)}.ai-settings-panel .settings-grid{padding:20px;display:grid;grid-template-columns:1fr;gap:12px;margin-bottom:15px}.setting-item{display:flex;flex-direction:column;gap:5px}.setting-item label{font-size:12px;color:#ccc;font-weight:700}.setting-item input,.setting-item select{padding:8px;border:1px solid #555;border-radius:5px;background:#ffffff1a;color:#fff;font-size:12px}.setting-item input:focus,.setting-item select:focus{outline:none;border-color:#4caf50;background:#ffffff26}.setting-item input::placeholder{color:#999}.current-ai-info{background:#4caf501a;border:1px solid rgba(76,175,80,.3);border-radius:5px;padding:10px;font-size:11px;line-height:1.4;margin:0 20px 20px}.current-ai-info strong{color:#4caf50}button{all:unset;background:#1a2433;border:1px solid #2b3a4f;padding:8px 10px;border-radius:10px;cursor:pointer}button:hover{background:#233146}.badge{opacity:.7;font-size:12px}