/* 助手页“夜读”样子（夜间风格 C 轮）：照 design\夜间风格样品\夜读样品.html 的助手。颜色全用 style.css 的变量（A 轮）。
   文件夹标签、提示条上的颜色都和资料夹一样；小字的颜色往正文色里掺一点，深浅两种模式下对比度都够。 */
#assist.work-surface.assistant-surface { max-width:640px; background:none; padding:4px 0 24px; margin:6px auto 24px; border-radius:0; min-height:0; }
#assist .an-head { flex-direction:row; justify-content:space-between; align-items:center; gap:12px; padding-top:6px; margin:0; }
#assist .an-head h1 { margin:0; font-size:26px; font-weight:700; letter-spacing:-.4px; line-height:1.2; }
#assist .an-head .tog { flex:none; gap:6px; min-height:44px; padding:0 15px; border-radius:99px; font-size:13px; font-weight:600; color:var(--fg2); background:var(--card); box-shadow:inset 0 0 0 1px var(--line); }
#assist .an-head .tog svg { width:14px; height:14px; }
#assist .an-head .tog[aria-pressed=true] { background:var(--fg); color:var(--bg); box-shadow:none; }
/* 点“这次不记”：胶囊从描边慢慢变实心，输入框的虚线框跟着淡进来（以前两样都是一下子跳过去） */
#assist .an-head .tog { transition:background-color .3s cubic-bezier(.22,1,.36,1), color .3s cubic-bezier(.22,1,.36,1), box-shadow .3s cubic-bezier(.22,1,.36,1); }
@media(hover:hover) { #assist .an-head .tog:hover:not([aria-pressed=true]) { color:var(--fg); box-shadow:inset 0 0 0 1px var(--fg3); } }
#assist > .today, #assist > .review, #assist > .practice { margin-top:12px; }

/* 纸张舞台：三个虚线框和发光的相机 → 照片落成纸 → 一张张扫 */
.an-stage { position:relative; height:214px; margin-top:6px; }
.an-ghost, .an-paper { position:absolute; top:22px; width:34%; max-width:132px; aspect-ratio:.78; left:var(--x); border-radius:9px; }
.an-ghost { border:1.5px dashed var(--fg3); opacity:.55; transform:translateX(-50%) rotate(var(--r)); transition:opacity .4s cubic-bezier(.22,1,.36,1), transform .5s cubic-bezier(.32,.72,0,1); pointer-events:none; }
.an-stage:not([data-mode=empty]) .an-ghost { opacity:0; transform:translateX(-50%) rotate(var(--r)) scale(.9); }
#assist .an-stage .an-cam { position:absolute; left:50%; top:76px; width:60px; height:60px; margin-left:-30px; border-radius:50%; background:var(--btn); color:var(--on-accent); display:grid; place-items:center; z-index:2;
  box-shadow:0 0 0 9px color-mix(in srgb,var(--a2) 16%,transparent),0 10px 30px -6px var(--a2); transition:opacity .35s cubic-bezier(.22,1,.36,1), transform .45s cubic-bezier(.32,.72,0,1), visibility 0s; }
#assist .an-stage:not([data-mode=empty]) .an-cam { opacity:0; transform:scale(.6); visibility:hidden; transition-delay:0s,0s,.45s; }
.an-cam svg { width:26px; height:26px; pointer-events:none; }
.an-paper { background:var(--on-accent); padding:6px; box-shadow:var(--shadow),0 0 0 1px var(--line); overflow:hidden; opacity:0; pointer-events:none;
  transform:translateX(-50%) translateY(70px) scale(.7); transition:transform .6s cubic-bezier(.32,.72,0,1), opacity .4s cubic-bezier(.22,1,.36,1), box-shadow .4s cubic-bezier(.22,1,.36,1); }
.an-paper img { display:block; width:100%; height:100%; object-fit:cover; border-radius:5px; }
.an-paper.in { opacity:1; transform:translateX(-50%) rotate(var(--r)); }
.an-paper.reading { transform:translateX(-50%) translateY(-8px) rotate(var(--r)) scale(1.05); box-shadow:0 0 0 2px var(--a3),0 22px 40px -14px var(--a3); z-index:3; }
.an-scan { position:absolute; left:0; right:0; height:40%; top:-40%; background:linear-gradient(transparent,color-mix(in srgb,var(--a3) 45%,transparent),transparent); pointer-events:none; }
.an-paper.reading .an-scan { animation:an-scan 1.1s cubic-bezier(.22,1,.36,1) infinite; }
@keyframes an-scan { to { top:100%; } }
.an-more { position:absolute; right:10px; bottom:10px; padding:2px 8px; border-radius:99px; font:700 12px var(--font); background:var(--fg); color:var(--bg); }
.an-more:empty { display:none; }
.an-stat { position:absolute; left:0; bottom:4px; display:inline-flex; gap:6px; align-items:center; padding:6px 12px; border-radius:99px; background:var(--glass); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  box-shadow:inset 0 0 0 1px var(--line); font-size:12.5px; font-weight:600; color:color-mix(in srgb,var(--a3) 72%,var(--fg)); opacity:0; transform:translateY(6px); transition:opacity .35s cubic-bezier(.22,1,.36,1), transform .45s cubic-bezier(.32,.72,0,1); z-index:4; }
.an-stat.on { opacity:1; transform:none; }
.an-stat-icon { display:inline-grid; color:var(--a3); }
.an-stat svg { width:14px; height:14px; }
.an-stat.spin svg { animation:an-spin 1s linear infinite; }
@keyframes an-spin { to { transform:rotate(360deg); } }

/* 还没聊过时的引导 */
.an-intro h2 { margin:6px 0 4px; font-size:19px; font-weight:700; }
.an-intro p { margin:0; font-size:13.5px; line-height:1.6; color:var(--fg2); }
.an-intro .an-q { margin-top:20px; font-size:12.5px; }
.an-sug { display:grid; justify-items:start; gap:8px; margin-top:8px; }
.an-sug button { min-height:44px; padding:0 16px; border-radius:99px; font-size:14px; color:var(--fg); background:var(--card2); box-shadow:inset 0 0 0 1px var(--line); }
@media(hover:hover) { .an-sug button:hover { box-shadow:inset 0 0 0 1px var(--fg3); } }

/* 聊天：学生的话是右边渐变气泡；助手的话靠左、字稍粗，公式套小框 */
#assist .alog { min-height:0; gap:14px; }
#assist .log .bubble.ai { background:none; padding:2px 0; max-width:94%; border-radius:0; font-size:15.5px; font-weight:500; line-height:1.7; }
#assist .log .bubble.ai.safe { background:var(--card); padding:11px 15px; border-radius:18px; box-shadow:inset 3px 0 0 var(--a2); }
#assist .log .bubble.ai.typing { color:var(--fg2); font-weight:400; }
#assist .log .bubble.me { max-width:80%; padding:9px 15px; border-radius:20px 20px 6px 20px; background:var(--btn); color:var(--on-accent); font-weight:600; }
#assist .bubble.me .imgtag { color:inherit; }
.an-math { font:600 .94em var(--font); padding:1px 6px; margin:0 1px; border-radius:6px; background:var(--card2); box-shadow:inset 0 0 0 1px var(--line); color:var(--fg); white-space:nowrap; }
#assist .an-more-hint { align-self:flex-start; min-height:44px; margin:-10px 0 -6px; padding:0 2px; font-size:13px; font-weight:500; color:var(--fg2); background:none; }
@media(hover:hover) { #assist .an-more-hint:hover { color:var(--fg); } }

/* 读出来的东西：每条上面是文件夹标签，右边一条细线画出来；下面是内容和说明 */
#assist .changes.an-recs { align-self:stretch; max-width:none; margin:-4px 0 0; padding:0; background:none; border-radius:0; font-size:14px; }
#assist .changes.an-recs.enter { animation:none; }
#assist .an-recs > summary { position:relative; z-index:1; min-height:44px; font-size:12.5px; font-weight:600; color:var(--fg2); }
/* 只占按钮那么宽，靠右放在标题那一行；标题自己垫高一层，免得被下面的内容区盖住点不中 */
#assist .an-recs > .an-recs-top { display:flex; width:fit-content; margin:-44px 0 0 auto; align-self:flex-end; justify-self:end; }
#assist .an-rec { display:grid; grid-template-rows:1fr; grid-template-columns:minmax(0,1fr); justify-content:normal; align-items:stretch; padding:0; border:0; gap:0; transition:grid-template-rows .4s cubic-bezier(.32,.72,0,1), opacity .3s cubic-bezier(.22,1,.36,1); }
#assist .an-rec.leaving { grid-template-rows:0fr; opacity:0; }
.an-rec-in { min-height:0; overflow:hidden; }
.an-tag { display:flex; align-items:flex-end; margin-top:8px; }
.an-tag span { font-size:11px; font-weight:700; line-height:1.4; padding:3px 10px 2px; border-radius:7px 7px 0 0; color:color-mix(in srgb,var(--c) 66%,var(--fg)); background:color-mix(in srgb,var(--c) 18%,transparent); }
.an-tag::after { content:""; flex:1; height:1px; background:color-mix(in srgb,var(--c) 55%,transparent); transform-origin:left; }
.an-row { display:flex; gap:10px; align-items:center; padding:2px 0; }
.an-txt { flex:1; min-width:0; display:grid; gap:1px; padding:4px 0; }
.an-txt b { font-size:14.5px; font-weight:700; overflow-wrap:anywhere; }
.an-txt small { font-size:12px; color:var(--fg2); overflow-wrap:anywhere; }
#assist .an-act { flex:none; min-width:44px; min-height:44px; padding:0 4px; font-size:13px; font-weight:500; color:var(--fg3); background:none; }
#assist .an-act.warm { color:color-mix(in srgb,var(--warm) 82%,var(--fg)); font-weight:700; }
#assist .an-act.an-all { color:var(--fg2); font-weight:600; }
@media(hover:hover) { #assist .an-act:hover:not(:disabled) { color:var(--fg); } }
/* 新读出来的：一条条落下（每条隔 0.3 秒，高度平滑展开），标签右边的线跟着画出来 */
.an-recs.enter .an-rec { animation:an-drop .45s cubic-bezier(.32,.72,0,1) both; animation-delay:calc(var(--i) * .3s + .15s); }
.an-recs.enter .an-tag::after { animation:an-line .6s cubic-bezier(.32,.72,0,1) both; animation-delay:calc(var(--i) * .3s + .3s); }
@keyframes an-drop { from { grid-template-rows:0fr; opacity:0; } to { grid-template-rows:1fr; opacity:1; } }
@keyframes an-line { from { transform:scaleX(0); } to { transform:none; } }
/* 去核对的小框：高度平滑展开 */
.an-check { display:grid; grid-template-rows:0fr; opacity:0; visibility:hidden; transition:grid-template-rows .4s cubic-bezier(.32,.72,0,1), opacity .3s cubic-bezier(.22,1,.36,1), visibility 0s .4s; }
.an-check.open { grid-template-rows:1fr; opacity:1; visibility:visible; transition-delay:0s; }
.an-check > div { min-height:0; overflow:hidden; }
.an-check-box { display:grid; gap:10px; margin:2px 0 8px; padding:12px; border-radius:14px; font-size:13.5px; background:var(--card); box-shadow:inset 0 0 0 1px var(--line); }
.an-check-box p { margin:0; }
.an-check-box .field { width:100%; }
.an-check-box .stable { grid-template-columns:repeat(auto-fill,minmax(132px,1fr)); }
.an-btns { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
#assist .an-btns button { min-height:44px; padding:0 16px; border-radius:99px; font-size:13.5px; color:var(--fg); background:var(--card2); box-shadow:inset 0 0 0 1px var(--line); }
#assist .an-btns .an-pri { background:var(--btn); color:var(--on-accent); box-shadow:none; font-weight:600; }

/* 输入框：“说点什么”，右边圆形相机键；有字时换成渐变的发送箭头（两个图标交叉淡入，箭头转进来） */
#assist.assistant-surface .acomp { gap:8px; margin-inline:0; padding:10px 0 6px; border-radius:0; background:var(--bg); box-shadow:0 -14px 14px -12px var(--bg); outline:none; }
#assist.assistant-surface .acomp:has(textarea:focus), #assist.assistant-surface .acomp.nolog, #assist.assistant-surface .acomp.nolog:has(textarea:focus) { box-shadow:0 -14px 14px -12px var(--bg); outline:none; }
#assist .acomp .arow { display:flex; align-items:flex-end; gap:10px; }
#assist.assistant-surface .acomp textarea { flex:1; min-width:0; min-height:44px; padding:11px 18px; border-radius:22px; font-size:16px; line-height:1.4; color:var(--fg); background:var(--card2); box-shadow:inset 0 0 0 1px var(--line),var(--shadow); }
#assist.assistant-surface .acomp textarea:focus { box-shadow:inset 0 0 0 1.5px var(--a2),var(--shadow); }
#assist.assistant-surface .acomp textarea { outline:1.5px dashed transparent; outline-offset:-3px; transition:outline-color .3s cubic-bezier(.22,1,.36,1), box-shadow .3s cubic-bezier(.22,1,.36,1); }
#assist.assistant-surface .acomp.nolog textarea { outline-color:var(--fg3); }
#assist .acomp .aopts { padding:0 4px; }
/* 第 1.5 块的“一口气说”：输入框上面靠右的一个安静的入口 */
#assist .acomp #dump-open { margin-left:auto; padding:0 6px; font-size:13.5px; font-weight:600; color:var(--fg2); text-decoration:none; }
@media(hover:hover) { #assist .acomp #dump-open:hover { color:var(--fg); } }
.an-send { position:relative; flex:none; width:44px; height:44px; }
#assist .an-send .cam, #assist .an-send .sendb { position:absolute; inset:0; width:44px; height:44px; min-height:0; margin:0; padding:0; border-radius:50%; display:grid; place-items:center;
  transition:opacity .25s cubic-bezier(.22,1,.36,1), transform .35s cubic-bezier(.32,.72,0,1), background-color .28s, visibility 0s, filter .2s; }
#assist .an-send .cam { background:var(--card2); color:var(--fg); box-shadow:inset 0 0 0 1.5px var(--a2),0 0 16px -4px var(--a2); }
#assist .an-send .sendb { background:var(--btn); color:var(--on-accent); box-shadow:none; opacity:0; transform:rotate(-90deg) scale(.6); visibility:hidden; transition-delay:0s,0s,0s,.35s,0s; }
#assist .acomp.has .an-send .sendb { opacity:1; transform:none; visibility:visible; transition-delay:0s; }
#assist .acomp.has .an-send .sendb:disabled { opacity:.45; }
#assist .acomp.has .an-send .cam { opacity:0; transform:scale(.6); visibility:hidden; transition-delay:0s,0s,0s,.35s,0s; }
#assist .an-send svg { width:22px; height:22px; }
#assist .safe-line { margin-top:4px; color:var(--fg2); }

@media(max-width:760px) { #assist.work-surface.assistant-surface { padding:2px 0 20px; margin-top:0; } }
#assist .an-recs > .an-rec { width:100%; align-self:stretch; }
#assist .an-btns .an-drop { background:none; box-shadow:none; color:var(--fg2); padding:0 8px; }
/* 一口气说的确认单（第 1.5 块）：和读出来的结果同一套行，整行是一个 label，右边是勾选框 */
#assist .dump-group { margin:4px 0; }
#assist .dump-choice { display:block; min-height:0; padding:0; border-radius:8px; background:none; cursor:pointer; }
#assist .dump-choice + .dump-choice { margin-top:0; }
#assist .dump-choice:focus-within { outline:2px solid var(--a2); outline-offset:2px; }
#assist .dump-choice input { flex:none; width:22px; height:22px; margin:11px; accent-color:var(--a2); }