/* AI mode inherits the terminal's colors, typography, and responsive layout. */
.face-toggle{position:absolute;z-index:2;left:24%;top:28%;width:52%;height:39%;min-width:44px;min-height:44px;border:0;border-radius:40%;background:transparent;padding:0;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.portrait.is-placing .face-toggle{visibility:hidden;pointer-events:none}
.face-toggle::after{content:"double-click to chat";position:absolute;left:50%;bottom:100%;transform:translateX(-50%);white-space:nowrap;font:11px/1.5 var(--mono);padding:3px 7px;background:var(--terminal);color:var(--green);border:1px dashed var(--border);opacity:0;pointer-events:none;transition:opacity .15s}
.face-toggle:focus-visible::after{opacity:1}
@media(hover:hover){.face-toggle:hover::after{opacity:1}}
:root[data-chat-mode="true"] .face-toggle::after{content:"double-click to return"}
.chat-panel{width:100%;max-width:1000px;min-width:0;padding-bottom:4px}
.chat-toolbar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:4px 20px;border-bottom:1px dashed var(--border);padding:0 0 10px;margin-bottom:16px;font-size:14px}
.chat-heading{display:inline-flex;align-items:center;gap:8px;color:var(--green);font-weight:600;white-space:nowrap}
.chat-dot{width:7px;height:7px;background:var(--green);display:inline-block;border-radius:50%}
.chat-subtitle{color:var(--muted);font-weight:400}
.chat-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.chat-actions button,.chat-stop{min-height:44px;border:0;padding:4px 0;color:var(--muted);background:none;font-size:12px;text-decoration:underline;text-underline-offset:4px}
.chat-actions button:hover,.chat-stop:hover{color:var(--green)}
.chat-messages{font-size:clamp(16px,1.3vw,21px);line-height:1.8;overflow-wrap:anywhere}
.chat-welcome{padding:4px 0 10px}
.chat-welcome p{margin:0 0 8px}
.chat-welcome p:first-child{color:var(--name)}
.chat-welcome p+p{color:var(--muted);font-size:.85em}
.chat-message{margin:0 0 22px;animation:chat-appear .18s ease-out}
.chat-role{display:block;color:var(--command);font-size:12px;line-height:1.6;margin-bottom:5px}
.chat-message[data-role="assistant"] .chat-role{color:var(--green)}
.chat-message p{margin:0;white-space:pre-wrap;overflow-wrap:anywhere}
.chat-message[data-pending="true"] p:empty::before{content:"Thinking…";color:var(--muted)}
.chat-status{margin:0;font-size:13px;color:var(--name);white-space:pre-wrap;line-height:1.6}
.chat-status:not(:empty){margin:8px 0 12px}
.chat-form{display:flex;align-items:flex-start;gap:12px;border-block:1px solid var(--border);min-height:54px;padding:5px 0;max-width:100%;scroll-margin-bottom:20px}
.chat-input-label{color:var(--green);font-size:14px;line-height:44px;white-space:nowrap}
.chat-input-label span{padding-left:5px}
.chat-form textarea{flex:1;min-width:0;width:100%;max-height:170px;min-height:44px;resize:vertical;border:0;background:transparent;color:var(--text);font:16px/1.6 var(--mono);padding:9px 3px;outline-offset:-2px;border-radius:0;caret-color:var(--green)}
.chat-form textarea::placeholder{color:var(--muted);opacity:1}
.chat-send{flex:none;min-width:44px;height:44px;border:0;background:none;color:var(--green);font-size:22px;border-radius:3px}
.chat-send:hover{background:var(--bar)}
.chat-send:disabled{opacity:.4;cursor:wait}
.chat-stop{color:var(--name);padding-inline:6px}
.chat-footnote{margin:8px 0 0;color:var(--muted);font-size:11px;line-height:1.6}
.chat-footnote span{margin-left:8px}
@keyframes chat-appear{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:600px){.chat-toolbar{font-size:13px;gap:0}.chat-subtitle{display:none}.chat-actions{gap:16px}.chat-form{gap:8px}.chat-footnote span{display:block;margin:3px 0 0}.chat-wide-break{display:none}}
@media(min-width:1000px){.chat-form textarea{font-size:var(--desktop-text)}.chat-input-label{font-size:clamp(15px,1.1vw,20px)}}
@media(prefers-reduced-motion:reduce){.chat-message{animation:none}.face-toggle::after{transition:none}}