@import "https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;600;700&family=Inter:wght@300;400;500&display=swap";:root{--bg:#0d0b0e;--bg-card:#161218;--bg-input:#1e1820;--border:#2a2230;--text:#b8a9c4;--text-dim:#6b5f78;--text-bright:#ede6f2;--accent:#c084fc;--danger:#ef4444;--success:#22c55e;--serif:"Playfair Display", Georgia, "Times New Roman", serif;--sans:"Inter", system-ui, sans-serif;--mono:"JetBrains Mono", ui-monospace, Consolas, monospace}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--sans);background:var(--bg);color:var(--text);min-height:100vh;font-size:14px;line-height:1.5;overflow:hidden}#root{flex-direction:column;height:100vh;display:flex}button{font-family:var(--sans);cursor:pointer;border:1px solid var(--border);background:var(--bg-card);color:var(--text);border-radius:6px;padding:6px 14px;font-size:13px;transition:all .2s}button:hover{background:var(--bg-input);border-color:var(--accent);color:var(--text-bright)}button:disabled{opacity:.4;cursor:default}button.btn-danger{color:var(--danger);border-color:#5c1a1a}button.btn-danger:hover{border-color:var(--danger);background:#2a1010}button.btn-demo{color:var(--accent);border-color:#3b2764}input,select,textarea{font-family:var(--sans);background:var(--bg-input);border:1px solid var(--border);color:var(--text-bright);border-radius:6px;outline:none;width:100%;padding:8px 12px;font-size:13px;transition:border-color .2s}input:focus,select:focus,textarea:focus{border-color:var(--accent)}textarea{resize:vertical}select{cursor:pointer}label{color:var(--text-dim);text-transform:uppercase;letter-spacing:.5px;flex-direction:column;gap:4px;font-size:12px;display:flex}.app{flex-direction:column;height:100vh;display:flex;overflow:hidden}header{border-bottom:1px solid var(--border);background:var(--bg-card);flex-shrink:0;justify-content:space-between;align-items:center;padding:12px 20px;display:flex}header h1{font-family:var(--serif);color:var(--text-bright);letter-spacing:.5px;font-size:22px;font-weight:600}header nav{gap:4px;display:flex}.tab{color:var(--text-dim);background:0 0;border:none;border-radius:6px;padding:6px 16px;font-size:13px;font-weight:500}.tab:hover{color:var(--text);background:var(--bg-input)}.tab.active{color:var(--text-bright);background:var(--bg-input);border:1px solid var(--border)}main{flex-direction:column;flex:1;display:flex;overflow:hidden}.chat-tab{flex-direction:column;height:100%;display:flex;overflow:hidden}.top-bar{border-bottom:1px solid var(--border);background:var(--bg-card);flex-shrink:0;align-items:center;gap:24px;padding:16px 20px;display:flex}.intensity-ring-container{flex-direction:column;align-items:center;gap:4px;display:flex}.mood-label{font-family:var(--serif);text-transform:capitalize;font-size:13px;font-style:italic;transition:color .5s}.connections{flex-wrap:wrap;flex:1;align-items:center;gap:10px;display:flex}.conn-group{align-items:center;gap:6px;display:flex}.conn-label{color:var(--text-dim);font-size:12px}.dot{background:#3a2a2a;border-radius:50%;flex-shrink:0;width:8px;height:8px}.dot.on{background:var(--success);box-shadow:0 0 6px #22c55e80}.connections select{width:auto;min-width:160px}.sliders-section{border-bottom:1px solid var(--border);background:var(--bg-card);flex-shrink:0;padding:8px 0}.slider-row{align-items:center;gap:10px;padding:6px 20px;display:flex}.slider-label{text-transform:uppercase;letter-spacing:.5px;flex-shrink:0;width:80px;font-size:11px;font-weight:500}.slider-value{font-size:12px;font-family:var(--mono);text-align:right;flex-shrink:0;width:36px}.presets-row{border-top:1px solid var(--border);margin-top:4px;padding-top:4px}.intensity-slider{appearance:none;background:var(--bg-input);border:none;border-radius:3px;outline:none;flex:1;height:6px;padding:0}.intensity-slider::-webkit-slider-thumb{-webkit-appearance:none;background:var(--ring-color,var(--accent));cursor:pointer;border-radius:50%;width:18px;height:18px;box-shadow:0 0 8px #c084fc66}.intensity-slider::-moz-range-thumb{background:var(--ring-color,var(--accent));cursor:pointer;border:none;border-radius:50%;width:18px;height:18px}.presets{gap:4px;display:flex}.preset-btn{text-transform:uppercase;letter-spacing:.5px;border-radius:4px;padding:4px 10px;font-size:11px}.preset-btn.active{background:var(--accent);color:#0d0b0e;border-color:var(--accent);font-weight:600}.chat-messages{flex-direction:column;flex:1;gap:10px;padding:16px 20px;display:flex;overflow-y:auto}.chat-messages::-webkit-scrollbar{width:6px}.chat-messages::-webkit-scrollbar-track{background:0 0}.chat-messages::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}.chat-msg{border-radius:12px;flex-direction:column;gap:2px;max-width:80%;padding:10px 14px;animation:.3s fadeIn;display:flex}@keyframes fadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.chat-msg.user{background:var(--bg-input);border:1px solid var(--border);border-bottom-right-radius:4px;align-self:flex-end}.chat-msg.assistant{background:#1a1224;border:1px solid #2a1e3a;border-bottom-left-radius:4px;align-self:flex-start}.chat-role{text-transform:uppercase;letter-spacing:1px;color:var(--text-dim);font-size:10px;font-weight:500}.chat-text{font-family:var(--serif);color:var(--text-bright);font-size:15px;line-height:1.5}.chat-text.thinking{color:var(--text-dim);font-style:italic;animation:1.2s ease-in-out infinite pulse}@keyframes pulse{0%,to{opacity:.4}50%{opacity:1}}.chat-mood{font-size:11px;font-style:italic;transition:color .3s}.transcript-bar{border-top:1px solid var(--border);background:var(--bg-card);flex-shrink:0;align-items:center;gap:10px;padding:10px 20px;display:flex}.mic-btn{border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;padding:0;font-size:18px;display:flex}.mic-btn.active{background:var(--danger);border-color:var(--danger);color:#fff;animation:2s ease-in-out infinite micPulse}@keyframes micPulse{0%,to{box-shadow:0 0 #ef444466}50%{box-shadow:0 0 0 8px #ef444400}}.transcript-text{flex:1;min-height:20px;font-size:13px}.interim{color:var(--accent);font-style:italic}.speaking-indicator{color:var(--success);font-style:italic}.listening-hint{color:var(--text-dim);font-style:italic}.debug-strip{border-top:1px solid var(--border);background:#0a080c;flex-shrink:0;max-height:100px;padding:6px 20px;overflow-y:auto}.debug-strip::-webkit-scrollbar{width:4px}.debug-strip::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}.debug-line{font-family:var(--mono);color:var(--text-dim);white-space:nowrap;text-overflow:ellipsis;font-size:10px;line-height:1.6;overflow:hidden}.settings-tab{flex-direction:column;gap:28px;width:100%;max-width:560px;margin:0 auto;padding:24px 20px;display:flex;overflow-y:auto}.settings-tab h3{font-family:var(--serif);color:var(--text-bright);border-bottom:1px solid var(--border);margin-bottom:12px;padding-bottom:6px;font-size:16px}.settings-tab section{flex-direction:column;gap:12px;display:flex}.settings-tab .row{gap:8px;display:flex}.settings-tab input[type=range]{appearance:none;background:0 0;border:none;height:6px;margin-top:4px;padding:0}.settings-tab input[type=range]::-webkit-slider-runnable-track{background:var(--bg-input);border-radius:3px;height:6px}.settings-tab input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:var(--accent);cursor:pointer;border-radius:50%;width:16px;height:16px;margin-top:-5px}