:root{
  --border:#e2e8f0; --border-dark:#cbd5e1; --ring:rgba(100,116,139,.25);
  --text:#0f172a; --muted:#64748b; --bg:#ffffff; --dark:#0f172a; --ok:#16a34a; --warn:#f59e0b;
}
*{box-sizing:border-box}
body{font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto; color:var(--text)}
.hidden{display:none}
.flex{display:flex}
.input{width:100%; border:1px solid var(--border); border-radius:12px; padding:8px 12px; background:#fff; outline:none;}
.input:focus{border-color:var(--border-dark); box-shadow:0 0 0 3px var(--ring)}
.btn{border:1px solid var(--border); border-radius:12px; padding:8px 12px; background:#fff; cursor:pointer;}
.btn:hover{background:#f8fafc}
.btn-primary{border:none; border-radius:12px; padding:8px 16px; background:#0f172a; color:#fff; cursor:pointer;}
.btn-primary:hover{background:#111827}
.btn.subtle{border-color:#e5e7eb; color:#334155}
.tab{border:1px solid transparent; border-radius:12px; padding:8px 12px; cursor:pointer;}
.tab:hover{background:#f1f5f9}
.tab.active{background:#0f172a; color:#fff}
.badge{display:inline-block; padding:0 8px; border-radius:999px; font-size:12px; border:1px solid var(--border); background:#f8fafc; color:#334155}
.badge.warn{background:#fff7ed; border-color:#fed7aa; color:#b45309}
.badge.dot{height:18px; line-height:18px}
.bubble-in{background:#f1f5f9; border-radius:16px; padding:8px 12px; max-width:80%;}
.bubble-out{background:#0f172a; color:#fff; border-radius:16px; padding:8px 12px; margin-left:auto; max-width:80%;}
.session-item{padding:12px; cursor:pointer}
.session-item:hover{background:#f8fafc}
.session-item.active{background:#eef2ff}
.meta{font-size:12px; color:#64748b}