:root{--bg:#f6f7f9;--fg:#1b1f24;--card:#fff;--line:#d9dde3;--acc:#c79a00}
[data-theme=dark]{--bg:#121417;--fg:#e8eaed;--card:#1d2024;--line:#33373d;--acc:#f2c230}
*{box-sizing:border-box}body{margin:0;font-family:system-ui,"Segoe UI",Tahoma,sans-serif;background:var(--bg);color:var(--fg)}
header{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;padding:.6rem 1rem;border-bottom:1px solid var(--line);background:var(--card)}
#brand{color:var(--acc)}nav{display:flex;flex-wrap:wrap;gap:.3rem;flex:1}.tools{margin-inline-start:auto;display:flex;gap:.3rem}
button,input,textarea,select{font:inherit;color:inherit;background:var(--bg);border:1px solid var(--line);border-radius:6px;padding:.4rem .7rem}
button{cursor:pointer}button.on{border-color:var(--acc);color:var(--acc)}
main{max-width:960px;margin:1rem auto;padding:0 1rem}.card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:1rem;margin-bottom:1rem}
form{display:flex;flex-direction:column;gap:.5rem}.row{display:flex;gap:.5rem;flex-wrap:wrap}.row>*{flex:1}
.msg{padding:.5rem;border-radius:8px;margin:.3rem 0;white-space:pre-wrap}.user{background:var(--bg)}.mock{border-inline-start:3px solid var(--acc)}
.err{color:#d33}.muted{opacity:.7;font-size:.9em}table{width:100%;border-collapse:collapse}td,th{border-bottom:1px solid var(--line);padding:.3rem;text-align:start}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:.6rem}