:root { --fg:#1d232a; --muted:#66707a; --line:#d9dee3; --bg:#f7f8f9; --card:#fff; --accent:#2f6f5e; --warn:#a45d00; }
* { box-sizing: border-box; }
body { margin:0; font: 15px/1.45 system-ui, "Segoe UI", sans-serif; color:var(--fg); background:var(--bg); }
header { display:flex; align-items:center; gap:1.5rem; padding:.6rem 1rem; background:var(--card); border-bottom:1px solid var(--line); flex-wrap:wrap; }
header h1 { font-size:1.15rem; margin:0; color:var(--accent); }
nav { display:flex; gap:.3rem; flex-wrap:wrap; align-items:center; }
nav button { background:none; border:1px solid transparent; padding:.3rem .6rem; border-radius:4px; cursor:pointer; font:inherit; }
nav button.active { border-color:var(--line); background:var(--bg); }
.disclosure { margin:0; padding:.4rem 1rem; font-size:.85rem; color:var(--muted); background:#eef3f1; border-bottom:1px solid var(--line); }
.admin .disclosure { background:#fbf1e3; color:#5a3a00; }
.admin header h1 { color:var(--warn); }
main { padding:1rem; max-width:1100px; margin:0 auto; }
.card { background:var(--card); border:1px solid var(--line); border-radius:6px; padding:1rem 1.2rem; margin-bottom:1rem; }
.card.narrow { max-width:560px; }
.card.explicit { border-color:#e3c48f; }
h2 { font-size:1.1rem; margin:.1rem 0 .6rem; } h3 { font-size:1rem; margin:1.2rem 0 .4rem; }
.muted { color:var(--muted); } .small { font-size:.85rem; }
.badge { display:inline-block; font-size:.72rem; padding:0 .4rem; margin-left:.35rem; border-radius:8px; background:#e7ecef; color:#3c4650; vertical-align:middle; }
.badge.new { background:var(--accent); color:#fff; } .badge.warn { background:#fbe3c0; color:#6b3d00; }
.status-open { background:#dbeafe; } .status-answered, .status-done { background:#dcfce7; } .status-declined, .status-withdrawn { background:#f1f1f1; }
button { font:inherit; padding:.3rem .8rem; border:1px solid var(--line); border-radius:4px; background:#fff; cursor:pointer; }
button:hover { border-color:var(--accent); }
button.link { border:none; background:none; color:var(--accent); padding:0 .3rem; text-decoration:underline; }
input, textarea, select { font:inherit; padding:.3rem .4rem; border:1px solid var(--line); border-radius:4px; }
textarea { width:100%; resize:vertical; }
.stack { display:flex; flex-direction:column; gap:.5rem; align-items:flex-start; } .stack label { width:100%; } .stack label input:not([type=checkbox]) { width:100%; }
.grid { display:flex; flex-wrap:wrap; gap:.6rem 1.2rem; align-items:center; }
.layout { display:grid; grid-template-columns: 220px 1fr; gap:1rem; }
@media (max-width: 700px) { .layout { grid-template-columns: 1fr; } }
aside.rooms { background:var(--card); border:1px solid var(--line); border-radius:6px; padding:.8rem; align-self:start; }
aside.rooms ul { list-style:none; margin:0 0 .8rem; padding:0; } aside.rooms li { padding:.2rem .3rem; border-radius:4px; }
aside.rooms li.active { background:#e6f0ec; } aside.rooms a { color:inherit; text-decoration:none; }
section.room { background:var(--card); border:1px solid var(--line); border-radius:6px; padding:.8rem 1rem; display:flex; flex-direction:column; min-height:70vh; }
.room-head { border-bottom:1px solid var(--line); padding-bottom:.5rem; margin-bottom:.5rem; } .room-head p { margin:.2rem 0; }
.messages { flex:1; overflow-y:auto; max-height:60vh; padding-right:.3rem; }
.msg { padding:.35rem 0; border-bottom:1px dashed #edf0f2; } .msg .meta { font-size:.9rem; }
.msg .body, .body { white-space:pre-wrap; overflow-wrap:anywhere; }
.msg.system { color:var(--muted); font-style:italic; font-size:.88rem; }
.msg.host .meta strong { color:var(--accent); }
.msg .actions { margin-left:.5rem; visibility:hidden; } .msg:hover .actions { visibility:visible; }
.composer { display:flex; gap:.5rem; align-items:flex-end; margin-top:.6rem; }
ul.inline { list-style:none; padding:0; display:flex; flex-wrap:wrap; gap:.3rem .9rem; margin:.3rem 0; }
ul.people, ul.requests { list-style:none; padding:0; } ul.people li, ul.requests li { padding:.6rem 0; border-bottom:1px solid var(--line); }
.reply { margin-top:.3rem; padding:.3rem .5rem; background:#f0f6f3; border-radius:4px; white-space:pre-wrap; }
pre.about { white-space:pre-wrap; font-size:.85rem; margin:0; }
code.token { display:inline-block; padding:.2rem .4rem; background:#f2f2f2; border-radius:3px; user-select:all; overflow-wrap:anywhere; }
table { border-collapse:collapse; width:100%; margin-top:.6rem; } th, td { text-align:left; padding:.3rem .4rem; border-bottom:1px solid var(--line); vertical-align:top; }
dl.status { display:grid; grid-template-columns:max-content 1fr; gap:.2rem 1rem; font-size:.9rem; } dl.status dt { color:var(--muted); } dl.status dd { margin:0; }
.flash { margin:.5rem auto; max-width:1100px; padding:.5rem .8rem; border-radius:4px; background:#e8f2ee; border:1px solid #bcd9cd; }
.flash.error { background:#fdecec; border-color:#f3b9b9; }
.sustain { padding:.6rem .8rem; background:#f7faf9; border-radius:4px; }
input.num { width:7em; }
.badge.op { background:#1f5f4f; color:#fff; } .badge.role { background:#e8e2f5; color:#3d2d6b; }
ul.members { list-style:none; padding:0; margin:.3rem 0; } ul.members li { padding:.15rem 0; }
.note-body { padding:.5rem .7rem; background:#f7faf9; border-radius:4px; margin:.4rem 0; }
.warn { color:#8a4b00; }