:root{--ink:#17201e;--muted:#68736f;--paper:#f6f4ed;--card:#fff;--line:#dfe3dc;--green:#12624f;--mint:#dceee7;--amber:#edb858;--danger:#b43d36;--shadow:0 24px 70px rgba(22,39,34,.12)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:"Microsoft YaHei","PingFang SC",system-ui,sans-serif}.demo-bar{padding:7px 16px;text-align:center;background:#fff0c9;color:#6b5015;font-size:12px}.topbar{height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 max(24px,6vw);border-bottom:1px solid rgba(23,32,30,.1)}.brand{display:flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;font-weight:800;font-size:20px}.brand-mark{display:grid;place-items:center;width:34px;height:34px;border-radius:11px;background:var(--green);color:#fff}.top-actions{display:flex;gap:12px}.button,.text-button{border:0;font:inherit;cursor:pointer}.text-button{background:transparent;color:var(--muted);padding:10px 14px}.button{border:1px solid var(--line);background:#fff;border-radius:12px;padding:13px 20px;font-weight:700;color:var(--ink)}.button-small{padding:9px 15px}.button-primary{background:var(--green);border-color:var(--green);color:#fff;box-shadow:0 8px 25px rgba(18,98,79,.18)}.full{width:100%}.landing{min-height:650px;display:grid;grid-template-columns:1.05fr .95fr;gap:8vw;align-items:center;padding:72px max(24px,9vw)}.eyebrow{color:var(--green);font-size:12px;font-weight:800;letter-spacing:.16em;text-transform:uppercase}.hero-copy h1{font-family:"STSong","Songti SC",serif;font-size:clamp(54px,7vw,92px);line-height:1.02;margin:20px 0 26px;letter-spacing:-.05em}.hero-copy h1 span{color:var(--green)}.hero-text{max-width:610px;color:var(--muted);font-size:18px;line-height:1.9}.hero-actions{display:flex;align-items:center;gap:18px;margin-top:34px}.quiet{font-size:13px;color:var(--muted)}.trust-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:35px}.trust-row span{border:1px solid var(--line);border-radius:999px;padding:8px 12px;color:#55605c;font-size:12px}.hero-card{background:var(--card);border:1px solid rgba(18,98,79,.12);border-radius:28px;padding:24px;box-shadow:var(--shadow);transform:rotate(1.5deg)}.card-top{display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--line);padding-bottom:18px;font-weight:700}.online-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#31a875;margin-right:5px}.card-label{margin-left:auto;color:var(--green);background:var(--mint);border-radius:999px;padding:6px 10px;font-size:11px}.sample-message{max-width:85%;padding:13px 16px;border-radius:17px;margin-top:18px;font-size:14px;line-height:1.7}.sample-message.student{margin-left:auto;background:var(--ink);color:#fff;border-bottom-right-radius:5px}.sample-message.tutor{background:#eef3ef;border-bottom-left-radius:5px}.sample-message.compact{max-width:70%}.thinking{display:flex;align-items:center;gap:4px;color:var(--muted);font-size:11px;margin:18px 6px 2px}.thinking i{width:5px;height:5px;border-radius:50%;background:var(--green)}.thinking span{margin-left:6px}.feature-strip{background:#1b2925;color:#fff;display:grid;grid-template-columns:repeat(3,1fr);padding:44px max(24px,9vw);gap:36px}.feature-strip article{display:grid;grid-template-columns:44px 1fr;column-gap:12px}.feature-strip b{grid-row:1/3;color:var(--amber);font-family:serif;font-size:30px}.feature-strip h2{font-size:17px;margin:2px 0 8px}.feature-strip p{margin:0;color:#bfcac6;font-size:13px;line-height:1.7}.chat-shell{height:calc(100vh - 101px);min-height:640px;grid-template-columns:280px 1fr;background:#edf0ea}.chat-shell:not([hidden]){display:grid}.chat-sidebar{padding:32px 24px;background:#1b2925;color:#fff;display:flex;flex-direction:column}.chat-sidebar .eyebrow{color:#8dcab7}.chat-sidebar h2{margin:8px 0 25px}.new-chat{padding:12px;border:1px solid #42514c;color:#fff;background:transparent;border-radius:12px;text-align:left;cursor:pointer}.quota-card{margin-top:auto;background:#263833;border:1px solid #40514c;border-radius:16px;padding:16px}.quota-head{display:flex;justify-content:space-between;font-size:12px}.quota-head strong{color:#a9dacb}.progress{height:5px;background:#41504c;border-radius:999px;overflow:hidden;margin:13px 0}.progress i{display:block;height:100%;background:#7fcab3;width:100%}.quota-card p{font-size:11px;color:#aebbb7}.text-link{border:0;padding:0;background:transparent;color:#f1c46f;font-weight:700;cursor:pointer}.account-row{display:flex;align-items:center;gap:10px;border:0;background:transparent;color:#fff;text-align:left;padding:18px 0 0;cursor:pointer}.account-row span:last-child{display:grid}.account-row small{color:#9ba9a4}.avatar{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#d6aa58;color:#1b2925;font-weight:800}.conversation{width:min(900px,100%);height:100%;margin:auto;background:#fff;display:flex;flex-direction:column;box-shadow:0 0 40px rgba(0,0,0,.04)}.conversation-head{padding:20px 28px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line)}.conversation-head h2{font-size:16px;margin:0}.conversation-head p{font-size:11px;color:var(--muted);margin:5px 0 0}.mode-chip{font-size:11px;border:1px solid var(--line);padding:7px 10px;border-radius:999px}.messages{flex:1;overflow:auto;padding:28px}.message{max-width:75%;margin:0 0 18px}.message.student{margin-left:auto}.message .meta{display:block;font-size:10px;color:var(--muted);margin-bottom:6px}.message.student .meta{text-align:right}.bubble{padding:13px 16px;border-radius:17px;line-height:1.75;font-size:14px;white-space:pre-wrap}.message.tutor .bubble{background:#eef3ef;border-bottom-left-radius:5px}.message.student .bubble{background:var(--green);color:#fff;border-bottom-right-radius:5px}.composer{margin:0 24px;border:1px solid #cfd7d2;border-radius:18px;background:#fff;box-shadow:0 10px 30px rgba(17,43,35,.08);padding:13px}.composer textarea{width:100%;border:0;resize:none;outline:0;font:inherit;line-height:1.5}.composer-bottom{display:flex;align-items:center}.attach{border:0;background:#eef3ef;border-radius:9px;padding:7px 9px;color:var(--green)}#sendStatus{margin-left:auto;margin-right:10px;color:var(--muted);font-size:11px}.send{width:36px;height:36px;border:0;border-radius:12px;background:var(--green);color:#fff;font-size:20px;cursor:pointer}.send.stop{background:var(--danger);font-size:15px}.send:disabled{opacity:.5;cursor:default}.disclaimer{text-align:center;color:#98a09d;font-size:10px;margin:10px 0 14px}.modal{width:min(440px,calc(100% - 28px));border:0;border-radius:24px;padding:34px;box-shadow:var(--shadow)}.modal::backdrop{background:rgba(8,17,14,.55);backdrop-filter:blur(4px)}.modal h2{font-family:"STSong","Songti SC",serif;font-size:32px;margin:8px 0 10px}.modal-copy,.modal-note{font-size:13px;line-height:1.7;color:var(--muted)}.modal-close{position:absolute;right:15px;top:13px;border:0;background:transparent;font-size:26px;color:var(--muted);cursor:pointer}.modal label:not(.consent){display:grid;gap:7px;font-size:12px;font-weight:700;margin:18px 0}.modal input{width:100%;border:1px solid var(--line);border-radius:11px;padding:12px;font:inherit}.code-row{display:grid;grid-template-columns:1fr 110px;gap:8px}.code-row button{border:0;border-radius:11px;background:var(--mint);color:var(--green);font-weight:700}.consent{display:flex;gap:8px;align-items:flex-start;font-size:11px;color:var(--muted);margin:15px 0}.consent input{width:auto}.form-error{min-height:18px;color:var(--danger);font-size:12px}.price strong{font-family:serif;font-size:52px}.price span{color:var(--muted)}.benefits{padding:0;list-style:none}.benefits li{padding:9px 0;border-bottom:1px solid var(--line)}.benefits li:before{content:"✓";color:var(--green);font-weight:900;margin-right:10px}.payment-placeholder{text-align:center;background:#f1f2ed;border:1px dashed #b8c0bc;border-radius:14px;padding:20px;margin:20px 0;display:grid;gap:5px;color:var(--muted)}.payment-placeholder b{color:var(--ink)}.account-stat{display:flex;justify-content:space-between;padding:15px 0;border-bottom:1px solid var(--line)}.account-stat span{color:var(--muted)}footer{padding:26px max(24px,6vw);display:flex;gap:24px;justify-content:space-between;color:var(--muted);font-size:11px}footer a{color:var(--green)}
.classroom-link{text-decoration:none;display:inline-flex;align-items:center}
@media(max-width:800px){.landing{grid-template-columns:1fr;padding-top:46px}.hero-card{display:none}.hero-copy h1{font-size:54px}.feature-strip{grid-template-columns:1fr}.chat-shell:not([hidden]){display:block;height:calc(100vh - 101px)}.chat-sidebar{display:none}.conversation{box-shadow:none}.message{max-width:88%}footer{flex-direction:column;gap:8px}.quiet{display:none}}

/* 图片上传预览与消息展示样式 */
.preview-list { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.preview { position: relative; width: 64px; height: 64px; }
.preview img { width: 100%; height: 100%; object-fit: cover; border-radius: 8px; border: 1px solid var(--line); }
.remove-preview { position: absolute; right: -5px; top: -5px; width: 18px; height: 18px; padding: 0; border: 0; border-radius: 50%; background: var(--muted); color: #fff; font-size: 11px; display: grid; place-items: center; cursor: pointer; }
.message-images { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
.message-images img { width: 120px; max-height: 120px; object-fit: cover; border-radius: 8px; border: 1px solid var(--line); background: #fff; }
.attach-group label.attach { cursor: pointer; }
#loginError { color: var(--danger); font-size: 12px; margin-top: 6px; }

/* 历史会话项与AI状态分析样式 */
.conv-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 12px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 10px;
  color: #bfcac6;
  font-size: 13px;
  cursor: pointer;
  transition: all 0.2s ease;
}
.conv-item:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
  border-color: rgba(255, 255, 255, 0.15);
}
.conv-item.active {
  background: #2a3d36;
  color: #fff;
  border-color: var(--green);
  box-shadow: 0 4px 12px rgba(18, 98, 79, 0.15);
}
.conv-title {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 1;
  text-align: left;
}
.conv-delete {
  background: transparent;
  border: 0;
  color: #81918b;
  font-size: 14px;
  padding: 2px 6px;
  margin-left: 6px;
  cursor: pointer;
  border-radius: 4px;
  transition: all 0.15s ease;
  display: flex;
  align-items: center;
  justify-content: center;
}
.conv-delete:hover {
  color: var(--danger);
  background: rgba(180, 61, 54, 0.15);
}



/* 流式输出时在末尾显示一个呼吸光标，让用户知道内容还在生成 */
.bubble.streaming::after {
  content: "▍";
  display: inline-block;
  margin-left: 1px;
  color: #12624F;
  animation: wenli-caret 1s steps(2, start) infinite;
}

@keyframes wenli-caret {
  0%, 49% { opacity: 1; }
  50%, 100% { opacity: 0; }
}

/* ---- 布局修复 ---- */
/* 1) 类选择器的 display 会盖过 [hidden] 属性，导致首页藏不掉、"回首页"看似无反应。
      用一条高优先级规则兜底：任何带 hidden 的元素一律隐藏。 */
[hidden] { display: none !important; }

/* 2) flex 子项默认 min-height:auto 会被内容撑高，使消息区不滚动、
      流式回答时越长越往下顶，遮住输入框和底部免责声明。
      min-height:0 让 flex:1 真正生效，overflow:auto 才能内部滚动。 */
.messages { min-height: 0; }

/* 移动端把对话壳高度改用动态视口单位，避免地址栏收起时底部被裁 */
@media (max-width: 800px) {
  .chat-shell:not([hidden]) { height: calc(100dvh - 72px); }
}

/* ==== 对话界面重构：Claude 式布局 ====
   进入对话后 body.in-chat 锁住页面滚动，
   整个视口 = 顶栏(固定) + 消息区(唯一滚动) + 输入区(钉底)。 */
body.in-chat { height: 100dvh; overflow: hidden; }
body.in-chat main { height: calc(100dvh - 73px); overflow: hidden; }

.chat-shell:not([hidden]) {
  display: grid !important;
  height: 100% !important;
  min-height: 0 !important;
  overflow: hidden;
}
.conversation {
  height: 100% !important;
  min-height: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden;
}
.conversation-head { flex: 0 0 auto; }
.messages {
  flex: 1 1 0 !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  padding: 24px 24px 12px;
  scroll-behavior: smooth;
}
.messages .message { max-width: 720px; margin-left: auto; margin-right: auto; }
.messages .message.student .bubble { margin-left: auto; max-width: 85%; width: fit-content; }
.messages .message.tutor .bubble { max-width: 100%; }

.composer {
  flex: 0 0 auto;
  margin: 0 auto 10px;
  width: min(768px, calc(100% - 32px));
}
.composer textarea {
  max-height: 200px;
  overflow-y: auto;
  line-height: 1.6;
}
.disclaimer { flex: 0 0 auto; margin: 0 0 10px; }

.chat-sidebar { min-height: 0; overflow: hidden; }

@media (max-width: 800px) {
  body.in-chat main { height: calc(100dvh - 73px); }
  .chat-shell:not([hidden]) { display: flex !important; flex-direction: column; }
  .messages { padding: 16px 12px 8px; }
  .composer { width: calc(100% - 16px); margin-bottom: 6px; }
}

/* ==== 图片消息 + 灯箱 ==== */
.message-images { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.message.student .message-images { justify-content: flex-end; }
.chat-img {
  width: 120px; height: 120px; object-fit: cover;
  border-radius: 12px; border: 1px solid var(--line);
  cursor: zoom-in; background: #f1f2ed;
}
#lightbox {
  display: none; position: fixed; inset: 0; z-index: 2000;
  background: rgba(10, 18, 15, .88);
  align-items: center; justify-content: center;
  cursor: zoom-out; padding: 24px;
}
#lightbox img { max-width: 96vw; max-height: 92vh; border-radius: 10px; }

/* ==== 移动端排版整顿 ==== */
@media (max-width: 800px) {
  .hero-copy h1 { font-size: 38px; letter-spacing: -.02em; }
  .hero-text { font-size: 15px; line-height: 1.8; }
  .topbar { height: 60px; padding: 0 14px; }
  body.in-chat main { height: calc(100dvh - 61px); }
  .brand { font-size: 17px; }
  .brand-logo { width: 28px; height: 28px; }
  .top-actions { gap: 4px; }
  .top-actions .text-button { padding: 8px 8px; font-size: 13px; }
  .button-small { padding: 8px 11px; font-size: 13px; }

  .conversation-head { padding: 10px 14px; }
  .conversation-head h2 { font-size: 14px; }
  .conversation-head p { display: none; }
  .mode-chip { display: none; }

  /* 覆盖桌面端的 720px 居中列，手机上贴边排 */
  .messages .message { max-width: 100%; }
  .messages .message.student .bubble { max-width: 88%; }
  .bubble { font-size: 14.5px; }
  .message .meta { font-size: 10px; }
  .chat-img { width: 96px; height: 96px; }

  .composer { padding: 10px; }
  .composer textarea { font-size: 16px; } /* iOS 低于 16px 聚焦会自动放大页面 */
  .disclaimer { font-size: 9px; margin-bottom: 6px; }
}

/* 对话头部的「新对话」按钮：手机上唯一的新对话入口，桌面上是快捷方式 */
.head-new-chat {
  border: 1px solid var(--line); background: #fff; color: var(--green);
  border-radius: 10px; padding: 7px 12px; font: inherit; font-size: 13px;
  font-weight: 700; cursor: pointer;
}

/* ==== 移动端抽屉式侧边栏 ====
   手机竖屏原本直接隐藏侧栏，导致历史对话、额度、学习诊断、账号入口全部够不着。
   改为从左侧滑出的抽屉，桌面端维持常驻不变。 */
.drawer-toggle {
  display: none;
  border: 1px solid var(--line);
  background: #fff;
  color: var(--ink);
  border-radius: 9px;
  width: 36px; height: 36px;
  font-size: 17px; line-height: 1;
  cursor: pointer;
  margin-right: 10px;
  flex: 0 0 auto;
}
.drawer-backdrop {
  display: none;
  position: fixed; inset: 0;
  background: rgba(10, 18, 15, .5);
  z-index: 40;
}

@media (max-width: 800px) {
  .drawer-toggle { display: block; }
  .conversation-head { display: flex; align-items: center; }

  /* 覆盖此前的 display:none，改为滑出面板 */
  .chat-sidebar {
    display: flex !important;
    position: fixed;
    top: 0; left: 0; bottom: 0;
    width: min(290px, 84vw);
    z-index: 50;
    transform: translateX(-100%);
    transition: transform .22s ease;
    overflow-y: auto;
    padding: 20px 18px;
    box-shadow: 4px 0 24px rgba(0, 0, 0, .18);
  }
  body.drawer-open .chat-sidebar { transform: translateX(0); }
  body.drawer-open .drawer-backdrop { display: block; }
  /* 抽屉打开时锁住背景滚动 */
  body.drawer-open { overflow: hidden; }

  .chat-sidebar .conv-list { max-height: none; }
}

/* 备案号：工信部要求所有页面可见且可跳转 */
footer .icp a { color: var(--muted); text-decoration: none; }
footer .icp a:hover { text-decoration: underline; }
@media (max-width: 800px) {
  footer { font-size: 10.5px; }
  footer .icp { width: 100%; }
}

/* ==== 导师回复的 Markdown 排版 ====
   气泡原本是 white-space:pre-wrap（纯文本换行），
   渲染成 HTML 后要改回 normal，否则标签间的换行会变成多余空行。 */
.message.tutor .bubble { white-space: normal; }
.message.tutor .bubble > :first-child { margin-top: 0; }
.message.tutor .bubble > :last-child { margin-bottom: 0; }

.bubble p { margin: 0 0 8px; }
.bubble .md-h {
  font-weight: 700; font-size: 14.5px;
  margin: 14px 0 6px; color: var(--ink);
}
.bubble ul, .bubble ol { margin: 6px 0 10px; padding-left: 22px; }
.bubble li { margin: 3px 0; line-height: 1.75; }
.bubble strong { font-weight: 700; }
.bubble em { font-style: italic; }

.bubble a { color: var(--green); text-decoration: underline; text-underline-offset: 2px; word-break: break-all; }
.message.student .bubble a { color: #cfe9dd; }

.bubble code {
  background: rgba(0,0,0,.06); padding: 2px 6px; border-radius: 5px;
  font-family: ui-monospace, Menlo, Consolas, monospace; font-size: .92em;
}
.bubble pre {
  background: #f1f2ed; border-radius: 10px; padding: 12px 14px;
  overflow-x: auto; margin: 8px 0;
}
.bubble pre code { background: none; padding: 0; font-size: 12.5px; line-height: 1.7; }

.bubble blockquote {
  margin: 8px 0; padding: 6px 12px;
  border-left: 3px solid var(--mint); color: var(--muted);
}
.bubble hr { border: 0; border-top: 1px solid var(--line); margin: 12px 0; }

/* AI 回复里的图片：限宽、可点击放大 */
.bubble .md-img {
  max-width: 100%; max-height: 320px;
  border-radius: 10px; margin: 8px 0;
  border: 1px solid var(--line); cursor: zoom-in; display: block;
}

@media (max-width: 800px) {
  .bubble .md-img { max-height: 240px; }
  .bubble pre { font-size: 12px; }
}

/* ==== 公式 ==== */
.bubble .katex { font-size: 1.05em; }
/* 长公式在手机上可横向滚动，不撑破气泡 */
.bubble .katex-display {
  margin: 10px 0; overflow-x: auto; overflow-y: hidden;
  padding: 2px 0;
}
.bubble .tex-raw { color: #b4643a; }

/* ==== 图片配图说明 ==== */
.md-figure { display: block; margin: 8px 0; }
.md-figcap {
  display: block; font-size: 11px; color: var(--muted);
  margin-top: 3px; text-align: center;
}
.message.student .md-figcap { color: #cfe9dd; }
.chat-img { cursor: zoom-in; }

/* 灯箱加一行操作提示，避免用户不知道怎么关 */
#lightbox::after {
  content: "点击任意位置关闭";
  position: absolute; bottom: 22px; left: 0; right: 0;
  text-align: center; color: rgba(255,255,255,.75); font-size: 12px;
}

/* 导师画的示意图。内容已在后端经白名单净化，此处只管排版。 */
.tutor-svg {
  margin: 12px 0;
  padding: 10px;
  background: #fff;
  border: 1px solid #dfe3dc;
  border-radius: 12px;
  text-align: center;
  overflow-x: auto;
}
.tutor-svg svg { max-width: 100%; height: auto; }

/* 常用符号快捷条。手机上切换输入法找 ² θ Δ 很痛苦，点一下省事得多。 */
.symbol-bar {
  display: flex;
  gap: 6px;
  overflow-x: auto;
  padding: 6px 2px 2px;
  margin-bottom: 2px;
  scrollbar-width: none;          /* 横向滚动条在手机上很丑 */
  -webkit-overflow-scrolling: touch;
}
.symbol-bar::-webkit-scrollbar { display: none; }
.symbol-bar button {
  flex: 0 0 auto;
  min-width: 34px;
  height: 30px;
  padding: 0 8px;
  border: 1px solid #dfe3dc;
  border-radius: 8px;
  background: #fff;
  color: #172520;
  font: 500 14px/1 "Times New Roman", "Songti SC", serif;
  cursor: pointer;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}
.symbol-bar button:active { background: #dceee7; border-color: #12624f; }
@media (hover: hover) {
  .symbol-bar button:hover { background: #f2f7f4; border-color: #12624f; }
}

/* 上下文超限提醒。刻意做得低调——它是提示，不是错误。 */
.context-hint {
  margin: 14px auto;
  padding: 9px 14px;
  max-width: 90%;
  border-radius: 10px;
  background: #fff8e6;
  border: 1px solid #f0dca8;
  color: #6b5015;
  font-size: 12.5px;
  line-height: 1.75;
  text-align: center;
}

/* ============================================================================
   视觉细化（2026-08-07）
   ----------------------------------------------------------------------------
   只调整观感，不改任何布局尺寸与组件结构。
   这一点在本项目里是硬约束：直答式条件是三臂设计的成分对照组，
   两组必须共用同一套界面，任何视觉改动都会同时作用于两组，
   因此改动本身不会引入组间差异——但前提是它确实同时作用于两组，
   故一切样式写在共用的 styles.css 里，不做任何条件分支。
   ========================================================================== */

/* 首屏背景：极淡的双色渐晕，给纸感底色一点纵深，不引入可见色块 */
.landing {
  background:
    radial-gradient(1100px 620px at 12% -10%, rgba(18, 98, 79, .055), transparent 62%),
    radial-gradient(900px 520px at 96% 8%, rgba(237, 184, 88, .07), transparent 58%);
}

/* 标题：原字号在窄屏易挤压，收一档并放开行距，读起来更从容 */
.hero-copy h1 { font-size: clamp(46px, 6vw, 78px); line-height: 1.08; }
.hero-text { font-size: 17px; }

/* 示例卡片：原本旋转 1.5° 略显随意，改为极轻微的抬起 + 更柔的投影 */
.hero-card {
  transform: rotate(.6deg) translateY(-2px);
  box-shadow: 0 30px 70px rgba(22, 39, 34, .13), 0 2px 8px rgba(22, 39, 34, .05);
  transition: transform .35s ease, box-shadow .35s ease;
}
.hero-card:hover { transform: rotate(0deg) translateY(-6px); }

/* 信任标签：加一点底色，从"描边文字"变成可辨识的信息块 */
.trust-row span {
  background: rgba(255, 255, 255, .72);
  border-color: rgba(23, 32, 30, .09);
  backdrop-filter: blur(2px);
}

/* 主按钮：按下时给一点位移反馈，长时间使用时手感更明确 */
.button-primary { transition: transform .16s ease, box-shadow .16s ease; }
.button-primary:hover { transform: translateY(-1px); box-shadow: 0 12px 30px rgba(18, 98, 79, .24); }
.button-primary:active { transform: translateY(0); box-shadow: 0 5px 14px rgba(18, 98, 79, .2); }

/* 消息气泡：略收圆角、加细边，长对话里更容易区分层次 */
.message.tutor .bubble { border: 1px solid rgba(23, 32, 30, .05); }
.message .bubble { box-shadow: 0 1px 2px rgba(22, 39, 34, .04); }

/* 输入区聚焦态：原本无反馈，学生不易确认焦点在哪 */
.composer:focus-within {
  border-color: rgba(18, 98, 79, .45);
  box-shadow: 0 10px 30px rgba(17, 43, 35, .1), 0 0 0 3px rgba(18, 98, 79, .08);
}

/* 键盘可达性：全站统一的可见焦点圈，此前缺失 */
:where(button, a, input, textarea, select):focus-visible {
  outline: 2px solid rgba(18, 98, 79, .55);
  outline-offset: 2px;
  border-radius: 8px;
}

/* 模式标签：与顶部条的分量匹配，不喧宾夺主 */
.mode-chip {
  background: var(--mint);
  color: var(--green);
  border-color: transparent;
  font-weight: 700;
}

/* 滚动条：默认样式在浅底上偏重 */
.messages::-webkit-scrollbar { width: 10px; }
.messages::-webkit-scrollbar-thumb {
  background: rgba(23, 32, 30, .14);
  border-radius: 999px;
  border: 3px solid #fff;
}
.messages::-webkit-scrollbar-thumb:hover { background: rgba(23, 32, 30, .22); }

/* 尊重系统的减少动效设置 */
@media (prefers-reduced-motion: reduce) {
  .hero-card, .button-primary { transition: none; }
  .hero-card:hover { transform: rotate(.6deg) translateY(-2px); }
}
/* 等待期的呼吸点。开了思考模式后首字要等十几秒，屏幕上必须有个东西在动，否则和卡死没有区别。 */
@keyframes wl-pulse{0%,80%,100%{opacity:.25;transform:scale(.8)}40%{opacity:1;transform:scale(1)}}
.thinking i{animation:wl-pulse 1.3s ease-in-out infinite}
.thinking i:nth-child(2){animation-delay:.18s}
.thinking i:nth-child(3){animation-delay:.36s}
.ai-notice{font-size:11px;color:#98a09d;line-height:1.7;flex-basis:100%;}
footer{flex-wrap:wrap;}
/* 落地页的「暂不开放」说明卡片 */
.notice-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:22px 24px;margin-top:30px;box-shadow:0 10px 30px rgba(17,43,35,.05)}
.notice-card p{margin:0 0 12px;font-size:14.5px;line-height:1.95;color:#3c4a45}
.notice-card p:last-child{margin-bottom:0}
.notice-card b{color:var(--green)}
.notice-card a{color:var(--green);font-weight:700}