/* Keep the user's voice distinct from the assistant without tinting long AI replies. */
#assistant .chat-row.user .chat-bubble {
  max-width: min(520px, calc(100% - 40px));
  min-width: 0;background: var(--luli-soft);border-color: var(--luli-container);color: var(--deep);
}

/* The dark-mode secondary accent needs a lighter tone for readable body text. */
html[data-theme="dark"] #assistant .chat-row.user .chat-bubble {color: var(--luli-link);
}

/* Approved V3 dialogue: keep the existing avatars, controls and motion. */
#assistant.assistant-chat .chat-row:not(.user) .chat-bubble {
  flex:0 1 auto;
  width:fit-content;
  max-width:min(710px,calc(100% - 42px));
  padding:17px 21px;
  border-radius:4px 17px 17px 17px!important;background:var(--luli-surface);
  line-height:1.85;
}
#assistant .chat-bubble blockquote {
  margin:16px 0;padding:10px 14px;border-left:3px solid var(--luli-content);background:var(--luli-soft);color:var(--ink);
}
#assistant .chat-bubble blockquote strong {display:inline;margin:0}
#assistant .chat-bubble em {font-style:italic}
#assistant .chat-questions {flex-basis:100%;margin:10px 0 0 42px;font-size:13px}
#assistant .chat-questions p {margin:8px 0}
#assistant .chat-questions button {font:inherit;padding:7px 0;margin-right:16px}
#assistant .chat-questions details {display:inline-block;vertical-align:top;color:var(--muted);margin:7px 0}
#assistant .chat-questions summary {cursor:pointer}
#assistant .workspace-center {--chat-composer-occupied:80px;--chat-composer-bottom:16px;--chat-edge-fade:48px}
/* Both pane headers share one border-box height, including their divider. */
#assistant .workspace-shell {--workspace-toolbar-height:66px}
#assistant .workspace-shell .chat-top,
#assistant .workspace-shell.has-context-pane .career-profile-toolbar {
  box-sizing:border-box;
  height:var(--workspace-toolbar-height);
  min-height:var(--workspace-toolbar-height);
  flex-shrink:0;
  margin-block:0;border-bottom:1px solid var(--luli-structure);
}
#assistant .workspace-shell .workspace-center .chat-top {
  padding:0 20px!important;border-bottom:0;
  background:transparent;
  backdrop-filter:none;
  box-shadow:none;
}
#assistant .chat-top .luli-chat-identity {display:flex;align-items:center;min-width:0}
#assistant .chat-top .ready {white-space:nowrap}
#assistant .chat-top .chat-actions {gap:4px}
#assistant .workspace-center .chat-body {
  scrollbar-width:none;
  scrollbar-gutter:auto;
  padding-bottom:calc(var(--chat-composer-occupied) + var(--chat-composer-bottom) + 64px)!important;
  scroll-padding-bottom:calc(var(--chat-composer-occupied) + var(--chat-composer-bottom) + 48px);
  /* Fade the content itself: no painted surface can mismatch the split pane. */
  mask-image:linear-gradient(to bottom,transparent,black 24px,black calc(100% - var(--chat-mask-bottom,82px) - var(--chat-edge-fade)),transparent calc(100% - var(--chat-mask-bottom,82px)));
}
#assistant .workspace-center .chat-body::-webkit-scrollbar {display:none;width:0;height:0}
#assistant .workspace-center .chat-composer {
  position:absolute!important;left:50%!important;right:auto!important;
  bottom:var(--chat-composer-bottom)!important;transform:translateX(-50%)!important;
  margin:0!important;width:min(850px,calc(100% - 36px))!important;
  overflow:visible;background:var(--luli-bg);backdrop-filter:none;z-index:3;border:1px solid transparent!important;
}
#assistant .workspace-center .chat-composer-backdrop {
  position:absolute;left:0;right:0;bottom:0;
  height:calc(var(--chat-composer-occupied) + var(--chat-composer-bottom));
  background:none;pointer-events:none;z-index:2;
}
#assistant .workspace-center .chat-composer-backdrop::before {
  content:none;
}
#assistant .workspace-center .chat-stop-control {
  position:absolute;left:50%;bottom:calc(var(--chat-composer-occupied) + var(--chat-composer-bottom) + 12px);
  transform:translateX(-50%);margin:0;z-index:5;
}
#assistant .chat-composer-question {position:absolute;bottom:100%;left:0;right:0;display:flex;align-items:center;gap:12px;padding:8px 12px;background:var(--luli-surface);border:1px solid var(--luli-control);border-radius:10px;font-size:12px}
#assistant .chat-composer-question span {flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#assistant .chat-composer-question button {border:0;background:transparent;color:var(--luli-on);font:inherit;cursor:pointer;padding:5px}
#assistant .conversation-question-list {display:grid;gap:8px;margin:10px 0 0}
#assistant .conversation-question-card {padding:12px 14px;border:1px solid var(--luli-control);border-radius:8px;background:var(--luli-surface)}
#assistant .conversation-question-card strong {display:block;font-size:12px}
#assistant .conversation-question-card p {margin:6px 0 0;line-height:1.5}
#assistant .conversation-question-card .conversation-question-why {color:var(--muted);font-size:12px}
#assistant .conversation-question-card small {display:block;margin-top:7px;color:var(--muted)}
#assistant .conversation-question-actions {display:flex;gap:10px;flex-wrap:wrap;margin-top:9px}
@media(max-width:760px){
  #assistant.assistant-chat .chat-row:not(.user) .chat-bubble {padding:13px 14px}
  #assistant .workspace-center {--chat-composer-bottom:max(12px,env(safe-area-inset-bottom));--chat-edge-fade:38px}
  #assistant .workspace-center .chat-composer {width:calc(100% - 28px)!important}
}

#assistant .chat-waiting {font-size:12px;color:var(--muted)}
/* Waiting is a compact status, without the answer's separate cursor line. */
#assistant .chat-bubble:has(> .chat-waiting) {padding:12px 17px}
#assistant .chat-bubble > .chat-waiting {margin:0}
#assistant .chat-row.is-streaming .chat-bubble:has(> .chat-waiting)::after {content:none}
#assistant .chat-bubble > .chat-process:has(+ .chat-answer[hidden]) {margin:0;padding:0;border:0}
html[data-theme="dark"] #assistant .chat-composer-question button {color:var(--luli-on)}

#assistant .chat-composer .composer-input::placeholder {color:var(--muted);opacity:1}

/* Only newly sent messages enter; restoring history must not replay a stagger. */
#assistant .chat-row {animation:none}
#assistant .chat-row[data-message-motion="live"] {
  animation:luli-message-enter 360ms cubic-bezier(.22,1,.36,1) both;
}
#assistant .chat-row.user[data-message-motion="live"] {animation-duration:320ms}
#assistant .chat-row:not(.user)[data-message-motion="live"] {animation-delay:90ms}
@keyframes luli-message-enter {
  from {opacity:0;translate:0 10px}
  to {opacity:1;translate:0 0}
}
@media(prefers-reduced-motion:reduce){
  #assistant .chat-row[data-message-motion="live"] {animation:none}
}