:root{--keyboard-offset: 0px;--bg: #1a1a2e;--bg-secondary: #16213e;--bg-input: #0f1525;--text: #e0e0e0;--text-muted: #888;--accent: #4361ee;--accent-hover: #3a56d4;--sent-bg: #4361ee;--reply-bg: #2a2a40;--border: #333;--radius: 12px;--radius-sm: 8px;--error: #ef4444;--success: #22c55e}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;overflow:hidden}body{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:16px;line-height:1.5;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased}.connect-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;padding:1.5rem}.connect-card{width:100%;max-width:400px;background:var(--bg-secondary);border-radius:var(--radius);padding:2rem}.connect-card h1{font-size:1.25rem;margin-bottom:1.5rem;text-align:center}.form-group{margin-bottom:1rem}.form-group label{display:block;font-size:.8rem;color:var(--text-muted);margin-bottom:.25rem}.form-group input{width:100%;padding:.625rem .75rem;background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);font-size:.9rem;outline:none;transition:border-color .15s}.form-group input:focus{border-color:var(--accent)}.btn-connect{width:100%;padding:.75rem;margin-top:.5rem;background:var(--accent);color:#fff;border:none;border-radius:var(--radius-sm);font-size:1rem;font-weight:500;cursor:pointer;transition:background .15s}.btn-connect:hover{background:var(--accent-hover)}.btn-connect:disabled{opacity:.5;cursor:not-allowed}.error-msg{margin-top:.75rem;padding:.5rem .75rem;background:#ef44441a;border:1px solid var(--error);border-radius:var(--radius-sm);color:var(--error);font-size:.85rem}.chat-screen{display:flex;flex-direction:column;height:100%}.chat-header{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1rem;background:var(--bg-secondary);border-bottom:1px solid var(--border);flex-shrink:0}.chat-header .status{display:flex;align-items:center;gap:.5rem;font-size:.9rem}.status-dot{width:8px;height:8px;border-radius:50%;background:var(--success)}.status-dot.disconnected{background:var(--error)}.btn-disconnect{padding:.375rem .75rem;background:transparent;border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-muted);font-size:.8rem;cursor:pointer}.btn-disconnect:hover{border-color:var(--error);color:var(--error)}.chat-messages{flex:1;overflow-y:auto;padding:1rem;display:flex;flex-direction:column;gap:.75rem}.chat-empty{display:flex;align-items:center;justify-content:center;height:100%;color:var(--text-muted);font-size:.9rem}.chat-input-bar{display:flex;gap:.5rem;padding:.75rem 1rem;padding-bottom:calc(.75rem + env(safe-area-inset-bottom,0px) + var(--keyboard-offset));background:var(--bg-secondary);border-top:1px solid var(--border);flex-shrink:0}.chat-input-bar input{flex:1;padding:.625rem .75rem;background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);font-size:.9rem;outline:none}.chat-input-bar input:focus{border-color:var(--accent)}.btn-send{padding:.625rem 1rem;background:var(--accent);color:#fff;border:none;border-radius:var(--radius-sm);font-size:.9rem;font-weight:500;cursor:pointer;white-space:nowrap}.btn-send:disabled{opacity:.5;cursor:not-allowed}.bubble-row{display:flex}.bubble-row.sent{justify-content:flex-end}.bubble-row.reply{justify-content:flex-start}.bubble{max-width:85%;padding:.625rem .875rem;border-radius:var(--radius);font-size:.9rem;word-break:break-word}.bubble.sent{background:var(--sent-bg);color:#fff;border-bottom-right-radius:4px}.bubble.reply{background:var(--reply-bg);color:var(--text);border-bottom-left-radius:4px}.bubble-time{font-size:.7rem;color:var(--text-muted);margin-top:.25rem}.bubble-row.sent .bubble-time{text-align:right}.bubble.reply h1,.bubble.reply h2,.bubble.reply h3{font-size:1em;font-weight:600;margin:.5em 0 .25em}.bubble.reply h1{font-size:1.1em}.bubble.reply p{margin:.25em 0}.bubble.reply ul,.bubble.reply ol{padding-left:1.25em;margin:.25em 0}.bubble.reply code{background:#0000004d;padding:.125em .375em;border-radius:4px;font-size:.85em;font-family:SF Mono,Fira Code,monospace}.bubble.reply pre{background:#0000004d;padding:.75em;border-radius:var(--radius-sm);overflow-x:auto;margin:.5em 0}.bubble.reply pre code{background:none;padding:0}.bubble.reply table{border-collapse:collapse;margin:.5em 0;font-size:.85em}.bubble.reply th,.bubble.reply td{border:1px solid var(--border);padding:.375em .625em}.bubble.reply th{background:#0003}.bubble.reply blockquote{border-left:3px solid var(--accent);padding-left:.75em;color:var(--text-muted);margin:.5em 0}.bubble.reply a{color:var(--accent)}
