/* 网页学习版（2026-10-23）：照电脑版风格，按手机竖屏重排。
   首页＝窗前书桌；英语＝世界语言旅行局（皮面、纸面、黄铜）；上课＝线上手机页木框黑板（20261023-phone-board 同尺寸）。 */
:root {
  --ink:#122940; --ink2:rgba(18,41,64,.72); --ink3:rgba(18,41,64,.5);
  --navy:#0e2130; --gold:#a8854f; --cream:#f7f0de; --line:rgba(168,133,79,.38);
  --chalk:#F4F1E8; --chalk2:rgba(244,241,232,.72); --chalk3:rgba(244,241,232,.5); --chalkline:rgba(244,241,232,.3);
  --board:#1f2b27; --violet:#C9B6F2; --yellow:#F2D58A; --mint:#A8D5C2; --bad:#f0a79e;
  --serif:"Songti SC","STSong","Source Han Serif SC","Noto Serif SC","AIStudySerif",serif;
  --hand:"Kaiti SC","STKaiti","KaiTi","BiauKai","Songti SC","STSong","Noto Serif SC","AIStudySerif",serif;
  --font:-apple-system,"PingFang SC","Noto Sans CJK SC","Hiragino Sans GB","Source Han Sans SC","Noto Sans","Helvetica Neue",sans-serif;
  --brass:linear-gradient(135deg,#f5e0ab,#a8854f 35%,#5c401f 60%,#efd194);
  --safe-t:env(safe-area-inset-top); --safe-b:env(safe-area-inset-bottom);
}
* { box-sizing:border-box; }
html, body { margin:0; height:100%; }
@supports (height:100dvh) { html, body { height:100dvh; } }
body { font:16px/1.55 var(--font); color:var(--ink); background:#efe6d2; -webkit-text-size-adjust:100%; overflow:hidden; }
button { font-family:inherit; color:inherit; -webkit-tap-highlight-color:transparent; cursor:pointer; }
a { -webkit-tap-highlight-color:transparent; }
[hidden] { display:none !important; }
#app { height:100%; }
.screen { height:100%; overflow-y:auto; -webkit-overflow-scrolling:touch; overscroll-behavior:contain; }

/* ---------------- 首页：窗前书桌（home.png 上半裁成头图，课本封面裁成按钮） ---------------- */
.home { background:#d8b88f; min-height:100%; display:flex; flex-direction:column; }
.home .hero { position:relative; height:calc(58vw + var(--safe-t)); min-height:200px; background-color:#d3e4f1;
  background-image:var(--img-home); background-size:139.6% auto; background-position:0 var(--safe-t); background-repeat:no-repeat; }
.home .hero::after { content:""; position:absolute; inset:auto 0 0 0; height:44%; background:linear-gradient(rgba(216,184,143,0),rgba(216,184,143,.85) 45%,#d8b88f 75%); }
/* 字的位置照电脑首页（1536 宽画布里的坐标按裁切换算）：品牌字在画好的书本标志右边，标题压在画好的蓝色笔画上 */
.home .brand { position:absolute; left:13.2vw; top:calc(2.2vw + var(--safe-t)); color:var(--ink); z-index:1; }
.home .brand b { display:block; font-size:max(15px,3.1vw); letter-spacing:1px; line-height:1.15; }
.home .brand span { display:block; font-family:var(--serif); font-size:max(10px,1.9vw); letter-spacing:2px; }
.home h1 { position:absolute; left:44vw; right:2vw; top:calc(7.4vw + var(--safe-t)); margin:0; font-family:var(--hand); font-weight:700; white-space:nowrap;
  font-size:5.5vw; color:var(--ink); text-shadow:0 1px 0 rgba(255,255,255,.55); z-index:1; }
.home .ask { position:absolute; left:0; right:0; bottom:10px; z-index:1; text-align:center; font-family:var(--hand); font-size:15px; color:rgba(40,25,10,.8); }
.desk { position:relative; flex:1; padding:4px 12px calc(28px + var(--safe-b));
  background:linear-gradient(180deg,#d8b88f,#cfa877 40%,#c79c69); }
.desk::before { content:""; position:absolute; inset:0; opacity:.22; background:repeating-linear-gradient(2deg,transparent 0 9px,rgba(120,80,40,.35) 9px 10px,transparent 10px 23px); pointer-events:none; }
.books { position:relative; display:grid; grid-template-columns:repeat(3,1fr); gap:12px 10px; }
/* 立体书：封面＋左侧书脊＋底部书页厚度＋桌面投影，整体略向后倒（像平放在桌上），六本同一尺寸 */
.books { gap:18px 12px; padding:6px 2px 4px; }
.book { position:relative; display:block; aspect-ratio:152/181; border:0; padding:0; background:none; text-align:center;
  transform:perspective(700px) rotateX(16deg); transform-origin:50% 100%; }
.book:active { transform:perspective(700px) rotateX(16deg) translateY(2px); }
.book::before { content:""; position:absolute; left:4%; right:-3%; bottom:-7%; height:14%; border-radius:50%;
  background:radial-gradient(ellipse at center, rgba(60,35,12,.45), rgba(60,35,12,0) 70%); filter:blur(2px); }
.book .cover { position:absolute; left:0; right:0; top:0; height:93.5%; overflow:hidden; border-radius:3px 7px 7px 3px;
  background-image:var(--img-home); background-repeat:no-repeat; background-color:#e9e2d2;
  box-shadow:inset 7px 0 6px -3px rgba(0,0,0,.35), inset 9px 0 0 -6px rgba(255,255,255,.35), inset -1px -1px 0 rgba(0,0,0,.12), 0 1px 0 rgba(0,0,0,.25); }
.book .cover::after { content:""; position:absolute; inset:0; border-radius:inherit; background:linear-gradient(115deg, rgba(255,255,255,.22), rgba(255,255,255,0) 40%, rgba(0,0,0,.06)); pointer-events:none; }
.book .pages { position:absolute; left:3px; right:2px; bottom:0; height:7%; border-radius:0 0 5px 3px;
  background:repeating-linear-gradient(180deg,#fbf8f0 0 1.5px,#d9d0bf 1.5px 2.5px); box-shadow:0 2px 3px rgba(60,35,12,.35), inset 0 -1px 0 rgba(0,0,0,.15); }
.book .t { position:absolute; left:0; right:0; top:9%; z-index:1; font-family:var(--hand); font-weight:700; font-size:clamp(20px,6.4vw,27px); letter-spacing:5px; color:var(--ink);
  text-shadow:0 0 6px rgba(255,255,255,.7); }
.book .c { position:absolute; right:9%; bottom:8%; z-index:1; font-family:var(--hand); font-size:clamp(9.5px,2.7vw,11.5px); line-height:1.3; text-align:left; white-space:pre-line; color:var(--ink);
  text-shadow:0 0 4px rgba(255,255,255,.8); }
.book.dark .t, .book.dark .c { color:#fff; text-shadow:0 1px 3px rgba(0,0,0,.6); }
.home .foot { position:relative; margin:18px 4px 0; text-align:center; font-family:var(--serif); font-size:13px; color:rgba(60,35,10,.72); }

/* ---------------- 科目页通用：顶栏（返回＝回上一级）＋菜单 ---------------- */
.topbar { position:sticky; top:0; z-index:5; display:flex; align-items:center; gap:6px; padding:calc(8px + var(--safe-t)) 10px 8px; min-height:52px; }
.tb { flex:none; display:flex; align-items:center; gap:2px; min-width:44px; height:36px; padding:0 8px; border:0; background:transparent; font-size:15px; }
.tb svg { width:20px; height:20px; }
.topbar .tb { flex:none; display:flex; align-items:center; gap:2px; min-width:44px; height:36px; padding:0 8px; border:0; background:transparent; font-size:15px; }
.topbar .tb svg { width:20px; height:20px; }
.topbar .ttl { flex:1; min-width:0; text-align:center; font-family:var(--serif); font-weight:700; font-size:17px; letter-spacing:1px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* ---------------- 英语：世界语言旅行局 ---------------- */
.en { background-color:#f4ebdd; background-image:var(--img-m-en-paper); background-size:430px 430px; color:var(--ink); font-family:var(--serif); min-height:100%; }
.en .topbar { background-color:var(--navy); background-image:var(--img-leather); background-size:205px auto; color:var(--cream);
  box-shadow:0 2px 8px rgba(0,0,0,.25); border-bottom:1px solid #b8955a; }
.en .topbar .tb { color:var(--cream); }
.en .pad { padding:12px 12px calc(28px + var(--safe-b)); }
.en-head { position:relative; display:flex; align-items:flex-end; min-height:96px; margin:0 -12px 12px; padding:14px 16px 12px;
  background-image:var(--strip, none); background-size:cover; background-position:right center; border-bottom:1px solid var(--line); }
.en-head.long { background-size:auto 100%; background-position:0 50%; background-repeat:no-repeat; }
.en-head.long::after { content:""; position:absolute; top:0; bottom:0; right:0; width:42%; background:linear-gradient(90deg,rgba(239,229,207,0),#efe5cf 30%); }
.en-head::before { content:""; position:absolute; inset:0; background:linear-gradient(90deg, rgba(247,240,222,.96) 0%, rgba(247,240,222,.85) 55%, rgba(247,240,222,0) 100%); }
.en-head > * { position:relative; z-index:1; }
.en-head h2 { margin:0; font-size:23px; font-weight:800; letter-spacing:1px; line-height:1.25; }
.en-head p { margin:4px 0 0; font-size:13.5px; color:var(--ink2); }
.plate { position:relative; margin:0 0 14px; padding:14px 12px 12px; border-radius:10px; background:rgba(250,245,232,.92);
  background-image:var(--img-m-en-paper); background-size:430px 430px; border:1px solid rgba(168,133,79,.55);
  box-shadow:0 3px 6px rgba(14,33,48,.12), inset 0 0 0 3px rgba(255,255,255,.35); }
.plate::before, .plate::after { content:""; position:absolute; width:16px; height:16px; border:3px solid #9c7a45; pointer-events:none; }
.plate::before { left:3px; top:3px; border-right:0; border-bottom:0; border-top-left-radius:7px; }
.plate::after { right:3px; bottom:3px; border-left:0; border-top:0; border-bottom-right-radius:7px; }
.plate h3 { margin:0 0 10px; font-size:18px; font-weight:800; display:flex; align-items:baseline; gap:8px; }
.plate h3 svg { flex:none; width:19px; height:19px; align-self:center; }
.plate h3 small { margin-left:auto; font-size:12px; font-weight:400; color:var(--ink3); }
.plate .desc { margin:-4px 0 10px; font-size:13px; color:var(--ink2); }
.lbtn { display:flex; align-items:center; justify-content:center; gap:6px; width:100%; min-height:48px; padding:0 18px; border-radius:10px;
  color:var(--cream); font-family:var(--serif); font-size:17px; font-weight:700; letter-spacing:1px; text-decoration:none;
  background-color:var(--navy); background-image:linear-gradient(rgba(255,255,255,.08),rgba(0,0,0,.18)), var(--img-leather); background-size:auto, 205px auto;
  border:1px solid #c5a46a; box-shadow:0 4px 8px rgba(14,33,48,.3), inset 0 1px 0 rgba(255,235,190,.25); }
.lbtn:active { opacity:.82; }
.lbtn.small { width:auto; min-height:38px; font-size:14.5px; padding:0 14px; }
.lbtn.off { opacity:.45; }
.tiles { display:grid; grid-template-columns:repeat(2,1fr); gap:9px; }
.tiles.three { grid-template-columns:repeat(3,1fr); }
.tiles.four { grid-template-columns:repeat(2,1fr); }   /* 单词、长句页四格（10-26 加记住率）：手机上两行两列 */
.tile { padding:10px 10px 9px; border-radius:9px; background:rgba(255,252,243,.88); border:1px solid rgba(168,133,79,.32); box-shadow:0 2px 4px rgba(14,33,48,.08); min-width:0; }
.tile .k { display:flex; align-items:center; gap:6px; font-size:12.5px; color:var(--ink2); }
.tile .k svg { flex:none; width:17px; height:17px; color:var(--ink); }
.tile .v { margin-top:3px; font-size:21px; font-weight:800; line-height:1.25; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.tile .s { margin-top:1px; font-size:11.5px; color:var(--ink3); }
.tiles.center .tile { text-align:center; } .tiles.center .tile .k { justify-content:center; }
.days { display:flex; gap:8px; overflow-x:auto; padding-bottom:4px; margin:0 -2px; scroll-snap-type:x mandatory; }
.day { flex:none; width:78px; scroll-snap-align:start; text-align:center; padding:10px 4px; border-radius:9px; background:rgba(255,252,243,.88); border:1px solid rgba(168,133,79,.32); font-size:12.5px; line-height:1.6; }
.day b { display:block; font-size:15px; }
.search { display:flex; gap:8px; margin-bottom:10px; }
.search input { flex:1; min-width:0; height:38px; border-radius:19px; border:1px solid rgba(168,133,79,.55); background:rgba(255,252,243,.9); padding:0 14px; font:15px var(--serif); color:var(--ink); }
.search select { flex:none; height:38px; border-radius:10px; border:1px solid rgba(168,133,79,.55); background:rgba(255,252,243,.9); font:14px var(--serif); color:var(--ink); padding:0 8px; }
.letters { display:grid; grid-template-columns:repeat(9,1fr); gap:5px; margin-bottom:10px; }
.letters button { height:30px; border-radius:6px; border:1px solid rgba(168,133,79,.35); background:rgba(255,252,243,.75); font:13px var(--serif); color:var(--ink2); padding:0; }
.letters button[aria-pressed="true"] { background:var(--navy); color:var(--cream); border-color:#c5a46a; }
.empty { text-align:center; padding:18px 8px; color:var(--ink2); font-size:13.5px; }
.empty svg { width:40px; height:40px; color:var(--ink); }
.empty b { display:block; margin:6px 0 2px; font-size:15px; color:var(--ink); }
.list { display:flex; flex-direction:column; }
.row { display:flex; align-items:center; gap:8px; min-height:46px; padding:8px 2px; border-bottom:1px solid rgba(168,133,79,.25); font-size:14.5px; text-align:left; background:transparent; border-left:0; border-right:0; border-top:0; width:100%; }
.row:last-child { border-bottom:0; }
.row .m { flex:1; min-width:0; }
.row .m .s { display:block; font-size:12px; color:var(--ink3); }
.row .r { flex:none; font-size:13px; color:var(--ink2); }
.row .chev { flex:none; width:16px; height:16px; color:var(--ink3); }
.bars { display:grid; grid-template-columns:auto 1fr auto; gap:6px 8px; align-items:center; font-size:12.5px; }
.bar { height:8px; border-radius:4px; background:rgba(18,41,64,.1); overflow:hidden; }
.bar i { display:block; height:100%; background:linear-gradient(90deg,#1e3a55,#3f6b8c); border-radius:4px; }
.tray { display:flex; align-items:center; gap:10px; }
.tray .pic { flex:none; width:118px; height:58px; background:var(--img-tray); background-size:cover; background-position:center; border-radius:6px; }
.tray .tx { flex:1; min-width:0; font-size:16px; font-weight:800; }
.tray .tx small { display:block; font-size:12.5px; font-weight:400; color:var(--ink2); margin-top:2px; }
.seg { display:inline-flex; padding:3px; border-radius:999px; background:rgba(18,41,64,.08); margin-left:auto; }
.seg button { border:0; background:transparent; border-radius:999px; padding:4px 12px; font:13px var(--serif); color:var(--ink2); }
.seg button[aria-pressed="true"] { background:var(--navy); color:var(--cream); }
.folders { display:flex; flex-direction:column; gap:10px; }
.folder { position:relative; display:flex; align-items:center; gap:12px; width:100%; min-height:70px; padding:16px 14px 10px; text-align:left;
  border:0; border-top:3px solid #1d3550; border-left:3px solid #1d3550; border-radius:9px; background:rgba(255,251,240,.95);
  box-shadow:0 3px 6px rgba(14,33,48,.18), inset 0 0 0 1px rgba(168,133,79,.3); font-family:var(--serif); }
.folder::before { content:""; position:absolute; left:-3px; top:-8px; width:46px; height:18px; border-radius:6px 10px 0 0; background:linear-gradient(#d9c08f,#b8955a); box-shadow:0 1px 2px rgba(0,0,0,.25); }
.folder .no { flex:none; font-size:15px; color:var(--ink2); width:22px; }
.folder .nm { flex:1; font-size:17px; font-weight:800; }
.folder .nm small { display:block; font-size:12.5px; font-weight:400; color:var(--ink2); }
.folder .chev { width:16px; height:16px; color:var(--ink3); }
.banner { position:relative; height:150px; margin:0 -2px 12px; border-radius:8px; overflow:hidden;
  background:var(--img-m-en-practice-banner) center / cover no-repeat; }
.banner .paper { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:58%; padding:10px 10px 12px; text-align:center;
  background:rgba(250,244,228,.94); border-radius:6px; box-shadow:0 3px 8px rgba(0,0,0,.2); }
.banner .paper b { display:block; font-size:18px; }
.banner .paper span { display:block; font-size:12px; color:var(--ink2); margin:2px 0 8px; }
.foot-stats { display:grid; grid-template-columns:repeat(2,1fr); gap:6px; font-size:13px; color:var(--ink2); border-top:1px solid rgba(168,133,79,.35); padding-top:10px; }
.warn { margin-top:8px; font-size:13px; color:#c46a1c; }
.note { margin:6px 2px 0; font-size:12px; color:var(--ink3); text-align:center; }

/* 英语菜单（电脑端左边栏搬成整页） */
.en-menu { min-height:100%; display:flex; flex-direction:column; background-color:var(--navy); background-image:var(--img-leather); background-size:205px auto; color:var(--cream);
  padding:calc(8px + var(--safe-t)) 14px calc(18px + var(--safe-b)); }
.en-menu .tbrow { display:flex; align-items:center; }
.en-menu .tbrow .tb { color:var(--cream); }
.en-menu .seal { text-align:center; margin:2px 0 14px; }
.en-menu .seal i { display:block; width:170px; height:102px; margin:0 auto; background:var(--img-logo); background-size:contain; background-repeat:no-repeat; background-position:center; -webkit-mask-image:radial-gradient(ellipse at center,#000 55%,transparent 72%); mask-image:radial-gradient(ellipse at center,#000 55%,transparent 72%); }
.en-menu .seal b { display:block; font-size:22px; letter-spacing:4px; font-family:var(--serif); color:#e9d3a2; }
.en-menu .seal span { display:block; font-size:12px; letter-spacing:4px; color:#d4bb87; }
.en-menu .homebtn { display:flex; align-items:center; justify-content:center; gap:10px; height:56px; border-radius:10px; border:1px solid #c5a46a;
  background:rgba(0,0,0,.18); font:700 19px var(--serif); color:var(--cream); margin-bottom:14px; }
.en-menu .homebtn svg { width:24px; height:24px; }
.en-menu h4 { margin:4px 6px 6px; padding-top:12px; border-top:1px solid rgba(197,164,106,.4); font:700 18px var(--serif); color:#efe3c8; }
.en-menu .item { display:flex; align-items:center; gap:14px; width:100%; height:54px; padding:0 14px; border:0; border-radius:10px; background:transparent;
  font:500 19px var(--serif); color:var(--cream); text-align:left; }
.en-menu .item svg { width:24px; height:24px; flex:none; }
.en-menu .item .cnt { margin-left:auto; font-size:13px; color:#d4bb87; }
.en-menu .item:active { background:rgba(247,240,222,.12); }
.en-menu .item.sep { margin-top:8px; }
.en-menu .compass { margin-top:auto; padding-top:18px; border-top:1px solid rgba(197,164,106,.4); text-align:center; }
.en-menu .compass i { display:block; width:150px; height:123px; margin:0 auto; background:var(--img-compass); background-size:contain; background-repeat:no-repeat; background-position:center; opacity:.95; -webkit-mask-image:radial-gradient(ellipse at center,#000 58%,transparent 74%); mask-image:radial-gradient(ellipse at center,#000 58%,transparent 74%); }
.en-menu .compass span { display:block; font:15px var(--serif); letter-spacing:5px; color:#d4bb87; margin-top:4px; }

/* 其他科目（下一批做） */
.soon { min-height:100%; display:flex; flex-direction:column; background:var(--cream); }
.soon .topbar { background:#fff; border-bottom:1px solid #e5dccb; }
.soon .msg { margin:auto; padding:24px; text-align:center; font-family:var(--serif); color:var(--ink2); }
.soon .msg b { display:block; font-size:22px; color:var(--ink); margin-bottom:6px; }

/* ---------------- 上课黑板（线上手机页 20261023-phone-board 同款木框、同尺寸输入栏） ---------------- */
.view { height:100%; display:flex; flex-direction:column; width:100%; max-width:560px; margin:0 auto; color:var(--chalk);
  padding:calc(4px + var(--safe-t)) env(safe-area-inset-right) calc(4px + var(--safe-b)) env(safe-area-inset-left);
  background:radial-gradient(ellipse at 50% 0%,#3a2c20 0%,#2a2019 70%); }
.classroom { background:#2a2019; }
.wood { flex:1; min-height:0; padding:6px; border-radius:14px; display:flex;
  background:repeating-linear-gradient(92deg,#6b4423 0 7px,#7a4f2c 7px 10px,#5d3b1e 10px 17px,#744a28 17px 19px,#654122 19px 27px);
  box-shadow:0 8px 20px rgba(0,0,0,.45), inset 0 0 0 1px rgba(255,220,170,.18), inset 0 2px 3px rgba(255,230,190,.25); }
.board { position:relative; flex:1; min-width:0; min-height:0; display:flex; flex-direction:column; border-radius:7px; overflow:hidden;
  background:radial-gradient(ellipse at 30% 0%,#2b3b35 0%,var(--board) 60%,#18221f 100%);
  box-shadow:inset 0 0 26px rgba(0,0,0,.6), inset 0 0 0 2px rgba(0,0,0,.35); }
.tools { flex:none; display:flex; align-items:center; gap:6px; padding:5px 6px 4px 4px; background:rgba(0,0,0,.2); border-bottom:1px solid rgba(244,241,232,.14); }
.tools .ic { flex:none; width:36px; height:34px; border:0; background:transparent; color:rgba(244,241,232,.7); display:flex; align-items:center; justify-content:center; border-radius:8px; padding:0; }
.tools .ic svg { width:19px; height:19px; }
.tools .ic:active, .tools .tx:active { background:rgba(244,241,232,.1); }
.tools .ic:disabled { opacity:.3; }
.tools .tx { flex:none; height:30px; display:flex; align-items:center; gap:4px; padding:0 9px; border-radius:15px; border:1px solid rgba(244,241,232,.32); background:rgba(244,241,232,.04); color:var(--chalk2); font-size:13px; }
.tools .tx svg { width:14px; height:14px; }
.tools .sp { flex:1; }
.pin { position:relative; flex:none; max-height:40%; overflow-y:auto; padding:8px 12px 10px; border-bottom:1px dashed rgba(244,241,232,.28); background:rgba(0,0,0,.14); }
.pin .lab { font-size:12.5px; color:var(--chalk3); margin-bottom:2px; }
.pin .word { font-size:26px; font-weight:700; color:#7cc4e8; line-height:1.25; }
.pin .q { color:#fff; font-size:17px; font-weight:600; line-height:1.55; overflow-wrap:anywhere; }
.pin .ask { margin-top:3px; color:var(--chalk2); font-size:14.5px; }
.pin .opts { margin-top:4px; display:grid; grid-template-columns:1fr 1fr; gap:2px 12px; color:#fff; font-size:16px; }
.pin .opts span[aria-pressed="true"] { outline:2px solid currentColor; outline-offset:2px; border-radius:4px; }   /* 多选题点上的选项（家长 10-27） */
.pin .kb-multi { margin-top:8px; padding:0 18px; }
.pin .me { margin:8px 0 0; }
.flow { position:relative; flex:1; min-height:0; overflow-y:auto; -webkit-overflow-scrolling:touch; padding:10px 12px 14px; font-size:16.5px; line-height:1.7; overscroll-behavior:contain; }
.ln { margin:7px 0; color:var(--chalk); overflow-wrap:anywhere; line-height:1.7; animation:fadein .15s ease-out; }
.ln .em { color:var(--violet); font-weight:700; }
.ln.answer { color:var(--yellow); font-weight:600; }
.ln .ans, .kb-board .ln .ans, .kb-board .ln .ans .em { color:var(--yellow); font-weight:600; }   /* 答案那一截（家长 10-23：讲解白字，只有答案用答案色） */
.ln .now { text-decoration:underline; text-decoration-color:rgba(242,213,138,.9); text-decoration-thickness:1.5px; text-underline-offset:4px; }
.ln.dim { opacity:.55; }
.me { display:flex; gap:8px; align-items:flex-start; margin:12px 0 6px; }
.me .tag { flex:none; background:var(--mint); color:#17302a; font-size:13px; font-weight:700; border-radius:7px; padding:1px 8px; line-height:1.6; margin-top:2px; }
.me .say { flex:1; min-width:0; color:#cfe0d8; overflow-wrap:anywhere; }
.think { color:rgba(244,241,232,.6); font-size:15px; margin:8px 0; }
.divide { height:0; border-top:1px solid rgba(244,241,232,.25); margin:14px 0 4px; }
@keyframes fadein { from { opacity:0; } }   /* 只写起点：淡入到这一行本来的透明度（“未念变淡”的行淡入到 .55），不先全亮一下（家长 10-23“不要闪”） */
.dock { flex:none; border-top:1px dashed rgba(244,241,232,.28); background:rgba(0,0,0,.16); }
.composer { display:flex; align-items:flex-end; gap:8px; padding:8px 6px; }
.cbtn { flex:none; width:44px; height:44px; border-radius:50%; border:1px solid rgba(244,241,232,.7); background:rgba(244,241,232,.04); color:var(--chalk);
  display:flex; align-items:center; justify-content:center; padding:0; }
.cbtn svg { width:22px; height:22px; }
.cbtn:active { background:rgba(244,241,232,.14); }
.cbtn.go:not(:disabled) { border-color:var(--chalk); background:rgba(244,241,232,.12); }
.cbtn:disabled { opacity:.38; }
.ask-in { flex:1; min-width:0; resize:none; border:1px solid rgba(244,241,232,.45); border-radius:18px; padding:10px 14px; font:inherit; font-size:16px; line-height:1.4;
  background:rgba(0,0,0,.2); color:var(--chalk); height:44px; max-height:102px; overflow-y:hidden; outline:none; }
.ask-in::placeholder { color:var(--chalk3); }
.ask-in:focus { border-color:rgba(244,241,232,.65); }
/* 查看对话（盖在黑板上） */
.history { position:absolute; inset:0; z-index:3; display:flex; flex-direction:column; background:radial-gradient(ellipse at 30% 0%,#2b3b35 0%,var(--board) 60%,#18221f 100%); }
.history .hd { flex:none; display:flex; align-items:center; gap:6px; padding:6px 6px 6px 12px; border-bottom:1px dashed rgba(244,241,232,.28); background:rgba(0,0,0,.14); font-family:var(--hand); font-size:19px; font-weight:700; }
.history .hd span { flex:1; }
.history .bd { flex:1; overflow-y:auto; padding:6px 12px 16px; }
.history .item { padding:10px 0; border-bottom:1px solid rgba(244,241,232,.14); }
.history .item .q { font-weight:600; color:#fff; }
.history .item .r { font-size:13.5px; color:var(--chalk3); margin-top:2px; }
.history .item .r.t { color:var(--chalk2); white-space:pre-line; }   /* G16：老师的话 */
.toast { position:fixed; left:50%; bottom:calc(90px + var(--safe-b)); transform:translateX(-50%); z-index:30; background:rgba(20,30,26,.92); color:#fff; padding:8px 16px; border-radius:18px; font-size:14px; pointer-events:none; }
/* 26（家长 10-30）：有新版本时的一句话＋刷新按钮 */
.newbuild { position:fixed; left:50%; bottom:calc(90px + var(--safe-b)); transform:translateX(-50%); z-index:31; display:flex; align-items:center; gap:10px; white-space:nowrap;
  background:rgba(20,30,26,.94); color:#fff; padding:6px 6px 6px 16px; border-radius:20px; font-size:14px; }
.newbuild button { border:0; border-radius:14px; padding:6px 14px; background:#fff; color:#14201a; font-size:14px; font-weight:600; }
/* 首页两个入口（家长 2026-10-23：答疑解惑、上传错题，不分科目） */
.entries { position:relative; display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:16px; }
.entry { display:flex; align-items:center; gap:10px; min-height:66px; padding:10px 12px; border-radius:10px; text-align:left; text-decoration:none; color:var(--ink);
  background:linear-gradient(160deg,#fbf7ec,#f1e7d1); border:1px solid rgba(120,85,40,.35); box-shadow:0 5px 10px rgba(60,35,10,.28), inset 0 0 0 3px rgba(255,255,255,.4); }
.entry:active { transform:translateY(1px); }
.entry .ei { flex:none; width:38px; height:38px; border-radius:50%; display:flex; align-items:center; justify-content:center; border:1.5px solid currentColor; }
.entry .ei svg { width:21px; height:21px; }
.entry.qa .ei { color:#5b4a9c; } .entry.up .ei { color:#8a6420; }
.entry b { display:block; font-family:var(--hand); font-size:19px; letter-spacing:1px; line-height:1.25; }
.entry small { display:block; font-size:11.5px; color:var(--ink2); line-height:1.35; }
/* 手机首页设计图版（Codex 竖排设计图做底，字和按钮是网页元素） */
.mhome { min-height:100%; padding-bottom:calc(16px + var(--safe-b));
  background-color:#cca682;
  background-image:repeating-linear-gradient(178.5deg, rgba(120,80,45,0) 0 11px, rgba(120,80,45,.07) 11px 12px, rgba(255,240,215,.05) 12px 19px, rgba(120,80,45,0) 19px 27px),
    linear-gradient(#cca682,#c79f78); }
.mhome .motto { margin:10px 0 0; text-align:center; font-family:var(--hand); font-size:15px; color:rgba(60,38,16,.78); }
.mhome .art { position:relative; width:100%; aspect-ratio:1024/1536; background-image:var(--img-m-home); background-size:100% 100%; }
.mhome .brand { position:absolute; left:4.5%; top:calc(2.2% + var(--safe-t)); color:var(--ink); text-shadow:0 0 8px rgba(255,255,255,.85); }
.mhome .brand b { display:block; font-size:max(17px,4.6vw); letter-spacing:1px; line-height:1.15; }
.mhome .brand span { display:block; font-family:var(--serif); font-size:max(11px,2.9vw); letter-spacing:3px; }
.mhome h1 { position:absolute; left:0; right:0; top:calc(8.2% + var(--safe-t)); margin:0; text-align:center; font-family:var(--hand); font-weight:700;
  font-size:7.2vw; color:var(--ink); text-shadow:0 0 10px rgba(255,255,255,.9), 0 0 2px rgba(255,255,255,.9); }
.mhome .mbook { position:absolute; border:0; padding:0; background:transparent; border-radius:8px; }
.mhome .mbook:active { background:rgba(255,255,255,.18); }
.mhome .mcard { position:absolute; display:flex; align-items:center; gap:2vw; padding:0 2.5%; white-space:nowrap; overflow:hidden; color:var(--ink); text-decoration:none; border:0; background:transparent; text-align:left; border-radius:6px; }
.mhome .mcard:active { background:rgba(120,85,40,.1); }
.mhome .mcard .ei { flex:none; width:8.6vw; height:8.6vw; max-width:40px; max-height:40px; border-radius:50%; display:flex; align-items:center; justify-content:center; border:1.5px solid currentColor; }
.mhome .mcard .ei svg { width:55%; height:55%; }
.mhome .mcard.qa .ei { color:#5b4a9c; } .mhome .mcard.up .ei { color:#8a6420; }
.mhome .mcard b { display:block; font-family:var(--hand); font-size:min(4.1vw,19px); letter-spacing:1px; line-height:1.25; }
.mhome .mcard small { display:block; font-size:min(2.45vw,12px); letter-spacing:0; color:var(--ink2); line-height:1.35; }
.mhome .art::after { content:""; position:absolute; left:0; right:0; bottom:0; height:4%; background:linear-gradient(rgba(204,166,130,0),#cca682); pointer-events:none; }
/* 整屏设计图页（Codex 按电脑版画的手机竖版）：图按 cover 铺满屏幕居中裁，字和按钮是网页元素、按图的比例放在“舞台”上 */
.dpage { position:relative; height:100%; overflow:hidden; background:var(--sky, #cfe2f2); }
/* 屏幕特别长时图上方露出的部分：用同一张图放大模糊垫底，接缝处渐隐，看起来是同一片天空 */
.dpage::before { content:""; position:absolute; inset:-30px; background-image:var(--plate); background-size:cover; background-position:50% 0; filter:blur(22px) saturate(1.1); }
.dpage .stage { -webkit-mask-image:linear-gradient(transparent 0, #000 7%); mask-image:linear-gradient(transparent 0, #000 7%); }
@media (min-aspect-ratio: 941/1672) { .dpage .stage { -webkit-mask-image:none; mask-image:none; } }
/* 屏幕比图更长时：最多左右裁 3%，再长就让图贴底、上面用天空色接上（不把书裁掉） */
.dpage .stage { position:absolute; left:50%; bottom:0; transform:translateX(-50%);
  --sw:min(106vw, max(100vw, calc(100dvh * var(--iw) / var(--ih)))); width:var(--sw); aspect-ratio:var(--iw) / var(--ih);
  background-image:var(--plate); background-size:100% 100%; }
@supports not (height:100dvh) { .dpage .stage { --sw:min(106vw, max(100vw, calc(100vh * var(--iw) / var(--ih)))); } }
.dpage .ov { position:absolute; }
.dpage .brand2 { display:flex; align-items:center; gap:2.2%; color:var(--ink); }
.dpage .brand2 i { flex:none; width:24%; aspect-ratio:84/52; background:var(--img-m-brand-icon) center / contain no-repeat; }
.dpage .brand2 b { display:block; font-size:calc(var(--sw) * .058); font-weight:800; letter-spacing:1px; line-height:1.15; }
.dpage .brand2 span { display:block; font-family:var(--serif); font-size:calc(var(--sw) * .03); letter-spacing:3px; }
.dpage .gear { display:flex; align-items:center; justify-content:flex-end; gap:6px; border:0; background:transparent; color:var(--ink); font-size:calc(var(--sw) * .04); padding:0; }
.dpage .gear svg { width:calc(var(--sw) * .055); height:calc(var(--sw) * .055); }
.dpage .title2 { text-align:center; font-family:var(--hand); font-weight:700; color:var(--ink); font-size:calc(var(--sw) * .078); line-height:1.32; text-shadow:0 0 12px rgba(255,255,255,.75); }
.dpage .title2 em { display:block; width:55%; height:3px; margin:4px auto 0; border-radius:3px; background:linear-gradient(90deg,transparent,#3a57b0 15%,#3a57b0 85%,transparent); opacity:.8; }
.dpage .motto2 { text-align:center; white-space:nowrap; font-family:var(--hand); color:var(--ink); font-size:calc(var(--sw) * .034); text-shadow:0 0 8px rgba(255,255,255,.8); }
.dpage .hot { border:0; padding:0; background:transparent; border-radius:10px; }
.dpage .hot:active { background:rgba(255,255,255,.2); }
.dpage .entries2 { position:absolute; left:12px; right:12px; bottom:calc(12px + var(--safe-b)); display:grid; grid-template-columns:1fr 1fr; gap:10px; z-index:2; }
/* 右上角：设置、消息一排，不换行（家长 10-31） */
.dpage .top2 { display:flex; align-items:center; gap:14px; white-space:nowrap; }
.dpage .top2 .gear { font-size:inherit; height:100%; }
.msg-top { position:relative; flex:none; white-space:nowrap; }
.home .hero > .msg-top, .mhome .art > .msg-top { position:absolute; z-index:2; right:14px; top:calc(16px + var(--safe-t)); display:flex; align-items:center; gap:4px; border:0; background:transparent; color:var(--ink); font-size:17px; padding:0; }
.home .hero > .msg-top svg, .mhome .art > .msg-top svg { width:22px; height:22px; }
.msg-badge { position:absolute; top:-7px; right:-9px; min-width:18px; height:18px; padding:0 4px; border-radius:9px; background:#d8262c; color:#fff; font:700 12px/18px var(--font); text-shadow:none; text-align:center; }
.msg-list { padding:12px; display:flex; flex-direction:column; gap:12px; }
.msg-row { display:block; width:100%; padding:15px 32px 15px 14px; border-radius:10px; background:#fff; border:1px solid #e5dccb; color:var(--ink2); font:16px/1.4 var(--font); text-align:left; position:relative; }
.msg-row::after { content:"›"; position:absolute; right:14px; top:50%; transform:translateY(-50%); font-size:22px; color:var(--ink3); }
.msg-row.unread { color:var(--ink); font-weight:700; }
.msg-item { padding:16px 14px; border-radius:10px; background:#fff; border:1px solid #e5dccb; overflow-wrap:anywhere; font-size:16px; line-height:1.65; }
.msg-title { margin:0 0 12px; font-size:20px; line-height:1.35; color:var(--ink); }
.msg-text { white-space:pre-wrap; }
.msg-lead { white-space:pre-wrap; padding:12px; border-radius:8px; background:var(--cream); }
.msg-part { margin-top:22px; }
.msg-part h3 { margin:0 0 8px; padding-left:9px; border-left:4px solid var(--gold); font-size:17px; line-height:1.3; color:var(--ink); }
.msg-part p { margin:0 0 6px; }
.msg-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:8px 0; }
.msg-stat { padding:8px 4px; border-radius:8px; background:var(--cream); text-align:center; }
.msg-stat span { display:block; font-size:13px; line-height:1.3; color:var(--ink2); }
.msg-stat b { display:block; font-size:18px; line-height:1.35; color:var(--ink); }
.msg-stat.good b { color:#2c7a4b; }
.msg-stat.bad b { color:#c0392b; }
.msg-point { padding:11px 0; border-top:1px solid #efe7d8; }
.msg-part h3 + .msg-point { border-top:0; padding-top:2px; }
.msg-point-name { font-weight:700; color:var(--ink); margin-bottom:2px; }
.msg-why { display:inline-block; margin-top:6px; padding:1px 8px; border-radius:6px; background:#f7e6d6; color:#9a4a12; font-size:14px; }
.dpage .entries2 .entry { min-height:58px; background:linear-gradient(160deg,rgba(251,247,236,.96),rgba(241,231,209,.96)); }
.dpage .corner-l { position:absolute; z-index:2; left:16px; top:calc(14px + var(--safe-t)); width:min(48vw,220px); }
.dpage .corner-r { position:absolute; z-index:2; right:14px; top:calc(16px + var(--safe-t)); height:36px; }
.dpage .corner-l b { font-size:min(6vw,27px); } .dpage .corner-l span span { font-size:min(3.2vw,15px); }
.dpage .corner-r { font-size:min(4.2vw,19px); } .dpage .corner-r svg { width:min(6vw,26px); height:min(6vw,26px); }
.dpage .corner-l, .dpage .corner-r { text-shadow:0 0 8px rgba(255,255,255,.85); }
/* ---------- 英语页（照 Codex 手机版设计：皮面顶栏＋底部标签栏、纸面黄铜包角卡片） ---------- */
.en-screen { display:flex; flex-direction:column; overflow:hidden; }
.en-screen > .en { flex:1; min-height:0; overflow-y:auto; -webkit-overflow-scrolling:touch; overscroll-behavior:contain; }
.en-top { position:sticky; top:0; z-index:5; display:flex; align-items:center; justify-content:space-between; gap:6px;
  padding:calc(6px + var(--safe-t)) 8px 8px; min-height:58px; color:#e9d3a2;
  background:#0c1e2c var(--img-m-en-top) center bottom / cover no-repeat;
  border-bottom:0; box-shadow:0 3px 8px rgba(0,0,0,.3); }
.en-top .tb { color:#e9d3a2; min-width:44px; height:40px; justify-content:center; }
.en-top .tb svg { width:24px; height:24px; }
.en-logo { flex:1; height:50px; background:none; }   /* 徽标画在顶栏图上，元素留着给读屏 */
.en-tabs { flex:none; display:flex; gap:2px; padding:8px 4px calc(6px + var(--safe-b)); color:#e9d3a2;
  background:#031423 var(--img-m-en-tabs) center top / cover no-repeat;
  border-top:0; box-shadow:0 -3px 8px rgba(0,0,0,.25); }
.en-tabs .tab { flex:1; min-width:0; display:flex; flex-direction:column; align-items:center; gap:2px; padding:6px 2px 5px; border:0; border-radius:10px;
  background:transparent; color:#e9d3a2; font:600 12.5px var(--serif); white-space:nowrap; }
.en-tabs .tab svg { width:23px; height:23px; }
.en-tabs .tab.on { background:linear-gradient(#fbf4e2,#efe2c4); color:var(--navy); box-shadow:inset 0 0 0 1px #c5a46a, 0 2px 4px rgba(0,0,0,.25); }
.en .pad { padding:10px 12px 18px; }
.en-head2 { display:flex; align-items:center; gap:10px; margin:2px 0 12px; min-height:92px; }
.en-head2 .tx { flex:1; min-width:0; }
.en-head2 h2 { margin:0; font-size:clamp(22px,6.6vw,30px); font-weight:800; letter-spacing:1px; line-height:1.25; }
.en-head2 .s1 { margin:4px 0 0; font-size:clamp(16px,4.6vw,21px); font-weight:700; }
.en-head2 .s2, .en-head2 .tx > p:only-of-type { margin:4px 0 0; font-size:13.5px; color:var(--ink2); font-weight:400; }
.en-head2 .art { flex:none; width:30%; max-width:150px; aspect-ratio:1.15; border-radius:6px;
  background:var(--img-m-en-head-art) center / cover no-repeat;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 22%); mask-image:linear-gradient(90deg,transparent,#000 22%); }
.plate h3 .pick { margin-left:auto; }
.pick { flex:none; height:36px; border-radius:10px; border:1px solid rgba(168,133,79,.6); background:rgba(255,252,243,.92); font:14px var(--serif); color:var(--ink); padding:0 8px; }
.search { position:relative; align-items:center; }
.search > svg { position:absolute; left:12px; top:50%; transform:translateY(-50%); width:18px; height:18px; color:var(--ink3); pointer-events:none; }
.search input { padding-left:36px; }
.letters { grid-template-columns:repeat(13,1fr); gap:4px; }
.letters button { height:30px; font-size:12.5px; }
.empty.card { margin-top:4px; border-radius:9px; background:rgba(255,252,243,.88); border:1px solid rgba(168,133,79,.32); }
.day { width:96px; }
.day .big { display:block; font-size:16px; font-weight:800; color:var(--ink); margin:1px 0; }
.tile.withic { display:flex; align-items:center; gap:10px; }
.tile .ti { flex:none; width:30px; display:flex; justify-content:center; }
.tile .ti svg { width:24px; height:24px; color:var(--ink); }
.tile .tt { min-width:0; flex:1; }
.tile .v:empty { display:none; }
.tile .v.sm { font-size:17px; }
.tile.wide { margin:10px 0 14px; }
h3.sec { margin:16px 2px 8px; font-size:19px; font-weight:800; }
.fcard { margin:10px 0 0; padding:12px 12px 12px; border-radius:9px; background:rgba(255,251,240,.95); border:1px solid rgba(168,133,79,.38); box-shadow:0 2px 5px rgba(14,33,48,.12); }
.fcard .fh { display:flex; align-items:center; gap:10px; }
.fcard .fh .fi { width:30px; height:30px; color:#8a6233; }
.fcard .fh b { font-size:17px; }
.fcard p { margin:6px 0 10px 40px; font-size:13.5px; color:var(--ink2); border-top:1px solid rgba(168,133,79,.25); padding-top:6px; }
.fcard .lbtn { width:calc(100% - 40px); margin-left:40px; }
.lbtn.off { background:linear-gradient(#cfc8bb,#b5ad9f); color:#3d3a34; border-color:#a39a88; box-shadow:inset 0 1px 0 rgba(255,255,255,.5); opacity:1; }
.foot4 { display:grid; grid-template-columns:repeat(4,1fr); margin-top:12px; padding-top:10px; border-top:1px solid rgba(168,133,79,.35); text-align:center; }
.foot4 > div + div { border-left:1px solid rgba(168,133,79,.3); }
.foot4 span { display:block; font-size:12px; color:var(--ink2); }
.foot4 b { display:block; font-size:15px; }
.warn { text-align:center; color:#c46a1c; }
.seg2 { display:grid; grid-template-columns:1fr 1fr; margin:12px 0; padding:3px; border-radius:10px; border:1px solid #c5a46a; background:rgba(255,252,243,.7); }
.seg2 button { height:40px; border:0; border-radius:8px; background:transparent; font:700 15px var(--serif); color:var(--ink); }
.seg2 button[aria-pressed="true"] { color:var(--cream); background-color:var(--navy); background-image:linear-gradient(rgba(255,255,255,.08),rgba(0,0,0,.18)), var(--img-m-en-tabs); background-size:auto, 430px auto; background-position:0 0, center 60%; }
.folders2 { display:grid; grid-template-columns:1fr 1fr; gap:12px 10px; padding-top:6px; }
.folder2 { position:relative; display:flex; align-items:center; gap:10px; min-height:72px; padding:14px 10px 8px; text-align:left; border:0;
  border-top:3px solid #1d3550; border-left:3px solid #1d3550; border-radius:8px; background:rgba(255,251,240,.96);
  box-shadow:0 3px 6px rgba(14,33,48,.18), inset 0 0 0 1px rgba(168,133,79,.3); font-family:var(--serif); }
.folder2::before { content:""; position:absolute; left:-3px; top:-8px; width:44px; height:16px; border-radius:6px 10px 0 0; background:linear-gradient(#d9c08f,#b8955a); }
.folder2 .no { flex:none; font-size:15px; color:var(--ink2); padding-right:8px; border-right:1px solid rgba(168,133,79,.4); }
.folder2 .nm { font-size:16px; font-weight:800; }
.folder2 .nm small { display:block; font-size:12.5px; font-weight:400; color:var(--ink2); }
.banner .paper .lbtn { width:100%; }
/* 立体质感（家长 2026-10-23：“按钮还有入口……要有质感，有3d感觉”）：照电脑端皮面黄铜按钮、纸面卡片的材质与光影。
   按钮＝皮面＋黄铜描边＋上沿高光＋下方厚度，按下凹陷；卡片和入口＝纸面＋斜面高光＋投影厚度，按下压低。 */
.lbtn { position:relative; transform:translateY(0); transition:transform .08s, box-shadow .08s;
  background-image:linear-gradient(180deg, rgba(255,255,255,.18) 0%, rgba(255,255,255,.04) 45%, rgba(0,0,0,.22) 100%), var(--img-leather);
  border:1.5px solid #c9a86b;
  box-shadow:inset 0 1px 0 rgba(255,236,196,.45), inset 0 -2px 0 rgba(0,0,0,.35), inset 0 0 0 3px rgba(10,20,32,.35),
    0 4px 0 #071019, 0 7px 10px rgba(7,16,25,.45); }
.lbtn::after { content:""; position:absolute; inset:4px; border-radius:7px; border:1px solid rgba(233,211,162,.35); pointer-events:none; }
.lbtn:active { transform:translateY(3px); opacity:1;
  box-shadow:inset 0 2px 4px rgba(0,0,0,.5), inset 0 0 0 3px rgba(10,20,32,.35), 0 1px 0 #071019, 0 2px 4px rgba(7,16,25,.35); }
.lbtn.off { box-shadow:inset 0 1px 0 rgba(255,255,255,.6), inset 0 -2px 0 rgba(0,0,0,.15), 0 3px 0 #8f877a, 0 5px 8px rgba(0,0,0,.18); }
.lbtn.off::after { border-color:rgba(255,255,255,.4); }
.tile, .day, .fcard, .folder2, .entry, .empty.card, .row-card {
  background-image:linear-gradient(160deg, rgba(255,255,255,.55), rgba(255,255,255,0) 40%, rgba(150,110,60,.06)), var(--img-m-en-paper);
  background-size:auto, 430px 430px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9), inset 0 -1px 0 rgba(150,110,60,.18), 0 2px 0 rgba(150,110,60,.28), 0 5px 9px rgba(14,33,48,.14); }
.folder2, .entry, .tile, .fcard { transition:transform .08s, box-shadow .08s; }
.folder2:active, .entry:active { transform:translateY(2px); box-shadow:inset 0 2px 4px rgba(120,85,40,.25), 0 1px 0 rgba(150,110,60,.28); }
.plate { box-shadow:0 1px 0 rgba(255,255,255,.7) inset, 0 3px 0 rgba(150,110,60,.22), 0 8px 14px rgba(14,33,48,.14); }
.plate::before, .plate::after { border-color:#a8854f; filter:drop-shadow(0 1px 0 rgba(255,236,196,.7)) drop-shadow(0 1px 1px rgba(0,0,0,.35)); }
.seg2 button[aria-pressed="true"] { box-shadow:inset 0 1px 0 rgba(255,236,196,.35), 0 2px 0 #071019, 0 3px 5px rgba(0,0,0,.3); }
.letters button { box-shadow:inset 0 1px 0 #fff, 0 2px 0 rgba(150,110,60,.3); }
.letters button:active { transform:translateY(1px); box-shadow:inset 0 1px 2px rgba(0,0,0,.2); }
.en-tabs .tab.on { box-shadow:inset 0 1px 0 #fff, inset 0 0 0 1px #c5a46a, 0 2px 0 #6d5530, 0 3px 6px rgba(0,0,0,.35); }
.entry { border:1.5px solid rgba(150,110,60,.45); }
.entries2 .entry { box-shadow:inset 0 1px 0 #fff, inset 0 -2px 0 rgba(150,110,60,.2), 0 3px 0 rgba(120,85,40,.45), 0 8px 14px rgba(40,25,10,.35); }
/* ================= 其余五科（照 Codex 手机版设计；每科一套材质） ================= */
.s-screen { display:flex; flex-direction:column; overflow:hidden; font-family:var(--serif); }
.s-body { flex:1; min-height:0; overflow-y:auto; -webkit-overflow-scrolling:touch; overscroll-behavior:contain; }
.s-top { position:sticky; top:0; z-index:5; display:flex; align-items:center; justify-content:space-between; padding:calc(6px + var(--safe-t)) 8px 6px; min-height:54px; }
.s-top .tb { min-width:56px; height:40px; color:inherit; justify-content:flex-start; gap:4px; font-size:16px; }
.s-top .tb svg { width:24px; height:24px; }
.s-brand { display:flex; align-items:center; gap:8px; }
.s-brand i { width:30px; height:26px; background:currentColor; -webkit-mask:var(--brand-mask) center/contain no-repeat; mask:var(--brand-mask) center/contain no-repeat; }
.s-brand b { display:block; font-size:19px; letter-spacing:2px; line-height:1.1; }
.s-brand small { display:block; font-size:9.5px; letter-spacing:2px; opacity:.85; font-family:var(--font); }
.s-pad { padding:4px 12px 18px; }
.s-head { position:relative; display:flex; align-items:center; min-height:120px; margin:0 -12px 10px; padding:10px 16px; overflow:hidden; }
.s-head .tx { position:relative; z-index:1; flex:1; min-width:0; }
.s-head .art { position:absolute; inset:0; z-index:0; background-repeat:no-repeat; }
.s-head .kick { margin:0; font-size:12.5px; font-weight:700; letter-spacing:1px; }
.s-head h2 { margin:2px 0 4px; font-size:clamp(26px,8vw,34px); font-weight:800; letter-spacing:2px; }
.s-head .sub { margin:0; font-size:13.5px; max-width:62%; line-height:1.5; }
.s-tabs { flex:none; display:flex; gap:2px; padding:6px 4px calc(6px + var(--safe-b)); }
.s-tabs .tab { flex:1; min-width:0; display:flex; flex-direction:column; align-items:center; gap:2px; padding:6px 2px 5px; border:0; border-radius:12px; background:transparent;
  color:inherit; font:600 12.5px var(--serif); white-space:nowrap; transition:transform .08s; }
.s-tabs .tab svg { width:23px; height:23px; }
.s-tabs .tab:active { transform:translateY(1px); }
.s-card { position:relative; margin:0 0 12px; padding:14px; border-radius:12px; }
.s-card h3, .s-sec { margin:0 0 8px; font-size:19px; font-weight:800; display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; }
.s-card h3 small { font-size:12px; font-weight:400; opacity:.75; }
.s-sec { margin:16px 2px 8px; }
.muted { opacity:.72; font-size:13.5px; margin:0 0 10px; }
.muted.small { font-size:12px; text-align:center; }
.s-count { font-size:12.5px; line-height:1.7; margin:0 2px 10px; opacity:.8; }
.sbtn { display:flex; align-items:center; justify-content:center; width:100%; min-height:48px; margin:8px 0; border-radius:12px; font:700 17px var(--serif); letter-spacing:1px;
  border:0; transition:transform .08s, box-shadow .08s; }
.sbtn:active:not(:disabled) { transform:translateY(3px); }
.sbtn:disabled { cursor:default; }
.s-link { display:flex; align-items:center; gap:8px; width:100%; margin-top:6px; padding:10px 2px 2px; border:0; border-top:1px solid rgba(0,0,0,.08); background:transparent; color:inherit; font:15px var(--serif); text-align:left; }
.s-link svg { width:18px; height:18px; } .s-link .chev { margin-left:auto; }
.s-link.plain { border:0; justify-content:flex-start; padding:4px 6px 10px; font-weight:700; }
.s-empty { display:flex; flex-direction:column; gap:4px; padding:16px; border-radius:12px; font-size:13px; }
.s-empty svg { width:28px; height:28px; }
.s-empty b { font-size:16px; }
.s-empty.row { flex-direction:row; align-items:center; gap:12px; }
.s-empty.row b { display:block; font-size:15px; }
.s-tiles { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:6px; }
.s-tile { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px; min-height:80px; padding:8px 4px; border-radius:10px; text-align:center; }
.s-tile .k { font-size:12.5px; } .s-tile b { font-size:22px; } .s-tile .s { font-size:11px; opacity:.7; }
.s-tile.add { flex-direction:row; font:700 16px var(--serif); }
.s-chap { display:grid; gap:2px; width:100%; margin:8px 0 0; padding:10px 12px; border-radius:10px; text-align:left; font-family:var(--serif); color:inherit; transition:transform .08s; }
.s-chap:active { transform:translateY(2px); }
.s-chap .no { font-size:12px; font-weight:700; } .s-chap b { font-size:17px; } .s-chap .d { font-size:12px; opacity:.72; line-height:1.5; }
.s-chap .f { display:flex; justify-content:space-between; font-size:12.5px; opacity:.85; margin-top:4px; } .s-chap .go { font-weight:700; }
.s-acc { margin:0 0 10px; border-radius:12px; }
.s-acc summary { display:flex; align-items:center; gap:10px; padding:12px; cursor:pointer; list-style:none; }
.s-acc summary::-webkit-details-marker { display:none; }
.s-acc summary::before { content:"›"; font-size:20px; transition:transform .15s; width:12px; }
.s-acc[open] summary::before { transform:rotate(90deg); }
.s-acc summary svg { width:22px; height:22px; flex:none; }
.s-acc summary b { display:block; font-size:16px; } .s-acc summary small { display:block; font-size:11.5px; opacity:.7; }
.s-acc .in { padding:0 10px 10px; }
.mixed .mx-art { position:absolute; right:12px; top:12px; width:34%; aspect-ratio:1.3; background-repeat:no-repeat; }
.mini-search { margin-left:auto; position:relative; } .mini-search svg { position:absolute; left:8px; top:50%; transform:translateY(-50%); width:15px; height:15px; opacity:.6; }
.mini-search input { width:130px; height:30px; border-radius:15px; padding:0 10px 0 26px; font:13px var(--serif); border:1px solid rgba(0,0,0,.15); background:rgba(255,255,255,.7); }

/* ---- 语文：文脉书院（宣纸、山水、墨绿印章色、蓝布书脊） ---- */
.th-wenyan { --brand-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 6l7-3v15l-7 3zM11 3h4v18h-4zM16 4l5 1v16l-5-1z'/%3E%3C/svg%3E");
  color:#2b2a26; background:#efe6d3; }
.th-wenyan .s-body { background:#f1e9d8 linear-gradient(rgba(255,255,255,.35),rgba(0,0,0,.02)); }
.th-wenyan .s-top { background:linear-gradient(#f4ecdc,#e9dec7); border-bottom:1px solid #cdbb98; box-shadow:0 2px 6px rgba(80,60,30,.15); color:#2b2a26; }
.th-wenyan .s-head .art { background:var(--img-m-wy-head) right center / cover no-repeat; opacity:1; -webkit-mask-image:none; mask-image:none; }
.th-wenyan .s-tabs { background:linear-gradient(#efe5cf,#e2d4b6); border-top:1px solid #c8b38c; color:#3b3428; }
.th-wenyan .s-tabs .tab.on { background:linear-gradient(#3f6b57,#2c4f40); color:#f3ead6; box-shadow:inset 0 1px 0 rgba(255,255,255,.2), 0 2px 0 #1d362c, 0 4px 6px rgba(0,0,0,.25); }
.th-wenyan .s-card, .th-wenyan .wy-cat, .th-wenyan .wy-lesson, .th-wenyan .s-tile, .th-wenyan .wy-prog { background:linear-gradient(160deg,#fbf6ea,#f0e6d0); border:1px solid #d6c4a0;
  box-shadow:inset 0 1px 0 #fff, 0 2px 0 rgba(140,110,60,.3), 0 6px 10px rgba(80,60,30,.14); }
.th-wenyan .sbtn { color:#f5ecd8; background:linear-gradient(#3f6b57,#2c4f40); border:1.5px solid #b89a5c; box-shadow:inset 0 1px 0 rgba(255,255,255,.25), inset 0 -2px 0 rgba(0,0,0,.3), 0 4px 0 #1c3329, 0 6px 10px rgba(0,0,0,.25); }
.th-wenyan .sbtn:active:not(:disabled) { box-shadow:inset 0 2px 4px rgba(0,0,0,.4), 0 1px 0 #1c3329; }
.th-wenyan .sbtn.off { background:linear-gradient(#a9b8ac,#93a598); color:#eef2ec; box-shadow:inset 0 1px 0 rgba(255,255,255,.3), 0 3px 0 #77887b; }
.wy-shelf { display:flex; gap:8px; overflow-x:auto; padding:10px 8px 14px; margin:0 -12px 8px; background:linear-gradient(#7a5233,#5c3b22); box-shadow:inset 0 -8px 0 #3e2716, inset 0 2px 0 rgba(255,220,170,.25); }
.wy-vol { flex:none; width:98px; height:58px; border-radius:4px; border:0; padding:6px; color:#3b2f1e; font:700 12.5px var(--serif);
  background:linear-gradient(90deg,rgba(0,0,0,.25) 0 6px,transparent 6px), linear-gradient(#2f5c4a,#244a3b); box-shadow:0 3px 0 #2a1a0d, 0 5px 8px rgba(0,0,0,.4); }
.wy-vol.v1 { background:linear-gradient(90deg,rgba(0,0,0,.25) 0 6px,transparent 6px), linear-gradient(#2c4d79,#213b5e); }
.wy-vol.v2 { background:linear-gradient(90deg,rgba(0,0,0,.2) 0 6px,transparent 6px), linear-gradient(#a99a85,#8d7f6b); }
.wy-vol.v3 { background:linear-gradient(90deg,rgba(0,0,0,.25) 0 6px,transparent 6px), linear-gradient(#2d4f80,#203c66); }
.wy-vol.v4 { background:linear-gradient(90deg,rgba(0,0,0,.25) 0 6px,transparent 6px), linear-gradient(#2a4a74,#1f3858); }
.wy-vol span { display:flex; align-items:center; justify-content:center; height:100%; border-radius:2px; background:#efe5cc; box-shadow:inset 0 0 0 1px #b9a37a; }
.wy-vol.on { outline:2px solid #e9c46a; outline-offset:2px; }
.wy-works { display:grid; grid-template-columns:repeat(3,1fr); gap:6px; margin-bottom:10px; }
.wy-work { display:flex; align-items:center; gap:6px; padding:8px; border-radius:8px; border:1px solid #d6c4a0; background:#f8f1e1; font-family:var(--serif); text-align:left; box-shadow:0 2px 0 rgba(140,110,60,.3); }
.wy-work .no { flex:none; width:22px; height:22px; border-radius:50%; border:1px solid currentColor; display:flex; align-items:center; justify-content:center; font-size:12px; }
.wy-work b { display:block; font-size:15px; } .wy-work small { display:block; font-size:11px; opacity:.7; }
.wy-work.on { background:linear-gradient(#3f6b57,#2c4f40); color:#f3ead6; border-color:#b89a5c; }
.wy-lesson { position:relative; margin:0 0 10px; padding:12px 12px 10px 22px; border-left:8px solid #2c4d79 !important; }
.wy-lesson .tag { display:inline-block; font-size:12px; padding:1px 8px; border-radius:4px; background:#2c4d79; color:#eef2f7; }
.wy-lesson b { display:block; font-size:18px; margin-top:4px; } .wy-lesson p { margin:2px 0 4px; font-size:14px; } .wy-lesson .f { font-size:12px; opacity:.7; }
.wy-lesson .sbtn { position:absolute; right:10px; bottom:8px; width:auto; min-height:36px; padding:0 14px; font-size:14.5px; margin:0; }
.wy-mixed { display:grid; grid-template-columns:auto 1fr; gap:4px 12px; align-items:center; }
.wy-mixed .wy-ic { grid-row:span 2; width:58px; height:58px; border-radius:10px; display:flex; align-items:center; justify-content:center; color:#f3ead6; background:linear-gradient(#3f6b57,#2c4f40); box-shadow:0 3px 0 #1c3329; }
.wy-mixed .wy-ic svg { width:30px; height:30px; } .wy-mixed p { margin:0; font-size:13.5px; line-height:1.6; } .wy-mixed .sbtn { grid-column:span 2; }
.wy-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.wy-cat { display:grid; gap:4px; padding:12px; border-radius:6px; text-align:left; font-family:var(--serif); color:inherit; }
.wy-cat b { font-size:18px; border-left:4px solid #3f6b57; padding-left:8px; } .wy-cat .n { display:flex; justify-content:space-between; align-items:baseline; font-size:20px; border-top:1px solid #e0d2b4; padding-top:8px; }
.wy-cat .n small { font-size:11px; opacity:.7; } .wy-cat .s { font-size:11.5px; opacity:.65; }
.th-wenyan .s-tile.add { border:1.5px solid #3f6b57; color:#2c4f40; background:#f7f1e3; }
.th-wenyan .day, .th-wenyan .s-empty { background:#f8f1e1; border:1px solid #d6c4a0; }
.wy-prog { margin:8px 0 0; padding:10px 12px; border-radius:8px; }
.wy-prog .hd { display:flex; justify-content:space-between; } .wy-prog .tag { font-size:11.5px; padding:0 8px; border-radius:4px; background:#3f6b57; color:#f3ead6; }
.wy-prog .ln { display:grid; grid-template-columns:36px 1fr auto; align-items:center; gap:8px; font-size:12.5px; margin-top:4px; }
.wy-prog .ln i { height:6px; border-radius:3px; background:#e4d8bf; }

/* ---- 数学：几何之境（白色石膏、蓝色几何、玻璃光） ---- */
.th-math { --brand-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M2 5c3-1 6-1 9 1v15c-3-2-6-2-9-1zM22 5c-3-1-6-1-9 1v15c3-2 6-2 9-1z'/%3E%3C/svg%3E");
  color:#16213a; background:#eef2f8; }
.th-math .s-body { background:linear-gradient(#f4f6fa,#e8edf5); }
.th-math .s-top { background:rgba(255,255,255,.92); border-bottom:1px solid #dde3ee; color:#16213a; }
.th-math .s-head { min-height:130px; }
.th-math .s-head .art { background:var(--img-m-math-head) right center / cover no-repeat; -webkit-mask-image:none; mask-image:none; }
.th-math .s-tabs { background:rgba(255,255,255,.95); border-top:1px solid #dde3ee; color:#26314a; }
.th-math .s-tabs .tab.on { background:linear-gradient(#e6eefc,#d6e3fa); color:#1d4fd8; box-shadow:inset 0 1px 0 #fff, 0 2px 0 #b9c9e8; }
.th-math .s-card, .th-math .s-acc, .th-math .s-empty { background:linear-gradient(165deg,rgba(255,255,255,.96),rgba(240,244,251,.92)); border:1px solid #dfe5ef;
  box-shadow:inset 0 1px 0 #fff, 0 2px 0 rgba(160,175,200,.35), 0 8px 16px rgba(40,60,100,.1); }
.th-math .s-chap { background:linear-gradient(#fff,#f3f6fb); border:1px solid #e0e6f0; box-shadow:0 2px 0 rgba(160,175,200,.35); }
.th-math .s-chap .no, .th-math .s-chap .go { color:#1d4fd8; }
.th-math .sbtn { color:#fff; background:linear-gradient(#3f7bf0,#1d4fd8); box-shadow:inset 0 1px 0 rgba(255,255,255,.35), 0 4px 0 #173ea8, 0 6px 10px rgba(29,79,216,.3); }
.th-math .sbtn.off { width:auto; padding:0 22px; background:linear-gradient(#a9c3f3,#8eaeea); box-shadow:inset 0 1px 0 rgba(255,255,255,.4), 0 3px 0 #7f9cd4; }
.th-math .mixed .mx-art { background:var(--img-m-math-mixed) center / cover no-repeat; }
.th-math .s-sec { border-bottom:2px solid #3f7bf0; padding-bottom:6px; }
.m-books { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.m-book { display:flex; flex-direction:column; align-items:center; padding:8px; border-radius:12px; border:1px solid #e3e8f1; background:rgba(255,255,255,.75); font-family:var(--serif); box-shadow:0 2px 0 rgba(160,175,200,.3); transition:transform .08s; }
.m-book:active { transform:translateY(2px); }
.m-book .cv { position:relative; width:100%; aspect-ratio:233/365; background-color:#eef2f8; background-position:center; background-size:100% 100%; background-repeat:no-repeat; border-radius:4px; display:flex; flex-direction:column; align-items:center; padding-top:9%; color:#16213a; }
.m-book .cv small { font-size:9px; } .m-book .cv b { font-size:24px; color:#1d3fa8; letter-spacing:2px; } .m-book .cv em { font-style:normal; font-size:11px; text-align:center; padding:0 18%; }
.m-book .lb { margin-top:4px; font-size:13px; font-weight:700; padding:2px 10px; border-radius:6px; background:linear-gradient(#fbfcfe,#e9edf4); box-shadow:inset 0 1px 0 #fff, 0 1px 0 #c3ccda; }

/* ---- 物理：书架（冰蓝玻璃、白色书架、蓝布笔记本、木桌） ---- */
.th-physics { --brand-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M2 5c3-1 6-1 9 1v15c-3-2-6-2-9-1zM22 5c-3-1-6-1-9 1v15c3-2 6-2 9-1z'/%3E%3C/svg%3E");
  color:#173452; background:#e7f0f8; }
.th-physics .s-body { background:linear-gradient(#edf4fa,#dce9f4); }
.th-physics .s-top { background:linear-gradient(#f1f7fc,#e2edf7); border-bottom:1px solid #c9dbea; color:#173452; }
.th-physics .s-brand i { color:#2fa8c4; width:40px; height:32px; }
.th-physics .s-tabs { margin:0 8px calc(6px + var(--safe-b)); padding:6px; border-radius:20px; background:linear-gradient(#f5f9fd,#e3eef7); box-shadow:inset 0 1px 0 #fff, 0 3px 10px rgba(30,70,110,.18); color:#173452; }
.th-physics .s-tabs .tab.on { background:linear-gradient(#d3edf6,#bfe3f1); color:#0f6b86; box-shadow:inset 0 1px 0 #fff, 0 2px 0 #9fcde0; }
.p-banner { display:flex; justify-content:space-between; align-items:center; margin:6px 0 10px; padding:12px 16px; border-radius:14px; background:linear-gradient(#fafdff,#e8f2fa);
  box-shadow:inset 0 1px 0 #fff, 0 3px 0 #c5d9e9, 0 8px 14px rgba(30,70,110,.12); }
.p-banner b { font-family:var(--hand); font-size:24px; letter-spacing:3px; border-bottom:2px solid #2c5f8a; }
.p-banner span { font-size:13px; text-align:right; } .p-banner .hand { font-family:var(--hand); font-size:14px; }
.p-shelf { display:grid; grid-template-columns:1fr 1fr; gap:22px 14px; padding:16px 14px 22px; border-radius:14px; background:linear-gradient(#eef5fb,#dbe8f3);
  box-shadow:inset 0 0 0 6px rgba(255,255,255,.7), inset 0 2px 8px rgba(30,70,110,.15); }
.p-book { position:relative; display:flex; flex-direction:column; align-items:center; border:0; background:transparent; padding:0 0 4px; font-family:var(--serif); }
.p-book::after { content:""; position:absolute; left:-10px; right:-10px; bottom:18px; height:14px; border-radius:3px; background:linear-gradient(#ffffff,#d9e6f1); box-shadow:0 3px 4px rgba(30,70,110,.25); z-index:0; }
.p-book .cv { position:relative; z-index:1; width:84%; aspect-ratio:893/1263; background-size:cover; border-radius:2px 5px 5px 2px; box-shadow:-3px 0 0 rgba(0,0,0,.08) inset, 4px 6px 10px rgba(20,40,70,.35); transition:transform .1s; }
.p-book:active .cv { transform:translateY(-3px); }
.p-book .lb { position:relative; z-index:2; margin-top:16px; font-size:12.5px; font-weight:700; padding:1px 10px; border-radius:4px; background:linear-gradient(#fff,#eef3f8); box-shadow:0 1px 0 #b7c8d8; }
.p-notebook { padding:16px 14px; border-radius:12px; background:#f6f1e4 linear-gradient(90deg,rgba(0,0,0,0) 0,rgba(0,0,0,0) 100%); border:10px solid #5b7fae;
  box-shadow:inset 0 0 0 1px #d8cfba, 0 6px 14px rgba(30,50,80,.3); }
.p-notebook .lead { margin:0 0 10px; font-size:15px; }
.p-card { display:block; width:100%; margin:0 0 10px; padding:14px; border-radius:10px; text-align:center; font-family:var(--serif); color:inherit;
  background:linear-gradient(#fbf8f0,#f0e9d9); border:1px solid #d9cfb8; box-shadow:inset 0 1px 0 #fff, 0 2px 0 rgba(140,120,80,.35); }
.p-card h3 { justify-content:center; font-size:22px; } .p-card .spin svg { width:42px; height:42px; color:#2f8fb0; } .p-card p { margin:6px 0; }
.p-card.link { text-align:left; font-size:15px; }
.th-physics .sbtn { color:#fff; background:linear-gradient(#3aa1bd,#24819c); box-shadow:inset 0 1px 0 rgba(255,255,255,.35), 0 4px 0 #186478, 0 6px 10px rgba(20,90,110,.3); }
.th-physics .sbtn.off { opacity:.75; }
.th-physics .s-empty { background:#fff; border:1px solid #e3e9ee; }
.p-desk { padding:14px 10px 12px; border-radius:12px; background:var(--img-phy-archive) center/cover; box-shadow:inset 0 0 0 1px rgba(255,255,255,.4), 0 6px 14px rgba(60,40,20,.25); }
.p-arch { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.p-ab { display:flex; flex-direction:column; justify-content:space-between; align-items:center; aspect-ratio:.82; padding:14px 8px 12px; border-radius:4px 8px 8px 4px; border:0;
  font-family:var(--serif); color:#1d2e48; background:linear-gradient(90deg,rgba(0,0,0,.18) 0 7px,transparent 7px), linear-gradient(160deg,#7ea4d8,#5c84c2);
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.25), 0 5px 0 #3b5a8c, 0 8px 12px rgba(0,0,0,.3); transition:transform .08s; }
.p-ab:active { transform:translateY(3px); }
.p-ab.a1, .p-ab.a5 { background:linear-gradient(90deg,rgba(0,0,0,.1) 0 7px,transparent 7px), linear-gradient(160deg,#efe7d6,#ddd2bb); box-shadow:inset 0 0 0 2px rgba(255,255,255,.4), 0 5px 0 #a99c80, 0 8px 12px rgba(0,0,0,.3); }
.p-ab.a3 { background:linear-gradient(90deg,rgba(0,0,0,.15) 0 7px,transparent 7px), linear-gradient(160deg,#9ccfcf,#77b3b3); box-shadow:inset 0 0 0 2px rgba(255,255,255,.3), 0 5px 0 #4e8c8c, 0 8px 12px rgba(0,0,0,.3); }
.p-ab .t { font-size:14px; text-align:center; line-height:1.5; font-weight:700; } .p-ab .c { font-size:12.5px; font-weight:700; padding:3px 12px; border-radius:12px; background:#f7f1e3; box-shadow:0 2px 0 #b5a88a; }
.p-env { margin:14px auto 0; width:80%; padding:10px; text-align:center; font-size:13px; background:linear-gradient(#f7f0de,#eadfc5); clip-path:polygon(0 0,100% 0,96% 100%,4% 100%); box-shadow:0 3px 6px rgba(0,0,0,.2); }

/* ---- 化学：元素研究所（深海军蓝、金属框、橙色辉光） ---- */
.th-chemistry { --brand-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6'%3E%3Ccircle cx='12' cy='12' r='2' fill='black'/%3E%3Cellipse cx='12' cy='12' rx='10' ry='4'/%3E%3Cellipse cx='12' cy='12' rx='10' ry='4' transform='rotate(60 12 12)'/%3E%3Cellipse cx='12' cy='12' rx='10' ry='4' transform='rotate(-60 12 12)'/%3E%3C/svg%3E");
  color:#e8edf5; background:#101b2b; }
.th-chemistry .s-body { background:radial-gradient(ellipse at 50% 0,#1d2c44,#0f1a2a 70%); }
.th-chemistry .s-top { background:linear-gradient(#162338,#101b2b); border-bottom:1px solid #2d3d57; color:#f0f3f8; }
.th-chemistry .s-brand i { color:#f2a93b; }
.th-chemistry .s-head .art { background:var(--img-m-chem-head) right center / cover no-repeat; -webkit-mask-image:none; mask-image:none; }
.th-chemistry .s-head .kick { color:#f2a93b; }
.th-chemistry .s-tabs { background:linear-gradient(#152236,#0e1827); border-top:1px solid #2d3d57; color:#dfe6f0; }
.th-chemistry .s-tabs .tab.on { background:linear-gradient(#f7c063,#e89a2c); color:#2a1a05; box-shadow:inset 0 1px 0 rgba(255,255,255,.5), 0 2px 0 #9a5e12, 0 0 12px rgba(242,169,59,.5); }
.c-frame { position:relative; padding:14px 12px; border-radius:12px; border:7px solid transparent;
  background:linear-gradient(#152236,#111d2e) padding-box, linear-gradient(135deg,#e9edf2,#8c96a3 30%,#f5f7f9 50%,#7d8794 70%,#dfe4ea) border-box;
  box-shadow:inset 0 0 18px rgba(242,169,59,.45), 0 0 16px rgba(242,169,59,.35), 0 8px 16px rgba(0,0,0,.5); }
.th-chemistry .s-card, .th-chemistry .c-book, .th-chemistry .s-acc, .th-chemistry .s-empty, .th-chemistry .s-chap { background:linear-gradient(165deg,#1d2b42,#16233a); border:1px solid #3a4a64;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08), 0 3px 0 #0a1220, 0 6px 10px rgba(0,0,0,.35); color:#e8edf5; }
.th-chemistry .s-chap .no, .th-chemistry .s-chap .go, .c-book .k, .c-book .go { color:#f2a93b; }
.th-chemistry .sbtn { width:auto; padding:0 26px; color:#2a1a05; background:linear-gradient(#f9c96e,#eb9d2f); box-shadow:inset 0 1px 0 rgba(255,255,255,.55), 0 4px 0 #9a5e12, 0 0 14px rgba(242,169,59,.4); }
.th-chemistry .sbtn.off { opacity:.95; }
.th-chemistry .mixed .mx-art { display:none; }
.th-chemistry .s-link { border-top-color:rgba(255,255,255,.1); color:#f2a93b; }
.th-chemistry .s-empty svg { color:#38c6d6; }
.c-book { display:grid; gap:2px; width:100%; margin:0 0 10px; padding:12px 14px; border-radius:10px; text-align:left; font-family:var(--serif); transition:transform .08s; }
.c-book:active { transform:translateY(2px); }
.c-book .k { display:flex; justify-content:space-between; font-size:12.5px; font-weight:700; } .c-book .k svg { width:18px; height:18px; }
.c-book b { font-size:18px; } .c-book .pub { font-size:12.5px; opacity:.75; padding-bottom:6px; border-bottom:1px solid rgba(255,255,255,.12); }
.c-book .f { display:flex; justify-content:space-between; font-size:12.5px; margin-top:6px; } .c-book .go { font-weight:700; }

/* ---- 生物：生命探索馆（墨绿皮面、木框、米白、绿植） ---- */
.th-biology { --brand-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8'%3E%3Cpath d='M4 20C4 11 9 5 20 4c0 10-6 16-16 16z'/%3E%3Cpath d='M4 20l9-9'/%3E%3C/svg%3E");
  color:#1f3a2c; background:#f3efe4; }
.th-biology .s-body { background:linear-gradient(#f6f2e7,#eee8d9); }
.th-biology .s-top { background:linear-gradient(#2f6047,#21483a); border-bottom:2px solid #b89a5c; color:#f2ead6; box-shadow:0 3px 8px rgba(0,0,0,.25); }
.th-biology .s-head .art { background:var(--img-m-bio-head) right center / cover no-repeat; -webkit-mask-image:none; mask-image:none; }
.th-biology .s-head .kick { color:#2f6047; } .th-biology .s-head h2 { color:#1d3a2b; }
.th-biology .s-tabs { background:linear-gradient(#2f6047,#21483a); border-top:2px solid #b89a5c; color:#f2ead6; }
.th-biology .s-tabs .tab.on { background:linear-gradient(#e9f1df,#cfe0c5); color:#1f3a2c; box-shadow:inset 0 1px 0 #fff, 0 2px 0 #7f9a72, 0 3px 6px rgba(0,0,0,.25); }
.b-banner { display:flex; align-items:center; gap:10px; margin:0 0 12px; padding:12px 14px; border-radius:10px; border:5px solid #c9a676;
  background:linear-gradient(#fbf8f0,#efe9da); box-shadow:inset 0 1px 0 #fff, 0 3px 0 #9d7d4f, 0 6px 10px rgba(80,60,30,.2); }
.b-banner svg { width:26px; height:26px; flex:none; } .b-banner b { display:block; font-size:17px; } .b-banner small { display:block; font-size:12px; opacity:.75; }
.b-books { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.b-book { position:relative; aspect-ratio:1; padding:0; border:0; border-radius:8px; overflow:hidden; text-align:left; font-family:var(--serif); color:#1f3a2c; background:#e9e2cf;
  box-shadow:0 4px 0 #9d7d4f, 0 8px 12px rgba(80,60,30,.25); transition:transform .08s; }
.b-book:active { transform:translateY(3px); }
.b-book .cv { position:absolute; inset:0; background-image:var(--img-bio-preview); background-repeat:no-repeat; }
.b-book .tx { position:absolute; left:16%; top:9%; right:12%; } .b-book .tx small { display:block; font-size:13px; font-weight:700; } .b-book .tx em { display:block; font-style:normal; font-size:9px; opacity:.75; }
.b-book .tx b { display:block; font-size:16px; margin-top:6px; }
.b-book .go { position:absolute; left:18%; bottom:12%; font-size:13px; font-weight:700; }
.b-book.extra { display:flex; flex-direction:column; justify-content:center; gap:4px; padding:14px; background:linear-gradient(#fbf8f0,#eee7d6); }
.b-book.extra svg { width:24px; height:24px; color:#2f6047; } .b-book.extra .go { position:static; padding:4px 10px; border-radius:6px; background:linear-gradient(#e9f1df,#cfe0c5); box-shadow:0 2px 0 #7f9a72; width:max-content; }
.b-book.extra small { font-size:11px; opacity:.7; }
.b-frame { position:relative; margin:0 0 10px; padding:14px; border-radius:14px; border:7px solid #d0ad7c; background:linear-gradient(#fbf8f0,#f1ebdd);
  box-shadow:inset 0 0 0 1px #fff, 0 4px 0 #9d7d4f, 0 8px 14px rgba(80,60,30,.22); }
.b-scope { height:150px; margin:-6px -6px 6px; border-radius:8px; background:var(--img-m-bio-scope) left center / cover no-repeat; }
.b-mx { position:absolute; right:22px; top:22px; text-align:right; } .b-mx h3 { justify-content:flex-end; margin:0; }
.b-note { margin:6px 0; padding:6px 10px; border-radius:6px; background:#f3eee2; box-shadow:inset 0 0 0 1px #e2d8c2; font-size:13px; }
.th-biology .sbtn { color:#eef4e8; background:linear-gradient(#3b7a5a,#265a42); border:1.5px solid #1d4734; box-shadow:inset 0 1px 0 rgba(255,255,255,.3), inset 0 -2px 0 rgba(0,0,0,.25), 0 4px 0 #173a2a, 0 6px 10px rgba(0,0,0,.25); }
.th-biology .sbtn.off { opacity:.8; }
.th-biology .s-empty { background:#fff; border:1px solid #e6e0d0; } .th-biology .s-empty svg { color:#25a3b0; }
.b-pill { margin:0 0 10px; padding:8px 14px; border-radius:10px; background:linear-gradient(#fbf8f0,#efe9da); box-shadow:inset 0 1px 0 #fff, 0 2px 0 #c9b48e; font-size:12.5px; }
.b-pill b { font-size:15px; }
.th-biology .s-acc { border:5px solid #d0ad7c; background:linear-gradient(#f8f5ec,#ece5d4); box-shadow:inset 0 1px 0 #fff, 0 3px 0 #9d7d4f, 0 5px 8px rgba(80,60,30,.2); }
.b-chaps { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.b-chap { display:grid; gap:2px; padding:8px 10px; border-radius:8px; border:1px solid #d9c9a8; background:linear-gradient(#fdfbf6,#f2ecdf); text-align:left; font-family:var(--serif); color:inherit; box-shadow:0 2px 0 #c2a778; }
.b-chap small { font-size:11.5px; font-weight:700; } .b-chap b { font-size:14px; } .b-chap span { font-size:11px; opacity:.7; }
/* 账号页、管理员 */
.acct { display:flex; align-items:flex-start; justify-content:center; padding:calc(40px + var(--safe-t)) 16px 30px; background:linear-gradient(#d3e4f1,#efe6d2); }
.acct-card { width:100%; max-width:420px; padding:22px 18px; border-radius:16px; background:rgba(255,252,243,.96); box-shadow:0 3px 0 rgba(150,110,60,.25), 0 12px 24px rgba(14,33,48,.18); font-family:var(--serif); }
.acct-card.wide { max-width:640px; }
.acct-logo { width:72px; height:72px; margin:0 auto 6px; border-radius:16px; background:url("/v1/english/phone-upload/app/icon-192.png") center/cover; box-shadow:0 4px 10px rgba(0,0,0,.2); }
.acct-card h2 { text-align:center; margin:4px 0 14px; font-size:22px; }
.af-row { display:block; margin:0 0 12px; } .af-row span { display:block; font-size:14px; margin-bottom:4px; color:var(--ink2); }
.af-in { width:100%; height:44px; border-radius:10px; border:1px solid rgba(168,133,79,.55); padding:0 12px; font:16px var(--font); background:#fff; color:var(--ink); }
.af-in.link { height:80px; padding:8px; font-size:13px; resize:none; }
.af-msg { color:#c0392b; min-height:1.4em; font-size:14px; } .af-note { font-size:13px; color:var(--ink2); line-height:1.6; }
.acct .lbtn, .sheet .lbtn { margin-top:6px; }
.sheet { position:fixed; inset:0; z-index:40; display:flex; align-items:flex-end; justify-content:center; background:rgba(10,20,30,.45); }
.sheet-card { width:100%; max-width:480px; padding:18px 16px calc(18px + var(--safe-b)); border-radius:18px 18px 0 0; background:#fbf7ec; font-family:var(--serif); display:grid; gap:8px; }
.sheet-card h3 { margin:0; } .sheet-card p { margin:0; } .sheet-x { border:0; background:transparent; padding:10px; font:15px var(--serif); color:var(--ink2); }
.adm-top { display:flex; align-items:center; gap:8px; } .adm-top h2 { margin:0; flex:1; text-align:left; }
.adm-p { margin:14px 0 0; padding:12px; border-radius:12px; background:#fff; border:1px solid rgba(168,133,79,.3); display:grid; gap:8px; }
.adm-p .hd { display:flex; flex-wrap:wrap; gap:8px; align-items:baseline; } .adm-p .hd b { font-size:17px; } .adm-p .hd span { font-size:12.5px; color:var(--ink2); }
.adm-p .hd .u { margin-left:auto; color:var(--ink); }
.mini { border:1px solid rgba(168,133,79,.6); background:#fbf7ec; border-radius:8px; padding:4px 10px; font:13px var(--serif); }
/* 登录记录：固定高度的框里滚动（家长 10-22），最新在上 */
.adm-logs { height:320px; overflow-y:auto; -webkit-overflow-scrolling:touch; overscroll-behavior:contain; border:1px solid rgba(168,133,79,.3);
  border-radius:8px; padding:4px 8px; font-size:13px; color:var(--ink2); background:#fffdf7; }
.adm-log { display:grid; grid-template-columns:auto auto 1fr; gap:8px; padding:5px 0; border-bottom:1px dashed rgba(168,133,79,.25); align-items:baseline; }
.adm-log .t { font-variant-numeric:tabular-nums; white-space:nowrap; } .adm-log .e { color:var(--ink); white-space:nowrap; }
.adm-log .u { text-align:right; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0; }
.ln .wrong, .q .wrong { color:#ff8a80; font-weight:700; text-decoration:underline wavy rgba(255,138,128,.7); }
/* 话筒圆球：默认蓝色、收音中变绿并有呼吸动效（同电脑端） */
.cbtn.mic { background:linear-gradient(#5b9cf0,#2f6fd6); border-color:#9cc2ff; color:#fff; }
.cbtn.mic.on { background:linear-gradient(#4cc97a,#22994f); border-color:#a8f0c4; animation:micpulse 1.1s ease-in-out infinite; }
@keyframes micpulse { 0%,100% { box-shadow:0 0 0 0 rgba(76,201,122,.55); } 50% { box-shadow:0 0 0 8px rgba(76,201,122,0); } }
/* 生物、化学：立体书本（Codex 照电脑端画的书，书名网页叠加） */
.b-book.real { aspect-ratio:1024/1100; background:#f6efdf; box-shadow:none; overflow:hidden; }
.b-book.real .cv { background-size:100% auto; background-position:50% 55%; background-repeat:no-repeat; }
.b-book.real .tx { left:25%; top:12%; right:14%; } .b-book.real .tx b { font-size:17px; margin-top:4px; }
.b-book.real .go { left:25%; bottom:33%; padding:3px 8px; border-radius:6px; background:rgba(233,241,223,.95); box-shadow:0 2px 0 #7f9a72; }
.b-book.real:active { transform:translateY(3px) scale(.99); }
.c-books { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.c-book3d { position:relative; aspect-ratio:1024/1536; padding:0; border:0; border-radius:6px; overflow:hidden; background:#101b2b; font-family:var(--serif); color:#f4e7c8; transition:transform .08s; }
.c-book3d:active { transform:translateY(3px); }
.c-book3d .cv { position:absolute; inset:0; background-size:100% 100%; }
.c-book3d .tx { position:absolute; left:20%; right:10%; top:24%; text-align:center; text-shadow:0 1px 3px rgba(0,0,0,.6); }
.c-book3d .tx small { display:block; font-size:11.5px; color:#f2c46a; font-weight:700; } .c-book3d .tx b { display:block; font-size:16px; margin-top:4px; }
.c-book3d .f { position:absolute; left:8%; right:8%; bottom:6%; font-size:11px; text-align:center; color:#f2c46a; text-shadow:0 1px 2px #000; }
/* ================= 上课黑板：电脑端同款（深藏青金边黑板、状态行、圆球输入） ================= */
.classroom { background:var(--cream); }
.kb-page { height:100%; display:flex; flex-direction:column; gap:8px; padding:0 0 calc(8px + var(--safe-b));
  background-color:var(--cream); background-image:var(--img-paper); background-size:378px auto; font-family:var(--serif); color:var(--ink); }
.kb-top { flex:none; display:flex; align-items:center; justify-content:space-between; padding:calc(6px + var(--safe-t)) 8px 6px; min-height:54px; color:#e9d3a2;
  background-color:var(--navy); background-image:linear-gradient(rgba(255,255,255,.05),rgba(0,0,0,.15)), var(--img-leather); background-size:auto,205px auto; border-bottom:2px solid #b8955a; }
.kb-top .tb { color:#e9d3a2; min-width:44px; height:40px; justify-content:center; } .kb-top .tb svg { width:24px; height:24px; }
.kb-logo { flex:1; height:46px; background:var(--img-logo) center/auto 160% no-repeat;
  -webkit-mask-image:radial-gradient(ellipse 34% 62% at center,#000 60%,transparent 100%); mask-image:radial-gradient(ellipse 34% 62% at center,#000 60%,transparent 100%); }
.kb-page.th-wenyan .kb-top { background:linear-gradient(#f4ecdc,#e9dec7); color:#2b2a26; border-bottom-color:#cdbb98; } .kb-page.th-wenyan .kb-top .tb { color:#2b2a26; }
.kb-page.th-wenyan .kb-logo { background:none; }
.kb-title { flex:none; display:flex; align-items:baseline; gap:10px; margin:0 10px; padding:9px 14px; border-radius:10px; background:rgba(255,252,243,.92);
  box-shadow:inset 0 1px 0 #fff, 0 2px 0 rgba(150,110,60,.2); }
.kb-title b { font-size:16px; } .kb-sub { font-size:13px; color:var(--ink2); padding-left:10px; border-left:1px solid rgba(18,41,64,.25); }
.kb-tools { flex:none; display:flex; align-items:center; gap:8px; margin:0 10px; }
.kb-tools .sp { flex:1; }
.kb-pill { display:flex; align-items:center; gap:6px; height:36px; padding:0 14px; border-radius:10px; border:1px solid rgba(18,41,64,.18); background:#fff;
  font:600 14px var(--serif); color:var(--ink); box-shadow:0 2px 0 rgba(18,41,64,.12); }
.kb-pill svg { width:17px; height:17px; } .kb-pill:active { transform:translateY(1px); box-shadow:none; }
.kb-sq { width:40px; height:36px; border-radius:10px; border:1px solid rgba(18,41,64,.18); background:#fff; color:var(--ink); display:flex; align-items:center; justify-content:center; padding:0;
  box-shadow:0 2px 0 rgba(18,41,64,.12); }
.kb-sq svg { width:20px; height:20px; } .kb-sq:disabled { opacity:.4; }
.kb-board { position:relative; flex:1; min-height:0; display:flex; flex-direction:column; margin:0 10px; border-radius:14px; overflow:hidden; color:#eef3f5;
  background:radial-gradient(ellipse at 30% 0%, #10252c 0%, #0a1a1f 55%, #071317 100%);
  box-shadow:0 0 0 2px #c8a45e, 0 0 0 4px rgba(120,90,40,.35), 0 8px 18px rgba(0,0,0,.35), inset 0 0 30px rgba(0,0,0,.55); }
.kb-board .pin { background:transparent; border-bottom:1px solid rgba(255,255,255,.12); padding:14px 16px 10px; max-height:42%; }
.kb-board .pin .word { color:#2fc6e8; font:800 32px var(--font); letter-spacing:.5px; }
.kb-board .pin .q { color:#fff; font:700 19px/1.45 var(--font); }
.kb-board .pin .ask { color:rgba(238,243,245,.72); font-size:15px; margin-top:6px; }
.kb-board .pin .opts { color:#fff; }
.row .occ { margin-top:6px; padding-top:6px; border-top:1px dashed rgba(0,0,0,.15); }   /* 我的词本：点开看原句和来源 */
.row .occ p { margin:0 0 2px; font-size:14.5px; line-height:1.5; }
.kb-board .pin .passage { margin-top:6px; color:rgba(238,243,245,.88); font-size:15px; line-height:1.6; white-space:pre-line; overflow-wrap:anywhere; }   /* 英语文章题原文 */
.kb-board .flow { padding:12px 16px 16px; font-size:16.5px; }
.kb-board .ln { color:#eef3f5; } .kb-board .ln .em { color:var(--violet); } .kb-board .ln.answer { color:var(--yellow); }
.kb-board .me .tag { background:var(--mint); } .kb-board .think { color:rgba(238,243,245,.6); }
.kb-board .history { background:#0a1a1f; }
.kb-status { flex:none; display:flex; align-items:center; gap:8px; margin:0 10px; padding:6px 12px; border-radius:8px; background:rgba(255,248,226,.9); color:#9a6b1f; font-size:13px; font-weight:600; }
.kb-status i { width:8px; height:8px; border-radius:50%; background:#5b7cf0; flex:none; }
.kb-dock { position:relative; flex:none; display:flex; align-items:center; gap:8px; margin:6px 10px 0; padding:10px 10px; border-radius:16px; background:#fff;
  box-shadow:0 0 0 1px rgba(91,156,240,.25), 0 4px 14px rgba(40,90,160,.18); }
.kb-dock .ask-in { flex:1; min-width:0; height:48px; max-height:110px; border:0; border-radius:12px; background:#f5f8fc; color:var(--ink); font:15px var(--font); padding:8px 10px; }
.kb-dock .ask-in::placeholder { color:#8a98aa; font-size:13.5px; }
.orb { flex:none; width:66px; height:66px; margin:-26px 2px 0; border-radius:50%; border:0; padding:0; cursor:pointer;
  background:radial-gradient(circle at 35% 30%, #ffffff 0%, #d7e6ff 18%, #8fb1ff 45%, #5b7cf0 72%, #4058c8 100%);
  box-shadow:0 0 0 5px #fff, 0 0 22px 6px rgba(110,150,255,.55), inset 0 -6px 12px rgba(40,60,160,.35); transition:transform .1s; }
.orb:active { transform:scale(.96); }
.orb.on { background:radial-gradient(circle at 35% 30%, #ffffff 0%, #d9ffe6 18%, #7fe0a3 45%, #2fb366 72%, #1f8a4c 100%);
  box-shadow:0 0 0 5px #fff, 0 0 24px 8px rgba(80,210,130,.6), inset 0 -6px 12px rgba(20,100,50,.35); animation:micpulse 1.1s ease-in-out infinite; }
.kb-send { flex:none; display:flex; align-items:center; gap:4px; height:40px; padding:0 12px; border-radius:20px; border:0; background:linear-gradient(#5b9cf0,#2f6fd6); color:#fff; font:700 14px var(--font); }
.kb-send svg { width:16px; height:16px; } .kb-send:disabled { background:#dfe5ee; color:#9aa6b6; }
.kb-pause { flex:none; display:flex; align-items:center; gap:4px; height:40px; padding:0 12px; border-radius:20px; border:1px solid rgba(18,41,64,.25); background:#fff; color:var(--ink); font:700 14px var(--font); }
.kb-pause svg { width:15px; height:15px; }
@media (min-width: 900px) {   /* 电脑浏览器：黑板居中、宽度适中 */
  .kb-page { max-width:980px; margin:0 auto; }
}

/* =====================================================================================================
   设计规范（2026-10-23 整体设计审视 规范.css，和电脑端共用同一组数值）：字号 6 档、间距 4 的倍数、圆角 4 档、阴影 3 级、
   每科 4 色、全软件一块黑板、按钮三档（主按钮 4px 厚边按下下沉）。放在最后，覆盖前面各页的零散写法。
   ===================================================================================================== */
:root {
  --fs-title:24px; --fs-section:18px; --fs-card:16px; --fs-body:16px; --fs-meta:13px; --fs-num:24px; --fs-board:17px; --fs-board-q:19px;
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px; --s7:48px;
  --r-chip:6px; --r-btn:10px; --r-card:14px; --r-panel:20px;
  --e1:0 1px 3px rgba(0,0,0,.12); --e2:0 4px 12px rgba(0,0,0,.14); --e3:0 10px 28px rgba(0,0,0,.18);
  --board:#161d22; --board-frame:#3a3f44; --board-text:#f2f1ec; --board-dim:rgba(242,241,236,.55);
  --board-key:#b9a7f0; --board-now:#f2c66d; --board-lab:#f0a35e; --me-bg:#9fd3c0; --me-text:#10332a;
  --font-sans:-apple-system,"PingFang SC","Helvetica Neue",sans-serif; --font-serif:"Songti SC","STSong",serif;
  --main:#1f3354; --lip:#0e1828; --paper:#f4ede0; --page:#efe6d6; --accent:#b08a4e; --on-main:#fff;
}
@media (min-width:900px) { :root { --fs-title:28px; --fs-section:20px; --fs-card:17px; --fs-body:15px; --fs-num:28px; --fs-board:20px; --fs-board-q:22px; } }
.th-en, .en, .en-screen { --main:#1f3354; --lip:#0e1828; --paper:#f4ede0; --page:#efe6d6; --accent:#b08a4e; --on-main:#fff; }
.th-math { --main:#2f5bea; --lip:#1d3fb0; --paper:#ffffff; --page:#eef1f6; --accent:#2f5bea; --on-main:#fff; }
.th-physics { --main:#3f8fa3; --lip:#2b6a7a; --paper:#ffffff; --page:#eaf2f5; --accent:#3f8fa3; --on-main:#fff; }
.th-chemistry { --main:#e9a94a; --lip:#a8731f; --paper:#1c2a40; --page:#16223a; --accent:#e9a94a; --on-main:#1c1408; }
.th-biology { --main:#2f6b4f; --lip:#1c4633; --paper:#fbf8f0; --page:#f1ecdf; --accent:#2f6b4f; --on-main:#fff; }
.th-wenyan { --main:#2f5a49; --lip:#1d3c30; --paper:#f8f2e4; --page:#efe5d0; --accent:#8a3b2a; --on-main:#fff; }

/* 页面标题、区块标题、数据小字 */
.s-head h2, .en-head h2, .kb-title b { font:700 var(--fs-title)/1.3 var(--font-serif); letter-spacing:1px; }
.s-sec, .s-card h3, .plate h3 { font:600 var(--fs-section)/1.4 var(--font-serif); }
.s-count, .kb-sub, .s-chap .f, .muted { font-size:var(--fs-meta); }

/* 主按钮：主题色实底，底部 4px 同色加深厚边；按下下沉 3px，厚边剩 1px；不可点＝同形状 40% 透明、去厚边 */
.sbtn, .lbtn, .kb-send, .s-start {
  display:flex; align-items:center; justify-content:center; gap:var(--s2); min-height:44px; height:auto; padding:0 22px; border:0; border-radius:var(--r-btn);
  background:var(--main); color:var(--on-main); font:600 var(--fs-card)/1 var(--font-sans); letter-spacing:0;
  box-shadow:0 4px 0 var(--lip), var(--e1); transform:translateY(0); transition:transform .08s, box-shadow .08s; }
.sbtn::after, .lbtn::after { display:none; }
.sbtn:active:not(:disabled), .lbtn:active:not(:disabled), .kb-send:active:not(:disabled), .s-start:active { transform:translateY(3px); box-shadow:0 1px 0 var(--lip); opacity:1; }
.sbtn:disabled, .sbtn.off, .lbtn.off, .kb-send:disabled { opacity:.4; box-shadow:none; background:var(--main); color:var(--on-main); }
.s-start { width:100%; margin:var(--s3) 0 var(--s4); }
/* 次按钮：纸色底、主题色字、1.5px 细边＋3px 浅厚边；按下下沉 2px */
.kb-sq, .kb-pause, .lbtn.small {
  display:flex; align-items:center; justify-content:center; gap:var(--s1); height:36px; min-height:36px; width:auto; padding:0 var(--s4); border:0; border-radius:var(--r-btn);
  background:var(--paper); color:var(--main); font:600 var(--fs-body)/1 var(--font-sans);
  box-shadow:inset 0 0 0 1.5px color-mix(in srgb, var(--main) 35%, transparent), 0 3px 0 color-mix(in srgb, var(--main) 30%, transparent); transition:transform .08s, box-shadow .08s; }
.kb-sq:active:not(:disabled), .kb-pause:active { transform:translateY(2px); box-shadow:inset 0 0 0 1.5px color-mix(in srgb, var(--main) 35%, transparent), 0 1px 0 color-mix(in srgb, var(--main) 30%, transparent); }
.kb-sq:disabled { opacity:.4; box-shadow:inset 0 0 0 1.5px color-mix(in srgb, var(--main) 35%, transparent); }
.kb-pause { height:44px; }
/* 文字按钮：只在工具栏用 */
.kb-pill { height:36px; padding:0 var(--s2); border:0; background:transparent; box-shadow:none; color:var(--main); font:600 15px/1 var(--font-sans); }
.kb-pill:active { opacity:.7; transform:none; }

/* 空状态：一个线性图标＋一句粗字 */
.s-empty, .empty { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:var(--s2); padding:var(--s6) var(--s4); color:inherit; opacity:.7; font-size:var(--fs-body); text-align:center; }
.s-empty svg, .empty svg { width:28px; height:28px; }

/* ---- 黑板页（全软件一块黑板，六科不换色） ---- */
.kb-page { background:var(--page); background-image:none; font-family:var(--font-sans); gap:var(--s2); }
.kb-page.th-chemistry { color:#f1ece2; }
.kb-title { margin:0 var(--s4); padding:var(--s2) 0 0; background:transparent; box-shadow:none; align-items:center; gap:var(--s3); }
.kb-title .sp { flex:1; }
.kb-title b { font-size:var(--fs-section); }
.kb-sub { border:0; padding:0; color:inherit; opacity:.6; }
.kb-tools { margin:0 var(--s3); gap:var(--s1); }
.kb-board { margin:0 var(--s4); border-radius:var(--r-panel); background:var(--board); box-shadow:0 0 0 3px var(--board-frame), var(--e2); color:var(--board-text); }
.kb-board .pin { border-bottom:1px solid rgba(242,241,236,.12); padding:var(--s4) var(--s4) var(--s3); }
.kb-board .pin .q { color:var(--board-text); font:700 var(--fs-board-q)/1.5 var(--font-sans); }
.kb-board .flow { padding:var(--s3) var(--s4) var(--s4); font-size:var(--fs-board); line-height:1.6; }
.kb-board .ln { color:var(--board-text); } .kb-board .ln .em { color:var(--board-key); } .kb-board .ln.dim, .kb-board .think { color:var(--board-dim); }
.kb-board .me .tag { background:var(--me-bg); color:var(--me-text); border-radius:var(--r-chip); }
.kb-board .history { background:var(--board); }
.kb-status { margin:0 var(--s4); padding:0; background:transparent; color:inherit; opacity:.7; font:var(--fs-meta) var(--font-sans); }
.kb-dock { margin:var(--s5) var(--s4) 0; padding:22px var(--s3) var(--s3); border-radius:var(--r-card); background:var(--paper); box-shadow:var(--e2); gap:var(--s2); }
.kb-dock .ask-in { height:44px; border-radius:var(--r-btn); background:var(--page); font:var(--fs-body) var(--font-sans); }
.kb-dock .ask-in::placeholder { font-size:var(--fs-body); }
.kb-dock .orb { position:absolute; left:50%; top:-38px; margin:0; width:56px; height:56px; transform:translateX(-50%); }
.kb-dock .orb:active { transform:translateX(-50%) scale(.96); }
.kb-send { height:44px; padding:0 var(--s4); }
.kb-send svg, .kb-pause svg { display:none; }
.th-chemistry .kb-dock .ask-in { color:#f1ece2; }
/* 理科：本册目录 */
.s-lessons { display:grid; gap:var(--s2); }
.s-lesson b { font:600 var(--fs-card)/1.4 var(--font-sans); }
/* 物理三页同一个玻璃书架场景（家长 10-23） */
.p-glass { padding:var(--s4) var(--s3); border-radius:var(--r-card); background:linear-gradient(#eef5fb,#dbe8f3);
  box-shadow:inset 0 0 0 6px rgba(255,255,255,.7), inset 0 2px 8px rgba(30,70,110,.15); }
.p-glass .p-card { background:rgba(255,255,255,.75); }
/* 黑板工具栏：电脑一行，手机折两行（查看对话、重置本题在第二行） */
.kb-title { flex-wrap:wrap; row-gap:var(--s1); }
.kb-title .kb-tools { margin:0; }
@media (max-width:899px) { .kb-title .kb-tools { order:9; flex-basis:100%; margin-left:calc(-1 * var(--s2)); } }
/* 首页右上角“注册”“登录”（次按钮，小号） */
.auth2 { position:absolute; display:flex; gap:var(--s2); z-index:3; }
.auth2 .kb-sq { height:32px; min-height:32px; padding:0 12px; font-size:14px; text-decoration:none; }
.acct-alt { margin:var(--s3) auto 0; width:max-content; text-decoration:none; }
/* 管理员：账号授权开关 */
.adm-accts { display:grid; gap:var(--s2); }
.adm-acct { display:flex; align-items:center; gap:var(--s2); padding:var(--s2) 0; border-bottom:1px solid rgba(0,0,0,.08); }
.adm-acct span:first-child { flex:1; font-weight:600; }
.adm-acct .sw-l { font-size:var(--fs-meta); opacity:.7; }
.adm-acct .adm-on { display:flex; align-items:center; gap:var(--s2); }
.adm-ai { font:inherit; padding:4px 8px; border-radius:8px; border:1px solid rgba(0,0,0,.15); background:#fff; }
.adm-sw { appearance:none; width:44px; height:26px; border-radius:13px; background:#cfd5dd; position:relative; cursor:pointer; transition:background .15s; margin:0; }
.adm-sw::after { content:""; position:absolute; top:3px; left:3px; width:20px; height:20px; border-radius:50%; background:#fff; box-shadow:var(--e1); transition:left .15s; }
.adm-sw:checked { background:#2f9e5b; } .adm-sw:checked::after { left:21px; }
/* 手机竖屏黑板（家长定稿 batch4：占满、顶部一行在黑板里、上下两块、圆球 48、输入框 32 高字号 16、底部不留空白）和答疑解惑共用一份，
   在 web_beta/board.css（index.html 在本文件后面引它）。2026-10-23 原样搬过去，数值一个没改。 */
/* 收音状态不写字（家长 10-23）：状态行不显示；收音中圆球外圈流光转动 */
.kb-page .kb-status { display:none; }
.orb.on::after { content:""; position:absolute; inset:-5px; border-radius:50%; pointer-events:none;
  background:conic-gradient(from 0deg, rgba(76,201,122,0) 0deg, #4cc97a 120deg, #b9f5cf 180deg, rgba(76,201,122,0) 300deg);
  -webkit-mask:radial-gradient(farthest-side, transparent calc(100% - 3px), #000 calc(100% - 3px)); mask:radial-gradient(farthest-side, transparent calc(100% - 3px), #000 calc(100% - 3px));
  animation:orbspin 1s linear infinite; }
@keyframes orbspin { to { transform:rotate(360deg); } }
/* 原地点亮：字一直是正常颜色（家长 10-24：不要浅浅的黑），正在念的字下面一根细线；没有字时间整行画线 */
.kb-board .ln, .kb-board .pin .q { transition:opacity .15s; }
.kb-board .sp-hide { display:none !important; }   /* 讲到哪段才出哪段：还没念到的段不露（家长 11-02，app.js spHide 一处） */
.kb-board .sp-line { text-decoration:underline 2px var(--board-now); text-underline-offset:4px; }
.sp-bar { position:absolute; height:2px; background:var(--board-now); pointer-events:none; }
/* 家长 10-23 iPhone：顶栏底图从屏幕最顶端铺下来（加到主屏幕时页面画到状态栏下，顶栏的上内边距让出安全区），
   左右返回键和右侧占位对称、不被挤出屏幕；统计卡三张同字号、数字不截断 */
.en-top, .s-top, .kb-top { overflow:hidden; padding-left:calc(8px + env(safe-area-inset-left)); padding-right:calc(8px + env(safe-area-inset-right)); }
.en-top .tb, .s-top .tb { flex:0 0 56px; }
.tiles.three .tile .v { font-size:clamp(16px, 4.8vw, 21px); overflow:visible; text-overflow:clip; letter-spacing:0; }
.tiles.three .tile, .tiles.four .tile { padding-left:6px; padding-right:6px; text-align:center; }
/* 登录注册页：状态栏区域（白字）下面铺一条和顶栏同色的深底（上课黑板的那条在 board.css） */
.acct { background:linear-gradient(#0c1e2c, #0c1e2c) 0 0 / 100% var(--safe-t) no-repeat, linear-gradient(#d3e4f1, #efe6d2); }

/* 讲解分段（家长 10-23“讲解的时候别堆砌在一起”）：服务器按讲稿结构分好的段，每段一块，段间留距 */
.ln .pp { display:block; } .ln .pp + .pp { margin-top:8px; }
.kb-board .flow .kb-more { margin-top:8px; padding:0 18px; }

/* ---------- 理科黑板（网页理科补齐 10-22）：课本原页、配图、你当时答、放大看、公式 ---------- */
.kb-board .pin .tb-page { position:relative; overflow-x:hidden; overflow-y:auto; -webkit-overflow-scrolling:touch; overscroll-behavior:contain; margin:8px auto 2px; max-width:100%; border-radius:6px; background:#fff; box-shadow:0 1px 4px rgba(0,0,0,.35); cursor:zoom-in; }
/* G2-01：原页还没画出来时的占位（白底、轻微明暗变化，不写字） */
.tb-page.loading { width:100%; height:120px; animation:tbWait 1.4s ease-in-out infinite; }
.tb-zoom .tb-page.loading { width:90vw; height:60vh; }
@keyframes tbWait { 0%, 100% { opacity:.55; } 50% { opacity:.9; } }
.tb-page .tb-clip { position:relative; overflow:hidden; }
.tb-page .tb-inner { position:absolute; left:0; top:0; transform-origin:0 0; }
.tb-page canvas { display:block; }
/* 预习顶栏（家长 10-25）：左课本原文＋插图，右整页小图；高度跟着内容，最多屏幕三分之一（15:47），再多在顶栏里上下滑、底边渐隐；行距、边距同黑板 */
.kb-board .pin:has(.tb-top) { max-height:33vh; max-height:33dvh; }
.kb-board .pin.tb-more { -webkit-mask-image:linear-gradient(to bottom, #000 calc(100% - 36px), transparent); mask-image:linear-gradient(to bottom, #000 calc(100% - 36px), transparent); }
.kb-board .pin .tb-top { display:flex; gap:10px; align-items:flex-start; }   /* 顶栏文字、插图占满整个宽度（整页按钮在工具栏，家长 10-25 16:18） */
.kb-book:empty { display:none; }
.kb-page { --subj:#1d4fd8; } .kb-page.th-physics { --subj:#0f6b86; } .kb-page.th-chemistry { --subj:#b45309; } .kb-page.th-biology { --subj:#2f7a4f; }   /* 课本整页按钮的主题色（同各科页签选中色） */
.kb-bookbtn { display:inline-grid; place-items:center; width:34px; height:30px; margin-left:6px; padding:0; border:2px solid var(--subj, var(--board-key)); border-radius:8px; background:color-mix(in srgb, var(--subj, var(--board-key)) 14%, transparent); color:var(--subj, var(--board-key)); vertical-align:middle; cursor:pointer; }
.kb-bookbtn svg { width:20px; height:20px; stroke-width:2.2; }
.kb-board .pin .tb-left { flex:1; min-width:0; }
.kb-board .pin .tb-left.side { display:flex; gap:12px; align-items:flex-start; }   /* 一张图、两边都看得清：图在文字旁边 */
.kb-board .pin .tb-left.side .tb-read { flex:1; min-width:0; }
.kb-board .pin .tb-text .tb-p { margin:0 0 4px; }   /* 课本原文排版：段落、分条、标签、单独成行的公式；概念词是 .em（黑板知识点色） */
.kb-board .pin .tb-text .tb-item { display:flex; gap:.3em; margin:2px 0 2px 1em; }
.kb-board .pin .tb-text .tb-item > .tb-lab { flex:none; }
.kb-board .pin .tb-text .tb-lab { font-weight:800; color:var(--board-lab); margin-right:.2em; }
.kb-board .pin .tb-text .tb-eq { text-align:center; margin:6px 0; }
.kb-board .pin .tb-text .em { color:var(--board-key); font-weight:800; }
.kb-board .pin .tb-h { color:var(--board-text); font:800 calc(var(--fs-board) * 1.2)/1.4 var(--font-sans); margin:0 0 6px; }   /* 课本原文里的标题：单独一行、大一号加粗 */
.kb-board .pin .tb-figs { flex:none; display:flex; flex-wrap:wrap; gap:0 12px; align-items:flex-end; }   /* 几张图并排，放得下就一行（一题配两张图时后一张不被挤到顶栏下面看不到，家长 11-02） */
.kb-board .pin .tb-text { color:var(--board-text); font:600 var(--fs-board)/1.6 var(--font-sans); overflow-wrap:anywhere; }
.kb-board .pin .tb-figs .tb-page { margin:8px 0 2px; }
.kb-board .pin .tb-left.side .tb-figs .tb-page { margin-top:2px; }
.kb-board .pin .figs { display:flex; gap:8px; margin-top:8px; overflow-x:auto; }
.kb-board .pin .figs img { flex:none; max-height:120px; max-width:70%; border-radius:6px; background:#fff; cursor:zoom-in; }
.kb-board .pin:has(.exam-figs) { max-height:72%; overscroll-behavior:contain; }   /* 真题原卷图：老师开口后下面留给讲解，看不全时渐隐、在题目栏里滑 */
.kb-board:has(.flow:empty) .pin:has(.exam-figs) { flex:0 1 auto; min-height:0; max-height:none; border-bottom:0; }   /* 老师还没讲：整块黑板都给题目 */
.kb-board:has(.pin .exam-figs) .flow:empty { flex:1 0 64px; }   /* 底下让开语音球 */
.kb-board .pin .exam-figs { display:flex; flex-direction:column; align-items:center; gap:8px; margin:8px 0; }   /* 题干下面居中，宽度跟手机 */
.kb-board .pin .exam-figs img { display:block; width:auto; height:auto; max-width:100%; max-height:30vh; max-height:30dvh; background:#fff; border-radius:6px; cursor:zoom-in; }
.kb-board .pin .exam-figs.many { display:grid; grid-template-columns:1fr 1fr; align-items:center; justify-items:center; }   /* 三张及以上两列，按顺序排 */
.kb-board .pin .exam-figs.many img { max-height:none; }
.kb-board .pin .then { margin-top:6px; color:rgba(255,255,255,.8); font:500 15px/1.5 var(--font); }
.kb-board .pin .then.why { color:#f2a93b; }
.tb-zoom { position:fixed; inset:0; z-index:50; display:flex; align-items:flex-start; justify-content:center; overflow:auto; padding:56px 12px 24px; background:rgba(8,14,20,.92); }
.tb-zoom .tb-page { position:relative; overflow:hidden; background:#fff; border-radius:4px; cursor:default; }
.tb-zoom img.big { max-width:100%; height:auto; background:#fff; border-radius:4px; }
.tb-zoom .tb-x { position:fixed; top:calc(10px + env(safe-area-inset-top)); right:12px; width:40px; height:40px; display:grid; place-items:center; border:0; border-radius:20px; background:rgba(255,255,255,.14); color:#fff; }
.tb-zoom .tb-x svg { width:22px; height:22px; }
.kb-board .katex { font-size:1.05em; }
.kb-board .katex-display { margin:.3em 0; overflow-x:auto; overflow-y:hidden; }
.kb-board .nw { white-space:nowrap; }
.kb-board .me.waiting { opacity:.45; }   /* 老师在讲时孩子说的话：先灰着排队，轮到了变正常（总单 24） */
.kb-board .reread { display:inline-block; margin:2px 0 6px; padding:2px 10px; border:1px solid rgba(242,241,236,.4); border-radius:8px; background:transparent; color:var(--board-text, #f2f1ec); font-size:14px; }   /* 这句没念出来：点一下重念（总单 3） */   /* 行内公式和后面的标点不拆开（math.js keepPunctuation） */
/* 家长 10-24：长公式不截——太宽的那一行可以左右滑（上课黑板、答疑解惑同一条） */
.kb-board .flow .ln, .kb-board .pin .q { max-width:100%; overflow-x:auto; overflow-y:hidden; padding-bottom:.12em; }
/* 2026-10-22 网页语文补齐：每日字词原句里按位置标出目标字（电脑 WenyanDailyWordView.swift:317-323 标色加下划线） */
.kb-board .pin .q u.hit { color:#ffd27a; text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:4px; }
/* 家长 10-23 21:47 iPhone 从桌面图标打开：整页比屏幕短一截、底下空出米色（时有时无）。iOS 主屏幕模式下 100dvh 有时少算状态栏那一截
   （刚启动、键盘弹出再收起、从后台切回来）。最外层改成铺满整个屏幕（fixed＋上下左右贴边），.screen 等仍按 #app 的 100% 算。 */
html, body { height:auto; }
#app { position:fixed; top:0; right:0; bottom:0; left:0; height:auto; }
/* 语文课前预习新版面（规矩本第 71 条，10-23）：上方整节原文、当前句标黄；黑板里每句开头一行原句 */
.kb-board .pin .q.sec { font:600 17px/1.6 var(--font); color:var(--chalk2, #e8e4d8); }
.kb-board .pin .q.sec span.cur { color:#ffd27a; background:rgba(255,210,122,.16); border-radius:3px; }
.kb-board .flow .ln.seg { color:#ffd27a; font-weight:700; margin-top:14px; }
/* 答疑解惑（家长 10-24 并进主程序，app.js helpBoard）：黑板、输入栏都是上课那一套（.kb-*），这里只有多出来的拍照 */
.kb-board .ln .fig { display:block; max-width:100%; height:auto; margin:6px 0; border-radius:6px; background:#fff; cursor:zoom-in; }   /* 黑板上的图（diagram.py 画的 SVG） */
.kb-help .pin:empty { display:none; }   /* 还没有题目时题目区不占地方 */
.kb-help .flow > .pin { max-height:none; overflow:visible; padding:0 0 var(--s3); margin-bottom:var(--s3); }   /* 答疑题目在讲解区最上面，跟着滑走（家长 10-24 晚） */
.kb-dock .kb-cam { padding:0; width:40px; justify-content:center; }
.kb-dock .kb-cam svg { display:block; width:18px; height:18px; }   /* 暂停、发送的图标设计规范里藏了，拍照只有图标 */
.kb-board .kb-pend { position:absolute; left:10px; bottom:10px; z-index:2; display:flex; gap:6px; }   /* 待发的照片：黑板左下角（圆球左边） */
.kb-board .kb-pend[hidden] { display:none; }
.kb-pend .p { position:relative; width:44px; height:44px; border-radius:8px; overflow:hidden; border:1px solid rgba(255,255,255,.5); background:#fff; }
.kb-pend .p img { width:100%; height:100%; object-fit:cover; display:block; }
.kb-pend .p button { position:absolute; top:1px; right:1px; width:18px; height:18px; border:0; border-radius:50%; padding:0; background:rgba(20,30,26,.75); color:#fff; display:flex; align-items:center; justify-content:center; }
.kb-pend .p button svg { width:12px; height:12px; }
.kb-help .me .pics { width:100%; display:flex; gap:6px; padding-left:44px; margin-top:4px; }
.kb-help .me .pics img { width:54px; height:54px; object-fit:cover; border-radius:6px; border:1px solid rgba(255,255,255,.35); background:#fff; }
.kb-help .me { flex-wrap:wrap; }
.kb-help .history .item[role="button"] { cursor:pointer; } .kb-help .history .item.cur .q { color:#ffd27a; }
@media (max-width:899px) { .kb-dock .kb-cam { width:32px; } }

/* ==== 黑板配色（家长 10-24 晚，照豆包截图）：浅灰底、黑字；其余照旧，知识点、答案、正在念的字配浅底的颜色。全软件黑板（上课、答疑）都走这一份 ==== */
:root { --board:#f4f4f5; --board-text:#1c1c1e; --board-dim:rgba(28,28,30,.5); --board-key:#5b3fc4; --board-now:#c2410c; --board-ans:#b45309; --board-ask:#1d5fbf; --board-lab:#c2410c; --board-line:rgba(0,0,0,.08); }
.kb-board { background:var(--board); color:var(--board-text); }
.kb-board .ln, .kb-board .pin .q, .kb-board .pin .opts, .kb-board .me .say, .kb-mbar, .kb-ib { color:var(--board-text); }
.kb-board .ln .em { color:var(--board-key); }
.kb-board .ln.qn { color:var(--board-ask); }   /* 老师出的问题（“问题：……”，家长 10-25：和浅灰底、淡紫知识点、橙棕答案协调的蓝） */
.kb-board .ln .ans, .kb-board .ln .ans .em, .kb-board .ln.answer, .kb-board .flow .ln.seg { color:var(--board-ans); }
.kb-board .pin .word { color:#0e7490; }
.kb-board .pin .ask, .kb-board .pin .passage, .kb-board .pin .then, .kb-board .ln.dim, .kb-board .think { color:var(--board-dim); }
.kb-board .pin .then.why { color:var(--board-ans); }
.kb-board .pin, .kb-mbar { border-bottom-color:var(--board-line); }
.kb-ib:active { background:rgba(0,0,0,.06); }
.kb-board .ln .wrong, .kb-board .q .wrong { color:#c62828; text-decoration-color:rgba(198,40,40,.6); }
.kb-board .pin .q u.hit, .kb-help .history .item.cur .q { color:var(--board-ans); }
.kb-board .pin .q.sec { color:var(--board-text); }
.kb-board .pin .q.sec span.cur { color:var(--board-ans); background:rgba(180,83,9,.12); }
.kb-board .reread { border-color:rgba(0,0,0,.25); color:var(--board-text); }
.kb-help .me .pics img { border-color:rgba(0,0,0,.15); }
.kb-board .history { background:var(--board); color:var(--board-text); }
.kb-board .history .hd { background:rgba(0,0,0,.03); border-bottom-color:var(--board-line); }
.kb-board .history .item { border-bottom-color:var(--board-line); }
.kb-board .history .item .q { color:var(--board-text); }
.kb-board .history .item .r { color:var(--board-dim); } .kb-board .history .item .r.t { color:rgba(28,28,30,.72); }

/* 专项练习·错因薄弱分（家长 10-25：11 类各一个分，越高越薄弱） */
.wk-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:9px; }
.wk { position:relative; padding:10px 11px 11px; border-radius:10px; background:rgba(255,252,243,.92); border:1px solid rgba(168,133,79,.32);
  box-shadow:0 2px 4px rgba(14,33,48,.08); min-width:0; overflow:hidden; }
.wk::before { content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background:var(--wk, #b9ab8c); }
.wk .wn { font-size:13.5px; font-weight:700; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.wk .wv { margin-top:4px; display:flex; align-items:baseline; gap:6px; font-size:26px; font-weight:800; line-height:1.1; color:var(--wk, var(--ink)); }
.wk .wv small { font-size:11.5px; font-weight:600; color:var(--ink3); }
.wk .wbar { margin-top:7px; height:6px; border-radius:3px; background:rgba(168,133,79,.18); overflow:hidden; }
.wk .wbar i { display:block; height:100%; border-radius:3px; background:var(--wk, #b9ab8c); }
.wk.b3 { --wk:#b8473a; } .wk.b2 { --wk:#c97a2b; } .wk.b1 { --wk:#b39226; } .wk.b0 { --wk:#4f8a5b; }



/* 语文满分作文（家长 11-1）：标记颜色只在这里；原文块 .ess-text 课堂上方和批注页同一份 */
.ess-row { display:grid; grid-template-columns:1fr auto; gap:2px 10px; width:100%; text-align:left; font:inherit; color:inherit; cursor:pointer; }
.ess-row b { grid-column:1 / -1; font-size:18px; }
.ess-row .lv { font-weight:700; color:#8a3b22; text-align:right; }
.ess-row .st { font-size:14px; }
.ess-meta { margin:0 2px 10px; font-size:15px; }
.ess-text { white-space:pre-wrap; overflow-wrap:anywhere; font-size:17px; line-height:1.85; }
.ess-text + .ess-text { margin-top:6px; }
.ess-m { color:inherit; border-radius:3px; padding:1px 0; -webkit-box-decoration-break:clone; box-decoration-break:clone; }
.ess-m sup, .ess-text sup { font-size:11px; font-weight:700; margin:0 1px; line-height:0; }
.ess-m.k1 { background:#f7d3ca; } .ess-m.k2 { background:#cbe1f4; } .ess-m.k3 { background:#d2ebce; } .ess-m.k4 { background:#e3d4f3; }
.ess-m.k5 { background:#fbe28d; font-weight:700; } .ess-m.k6 { background:#f4d6a2; }
.ess-notes { margin-top:10px; font-size:15px; line-height:1.65; }
.ess-notes p { margin:4px 0; }
.ess-notes p b { margin-right:6px; }
.ess-n { margin-top:8px; padding-left:9px; border-left:4px solid #b9a67f; }
.ess-n .hd { font-weight:700; }
.ess-n .qt { margin:2px 0; opacity:.82; }
.ess-n.k1 { border-color:#d9705a; } .ess-n.k2 { border-color:#4f8fc7; } .ess-n.k3 { border-color:#5aa654; } .ess-n.k4 { border-color:#9368c9; } .ess-n.k5 { border-color:#d9a916; } .ess-n.k6 { border-color:#d99a3a; }
.ess-p { margin:6px 0; line-height:1.75; }
.ess-good p { margin:8px 0; font-size:18px; font-weight:700; line-height:1.75; }
.ess-hist .item { padding:10px 0; border-bottom:1px solid #d6c4a0; }
.ess-hist .item .q { font-weight:800; }
.ess-hist .item .r { margin-top:4px; font-size:15.5px; line-height:1.65; white-space:pre-line; overflow-wrap:anywhere; }
.kb-board .pin .ess-title { color:var(--board-text); font-weight:700; margin-bottom:4px; }
.kb-board .pin .ess-text { color:var(--board-text); line-height:1.7; }
.kb-board .pin .ess-text.cur { border-left:3px solid var(--board-ans); padding-left:7px; }
.kb-board .pin .ess-ask { color:var(--board-ask); font-weight:600; }
.kb-board .flow .ess-notes { color:var(--board-text); margin:10px 0 14px; }
@media (min-width:900px) { .ess-para { display:grid; grid-template-columns:3fr 2fr; gap:18px; } .ess-para .ess-notes { margin-top:0; } }

/* 错题分类的错题卡片（家长 11-02，六科共用）：编号、排好版的题目、右下“讲解” */
.q-list { display:grid; gap:10px; padding:4px 0 2px; }
.q-card { display:grid; grid-template-columns:28px minmax(0,1fr); gap:10px; align-items:start; width:100%; padding:12px 12px 12px 10px; text-align:left; border-radius:12px; cursor:pointer;
  border:1px solid #e0e6f0; background:linear-gradient(#fff,#f6f8fc); box-shadow:0 2px 0 rgba(160,175,200,.35); color:#16213a; }
.q-no { width:26px; height:26px; margin-top:2px; border-radius:13px; display:grid; place-items:center; font:700 14px/1 var(--font); color:#fff; background:linear-gradient(#3f7bf0,#1d4fd8); }
.q-text { font:400 16px/1.8 var(--font); letter-spacing:.2px; word-break:break-word; min-width:0; }
.q-text p { margin:0; }
.q-text .mq { font-family:"Times New Roman","STIX Two Text",Georgia,serif; font-size:17px; }
.q-text .mq.nw { white-space:nowrap; }
.q-text .mq i { font-style:italic; padding:0 .5px; }
.q-opts { display:grid; gap:2px; margin-top:6px; }
.q-opt { display:grid; grid-template-columns:22px minmax(0,1fr); }
.q-opt .k { font-weight:600; color:#1d4fd8; }
.q-figs { display:flex; flex-wrap:wrap; gap:6px; margin:8px 0 2px; }
.q-figs img { display:block; max-width:100%; max-height:40vh; height:auto; width:auto; border-radius:6px; background:#fff; cursor:zoom-in; }
.q-foot { grid-column:2; display:flex; justify-content:flex-end; margin-top:2px; }
.q-go { min-width:76px; height:34px; padding:0 18px; border:0; border-radius:17px; font:700 15px/1 var(--font); letter-spacing:2px; color:#fff;
  background:linear-gradient(#3f7bf0,#1d4fd8); box-shadow:inset 0 1px 0 rgba(255,255,255,.35), 0 3px 0 #173ea8; }
.q-go:active { transform:translateY(2px); box-shadow:inset 0 1px 0 rgba(255,255,255,.35), 0 1px 0 #173ea8; }