:root{
  --ink:#1A0606; --deep:#6E0B12; --red:#C8102E; --gold:#FFC414;
  --paper:#FBF7EF; --card:#fff; --line:rgba(26,6,6,.14); --muted:#6b5a52;
}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);
  font:16px/1.6 "Barlow",system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}
a{color:var(--red)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- auth ---------- */
.auth-body{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:24px}
.auth{width:100%;max-width:440px;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:32px 28px}
.auth-eyebrow{margin:0 0 6px;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.auth h1{margin:0 0 8px;font-size:26px;line-height:1.15}
.auth-lede{margin:0 0 22px;color:var(--muted);font-size:15px}
.providers{display:flex;flex-direction:column;gap:10px}
.provider{display:block;width:100%;text-align:center;text-decoration:none;cursor:pointer;
  padding:14px 16px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink);
  font:inherit;font-weight:500}
.provider:hover{border-color:var(--red);background:#fff8f7}
.panel{margin-top:20px;padding-top:20px;border-top:1px solid var(--line)}
.panel label{display:block;margin:12px 0 6px;font-size:14px;font-weight:500}
.panel input{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:10px;font:inherit;background:#fff}
.panel input:focus{outline:2px solid var(--gold);outline-offset:1px}
.panel button{margin-top:12px;width:100%;padding:13px;border:0;border-radius:10px;background:var(--red);color:#fff;
  font:inherit;font-weight:600;cursor:pointer}
.panel button:hover{background:#a90d26}
.msg{margin:12px 0 0;font-size:14px;color:var(--muted);min-height:1.2em}
.auth-fine{margin:22px 0 0;font-size:12.5px;color:var(--muted);line-height:1.5}

/* ---------- chat ---------- */
.chat-body{display:flex;justify-content:center;padding:16px}
.chat{width:100%;max-width:660px;background:var(--card);border:1px solid var(--line);border-radius:16px;
  display:flex;flex-direction:column;height:calc(100vh - 32px);overflow:hidden}
.chat-head{display:flex;align-items:center;gap:12px;padding:12px 16px;border-bottom:1px solid var(--line)}
.chat-head-main{flex:1;min-width:0}
.chat-title{margin:0;font-size:15px;font-weight:600}
.chat-sub{margin:0;font-size:12px;color:var(--muted)}
.chat-head-meta{display:flex;align-items:center;gap:8px}
.pill{font-size:12px;padding:4px 10px;border-radius:999px;background:#f1efe8;color:var(--muted)}
.pill[data-status="active"]{background:#EAF3DE;color:#3B6D11}
.pill[data-status="full"]{background:#E6F1FB;color:#185FA5}
.pill[data-status="waiting"]{background:#FAEEDA;color:#854F0B}
.count{font-size:12px;color:var(--muted)}

.roster{display:flex;align-items:center;gap:8px;padding:10px 16px;border-bottom:1px solid var(--line);background:#faf8f3}
.seat{width:28px;height:28px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;
  font-size:11px;font-weight:600;background:#F4E3E6;color:var(--deep)}
.seat-me{background:var(--red);color:#fff}
.seat-empty{background:none;border:1px dashed var(--line)}
.seat-label{font-size:12px;color:var(--muted);margin-left:4px}

.thread{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:4px}
.sys{text-align:center;font-size:11.5px;color:var(--muted);padding:10px 0}
.row{display:flex;gap:8px;align-items:flex-end;margin-top:6px}
.row-me{justify-content:flex-end}
.avatar{flex:none;width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:11px;font-weight:600;background:#F4E3E6;color:var(--deep)}
.avatar-bot{background:#EEEDFE;color:#3C3489;letter-spacing:-1px}
.stack{max-width:74%}
.who{margin:0 0 3px 4px;font-size:11px;color:var(--muted)}
.tag{font-size:10px;background:#EEEDFE;color:#3C3489;padding:1px 6px;border-radius:999px}
.bubble{padding:9px 14px;border-radius:18px 18px 18px 4px;background:#f1efe8;font-size:14.5px;
  word-wrap:break-word;overflow-wrap:anywhere;white-space:pre-wrap}
.bubble-bot{background:#F6F5FE}
.row-me .bubble{background:var(--red);color:#fff;border-radius:18px 18px 4px 18px}
.row-me .bubble a{color:#fff;text-decoration:underline}
.bubble a{color:var(--red)}

.composer{display:flex;gap:8px;padding:12px 16px;border-top:1px solid var(--line)}
.composer input{flex:1;padding:11px 14px;border:1px solid var(--line);border-radius:999px;font:inherit;background:#faf8f3}
.composer input:focus{outline:2px solid var(--gold);outline-offset:1px}
.composer button{padding:11px 20px;border:0;border-radius:999px;background:var(--red);color:#fff;font:inherit;
  font-weight:600;cursor:pointer}
.composer button:disabled{opacity:.5;cursor:default}
.composer-note{margin:0;padding:0 16px 12px;font-size:12px;color:var(--muted);min-height:1em}

@media(max-width:520px){
  .chat-body{padding:0}
  .chat{height:100vh;border:0;border-radius:0;max-width:none}
}