:root { font-family: system-ui, sans-serif; color: #18352e; background: #f5f4ed; line-height: 1.6; }
* { box-sizing: border-box; }
body { margin: 0; }
header, main, footer { max-width: 960px; margin: auto; padding: 1.5rem; }
header { display: flex; justify-content: space-between; align-items: center; gap: 1rem; border-bottom: 1px solid #d5ddd5; }
nav, .actions { display: flex; gap: 1.2rem; align-items: center; flex-wrap: wrap; }
.brand { font-weight: 800; text-decoration: none; }
main { min-height: 75vh; padding-top: 3.5rem; }
h1 { font-size: clamp(2rem, 6vw, 3.7rem); line-height: 1.12; letter-spacing: -.04em; max-width: 750px; }
h2 { line-height: 1.2; }
a { color: #23634e; text-underline-offset: .2em; }
.eyebrow { text-transform: uppercase; font-size: .8rem; letter-spacing: .12em; font-weight: 700; }
.lead { font-size: 1.2rem; max-width: 620px; }
.card { background: #fff; border: 1px solid #d5ddd5; padding: 1.6rem; margin: 2rem 0; border-radius: 12px; }
.narrow { max-width: 480px; }
label { display: block; font-weight: 600; margin-bottom: .4rem; }
input, textarea { display: block; width: 100%; padding: .8rem; font: inherit; border: 1px solid #889e94; border-radius: 6px; margin-bottom: 1rem; }
input[type=hidden] { display: none; }
button, .button { display: inline-block; border: 0; border-radius: 6px; padding: .8rem 1.2rem; background: #23634e; color: white; font: inherit; text-decoration: none; cursor: pointer; }
button:disabled { opacity: .5; cursor: not-allowed; }
:focus-visible { outline: 3px solid #bd7c16; outline-offset: 3px; }
.hint, footer { font-size: .88rem; color: #53685e; }
.notice { background: #fff1ce; padding: 1rem; border-radius: 6px; }
.draft { white-space: pre-wrap; }
@media (max-width: 540px) { header { align-items: flex-start; flex-direction: column; } main { padding-top: 2rem; } }
select { width: 100%; padding: .8rem; margin: .5rem 0 1rem; border: 1px solid #889e94; border-radius: 6px; background: white; font: inherit; }
.tag { font-size: .75rem; background: #f8e2a4; color: #594511; border-radius: 20px; padding: .25rem .7rem; }
.conversation-link { display: flex; justify-content: space-between; gap: 1rem; padding: 1rem; border-bottom: 1px solid #d5ddd5; text-decoration: none; }
.message { margin: 1rem 0; }
.message.user { background: #e8eee9; margin-left: 2rem; }
.message.assistant { border-left: 4px solid #b94339; }
.message .eyebrow { margin-top: 0; }
details { margin-top: 1rem; font-size: .9rem; }
summary { cursor: pointer; color: #23634e; }
.source { border-top: 1px solid #d5ddd5; padding-top: 1rem; margin-top: 1rem; }
.source p { color: #53685e; }
.draft, .source { overflow-wrap: anywhere; }
[data-chat-status]:empty { display: none; }
[data-chat-form][aria-busy="true"] button { cursor: wait; }
[data-chat-error][hidden] { display: none; }
/* One viewport, one transcript scroller. The component owns its composer. */
body:has(.chat-ready) { height: 100dvh; display: flex; flex-direction: column; overflow: hidden; }
body:has(.chat-ready) > header { width: 100%; flex: 0 0 auto; padding-block: .8rem; }
body:has(.chat-ready) > main { width: 100%; max-width: 1200px; flex: 1; min-height: 0; padding: 1rem 1.5rem .5rem; display: flex; }
body:has(.chat-ready) > footer { display: none; }
[data-chat] { width: 100%; min-width: 0; }
.chat-ready { display: flex; flex-direction: column; min-height: 0; }
.chat-heading { display: flex; align-items: center; gap: 1.5rem; margin-bottom: 1rem; flex-shrink: 0; }
.chat-heading h1 { margin: 0; font-size: 1.2rem; line-height: 1.3; letter-spacing: -.02em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chat-heading > div { min-width: 0; }
.chat-heading > a { white-space: nowrap; }
.chat-layout { display: none; }
.chat-ready .chat-layout { display: grid; grid-template-columns: minmax(0, 1fr) 250px; gap: 1rem; flex: 1; min-height: 0; }
[data-chat-widget] { min-height: 0; min-width: 0; overflow: hidden; border: 1px solid #d5ddd5; border-radius: 12px; background: white; }
deep-chat { display: block; height: 100%; width: 100%; }
[data-chat-references] { overflow: auto; margin: 0; padding: .75rem; border: 1px solid #d5ddd5; border-radius: 12px; background: #fff; }
[data-chat-references] .source { font-size: .85rem; }
.chat-privacy { font-size: .72rem; color: #53685e; margin: .5rem 0 0; flex-shrink: 0; }
[data-chat-fallback][hidden] { display: none; }
@media (max-width: 700px) {
  body:has(.chat-ready) > header { flex-direction: row; align-items: center; padding: .6rem .75rem; font-size: .85rem; }
  body:has(.chat-ready) > main { padding: .6rem .5rem; }
  .chat-ready .chat-layout { display: flex; flex-direction: column; gap: .5rem; }
  [data-chat-widget] { flex: 1; }
  [data-chat-references] { flex-shrink: 0; max-height: 22dvh; padding: .5rem .75rem; }
  .chat-heading { gap: 1rem; margin-bottom: .5rem; }
  .chat-heading h1 { font-size: 1rem; }
}