:root{
  --brand-primary:#1F4E79; --brand-primary-fg:#FFFFFF; --brand-accent:#C8963E;
  --bg:#FFFFFF; --surface:#F6F7F9; --border:#E3E6EA; --text:#111827; --muted:#5B6472;
  --radius:8px; --font-sans:Inter,system-ui,sans-serif; --font-mono:"JetBrains Mono",ui-monospace,monospace;
}
*{box-sizing:border-box}
/* The HTML `hidden` attribute only works through the browser's user-agent rule
   `[hidden]{display:none}`. Any author rule that sets `display` on a specific id
   outranks it, so toggling el.hidden silently does nothing — which left the
   login overlay on screen after a successful login. Keep this rule above every
   display declaration so `hidden` is always authoritative. */
[hidden]{display:none!important}
body{margin:0;font:14px/1.55 var(--font-sans);color:var(--text);background:var(--bg)}
#app{display:flex;min-height:100vh}
#sidebar{width:240px;border-right:1px solid var(--border);padding:16px;display:flex;flex-direction:column;gap:12px;background:var(--surface)}
#brand-line{font-weight:700;font-size:16px;display:flex;gap:8px;align-items:center}
#brand-logo{color:var(--brand-primary)}
nav{display:flex;flex-direction:column;gap:4px}
.nav{text-align:left;padding:8px 10px;border:0;border-radius:var(--radius);background:transparent;cursor:pointer;color:var(--text)}
.nav.active{background:var(--brand-primary);color:var(--brand-primary-fg)}
#user-line{margin-top:auto;display:flex;justify-content:space-between;align-items:center;color:var(--muted)}
button.primary{background:var(--brand-primary);color:var(--brand-primary-fg);border:0;border-radius:var(--radius);padding:8px 14px;cursor:pointer}
button.link{background:none;border:0;color:var(--brand-primary);cursor:pointer}
#main{flex:1;display:flex;flex-direction:column;min-width:0}
#asof-bar{padding:8px 16px;background:var(--surface);border-bottom:1px solid var(--border);color:var(--muted);font-size:13px}
.view{padding:16px;max-width:900px;width:100%;margin:0 auto}
#view-research{display:flex;flex-direction:column;height:calc(100vh - 41px)}
#thread{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:12px;padding-bottom:12px}
#composer{border-top:1px solid var(--border);padding-top:12px}
#mode-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
#mode-switch button{border:1px solid var(--border);background:var(--bg);padding:6px 12px;cursor:pointer;color:var(--text)}
#mode-switch button:first-child{border-radius:var(--radius) 0 0 var(--radius)}
#mode-switch button:last-child{border-radius:0 var(--radius) var(--radius) 0}
#mode-switch button.on{background:var(--brand-primary);color:var(--brand-primary-fg);border-color:var(--brand-primary)}
#q{width:100%;border:1px solid var(--border);border-radius:var(--radius);padding:10px;font:inherit;resize:vertical}
#send-row{margin-top:8px;text-align:right}
.answer{border:1px solid var(--border);border-radius:var(--radius);padding:14px 16px;background:var(--bg)}
.answer .mode-tag{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.answer .body{font-size:15px;line-height:1.6;margin:8px 0}
.fact{border-bottom:1px dotted var(--brand-accent);cursor:help;font-variant-numeric:tabular-nums}
.fact:hover{background:#fff8e7}
.conf{font-size:13px;margin:6px 0}
.chip{display:inline-block;border:1px solid var(--border);border-radius:20px;padding:2px 10px;margin:2px 4px 2px 0;font-size:12px;color:var(--muted)}
.caveat{background:var(--surface);border-left:3px solid var(--brand-accent);padding:8px 12px;margin:8px 0;font-size:13px}
.nextq button{margin:2px 4px 2px 0;border:1px solid var(--brand-primary);color:var(--brand-primary);background:transparent;border-radius:20px;padding:4px 12px;cursor:pointer}
.stepper{font-size:12px;color:var(--muted)}
.card{border:1px solid var(--border);border-radius:var(--radius);padding:12px;margin:12px 0}
.card h3{margin:0 0 8px}
pre{white-space:pre-wrap;font-family:var(--font-mono);font-size:12px;background:var(--surface);padding:8px;border-radius:var(--radius)}
table.data{border-collapse:collapse;width:100%;font-size:13px}
table.data td,table.data th{border:1px solid var(--border);padding:4px 8px;text-align:right;font-variant-numeric:tabular-nums}
table.data td:first-child,table.data th:first-child{text-align:left}
#context{width:360px;border-left:1px solid var(--border);padding:12px;overflow-y:auto;background:var(--surface)}
#ctx-tabs button{margin-right:4px}
#login{position:fixed;inset:0;background:rgba(0,0,0,.35);display:flex;align-items:center;justify-content:center}
.login-card{background:var(--bg);padding:24px;border-radius:12px;display:flex;flex-direction:column;gap:10px;min-width:300px}
.login-card input{padding:8px;border:1px solid var(--border);border-radius:var(--radius);font:inherit}
#login-err{color:#B42318}
@media(max-width:1023px){#context{position:fixed;right:0;top:0;bottom:0;z-index:10}#sidebar{width:64px}#sidebar nav button{font-size:0}#sidebar nav button::first-letter{font-size:14px}}