/* 答疑聊天：一整张纸面，左边五科与对话、右边对话，中间一条细线；功能栏留在纸面外。手机上左边变成抽屉 */

#chatView { left: var(--rail); }
.chat { position: absolute; inset: 0; display: flex; padding: 12px 12px 12px 0; }
.chat-paper { position: relative; flex: 1; min-width: 0; display: flex; background: var(--paper); border-radius: var(--r-paper); box-shadow: var(--sh-paper); overflow: hidden; }

/* ---------- 左侧：科目 → 对话 ---------- */
.chat-side { width: 248px; flex: none; overflow-y: auto; overscroll-behavior: contain; padding: 14px 10px 20px; border-right: 1px solid var(--line); }
.chat-subjects { display: flex; flex-direction: column; gap: 2px; }
.subject-head {
  width: 100%; justify-content: flex-start; min-height: 46px; padding: 0 14px; border-radius: 14px;
  background: transparent; color: var(--ink-2); font: 600 16px/1.4 var(--font);
}
.subject[data-open="true"] .subject-head { color: var(--ink); }
.subject-body { padding: 4px 0 10px; }
.subject-empty { margin: 8px 0 4px 26px; font: var(--t-caption); color: var(--muted); }
.subject-body .text-button { margin-left: 18px; color: var(--muted); font: var(--t-caption); }
.threads { list-style: none; margin: 0; padding: 0; }
.thread {
  position: relative; width: 100%; min-height: 50px; padding: 7px 12px 7px 26px; border-radius: 12px; white-space: normal;
  display: flex; flex-direction: column; align-items: stretch; justify-content: center; gap: 0; text-align: left; background: transparent; color: var(--ink-2);
}
.thread-title { font: var(--t-control); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.thread-time { font: 400 12px/1.4 var(--font); color: var(--muted); }
.thread[aria-current="true"] { background: var(--control); color: var(--ink); }
.thread[aria-current="true"]::before { content: ""; position: absolute; left: 12px; top: 16px; bottom: 16px; width: 3px; border-radius: 3px; background: var(--accent); }
.thread[data-state="running"] .thread-time::after { content: ""; display: inline-block; width: 6px; height: 6px; margin-left: 6px; border-radius: 50%; background: var(--accent); vertical-align: 1px; }
@media (hover: hover) and (pointer: fine) {
  .subject-head:not(:disabled):hover, .thread:not(:disabled):hover { background: var(--control); }
  .thread[aria-current="true"]:hover { background: var(--control-hover); }
}

/* ---------- 对话纸面 ---------- */
.chat-main { position: relative; flex: 1; min-width: 0; display: flex; flex-direction: column; overflow: hidden; }
.chat-head { min-height: 60px; flex: none; display: flex; align-items: center; gap: 8px; padding: 8px 14px 4px 28px; }
.chat-title { flex: 1; min-width: 0; margin: 0; font: var(--t-heading); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chat-menu { display: none; }
.chat-new { color: var(--ink-2); }
.chat-scroll { flex: 1 1 0; min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
.chat-log, .chat-start, .chat-blocked, .chat-composer, .chat-note, .chat-below { width: calc(100% - 56px); max-width: 780px; margin-left: auto; margin-right: auto; }
.chat-log { padding: 4px 0 20px; }
.chat-note { flex: none; min-height: 18px; margin-top: 6px; margin-bottom: 10px; font: var(--t-caption); color: var(--danger); }

/* 空白对话：标题在输入框上方，学习卡在下方，输入框居中 */
.chat-start { display: flex; flex-direction: column; justify-content: flex-end; min-height: 100%; padding-bottom: 18px; }
.chat-start:empty { display: none; }
.chat-start-title { margin: 0 0 4px 2px; font: var(--t-display); letter-spacing: -.01em; }
.chat-below { flex: none; display: none; }
.chat[data-empty="true"] .chat-log { display: none; }
.chat[data-empty="true"] .chat-scroll { flex: 1 1 0; }
.chat[data-empty="true"] .chat-below { flex: 1 1 0; display: block; overflow-y: auto; padding-top: 6px; }
.chat[data-empty="true"] .chat-note { min-height: 0; margin: 4px auto 0; }

.study-card { margin-top: 10px; padding: 16px 18px 6px; border-radius: 18px; box-shadow: inset 0 0 0 1px var(--line); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 18px; }
.study-card-head { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; margin-bottom: 4px; }
.study-card-head h3 { margin: 0; font: var(--t-heading); font-size: 15px; }
.study-card-head .text-button { font: var(--t-caption); color: var(--muted); }
.study-group h4 { margin: 4px 0 4px; font: var(--t-caption); color: var(--muted); }
.study-group ul { margin: 0 0 10px; padding-left: 18px; font: var(--t-control); color: var(--ink-2); }
.study-group li { margin: 3px 0; }

/* ---------- 一轮：学生的话（右）＋ 老师的回答（左，不套气泡） ---------- */
.turn { margin: 22px 0 30px; }
.ask { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; margin-left: 14%; }
.ask-text { margin: 0; max-width: 100%; padding: 10px 16px; border-radius: 20px 20px 6px 20px; background: var(--control); font: var(--t-body); white-space: pre-wrap; overflow-wrap: anywhere; }
.ask-photos { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.ask-photos img { height: 132px; max-width: 220px; object-fit: cover; border-radius: 14px; box-shadow: inset 0 0 0 1px var(--line); background: var(--control); }
.reply { display: grid; grid-template-columns: 26px minmax(0, 1fr); column-gap: 14px; margin-top: 16px; }
.reply-mark { grid-row: 1 / span 2; margin-top: 3px; }
.reply[data-status="running"] .reply-mark .face { fill: var(--accent); transition: fill var(--d-state); }
.answer { min-width: 0; font: var(--t-body); font-size: 17px; line-height: 1.8; overflow-wrap: anywhere; }
.answer:empty { min-height: 30px; }
.answer p { margin: 0 0 12px; }
.answer p:last-child { margin-bottom: 0; }
.answer ul, .answer ol { padding-left: 24px; margin: 8px 0 12px; }
.answer h3, .answer h4, .answer h5, .answer h6 { font: var(--t-heading); margin: 18px 0 8px; }
.answer pre { white-space: pre-wrap; overflow: auto; background: var(--control); padding: 10px 12px; border-radius: 10px; }
.answer code { font-size: .92em; }
.answer .answer-pending { white-space: pre-wrap; }
.answer-table { max-width: 100%; overflow-x: auto; margin: 12px 0; }
.answer table { border-collapse: collapse; width: 100%; font-size: 15px; }
.answer th, .answer td { border: 1px solid var(--line); padding: 7px 11px; text-align: left; }
.answer th { font-weight: 600; }
.answer .katex-display { overflow-x: auto; overflow-y: hidden; padding: 2px 0; }
.answer .formula-invalid { font-family: ui-monospace, monospace; color: var(--ink-2); }
.reply-foot { grid-column: 2; min-width: 0; }
.reply-foot:empty { display: none; }
.reply-problem { margin: 6px 0 0; font: var(--t-control); color: var(--danger); }

.citations { display: grid; gap: 8px; margin-top: 14px; }
.citation { margin: 0; padding: 10px 14px 11px; border-radius: 14px; box-shadow: inset 0 0 0 1px var(--line); }
.citation figcaption { display: flex; align-items: center; gap: 6px; font: var(--t-caption); color: var(--muted); }
.citation figcaption .icon { width: 16px; height: 16px; }
.citation blockquote { margin: 4px 0 0; font: var(--t-control); font-size: 15px; line-height: 1.65; color: var(--ink-2); }
.lecture-links { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.lecture-link { display: inline-flex; align-items: center; min-height: 32px; padding: 0 12px; border-radius: 10px; box-shadow: inset 0 0 0 1px var(--line); font: var(--t-caption); color: var(--ink-2); text-decoration: none; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.check-line { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin-top: 12px; font: var(--t-control); color: var(--muted); }
.check-line[data-kind="agreed"] { color: var(--accent-ink); }
.check-line[data-kind="disagreed"] { color: var(--danger); }
.check-line[data-kind="running"]::before { content: ""; width: 14px; height: 14px; border-radius: 50%; border: 2px solid var(--accent-soft); border-top-color: var(--accent); animation: arc-spin 850ms linear infinite; }
.check-note { flex-basis: 100%; margin: 2px 0 0; color: var(--ink-2); }
.check-button { margin-left: -12px; color: var(--ink-2); }
.check-line.tools { gap: 2px; }
.check-line.tools:empty { display: none; }
.check-line.tools .check-button + .check-button { margin-left: 0; }

/* ---------- 输入框 ---------- */
.chat-blocked { flex: none; display: flex; align-items: center; gap: 12px; margin-bottom: 8px; padding: 0 4px; font: var(--t-control); color: var(--muted); }
.chat-blocked[hidden] { display: none; }
.chat-blocked button { min-height: 36px; }
.chat-composer { flex: none; box-shadow: inset 0 0 0 1px var(--line-strong); }
.chat-composer:focus-within { box-shadow: inset 0 0 0 1px var(--ink-2), 0 0 0 4px var(--accent-soft); }
.chat-composer .composer-row { padding: 8px 8px 8px 8px; gap: 4px; }
.chat-composer textarea { min-width: 0; max-height: 168px; padding: 10px 6px; }
.chat-composer[aria-busy="true"] .act { opacity: .6; }
.chat-field { position: relative; flex: 1; min-width: 0; display: flex; }
.chat-field textarea { flex: 1; width: 100%; }
.chat-field .voice-bars { left: 6px; right: 6px; }
.chat-composer :is(.act, .voice-record)[hidden], .chat-voice[hidden] { display: none; }
.chat-composer:is([data-voice="recording"], [data-voice="permission"]) textarea { opacity: 0; pointer-events: none; }
.chat-composer[data-voice="permission"] .voice-bars { opacity: .6; }
.chat-voice { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; padding: 0 14px 10px; }
.chat-voice .voice-input-status { flex-basis: 100%; margin: 0; font: var(--t-caption); color: var(--muted); }
.chat-voice .voice-input-status:empty { display: none; }
.chat-voice .help-question { flex-basis: 100%; min-height: 82px; }
.chat-plus, .chat-camera { color: var(--ink-2); }
.chat-camera { display: none; }
.citation figcaption a { color: inherit; text-decoration: underline; text-decoration-color: var(--line-strong); text-underline-offset: 3px; overflow-wrap: anywhere; }
.reply-note { margin: 0; font: var(--t-caption); color: var(--muted); }
.act[data-mode="stop"] .icon { width: 16px; height: 16px; }
.plus-menu { position: absolute; z-index: 8; left: 0; bottom: calc(100% + 8px); min-width: 184px; display: flex; flex-direction: column; padding: 6px; border-radius: 18px; background: var(--paper); box-shadow: var(--sh-float); transform-origin: 22px 100%; }
.plus-menu[hidden] { display: none; }
.plus-menu button { justify-content: flex-start; gap: 12px; min-height: 44px; padding: 0 16px 0 12px; border-radius: 12px; background: transparent; font: var(--t-control); color: var(--ink); }
.plus-menu .icon { width: 20px; height: 20px; color: var(--ink-2); }
.lecture-link { flex: 1 1 auto; min-width: 0; height: 32px; padding: 0 10px; border: 0; border-radius: 9px; background: var(--control); font: var(--t-caption); color: var(--ink); }
.lecture-go { flex: none; min-height: 32px; height: 32px; padding: 0 12px; }
.chat-lecture { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 10px 8px 0 14px; font: var(--t-caption); color: var(--muted); }
.chat-lecture[hidden] { display: none; }
.chat-lecture > .icon { flex: none; width: 16px; height: 16px; color: var(--ink-2); }
.lecture-title { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ink-2); }
.lecture-label { flex: none; }
.lecture-at { flex: none; width: 60px; height: 30px; padding: 0 8px; border: 0; border-radius: 9px; background: var(--control); font: var(--t-caption); font-variant-numeric: tabular-nums; color: var(--ink); text-align: center; }
.lecture-seek { flex: 1 0 100%; display: flex; align-items: center; gap: 8px; padding-right: 8px; }
.lecture-range { flex: 1 1 auto; min-width: 0; margin: 0; touch-action: pan-y; }
.lecture-range:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.lecture-total { flex: none; font-variant-numeric: tabular-nums; }
.lecture-remove { flex: none; width: 32px; min-width: 32px; height: 32px; min-height: 32px; }
.lecture-remove .icon { width: 16px; height: 16px; }
.chat-attach { display: flex; gap: 10px; padding: 12px 12px 0; overflow-x: auto; }
.chat-attach[hidden] { display: none; }
.attach-item { position: relative; flex: none; width: 76px; display: flex; flex-direction: column; gap: 4px; }
.attach-item img { width: 76px; height: 76px; object-fit: cover; border-radius: 12px; box-shadow: inset 0 0 0 1px var(--line); }
.attach-role { min-height: 28px; height: 28px; padding: 0 6px; border-radius: 8px; font: var(--t-caption); background: var(--control); }
.attach-remove { position: absolute; top: -6px; right: -6px; width: 28px; min-width: 28px; height: 28px; min-height: 28px; border-radius: 50%; background: var(--paper); box-shadow: var(--sh-touch), inset 0 0 0 1px var(--line); }
.attach-remove .icon { width: 14px; height: 14px; }

.chat-scrim { display: none; }

/* ---------- 窄屏：竖屏平板收窄左栏；手机左栏变抽屉，拍题按钮出现 ---------- */
@media (max-width: 900px) {
  .chat-side { width: 212px; }
  .chat-log, .chat-start, .chat-blocked, .chat-composer, .chat-note, .chat-below { width: calc(100% - 40px); }
  .chat-head { padding-left: 20px; }
  .study-card { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
  #chatView { left: 0; bottom: calc(60px + env(safe-area-inset-bottom)); }
  .chat { padding: 0; }
  .chat-paper { border-radius: 0; box-shadow: none; }
  .chat-side {
    position: absolute; z-index: 6; left: 0; top: 0; bottom: 0; width: min(300px, 84vw); padding: 14px 12px 20px;
    background: var(--float); box-shadow: var(--sh-float); border-right: 0; translate: -105% 0; visibility: hidden;
    transition: translate var(--d-space) var(--ease-space), visibility 0s linear var(--d-space);
  }
  .chat[data-drawer="open"] .chat-side { translate: 0 0; visibility: visible; transition: translate var(--d-space) var(--ease-space), visibility 0s; }
  .chat-scrim { display: block; position: absolute; z-index: 5; inset: 0; background: rgba(20, 22, 28, .18); opacity: 0; pointer-events: none; transition: opacity var(--d-state); }
  .chat[data-drawer="open"] .chat-scrim { opacity: 1; pointer-events: auto; }
  .chat-menu { display: inline-flex; }
  .chat-head { min-height: 52px; padding: 4px 8px; }
  .chat-new span { display: none; }
  .chat-new { width: 44px; padding: 0; }
  .chat-log, .chat-start, .chat-blocked, .chat-composer, .chat-note, .chat-below { width: calc(100% - 24px); }
  .chat-start-title { font: var(--t-title); }
  .ask { margin-left: 10%; }
  .ask-photos img { height: 112px; }
  .reply { grid-template-columns: 22px minmax(0, 1fr); column-gap: 10px; }
  .reply-mark { --size: 22px !important; }
  .answer { font-size: 16px; }
  .chat-camera { display: inline-flex; }
}
.reply-wait { font: var(--t-caption); color: var(--muted); font-variant-numeric: tabular-nums; }

/* ================= 首页即聊天（2026-10-17，按 docs/design/v2/home-chat 原型，用户已认可） =================
   新样式：系统字体、标题字重 500、字号不缩；圆角统一（大面板 16px，面板里的按钮和行 10px）；
   左栏不加颜色，颜色只出现在对话里（今天这几件的小图标块） */
#chatView, #rail {
  --font: var(--font-system);
  --t-display: 500 28px/1.3 var(--font);
  --t-title: 500 20px/1.4 var(--font);
  --t-heading: 500 16px/1.45 var(--font);
  --t-body: 400 16px/1.75 var(--font);
  --t-control: 400 14px/1.45 var(--font);
  --t-caption: 400 12.5px/1.5 var(--font);
  --r-paper: 16px; --r-card: 12px; --r-float: 14px; --r-control: 10px; --r-chip: 7px;
  --c-math: #3d6fd6; --c-physics: #7c5bd3; --c-chemistry: #12856f; --c-biology: #4c9a3a; --c-english: #d2792a;
}
#chatView { font: var(--t-body); }
html[data-app-ask] #chatView { left: 0; bottom: 0; transition: opacity var(--d-fade) var(--ease-out); }
html[data-app-ask="loading"] #chatView { opacity: 0; }
.chat-note[data-calm="1"] { color: var(--muted); }
/* 整页白底：左栏和对话是同一张白面，中间一条细线，不留缝 */
#workspace[data-page="chat"] { background: var(--paper); }
.chat { padding: 0; }
.chat-paper { background: var(--paper); box-shadow: none; border-radius: 0; overflow: visible; gap: 0; }
.chat-side { width: 244px; padding: 12px 10px 18px; border: 0; border-right: 1px solid var(--line); border-radius: 0; background: transparent; box-shadow: none; }
.chat-main { background: var(--paper); border-radius: 0; box-shadow: none; }
.chat-head { min-height: 54px; padding-left: 10px; }
.chat-title { font: 500 16px/1.4 var(--font); }
.chat-menu { display: inline-flex; }
.answer { font-size: 16px; }
.reply { grid-template-columns: 22px minmax(0, 1fr); column-gap: 12px; }
.reply-mark { --size: 22px !important; }
.ask-text { border-radius: 16px 16px 5px 16px; }
.study-card { border-radius: var(--r-card); }

/* 左栏：老师 → 五科（默认收起） */
.side-teacher { width: 100%; justify-content: flex-start; gap: 12px; min-height: 52px; padding: 0 10px; border-radius: 10px; background: transparent; color: var(--ink-2); text-align: left; }
.side-teacher .who { display: flex; flex-direction: column; min-width: 0; }
.side-teacher strong { font: 500 15px/1.35 var(--font); color: var(--ink); }
.side-teacher small { font: var(--t-caption); color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.side-teacher[aria-current="true"], .thread[aria-current="true"] { background: var(--control); box-shadow: none; }
.side-rule { height: 1px; margin: 10px; background: rgba(20, 22, 28, .07); }
.subject-head { min-height: 40px; padding: 0 10px; border-radius: 10px; font: 500 15px/1.4 var(--font); color: var(--ink); }
.subject-head::after { content: "›"; margin-left: auto; color: var(--faint); font-size: 17px; transition: rotate var(--d-state) var(--ease-out); }
.subject[data-open="true"] .subject-head::after { rotate: 90deg; }
.subject-head::before { content: ""; flex: none; width: 8px; height: 8px; margin-right: 10px; border-radius: 50%; background: var(--subject); }
.subject-body { padding: 2px 0 8px; }
.thread { min-height: 36px; padding: 6px 10px 6px 30px; border-radius: 10px; }
.thread-title { font-size: 14px; }
.thread[aria-current="true"]::before { display: none; }
.thread-new { flex-direction: row; justify-content: flex-start; align-items: center; gap: 6px; color: var(--muted); font: var(--t-control); padding-left: 26px; }
.thread-new .icon { width: 16px; height: 16px; }
.subject-empty, .subject-body .text-button { margin-left: 30px; }
@media (hover: hover) and (pointer: fine) {
  .side-teacher:hover, .subject-head:not(:disabled):hover, .thread:not(:disabled):hover { background: rgba(20, 22, 28, .045); }
}

/* 宽屏：左栏推开的宽度由 chat.mjs 用弹簧逐帧设置；左栏里的内容保持原宽，只被裁出，不跟着重排 */
@media (min-width: 601px) {
  .chat-side { overflow-x: hidden; }
  .chat-subjects { width: 224px; }
}

/* 总会话：日期分隔、换话题分隔、更早的对话 */
.day-rule, .topic-rule { display: flex; align-items: center; gap: 12px; margin: 26px 0 6px; font: var(--t-caption); color: var(--muted); }
.day-rule::before, .day-rule::after, .topic-rule::before, .topic-rule::after { content: ""; flex: 1; height: 1px; background: var(--line); }
.earlier { display: flex; margin: 8px auto 0; color: var(--muted); font: var(--t-caption); }

/* 首页：问候、输入框、今天这几件居中 */
.chat-greet { flex: none; display: flex; flex-direction: column; align-items: center; gap: 14px; margin: 0 auto 22px; text-align: center; }
.chat-greet h2 { margin: 0; font: var(--t-display); letter-spacing: -.01em; }
.chat-greet .dots { --size: 44px !important; }
.chat[data-home="true"] .chat-main { justify-content: center; padding-bottom: 6vh; }
.chat[data-home="true"] .chat-head { position: absolute; top: 0; left: 0; right: 0; z-index: 2; }
.chat[data-home="true"] .chat-scroll { display: none; }
.chat[data-home="true"] :is(.chat-composer, .chat-note, .chat-below, .chat-blocked) { max-width: 680px; }
.chat[data-home="true"] .chat-below { flex: 0 1 auto; display: block; overflow: visible; padding-top: 4px; }
.chat[data-home="true"] .chat-note { min-height: 0; margin: 4px auto 0; }
.today { display: grid; gap: 2px; }
.today-row { display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; align-items: center; column-gap: 12px; min-height: 58px; padding: 6px 4px 6px 2px; border-bottom: 1px solid var(--line); }
.today-row:last-child { border-bottom: 0; }
.today-row > .icon { width: 32px; height: 32px; padding: 7px; border-radius: 9px; color: #fff; background: var(--tile, var(--ink-2)); }
.today-row[data-kind="lesson"] { --tile: var(--c-chemistry); }
.today-row[data-kind="exam"] { --tile: var(--c-math); }
.today-row .actions .suggest-note { align-self: center; color: var(--danger); font: var(--t-caption); }
.today-row .actions .suggest-note:empty { display: none; }
.today-row[data-kind="suggest"] .actions { flex-wrap: wrap; justify-content: flex-end; }
.today-row p { margin: 0; font: var(--t-body); line-height: 1.5; }
.today-row small { display: block; font: var(--t-caption); color: var(--muted); }
.today-row .actions { display: flex; gap: 6px; }
.today-row button { min-height: 34px; border-radius: 10px; }
.home-more { display: flex; align-items: center; gap: 2px; margin: 10px auto 0; min-height: 36px; background: transparent; color: var(--muted); font: var(--t-control); }
.home-more .icon { width: 16px; height: 16px; }

@media (max-width: 600px) {
  .chat { padding: 0; }
  .chat-main { border-radius: 0; box-shadow: none; }
  .chat-side { width: min(300px, 84vw); padding: 14px 12px 20px; background: var(--paper); border-right: 0; box-shadow: var(--sh-float); border-radius: 0 var(--r-paper) var(--r-paper) 0; }
  .chat-head { padding-left: 6px; }
  .chat-greet h2 { font: var(--t-title); }
  .today-row { grid-template-columns: 28px minmax(0, 1fr); }
  .today-row > .icon { width: 28px; height: 28px; padding: 5px; }
  .today-row .actions { grid-column: 2; padding: 4px 0 2px; }
}

/* ---------- 液态玻璃（glass.mjs 设 data-glass：liquid 模糊+折射 · lite 只模糊 · off 不透明） ---------- */
:root:not([data-glass="off"]) :is(.chat-composer, #rail, .chat[data-empty="false"] .chat-head) {
  isolation: isolate; background: transparent !important; box-shadow: none !important;
}
:root:not([data-glass="off"]) :is(.chat-composer, #rail, .chat[data-empty="false"] .chat-head)::before {
  content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; pointer-events: none;
  background: rgba(255, 255, 255, .4);
  -webkit-backdrop-filter: blur(7px) saturate(1.9); backdrop-filter: blur(7px) saturate(1.9);
}
:root[data-glass="liquid"] :is(.chat-composer, #rail, .chat[data-empty="false"] .chat-head)::before { filter: var(--lens, none); }
/* 对话滚动时关掉折射，只留模糊 */
:root[data-glass="liquid"] .chat[data-scrolling] :is(.chat-composer, .chat-head)::before { filter: none; }
:root:not([data-glass="off"]) :is(.chat-composer, #rail, .chat[data-empty="false"] .chat-head)::after {
  content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; pointer-events: none;
  background: linear-gradient(140deg, rgba(255, 255, 255, .55), rgba(255, 255, 255, 0) 38%, rgba(255, 255, 255, 0) 70%, rgba(255, 255, 255, .25));
  box-shadow: inset 1.5px 1.5px 1px rgba(255, 255, 255, .85), inset -1px -1px 1px rgba(255, 255, 255, .5), inset 0 0 0 1px rgba(20, 22, 28, .05), 0 8px 26px rgba(20, 22, 28, .1), 0 1px 3px rgba(20, 22, 28, .07);
}
:root:not([data-glass="off"]) .chat-composer:focus-within::after { box-shadow: inset 1.5px 1.5px 1px rgba(255, 255, 255, .85), inset -1px -1px 1px rgba(255, 255, 255, .5), inset 0 0 0 1px var(--ink-2), 0 0 0 4px var(--accent-soft), 0 8px 26px rgba(20, 22, 28, .1); }
:root:not([data-glass="off"]) .chat[data-empty="false"] .chat-head { position: relative; }
:root:not([data-glass="off"]) .chat-composer { border-radius: var(--r-paper); }

/* 导航栏：浮起的玻璃条 */
:root:not([data-glass="off"]) #rail { top: 10px; bottom: 10px; left: 8px; width: 52px; border-radius: var(--r-paper); padding: 14px 0 12px; gap: 12px; }
:root:not([data-glass="off"]) #rail .rail-item { width: 40px; height: 40px; min-height: 40px; border-radius: 10px; }
:root:not([data-glass="off"]) #rail .rail-item[aria-current="page"]::before { display: none; }
:root:not([data-glass="off"]) #rail .rail-item[aria-current="page"] { background: rgba(255, 255, 255, .75); }
@media (max-width: 600px) { :root:not([data-glass="off"]) #rail { left: 8px; right: 8px; top: auto; bottom: 8px; width: auto; height: 60px; padding: 0 8px; } }

/* 对话中：标题栏和输入框浮在内容上，内容从它们下面滑过（首页、空白页不浮） */
:root:not([data-glass="off"]) .chat[data-empty="false"] .chat-main { display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: auto minmax(0, 1fr) auto auto auto; }
:root:not([data-glass="off"]) .chat[data-empty="false"] .chat-scroll { grid-area: 1 / 1 / 6 / 2; }
:root:not([data-glass="off"]) .chat[data-empty="false"] :is(.chat-head, .chat-blocked, .chat-composer, .chat-note) { grid-column: 1; z-index: 2; }
:root:not([data-glass="off"]) .chat[data-empty="false"] .chat-head { grid-row: 1; margin: 10px 12px 0; min-height: 48px; border-radius: var(--r-paper); padding-left: 6px; }
:root:not([data-glass="off"]) .chat[data-empty="false"] .chat-blocked { grid-row: 3; }
:root:not([data-glass="off"]) .chat[data-empty="false"] .chat-composer { grid-row: 4; }
:root:not([data-glass="off"]) .chat[data-empty="false"] .chat-note { grid-row: 5; }
:root:not([data-glass="off"]) .chat[data-empty="false"] .chat-log { padding-top: 74px; padding-bottom: calc(var(--dock, 64px) + 44px); }

/* 回答里的建议卡（老师建议备一节课） */
.mini { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; margin-top: 12px; padding: 10px 10px 10px 16px; border-radius: 12px; box-shadow: inset 0 0 0 1px var(--line); }
/* 窄的时候按钮换到下一行，文字不被挤成一窄条 */
.mini > div:first-child { flex: 1 1 240px; min-width: 0; }
.mini p { margin: 0; font: var(--t-control); font-size: 15px; color: var(--ink); }
.mini small { display: block; font: var(--t-caption); color: var(--muted); }
.mini .actions { display: flex; gap: 6px; }
.mini button { min-height: 34px; border-radius: 10px; }
.split-list { display: grid; gap: 6px; margin-top: 12px; }
.split-list .mini { margin-top: 0; }
.split-item small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* 科目色只出现在对话里：题号前一个小色块 */
.split-item[data-subject="math"] { --subject: var(--c-math); }
.split-item[data-subject="physics"] { --subject: var(--c-physics); }
.split-item[data-subject="chemistry"] { --subject: var(--c-chemistry); }
.split-item[data-subject="biology"] { --subject: var(--c-biology); }
.split-item[data-subject="english"] { --subject: var(--c-english); }
.split-item p::before { content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 8px; border-radius: 2px; vertical-align: 1px; background: var(--subject); }

/* 演示一下 */
.demo { margin: 12px 0 0; padding: 12px 14px 12px; border-radius: 18px; box-shadow: inset 0 0 0 1px var(--line); }
.demo-title { font: var(--t-control); color: var(--ink); margin-bottom: 8px; }
.demo-note, .demo-hint { margin: 8px 0 0; font: var(--t-caption); color: var(--muted); }
.demo-hint { text-align: center; margin-top: 2px; }
.demo-none, .demo-failed { margin: 8px 0 0; font: var(--t-caption); color: var(--muted); }
.demo-plot, .demo-solid { display: block; width: 100%; height: auto; max-height: 360px; touch-action: none; user-select: none; }
.demo-solid { cursor: grab; }
.demo-solid:active { cursor: grabbing; }
.demo-grid line { stroke: var(--line); stroke-width: 1; }
.demo-grid line.axis { stroke: var(--line-strong); stroke-width: 1.4; }
.demo-grid text { font: 12px/1 system-ui, sans-serif; fill: var(--muted); font-variant-numeric: tabular-nums; }
.demo-line { fill: none; stroke: var(--ink-2); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.demo-line.lead { stroke: var(--accent); stroke-width: 2.4; }
.demo-seg { stroke: var(--ink-2); stroke-width: 1.8; stroke-linecap: round; }
.demo-seg.dashed { stroke-dasharray: 6 5; }
.demo-seg.lead { stroke: var(--accent); stroke-width: 2.2; }
.demo-point { fill: var(--accent); stroke: var(--paper); stroke-width: 2; }
.demo-label, .demo-vertex { font: 14px/1 system-ui, sans-serif; fill: var(--ink); paint-order: stroke; stroke: var(--paper); stroke-width: 4px; stroke-linejoin: round; }
.demo-vertex { font-style: italic; }
.demo-edge { stroke: var(--ink); stroke-width: 2; stroke-linecap: round; }
.demo-edge.hidden { stroke: var(--muted); stroke-width: 1.4; stroke-dasharray: 6 5; }
.demo-plane { fill: var(--accent-soft); stroke: var(--accent); stroke-width: 1.2; stroke-linejoin: round; }
.demo-slider { display: flex; align-items: center; gap: 10px; margin-top: 6px; }
.demo-slider input { flex: 1; min-width: 0; accent-color: var(--accent); }
.demo-slider output { flex: none; min-width: 72px; font: var(--t-caption); color: var(--ink-2); font-variant-numeric: tabular-nums; }
.demo-play { flex: none; width: 40px; min-width: 40px; height: 40px; min-height: 40px; }
.demo-steps { margin: 0; padding: 0 0 0 1.4em; }
.demo-step { padding: 4px 0; }
.demo-step-note { margin: 0; font: var(--t-caption); color: var(--muted); }
.demo-math .katex-display { margin: .2em 0; overflow-x: auto; overflow-y: hidden; text-align: left; }
.demo-math .katex-display > .katex { text-align: left; }
.demo-actions { display: flex; gap: 8px; margin-top: 6px; }
.demo-actions[hidden] { display: none; }
.demo-figure .figure-wrap { margin: 0; }

/* 标题：点一下改名 */
.chat-title-button { max-width: 100%; min-height: 36px; padding: 0 8px; margin-left: -8px; border-radius: 10px; background: transparent; font: inherit; color: inherit; justify-content: flex-start; }
.chat-title-button span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chat-title-input { width: 100%; height: 36px; padding: 0 8px; margin-left: -8px; border: 0; border-radius: 10px; background: var(--control); font: inherit; color: var(--ink); }
@media (hover: hover) and (pointer: fine) { .chat-title-button:hover { background: var(--control); } }

/* 试卷讲评：新建（试卷名、科目、照片） */
.chat[data-review="true"] :is(.chat-composer, .chat-below, .chat-note:empty) { display: none; }
.chat[data-review="true"] .chat-start { justify-content: flex-start; padding-top: 24px; }
.review-setup { display: flex; flex-direction: column; gap: 16px; }
.review-head { display: flex; align-items: center; justify-content: space-between; }
.review-head .chat-start-title { margin: 0; }
.review-field { display: flex; flex-direction: column; gap: 6px; font: var(--t-caption); color: var(--muted); }
.review-field input { height: 48px; padding: 0 14px; border: 0; border-radius: var(--r-control); background: var(--control); font: var(--t-control); font-size: 16px; color: var(--ink); }
.review-field input:focus-visible { outline: 2px solid var(--accent); outline-offset: 0; }
.review-subjects { display: flex; flex-wrap: wrap; gap: 6px; }
.review-subject { min-height: 40px; padding: 0 16px; border-radius: 20px; background: transparent; box-shadow: inset 0 0 0 1px var(--line); color: var(--ink-2); font: var(--t-control); }
.review-subject[aria-checked="true"] { background: var(--accent-tint); box-shadow: inset 0 0 0 1px var(--accent-ring); color: var(--accent-ink); }
.review-pages { display: grid; grid-template-columns: repeat(auto-fill, minmax(112px, 1fr)); gap: 10px; }
.review-page { position: relative; aspect-ratio: 3 / 4; }
.review-page img { width: 100%; height: 100%; object-fit: cover; border-radius: 12px; box-shadow: inset 0 0 0 1px var(--line), var(--sh-touch); }
.review-page > span { position: absolute; left: 8px; bottom: 8px; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 11px; background: rgba(255, 255, 255, .92); font: var(--t-caption); color: var(--ink-2); text-align: center; line-height: 22px; }
.review-add { aspect-ratio: 3 / 4; height: auto; flex-direction: column; gap: 6px; border-radius: 12px; background: transparent; box-shadow: inset 0 0 0 1px var(--line-strong); color: var(--ink-2); font: var(--t-caption); }
.review-add .icon { width: 24px; height: 24px; }
.review-foot { display: flex; align-items: center; justify-content: flex-end; gap: 10px; }
.review-foot small { flex: 1; min-width: 0; font: var(--t-caption); color: var(--muted); }
.act.review-start, .act.review-send { width: auto; padding: 0 20px; border-radius: 22px; font: var(--t-control); }

/* 试卷讲评：老师列出的题目，勾选、写思路 */
.review-pick { display: grid; gap: 4px; margin-top: 12px; }
.review-item { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; padding: 4px 4px 4px 0; border-radius: 12px; }
.review-check { flex: 1 1 220px; min-width: 0; min-height: 44px; justify-content: flex-start; gap: 12px; padding: 0 10px; border-radius: 12px; background: transparent; text-align: left; white-space: normal; }
.review-box { flex: none; width: 22px; height: 22px; display: grid; place-items: center; border-radius: 7px; box-shadow: inset 0 0 0 1.5px var(--line-strong); color: transparent; }
.review-box .icon { width: 14px; height: 14px; }
.review-check[aria-checked="true"] .review-box { background: var(--accent); box-shadow: none; color: #fff; }
.review-label { display: flex; flex-wrap: wrap; gap: 0 10px; min-width: 0; font: var(--t-control); color: var(--ink-2); }
.review-label strong { font-weight: 600; color: var(--ink); }
.review-note-toggle { min-height: 36px; font: var(--t-caption); }
.review-note-toggle .icon { width: 16px; height: 16px; }
.review-note { flex: 1 1 100%; margin: 0 0 6px 44px; min-height: 64px; padding: 10px 12px; border: 0; border-radius: 12px; background: var(--control); font: var(--t-control); color: var(--ink); resize: vertical; }
.review-note:focus-visible { outline: 2px solid var(--accent); outline-offset: 0; }
.review-pick .review-foot { margin-top: 6px; }
.review-chosen { margin: 0; font: var(--t-caption); color: var(--muted); }
@media (hover: hover) and (pointer: fine) {
  .review-check:hover, .review-subject:not([aria-checked="true"]):hover, .review-add:hover { background: var(--control); }
}
@media (max-width: 600px) {
  .review-pages { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .review-note { margin-left: 0; }
}

.ask-rich { white-space: normal; }
.ask-rich > :first-child { margin-top: 0; }
.ask-rich > :last-child { margin-bottom: 0; }
.chat-topic { width: fit-content; margin: 0 0 6px 4px; padding: 3px 12px; border-radius: 999px; font: var(--t-caption); color: var(--accent-ink); background: var(--accent-tint); }
.ask-island { position: absolute; z-index: 6; top: 12px; right: 12px; bottom: 12px; width: min(46vw, 480px); border-radius: var(--r-paper); background: var(--paper); box-shadow: var(--sh-float); overflow: hidden; font: var(--t-body); visibility: hidden; opacity: 0; transform: translateX(28px) scale(.98); transform-origin: right center; transition: opacity var(--d-fade) var(--ease-out), transform var(--d-space) var(--ease-space), visibility 0s linear var(--d-fade); }
.ask-island[data-open] { visibility: visible; opacity: 1; transform: none; transition: opacity var(--d-fade) var(--ease-out), transform var(--d-space) var(--ease-space); }
.ask-island-body { position: absolute; inset: 0; transition: opacity var(--d-fade) var(--ease-out); }
.ask-island[data-open="loading"] .ask-island-body { opacity: 0; }
.ask-island-close { position: absolute; z-index: 2; top: 10px; right: 10px; }
.ask-island .chat-side, .ask-island .chat-scrim, .ask-island .chat-menu, .ask-island .chat-new, .ask-island .chat-start, .ask-island .chat-below { display: none; }
.ask-island .chat[data-empty="true"] .chat-below { display: none; }
.ask-island .chat-head { padding-right: 56px; }
@media (max-width: 800px) {
  .ask-island { top: 8px; right: 8px; bottom: 8px; left: 8px; width: auto; }
}
