:root{--bg:#f0f4f8;--surface:white;--user:#2563eb;--user-text:white;--border:#e2e8f0;--text:#1e293b;--muted:#64748b;--accent:#3b82f6;--section-bg:#f8fafc;--error:#fef2f2;--error-border:#ef4444}*{box-sizing:border-box}body{color:var(--text);background:linear-gradient(135deg,#f0f4f8 0%,#e0e7ff 100%);min-height:100vh;margin:0;font-family:-apple-system,BlinkMacSystemFont,Inter,Segoe UI,sans-serif}.app{flex-direction:column;max-width:820px;height:100vh;margin:0 auto;padding:1.5rem;display:flex}header h1{background:linear-gradient(135deg,#2563eb,#7c3aed);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin:0 0 .25rem;font-size:1.75rem}header p{color:var(--muted);margin:0 0 1rem}.messages{background:var(--surface);border:1px solid var(--border);border-radius:12px;flex-direction:column;flex:1;gap:1rem;padding:1.25rem;display:flex;overflow-y:auto;box-shadow:0 1px 3px #0000000a}.empty{text-align:center;color:var(--muted);padding:3rem 1rem}.empty p{margin-bottom:1rem}.examples{flex-wrap:wrap;justify-content:center;gap:.5rem;display:flex}.example{background:var(--section-bg);border:1px solid var(--border);cursor:pointer;color:var(--text);border-radius:999px;padding:.4rem .9rem;font-size:.875rem}.example:hover{background:var(--border)}.bubble{word-wrap:break-word;border-radius:14px;max-width:92%;padding:.85rem 1.1rem;line-height:1.5}.bubble.user{background:var(--user);color:var(--user-text);white-space:pre-wrap;border-bottom-right-radius:4px;align-self:flex-end}.bubble.assistant{background:var(--surface);border:1px solid var(--border);border-bottom-left-radius:4px;align-self:flex-start;width:92%}.bubble.assistant .intro{white-space:pre-wrap;margin:0 0 .75rem}.markdown{font-size:.96rem}.markdown h2,.markdown h3,.markdown h4{margin:.9rem 0 .35rem;line-height:1.25}.markdown h2:first-child,.markdown h3:first-child,.markdown h4:first-child{margin-top:0}.markdown h2{font-size:1.12rem}.markdown h3{font-size:1rem}.markdown h4{color:var(--muted);font-size:.95rem}.markdown p{white-space:pre-wrap;margin:0 0 .75rem}.markdown ul{margin:.25rem 0 .8rem;padding-left:1.2rem}.markdown li{margin:.18rem 0}.markdown code{background:var(--section-bg);border:1px solid var(--border);border-radius:4px;padding:.05rem .25rem;font-family:SF Mono,Menlo,monospace;font-size:.9em}.markdown a{color:var(--accent);border-bottom:1px dotted var(--accent);text-decoration:none}.markdown a:hover{background:#3b82f614}.bubble.error{background:var(--error);border:1px solid var(--error-border);align-self:flex-start;width:92%}.bubble.error p{margin:.4rem 0 0;font-family:SF Mono,Menlo,monospace;font-size:.85rem}.warnings{flex-wrap:wrap;gap:.4rem;margin-top:.75rem;display:flex}.chip{color:#78350f;background:#fef3c7;border:1px solid #f59e0b;border-radius:999px;padding:.15rem .6rem;font-size:.75rem}.typing{gap:4px;padding:1rem 1.25rem;display:inline-flex;width:auto!important}.typing span{background:var(--muted);border-radius:50%;width:8px;height:8px;animation:1.4s infinite both blink}.typing span:nth-child(2){animation-delay:.2s}.typing span:nth-child(3){animation-delay:.4s}@keyframes blink{0%,80%,to{opacity:.2;transform:scale(.8)}40%{opacity:1;transform:scale(1)}}.composer{gap:.6rem;margin-top:1rem;display:flex}.composer textarea{font:inherit;resize:none;border:1px solid var(--border);background:var(--surface);border-radius:10px;flex:1;padding:.75rem}.composer textarea:focus{border-color:var(--accent);outline:none;box-shadow:0 0 0 3px #3b82f626}.composer button{font:inherit;background:var(--user);color:#fff;cursor:pointer;border:none;border-radius:10px;padding:0 1.5rem;font-weight:600}.composer button:hover:not(:disabled){background:#1d4ed8}.composer button:disabled{opacity:.4;cursor:not-allowed}
