.chat{flex-direction:column;min-height:520px;margin-top:28px;display:flex;overflow:hidden}.chat-log{flex-direction:column;flex:1;gap:14px;min-height:360px;max-height:62vh;padding:18px 16px;display:flex;overflow-y:auto}.msg{border-radius:var(--radius);white-space:pre-wrap;overflow-wrap:anywhere;max-width:min(680px,88%);padding:10px 14px}.msg-user{background:color-mix(in srgb, var(--accent) 22%, var(--surface-2));border:1px solid color-mix(in srgb, var(--accent) 40%, var(--border));align-self:flex-end}.msg-bot{background:var(--surface-2);border:1px solid var(--border);align-self:flex-start}.msg-error{color:var(--danger);align-self:flex-start;font-size:14px}.msg-meta{color:var(--text-muted);white-space:normal;margin-top:8px;font-size:12px}.typing{color:var(--text-muted);align-self:flex-start;font-size:14px}.typing:after{content:"";animation:1.2s steps(4,end) infinite dots}@keyframes dots{0%{content:""}25%{content:"."}50%{content:".."}75%{content:"..."}}.chat-form{border-top:1px solid var(--border);background:var(--surface);gap:10px;padding:12px;display:flex}.chat-form input{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg);flex:1;min-width:0;min-height:44px;padding:10px 14px}.chat-form input:focus{border-color:color-mix(in srgb, var(--accent) 60%, var(--border));outline:none}.suggestions{flex-wrap:wrap;gap:8px;padding:0 16px 14px;display:flex}.suggestions button{border:1px solid var(--border);background:var(--surface-2);color:var(--text-muted);cursor:pointer;border-radius:999px;padding:6px 12px;font-size:13px}.suggestions button:hover{color:var(--text);border-color:color-mix(in srgb, var(--accent) 50%, var(--border))}.chat .access-notice{margin:0 12px 12px}.how{color:var(--text-muted);margin-top:36px;font-size:15px}.how h2{color:var(--text);font-family:var(--font-display);margin:0 0 8px;font-size:20px}.how ul{gap:8px;margin:0;padding-left:20px;display:grid}.how strong{color:var(--text)}