/* The public share-link chat: the same platform ground, no navigation.
   It is the one page a visitor may see before they have an account, so it
   carries the Claw Apps look without the launcher. */

.chat{width:min(780px,100%);margin:0 auto;min-height:100vh;display:flex;flex-direction:column;padding:var(--sp-5) var(--sp-4)}
.agent-head{display:flex;gap:var(--sp-4);align-items:flex-start;border-bottom:1px solid var(--line);padding-bottom:var(--sp-4)}
.agent-head .grow{flex:1;min-width:0}
.agent-head h1{font-size:21px;margin:2px 0 5px}
.agent-head p{margin:0}
.avatar{
  font-size:32px;width:56px;height:56px;border-radius:17px;flex:none;display:grid;place-items:center;
  background:var(--surface-2);border:1px solid var(--line);
}

.messages{flex:1;display:flex;flex-direction:column;gap:var(--sp-3);padding:var(--sp-4) 0;overflow-y:auto}
.msg{max-width:85%;padding:10px 15px;border-radius:16px;white-space:pre-wrap;word-wrap:break-word;line-height:1.5;font-size:14.5px}
.msg.user{align-self:flex-end;background:color-mix(in srgb,var(--accent) 20%,var(--surface-3));border-bottom-right-radius:5px}
.msg.assistant{align-self:flex-start;background:var(--surface-2);border:1px solid var(--line);border-bottom-left-radius:5px}
.msg.tool{align-self:flex-start;font-size:12px;color:var(--muted);padding:2px 10px}
.msg.error{align-self:center;color:var(--bad);font-size:13px}
.notice{color:var(--warn);font-size:13px;margin:6px 0}

.composer{display:flex;gap:var(--sp-2);align-items:flex-end;border-top:1px solid var(--line);padding-top:var(--sp-3)}
.composer textarea{flex:1;resize:none;max-height:160px;min-height:44px}
.turnstile{margin:var(--sp-2) 0}
footer{padding:var(--sp-3) 0 0}
.typing::after{content:"▍";animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}