:root{--bg:#0f1115;--card:#181b22;--bd:#2a2f3a;--tx:#e6e8ee;--mu:#8b92a3;--ac:#6c8cff}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--tx);font:16px/1.5 system-ui,sans-serif}
nav{display:flex;gap:16px;padding:12px 16px;border-bottom:1px solid var(--bd);align-items:center}
nav a{color:var(--mu);text-decoration:none}nav a.on{color:var(--tx);font-weight:600}
nav button{margin-left:auto;background:none;border:1px solid var(--bd);color:var(--mu)}
main{max-width:720px;margin:0 auto;padding:16px}
.card{background:var(--card);border:1px solid var(--bd);border-radius:12px;padding:16px}
input,textarea,button{font:inherit;color:var(--tx);background:var(--bg);border:1px solid var(--bd);border-radius:8px;padding:10px;width:100%}
button{background:var(--ac);border:0;cursor:pointer;width:auto;color:#fff}
textarea{min-height:50vh;resize:vertical;margin:12px 0}
#log{display:flex;flex-direction:column;gap:8px;height:60vh;overflow-y:auto;margin-bottom:12px}
.m{max-width:85%;padding:10px 12px;border-radius:12px;white-space:pre-wrap;background:var(--card);border:1px solid var(--bd)}
.m.user{align-self:flex-end;background:var(--ac);border:0}
.row{display:flex;gap:8px}.col{display:flex;flex-direction:column;gap:12px}
.err{color:#ff7b7b}.ok{color:#6fdc8c}
@media(max-width:600px){main{padding:10px}.m{max-width:95%}}