/* Chat-only layout. Keep the shared shell and other study-set pages untouched. */
body[data-active-tab="study"] .app {
  grid-template-columns: var(--sidebar-width) minmax(0, 1fr);
}

body[data-active-tab="study"] .topbar {
  display: none;
}

body[data-active-tab="study"] .study-chat-panel {
  position: relative;
  padding: 0;
  background: var(--canvas);
}

body[data-active-tab="study"] .study-chat-toolbar {
  flex: 0 0 56px;
  min-height: 56px;
  justify-content: flex-start;
  gap: 14px;
  padding: 0 224px 0 24px;
  border-bottom: 0;
  background: var(--canvas);
}

.study-chat-path {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 11px;
  color: #77746b;
  font-size: 14px;
}

.study-chat-path button {
  flex: 0 1 auto;
  min-width: 0;
  overflow: hidden;
  padding: 0;
  border: 0;
  color: inherit;
  background: transparent;
  text-decoration: underline;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
}

.study-chat-path-divider { color: #aaa79f; font-size: 20px; }
.study-chat-title-icon { display: inline-flex; flex: none; color: #d99dec; }
.study-chat-title-icon .icon { width: 19px; height: 19px; stroke-width: 1.7; }
.study-chat-path strong { overflow: hidden; color: #292929; font-size: 15px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }

body[data-active-tab="study"] .study-chat-toolbar-actions {
  flex: 0 0 auto;
  width: auto;
  gap: 8px;
  margin: 0;
}

body[data-active-tab="study"] .study-chat-toolbar-actions .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 34px;
  padding: 0 5px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #6a6862;
  font-size: 14px;
  font-weight: 500;
}

body[data-active-tab="study"] .study-chat-toolbar-actions .chat-toolbar-icon {
  display: inline-grid;
  width: 34px;
  padding: 0;
  place-items: center;
}

body[data-active-tab="study"] .study-chat-toolbar-actions .btn:hover,
body[data-active-tab="study"] .study-chat-toolbar-actions .btn[aria-expanded="true"] {
  background: #f1efe9;
  color: #242424;
}

body[data-active-tab="study"] .study-chat-toolbar-actions .icon { width: 17px; height: 17px; }
body[data-active-tab="study"] .study-chat-toolbar-actions .btn > [data-icon] { display: inline-flex; }
body[data-active-tab="study"] .topbar-actions { right: 24px; gap: 12px; }
body[data-active-tab="study"] .account-menu-toggle .status-line { padding: 0; }
body[data-active-tab="study"] .account-menu-toggle #systemStatus { display: none; }
body[data-active-tab="study"] .account-menu-toggle .status-line::before { content: none; }
body[data-active-tab="study"] .account-menu-toggle .status-line::after {
  content: attr(data-session-initial);
  display: inline-grid;
  place-items: center;
  color: #4c4a44;
  font: 600 13px/1 var(--font-ui);
}
body[data-active-tab="study"] .account-menu-toggle .status-line.has-avatar::after { color: transparent; }
body[data-active-tab="study"] .chat-history-popover { top: 54px; right: 20px; }
body[data-active-tab="study"] .chat-activity-bar { background: var(--canvas); }

body[data-active-tab="study"] .chat-box {
  width: 100%;
  padding: 0 24px;
  background: var(--canvas);
  scrollbar-gutter: stable;
}

body[data-active-tab="study"] .guided-chat {
  width: min(100%, 1020px);
  min-height: 100%;
  margin: 0 auto;
  padding: clamp(86px, 16vh, 170px) 12px 36px;
  align-content: start;
  justify-items: center;
  gap: 0;
}

body[data-active-tab="study"] .guided-intro {
  gap: 12px;
  margin-bottom: 30px;
}

body[data-active-tab="study"] .guided-avatar {
  width: 82px;
  height: 82px;
  object-fit: cover;
  background: #f4d9fa;
}

body[data-active-tab="study"] .guided-intro h3 {
  color: #22211e;
  font: 400 21px/1.4 var(--font-reading);
}

body[data-active-tab="study"] .guided-questions {
  width: 100%;
  max-width: 940px;
  gap: 8px;
  align-items: center;
}

body[data-active-tab="study"] .guided-question {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 7px;
  width: auto;
  min-height: 38px;
  padding: 7px 12px;
  border: 1px solid #e4e2dc;
  border-radius: 999px;
  background: #fff;
  color: #33312e;
  box-shadow: none;
  font-size: 13px;
  line-height: 20px;
}

body[data-active-tab="study"] .guided-question:hover {
  border-color: #bdbab1;
  background: #fff;
}

.guided-question-icon { display: inline-flex; color: #6f6ae9; }
.guided-question-icon .icon { width: 16px; height: 16px; }
body[data-active-tab="study"] .guided-question:nth-child(n+3) .guided-question-icon { color: #39b36d; }
body[data-active-tab="study"] .guided-question:nth-child(n+5) .guided-question-icon { color: #e88d57; }

.guided-more {
  margin: 13px 0 12px;
  padding: 4px 10px;
  border: 0;
  background: transparent;
  color: #817e76;
  font-size: 13px;
  cursor: pointer;
}

.guided-more:hover { color: #22211e; text-decoration: underline; }
body[data-active-tab="study"] .guided-secondary-actions { gap: 8px; }

body[data-active-tab="study"] .guided-secondary-actions .btn {
  min-height: 34px;
  padding: 0 14px;
  border: 0;
  border-radius: 999px;
  background: #f1efe8;
  color: #3d3b36;
  font-size: 13px;
  font-weight: 500;
}

body[data-active-tab="study"] .guided-secondary-actions .icon { width: 16px; height: 16px; }

body[data-active-tab="study"] [data-question-bank] {
  width: min(100%, 850px);
  max-height: 180px;
  margin-top: 15px;
  overflow: auto;
}

body[data-active-tab="study"] .composer {
  width: min(860px, calc(100% - 48px));
  margin: 0 auto 20px;
  border: 1px solid #dedbd4;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 2px 5px #00000005;
}

body[data-active-tab="study"] .composer .textarea {
  min-height: 64px;
  max-height: 180px;
  padding: 16px 17px 6px;
  border: 0;
  background: #fff;
  font-size: 15px;
  line-height: 1.5;
  resize: vertical;
}

body[data-active-tab="study"] .composer-actions {
  display: flex;
  min-height: 48px;
  gap: 12px;
  padding: 5px 9px 9px 12px;
  border-top: 0;
  background: #fff;
}

body[data-active-tab="study"] .composer-tools .btn {
  min-height: 32px;
  padding: 0 9px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: #69665e;
  font-size: 13px;
  font-weight: 500;
}

body[data-active-tab="study"] .composer-tools .btn:hover { background: #f4f2eb; color: #232321; }
body[data-active-tab="study"] .composer-buttons { margin-left: auto; }

body[data-active-tab="study"] #sendMessage {
  width: 36px;
  min-height: 36px;
  padding: 0;
  border-radius: 8px;
}

body[data-active-tab="study"] #sendMessage .icon { width: 20px; height: 20px; }

body[data-active-tab="study"] .message-wrap {
  width: min(100%, 860px);
  margin-inline: auto;
  padding: 12px 0;
}

body[data-active-tab="study"] .message-wrap.assistant {
  grid-template-columns: 32px minmax(0, 1fr);
  column-gap: 12px;
}

body[data-active-tab="study"] .message-wrap.assistant > :not(.message-label) { grid-column: 2; }
body[data-active-tab="study"] .message-label { grid-column: 1; align-self: start; padding: 0; font-size: 0; }
body[data-active-tab="study"] .message-label > span:last-child { display: none; }

body[data-active-tab="study"] .assistant-mark {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #f4d9fa url("/assets/brand/ai-tutor-cat-avatar.png") center / cover no-repeat;
  font-size: 0;
}

body[data-active-tab="study"] .message { max-width: 100%; }
body[data-active-tab="study"] .message.user { max-width: min(76%, 620px); padding: 13px 17px; border: 0; border-radius: 16px; background: #f5f3eb; }
body[data-active-tab="study"] .message.assistant { padding: 3px 0 0; border: 0; background: transparent; box-shadow: none; }
body[data-active-tab="study"] .inline-citations { grid-column: 2; border-radius: 8px; }
body[data-active-tab="study"] .message-actions { grid-column: 2; }

body[data-active-tab="study"] :is(.study-chat-path button, .study-chat-toolbar button, .guided-question, .guided-more, .composer button):focus-visible {
  outline: 2px solid #22211e;
  outline-offset: 3px;
}

/* Keep the composer border stable when toolbar controls gain or lose focus. */

@media (max-width: 1240px) {
  body[data-active-tab="study"] .app { grid-template-columns: 84px minmax(0, 1fr); }
}

@media (max-width: 960px) {
  body[data-active-tab="study"] .app { grid-template-columns: 76px minmax(0, 1fr); }
}

@media (max-width: 1080px) {
  body[data-active-tab="study"] { overflow: hidden; }
  body[data-active-tab="study"] .app,
  body[data-active-tab="study"] .main { height: 100vh; min-height: 0; overflow: hidden; }
  body[data-active-tab="study"] #study { overflow: hidden; }
  body[data-active-tab="study"] .study-grid,
  body[data-active-tab="study"] .study-chat-panel { height: 100%; min-height: 0; }
  body[data-active-tab="study"] .chat-box { min-height: 0; }
}

@media (max-width: 960px) {
  body[data-active-tab="study"] .study-chat-toolbar { padding-right: 174px; }
  body[data-active-tab="study"] .topbar-actions { right: 12px; gap: 6px; }
}

@media (max-width: 700px) {
  body[data-active-tab="study"] .app { grid-template-columns: minmax(0, 1fr); }
  body[data-active-tab="study"] .topbar { display: flex; flex: 0 0 48px; padding: 0 12px; border-bottom: 0; background: var(--canvas); }
  body[data-active-tab="study"] .topbar .page-title,
  body[data-active-tab="study"] .topbar .topbar-actions { display: none; }
  body[data-active-tab="study"] .study-chat-toolbar { min-height: 50px; flex-wrap: nowrap; gap: 6px; padding: 0 12px; }
  body[data-active-tab="study"] .study-chat-path { gap: 7px; font-size: 12px; }
  body[data-active-tab="study"] .study-chat-path strong { font-size: 13px; }
  body[data-active-tab="study"] .study-chat-title-icon .icon { width: 16px; height: 16px; }
  body[data-active-tab="study"] .study-chat-toolbar-actions { gap: 0; }
  body[data-active-tab="study"] .study-chat-toolbar-actions .btn { min-width: 30px; padding: 0 5px; font-size: 0; }
  body[data-active-tab="study"] .study-chat-toolbar-actions .chat-toolbar-icon { width: 30px; }
  body[data-active-tab="study"] .study-chat-toolbar-actions .icon { width: 18px; height: 18px; }
  body[data-active-tab="study"] .chat-box { padding: 0 12px; }
  body[data-active-tab="study"] .guided-chat { padding: 25px 0; }
  body[data-active-tab="study"] .guided-questions { justify-content: center; }
  body[data-active-tab="study"] .guided-question { max-width: 100%; white-space: normal; }
  body[data-active-tab="study"] .guided-intro { margin-bottom: 18px; }
  body[data-active-tab="study"] .composer { width: calc(100% - 20px); margin: 0 10px 10px; }
  body[data-active-tab="study"] .message-wrap { width: 100%; }
}

/* Confirmed right-chat replica: the existing workbench canvas stays warm beige. */
body[data-active-tab="study"] .study-chat-panel {
  --chat-width: 820px;
  background: #F7F5EF;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
}
body[data-active-tab="study"] .study-chat-toolbar { background: #F7F5EF; }
body[data-active-tab="study"] .chat-box { background: #F7F5EF; padding: 12px 24px 24px; }
body[data-active-tab="study"] .message-wrap { width: min(100%, var(--chat-width)); padding: 16px 0; }
body[data-active-tab="study"] .message-wrap.assistant { grid-template-columns: 28px minmax(0, 1fr); column-gap: 12px; }
body[data-active-tab="study"] .assistant-mark { width: 28px; height: 28px; }
body[data-active-tab="study"] .message.user { background: #EDF3FF; border-radius: 20px; padding: 10px 18px; font-size: 15px; line-height: 26px; }
body[data-active-tab="study"] .message.assistant { padding: 0; font-size: 15px; line-height: 26px; font-family: inherit; }
body[data-active-tab="study"] .message.assistant :is(h1,h2,h3,h4,h5,h6) { font-weight: 600; font-size: 19px; line-height: 29px; font-family: inherit; margin: 26px 0 12px; }
body[data-active-tab="study"] .message.assistant > :first-child { margin-top: 0; }
body[data-active-tab="study"] .message.assistant p { margin: 0 0 14px; }
body[data-active-tab="study"] .message.assistant li { margin: 6px 0; }
body[data-active-tab="study"] .message.assistant :is(ul,ol) { padding-left: 24px; margin: 0 0 14px; }
body[data-active-tab="study"] .message.assistant pre { padding: 16px; overflow: auto; background: #ecebe7; border-radius: 10px; white-space: pre; }
body[data-active-tab="study"] .message.assistant code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 13px; }
body[data-active-tab="study"] .chat-table { overflow-x: auto; }
body[data-active-tab="study"] .chat-table table { width: 100%; border-collapse: collapse; }
body[data-active-tab="study"] .chat-table :is(th,td) { text-align: left; padding: 8px 12px; border: 1px solid #dedbd4; }
body[data-active-tab="study"] .chat-thinking { margin-bottom: 12px; color: #8A8D94; font-size: 14px; line-height: 24px; }
body[data-active-tab="study"] .chat-thinking:empty { display: none; }
body[data-active-tab="study"] .chat-thinking details { margin-bottom: 12px; }
body[data-active-tab="study"] .chat-thinking summary { cursor: pointer; font-size: 14px; line-height: 24px; color: #8A8D94; }
body[data-active-tab="study"] .chat-thinking summary:focus-visible { outline: 2px solid #4D6BFE; outline-offset: 3px; }
body[data-active-tab="study"] .chat-thinking-body { white-space: pre-wrap; overflow-wrap: anywhere; border-left: 2px solid #d9dce2; padding-left: 14px; margin-top: 10px; }
body[data-active-tab="study"] .chat-operation-status { font-size: 12px; line-height: 20px; color: #8A8D94; margin-top: 8px; }
body[data-active-tab="study"] .chat-operation-status[data-status="failed"] { color: #ba4d4d; }
body[data-active-tab="study"] .composer { width: min(var(--chat-width), calc(100% - 48px)); border-radius: 22px; border: 1px solid #dedee3; box-shadow: 0 3px 12px #00000008; margin: 0 auto 20px; flex-shrink: 0; }
body[data-active-tab="study"] .composer .textarea { font-family: inherit; line-height: 26px; padding: 16px 18px 6px; border-radius: 22px 22px 0 0; resize: none; }
body[data-active-tab="study"] .composer-actions { border-radius: 0 0 22px 22px; padding: 6px 14px 12px; min-height: 50px; }
body[data-active-tab="study"] .composer-tools .btn { color: #4D6BFE; background: #EDF3FF; border-radius: 8px; }
body[data-active-tab="study"] .composer-buttons { align-items: center; }
body[data-active-tab="study"] :is(#sendMessage,#stopChat) { display: inline-grid; width: 32px; height: 32px; min-height: 32px; padding: 0; place-items: center; border: 0; border-radius: 50%; background: #4D6BFE; color: #fff; }
body[data-active-tab="study"] :is(#sendMessage,#stopChat)[hidden] { display: none; }
body[data-active-tab="study"] :is(#sendMessage,#stopChat):disabled { background: #b9c8ff; opacity: 1; cursor: default; }
body[data-active-tab="study"] :is(#sendMessage,#stopChat):hover:not(:disabled) { background: #3855e9; }
body[data-active-tab="study"] :is(#sendMessage,#stopChat):active:not(:disabled) { transform: scale(.94); }
body[data-active-tab="study"] :is(#sendMessage,#stopChat):focus-visible { outline: 2px solid #4D6BFE; outline-offset: 3px; }
body[data-active-tab="study"] :is(#sendMessage,#stopChat) :is(svg,.icon) { width: 20px; height: 20px; }
body[data-active-tab="study"] #chatReturnBottom { position: absolute; bottom: 154px; left: 50%; transform: translateX(-50%); min-height: 32px; width: 32px; border-radius: 50%; padding: 0; background: #fff; box-shadow: 0 2px 8px #00000010; }
body[data-active-tab="study"] #chatReturnBottom[hidden] { display: none; }
body[data-active-tab="study"] .guided-chat { width: min(100%, var(--chat-width)); min-height: 100%; padding: 24px 0; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 0; }
body[data-active-tab="study"] .chat-is-empty #chatBox { display: flex; align-items: center; justify-content: center; }
body[data-active-tab="study"] .chat-is-empty .guided-chat { min-height: auto; }
body[data-active-tab="study"] .guided-intro { margin-bottom: 24px; }
body[data-active-tab="study"] .guided-avatar { width: 48px; height: 48px; }
body[data-active-tab="study"] .guided-intro h3 { font-family: inherit; font-size: 24px; line-height: 34px; }
body[data-active-tab="study"] .guided-chat .composer { width: 100%; margin-bottom: 18px; }
body[data-active-tab="study"] .guided-questions { display: flex; justify-content: center; gap: 8px; }
body[data-active-tab="study"] .guided-question { border: 1px solid #dddfe8; background: transparent; color: #646b7b; }
body[data-active-tab="study"] .chat-count-options { width: min(100%, var(--chat-width)); margin: 0 auto; padding-left: 40px; }
body[data-active-tab="study"] :is(.study-chat-toolbar button, .guided-question, .guided-more, .composer button, .chat-count-options button, .confirmed-plan-actions button, #chatReturnBottom):focus-visible {
  outline: 2px solid #4D6BFE;
  outline-offset: 3px;
}

/* Research controls inherit the existing composer and auxiliary-text styles. */
body[data-active-tab="study"] .composer-tools .chat-web-search { border: 0; transition: background-color 160ms ease, color 160ms ease; }
body[data-active-tab="study"] .composer-tools .chat-web-search[aria-pressed="false"] { color: #646b7b; background: #eeeeed; }
body[data-active-tab="study"] .composer-tools .chat-web-search[aria-pressed="true"] { color: #4D6BFE; background: #EDF3FF; }
body[data-active-tab="study"] .composer-tools .chat-web-search[aria-pressed="false"]:hover:not(:disabled) { background: #e7e7e5; color: #646b7b; }
body[data-active-tab="study"] .composer-tools .chat-web-search[aria-pressed="true"]:hover:not(:disabled) { background: #e4ecff; color: #4D6BFE; }
body[data-active-tab="study"] .chat-search-record { grid-column: 2; margin-bottom: 12px; color: #8A8D94; font-size: 14px; line-height: 24px; }
body[data-active-tab="study"] .chat-search-record summary { cursor: pointer; font-size: 14px; line-height: 24px; color: #8A8D94; }
body[data-active-tab="study"] .chat-search-record summary:focus-visible { outline: 2px solid #4D6BFE; outline-offset: 3px; }
body[data-active-tab="study"] .chat-search-action + .chat-search-action { margin-top: 12px; }

/* A toggle changes color without the generic button press jump or dimming. */
body[data-active-tab="study"] .composer-tools .chat-web-search:active:not(:disabled) { transform: none; filter: none; }
@media (prefers-reduced-motion: reduce) {
  body[data-active-tab="study"] .composer-tools .chat-web-search { transition: none; }
}

/* Local math rendering keeps the existing body hierarchy and composer styles. */
.study-chat-panel .message.assistant .katex { font-size: 1.08em; }
.study-chat-panel .message.assistant .katex-display { margin: .6em 0; overflow-x: auto; overflow-y: hidden; }
.study-chat-panel .message.assistant .chat-math-fallback { white-space: pre-wrap; overflow-wrap: anywhere; }
.chat-learning-notes{display:grid;gap:12px;margin-top:14px}
.chat-note-suggestion,.chat-note-document{padding:14px 16px;border:1px solid var(--line,#deddd5);border-radius:12px;background:var(--workspace-panel,#fff)}
.chat-learning-notes p{margin:0 0 8px;line-height:inherit}
.chat-note-document strong{display:block;margin-bottom:6px;font-size:inherit;font-weight:600}
.chat-learning-notes .message-actions{margin-top:8px}