@import url('/vendor/katex/katex.min.css');

:root {
  --canvas: #f7f7f8;
  --paper: #ffffff;
  --ink: #0d0d0d;
  --muted: #676767;
  --quiet: #8f8f8f;
  --line: #e5e5e5;
  --hover: #ececec;
  --sidebar: #f9f9f9;
  --dawn: #f07b61;
  --dawn-soft: #fff0eb;
  --search: #4d6bfe;
  --display: "Songti SC", "Noto Serif SC", STSong, serif;
  --body: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
}

* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body, button, input, textarea { font-family: var(--body); color: var(--ink); }
button, input, textarea { font: inherit; }
button { -webkit-tap-highlight-color: transparent; }
[hidden] { display: none !important; }

.site-filing {
  min-height: 34px;
  padding: 8px 16px;
  display: grid;
  place-items: center;
  border-top: 1px solid #e2e9f0;
  background: #f7fafd;
  color: #7b8b9e;
  text-align: center;
}
.site-filing a {
  color: inherit;
  font-size: 11px;
  line-height: 1.35;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  transition: color .15s;
}
.site-filing a:hover { color: #35516f; }
.site-filing a:focus-visible { outline: 2px solid #8099b2; outline-offset: 3px; border-radius: 2px; }

.xiaoxi-mascot {
  position: fixed;
  z-index: 2147483000;
  top: 18px;
  right: 22px;
  width: clamp(68px, 7vw, 88px);
  aspect-ratio: 1;
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  background: transparent;
  cursor: grab;
  touch-action: none;
  user-select: none;
  -webkit-user-select: none;
}
.xiaoxi-mascot:focus-visible { border-radius: 26%; box-shadow: 0 0 0 3px rgb(77 107 254 / 28%); }
.xiaoxi-mascot.is-held { cursor: grabbing; }
.xiaoxi-mascot img { display: block; width: 100%; height: 100%; pointer-events: none; object-fit: contain; }

/* Login */
.login-page {
  min-height: 100vh;
  display: grid;
  grid-template-rows: auto 1fr auto;
  background: #f6f6f5;
}
.login-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 24px 30px;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: -.02em;
}
.login-main {
  display: grid;
  place-items: center;
  padding: 42px 24px;
}
.auth-card {
  width: min(380px, 100%);
  padding: 36px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  border: 1px solid #e7e7e4;
  border-radius: 24px;
  background: var(--paper);
}

.auth-heading { text-align: center; margin-bottom: 6px; }
.auth-heading h1 {
  margin: 0;
  font-size: 32px;
  line-height: 1.2;
  letter-spacing: -.035em;
}
.auth-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
  padding: 4px;
  border-radius: 12px;
  background: #f3f3f2;
}
.auth-tab {
  height: 40px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: var(--muted);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: background .15s, color .15s;
}
.auth-tab.is-active { background: var(--paper); color: var(--ink); font-weight: 650; }
.field { display: grid; gap: 6px; }
.field label { font-size: 14px; font-weight: 600; }
.field input {
  display: block;
  width: 100%;
  height: 44px;
  margin: 0;
  padding: 0 16px;
  border: 1px solid transparent;
  border-radius: 12px;
  outline: 0;
  background: #f3f3f2;
  font-size: 16px;
  transition: border-color .15s, background .15s;
}
.field input::placeholder { color: #9a9a9a; }
.field input:focus { border-color: #9d9d99; background: var(--paper); }
.email-fields { display: grid; gap: 14px; }
.field-row { display: grid; grid-template-columns: 1fr auto; gap: 10px; }
.field-row input { min-width: 0; }
.code-button {
  height: 44px;
  padding: 0 18px;
  border: 1px solid #e7e7e4;
  border-radius: 12px;
  background: var(--paper);
  color: var(--ink);
  font-size: 14px;
  font-weight: 650;
  white-space: nowrap;
  cursor: pointer;
  transition: background .15s;
}
.code-button:hover { background: #f3f3f2; }
.form-error { min-height: 18px; margin: -4px 0 -5px; color: #c5362f; font-size: 13px; }
.primary-button {
  min-height: 46px;
  border: 1px solid var(--ink);
  border-radius: 10px;
  background: var(--ink);
  color: white;
  font-weight: 650;
  cursor: pointer;
  transition: background .15s, transform .15s;
}
.primary-button:hover { background: #2b2b2b; }
.primary-button:active { transform: scale(.99); }
button:disabled { cursor: not-allowed; opacity: .45; }
.auth-switch { margin: 2px 0 0; text-align: center; color: var(--muted); font-size: 14px; }
.auth-switch button { border: 0; padding: 3px 5px; background: none; color: var(--ink); font-weight: 650; cursor: pointer; }
.auth-switch button:hover { text-decoration: underline; }
/* Chat shell */
.chat-page { height: 100vh; overflow: hidden; background: var(--paper); }
.chat-layout { height: 100vh; display: grid; grid-template-columns: 260px minmax(0, 1fr); }
.sidebar {
  min-width: 0;
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 7px;
  background: var(--sidebar);
}
.side-brand { height: 44px; padding: 5px 8px; display: flex; align-items: center; gap: 10px; }
.side-brand b { font-size: 15px; letter-spacing: -.01em; }
.new-chat {
  height: 42px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 10px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  text-align: left;
  font-size: 14px;
  cursor: pointer;
}
.new-chat span { font-size: 20px; font-weight: 300; }
.new-chat:hover { background: var(--hover); }
.conversation-list { margin-top: 17px; }
.conversation-items { display: grid; gap: 2px; }
.history-label { margin: 0; padding: 0 10px 8px; color: var(--quiet); font-size: 12px; font-weight: 600; }
.conversation-row { position: relative; min-width: 0; }
.conversation-chip {
  position: relative;
  width: 100%;
  padding: 10px 44px 10px 10px;
  display: grid;
  gap: 4px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  text-align: left;
  cursor: pointer;
  transition: background-color .12s ease;
}
.conversation-row:hover .conversation-chip,
.conversation-row.context-open .conversation-chip { background: #ededed; }
.conversation-chip.active { background: #e7e7e7; }
.conversation-chip:focus-visible { outline: 2px solid #a3a3a3; outline-offset: -2px; }
.conversation-chip span { overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.conversation-chip small { color: var(--quiet); font-size: 11px; }
.conversation-more {
  position: absolute;
  top: 50%;
  right: 7px;
  transform: translateY(-50%);
  width: 30px;
  height: 30px;
  padding: 0;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--quiet);
  font-size: 13px;
  letter-spacing: 1px;
  cursor: pointer;
}
.conversation-more:hover,
.conversation-row.context-open .conversation-more { background: #dcdcdc; color: var(--ink); }
.conversation-more:focus-visible { outline: 2px solid #a3a3a3; outline-offset: 1px; }
.conversation-empty { margin: 0; padding: 10px; color: var(--quiet); font-size: 12px; line-height: 1.5; }
.conversation-menu {
  position: fixed;
  z-index: 30;
  box-sizing: border-box;
  max-width: calc(100vw - 16px);
  max-height: calc(100dvh - 16px);
  overflow-y: auto;
  min-width: 148px;
  padding: 5px;
  border: 1px solid #dedede;
  border-radius: 10px;
  background: var(--paper);
  box-shadow: 0 8px 24px rgb(0 0 0 / 10%);
}
.conversation-menu button {
  width: 100%;
  min-height: 36px;
  padding: 7px 9px;
  display: flex;
  align-items: center;
  gap: 9px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: #a33a36;
  text-align: left;
  font-size: 13px;
  cursor: pointer;
}
.conversation-menu button:hover,
.conversation-menu button:focus-visible { outline: 0; background: #f3eeee; }
.conversation-menu svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; }
.sidebar-spacer { flex: 1; }
.profile-block {
  width: 100%;
  min-height: 56px;
  padding: 8px 9px;
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr) auto;
  align-items: center;
  gap: 9px;
  border: 0;
  border-top: 1px solid var(--line);
  background: transparent;
  text-align: left;
  cursor: pointer;
}
.profile-block:hover { border-radius: 9px; background: var(--hover); }
.avatar { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; background: #dedede; font-size: 12px; font-weight: 700; }
.profile-copy { min-width: 0; display: grid; gap: 2px; }
.profile-copy b { overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.profile-copy small { color: var(--quiet); font-size: 10px; }
.profile-arrow { color: var(--quiet); font-size: 17px; transform: translateX(-2px); }

.chat-main { min-width: 0; height: 100vh; display: grid; grid-template-rows: 58px minmax(0, 1fr) auto; background: var(--paper); }
.sidebar-scrim { display: none; }
.chat-header { padding: 0 22px; display: flex; align-items: center; gap: 10px; }
.menu-button { display: none; border: 0; background: none; font-size: 20px; }
.messages { overflow-y: auto; padding: 32px max(24px, calc((100% - 760px) / 2)) 28px; scroll-behavior: auto; }
.welcome { max-width: 660px; margin: 21vh auto 0; text-align: center; }
.welcome h1 { margin: 0 0 12px; font-size: clamp(26px, 3vw, 32px); line-height: 1.25; letter-spacing: -.035em; }
.welcome p { margin: 0; color: var(--muted); font-size: 14px; }
.message-row { max-width: 760px; margin: 0 auto 28px; }
.message-inner { display: flex; align-items: flex-start; gap: 13px; }
.message-row.user .message-inner { justify-content: flex-end; }
.message-avatar { width: 28px; height: 28px; flex: 0 0 28px; display: grid; place-items: center; border-radius: 50%; background: var(--ink); color: white; font-family: var(--display); font-size: 13px; }
.message-stack { min-width: 0; display: grid; gap: 5px; }
.message-row.user .message-stack { max-width: 78%; justify-items: end; }
.message-row.assistant .message-stack { max-width: calc(100% - 41px); }
.message-bubble { font-size: 15px; line-height: 1.75; overflow-wrap: anywhere; white-space: pre-wrap; }
.message-row.user .message-bubble { max-width: 100%; padding: 10px 16px; border-radius: 18px; background: #f4f4f4; }
.message-images { min-width: 0; max-width: 100%; display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.message-row.user .message-images { align-items: flex-end; justify-self: end; }
.message-row.assistant .message-images { justify-self: start; }
.message-image { display: block; max-width: 100%; width: auto; max-height: 360px; height: auto; border-radius: 10px; object-fit: contain; }
.message-image-button { display: block; max-width: 100%; padding: 0; border: 0; border-radius: 10px; background: transparent; cursor: zoom-in; }
.message-image-button:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }
.message-videos { min-width: 0; max-width: 100%; }
.message-video { display: block; width: min(100%, 640px); max-height: 480px; border-radius: 10px; background: #171717; }
.image-viewer { box-sizing: border-box; max-width: calc(100vw - 32px); max-height: calc(100dvh - 32px); padding: 12px; overflow: auto; border: 0; border-radius: 14px; background: #181818; box-shadow: 0 24px 80px rgb(0 0 0 / 30%); }
.image-viewer::backdrop { background: rgb(0 0 0 / 78%); }
.image-viewer img { display: block; max-width: calc(100vw - 56px); max-height: calc(100dvh - 56px); width: auto; height: auto; object-fit: contain; cursor: zoom-in; }
.image-viewer.is-zoomed img { max-width: none; max-height: none; cursor: zoom-out; }
.image-viewer-close { position: fixed; top: 16px; right: 16px; z-index: 1; width: 34px; height: 34px; padding: 0; border: 0; border-radius: 50%; background: rgb(0 0 0 / 65%); color: #fff; font-size: 25px; line-height: 1; cursor: pointer; }
.image-viewer-close:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.knowledge-viewer {
  box-sizing: border-box;
  width: min(900px, calc(100vw - 32px));
  max-height: calc(100dvh - 32px);
  padding: 0;
  overflow: hidden;
  border: 1px solid #dfe7ef;
  border-radius: 20px;
  color: var(--ink);
  background: #f7fafd;
  box-shadow: 0 24px 80px rgb(20 35 55 / 24%);
}
.knowledge-viewer::backdrop { background: rgb(20 31 45 / 42%); backdrop-filter: blur(3px); }
.knowledge-viewer[open] { display: grid; grid-template-rows: auto auto minmax(0, 1fr) auto auto; }
.knowledge-viewer-header {
  min-height: 76px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  padding: 18px 22px 13px;
  border-bottom: 1px solid #e4ebf2;
  background: #fff;
}
.knowledge-viewer-header > div { min-width: 0; }
.knowledge-viewer-scope {
  display: inline-block;
  margin-bottom: 7px;
  padding: 3px 8px;
  border-radius: 999px;
  color: #557596;
  background: #e9f1f8;
  font-size: 10px;
  font-weight: 650;
}
.knowledge-viewer-scope.is-public { color: #8a593e; background: #fff1e9; }
.knowledge-viewer-header h2 {
  margin: 0;
  overflow: hidden;
  color: #213047;
  font: 600 24px/1.35 var(--display);
  letter-spacing: -.025em;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.knowledge-viewer-header h2:focus { outline: 0; }
.knowledge-viewer-close {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  color: #65788e;
  background: #f2f5f8;
  font-size: 24px;
  line-height: 1;
}
.knowledge-viewer-close:hover { color: #213047; background: #e9eef4; }
.knowledge-viewer-meta { margin: 0; padding: 10px 23px; border-bottom: 1px solid #e8eef4; color: #7b8b9e; background: #fbfdff; font-size: 11px; }
.knowledge-viewer-body { min-height: 0; overflow-y: auto; padding: 28px clamp(20px, 5vw, 52px) 42px; background: #fff; }
.knowledge-viewer-content { max-width: 760px; margin: 0 auto; color: #303030; font-size: 15px; line-height: 1.85; }
.knowledge-viewer-content img { cursor: zoom-in; }
.knowledge-viewer-footer {
  min-height: 60px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 11px 22px;
  border-top: 1px solid #e4ebf2;
  background: #fbfdff;
}
.knowledge-viewer-footer > span { color: #7b8b9e; font-size: 11px; line-height: 1.55; }
.knowledge-edit-button {
  min-height: 38px;
  flex: 0 0 auto;
  padding: 0 14px;
  border: 1px solid #cad7e5;
  border-radius: 10px;
  color: #35516f;
  background: #f6f9fc;
  font-size: 12px;
  font-weight: 650;
}
.knowledge-edit-button:hover { border-color: #9fb5cc; background: #edf4fa; }
.knowledge-challenge-button {
  min-height: 38px;
  flex: 0 0 auto;
  padding: 0 14px;
  border: 1px solid #e3c9c3;
  border-radius: 10px;
  color: #a33a36;
  background: #fff;
  font-size: 12px;
  font-weight: 650;
}
.knowledge-challenge-button:hover { border-color: #d4aca4; background: #fff7f5; }
.knowledge-challenge-panel {
  padding: 16px 22px 18px;
  border-top: 1px solid #efd9d4;
  background: #fffaf8;
}
.knowledge-challenge-panel label { display: flex; justify-content: space-between; margin-bottom: 7px; color: #5d4b47; font-size: 12px; font-weight: 650; }
.knowledge-challenge-panel label span { color: #9a8d89; font-size: 10px; font-weight: 400; }
.knowledge-challenge-panel textarea {
  box-sizing: border-box;
  width: 100%;
  resize: vertical;
  min-height: 84px;
  padding: 10px 12px;
  border: 1px solid #e4d4d0;
  border-radius: 10px;
  outline: 0;
  background: #fff;
  font-size: 13px;
  line-height: 1.65;
}
.knowledge-challenge-panel textarea:focus { outline: 0; border-color: #e4d4d0; box-shadow: none; }
.knowledge-challenge-panel > p { margin: 7px 0 0; color: #927d78; font-size: 11px; line-height: 1.55; }
.knowledge-challenge-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 12px; }
.knowledge-challenge-actions button { min-height: 36px; padding: 0 13px; border-radius: 9px; font-size: 12px; font-weight: 650; }
.quiet-action { border: 1px solid #e1e5e9; color: #637286; background: #fff; }
.quiet-action:hover { background: #f3f5f7; }
.danger-action { border: 1px solid #a33a36; color: #fff; background: #a33a36; }
.danger-action:hover { background: #89302d; }
.knowledge-viewer button:focus-visible, .knowledge-viewer textarea:focus-visible { outline: 2px solid #8099b2; outline-offset: 2px; }
.message-row.assistant .message-bubble { padding-top: 2px; }
.message-bubble.markdown-content { min-width: 0; white-space: normal; }
.markdown-content > :first-child { margin-top: 0; }
.markdown-content > :last-child { margin-bottom: 0; }
.markdown-content p { margin: .55em 0; }
.markdown-content h1,
.markdown-content h2,
.markdown-content h3,
.markdown-content h4,
.markdown-content h5,
.markdown-content h6 { margin: 1.15em 0 .45em; font-family: var(--display); line-height: 1.35; letter-spacing: -.018em; }
.markdown-content h1 { font-size: 1.42em; }
.markdown-content h2 { font-size: 1.27em; }
.markdown-content h3 { font-size: 1.14em; }
.markdown-content h4,
.markdown-content h5,
.markdown-content h6 { font-size: 1em; }
.markdown-content ul,
.markdown-content ol { margin: .55em 0; padding-left: 1.45em; }
.markdown-content ul ul,
.markdown-content ul ol,
.markdown-content ol ul,
.markdown-content ol ol { margin: .24em 0; }
.markdown-content li { margin: .24em 0; padding-left: .12em; }
.markdown-content li > p { margin: .18em 0; }
.markdown-content li::marker { color: #777772; }
.markdown-content .task-list { padding-left: .35em; list-style: none; }
.markdown-content .task-list-item { padding-left: 0; }
.markdown-content .task-list-item input { width: 14px; height: 14px; margin: 0 .48em 0 0; accent-color: var(--dawn); vertical-align: -.12em; }
.markdown-content blockquote { margin: .7em 0; padding: .55em .8em; border-left: 3px solid var(--dawn); border-radius: 0 7px 7px 0; background: var(--dawn-soft); color: #55514f; }
.markdown-content blockquote > :first-child { margin-top: 0; }
.markdown-content blockquote > :last-child { margin-bottom: 0; }
.markdown-content code { padding: .12em .34em; border-radius: 4px; background: #efefed; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .88em; }
.markdown-content pre { max-width: 100%; margin: .7em 0; overflow-x: auto; padding: 13px 14px; border: 1px solid #dededb; border-radius: 9px; background: #f4f4f2; line-height: 1.55; white-space: pre; }
.markdown-content pre code { padding: 0; border-radius: 0; background: transparent; font-size: 12px; }
.markdown-content img { display: block; max-width: min(100%, 680px); height: auto; margin: .8em 0; border: 1px solid var(--line); border-radius: 10px; }
.markdown-content a { color: #3154c9; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.markdown-content a:hover { color: #1f3da5; }
.markdown-content hr { margin: 1em 0; border: 0; border-top: 1px solid var(--line); }
.markdown-content eq { display: inline; }
.markdown-content eq .katex { font-size: 1.04em; }
.markdown-content section { max-width: 100%; margin: .85em 0; overflow-x: auto; overflow-y: hidden; padding: .15em 0 .35em; overscroll-behavior-inline: contain; -webkit-overflow-scrolling: touch; }
.markdown-content eqn { display: block; width: max-content; min-width: 100%; text-align: center; }
.markdown-content .katex-display { margin: 0; }
.markdown-content .katex-display > .katex { text-align: center; }
.markdown-content .katex-error { color: #9d3d32; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .9em; }
.markdown-table { max-width: 100%; margin: .75em 0; overflow-x: auto; }
.markdown-table table { width: 100%; border-collapse: collapse; font-size: .92em; }
.markdown-table th,
.markdown-table td { padding: 7px 9px; border: 1px solid #dfdfdc; text-align: left; vertical-align: top; }
.markdown-table th { background: #f3f3f1; font-weight: 700; }
.thinking-row { margin-bottom: 24px; }
.thinking-row .message-avatar { animation: thinking-avatar 1.8s ease-in-out infinite; }
.thinking-bubble { min-height: 30px; padding: 4px 10px 4px 0 !important; display: inline-flex; align-items: center; gap: 9px; color: var(--muted); font-size: 13px; white-space: nowrap; }
.thinking-dots { display: inline-flex; align-items: center; gap: 4px; }
.thinking-dots i { width: 4px; height: 4px; border-radius: 50%; background: var(--dawn); animation: thinking-dot 1.15s ease-in-out infinite; }
.thinking-dots i:nth-child(2) { animation-delay: .14s; }
.thinking-dots i:nth-child(3) { animation-delay: .28s; }
.message-meta { min-height: 14px; display: flex; align-items: center; gap: 5px; color: #747474; font-size: 10px; line-height: 1.3; letter-spacing: .025em; font-variant-numeric: tabular-nums; }
.known-concepts {
  margin-top: 9px;
  padding: 9px 10px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px;
  border: 1px solid #e4ebf2;
  border-radius: 11px;
  background: #f8fafc;
}
.known-concepts-label { margin-right: 2px; color: #718399; font-size: 10px; font-weight: 650; }
.known-concept-chip {
  min-height: 26px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 5px 3px 9px;
  border-radius: 999px;
  color: #35516f;
  background: #e9f0f7;
  font-size: 11px;
  line-height: 1.4;
}
.known-concept-chip button {
  width: 20px;
  height: 20px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  color: #71869b;
  background: transparent;
  font-size: 15px;
  line-height: 1;
}
.known-concept-chip button:hover { color: #9d4339; background: #dde7f0; }
.known-concept-chip button:disabled { opacity: .45; }
.known-concept-chip.is-deleted { color: #7d878f; background: #eef1f3; text-decoration: line-through; }
.known-concept-chip.is-deleted button:disabled { color: #4f8a67; opacity: 1; text-decoration: none; }
.known-concept-chip[aria-disabled="true"] { cursor: not-allowed; }
.message-row.user .message-meta { justify-content: flex-end; padding-right: 4px; }
.message-meta time { cursor: help; }
.time-mark { width: 5px; height: 5px; flex: 0 0 5px; border-radius: 50%; background: var(--dawn); box-shadow: 0 0 0 2px var(--dawn-soft); }
.message-status::before { content: "·"; margin-right: 5px; color: #b8b8b8; }
.message-row.is-pending .message-bubble { opacity: .78; }
.message-row.is-pending .message-images { opacity: .78; }
.message-row.is-pending .time-mark { animation: dawn-pulse 1.3s ease-in-out infinite; }
.message-row.is-failed .message-bubble { box-shadow: inset 0 0 0 1px #edc9c0; }
.message-row.is-failed .message-status { color: #a34c3d; }
.message-row.is-new { animation: message-arrive .22s ease-out both; }

@keyframes message-arrive {
  from { opacity: 0; transform: translateY(5px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes knowledge-shimmer {
  from { background-position: 100% 0; }
  to { background-position: -100% 0; }
}
@keyframes dawn-pulse {
  0%, 100% { opacity: .45; transform: scale(.8); }
  50% { opacity: 1; transform: scale(1); }
}
@keyframes thinking-dot {
  0%, 65%, 100% { opacity: .3; transform: translateY(0); }
  32% { opacity: 1; transform: translateY(-3px); }
}
@keyframes thinking-avatar {
  0%, 100% { box-shadow: 0 0 0 0 var(--dawn-soft); }
  50% { box-shadow: 0 0 0 4px var(--dawn-soft); }
}
.composer-area { padding: 10px max(24px, calc((100% - 800px) / 2)) 13px; background: var(--paper); }
.composer {
  min-height: 112px;
  padding: 14px;
  display: flex;
  flex-direction: column;
  border: 1px solid transparent;
  border-radius: 22px;
  background: #f3f3f2;
}
.composer:focus-within { border-color: #d0d0cd; }
.composer textarea { width: 100%; min-height: 46px; max-height: 180px; flex: 1; resize: none; border: 0; outline: 0; padding: 1px 3px 10px; background: transparent; line-height: 1.55; }
.composer textarea::placeholder { color: #8b8b8b; }
.composer-image-preview {
  min-width: 0;
  margin: 0 0 12px;
  padding: 8px 9px;
  display: grid;
  grid-template-columns: minmax(48px, auto) minmax(0, 1fr) 28px;
  align-items: center;
  gap: 10px;
  border: 1px solid #dededb;
  border-radius: 14px;
  background: rgb(255 255 255 / 72%);
}
.image-preview-list { width: min(248px, 34vw); min-width: 48px; display: flex; gap: 7px; overflow-x: auto; padding: 2px; scrollbar-width: thin; }
.image-preview-thumb {
  flex: 0 0 48px;
  position: relative;
  width: 48px;
  height: 42px;
  overflow: hidden;
  padding: 0;
  border: 3px solid #fff;
  border-radius: 8px;
  background: #e7e7e5;
  box-shadow: 0 2px 7px rgb(0 0 0 / 10%);
  cursor: pointer;
}
.image-preview-thumb:nth-child(odd) { transform: rotate(-1.5deg); }
.image-preview-thumb:nth-child(even) { transform: rotate(1.5deg); }
.image-preview-thumb::after {
  content: "×";
  position: absolute;
  top: 2px;
  right: 2px;
  width: 17px;
  height: 17px;
  border-radius: 50%;
  background: rgb(20 20 20 / 68%);
  color: #fff;
  font-size: 14px;
  line-height: 16px;
  text-align: center;
}
.image-preview-thumb img { width: 100%; height: 100%; display: block; object-fit: cover; }
.image-preview-thumb:disabled { cursor: default; opacity: .55; }
.image-preview-copy { min-width: 0; display: grid; gap: 3px; }
.image-preview-copy b, .image-preview-copy small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.image-preview-copy b { font-size: 12px; font-weight: 680; }
.image-preview-copy small { color: var(--quiet); font-size: 10px; }
.image-remove-button { width: 28px; height: 28px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: #777; font-size: 20px; line-height: 1; cursor: pointer; }
.image-remove-button:hover { background: #ececea; color: var(--ink); }
.composer-actions { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
/* 工具条不换行: 放不下就横向滚动, 桌面与移动端统一(换行会把输入区顶高) */
.composer-tools-viewport { min-width: 0; flex: 1; overflow-x: auto; overscroll-behavior-x: contain; }
.composer-tools { min-width: 0; width: max-content; display: flex; flex-wrap: nowrap; align-items: center; gap: 7px; }
.composer-tools > button { flex: 0 0 auto; white-space: nowrap; }
.retrieve-toggle, .image-attach-button { height: 34px; padding: 0 11px; display: inline-flex; align-items: center; gap: 7px; border: 1px solid transparent; border-radius: 18px; background: #e7e7e5; color: #62625f; font-size: 12px; font-weight: 600; cursor: pointer; }
.retrieve-toggle:hover, .image-attach-button:hover { background: #dededb; color: #333; }
.retrieve-toggle svg, .image-attach-button svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.retrieve-toggle[aria-pressed="true"] { border-color: #bdc9ff; background: #e9edff; color: var(--search); }
.retrieve-toggle[aria-pressed="true"]:hover { background: #dfe5ff; }
.image-attach-button.has-image { border-color: #f3cfc6; background: var(--dawn-soft); color: #9f4c39; }
.image-attach-button:disabled, .image-remove-button:disabled { cursor: default; opacity: .48; }
.send-button {
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid var(--ink);
  border-radius: 9px;
  background: var(--ink);
  color: #fff;
  box-shadow: 0 1px 2px rgb(0 0 0 / 12%);
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.send-button .send-icon { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; transform: translate(1px, -1px); }
.send-button:hover:not(:disabled) { border-color: #292929; background: #292929; box-shadow: 0 3px 8px rgb(0 0 0 / 15%); transform: translateY(-1px); }
.send-button:active:not(:disabled) { box-shadow: 0 1px 2px rgb(0 0 0 / 12%); transform: translateY(0) scale(.96); }
.send-button:focus-visible { outline: 2px solid #555; outline-offset: 3px; }
.send-button:disabled { border-color: #dededb; background: #e7e7e5; color: #9b9b97; box-shadow: none; opacity: 1; }
.send-progress { display: none; width: 11px; height: 11px; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: send-progress-spin .75s linear infinite; }
.send-button.is-busy { border-color: #d6d6d3; background: #f1f1ef; color: #555; }
.send-button.is-busy .send-icon { display: none; }
.send-button.is-busy .send-progress { display: block; }
@keyframes send-progress-spin { to { transform: rotate(360deg); } }
.dialog-close { position: absolute; top: 14px; right: 15px; width: 32px; height: 32px; border: 0; border-radius: 50%; background: none; color: var(--muted); font-size: 24px; cursor: pointer; }
.dialog-close:hover { background: var(--canvas); }

/* Account and knowledge library */
.user-layer { position: fixed; z-index: 25; inset: 0; display: grid; place-items: center; padding: 20px; background: rgb(0 0 0 / 36%); backdrop-filter: blur(3px); }
.user-dialog {
  position: relative;
  width: min(680px, 100%);
  max-height: min(760px, calc(100vh - 40px));
  overflow: auto;
  padding: 30px;
  border-radius: 20px;
  background: var(--paper);
  box-shadow: 0 22px 70px rgb(0 0 0 / 18%);
}
.user-dialog-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.user-dialog-header p { margin: 0 0 5px; color: var(--quiet); font-size: 10px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.user-dialog-header h2 { margin: 0; font-size: 25px; letter-spacing: -.035em; }
.user-dialog-header .dialog-close { position: static; margin: -6px -7px 0 0; flex: 0 0 auto; }
.user-identity { margin-top: 24px; display: flex; align-items: center; gap: 11px; }
.user-avatar { width: 42px; height: 42px; flex: 0 0 42px; background: var(--ink); color: #fff; font-family: var(--display); font-size: 15px; }
.user-identity > span:last-child { min-width: 0; display: grid; gap: 3px; }
.user-identity b { overflow: hidden; font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
.user-dialog-footer { margin-top: 20px; padding-top: 16px; display: flex; justify-content: flex-end; border-top: 1px solid var(--line); }
.logout-button { padding: 8px 10px; border: 0; border-radius: 8px; background: transparent; color: #8a4c44; font-size: 11px; cursor: pointer; }
.logout-button:hover { background: #f2eae8; }

.interrupt-card { max-width: 700px; margin: 10px auto 28px; padding: 20px; border: 1px solid var(--line); border-radius: 14px; background: var(--canvas); }
.interrupt-card h3 { margin: 0 0 9px; font-size: 16px; }
.interrupt-card > p { color: var(--muted); font-size: 13px; line-height: 1.7; white-space: pre-wrap; }
.knowledge-option { margin: 8px 0; padding: 11px; display: flex; gap: 10px; border: 1px solid var(--line); border-radius: 9px; background: #fff; cursor: pointer; }
.knowledge-option span { display: grid; gap: 3px; }
.knowledge-option b { font-size: 13px; }
.knowledge-option small { color: var(--muted); font-size: 11px; }
.primary-button.compact { min-height: 40px; margin-top: 10px; padding: 9px 15px; font-size: 12px; }
.toast { position: fixed; z-index: 30; left: 50%; bottom: 94px; padding: 11px 16px; border-radius: 9px; background: #202020; color: white; font-size: 12px; opacity: 0; pointer-events: none; transform: translate(-50%, 12px); transition: .2s; }
.toast.show { opacity: 1; transform: translate(-50%, 0); }

.deletion-progress {
  position: fixed;
  z-index: 70;
  inset: 0;
  display: grid;
  place-content: center;
  justify-items: center;
  gap: 12px;
  background: rgb(243 247 251 / 78%);
  color: #40536a;
  font-size: 14px;
  font-weight: 650;
  backdrop-filter: blur(3px);
}
.deletion-progress i {
  width: 24px;
  height: 24px;
  border: 2px solid #b8c7d6;
  border-top-color: #35516f;
  border-radius: 50%;
  animation: send-progress-spin .75s linear infinite;
}

button:focus { outline: 0; }

button:focus-visible { outline: 2px solid #777; outline-offset: 2px; }
input:focus-visible, textarea:focus-visible { outline: 0; }

@media (max-width: 760px) {
  .xiaoxi-mascot { top: 8px; right: 9px; width: 62px; }
  .login-brand { padding: 20px; }
  .login-main { padding: 35px 22px 75px; }
  .auth-heading h1 { font-size: 28px; }
  .auth-card { padding: 28px 22px; border-radius: 20px; }
  .chat-layout { display: block; }
  body.sidebar-visible { overflow: hidden; }
  .sidebar { position: fixed; z-index: 16; inset: 0 auto 0 0; width: 270px; box-shadow: 10px 0 35px rgb(0 0 0 / 14%); transform: translateX(-102%); transition: transform .2s ease; }
  .sidebar.open { transform: none; }
  .sidebar.no-transition { transition: none; }
  .conversation-more { width: 44px; height: 44px; right: 2px; font-size: 11px; letter-spacing: -1px; touch-action: manipulation; }
  .conversation-chip { min-height: 44px; padding-right: 50px; }
  .conversation-menu { min-width: 168px; }
  .conversation-menu button { min-height: 44px; padding: 10px 12px; font-size: 14px; touch-action: manipulation; }
  .sidebar-scrim { position: fixed; z-index: 15; inset: 0; display: block; width: 100%; height: 100%; padding: 0; border: 0; background: rgb(20 20 20 / 32%); opacity: 1; cursor: default; transition: opacity .2s ease; -webkit-tap-highlight-color: transparent; }
  .chat-main { height: 100vh; }
  .menu-button { display: block; cursor: pointer; }
  .chat-header { padding: 0 13px; }
  .messages { padding: 25px 15px; }
  .welcome { margin-top: 18vh; }
  .message-row.user .message-stack { max-width: 88%; }
  .markdown-content section { margin-right: -8px; padding-right: 8px; }
  .knowledge-viewer { width: calc(100vw - 16px); max-height: calc(100dvh - 16px); border-radius: 16px; }
  .knowledge-viewer-header { padding: 15px 17px 12px; }
  .knowledge-viewer-header h2 { font-size: 20px; }
  .knowledge-viewer-meta { padding-inline: 17px; }
  .knowledge-viewer-body { padding: 22px 18px 34px; }
  .knowledge-viewer-footer { align-items: stretch; flex-direction: column; gap: 9px; padding: 11px 17px; }
  .knowledge-edit-button,
  .knowledge-challenge-button { width: 100%; }
  .knowledge-challenge-panel { padding: 14px 17px 16px; }
  .composer-area { padding: 9px 12px 10px; }
  .user-layer { padding: 10px; }
  .user-dialog { max-height: calc(100vh - 20px); padding: 24px 18px 18px; border-radius: 17px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

/* Review workspace: quiet notebook covers and question sheets. */
.review-nav svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.55; stroke-linecap: round; stroke-linejoin: round; }
.review-nav[aria-pressed="true"] { background: var(--hover); font-weight: 600; }
.chat-main.review-active { grid-template-rows: 58px minmax(0, 1fr) auto; }
.review-page { --review-accent: #333333; --review-tint: #f0f0f0; --review-line: #e5e5e5; overflow-y: auto; padding: 28px max(32px, calc((100% - 920px) / 2)) 80px; }
.review-page[data-screen="detail"], .review-page[data-screen="editor"] { padding-inline: max(32px, calc((100% - 780px) / 2)); }
.review-heading { display: flex; justify-content: space-between; align-items: center; gap: 24px; margin-bottom: 40px; }
.review-heading > div:first-child { min-width: 0; }
.review-heading h1 { margin: 0 0 12px; font: 650 28px/1.4 var(--body); letter-spacing: -.6px; overflow-wrap: anywhere; }
.review-heading > div:first-child > h1:last-child { margin-bottom: 0; }
.review-heading p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.7; }
.review-button { border: 1px solid var(--review-line); background: var(--paper); border-radius: 10px; padding: 10px 16px; cursor: pointer; font-size: 13px; line-height: 1.5; transition: background .15s, border-color .15s; }
.review-button:hover { background: var(--review-tint); border-color: #d4d4d4; }
.review-button.primary { background: #262626; color: var(--paper); border-color: #262626; white-space: nowrap; }
.review-button.primary:hover { background: #444444; }
.review-button:disabled { opacity: .4; cursor: default; }
.review-button:focus-visible, .review-page summary:focus-visible { outline: 2px solid var(--review-accent); outline-offset: 4px; }
.review-actions { display: flex; gap: 10px; flex-wrap: wrap; flex-shrink: 0; }
.review-count { color: var(--muted); font-size: 12px; margin: 0 0 16px; }
.review-empty { padding: 68px 24px; text-align: center; background: var(--paper); border: 1px solid var(--review-line); border-radius: 20px; }
.review-page svg { fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.review-empty h2 { font-size: 20px; font-weight: 600; margin: 0 0 12px; }
.review-empty p { color: var(--muted); font-size: 14px; line-height: 1.9; max-width: 320px; margin: 0 auto 26px; }
.review-open h2 { font-size: 15px; font-weight: 600; line-height: 1.6; margin: 0 0 6px; overflow-wrap: anywhere; }
.review-open > span:last-child { color: var(--muted); font-size: 12px; }
.review-item-footer { display: flex; justify-content: space-between; align-items: center; min-height: 40px; margin: 0 12px 0 16px; padding: 4px 0; border-top: 1px solid #edf0f2; }
.review-library-card:not(.is-draft) .review-item-footer { justify-content: flex-end; }
.review-library-card.is-draft .review-item-footer { justify-content: flex-end; }
.review-item-footer .review-button { border: 0; background: transparent; padding: 6px 10px; color: var(--muted); border-radius: 7px; transition: background .12s, color .12s; }
.review-item-footer .review-button:hover { background: #eeeeee; color: var(--ink); }
.review-item-footer .review-button:active { background: #dddddd; color: var(--ink); }
.review-item-footer .review-start { color: var(--ink); font-weight: 600; }
.review-card { background: var(--paper); border: 1px solid var(--review-line); border-radius: 12px; padding: 16px 18px; margin: 0 0 14px; min-width: 0; }
.review-card > .review-count { display: inline-block; color: var(--review-accent); background: var(--review-tint); padding: 3px 8px; border-radius: 5px; margin-bottom: 0; }
.review-card h2 { font-size: 15px; font-weight: 550; line-height: 1.7; white-space: pre-wrap; overflow-wrap: anywhere; margin: 10px 0 12px; }
.review-card details { border-top: 1px solid var(--review-line); padding-top: 10px; }
.review-card summary { cursor: pointer; color: var(--review-accent); font-size: 13px; padding: 4px 0; }
.review-editor > fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.review-editor label { display: block; font-size: 12px; font-weight: 550; color: var(--muted); margin-bottom: 12px; }
.review-editor input, .review-editor textarea { display: block; width: 100%; border: 1px solid var(--review-line); border-radius: 7px; padding: 8px 10px; margin-top: 6px; background: #fafafa; line-height: 1.6; font-size: 14px; font-weight: 400; color: var(--ink); }
.review-editor textarea { resize: vertical; min-height: 40px; }
.review-editor .review-card { padding: 12px 14px; margin-bottom: 14px; }
.review-editor input::placeholder, .review-editor textarea::placeholder { color: #999999; }
.review-editor input:focus, .review-editor textarea:focus { outline: 0; border-color: var(--review-line); box-shadow: none; }
.review-editor .review-title-field { margin-bottom: 20px; }
.review-title-field input { background: var(--paper); font-size: 16px; padding: 10px 12px; }
.review-knowledge-option { display: flex !important; align-items: center; gap: 10px; margin: 4px 0 22px !important; padding: 12px 14px; border: 1px solid #dce3ea; border-radius: 10px; background: #f7f9fb; color: #3b4b5b !important; cursor: default; }
.review-editor .review-knowledge-option input { width: 17px; height: 17px; margin: 0; flex: 0 0 auto; accent-color: #35516f; cursor: pointer; }
.review-knowledge-option span { display: grid; gap: 3px; }
.review-knowledge-option b { font-size: 13px; font-weight: 650; }
.review-pdf-import { display: flex; align-items: center; gap: 10px; margin: 0 0 18px; }
.review-pdf-button { padding: 7px 11px; border: 1px solid #d8dfe6; border-radius: 8px; background: #fff; color: #3f5368; font-size: 12px; cursor: pointer; }
.review-pdf-button:hover { background: #f3f6f9; }
.review-pdf-button:disabled { opacity: .5; cursor: wait; }
.review-pdf-status { color: var(--muted); font-size: 11px; }
.review-pdf-mode-dialog { width: min(460px, calc(100vw - 32px)); }
.review-pdf-mode-choices { display: grid; gap: 10px; margin: 18px 0; }
.review-pdf-mode-choice { display: grid; gap: 5px; width: 100%; padding: 14px 15px; text-align: left; border-color: #dde3e9; background: #fbfcfd; }
.review-pdf-mode-choice:hover { border-color: #aebdcc; background: #f3f7fa; }
.review-pdf-mode-choice b { font-size: 14px; font-weight: 650; color: #2d3c4b; }
.review-pdf-mode-choice span { color: var(--muted); font-size: 12px; line-height: 1.6; }
.review-editor legend { color: var(--review-accent); padding: 0 10px; font-size: 12px; font-weight: 600; }
.review-save { margin-top: 28px; align-items: center; justify-content: space-between; }
.review-save-main { margin-left: auto; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.review-draft-status { min-width: 150px; color: var(--muted); font-size: 11px; line-height: 1.5; }
.review-draft-status.is-saved { color: #587264; }
.review-draft-status.is-error { color: #ab3434; }
.review-library-card.is-draft .review-open { min-height: 0; }
.review-library-card.is-draft .review-open h2 { margin-top: 0; }
.review-error { color: #ab3434; font-size: 14px; padding: 14px; background: #fff0ef; border-radius: 10px; }
.review-button.danger { color: #ab3434; border-color: transparent; background: transparent; }
@media (max-width: 640px) {
  .review-page, .review-page[data-screen="detail"], .review-page[data-screen="editor"] { padding: 20px 18px 48px; }
  .review-heading { align-items: flex-start; flex-direction: column; gap: 18px; margin-bottom: 28px; }
  .review-heading h1 { font-size: 25px; }
  .review-empty { padding: 44px 20px; }
  .review-feedback .review-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.review-filters { display: flex; gap: 8px; margin-bottom: 20px; }
.review-filters .review-button { background: transparent; border: 0; color: var(--muted); }
.review-filters .review-button[aria-pressed="true"] { background: #eaeaea; color: var(--ink); }
.review-search { display: flex; align-items: center; gap: 8px; margin: -12px 0 16px; }
.review-editor .review-search input, .review-search input { box-sizing: border-box; width: 100%; margin: 0; padding: 10px 13px; border: 1px solid var(--review-line); border-radius: 10px; background: var(--paper); color: var(--ink); font: inherit; font-size: 13px; }
.review-search input:focus { outline: 0; border-color: var(--review-line); box-shadow: none; }
.review-search-clear { flex: 0 0 auto; border: 0; padding: 8px 9px; background: transparent; color: var(--muted); }
.review-search-clear:hover { background: #efefef; }
.review-feedback { padding: 8px 0 16px; }
.review-feedback p { color: var(--muted); font-size: 14px; }
.review-feedback .review-actions { display: grid; grid-template-columns: repeat(4, minmax(110px, 1fr)); }
.review-feedback .review-button { min-height: 58px; display: grid; place-content: center; gap: 5px; }
.review-feedback .review-button b { font-size: 13px; }
.review-feedback .review-button small { color: var(--muted); font-size: 10px; font-weight: 400; }
.review-feedback .review-button:hover { background: #eee; }
.review-feedback .review-button:active { background: #ddd; }
.review-session-summary { display: grid; grid-template-columns: auto 1fr auto 1fr; align-items: baseline; gap: 8px 12px; max-width: 520px; margin: 20px auto 28px; padding: 24px; border: 1px solid var(--review-line); border-radius: 16px; background: var(--paper); }
.review-session-summary strong { font-size: 30px; line-height: 1; color: #283442; }
.review-session-summary span { color: var(--muted); font-size: 13px; }
.review-card-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 12px; }
.review-library-card { position: relative; min-width: 0; overflow: hidden; background: linear-gradient(180deg, #fff 0%, #fdfefe 100%); border: 1px solid #e3e9ef; border-radius: 14px; box-shadow: 0 1px 0 rgb(33 48 71 / 3%); transition: border-color .15s, box-shadow .15s, transform .15s; }
.review-library-card:hover { border-color: #e3e9ef; box-shadow: 0 1px 0 rgb(33 48 71 / 3%); }
.library-card-meta { min-height: 18px; display: flex; align-items: center; flex-wrap: wrap; gap: 7px; color: #9399a2; font-size: 10px; }
.library-card-meta time { font-variant-numeric: tabular-nums; }
.library-card-kind { color: #5e6f82; font-size: 10px; font-weight: 650; }
.library-card-kind::before { content: ""; width: 5px; height: 5px; margin-right: 6px; display: inline-block; border-radius: 50%; background: #8da5bd; vertical-align: 1px; }
.library-card-kind.is-knowledge { color: #53705f; }
.library-card-kind.is-knowledge::before { background: #75a083; }
.library-card-kind.is-draft { color: #846f48; }
.library-card-kind.is-draft::before { background: #c2a568; }
.review-card-schedule { margin: 8px 0 0; color: var(--muted); font-size: 11px; font-variant-numeric: tabular-nums; }
.knowledge-page { padding-inline: max(32px, calc((100% - 920px) / 2)); }
.knowledge-library-card .review-open { min-height: 0; padding: 17px 17px 12px; }
.knowledge-library-card .review-open h2 { margin: 0 0 10px; }
.knowledge-library-card .review-item-footer { justify-content: flex-end; }
.knowledge-library-card.is-draft .review-item-footer { justify-content: flex-end; }
.knowledge-card-badges { min-height: 24px; display: flex; align-items: center; flex-wrap: wrap; gap: 7px; }
.knowledge-state { display: inline-block; width: fit-content; padding: 4px 8px; border-radius: 999px; color: #6f8093; background: #f0f3f6; font-size: 10px; font-weight: 650; }
.knowledge-state[data-state="ready"] { color: #4f6b58; background: #edf4ee; }
.knowledge-state[data-state="processing"] { color: #7a643b; background: #fbf3df; }
.knowledge-state[data-state="failed"] { color: #93483f; background: #fff0ed; }
.knowledge-state[data-state="draft"] { color: #6f8093; background: #f0f3f6; }
.review-page > .knowledge-state { margin: -16px 0 18px; }
.knowledge-editor-note { margin: 14px 0 0; padding: 10px 12px; border-radius: 9px; color: #65788e; background: #f4f7fa; font-size: 11px; line-height: 1.6; }
.review-library-card .review-open { min-height: 0; box-sizing: border-box; padding: 14px 14px 10px 17px; cursor: default; }
.review-library-card .review-open h2 { margin: 0; font-size: 15px; line-height: 1.45; }
.review-public-option { border-color: #e7ddc9 !important; background: #fcfaf5 !important; }
.review-load-more { display: block; margin: 22px auto 0; }
.review-source-card { overflow: hidden; padding: 22px; border: 1px solid var(--review-line); border-radius: 18px; background: var(--paper); }
.review-detail-title, .knowledge-detail-title { margin: 0 0 20px; padding-bottom: 17px; border-bottom: 1px solid #e5e9ed; color: #213047; font: 600 26px/1.4 var(--display); letter-spacing: -.025em; overflow-wrap: anywhere; }
.review-article { color: #262626; font-size: 16px; line-height: 1.9; }
.document-formula { display: inline-block; max-width: 100%; padding: 1px 3px; border-radius: 4px; vertical-align: middle; }
.document-formula.is-display { display: block; margin: 10px 0; overflow-x: auto; text-align: center; }
.document-formula.is-error { color: #9d3d32; }
.document-formula-button { width: 32px; height: 32px; border: 0; background: transparent; color: #333; font-family: Georgia, serif; font-size: 21px; cursor: pointer; }
.document-formula-button:hover { background: #f0f0f0; }
.document-formula-dialog { width: min(560px, calc(100vw - 32px)); }
.document-formula-dialog label { display: block; color: #333; font-size: 13px; }
.document-formula-dialog textarea { box-sizing: border-box; width: 100%; margin-top: 8px; padding: 10px 12px; border: 1px solid #d9dde1; border-radius: 8px; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 13px; line-height: 1.6; resize: vertical; }
.document-formula-dialog textarea:focus { border-color: #8d98a3; outline: 2px solid rgb(75 91 107 / 12%); }
.document-formula-templates { display: flex; flex-wrap: wrap; gap: 7px; margin: 0 0 16px; }
.document-formula-template { padding: 5px 10px; border: 1px solid #dfe3e7; border-radius: 999px; background: #f7f8f9; color: #45515d; font: inherit; font-size: 12px; cursor: pointer; }
.document-formula-template:hover { border-color: #bfc7cf; background: #eef1f3; }
.document-formula-template:focus-visible { outline: 2px solid #555; outline-offset: 2px; }
.document-formula-hint { margin: 7px 0 0 !important; color: #858c94 !important; font-size: 11px !important; line-height: 1.55 !important; }
.document-formula-preview { min-height: 54px; margin-top: 12px; padding: 13px 14px; display: grid; place-items: center; overflow-x: auto; border: 1px dashed #d9dee3; border-radius: 8px; color: #717b85; font-size: 12px; }
.document-formula-preview.is-empty { color: #9aa1a8; }
.document-formula-preview.has-error { color: #ab3434; }
.document-formula-display { display: flex; align-items: center; gap: 6px; margin-top: 12px; }
.document-formula-display input { width: auto; }
.review-article h1 { font-size: 30px; line-height: 1.4; }
.review-article h2 { margin-top: 1.7em; font-size: 22px; line-height: 1.45; }
.review-article h3 { margin-top: 1.5em; font-size: 18px; }
.review-article p { margin: 1em 0; }
.review-article img, .review-zoom-image { cursor: zoom-in; }
.review-article img:focus-visible, .review-zoom-image:focus-visible { outline: 3px solid #8ca6c2; outline-offset: 3px; }
.review-article blockquote { margin: 1.3em 0; padding: 12px 18px; border-left: 3px solid #8d8d8d; background: #f4f4f4; color: #555; }
.review-feedback h2 { font-size: 18px; margin: 0 0 8px; }
.review-card-editor { padding-bottom: 12px; }
.review-article-editor { margin-top: 22px; }
.review-toastui-host { overflow: hidden; border: 1px solid var(--review-line); border-radius: 12px; background: var(--paper); }
.review-toastui-host .toastui-editor-defaultUI { border: 0; border-radius: 12px; }
.review-toastui-host .toastui-editor-toolbar { border-bottom-color: var(--review-line); background: #f7f7f7; }
.review-toastui-host .toastui-editor-main { background: #fbfbfb; }
.review-toastui-host .toastui-editor-contents { box-sizing: border-box; max-width: 760px; margin: 0 auto; padding: 38px 42px 90px; background: var(--paper); font-family: var(--body); font-size: 16px; line-height: 1.85; }
.review-toastui-host .toastui-editor-contents:focus { outline: 0; }
.review-toastui-host .toastui-editor-contents img, .review-editor-zoom-image { cursor: zoom-in; }
.review-toastui-host .toastui-editor-contents img:focus-visible, .review-editor-zoom-image:focus-visible { outline: 3px solid #8ca6c2; outline-offset: 3px; }
@media (max-width: 760px) {
  .review-card-grid { grid-template-columns: 1fr; }
  .review-save { align-items: stretch; flex-direction: column; }
  .review-save-main { width: 100%; margin-left: 0; }
  .review-save-main .review-button.primary { flex: 1; }
  .review-toastui-host .toastui-editor-contents { padding: 24px 20px 80px; font-size: 15px; }
  .review-source-card { padding: 14px; }
  .review-article { font-size: 15px; }
}

/* Practice: compact question sheet, with options as the primary interaction. */
.chat-main.practice-active { grid-template-rows: 58px minmax(0, 1fr) auto; }
#practice-from-chat { margin-left: auto; background: transparent; border: 0; padding: 6px 10px; }
#practice-from-chat:hover, #practice-from-chat:active { background: #e8e8e8; }
.practice-page { padding-inline: max(24px, calc((100% - 760px) / 2)); }
.practice-page .review-heading { margin-bottom: 24px; }
.practice-record { border-bottom: 1px solid #e5e5e5; padding: 14px 0; }
.practice-record h2 { font-size: 15px; font-weight: 600; margin: 0 0 8px; white-space: pre-wrap; overflow-wrap: anywhere; }
.practice-record .review-count { margin: 6px 0; }
.practice-record .review-button { padding: 5px 9px; border: 0; background: transparent; }
.practice-record .review-button:hover, .practice-record .review-button:active { background: #e8e8e8; }
.practice-question h2 { font-size: 18px; line-height: 1.7; font-weight: 600; margin: 0 0 20px; white-space: pre-wrap; overflow-wrap: anywhere; }
.practice-form { display: grid; gap: 16px; }
.practice-form > label { display: grid; gap: 8px; font-size: 13px; }
.practice-form textarea { width: 100%; box-sizing: border-box; padding: 10px 12px; border: 1px solid #ddd; border-radius: 8px; color: #222; background: #fff; font: inherit; line-height: 1.6; }
.practice-form textarea { resize: vertical; }
.practice-form > button { justify-self: start; }
.practice-form fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.practice-form legend { font-size: 12px; color: #777; margin-bottom: 10px; }
.practice-option { display: flex; align-items: baseline; gap: 10px; padding: 10px 12px; border: 1px solid #e5e5e5; border-radius: 8px; margin-bottom: 8px; cursor: pointer; font-size: 14px; line-height: 1.6; white-space: pre-wrap; overflow-wrap: anywhere; }
.practice-option:hover, .practice-option:has(input:checked) { background: #eee; border-color: #aaa; }
.practice-option input { accent-color: #333; }
.practice-feedback { border-top: 1px solid #ddd; margin-top: 24px; padding-top: 12px; }
.practice-feedback h3 { font-size: 14px; }
.practice-feedback p { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 14px; line-height: 1.8; }
.practice-page :is(input, textarea, select):focus-visible { outline: 2px solid #555; outline-offset: 2px; }

.practice-markdown { min-width: 0; white-space: normal; overflow-wrap: anywhere; font-size: 14px; line-height: 1.8; }
.practice-markdown p { white-space: normal; font-size: inherit; }
.practice-markdown.practice-title { font-size: 28px; font-weight: 650; line-height: 1.4; margin-bottom: 12px; }
.practice-markdown.practice-record-title, .practice-record .practice-question-title { font-size: 15px; font-weight: 600; margin-bottom: 8px; }
.practice-question > .practice-question-title { font-size: 18px; font-weight: 600; margin-bottom: 20px; }
.practice-option > .practice-markdown { flex: 1; }
.practice-option > input, .practice-option > span { flex-shrink: 0; }
.practice-markdown blockquote { border-color: #aaa; background: #f0f0f0; color: #555; }
.practice-markdown a { color: #333; }


.review-delete-dialog { position: fixed; inset: 0; margin: auto; box-sizing: border-box; width: min(380px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); overflow-y: auto; padding: 24px; border: 1px solid #e5e5e5; border-radius: 14px; background: #fff; color: #222; box-shadow: 0 18px 60px rgb(0 0 0 / 16%); }
.review-delete-dialog::backdrop { background: rgb(0 0 0 / 32%); }
.review-delete-dialog h2 { margin: 0 0 12px; font-size: 18px; font-weight: 600; }
.review-delete-dialog p { margin: 0 0 24px; color: #666; font-size: 14px; line-height: 1.7; overflow-wrap: anywhere; }
.review-delete-dialog .review-actions { justify-content: flex-end; }
.review-delete-dialog .review-button { border-color: #ddd; background: #fff; border-radius: 8px; padding: 7px 14px; }
.review-delete-dialog .review-button:hover { background: #eee; }
.review-delete-dialog .review-button.primary { background: #262626; border-color: #262626; color: #fff; }
.review-delete-dialog .review-button.primary:hover { background: #444; }
.review-delete-dialog .review-button:focus-visible { outline: 2px solid #555; outline-offset: 3px; }

.conversation-name-input { box-sizing: border-box; width: 100%; border: 1px solid #ddd; border-radius: 8px; padding: 9px 12px; font: inherit; background: #fff; color: #222; }
.conversation-name-input:focus-visible { outline: 2px solid #555; outline-offset: 2px; }

.practice-quantities { display: flex; flex-wrap: wrap; gap: 16px; }
.practice-quantities label { display: grid; gap: 8px; font-size: 13px; }
.practice-quantities input { width: 100px; padding: 8px 10px; border: 1px solid #ddd; border-radius: 8px; background: #fff; color: #222; font: inherit; }
.practice-navigation { margin-top: 24px; }

.practice-add-review-dialog { width: min(420px, calc(100vw - 32px)); }
.practice-add-review-dialog fieldset { display: grid; gap: 16px; }
.practice-add-review-dialog label { display: grid; gap: 8px; font-size: 13px; }
.practice-add-review-dialog :is(input, select) { box-sizing: border-box; width: 100%; padding: 9px 12px; border: 1px solid #ddd; border-radius: 8px; background: #fff; color: #222; font: inherit; }
.practice-add-review-dialog :is(input, select):focus-visible { outline: 2px solid #555; outline-offset: 2px; }
.practice-add-review-dialog .review-error { margin: 0; }
.practice-add-review-dialog .review-error:empty { display: none; }

#practice-from-chat { margin-left: 0; white-space: nowrap; }
/* Older messages load on demand while the composer stays in place. */
.history-more { display: block; margin: 0 auto 20px; padding: 8px 14px; border: 0; border-radius: 16px; background: var(--paper); color: var(--quiet); font: inherit; font-size: 12px; cursor: pointer; }
.history-more:disabled { cursor: wait; opacity: .65; }
@media (max-width: 760px) {
  /* Only this bounded options viewport scrolls; neither the page nor the composer resizes. */
  .composer-actions { display: grid; grid-template-columns: minmax(0, 1fr) 32px; }
  /* 横向滚动已在基础规则里, 这里只加移动端特有的: 隐藏滚动条 + 惯性滚动 */
  .composer-tools-viewport { width: 100%; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .composer-tools-viewport::-webkit-scrollbar { display: none; }
}

.chat-retry { position: absolute; right: calc(100% + 4px); top: 50%; transform: translateY(-50%); display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; width: 24px; height: 24px; padding: 4px; border: 0; border-radius: 50%; background: transparent; color: #777; cursor: pointer; }
.chat-retry:hover { color: #333; background: #e7e7e5; }
.chat-retry:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
.chat-retry svg { display: block; flex-shrink: 0; }
.message-row.user .message-bubble, .message-row.user .message-images { position: relative; }
.message-row.user .message-stack:has(.chat-retry) { box-sizing: border-box; padding-left: 28px; }

/* Home workspace and persistent chat dock */
.chat-page { --frost: #f3f7fb; --frost-line: #dce6f0; --frost-ink: #213047; }
.chat-layout { grid-template-columns: var(--sidebar-width, 232px) 7px minmax(0, 1fr); background: var(--frost); }
.sidebar {
  grid-column: 1;
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  overflow: hidden;
}
.sidebar.is-collapsed { visibility: hidden; padding: 0; }
.sidebar-resize-handle { position: relative; grid-column: 2; width: 7px; height: 100vh; padding: 0; border: 0; background: transparent; cursor: col-resize; touch-action: none; }
.sidebar-resize-handle::after { content: ""; position: absolute; inset: 0 auto 0 3px; width: 1px; background: #e1e8ef; transition: background .12s, width .12s, left .12s; }
.sidebar-resize-handle:hover::after,
.sidebar-resize-handle:focus-visible::after,
body.sidebar-resizing .sidebar-resize-handle::after { left: 2px; width: 3px; background: #8ba6c0; }
.sidebar-resize-handle:focus-visible { outline: 0; }
.workspace-shell {
  grid-column: 3;
  min-width: 0;
  height: 100vh;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 7px var(--chat-width, 390px);
  overflow: hidden;
}
.chat-main {
  min-width: 0;
  height: 100vh;
  grid-template-rows: 58px minmax(0, 1fr) auto;
  background: var(--frost);
}
.workspace-header { border-bottom: 1px solid rgb(33 48 71 / 7%); }
.workspace-wordmark { font-size: 13px; font-weight: 650; letter-spacing: .04em; color: var(--frost-ink); }
.nav-button { min-height: 38px; }
.nav-button svg, .review-nav svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.55; stroke-linecap: round; stroke-linejoin: round; }
.nav-button[aria-pressed="true"] { background: #e9eef5; color: var(--frost-ink); font-weight: 650; }

.home-page { overflow-y: auto; padding: 42px clamp(28px, 5vw, 76px) 70px; }
.home-intro { max-width: 920px; display: flex; align-items: flex-end; justify-content: space-between; gap: 32px; margin: 0 auto 24px; }
.home-date { margin: 0 0 12px; color: #72839a; font: 600 12px/1.5 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; letter-spacing: .1em; }
.home-intro h1 { max-width: 660px; margin: 0 0 15px; color: var(--frost-ink); font: 600 clamp(31px, 4vw, 49px)/1.17 var(--display); letter-spacing: -.055em; }
.home-summary { margin: 0; color: #68788e; font-size: 14px; line-height: 1.7; }
.home-knowledge { max-width: 920px; margin: 0 auto 38px; }
.home-knowledge > header { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 12px; }
.home-knowledge h2 { margin: 0; color: var(--frost-ink); font-size: 19px; line-height: 1.35; }
.home-knowledge-card {
  min-height: 82px;
}
.home-knowledge-lines {
  display: grid;
  gap: 7px;
}
.home-knowledge-line {
  margin: 0;
  color: #75859a;
  font-size: 14px;
  line-height: 1.65;
}
.home-knowledge-line strong {
  color: var(--frost-ink);
  font: 600 17px/1 var(--display);
  font-variant-numeric: tabular-nums;
}
.home-usage {
  margin-top: 22px;
  padding-top: 18px;
  border-top: 1px solid #e2e9f0;
}
.home-usage > header {
  display: flex;
  align-items: baseline;
  justify-content: flex-start;
  gap: 4px;
}
.home-usage-title { color: #60758e; font-size: 12px; font-weight: 650; }
.home-usage-today { color: #7d8da1; font-size: 11px; font-variant-numeric: tabular-nums; }
.home-usage-scroll {
  display: flex;
  overflow-x: auto;
  padding: 16px 2px 6px;
  scrollbar-width: thin;
  scrollbar-color: #b8c8d4 transparent;
}
.home-usage-scroll::-webkit-scrollbar { height: 6px; }
.home-usage-scroll::-webkit-scrollbar-thumb { border-radius: 999px; background: #b8c8d4; }
.home-usage-scroll::-webkit-scrollbar-track { background: transparent; }
.home-usage-chart {
  width: max-content;
  display: flex;
  align-items: flex-start;
  gap: 28px;
}
.home-usage-month {
  display: grid;
  justify-items: center;
  gap: 11px;
}
.home-usage-grid {
  display: grid;
  grid-template-rows: repeat(7, 12px);
  grid-auto-flow: column;
  grid-auto-columns: 12px;
  gap: 4px;
}
.home-usage-month-label {
  color: #9aa2ad;
  font-size: 12px;
  line-height: 1;
}
.home-usage-day {
  width: 12px;
  height: 12px;
  border-radius: 3px;
  background: #f0f1f2;
}
.home-usage-day.is-outside { visibility: hidden; }
.home-usage-day[data-level="1"] { background: #b8efc5; }
.home-usage-day[data-level="2"] { background: #67d981; }
.home-usage-day[data-level="3"] { background: #20b94b; }
.home-usage-day[data-level="4"] { background: #008f2e; }
.home-usage-day.is-today { box-shadow: 0 0 0 1px #f3f7fb, 0 0 0 2px #69809a; }
.home-usage-day:focus-visible { outline: 2px solid #69809a; outline-offset: 2px; }
.home-usage-tooltip {
  position: fixed;
  z-index: 65;
  max-width: min(260px, calc(100vw - 32px));
  padding: 6px 9px;
  border-radius: 7px;
  background: #263b4b;
  color: #fff;
  font-size: 11px;
  line-height: 1.5;
  pointer-events: none;
  opacity: 0;
  transform: translate(-50%, -100%);
  box-shadow: 0 5px 16px rgb(24 39 52 / 18%);
  transition: opacity .1s ease;
}
.home-usage-tooltip.show { opacity: 1; }
.home-usage-footer {
  min-height: 22px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  color: #8493a5;
  font-size: 10px;
}
.home-usage-footer i { width: 10px; height: 10px; border-radius: 2px; background: #e7edf1; }
.home-usage-footer i[data-level="1"] { background: #cce7d3; }
.home-usage-footer i[data-level="2"] { background: #8ed2a0; }
.home-usage-footer i[data-level="3"] { background: #48ad69; }
.home-usage-footer i[data-level="4"] { background: #247b49; }
.home-knowledge-skeleton { padding: 4px 0; display: grid; gap: 12px; }
.home-knowledge-skeleton span { height: 30px; border-radius: 9px; background: linear-gradient(100deg, #f2f5f8 25%, #e8edf2 45%, #f2f5f8 65%) 0 0 / 220% 100%; animation: knowledge-shimmer 1.7s ease-in-out infinite; }
.home-knowledge-empty { margin: 0; padding: 18px 0; color: #7a8a9d; font-size: 13px; line-height: 1.7; }
.home-review { max-width: 920px; margin-inline: auto; }
.home-review > header { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 18px; }
.home-eyebrow { margin: 0 0 5px; color: #8ea1b8; font: 700 10px/1.4 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; letter-spacing: .18em; }
.home-review h2 { margin: 0; color: var(--frost-ink); font-size: 19px; line-height: 1.35; }
.text-action { padding: 7px 4px; border: 0; background: transparent; color: #5f7693; font-size: 12px; cursor: pointer; }
.text-action:hover { color: var(--frost-ink); text-decoration: underline; text-underline-offset: 3px; }
.home-review-list { display: grid; gap: 12px; }
.home-review-card {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 20px;
  padding: 19px 20px;
  border: 1px solid #e2e9f0;
  border-radius: 15px;
  background: #fff;
  box-shadow: 0 2px 0 rgb(33 48 71 / 3%);
  transition: border-color .15s, transform .15s, box-shadow .15s;
}
.home-review-list .home-review-card:nth-child(2) { margin-inline: 8px; }
.home-review-list .home-review-card:nth-child(3) { margin-inline: 16px; }
.home-review-card:hover { border-color: #cbd8e5; transform: translateY(-2px); box-shadow: 0 9px 24px rgb(33 48 71 / 7%); }
.home-review-card h3 { margin: 0 0 7px; color: var(--frost-ink); font-size: 16px; line-height: 1.5; }
.home-review-card p { margin: 0; color: #7a8a9d; font-size: 12px; }
.home-review-card button { min-height: 40px; padding: 0 15px; border: 1px solid #cad7e5; border-radius: 10px; background: #f6f9fc; color: #35516f; font-size: 12px; font-weight: 650; cursor: pointer; }
.home-review-card button:hover { border-color: #9fb5cc; background: #edf4fa; }
.home-empty { margin: 0; padding: 30px; border: 1px dashed #d7e2ec; border-radius: 15px; color: #7a8a9d; font-size: 13px; text-align: center; }

.chat-resize-handle { position: relative; width: 7px; height: 100%; padding: 0; border: 0; background: transparent; cursor: col-resize; touch-action: none; }
.chat-resize-handle::after { content: ""; position: absolute; inset: 0 auto 0 3px; width: 1px; background: #dfe7ef; transition: background .12s, width .12s, left .12s; }
.chat-resize-handle:hover::after, .chat-resize-handle:focus-visible::after, body.chat-resizing .chat-resize-handle::after { left: 2px; width: 3px; background: #759dd1; }
.chat-resize-handle:focus-visible { outline: 0; }
.chat-dock {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  height: 100vh;
  display: grid;
  grid-template-rows: 58px minmax(0, 1fr) auto;
  overflow: hidden;
  background: #fbfdff;
  border-left: 1px solid #e2e9f0;
}
.chat-dock.is-collapsed { visibility: hidden; border-left: 0; }
.chat-dock-header { box-sizing: border-box; width: 100%; min-width: 0; padding: 0 15px; display: flex; align-items: center; gap: 10px; border-bottom: 1px solid #e7edf3; }
.chat-dock-header b { min-width: 0; flex: 1 1 0; overflow: hidden; color: var(--frost-ink); font-size: 14px; line-height: 1.4; text-overflow: ellipsis; white-space: nowrap; }
.chat-dock-close { display: none; }
.chat-dock > .messages { box-sizing: border-box; width: 100%; min-width: 0; overflow-x: hidden; padding: 22px 16px 18px; }
.chat-dock .welcome { height: 100%; min-height: 100%; margin: 0; display: grid; place-items: center; align-content: center; text-align: center; }
.chat-dock .welcome h1 { font-size: 20px; line-height: 1.5; }
.chat-dock .message-row { width: 100%; max-width: 100%; margin-bottom: 20px; }
.chat-dock .message-inner,
.chat-dock .message-stack { min-width: 0; max-width: 100%; }
.chat-dock .message-row.assistant .message-stack { max-width: calc(100% - 37px); }
.chat-dock .message-row.user .message-stack { max-width: 88%; }
.chat-dock .message-avatar { width: 25px; height: 25px; flex-basis: 25px; font-size: 11px; }
.chat-composer-area { box-sizing: border-box; width: 100%; min-width: 0; padding: 8px 10px 10px; background: #fbfdff; }
.chat-composer-area .composer { box-sizing: border-box; width: 100%; min-width: 0; min-height: 94px; padding: 11px; border: 1px solid #e0e8f0; border-radius: 16px; background: #f4f7fa; }
.chat-composer-area .composer-actions { min-width: 0; }
.chat-composer-area .composer textarea { min-height: 38px; }
.chat-dock .composer-tools > button {
  box-sizing: border-box;
  width: 96px;
  flex: 0 0 96px;
  justify-content: center;
  padding-inline: 8px;
  white-space: nowrap;
}
.chat-context-actions { padding: 8px 3px 0; display: flex; align-items: center; gap: 5px; border-top: 1px solid #e7edf3; margin-top: 8px; }
.chat-context-actions button {
  height: 30px;
  padding: 0 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: #6f8298;
  font-size: 11px;
  line-height: 1;
  cursor: pointer;
}
.chat-context-actions button:hover { background: #edf3f8; color: #35516f; }
.chat-context-actions button:disabled { opacity: .4; }
.chat-dock #practice-from-chat { margin-left: 0; background: transparent; }

.chat-dock-toggle, .chat-dock-scrim { display: none; }
body.chat-resizing { user-select: none; }
body.sidebar-resizing { user-select: none; }
.chat-main.review-active, .chat-main.practice-active { grid-template-rows: 58px minmax(0, 1fr) auto; }
.chat-main.review-active .home-page, .chat-main.practice-active .home-page { display: none; }
.chat-main[data-page="home"] > #review-page,
.chat-main[data-page="home"] > #practice-page { display: none !important; }
.chat-main[data-page="review"] > #home-page,
.chat-main[data-page="review"] > #practice-page { display: none !important; }
.chat-main[data-page="practice"] > #home-page,
.chat-main[data-page="practice"] > #review-page { display: none !important; }

@media (max-width: 1180px) {
  .workspace-shell { display: block; }
  .chat-resize-handle { display: none; }
  .chat-dock {
    position: fixed;
    z-index: 42;
    top: 0;
    right: 0;
    width: min(440px, calc(100vw - 34px));
    border-left: 1px solid #dbe5ef;
    box-shadow: -18px 0 50px rgb(30 48 70 / 14%);
    transform: translateX(103%);
    transition: transform .22s ease;
  }
  .chat-dock.open { transform: none; }
  .chat-dock-toggle {
    position: fixed;
    z-index: 41;
    top: 11px;
    right: 10px;
    width: 32px;
    height: 32px;
    padding: 0;
    display: block;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    color: #0d0d0d;
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
  }
  .chat-dock-close {
    width: 32px;
    height: 32px;
    margin-left: auto;
    padding: 0;
    display: grid;
    place-content: center;
    gap: 4px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    cursor: pointer;
  }
  .chat-dock-close:hover { background: #edf3f8; }
  .chat-dock-close span { width: 15px; height: 1.5px; border-radius: 2px; background: #60758e; }
  body.chat-dock-visible .chat-dock-toggle { opacity: 0; pointer-events: none; }
  .chat-dock-scrim { position: fixed; z-index: 41; inset: 0; width: 100%; height: 100%; display: block; border: 0; background: rgb(28 42 60 / 20%); }
body.chat-dock-visible { overflow: hidden; }
body.chat-resizing .chat-dock { transition: none; }
}

@media (max-width: 760px) {
  .workspace-shell { height: 100vh; }
  .sidebar { width: min(270px, calc(100vw - 56px)); }
  .sidebar-resize-handle { display: none; }
  .home-page { padding: 28px 18px 52px; }
  .home-intro { align-items: flex-start; margin-bottom: 22px; }
  .home-intro h1 { font-size: 32px; }
  .home-knowledge { margin-bottom: 30px; }
  .home-knowledge > header { align-items: flex-start; }
  .home-usage { margin-top: 18px; padding-top: 15px; }
  .home-usage-scroll { margin-right: -4px; }
  .home-review-card { grid-template-columns: 1fr; gap: 12px; }
  .home-review-list .home-review-card:nth-child(n) { margin-inline: 0; }
  .home-review-card button { justify-self: start; }
  .chat-dock { width: min(100vw, 440px); }
  .chat-dock-toggle { right: 10px; }
}