:root{--bg:#f7f7f7;--fg:#111;--card:#fff;--muted:#666;--brand:#0b4}
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--fg);background:var(--bg)}
header{padding:1rem 1.25rem;background:#fff;border-bottom:1px solid #e6e6e6;position:sticky;top:0;z-index:10}
main{max-width:900px;margin:1rem auto;padding:0 1rem}
h1{margin:.25rem 0 .5rem}
.card{background:var(--card);border:1px solid #e6e6e6;border-radius:14px;padding:1rem;margin:1rem 0;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
label{display:block;margin-top:.65rem;font-weight:600}
input,textarea{width:100%;padding:.6rem .7rem;border:1px solid #d0d0d0;border-radius:10px;margin-top:.35rem}
input[type=file]{padding:.4rem .6rem;background:#fff}
button,.btn{display:inline-block;margin-top:1rem;padding:.7rem 1rem;border-radius:12px;background:var(--brand);color:#fff;border:none;text-decoration:none;cursor:pointer}
.btn.secondary{background:#333}
.help{color:var(--muted);font-size:.9rem}
.result{margin-top:1rem;padding:.8rem;border-radius:10px;background:#eef8f0;border:1px solid #cfe9d6}
.chat{border:1px solid #e6e6e6;border-radius:12px;padding:.75rem;max-height:260px;overflow:auto;background:#fcfcfc}
.chat .msg{margin:.35rem 0;padding:.5rem .6rem;border-radius:10px;max-width:80%}
.chat .me{background:#e6f3ff;margin-left:auto}
.chat .them{background:#e8f7ec;margin-right:auto}
footer{text-align:center;color:var(--muted);padding:2rem}
small.mono{font-family:ui-monospace,Menlo,Consolas,monospace}